<template> 
 | 
  <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> 
 | 
    <BusinessCardDetailInfoView> 
 | 
      <template #actions> 
 | 
        <nut-button 
 | 
          class="business-card-detail-info-edit-button" 
 | 
          type="primary" 
 | 
          @click="goEditBusinessCard" 
 | 
          >编辑</nut-button 
 | 
        > 
 | 
      </template> 
 | 
    </BusinessCardDetailInfoView> 
 | 
    <PageFooter> 
 | 
      <PageFooterBtn type="primary" class="business-card-btn">递名片</PageFooterBtn> 
 | 
    </PageFooter> 
 | 
  </LoadingLayout> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
import { useQuery } from '@tanstack/vue-query'; 
 | 
import Taro from '@tarojs/taro'; 
 | 
import * as flexWorkerServices from '@12333/services/api/FlexWorker'; 
 | 
import BusinessCardDetailInfoView from './BusinessCardDetailInfoView.vue'; 
 | 
  
 | 
defineOptions({ 
 | 
  name: 'BusinessCardView', 
 | 
}); 
 | 
  
 | 
const router = Taro.useRouter(); 
 | 
  
 | 
const id = router.params?.id; 
 | 
  
 | 
const { 
 | 
  isLoading, 
 | 
  isError, 
 | 
  data: detail, 
 | 
  refetch, 
 | 
} = useQuery({ 
 | 
  queryKey: ['flexWorkerServices/getFlexTaskDto', id], 
 | 
  queryFn: async () => { 
 | 
    return await flexWorkerServices.getFlexTaskDto( 
 | 
      { id: id }, 
 | 
      { 
 | 
        showLoading: false, 
 | 
      } 
 | 
    ); 
 | 
  }, 
 | 
  placeholderData: () => ({} as API.GetFlexTaskDtoOutput), 
 | 
  onSuccess(data) {}, 
 | 
}); 
 | 
  
 | 
function goEditBusinessCard() { 
 | 
  Taro.navigateTo({ 
 | 
    url: `${RouterPath.businessCardEdit}?id=${id}`, 
 | 
  }); 
 | 
} 
 | 
</script> 
 | 
  
 | 
<style lang="scss"> 
 | 
@import '@/styles/common.scss'; 
 | 
  
 | 
.business-card-detail-info-edit-button { 
 | 
  height: 52px; 
 | 
} 
 | 
</style> 
 |