<template> 
 | 
  <LoadingLayout> 
 | 
    <ContentView> 
 | 
      <ChunkTitle :title="title" /> 
 | 
    </ContentView> 
 | 
    <ProTabs 
 | 
      v-model="queryState.type" 
 | 
      name="taskUserSubmitCheckHistories-tab" 
 | 
      :showPaneContent="false" 
 | 
      class="taskUserSubmitCheckHistories-tabs" 
 | 
      isTransparent 
 | 
      title-gutter="8" 
 | 
      title-scroll 
 | 
    > 
 | 
      <ProTabPane :title="`全部`" :pane-key="0"></ProTabPane> 
 | 
      <ProTabPane 
 | 
        :title=" 
 | 
          EnumGetCheckReceiveTaskCheckInUsersQueryStatusText[ 
 | 
            EnumGetCheckReceiveTaskCheckInUsersQueryStatus.CheckOut 
 | 
          ] 
 | 
        " 
 | 
        :pane-key="EnumGetCheckReceiveTaskCheckInUsersQueryStatus.CheckOut" 
 | 
      ></ProTabPane> 
 | 
      <ProTabPane 
 | 
        :title=" 
 | 
          EnumGetCheckReceiveTaskCheckInUsersQueryStatusText[ 
 | 
            EnumGetCheckReceiveTaskCheckInUsersQueryStatus.UnCheck 
 | 
          ] 
 | 
        " 
 | 
        :pane-key="EnumGetCheckReceiveTaskCheckInUsersQueryStatus.UnCheck" 
 | 
      ></ProTabPane> 
 | 
    </ProTabs> 
 | 
    <InfiniteLoading 
 | 
      scrollViewClassName="common-infinite-scroll-list" 
 | 
      v-bind="infiniteLoadingProps" 
 | 
    > 
 | 
      <template #renderItem="{ item }"> 
 | 
        <TaskCheckHistoryCard 
 | 
          :avatar="setOSSLink(item.avatar)" 
 | 
          :name="item.name" 
 | 
          :gender="item.gender" 
 | 
          :isReal="item.isReal" 
 | 
          :contactPhoneNumber="item.contactPhoneNumber" 
 | 
          @click="goDetail(item)" 
 | 
        /> 
 | 
      </template> 
 | 
    </InfiniteLoading> 
 | 
  </LoadingLayout> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
import Taro from '@tarojs/taro'; 
 | 
import * as taskCheckReceiveServices from '@12333/services/apiV2/taskCheckReceive'; 
 | 
import { useInfiniteLoading } from '@12333/hooks'; 
 | 
import { ProTabs, ProTabPane, TaskCheckHistoryCard } from '@12333/components'; 
 | 
import { 
 | 
  EnumTaskUserSubmitCheckHistoryTypeText, 
 | 
  EnumTaskUserSubmitCheckHistoryTypeColor, 
 | 
  EnumTaskUserSubmitCheckHistoryType, 
 | 
  WeekCN, 
 | 
  EnumGetCheckReceiveTaskCheckInUsersQueryStatus, 
 | 
  EnumGetCheckReceiveTaskCheckInUsersQueryStatusText, 
 | 
} from '@12333/constants'; 
 | 
import { Message, setOSSLink } from '@12333/utils'; 
 | 
import dayjs from 'dayjs'; 
 | 
  
 | 
defineOptions({ 
 | 
  name: 'InnerPage', 
 | 
}); 
 | 
  
 | 
const router = Taro.useRouter(); 
 | 
const id = router.params?.id ?? ''; 
 | 
const date = router.params?.date ?? ''; 
 | 
  
 | 
const title = `${dayjs(date).format('YYYY年MM月DD日')} 星期${WeekCN[dayjs(date).day()]}`; 
 | 
  
 | 
const queryState = reactive({ 
 | 
  type: 0 as any as EnumGetCheckReceiveTaskCheckInUsersQueryStatus, 
 | 
}); 
 | 
  
 | 
const { infiniteLoadingProps } = useInfiniteLoading( 
 | 
  async ({ pageParam }) => { 
 | 
    let params: API.GetCheckReceiveTaskCheckInUsersQuery = { 
 | 
      pageModel: { 
 | 
        rows: 20, 
 | 
        page: pageParam, 
 | 
      }, 
 | 
      taskInfoId: id, 
 | 
      date: dayjs(date).format('YYYY-MM-DD'), 
 | 
    }; 
 | 
  
 | 
    if (Number(queryState.type) !== 0) { 
 | 
      params.status = queryState.type; 
 | 
    } 
 | 
  
 | 
    let res = await taskCheckReceiveServices.getCheckReceiveTaskCheckInUsers(params, { 
 | 
      showLoading: false, 
 | 
    }); 
 | 
    return res; 
 | 
  }, 
 | 
  { 
 | 
    queryKey: ['taskCheckReceiveServices/getCheckReceiveTaskCheckInUsers', queryState], 
 | 
  } 
 | 
); 
 | 
  
 | 
function goDetail(item: API.GetCheckReceiveTaskCheckInUsersQueryResultItem) { 
 | 
  Taro.navigateTo({ 
 | 
    url: `${RouterPath.taskUserSubmitCheckHistoriesDetail}?id=${id}&date=${date}&taskInfoUserId=${item.id}`, 
 | 
  }); 
 | 
} 
 | 
</script> 
 |