Jelajahi Sumber

fix(bugs): 冲突

tangning 3 tahun lalu
induk
melakukan
33caf57ba5
1 mengubah file dengan 230 tambahan dan 0 penghapusan
  1. 230 0
      src/views/staff/list.vue

+ 230 - 0
src/views/staff/list.vue

@@ -0,0 +1,230 @@
+<template>
+  <div class="p-4">
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handleCreate">新增</a-button>
+      </template>
+      <template #role="{ record }">
+        {{ renderRoleType(record.role) }}
+      </template>
+      <template #status="{ record }">
+        {{ renderStatus(record.status) }}
+      </template>
+      <template #createTime="{ record }">
+        <Time :value="record.createTime" mode="datetime" />
+      </template>
+      <!-- {
+        label: t('routes.staff.setpaswd'),
+        onClick: handleOpenModal.bind(null, record),
+      }, -->
+      <template #action="{ record }">
+        <TableAction
+          :actions="[
+            {
+              label: '编辑',
+              icon: 'mdi:information-outline',
+              onClick: handleEdit.bind(null, record),
+            },
+            {
+              label: '删除',
+              color: 'error',
+              icon: 'ant-design:delete-outlined',
+              onClick: handleDelete.bind(null, record),
+            },
+          ]"
+        />
+      </template>
+    </BasicTable>
+    <DetailsModal @register="registerDetail" @ok="reload" />
+    <SetpaswordModal @register="register" @reload="reload" />
+    <DelListModal @register="registerDelList" @reload="reload" />
+  </div>
+</template>
+<script lang="ts">
+  import { defineComponent } from 'vue';
+  import { BasicTable, useTable, BasicColumn, FormProps, TableAction } from '/@/components/Table';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useModal } from '/@/components/Modal';
+  import { uploadApi } from '/@/api/sys/upload';
+  import SetpaswordModal from './setpaswordModal.vue';
+  import DetailsModal from './detailsModal.vue';
+  import DelListModal from './delListModal.vue';
+  // import { Switch } from 'ant-design-vue';
+  // import { h } from 'vue';
+  import { ListApi, delApi, preDelApi } from '/@/api/staff/list';
+  import { useI18n } from '/@/hooks/web/useI18n';
+  // import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
+  import { useGo } from '/@/hooks/web/usePage';
+  import { Time } from '/@/components/Time';
+  export default defineComponent({
+    components: { BasicTable, TableAction, Time, SetpaswordModal, DetailsModal, DelListModal },
+    setup() {
+      const [register, { openModal }] = useModal();
+      const [registerDetail, { openModal: openDetaileModal }] = useModal();
+      const [registerDelList, { openModal: openDelListeModal }] = useModal();
+      const { createConfirm, createMessage } = useMessage();
+      const go = useGo();
+      const { t } = useI18n();
+      const columns: BasicColumn[] = [
+        {
+          title: 'ID',
+          dataIndex: 'id',
+          fixed: 'left',
+          width: 60,
+        },
+        {
+          title: t('routes.staff.deptName'),
+          dataIndex: 'companyName',
+          width: 160,
+        },
+        {
+          title: t('routes.staff.userName'),
+          dataIndex: 'userName',
+          width: 80,
+        },
+        {
+          title: t('routes.staff.nickName'),
+          dataIndex: 'nickName',
+          width: 80,
+        },
+        {
+          title: '手机',
+          dataIndex: 'phone',
+          width: 160,
+        },
+
+        {
+          title: t('common.roleName'),
+          dataIndex: 'roleName',
+          // slots: { customRender: 'role' },
+          sorter: true,
+          width: 80,
+        },
+        {
+          title: t('common.state'),
+          dataIndex: 'status',
+          slots: { customRender: 'status' },
+          // sorter: true,
+          width: 80,
+        },
+
+        {
+          title: t('routes.staff.createTime'),
+          dataIndex: 'createTime',
+          slots: { customRender: 'createTime' },
+          width: 130,
+        },
+        {
+          title: '操作',
+          dataIndex: '',
+          slots: { customRender: 'action' },
+          fixed: 'right',
+          width: 140,
+        },
+      ];
+
+      const searchForm: Partial<FormProps> = {
+        labelWidth: 100,
+        schemas: [
+          {
+            field: 'staffName',
+            label: t('routes.corporation.phone'),
+            component: 'Input',
+            colProps: {
+              xl: 5,
+              xxl: 5,
+            },
+          },
+        ],
+      };
+
+      const [registerTable, { reload }] = useTable({
+        title: t('routes.staff.staffList'),
+        api: ListApi,
+        columns: columns,
+        useSearchForm: true,
+        formConfig: searchForm,
+        showTableSetting: true,
+        tableSetting: { fullScreen: true },
+        showIndexColumn: false,
+        rowKey: 'id',
+        pagination: { pageSize: 20 },
+        bordered: true,
+        sortFn: (sortInfo) => {
+          return { ...sortInfo, sidx: sortInfo.field, order: sortInfo.order.replace('end', '') };
+        },
+      });
+
+      function renderRoleType(type: number): string {
+        switch (type) {
+          case 0:
+            return t('routes.staff.roleType.0');
+          case 1:
+            return t('routes.staff.roleType.1');
+          default:
+            return '';
+        }
+      }
+      function renderStatus(type: number): string {
+        switch (type) {
+          case 1:
+            return t('common.normal');
+          case 0:
+            return t('common.unNormal');
+          default:
+            return '';
+        }
+      }
+      function handleOpenModal(record: Recordable) {
+        openModal(true, record);
+      }
+      function handleCreate() {
+        openDetaileModal(true);
+      }
+      function handleEdit(record: Recordable) {
+        openDetaileModal(true, record);
+      }
+      async function handleDelete(record) {
+        let check = await preDelApi(record.id); //
+        console.log('https://cszfb.4dkankan.com', check);
+        if (Array.isArray(check)) {
+          return openDelListeModal(true, {
+            ...record,
+            option: check,
+          });
+        }
+        handDelconfirm(record);
+      }
+      function handDelconfirm(record) {
+        createConfirm({
+          iconType: 'warning',
+          title: '警告',
+          content: `此操作将对${record.userName}进行删除, 是否继续?`,
+          onOk: async () => {
+            await delApi(record.id);
+            reload();
+          },
+        });
+      }
+      return {
+        registerTable,
+        registerDetail,
+        registerDelList,
+        openDelListeModal,
+        createMessage,
+        handDelconfirm,
+        t,
+        reload,
+        go,
+        renderRoleType,
+        renderStatus,
+        handleCreate,
+        handleOpenModal,
+        register,
+        handleEdit,
+        handleDelete,
+        uploadApi: uploadApi as any,
+      };
+    },
+  });
+</script>