工时管理页面完善

src/api/system.js

@@ -8,12 +8,12 @@ export const customerListApi = (data) =>
   });
 export const customerEditApi = (data) => {
   if (data.id) {
-    request({
+    return request({
       url: '/api/system/customer/edit',
       data,
     });
   } else {
-    request({
+    return request({
       url: '/api/system/customer/add',
       data,
     });
@@ -33,12 +33,12 @@ export const supplierListApi = (data) =>
   });
 export const supplierEditApi = (data) => {
   if (data.id) {
-    request({
+    return request({
       url: '/api/system/supplier/edit',
       data,
     });
   } else {
-    request({
+    return request({
       url: '/api/system/supplier/add',
       data,
     });
@@ -58,12 +58,12 @@ export const deviceListApi = (data) =>
   });
 export const deviceEditApi = (data) => {
   if (data.id) {
-    request({
+    return request({
       url: '/api/system/device/edit',
       data,
     });
   } else {
-    request({
+    return request({
       url: '/api/system/device/add',
       data,
     });
@@ -83,12 +83,12 @@ export const serviceLevelListApi = (data) =>
   });
 export const serviceLevelEditApi = (data) => {
   if (data.id) {
-    request({
+    return request({
       url: '/api/system/service-level/edit',
       data,
     });
   } else {
-    request({
+    return request({
       url: '/api/system/service-level/add',
       data,
     });
@@ -108,12 +108,12 @@ export const checkinListApi = (data) =>
   });
 export const checkinEditApi = (data) => {
   if (data.id) {
-    request({
+    return request({
       url: '/api/system/checkin/edit',
       data,
     });
   } else {
-    request({
+    return request({
       url: '/api/system/checkin/add',
       data,
     });
@@ -140,12 +140,12 @@ export const noticeListApi = (data) =>
   });
 export const noticeEditApi = (data) => {
   if (data.id) {
-    request({
+    return request({
       url: '/api/system/notice/edit',
       data,
     });
   } else {
-    request({
+    return request({
       url: '/api/system/notice/add',
       data,
     });

src/api/work-hours.js

@@ -0,0 +1,65 @@
+import { request } from '@/utils/request.js';
+
+// abnormal-check
+export const workHoursWaitCheckListApi = (data) =>
+  request({
+    url: '/api/system/work-hourse/wait-check/list',
+    data,
+  });
+export const workHoursDoneCheckListApi = (data) =>
+  request({
+    url: '/api/system/work-hourse/done-check/list',
+    data,
+  });
+export const workHoursWaitCheckAuditApi = (ids, pass) => {
+  if (pass) {
+    return request({
+      url: '/api/system/work-hourse/wait-check/pass',
+      data: { ids },
+    });
+  } else {
+    return request({
+      url: '/api/system/work-hourse/wait-check/refuse',
+      data: { ids },
+    });
+  }
+};
+
+// work-attendance
+export const workAttendanceListApi = (data) =>
+  request({
+    url: '/api/system/work-attendance/list',
+    data,
+  });
+export const workAttendanceSubmitApi = (ids) =>
+  request({
+    url: '/api/system/work-attendance/submit',
+    data: { ids },
+  });
+export const workAttendanceWithdrawApi = (id) =>
+  request({
+    url: '/api/system/work-attendance/withdraw',
+    data: { id },
+  });
+export const workAttendanceCancelWithdrawApi = (id) =>
+  request({
+    url: '/api/system/work-attendance/withdraw-cancel',
+    data: { id },
+  });
+
+// work-statistics
+export const workStatisticsListApi = (data) =>
+  request({
+    url: '/api/system/work-statistics/list',
+    data,
+  });
+export const workStatisticsInfoApi = (data) =>
+  request({
+    url: '/api/system/work-statistics/info',
+    data,
+  });
+export const workStatisticsPassApi = (id) =>
+  request({
+    url: '/api/system/work-statistics/pass',
+    data: { id },
+  });

src/hooks/useFetchTable.js

@@ -37,6 +37,15 @@ export default function useFetchTable(apiFn, options = {}, immediately = true) {
       console.warn('分页请求错误：', err);
     }
   };
+
+  const search = () => {
+    if (pagination.page === 1) {
+      fetchData();
+    } else {
+      pagination.page = 1;
+    }
+  };
+
   if (immediately) {
     //默认立即执行一次分页请求，如果不想如此，可以将第三个参数immediately传false
     fetchData();
@@ -53,6 +62,7 @@ export default function useFetchTable(apiFn, options = {}, immediately = true) {
     pagination,
     tableData,
     fetchData,
+    search,
     onChange,
     onPageSizeChange,
   };

src/mock/index.js

@@ -429,26 +429,33 @@ export const editApi = Mock.mock('/api/edit', 'post', (data) => {
 });
 
 //模拟一个分页请求
-export const tableApi = Mock.mock('/api/table', 'post', (data) => {
-  return {
-    // list: [],
-    list: [
-      {
-        a: '1',
-        b: '2',
-        c: [],
-        d: '4',
-        e: '5',
-        f: '6',
-        g: '7',
-        h: '8',
-        i: '9',
-        j: '10',
-        k: [],
-        l: '12',
-        m: '13',
-      },
-    ],
-    total: 80,
-  };
+const listTemplate = {
+  'list|10': [
+    {
+      'id|+1': 1,
+      'a|1-3': '11',
+      'b|1-3': '22',
+      'c|1-3': '33',
+      'd|1-3': '44',
+      'e|1-3': '55',
+      'f|1-3': '66',
+      'g|1-3': '77',
+      'h|1-3': '88',
+      'i|1-3': '99',
+      'j|1-3': '11',
+      'k|1-3': '22',
+      'l|1-3': '33',
+      'm|1-3': '44',
+      'n|1-3': '55',
+      'o|1-3': '66',
+      'p|1-3': '77',
+      'q|1-3': '88',
+    },
+  ],
+  'total': 80,
+};
+export const tableApi = Mock.mock('/api/table', 'post', listTemplate);
+export const dataListApi = Mock.mock(/\/api\/.*\/list$/, 'post', listTemplate);
+export const actionApi = Mock.mock(/\/api\/.*/, 'post', {
+  ok: true,
 });

src/mock/system.js

@@ -1,179 +1,95 @@
 import Mock from 'mockjs';
 
+const getListTemplate = (fields) => {
+  let item = {};
+  Object.keys(fields).forEach((k, index) => {
+    const n = (index % 10) + '';
+    item[`${k}|1-3`] = n.repeat(2);
+  });
+
+  return {
+    'list|10': [
+      {
+        'id|+1': 1,
+        ...item,
+      },
+    ],
+    'total': 80,
+  };
+};
+
 // system customer manage
 export const customerListApi = Mock.mock(
   '/api/system/customer/list',
   'post',
-  (data) => {
-    return {
-      // list: [],
-      list: [
-        {
-          id: '1',
-          name: '1122',
-          type: '333',
-          province: '4',
-          city: '5',
-          area: '6',
-          address: '7',
-          manager: '8',
-          serviceName: '9',
-          roles: '10',
-          k: 12,
-          l: '12',
-          m: '13',
-        },
-      ],
-      total: 70,
-    };
-  }
+  getListTemplate({
+    name: '1122',
+    type: '333',
+    province: '4',
+    city: '5',
+    area: '6',
+    address: '7',
+    manager: '8',
+    serviceName: '9',
+    roles: '10',
+    k: 12,
+    l: '12',
+    m: '13',
+  })
 );
 // supplier customer manage
 export const supplierListApi = Mock.mock(
   '/api/system/supplier/list',
   'post',
-  (data) => {
-    return {
-      // list: [],
-      list: [
-        {
-          id: '1',
-          code: '22',
-          name: '33',
-          type: '44',
-          remark: '55',
-          enable: true,
-        },
-      ],
-      total: 70,
-    };
-  }
+  getListTemplate({
+    code: '22',
+    name: '33',
+    type: '44',
+    remark: '55',
+    enable: true,
+  })
 );
 // device customer manage
 export const deviceListApi = Mock.mock(
   '/api/system/device/list',
   'post',
-  (data) => {
-    return {
-      // list: [],
-      list: [
-        {
-          id: '1',
-          code: '22',
-          serialNo: '33',
-          brand: '44',
-          buyTime: '55',
-          supllier: '66',
-          status: '77',
-          location: '88',
-          scanCount: '99',
-        },
-      ],
-      total: 70,
-    };
-  }
+  getListTemplate({
+    code: '22',
+    serialNo: '33',
+    brand: '44',
+    buyTime: '55',
+    supllier: '66',
+    status: '77',
+    location: '88',
+    scanCount: '99',
+  })
 );
 // service-level manage
 export const serviceLevelListApi = Mock.mock(
   '/api/system/service-level/list',
   'post',
-  (data) => {
-    return {
-      list: [
-        {
-          id: '1',
-          name: '11',
-          businessType: '22',
-          roles: [],
-          creator: '44',
-          createdTime: '',
-        },
-      ],
-      total: 70,
-    };
-  }
+  getListTemplate({
+    name: '11',
+    businessType: '22',
+    roles: [],
+    creator: '44',
+    createdTime: '',
+  })
 );
 // checkin customer manage
 export const checkinListApi = Mock.mock(
   '/api/system/checkin/list',
   'post',
-  (data) => {
-    return {
-      list: [
-        {
-          id: '1',
-          unit: '11',
-          status: '22',
-          name: '33',
-          to: [],
-          supplier: '44',
-          checkinTime: [55],
-          checkoutTime: [66],
-          auditRoles: [77],
-          openFace: false,
-          backupCount: 2,
-        },
-      ],
-      total: 70,
-    };
-  }
-);
-
-// log customer manage
-export const logListApi = Mock.mock('/api/system/log/list', 'post', (data) => {
-  return {
-    // list: [],
-    list: [
-      {
-        id: '1',
-        a: '1122',
-        b: '333',
-        c: '4',
-      },
-      {
-        id: '2',
-        a: '1122',
-        b: '333',
-        c: '4',
-      },
-      {
-        id: '3',
-        a: '1122',
-        b: '333',
-        c: '4',
-      },
-    ],
-    total: 70,
-  };
-});
-// notice customer manage
-export const noticeListApi = Mock.mock(
-  '/api/system/notice/list',
-  'post',
-  (data) => {
-    return {
-      // list: [],
-      list: [
-        {
-          id: '1',
-          a: '1122',
-          b: '333',
-          c: '4',
-        },
-        {
-          id: '2',
-          a: '1122',
-          b: '333',
-          c: '4',
-        },
-        {
-          id: '3',
-          a: '1122',
-          b: '333',
-          c: '4',
-        },
-      ],
-      total: 70,
-    };
-  }
+  getListTemplate({
+    unit: '11',
+    status: '22',
+    name: '33',
+    to: [],
+    supplier: '44',
+    checkinTime: [55],
+    checkoutTime: [66],
+    auditRoles: [77],
+    openFace: false,
+    backupCount: 2,
+  })
 );

src/views/system/config-manage/checkin-manage/index.vue

@@ -16,6 +16,7 @@
           defaultPageSize: 10,
           onChange,
           total: pagination.total,
+          current: pagination.page,
         }"
       >
       </t-table>
@@ -85,7 +86,7 @@ const columns = [
     },
   },
 ];
-const { pagination, tableData, fetchData, onChange } =
+const { pagination, tableData, fetchData, search, onChange } =
   useFetchTable(checkinListApi);
 
 const fields = ref([
@@ -107,6 +108,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },

src/views/system/config-manage/customer-manage/index.vue

@@ -17,6 +17,7 @@
           defaultPageSize: 10,
           onChange,
           total: pagination.total,
+          current: pagination.page,
         }"
       >
       </t-table>
@@ -87,7 +88,7 @@ const columns = [
     },
   },
 ];
-const { pagination, tableData, fetchData, onChange } =
+const { pagination, tableData, fetchData, search, onChange } =
   useFetchTable(customerListApi);
 
 const fields = ref([
@@ -135,6 +136,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },

src/views/system/notice-log/log-manage/index.vue

@@ -14,6 +14,7 @@
             defaultPageSize: 10,
             onChange,
             total: pagination.total,
+            current: pagination.page,
           }"
         >
         </t-table>
@@ -31,8 +32,7 @@ const columns = [
   { colKey: 'a', title: '时间', width: 170 },
   { colKey: 'b', title: '内容' },
 ];
-const { pagination, tableData, fetchData, onChange } =
-  useFetchTable(logListApi);
+const { pagination, tableData, search, onChange } = useFetchTable(logListApi);
 
 const fields = ref([
   {
@@ -59,6 +59,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },

src/views/system/notice-log/notice-manage/index.vue

@@ -18,6 +18,7 @@
           defaultPageSize: 10,
           onChange,
           total: pagination.total,
+          current: pagination.page,
         }"
         @select-change="selectChange"
       >
@@ -106,7 +107,7 @@ const columns = [
     },
   },
 ];
-const { pagination, tableData, fetchData, onChange } =
+const { pagination, tableData, fetchData, search, onChange } =
   useFetchTable(noticeListApi);
 
 const fields = ref([
@@ -153,6 +154,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },

src/views/work-hours/work-hours-manage/abnormal-check/done-check.vue

@@ -12,6 +12,7 @@
         defaultPageSize: 10,
         onChange,
         total: pagination.total,
+        current: pagination.page,
       }"
     >
     </t-table>
@@ -20,9 +21,8 @@
 
 <script setup lang="jsx" name="DoneCheck">
 import { reactive, ref } from 'vue';
-import { useRequest } from 'vue-request';
-import { getTableData } from '@/api/test';
 import useFetchTable from '@/hooks/useFetchTable';
+import { workHoursDoneCheckListApi } from '@/api/work-hours';
 
 const columns = [
   { colKey: 'a', title: '服务单元' },
@@ -42,13 +42,10 @@ const columns = [
   { colKey: 'o', title: '审核人' },
   { colKey: 'p', title: '审核时间' },
 ];
-const {
-  loading: tableLoading,
-  pagination,
-  tableData,
-  fetchData,
-  onChange,
-} = useFetchTable(getTableData);
+const { pagination, tableData, search, onChange } = useFetchTable(
+  workHoursDoneCheckListApi
+);
+
 const fields = ref([
   {
     prop: 'a',
@@ -105,6 +102,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },
@@ -119,5 +119,3 @@ const params = reactive({
   g: [],
 });
 </script>
-
-<style lang="less" scoped></style>

src/views/work-hours/work-hours-manage/abnormal-check/wait-check.vue

@@ -2,10 +2,16 @@
   <div class="wait-check">
     <SearchForm :fields="fields" :params="params" showAll></SearchForm>
     <div class="btn-group">
-      <t-button theme="success" :disabled="!selectedRowKeys.length"
+      <t-button
+        theme="success"
+        :disabled="!selectedRowKeys.length"
+        @click="handleAudit(selectedRowKeys, true)"
         >批量通过</t-button
       >
-      <t-button theme="success" :disabled="!selectedRowKeys.length"
+      <t-button
+        theme="danger"
+        :disabled="!selectedRowKeys.length"
+        @click="handleAudit(selectedRowKeys, false)"
         >批量拒绝</t-button
       >
     </div>
@@ -20,6 +26,7 @@
         defaultPageSize: 10,
         onChange,
         total: pagination.total,
+        current: pagination.page,
       }"
       :selected-row-keys="selectedRowKeys"
       select-on-row-click
@@ -31,12 +38,14 @@
 
 <script setup lang="jsx" name="WaitCheck">
 import { reactive, ref } from 'vue';
-import { useRequest } from 'vue-request';
-import { getTableData } from '@/api/test';
+import { DialogPlugin, MessagePlugin } from 'tdesign-vue-next';
 import useFetchTable from '@/hooks/useFetchTable';
-
+import {
+  workHoursWaitCheckListApi,
+  workHoursWaitCheckAuditApi,
+} from '@/api/work-hours';
 const selectedRowKeys = ref([]);
-const selectChange = (value, { selectedRowData }) => {
+const selectChange = (value) => {
   selectedRowKeys.value = value;
 };
 
@@ -65,7 +74,7 @@ const columns = [
     title: '操作',
     colKey: 'operate',
     fixed: 'right',
-    width: 140,
+    width: 120,
     cell: (h, { row }) => {
       return (
         <div class="table-operations">
@@ -74,15 +83,17 @@ const columns = [
             hover="color"
             onClick={(e) => {
               e.stopPropagation();
+              handleAudit([row.id], true);
             }}
           >
             通过
           </t-link>
           <t-link
-            theme="primary"
+            theme="danger"
             hover="color"
             onClick={(e) => {
               e.stopPropagation();
+              handleAudit([row.id], false);
             }}
           >
             拒绝
@@ -92,13 +103,10 @@ const columns = [
     },
   },
 ];
-const {
-  loading: tableLoading,
-  pagination,
-  tableData,
-  fetchData,
-  onChange,
-} = useFetchTable(getTableData);
+const { pagination, tableData, fetchData, search, onChange } = useFetchTable(
+  workHoursWaitCheckListApi
+);
+
 const fields = ref([
   {
     prop: 'a',
@@ -133,6 +141,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },
@@ -159,6 +170,33 @@ const params = reactive({
   e: [],
   f: [],
 });
-</script>
 
-<style lang="less" scoped></style>
+const handleAudit = async (selectedIds, pass) => {
+  if (!selectedIds.length) {
+    MessagePlugin.error('请选择要通过的记录');
+    return;
+  }
+
+  const actionName = pass ? '通过' : '拒绝';
+  const warningBody =
+    selectedIds.length > 1
+      ? `确定要${actionName}当前选择的所有记录吗`
+      : `确定要${actionName}当前记录吗`;
+
+  const confirmDia = DialogPlugin({
+    header: '操作警告',
+    body: warningBody,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await workHoursWaitCheckAuditApi(selectedIds, pass).catch(
+        () => {}
+      );
+      if (!res) return;
+      MessagePlugin.success('操作成功');
+      fetchData();
+    },
+  });
+};
+</script>

src/views/work-hours/work-hours-manage/work-attendance/index.vue

@@ -22,6 +22,7 @@
           defaultPageSize: 10,
           onChange,
           total: pagination.total,
+          current: pagination.page,
         }"
         :selected-row-keys="selectedRowKeys"
         select-on-row-click
@@ -32,16 +33,21 @@
   </div>
 </template>
 
-<script setup name="WorkAttendance">
+<script setup lang="jsx" name="WorkAttendance">
 import { reactive, ref } from 'vue';
-import { getTableData } from '@/api/test';
+import { DialogPlugin, MessagePlugin } from 'tdesign-vue-next';
 import useFetchTable from '@/hooks/useFetchTable';
+import {
+  workAttendanceListApi,
+  workAttendanceSubmitApi,
+  workAttendanceWithdrawApi,
+  workAttendanceCancelWithdrawApi,
+} from '@/api/work-hours';
 
 const selectedRowKeys = ref([]);
-const selectChange = (value, { selectedRowData }) => {
+const selectChange = (value) => {
   selectedRowKeys.value = value;
 };
-const multSubmit = () => {};
 const columns = [
   {
     colKey: 'row-select',
@@ -71,14 +77,53 @@ const columns = [
   { colKey: 't', title: '提交状态' },
   { colKey: 'u', title: '提交人' },
   { colKey: 'v', title: '提交时间' },
+  {
+    title: '操作',
+    colKey: 'operate',
+    fixed: 'right',
+    width: 120,
+    cell: (h, { row }) => {
+      return (
+        <div class="table-operations">
+          <t-link
+            theme="primary"
+            hover="color"
+            onClick={(e) => {
+              e.stopPropagation();
+              handleSubmit(row);
+            }}
+          >
+            提交
+          </t-link>
+          <t-link
+            theme="danger"
+            hover="color"
+            onClick={(e) => {
+              e.stopPropagation();
+              handleWithdraw(row);
+            }}
+          >
+            撤回
+          </t-link>
+          <t-link
+            theme="danger"
+            hover="color"
+            onClick={(e) => {
+              e.stopPropagation();
+              handleCancelWithdraw(row);
+            }}
+          >
+            取消撤回
+          </t-link>
+        </div>
+      );
+    },
+  },
 ];
-const {
-  loading: tableLoading,
-  pagination,
-  tableData,
-  fetchData,
-  onChange,
-} = useFetchTable(getTableData);
+const { pagination, tableData, fetchData, search, onChange } = useFetchTable(
+  workAttendanceListApi
+);
+
 const fields = ref([
   {
     prop: 'a',
@@ -114,6 +159,9 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+        },
       },
     ],
   },
@@ -174,6 +222,72 @@ const params = reactive({
   j: '',
   k: '',
 });
-</script>
 
-<style></style>
+const multSubmit = () => {
+  if (!selectedRowKeys.value.length) {
+    MessagePlugin.error('请选择要提交的记录');
+    return;
+  }
+  const confirmDia = DialogPlugin({
+    header: '操作警告',
+    body: `确定要提交选择的所有记录吗？`,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await workAttendanceSubmitApi(selectedRowKeys.value).catch(
+        () => {}
+      );
+      if (!res) return;
+      MessagePlugin.success('操作成功');
+      fetchData();
+    },
+  });
+};
+
+const handleSubmit = (row) => {
+  const confirmDia = DialogPlugin({
+    header: '操作警告',
+    body: `确定要提交当前记录吗？`,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await workAttendanceSubmitApi([row.id]).catch(() => {});
+      if (!res) return;
+      MessagePlugin.success('操作成功');
+      fetchData();
+    },
+  });
+};
+const handleWithdraw = (row) => {
+  const confirmDia = DialogPlugin({
+    header: '操作警告',
+    body: `确定要撤回当前记录吗？`,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await workAttendanceWithdrawApi(row.id).catch(() => {});
+      if (!res) return;
+      MessagePlugin.success('操作成功');
+      fetchData();
+    },
+  });
+};
+const handleCancelWithdraw = (row) => {
+  const confirmDia = DialogPlugin({
+    header: '操作警告',
+    body: `确定要取消撤回当前记录吗？`,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await workAttendanceCancelWithdrawApi(row.id).catch(() => {});
+      if (!res) return;
+      MessagePlugin.success('操作成功');
+      fetchData();
+    },
+  });
+};
+</script>

src/views/work-hours/work-hours-manage/work-statistics/index.vue

@@ -2,6 +2,13 @@
   <div class="work-statistics flex flex-col h-full">
     <SearchForm :fields="fields" :params="params"></SearchForm>
     <div class="flex-1 page-wrap">
+      <p>
+        <span>考勤总计：{{ statisticsInfo.a }}</span>
+        <span class="m-l-20px">已提交：{{ statisticsInfo.b }}</span>
+        <span class="m-l-20px">待提交：{{ statisticsInfo.c }}</span>
+        <span class="m-l-20px">已提交累计人天：{{ statisticsInfo.d }}天</span>
+        <span class="m-l-20px">已提交累计工时：{{ statisticsInfo.e }}小时</span>
+      </p>
       <t-table
         size="small"
         row-key="id"
@@ -13,6 +20,7 @@
           defaultPageSize: 10,
           onChange,
           total: pagination.total,
+          current: pagination.page,
         }"
       >
       </t-table>
@@ -22,24 +30,39 @@
 
 <script setup lang="jsx" name="WorkStatistics">
 import { ref, reactive } from 'vue';
-import { getTableData } from '@/api/test';
+import { DialogPlugin, MessagePlugin } from 'tdesign-vue-next';
 import useFetchTable from '@/hooks/useFetchTable';
+import {
+  workStatisticsListApi,
+  workStatisticsInfoApi,
+  workStatisticsPassApi,
+} from '@/api/work-hours';
 
 const columns = [
-  { colKey: 'a', title: '服务单元名称' },
-  { colKey: 'b', title: '服务开始时间' },
-  { colKey: 'c', title: '服务截止时间' },
-  { colKey: 'd', title: '业务类型' },
-  { colKey: 'e', title: '负责人' },
-  { colKey: 'f', title: '区域配比' },
-  { colKey: 'g', title: '当前状态' },
-  { colKey: 'h', title: '创建人' },
-  { colKey: 'i', title: '创建时间' },
+  { colKey: 'a', title: '服务单元' },
+  { colKey: 'b', title: 'SOP流水号' },
+  { colKey: 'c', title: '客户名称' },
+  { colKey: 'd', title: '省份' },
+  { colKey: 'e', title: '城市' },
+  { colKey: 'f', title: '项目开始时间', width: 170 },
+  { colKey: 'g', title: '项目结束时间', width: 170 },
+  { colKey: 'h', title: '姓名（人员档案号）', width: 150 },
+  { colKey: 'i', title: '项目角色' },
+  { colKey: 'j', title: '供应商' },
+  { colKey: 'k', title: '实际出勤（天）', width: 120 },
+  { colKey: 'l', title: '工作日（天）', width: 110 },
+  { colKey: 'm', title: '周末（天）', width: 100 },
+  { colKey: 'n', title: '法定节假日（天）', width: 140 },
+  { colKey: 'o', title: '累计工时（天）', width: 120 },
+  { colKey: 'p', title: '违规工时（天）', width: 120 },
+  { colKey: 'q', title: '提交人' },
+  { colKey: 'r', title: '提交时间', width: 170 },
+  { colKey: 's', title: '提交状态', width: 100 },
   {
-    title: '操作',
+    title: '管理',
     colKey: 'operate',
     fixed: 'right',
-    width: 260,
+    width: 120,
     cell: (h, { row }) => {
       return (
         <div class="table-operations">
@@ -48,6 +71,7 @@ const columns = [
             hover="color"
             onClick={(e) => {
               e.stopPropagation();
+              handlePass(row);
             }}
           >
             同意撤回
@@ -57,15 +81,15 @@ const columns = [
     },
   },
 ];
-const {
-  loading: tableLoading,
-  pagination,
-  tableData,
-  fetchData,
-  onChange,
-} = useFetchTable(getTableData);
+const { pagination, tableData, fetchData, search, onChange } = useFetchTable(
+  workStatisticsListApi
+);
 
-const refresh = async () => {};
+const statisticsInfo = reactive({ a: 1, b: 2, c: 3, d: 4, e: 5 });
+const getStatisticsInfo = async () => {
+  const res = await workStatisticsInfoApi(params);
+  statisticsInfo = res.data || {};
+};
 
 const fields = ref([
   {
@@ -102,6 +126,10 @@ const fields = ref([
       {
         type: 'button',
         text: '查询',
+        onClick: () => {
+          search();
+          getStatisticsInfo();
+        },
       },
     ],
   },
@@ -141,6 +169,20 @@ const params = reactive({
   g: '',
   h: '',
 });
-</script>
 
-<style></style>
+const handlePass = (row) => {
+  const confirmDia = DialogPlugin({
+    header: '同意撤回提示',
+    body: `您确定要同意撤回这条工时数据吗？撤回后，该工时数据可以暂时无法继续结算。`,
+    confirmBtn: '确定',
+    cancelBtn: '取消',
+    onConfirm: async () => {
+      confirmDia.hide();
+      const res = await workStatisticsPassApi(row.id).catch(() => {});
+      if (!res) return;
+      MessagePlugin.success('操作成功');
+      fetchData();
+    },
+  });
+};
+</script>