| | |
| | | <template> |
| | | <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> |
| | | <ContentScrollView style="background-color: transparent"> |
| | | <Cell :title="detail.taskName" titleSize="large"> |
| | | <Cell :title="detail.name" titleSize="large"> |
| | | <div class="taskDetail-time"> |
| | | {{ |
| | | `${dayjs(detail.startDate).format('YYYY年MM月DD日')}至${dayjs(detail.endDate).format( |
| | | `${dayjs(detail.beginTime).format('YYYY年MM月DD日')}至${dayjs(detail.endTime).format( |
| | | 'YYYY年MM月DD日' |
| | | )}` |
| | | }} |
| | |
| | | <div class="task-card-welfare-wrapper"> |
| | | <div class="task-card-welfare-list"> |
| | | <div class="task-card-welfare-list-item"> |
| | | {{ FlexTaskSettleTypeEnumText[detail.settleType] }} |
| | | {{ EnumSettlementCycleText[detail.settlementCycle] }} |
| | | </div> |
| | | </div> |
| | | <TaskPrice :value="detail.fee" :unit="SalaryTimeTypeEnumUnit[detail.feeType]" /> |
| | | <TaskPrice |
| | | :value="toThousand(detail.serviceFee ?? 0)" |
| | | :unit="BillingMethodEnumUnit[detail.billingMethod]" |
| | | /> |
| | | </div> |
| | | <div class="taskDetail-address-wrapper"> |
| | | <div class="taskDetail-address-title-wrapper"> |
| | | <img :src="IconLocaltion" class="taskDetail-address-title-icon" /> |
| | | <div class="taskDetail-address-title">宁波柏悦酒店</div> |
| | | <div class="taskDetail-address-title">{{ detail?.addressName ?? '' }}</div> |
| | | </div> |
| | | <div class="taskDetail-address-info-wrapper"> |
| | | <div class="taskDetail-address-info">宁波市鄞州区东钱湖大堰路188号宁波柏悦酒店</div> |
| | | <div class="taskDetail-address-info">{{ detail?.addressDetail ?? '' }}</div> |
| | | <RectRight :size="8" class="taskDetail-address-info-icon" /> |
| | | </div> |
| | | </div> |
| | |
| | | <CellChunk title="福利信息"> |
| | | <div class="taskDetail-welfare-list"> |
| | | <TaskDetailWelfareItem |
| | | v-for="item in detail.taskWeals" |
| | | :key="item.id" |
| | | :icon="setOSSLink(item.imageUrl)" |
| | | :text="item.name" |
| | | v-for="benefit in detail.benefits" |
| | | :key="benefit.benefitCode" |
| | | :icon="setOSSLink(benefit.benefitField2)" |
| | | :text="benefit.benefitContent" |
| | | /> |
| | | </div> |
| | | </CellChunk> |
| | |
| | | <script setup lang="ts"> |
| | | import { useQuery } from '@tanstack/vue-query'; |
| | | import Taro from '@tarojs/taro'; |
| | | import * as flexWorkerServices from '@12333/services/api/FlexWorker'; |
| | | import * as taskServices from '@12333/services/apiV2/task'; |
| | | import IconLocaltion from '@/assets/flexJob/icon-localtion.png'; |
| | | import { TaskPrice, TaskDetailWelfareItem } from '@12333/components'; |
| | | import { SalaryTimeTypeEnumUnit, FlexTaskSettleTypeEnumText } from '@12333/constants/task'; |
| | | import dayjs from 'dayjs'; |
| | | import { setOSSLink } from '@12333/utils'; |
| | | import { setOSSLink, toThousand } from '@12333/utils'; |
| | | import { RectRight } from '@nutui/icons-vue-taro'; |
| | | import { BillingMethodEnumUnit, EnumSettlementCycleText } from '@12333/constants'; |
| | | |
| | | defineOptions({ |
| | | name: 'JobDetail', |
| | |
| | | data: detail, |
| | | refetch, |
| | | } = useQuery({ |
| | | queryKey: ['flexWorkerServices/getFlexTaskDto', taskId], |
| | | queryKey: ['taskServices/getTaskInfo', taskId], |
| | | queryFn: async () => { |
| | | return await flexWorkerServices.getFlexTaskDto( |
| | | return await taskServices.getTaskInfo( |
| | | { id: taskId }, |
| | | { |
| | | showLoading: false, |
| | | } |
| | | ); |
| | | }, |
| | | placeholderData: () => ({} as API.GetFlexTaskDtoOutput), |
| | | onSuccess(data) {}, |
| | | placeholderData: () => ({} as API.GetTaskInfoQueryResult), |
| | | }); |
| | | </script> |
| | | |