|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <ProTabs | 
|---|
|  |  |  | v-model="queryState.mineAgreementSignType" | 
|---|
|  |  |  | v-model="queryState.userSignContractStatus" | 
|---|
|  |  |  | name="home-tab" | 
|---|
|  |  |  | :showPaneContent="false" | 
|---|
|  |  |  | class="home-tabs" | 
|---|
|  |  |  | 
|---|
|  |  |  | title-scroll | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <ProTabPane :title="`全部`" :pane-key="0"></ProTabPane> | 
|---|
|  |  |  | <ProTabPane :title="`待签约`" :pane-key="10"></ProTabPane> | 
|---|
|  |  |  | <ProTabPane :title="`生效中`" :pane-key="20"></ProTabPane> | 
|---|
|  |  |  | <ProTabPane :title="`已终止`" :pane-key="30"></ProTabPane> | 
|---|
|  |  |  | <ProTabPane :title="`待签约`" :pane-key="EnumTaskUserSignContractStatus.Wait"></ProTabPane> | 
|---|
|  |  |  | <ProTabPane :title="`生效中`" :pane-key="EnumTaskUserSignContractStatus.Pass"></ProTabPane> | 
|---|
|  |  |  | <ProTabPane :title="`已终止`" :pane-key="EnumTaskUserSignContractStatus.Stop"></ProTabPane> | 
|---|
|  |  |  | </ProTabs> | 
|---|
|  |  |  | <InfiniteLoading | 
|---|
|  |  |  | scrollViewClassName="common-infinite-scroll-list home-list" | 
|---|
|  |  |  | v-bind="infiniteLoadingProps" | 
|---|
|  |  |  | :key="queryState.mineAgreementSignType" | 
|---|
|  |  |  | :key="queryState.userSignContractStatus" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <template #renderItem="{ item }"> | 
|---|
|  |  |  | <MineAgreementSignCard @click="goDetail"> | 
|---|
|  |  |  | <template #actions> | 
|---|
|  |  |  | <div class="task-card-actions-text" :style="{ color: TaskStatusColor[10] }"> | 
|---|
|  |  |  | {{ TaskStatusText[10] }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <MineAgreementSignCard | 
|---|
|  |  |  | :enterpriseName="item.enterpriseName" | 
|---|
|  |  |  | :userSignContractStatus="item.userSignContractStatus" | 
|---|
|  |  |  | @click="goDetail(item)" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | </MineAgreementSignCard> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </InfiniteLoading> | 
|---|
|  |  |  | 
|---|
|  |  |  | <script setup lang="ts"> | 
|---|
|  |  |  | import { MineAgreementSignCard, ProTabs, ProTabPane } from '@12333/components'; | 
|---|
|  |  |  | import { useUserStore } from '@/stores/modules/user'; | 
|---|
|  |  |  | import { TaskStatusText, TaskStatusColor, TaskStatus } from '@/constants'; | 
|---|
|  |  |  | import { useInfiniteLoading } from '@12333/hooks'; | 
|---|
|  |  |  | import { OrderInputType } from '@12333/constants'; | 
|---|
|  |  |  | import * as flexWorkerServices from '@12333/services/api/FlexWorker'; | 
|---|
|  |  |  | import { EnumPagedListOrder, EnumTaskUserSignContractStatus } from '@12333/constants'; | 
|---|
|  |  |  | import * as enterpriseEmployeeServices from '@12333/services/apiV2/enterpriseEmployee'; | 
|---|
|  |  |  | import Taro from '@tarojs/taro'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | defineOptions({ | 
|---|
|  |  |  | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const queryState = reactive({ | 
|---|
|  |  |  | mineAgreementSignType: TaskStatus.All, | 
|---|
|  |  |  | userSignContractStatus: 0 as any as EnumTaskUserSignContractStatus, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const userStore = useUserStore(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const { infiniteLoadingProps } = useInfiniteLoading( | 
|---|
|  |  |  | ({ pageParam }) => { | 
|---|
|  |  |  | let params: API.GetFlexTaskListInput = { | 
|---|
|  |  |  | let params: API.GetPersonalUserElectronSignsQuery = { | 
|---|
|  |  |  | pageModel: { | 
|---|
|  |  |  | rows: 20, | 
|---|
|  |  |  | page: pageParam, | 
|---|
|  |  |  | orderInput: [ | 
|---|
|  |  |  | queryState.mineAgreementSignType === TaskStatus.All | 
|---|
|  |  |  | ? { property: 'creationTime', order: OrderInputType.Desc } | 
|---|
|  |  |  | : { property: 'lastShelfTime', order: OrderInputType.Desc }, | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | orderInput: [{ property: 'id', order: EnumPagedListOrder.Desc }], | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | userSignContractStatus: Number(queryState.userSignContractStatus) | 
|---|
|  |  |  | ? queryState.userSignContractStatus | 
|---|
|  |  |  | : null, | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | return flexWorkerServices.getFlexTaskByArrange(params, { | 
|---|
|  |  |  | return enterpriseEmployeeServices.getPersonalUserElectronSigns(params, { | 
|---|
|  |  |  | showLoading: false, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | queryKey: ['flexWorkerServices/getFlexTaskByArrange', queryState], | 
|---|
|  |  |  | queryKey: ['enterpriseEmployeeServices/getPersonalUserElectronSigns', queryState], | 
|---|
|  |  |  | } | 
|---|
|  |  |  | ); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function goDetail() { | 
|---|
|  |  |  | function goDetail(row: API.GetPersonalUserElectronSignsQueryResultItem) { | 
|---|
|  |  |  | Taro.navigateTo({ | 
|---|
|  |  |  | url: RouterPath.mineAgreementSignDetail, | 
|---|
|  |  |  | url: `${RouterPath.mineAgreementSignDetail}?id=${row.id}`, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | 
|---|
|  |  |  | <style lang="scss"> | 
|---|
|  |  |  | @import '@/styles/common.scss'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .mineAgreementSign-page-wrapper { | 
|---|
|  |  |  | .task-card-actions-text { | 
|---|
|  |  |  | font-size: 24px; | 
|---|
|  |  |  | line-height: 42px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // .mineAgreementSign-page-wrapper { | 
|---|
|  |  |  | // | 
|---|
|  |  |  | // } | 
|---|
|  |  |  | </style> | 
|---|