<template> 
 | 
  <PageLayoutWithBg class="flexJobDetail-page-wrapper" title="灵工详情" :need-auth="false"> 
 | 
    <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> 
 | 
      <JobDetailContent :isCollapse="isCollapse"> 
 | 
        <template #footer> 
 | 
          <PageFooterAction 
 | 
            :icon="IconShare" 
 | 
            text="分享" 
 | 
            :isFlex="false" 
 | 
            openType="share" 
 | 
          ></PageFooterAction> 
 | 
          <PageFooterAction 
 | 
            :icon="IconAttentionActive" 
 | 
            text="收藏" 
 | 
            :isFlex="false" 
 | 
            @click="handleAttention" 
 | 
          ></PageFooterAction> 
 | 
          <PageFooterBtn type="primary" @click="toggle">立即联系</PageFooterBtn> 
 | 
        </template> 
 | 
      </JobDetailContent> 
 | 
    </LoadingLayout> 
 | 
  </PageLayoutWithBg> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
import Taro from '@tarojs/taro'; 
 | 
import { useQuery } from '@tanstack/vue-query'; 
 | 
import * as flexWorkerServices from '@12333/services/api/FlexWorker'; 
 | 
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'; 
 | 
  
 | 
defineOptions({ 
 | 
  name: 'flexJobDetail', 
 | 
}); 
 | 
  
 | 
const router = Taro.useRouter(); 
 | 
const taskId = router.params?.id ?? ''; 
 | 
  
 | 
const { 
 | 
  isLoading, 
 | 
  isError, 
 | 
  data: detail, 
 | 
  refetch, 
 | 
} = useQuery({ 
 | 
  queryKey: ['flexWorkerServices/getOrdeForDetail', taskId], 
 | 
  queryFn: async () => { 
 | 
    return await flexWorkerServices.getOrdeForDetail( 
 | 
      { id: taskId }, 
 | 
      { 
 | 
        showLoading: false, 
 | 
      } 
 | 
    ); 
 | 
  }, 
 | 
  placeholderData: () => ({} as API.OrderInfoDto), 
 | 
}); 
 | 
  
 | 
const { isCollapse, toggle } = useToggle(); 
 | 
  
 | 
async function handleAttention() { 
 | 
  try { 
 | 
    let params: API.CollectFlexWorkerResumeInput = { 
 | 
      flexWorkerId: detail.value?.flexWorkerId, 
 | 
      userResumeId: detail.value?.userResumeId, 
 | 
    }; 
 | 
    let res = await flexWorkerServices.collectFlexWorkerResume(params); 
 | 
    if (res) { 
 | 
      Message.success('收藏成功'); 
 | 
    } 
 | 
  } catch (error) {} 
 | 
} 
 | 
</script> 
 | 
  
 | 
<style lang="scss"> 
 | 
@import '@/styles/common.scss'; 
 | 
</style> 
 |