<template> 
 | 
  <PageLayoutWithBg class="flexJobDetail-page-wrapper" title="灵工详情" :need-auth="false"> 
 | 
    <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> 
 | 
      <JobDetailContent 
 | 
        :avatar="userResumeInfo.avatar" 
 | 
        :name="userResumeInfo.name" 
 | 
        :age="userResumeInfo.age" 
 | 
        :isReal="userResumeInfo.isReal" 
 | 
        :gender="userResumeInfo.gender" 
 | 
        :personalIdentityContent="userResumeInfo.personalIdentityContent" 
 | 
        :educationalBackgroundContent="userResumeInfo.educationalBackgroundContent" 
 | 
        :taskCount="userResumeInfo.taskCount" 
 | 
        :contactPhoneNumber="userResumeInfo.contactPhoneNumber" 
 | 
        :identity="userResumeInfo.identity" 
 | 
        :isCollapse="isCollapse" 
 | 
        :userExpectJobs="userResumeInfo.userExpectJobs" 
 | 
        :freeTime="userResumeInfo.freeTime" 
 | 
        :jobSeekingStatus="userResumeInfo.jobSeekingStatus" 
 | 
        :userCredentials="userResumeInfo.userCredentials" 
 | 
        :workSeniority="userResumeInfo.workSeniority" 
 | 
        :workExperience="userResumeInfo.workExperience" 
 | 
        :photos="userResumeInfo.photos" 
 | 
        :height="userResumeInfo.height" 
 | 
        :weight="userResumeInfo.weight" 
 | 
        :shoeSize="userResumeInfo.shoeSize" 
 | 
        :videos="userResumeInfo.videos" 
 | 
        :taskInfoUsers="userResumeInfo.taskInfoUsers" 
 | 
      > 
 | 
        <template #footer> 
 | 
          <PageFooterAction 
 | 
            :icon="IconShare" 
 | 
            text="分享" 
 | 
            :isFlex="false" 
 | 
            openType="share" 
 | 
          ></PageFooterAction> 
 | 
          <PageFooterAction 
 | 
            :icon="userResumeInfo.isCollected ? IconAttentionActive : IconAttention" 
 | 
            text="收藏" 
 | 
            :isFlex="false" 
 | 
            @click="handleAttention" 
 | 
          ></PageFooterAction> 
 | 
          <PageFooterBtn type="primary" @click="handleContact">立即联系</PageFooterBtn> 
 | 
        </template> 
 | 
      </JobDetailContent> 
 | 
    </LoadingLayout> 
 | 
  </PageLayoutWithBg> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
import Taro from '@tarojs/taro'; 
 | 
import { useQuery } from '@tanstack/vue-query'; 
 | 
import * as userResumeServices from '@12333/services/apiV2/userResume'; 
 | 
import IconShare from '@/assets/flexJob/icon-share.png'; 
 | 
import IconAttention from '@/assets/flexJob/icon-attention-lg.png'; 
 | 
import IconAttentionActive from '@/assets/flexJob/icon-attention-lg-active.png'; 
 | 
import { useToggle } from 'senin-mini/hooks'; 
 | 
import { Message } from '@12333/utils'; 
 | 
import { useUserResume } from '@12333/hooks'; 
 | 
import { useAccessLogin } from '@/hooks'; 
 | 
  
 | 
defineOptions({ 
 | 
  name: 'flexJobDetail', 
 | 
}); 
 | 
  
 | 
const router = Taro.useRouter(); 
 | 
const userId = router.params?.userId ?? ''; 
 | 
  
 | 
const { isLoading, isError, userResumeInfo, refetch } = useUserResume({ 
 | 
  userId: userId, 
 | 
}); 
 | 
  
 | 
const { isCollapse, toggle } = useToggle(); 
 | 
  
 | 
const handleContact = useAccessLogin(async () => { 
 | 
  try { 
 | 
    if (!isCollapse.value) { 
 | 
      await userResumeServices.contactUserResume({ id: userId }); 
 | 
      toggle(); 
 | 
    } else { 
 | 
      Taro.makePhoneCall({ 
 | 
        phoneNumber: userResumeInfo.value.contactPhoneNumber, 
 | 
      }); 
 | 
    } 
 | 
  } catch (error) {} 
 | 
}); 
 | 
  
 | 
async function handleAttention() { 
 | 
  try { 
 | 
    let params: API.CollectUserResumeCommand = { 
 | 
      id: userId, 
 | 
      isCollected: !userResumeInfo.value.isCollected, 
 | 
    }; 
 | 
    let res = await userResumeServices.collectUserResume(params); 
 | 
    if (res) { 
 | 
      refetch({ type: 'inactive' }); 
 | 
    } 
 | 
  } catch (error) {} 
 | 
} 
 | 
</script> 
 |