|  |  |  | 
|---|
|  |  |  | <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> | 
|---|
|  |  |  | <ContentScrollView style="background-color: #fff"> | 
|---|
|  |  |  | <div class="personal-info-wrapper"> | 
|---|
|  |  |  | <TaskCheckPersonalView /> | 
|---|
|  |  |  | <TaskCheckPersonalView | 
|---|
|  |  |  | :avatarUrl="setOSSLink(detail?.enterpriseEmployeeUser?.avatar)" | 
|---|
|  |  |  | :name="detail?.enterpriseEmployeeUser?.name" | 
|---|
|  |  |  | :isReal="detail?.enterpriseEmployeeUser?.isReal" | 
|---|
|  |  |  | :contactPhoneNumber="detail?.enterpriseEmployeeUser?.contactPhoneNumber" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="taskCheckDetail-status-wrapper"> | 
|---|
|  |  |  | <div class="taskCheckDetail-status-title">验收照片</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="taskCheckDetail-time">2024.11.14 9:28:39</div> | 
|---|
|  |  |  | <nut-grid | 
|---|
|  |  |  | square | 
|---|
|  |  |  | :column-num="3" | 
|---|
|  |  |  | :border="false" | 
|---|
|  |  |  | :gutter="20" | 
|---|
|  |  |  | v-if="list.length > 0" | 
|---|
|  |  |  | class="pro-img-grid" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <nut-grid-item v-for="(item, index) in list" :key="item" class="pro-img-grid-item"> | 
|---|
|  |  |  | <div class="pro-img-grid-img-item"> | 
|---|
|  |  |  | <PreviewImage :src="item" class="pro-img-grid-img" :urls="list" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </nut-grid-item> | 
|---|
|  |  |  | </nut-grid> | 
|---|
|  |  |  | <div class="taskCheckFileCard-status-title">验收照片</div> | 
|---|
|  |  |  | <TaskCheckFileCard | 
|---|
|  |  |  | :created-time="detail?.createdTime" | 
|---|
|  |  |  | :files="detail?.files?.map((x) => setOSSLink(x))" | 
|---|
|  |  |  | ></TaskCheckFileCard> | 
|---|
|  |  |  | </ContentScrollView> | 
|---|
|  |  |  | <PageFooter> | 
|---|
|  |  |  | <PageFooterBtn type="primary" :color="Colors.Info" class="dark-btn">验收未通过</PageFooterBtn> | 
|---|
|  |  |  | <PageFooterBtn type="primary">验收通过</PageFooterBtn> | 
|---|
|  |  |  | <PageFooterBtn | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | :color="Colors.Info" | 
|---|
|  |  |  | class="dark-btn" | 
|---|
|  |  |  | @click="checkReceiveTask(EnumTaskUserSubmitCheckReceiveStatus.Fail)" | 
|---|
|  |  |  | >验收未通过</PageFooterBtn | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <PageFooterBtn | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | @click="checkReceiveTask(EnumTaskUserSubmitCheckReceiveStatus.Success)" | 
|---|
|  |  |  | >验收通过</PageFooterBtn | 
|---|
|  |  |  | > | 
|---|
|  |  |  | </PageFooter> | 
|---|
|  |  |  | </LoadingLayout> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | 
|---|
|  |  |  | <script setup lang="ts"> | 
|---|
|  |  |  | import Taro from '@tarojs/taro'; | 
|---|
|  |  |  | import { useQuery } from '@tanstack/vue-query'; | 
|---|
|  |  |  | import * as orderServices from '@12333/services/api/Order'; | 
|---|
|  |  |  | import TaskCheckPersonalView from '../components/TaskCheckPersonalView.vue'; | 
|---|
|  |  |  | import { PreviewImage } from '@12333/components'; | 
|---|
|  |  |  | import { Colors } from '@12333/constants'; | 
|---|
|  |  |  | import * as taskCheckReceiveServices from '@12333/services/apiV2/taskCheckReceive'; | 
|---|
|  |  |  | import { TaskCheckFileCard, TaskCheckPersonalView } from '@12333/components'; | 
|---|
|  |  |  | import { Colors, EnumTaskUserSubmitCheckReceiveStatus } from '@12333/constants'; | 
|---|
|  |  |  | import { Message, setOSSLink } from '@12333/utils'; | 
|---|
|  |  |  | import dayjs from 'dayjs'; | 
|---|
|  |  |  | import { goBack } from '@/utils'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | defineOptions({ | 
|---|
|  |  |  | name: 'InnerPage', | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const router = Taro.useRouter(); | 
|---|
|  |  |  | const taskId = router.params?.id ?? ''; | 
|---|
|  |  |  | const id = router.params?.id ?? ''; | 
|---|
|  |  |  | const date = router.params?.date ?? ''; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | isLoading, | 
|---|
|  |  |  | 
|---|
|  |  |  | data: detail, | 
|---|
|  |  |  | refetch, | 
|---|
|  |  |  | } = useQuery({ | 
|---|
|  |  |  | queryKey: ['orderServices/getOrdeForDetail', taskId], | 
|---|
|  |  |  | queryKey: ['taskCheckReceiveServices/getCheckReceiveTaskUserSubmit', id, date], | 
|---|
|  |  |  | queryFn: async () => { | 
|---|
|  |  |  | return await orderServices.getOrdeForDetail( | 
|---|
|  |  |  | { id: taskId }, | 
|---|
|  |  |  | return await taskCheckReceiveServices.getCheckReceiveTaskUserSubmit( | 
|---|
|  |  |  | { taskInfoUserId: id, date: dayjs(date).format('YYYY-MM-DD') }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | showLoading: false, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | ); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | placeholderData: () => ({} as API.OrderInfoDto), | 
|---|
|  |  |  | placeholderData: () => ({} as API.GetCheckReceiveTaskUserSubmitQueryResult), | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const list = ref([ | 
|---|
|  |  |  | 'https://storage.360buyimg.com/jdc-article/NutUItaro34.jpg', | 
|---|
|  |  |  | 'https://storage.360buyimg.com/jdc-article/NutUItaro2.jpg', | 
|---|
|  |  |  | 'https://storage.360buyimg.com/jdc-article/welcomenutui.jpg', | 
|---|
|  |  |  | 'https://storage.360buyimg.com/jdc-article/fristfabu.jpg', | 
|---|
|  |  |  | ]); | 
|---|
|  |  |  | async function checkReceiveTask(checkReceiveStatus: EnumTaskUserSubmitCheckReceiveStatus) { | 
|---|
|  |  |  | try { | 
|---|
|  |  |  | let params: API.CheckReceiveTaskCommand = { | 
|---|
|  |  |  | id: detail.value?.id, | 
|---|
|  |  |  | checkReceiveStatus: checkReceiveStatus, | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | let res = await taskCheckReceiveServices.checkReceiveTask(params); | 
|---|
|  |  |  | if (res) { | 
|---|
|  |  |  | Message.success('提交成功', { | 
|---|
|  |  |  | onClosed() { | 
|---|
|  |  |  | goBack(); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } catch (error) {} | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style lang="scss"> | 
|---|
|  |  |  | @import '@/styles/common.scss'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .taskHandleCheckDetail-page-wrapper { | 
|---|
|  |  |  | .personal-info-wrapper { | 
|---|
|  |  |  | padding-top: 52px; | 
|---|
|  |  |  | padding-bottom: 36px; | 
|---|
|  |  |  | border-bottom: 1px solid #d9d9d9; | 
|---|
|  |  |  | margin-bottom: 22px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .taskCheckDetail-status-wrapper { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | .taskCheckFileCard-status-title { | 
|---|
|  |  |  | font-weight: 600; | 
|---|
|  |  |  | font-size: 28px; | 
|---|
|  |  |  | line-height: 32px; | 
|---|
|  |  |  | margin-bottom: 16px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .taskCheckDetail-status-title { | 
|---|
|  |  |  | color: boleGetCssVar('text-color', 'primary'); | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  | min-width: 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | color: boleGetCssVar('text-color', 'primary'); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .taskCheckDetail-time { | 
|---|
|  |  |  | font-weight: 400; | 
|---|
|  |  |  | font-size: 24px; | 
|---|
|  |  |  | color: boleGetCssVar('text-color', 'regular'); | 
|---|
|  |  |  | line-height: 36px; | 
|---|
|  |  |  | .personal-info-wrapper { | 
|---|
|  |  |  | padding-top: 52px; | 
|---|
|  |  |  | padding-bottom: 36px; | 
|---|
|  |  |  | border-bottom: 1px solid #d9d9d9; | 
|---|
|  |  |  | margin-bottom: 22px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|