From 286f1b727856d6b32a8d237f353ae008f3076deb Mon Sep 17 00:00:00 2001 From: wupengfei <834520024@qq.com> Date: 星期二, 11 三月 2025 17:48:15 +0800 Subject: [PATCH] feat: 接口对接 --- apps/bMiniApp/src/subpackages/jobApplicationManage/components/JobDetail.vue | 129 +++++++++++++++++++++++++++++++++++++----- 1 files changed, 113 insertions(+), 16 deletions(-) diff --git a/apps/bMiniApp/src/subpackages/jobApplicationManage/components/JobDetail.vue b/apps/bMiniApp/src/subpackages/jobApplicationManage/components/JobDetail.vue index c2ff4ee..ceb504a 100644 --- a/apps/bMiniApp/src/subpackages/jobApplicationManage/components/JobDetail.vue +++ b/apps/bMiniApp/src/subpackages/jobApplicationManage/components/JobDetail.vue @@ -1,15 +1,21 @@ <template> <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> <ContentScrollView style="background-color: transparent"> - <Cell :title="'瀹㈡埧鏈嶅姟鍛�'" titleSize="large"> - <div class="taskDetail-time">2025骞�2鏈�5鏃� 鑷� 2025骞�3鏈�5鏃�</div> + <Cell :title="detail.taskName" titleSize="large"> + <div class="taskDetail-time"> + {{ + `${dayjs(detail.startDate).format('YYYY骞碝M鏈圖D鏃�')}鑷�${dayjs(detail.endDate).format( + 'YYYY骞碝M鏈圖D鏃�' + )}` + }} + </div> <div class="task-card-welfare-wrapper"> <div class="task-card-welfare-list"> - <div class="task-card-welfare-list-item">鏃ョ粨</div> - <div class="task-card-welfare-list-item">鐢峰コ涓嶉檺</div> - <div class="task-card-welfare-list-item">鍖呬笁椁�</div> + <div class="task-card-welfare-list-item"> + {{ FlexTaskSettleTypeEnumText[detail.settleType] }} + </div> </div> - <TaskPrice :value="212" /> + <TaskPrice :value="detail.fee" :unit="SalaryTimeTypeEnumUnit[detail.feeType]" /> </div> <div class="taskDetail-address-wrapper"> <div class="taskDetail-address-title-wrapper"> @@ -25,11 +31,12 @@ <Cell :show-title="false"> <CellChunk title="绂忓埄淇℃伅"> <div class="taskDetail-welfare-list"> - <TaskDetailWelfareItem :icon="IconLocaltion" text="楂樻俯琛ヨ创" /> - <TaskDetailWelfareItem :icon="IconLocaltion" text="楂樻俯琛ヨ创" /> - <TaskDetailWelfareItem :icon="IconLocaltion" text="楂樻俯琛ヨ创" /> - <TaskDetailWelfareItem :icon="IconLocaltion" text="楂樻俯琛ヨ创" /> - <TaskDetailWelfareItem :icon="IconLocaltion" text="楂樻俯琛ヨ创" /> + <TaskDetailWelfareItem + v-for="item in detail.taskWeals" + :key="item.id" + :icon="setOSSLink(item.name)" + :text="item.name" + /> </div> </CellChunk> </Cell> @@ -40,9 +47,12 @@ <script setup lang="ts"> import { useQuery } from '@tanstack/vue-query'; import Taro from '@tarojs/taro'; -import * as orderServices from '@12333/services/api/Order'; +import * as flexWorkerServices from '@12333/services/api/FlexWorker'; import IconLocaltion from '@/assets/flexJob/icon-localtion.png'; import { TaskPrice, TaskDetailWelfareItem } from '@12333/components'; +import { SalaryTimeTypeEnumUnit, FlexTaskSettleTypeEnumText } from '@/constants/task'; +import dayjs from 'dayjs'; +import { setOSSLink } from '@12333/utils'; defineOptions({ name: 'JobDetail', @@ -53,7 +63,7 @@ // const props = withDefaults(defineProps<Props>(), {}); const router = Taro.useRouter(); -const taskId = router.params?.id ?? ''; +const taskId = router.params?.taskId; const { isLoading, @@ -61,20 +71,107 @@ data: detail, refetch, } = useQuery({ - queryKey: ['orderServices/getOrdeForDetail', taskId], + queryKey: ['flexWorkerServices/getFlexTaskDto', taskId], queryFn: async () => { - return await orderServices.getOrdeForDetail( + return await flexWorkerServices.getFlexTaskDto( { id: taskId }, { showLoading: false, } ); }, - placeholderData: () => ({} as API.OrderInfoDto), + placeholderData: () => ({} as API.GetFlexTaskDtoOutput), onSuccess(data) {}, }); </script> <style lang="scss"> @import '@/styles/common.scss'; + +.jobApplicationDetail-page-wrapper { + .taskDetail-time { + font-size: 24px; + color: boleGetCssVar('text-color', 'regular'); + line-height: 36px; + margin-bottom: 16px; + } + + .task-card-welfare-wrapper { + display: flex; + align-items: flex-start; + padding-bottom: 48px; + border-bottom: 1px solid #d9d9d9; + margin-bottom: 12px; + + .task-card-welfare-list { + flex: 1; + display: flex; + min-width: 0; + flex-wrap: wrap; + min-height: 40px; + row-gap: 6px; + column-gap: 18px; + margin-right: 10px; + + .task-card-welfare-list-item { + font-size: 24px; + color: #ff7d00; + line-height: 36px; + } + } + } + + .taskDetail-address-wrapper { + padding: 28px 32px 14px; + background: #f9fbff; + border-radius: 8px; + + .taskDetail-address-title-wrapper { + display: flex; + align-items: center; + margin-bottom: 22px; + + .taskDetail-address-title-icon { + width: 40px; + height: 40px; + margin-right: 8px; + } + + .taskDetail-address-title { + flex: 1; + min-width: 0; + @include ellipsis; + font-size: 28px; + color: boleGetCssVar('text-color', 'primary'); + line-height: 42px; + } + } + + .taskDetail-address-info-wrapper { + display: flex; + align-items: center; + + .taskDetail-address-info { + flex: 1; + min-width: 0; + @include ellipsis; + font-weight: 400; + font-size: 24px; + color: boleGetCssVar('text-color', 'regular'); + line-height: 36px; + } + + .taskDetail-address-info-icon { + color: boleGetCssVar('text-color', 'secondary'); + margin-left: 10px; + } + } + } + + .taskDetail-welfare-list { + display: flex; + flex-wrap: wrap; + row-gap: 24px; + } +} </style> -- Gitblit v1.9.1