工作台ui

src/layout/index.vue

@@ -101,6 +101,8 @@ const clickHandler = (data) => {
   .app-menu {
     background-color: #f2f3f5;
     height: 100%;
+    overflow-x: hidden;
+    overflow-y: auto;
 
     &-list {
       padding: 16px 8px 40px;
@@ -160,9 +162,16 @@ const clickHandler = (data) => {
   }
   .app-submenu {
     background-color: #fff;
-    padding-bottom: 68px;
     position: relative;
     color: #262626;
+    height: 100%;
+    overflow-x: hidden;
+    overflow-y: auto;
+
+    &-body {
+      padding-bottom: 68px;
+      height: 100%;
+    }
 
     &-footer {
       position: absolute;

src/style/color.less

@@ -1,2 +1,4 @@
 @dark-text-color: #262626;
+@dark-text-color-2: #595959;
 @light-text-color: #8c8c8c;
+@light-border-color: #e5e5e5;

src/style/global.less

@@ -6,7 +6,7 @@ body {
   height: 100%;
   background-size: cover;
   font-size: 14px;
-  color: #262626;
+  color: @dark-text-color;
 }
 #app {
   height: 100%;
@@ -18,6 +18,12 @@ body {
   // box-shadow: 1px 1px 2px var(--color-neutral-2);
 }
 
+.table-operations {
+  & > .t-link:not(:first-child) {
+    margin-left: 15px;
+  }
+}
+
 .page-action {
   padding: 16px 16px 1px;
   background-color: #fff;
@@ -29,7 +35,7 @@ body {
 }
 .page-header {
   padding: 16px;
-  border-bottom: 1px solid #e5e5e5;
+  border-bottom: 1px solid @light-border-color;
 }
 .table-search {
   .t-form__item {
@@ -46,7 +52,7 @@ body {
   }
 }
 .page-wrap {
-  margin: 12px 16px;
+  margin: 16px;
   &-tips {
     color: #4e5969;
     .t-icon {
@@ -58,7 +64,7 @@ body {
 
     th {
       background-color: #fff;
-      color: #8c8c8c;
+      color: @light-text-color;
       font-weight: 400;
       padding: 12px 16px;
     }
@@ -84,13 +90,24 @@ body {
     td,
     th,
     .t-table__content {
-      border-color: #e5e5e5;
+      border-color: @light-border-color;
     }
     .t-table__content {
       border-radius: 4px;
     }
   }
 }
+.page-pagination {
+  padding: 12px 0;
+  .t-input-adornment__append {
+    border: 1px solid #d9d9d9;
+    padding: 0 3px;
+    height: var(--td-comp-size-m);
+  }
+  .t-input-number .t-input {
+    height: var(--td-comp-size-m);
+  }
+}
 .page-tab {
   color: var(--td-text-color-primary);
   box-sizing: border-box;
@@ -198,3 +215,70 @@ body {
 .red {
   color: #e4393d;
 }
+
+// pages ---------------->
+// message-list
+.message-list {
+  .none-box {
+    text-align: center;
+    margin-top: 100px;
+    img {
+      height: 120px;
+    }
+    p {
+      color: @light-text-color;
+      font-size: 14px;
+      margin-top: 10px;
+    }
+  }
+  .message-item {
+    border: 1px solid @light-border-color;
+    border-radius: 4px;
+    background-color: #fff;
+    padding: 16px;
+    margin-bottom: 10px;
+    .m-head {
+      border-bottom: 1px solid @light-border-color;
+      line-height: 24px;
+      padding-bottom: 16px;
+
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      .m-title {
+        font-size: 16px;
+        color: @dark-text-color;
+        font-weight: bold;
+        margin-right: 12px;
+        flex-grow: 2;
+        font-size: 0;
+
+        > span {
+          display: inline-block;
+          vertical-align: middle;
+          margin-right: 12px;
+        }
+        span:first-child {
+          font-size: 14px;
+        }
+      }
+      .m-time {
+        flex-grow: 0;
+        color: @light-text-color;
+      }
+    }
+    .m-body {
+      .m-content {
+        color: @dark-text-color-2;
+        font-weight: 500;
+        line-height: 22px;
+        padding: 16px 0 8px 0;
+      }
+      .m-info {
+        color: @light-text-color;
+        line-height: 22px;
+      }
+    }
+  }
+}

src/style/tdesign-reset.less

@@ -6,21 +6,6 @@
   --td-success-color: #00b42a;
 }
 
-.t-layout .t-table {
-  margin-top: 10px;
-  font-size: 14px !important;
-  color: #515a6e;
-  th {
-    background-color: #f8f8f9;
-    font-weight: bold;
-    color: #515a6e;
-  }
-  .table-operations {
-    & > .t-link:not(:first-child) {
-      margin-left: 15px;
-    }
-  }
-}
 .t-dialog--default {
   padding-top: 20px;
 }

src/utils/filter.js

@@ -19,6 +19,8 @@ import {
   DATA_TASK_STATUS,
   DATA_TASK_RESULT,
   DATA_TASK_TYPE,
+  MESSAGE_TYPE,
+  WAIT_HANDLE_TYPE,
 } from '@/config/constants';
 import { dateFormat } from './tool';
 
@@ -49,6 +51,13 @@ export function timestampFilter(val, fmt = 'ss') {
 export function dayCountFilter(val) {
   return Math.ceil(val / (24 * 60 * 60 * 1000));
 }
+// 工作台
+export function messageTypeFilter(val) {
+  return MESSAGE_TYPE[val] || DEFAULT_FIELD;
+}
+export function waitHandleTypeFilter(val) {
+  return WAIT_HANDLE_TYPE[val] || DEFAULT_FIELD;
+}
 // 系统管理
 export function customerTypeFilter(val) {
   return CUSTOMER_TYPE[val] || DEFAULT_FIELD;

src/views/my-workbenches/workbenches/message-reminder/index.vue

@@ -1,5 +1,14 @@
 <template>
   <div class="message-reminder flex flex-col h-full">
+    <div class="page-action">
+      <div
+        v-for="item in tabs"
+        :key="item.value"
+        :class="['page-tab', { 'is-active': params.status === item.value }]"
+        @click="switchTab(item)"
+        >{{ item.label }}</div
+      >
+    </div>
     <SearchForm :fields="fields" :params="params">
       <template #service="{ item, params }">
         <select-service-unit
@@ -8,38 +17,12 @@
         ></select-service-unit>
       </template>
     </SearchForm>
-    <div class="page-wrap flex-1">
-      <t-tabs
-        v-model="params.status"
-        class="h-full"
-        @change="tabChange"
-        v-loading="loading"
-      >
-        <t-tab-panel value="undefined" label="全部">
-          <MessageList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-          ></MessageList>
-        </t-tab-panel>
-        <t-tab-panel value="false" label="未读">
-          <MessageList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-          ></MessageList>
-        </t-tab-panel>
-        <t-tab-panel value="true" label="已读">
-          <MessageList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-          ></MessageList>
-        </t-tab-panel>
-      </t-tabs>
+    <div v-loading="loading" class="page-wrap flex-1">
+      <MessageList
+        :tableData="tableData"
+        :pagination="pagination"
+        :onChange="onChange"
+      ></MessageList>
     </div>
   </div>
 </template>
@@ -51,14 +34,34 @@ import { getMyMessages } from '@/api/my-workbenches';
 import { MESSAGE_TYPE } from '@/config/constants';
 import { dictToOptionList } from '@/utils/tool';
 import MessageList from './message-list.vue';
+
+const tabs = [
+  {
+    label: '全部',
+    value: 'undefined',
+  },
+  {
+    label: '未读',
+    value: 'false',
+  },
+  {
+    label: '已读',
+    value: 'true',
+  },
+];
+
 const params = reactive({
   types: [],
   serviceId: '',
   custom: '',
   status: 'undefined',
 });
+
 const transParams = computed(() => {
   let types = params.types.join(',');
+  if (!types.length && params.status === 'undefined') {
+    types = Object.keys(MESSAGE_TYPE).join();
+  }
   let status = eval(params.status);
   return { ...params, types, status };
 });
@@ -71,7 +74,9 @@ const {
 } = useFetchTable(getMyMessages, {
   params: transParams,
 });
-const tabChange = () => {
+
+const switchTab = (tab) => {
+  params.status = tab.value;
   search();
 };
 const fields = ref([
@@ -115,14 +120,3 @@ const fields = ref([
   },
 ]);
 </script>
-
-<style lang="less" scoped>
-.message-reminder {
-  .page-wrap {
-    :deep(.t-tabs__content) {
-      height: calc(100% - var(--td-comp-size-xxl));
-      overflow: auto;
-    }
-  }
-}
-</style>

src/views/my-workbenches/workbenches/message-reminder/message-list.vue

@@ -2,28 +2,40 @@
   <div class="message-list">
     <div class="message-item" v-for="item in tableData" :key="item.id">
       <div class="m-head">
-        <span class="m-title">{{ item.messageType }}</span>
-        <t-tag theme="danger" variant="light" v-if="!item.readStatus"
-          >未读</t-tag
-        >
+        <div class="m-title">
+          <span>{{ messageTypeFilter(item.messageType) }}</span>
+          <t-tag
+            theme="danger"
+            variant="light"
+            size="small"
+            v-if="!item.readStatus"
+            >未读</t-tag
+          >
+        </div>
+        <div class="m-time">{{ timestampFilter(item.sendTime, 'mm') }}</div>
       </div>
       <div class="m-body">
         <div class="m-content">{{ item.content }}</div>
-        <div class="m-info flex items-center">
+        <t-space class="m-info" :size="5">
           <p>发起人：{{ item.formUser }}</p>
           <p>服务单元：{{ item.service }} </p>
           <p>客户类型：{{ item.customType }}</p>
           <p>客户名称：{{ item.custom }}</p>
-        </div>
+          <template #separator>
+            <t-divider layout="vertical" />
+          </template>
+        </t-space>
       </div>
     </div>
 
     <t-pagination
       v-if="pagination.total > 0"
-      class="m-t-20px"
+      class="page-pagination"
       v-model="pagination.pageNumber"
       v-model:pageSize="pagination.pageSize"
       :total="pagination.total"
+      showJumper
+      :showPageSize="false"
       @change="onChange"
     />
 
@@ -35,66 +47,11 @@
 </template>
 
 <script setup name="MessageList">
-const { tableData, loading, pagination, onChange } = defineProps([
+import { messageTypeFilter, timestampFilter } from '@/utils/filter';
+
+const { tableData, pagination, onChange } = defineProps([
   'tableData',
-  'loading',
   'pagination',
   'onChange',
 ]);
 </script>
-
-<style lang="less" scoped>
-.message-list {
-  .none-box {
-    text-align: center;
-    margin-top: 100px;
-    img {
-      height: 120px;
-    }
-    p {
-      color: @light-text-color;
-      font-size: 14px;
-      margin-top: 10px;
-    }
-  }
-  .message-item {
-    border: 1px solid #e5e5e5;
-    border-radius: 4px;
-    background-color: #fff;
-    padding: 0 15px;
-    margin-bottom: 10px;
-    .m-head {
-      height: 55px;
-      border-bottom: 1px solid #e5e5e5;
-      .m-title {
-        font-size: 16px;
-        color: #262626;
-        font-weight: bold;
-        line-height: 54px;
-        margin-right: 12px;
-      }
-    }
-    .m-body {
-      padding: 15px 0;
-      .m-content {
-        color: #595959;
-        font-size: 14px;
-        font-weight: bold;
-      }
-      .m-info {
-        margin-top: 20px;
-        p {
-          padding-right: 20px;
-          border-right: 1px solid #e5e5e5;
-          color: @light-text-color;
-          line-height: 1;
-          margin-right: 20px;
-          &:last-child {
-            border-right: none;
-          }
-        }
-      }
-    }
-  }
-}
-</style>

src/views/my-workbenches/workbenches/my-waits/index.vue

@@ -1,5 +1,17 @@
 <template>
   <div class="message-reminder flex flex-col h-full">
+    <div class="page-action">
+      <div
+        v-for="item in tabs"
+        :key="item.value"
+        :class="[
+          'page-tab',
+          { 'is-active': params.flowTaskTypeEnum === item.value },
+        ]"
+        @click="switchTab(item)"
+        >{{ item.label }}</div
+      >
+    </div>
     <SearchForm :fields="fields" :params="params">
       <template #service="{ item, params }">
         <select-service-unit
@@ -8,38 +20,12 @@
         ></select-service-unit>
       </template>
     </SearchForm>
-    <div class="page-wrap flex-1">
-      <t-tabs
-        v-model="params.flowTaskTypeEnum"
-        class="h-full"
-        @change="tabChange"
-        v-loading="loading"
-      >
-        <t-tab-panel value="ALL" label="全部">
-          <TaskList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-          ></TaskList>
-        </t-tab-panel>
-        <t-tab-panel value="OVER_TIME" label="已超时">
-          <TaskList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-          ></TaskList>
-        </t-tab-panel>
-        <t-tab-panel value="DRAFT" label="暂存">
-          <TaskList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-          ></TaskList>
-        </t-tab-panel>
-      </t-tabs>
+    <div v-loading="loading" class="page-wrap flex-1">
+      <TaskList
+        :tableData="tableData"
+        :pagination="pagination"
+        :onChange="onChange"
+      ></TaskList>
     </div>
   </div>
 </template>
@@ -51,6 +37,22 @@ import { getMyWaits } from '@/api/my-workbenches';
 import { WAIT_HANDLE_TYPE } from '@/config/constants';
 import { dictToOptionList } from '@/utils/tool';
 import TaskList from './waits-list.vue';
+
+const tabs = [
+  {
+    label: '全部',
+    value: 'ALL',
+  },
+  {
+    label: '已超时',
+    value: 'OVER_TIME',
+  },
+  {
+    label: '暂存',
+    value: 'DRAFT',
+  },
+];
+
 const params = reactive({
   type: '',
   serviceId: '',
@@ -67,7 +69,9 @@ const {
 } = useFetchTable(getMyWaits, {
   params: params,
 });
-const tabChange = () => {
+
+const switchTab = (tab) => {
+  params.flowTaskTypeEnum = tab.value;
   search();
 };
 const fields = ref([
@@ -111,14 +115,3 @@ const fields = ref([
   },
 ]);
 </script>
-
-<style lang="less" scoped>
-.message-reminder {
-  .page-wrap {
-    :deep(.t-tabs__content) {
-      height: calc(100% - var(--td-comp-size-xxl));
-      overflow: auto;
-    }
-  }
-}
-</style>

src/views/my-workbenches/workbenches/my-waits/waits-list.vue

@@ -1,39 +1,47 @@
 <template>
-  <div class="message-list">
+  <div class="message-list waits-list">
     <div
-      class="message-item cursor-pointer"
       v-for="item in tableData"
       :key="item.id"
+      class="message-item cursor-pointer"
     >
       <div class="m-head">
-        <span class="m-title">{{ item.taskName }}</span>
-        <t-tag theme="success" variant="light" v-if="item.diffTime == 0"
-          >正常</t-tag
-        >
-        <template v-else>
-          <t-tag theme="danger" variant="light">已超时</t-tag>
-          <t-tag class="m-l-5px" theme="danger" variant="light"
-            >超时时长：{{ item.diffTime <= 30 ? '30天' : '大于30天' }}</t-tag
+        <div class="m-title">
+          <span>{{ item.taskName }}</span>
+          <t-tag v-if="item.diffTime == 0" theme="success" variant="light"
+            >正常</t-tag
           >
-        </template>
+          <template v-else>
+            <t-tag theme="danger" variant="light">已超时</t-tag>
+            <t-tag theme="danger" variant="light"
+              >超时时长：{{ item.diffTime <= 30 ? '30天' : '大于30天' }}</t-tag
+            >
+          </template>
+        </div>
+        <div class="m-time">{{ timestampFilter(item.flowTime, 'mm') }}</div>
       </div>
       <div class="m-body">
         <div class="m-content">{{ item.typeStr }}</div>
-        <div class="m-info flex items-center">
+        <t-space class="m-info" :size="5">
           <p>发起人：{{ item.createRealName }}</p>
           <p>服务单元： {{ item.serviceName }} </p>
-          <p>客户类型：{{ CUSTOMER_TYPE[item.customType] }}</p>
+          <p>客户类型：{{ customerTypeFilter(item.customType) }}</p>
           <p>客户名称：{{ item.customName }}</p>
-        </div>
+          <template #separator>
+            <t-divider layout="vertical" />
+          </template>
+        </t-space>
       </div>
     </div>
 
     <t-pagination
       v-if="pagination.total > 0"
-      class="m-t-20px"
+      class="page-pagination"
       v-model="pagination.pageNumber"
       v-model:pageSize="pagination.pageSize"
       :total="pagination.total"
+      showJumper
+      :showPageSize="false"
       @change="onChange"
     />
     <div class="none-box" v-if="!tableData.length">
@@ -44,71 +52,11 @@
 </template>
 
 <script setup name="MyTaskList">
-import { CUSTOMER_TYPE } from '@/config/constants';
-const { tableData, loading, pagination, onChange } = defineProps([
+import { timestampFilter, customerTypeFilter } from '@/utils/filter';
+
+const { tableData, pagination, onChange } = defineProps([
   'tableData',
-  'loading',
   'pagination',
   'onChange',
 ]);
 </script>
-
-<style lang="less" scoped>
-.message-list {
-  .none-box {
-    text-align: center;
-    margin-top: 100px;
-    img {
-      height: 120px;
-    }
-    p {
-      color: @light-text-color;
-      font-size: 14px;
-      margin-top: 10px;
-    }
-  }
-  .message-item {
-    border: 1px solid #e5e5e5;
-    border-radius: 4px;
-    background-color: #fff;
-    padding: 0 15px;
-    margin-bottom: 10px;
-    transition: all 0.3s;
-    &:hover {
-      background-color: #f3f3f3;
-    }
-    .m-head {
-      height: 55px;
-      border-bottom: 1px solid #e5e5e5;
-      .m-title {
-        font-size: 16px;
-        color: #262626;
-        font-weight: bold;
-        line-height: 54px;
-        margin-right: 12px;
-      }
-    }
-    .m-body {
-      padding: 15px 0;
-      .m-content {
-        color: #595959;
-        font-size: 14px;
-        font-weight: bold;
-      }
-      .m-info {
-        margin-top: 20px;
-        p {
-          padding-right: 20px;
-          border-right: 1px solid #e5e5e5;
-          color: @light-text-color;
-          line-height: 1;
-          margin-right: 20px;
-          &:last-child {
-            border-right: none;
-          }
-        }
-      }
-    }
-  }
-}
-</style>

src/views/my-workbenches/workbenches/notice/index.vue

@@ -1,5 +1,15 @@
 <template>
   <div class="notice flex flex-col h-full">
+    <div class="page-action">
+      <div
+        v-for="item in tabs"
+        :key="item.value"
+        :class="['page-tab', { 'is-active': params.status === item.value }]"
+        @click="switchTab(item)"
+        >{{ item.label }}</div
+      >
+    </div>
+
     <SearchForm :fields="fields" :params="params">
       <template #service="{ item, params }">
         <select-service-unit
@@ -8,53 +18,32 @@
         ></select-service-unit>
       </template>
     </SearchForm>
-    <div class="page-wrap flex-1">
-      <t-tabs
-        v-model="params.status"
-        class="h-full"
-        v-loading="loading"
-        @change="tabChange"
-      >
-        <t-tab-panel value="undefined" label="全部">
-          <NoticeList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-            @open="open"
-          ></NoticeList>
-        </t-tab-panel>
-        <t-tab-panel value="false" label="未读">
-          <NoticeList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-            @open="open"
-          ></NoticeList>
-        </t-tab-panel>
-        <t-tab-panel value="true" label="已读">
-          <NoticeList
-            :loading="loading"
-            :tableData="tableData"
-            :pagination="pagination"
-            :onChange="onChange"
-            @open="open"
-          ></NoticeList>
-        </t-tab-panel>
-      </t-tabs>
+
+    <div v-loading="loading" class="page-wrap flex-1">
+      <NoticeList
+        :loading="loading"
+        :tableData="tableData"
+        :pagination="pagination"
+        :onChange="onChange"
+        @open="open"
+      ></NoticeList>
     </div>
+
     <t-drawer
       v-model:visible="visible"
       header="通知公告"
-      :footer="false"
-      size="700px"
+      size="80%"
+      :close-btn="true"
     >
       <h2 class="text-center notice-title">{{ curNotice.title }}</h2>
       <div class="text-center notice-subtitle"
         >发布时间：{{ dateFormat(curNotice.sendTime, 'yyyy-MM-dd') }}</div
       >
       <p class="notice-content">{{ curNotice.content }}</p>
+
+      <template #footer>
+        <t-button theme="primary" @click="visible = false">返回</t-button>
+      </template>
     </t-drawer>
   </div>
 </template>
@@ -66,11 +55,29 @@ import { getMyMessages } from '@/api/my-workbenches';
 import NoticeList from './notice-list.vue';
 import { omit } from 'lodash';
 import { dateFormat } from '@/utils/tool';
+
 const curNotice = ref({});
 const visible = ref(false);
 const open = (notice) => {
   curNotice.value = notice;
+  visible.value = true;
 };
+
+const tabs = [
+  {
+    label: '全部',
+    value: 'undefined',
+  },
+  {
+    label: '未读',
+    value: 'false',
+  },
+  {
+    label: '已读',
+    value: 'true',
+  },
+];
+
 const params = reactive({
   types: ['SYSTEM'],
   title: '',
@@ -97,9 +104,12 @@ const {
 } = useFetchTable(getMyMessages, {
   params: transParams,
 });
-const tabChange = () => {
+
+const switchTab = (tab) => {
+  params.status = tab.value;
   search();
 };
+
 const fields = ref([
   {
     prop: 'time',
@@ -136,12 +146,6 @@ const fields = ref([
 
 <style lang="less" scoped>
 .notice {
-  .page-wrap {
-    :deep(.t-tabs__content) {
-      height: calc(100% - var(--td-comp-size-xxl));
-      overflow: auto;
-    }
-  }
   .notice-title {
     color: #333;
     font-size: 20px;

src/views/my-workbenches/workbenches/notice/notice-list.vue

@@ -1,29 +1,42 @@
 <template>
-  <div class="notice-list">
-    <t-table
-      size="small"
-      row-key="id"
-      :columns="columns"
-      :data="tableData"
-      bordered
-      :pagination="{
-        defaultCurrent: 1,
-        defaultPageSize: 10,
-        onChange,
-        total: pagination.total,
-        current: pagination.pageNumber,
-      }"
-    >
-      <template #title="{ row }">
-        <t-link theme="primary" hover="color" @click="open(row)">
-          {{ row.title }}
-        </t-link>
-      </template>
-    </t-table>
-  </div>
+  <t-table
+    size="small"
+    row-key="id"
+    :columns="columns"
+    :data="tableData"
+    bordered
+    :pagination="{
+      defaultCurrent: 1,
+      defaultPageSize: 10,
+      onChange,
+      showJumper: true,
+      showPageSize: false,
+      total: pagination.total,
+      current: pagination.pageNumber,
+    }"
+  >
+    <template #title="{ row }">
+      <t-link hover="color" @click="open(row)">
+        {{ row.title }}
+      </t-link>
+      <t-tag
+        v-if="!row.readStatus"
+        theme="danger"
+        variant="light"
+        size="small"
+        class="m-l-10px"
+        >未读</t-tag
+      >
+    </template>
+    <template #send-time="{ col, row }">
+      {{ timestampFilter(row[col.colKey], 'mm') }}
+    </template>
+  </t-table>
 </template>
 
 <script setup name="NoticeList">
+import { timestampFilter } from '@/utils/filter';
+
 const columns = [
   {
     colKey: 'title',
@@ -33,11 +46,12 @@ const columns = [
   {
     colKey: 'sendTime',
     title: '发送时间',
+    width: 180,
+    cell: 'send-time',
   },
 ];
-const { tableData, loading, pagination, onChange } = defineProps([
+const { tableData, pagination, onChange } = defineProps([
   'tableData',
-  'loading',
   'pagination',
   'onChange',
 ]);
@@ -46,5 +60,3 @@ const open = (row) => {
   emit('open', row);
 };
 </script>
-
-<style lang="less" scoped></style>

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

@@ -19,6 +19,8 @@
           defaultCurrent: 1,
           defaultPageSize: 10,
           onChange,
+          showJumper: true,
+          showPageSize: false,
           total: pagination.total,
           current: pagination.pageNumber,
         }"

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

@@ -33,6 +33,8 @@
           defaultCurrent: 1,
           defaultPageSize: 10,
           onChange,
+          showJumper: true,
+          showPageSize: false,
           total: pagination.total,
           current: pagination.pageNumber,
         }"