|  |  | 
 |  |  | <template> | 
 |  |  |   <Calendar v-model="queryState.date"></Calendar> | 
 |  |  |   <ProTabs | 
 |  |  |     v-model="queryState.status" | 
 |  |  |     v-model="queryState.checkReceiveStatus" | 
 |  |  |     name="task-tab" | 
 |  |  |     :showPaneContent="false" | 
 |  |  |     class="task-tabs" | 
 |  |  | 
 |  |  |     title-gutter="8" | 
 |  |  |     title-scroll | 
 |  |  |   > | 
 |  |  |     <ProTabPane :title="`待验收`" :pane-key="10"></ProTabPane> | 
 |  |  |     <ProTabPane :title="`已验收`" :pane-key="20"></ProTabPane> | 
 |  |  |     <ProTabPane :title="`待提交`" :pane-key="EnumTaskCheckReceiveStatus.WaitSubmit"></ProTabPane> | 
 |  |  |     <ProTabPane | 
 |  |  |       :title="`待验收`" | 
 |  |  |       :pane-key="EnumTaskCheckReceiveStatus.WaitCheckReceive" | 
 |  |  |     ></ProTabPane> | 
 |  |  |     <ProTabPane :title="`已验收`" :pane-key="EnumTaskCheckReceiveStatus.Completed"></ProTabPane> | 
 |  |  |   </ProTabs> | 
 |  |  |   <InfiniteLoading | 
 |  |  |     scrollViewClassName="common-infinite-scroll-list" | 
 |  |  |     v-bind="infiniteLoadingProps" | 
 |  |  |     :key="queryState.status" | 
 |  |  |     :key="queryState.checkReceiveStatus" | 
 |  |  |   > | 
 |  |  |     <template #renderItem="{ item }"> | 
 |  |  |       <MyTaskCard @click="goSubmitTaskDetail(item)" /> | 
 |  |  |       <MyTaskCard | 
 |  |  |         :name="item.name" | 
 |  |  |         :beginTime="item.beginTime" | 
 |  |  |         :endTime="item.endTime" | 
 |  |  |         :addressName="item.addressName" | 
 |  |  |         @click="goSubmitTaskDetail(item)" | 
 |  |  |       /> | 
 |  |  |     </template> | 
 |  |  |   </InfiniteLoading> | 
 |  |  | </template> | 
 |  |  | 
 |  |  | <script setup lang="ts"> | 
 |  |  | import { MyTaskCard, ProTabs, ProTabPane, Calendar } from '@12333/components'; | 
 |  |  | import Taro from '@tarojs/taro'; | 
 |  |  | import { useInfiniteLoading } from '@12333/hooks'; | 
 |  |  | import { OrderInputType } from '@12333/constants'; | 
 |  |  | import * as flexWorkerServices from '@12333/services/api/FlexWorker'; | 
 |  |  | import { EnumTaskCheckReceiveStatus } from '@12333/constants'; | 
 |  |  | import { useCheckReceiveTasks } from '@12333/hooks'; | 
 |  |  |  | 
 |  |  | defineOptions({ | 
 |  |  |   name: 'InnerPage', | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | const queryState = reactive({ | 
 |  |  |   status: 10, | 
 |  |  |   date: new Date(), | 
 |  |  | }); | 
 |  |  | const { queryState, infiniteLoadingProps } = useCheckReceiveTasks(); | 
 |  |  |  | 
 |  |  | const { infiniteLoadingProps } = useInfiniteLoading( | 
 |  |  |   ({ pageParam }) => { | 
 |  |  |     let params: API.GetFlexTaskListInput = { | 
 |  |  |       pageModel: { | 
 |  |  |         rows: 20, | 
 |  |  |         page: pageParam, | 
 |  |  |         orderInput: [{ property: 'lastShelfTime', order: OrderInputType.Desc }], | 
 |  |  |       }, | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     return flexWorkerServices.getFlexTaskByArrange(params, { | 
 |  |  |       showLoading: false, | 
 |  |  |     }); | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     queryKey: ['flexWorkerServices/getFlexTaskByArrange', queryState], | 
 |  |  |   } | 
 |  |  | ); | 
 |  |  |  | 
 |  |  | function goSubmitTaskDetail(item: API.GetFlexTaskListOutput) { | 
 |  |  | function goSubmitTaskDetail(item: API.GetCheckReceiveTasksQueryResultItem) { | 
 |  |  |   Taro.navigateTo({ | 
 |  |  |     url: `${RouterPath.taskCheckDetail}?id=${item.id}`, | 
 |  |  |     url: `${RouterPath.taskCheckDetail}?id=${item.id}&date=${queryState.date}&checkReceiveStatus=${queryState.checkReceiveStatus}`, | 
 |  |  |   }); | 
 |  |  | } | 
 |  |  | </script> |