车间能级提升-智能设备管理系统
zhuguifei
2025-03-18 f8a7078cfaf8f4106f1081856260eae55a3a2579
eims-ui/apps/web-antd/src/views/eims/insp-st/index.vue
@@ -1,13 +1,16 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import { onMounted, ref } from 'vue';
import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
import { $t } from '@vben/locales';
import { addFullName, getPopupContainer, getVxePopupContainer } from '@vben/utils';
import { Modal, Popconfirm, Space } from 'ant-design-vue';
import { Button, Modal, Popconfirm, Space } from 'ant-design-vue';
import { useVbenVxeGrid, vxeCheckboxChecked, type VxeGridProps, vxeSortEvent } from '#/adapter/vxe-table';
import { delMaintOrder, listMaintOrderGroupDetail } from '#/api/eims/maint-order';
import { listInspStRecord } from '#/api/eims/insp-record';
import { delInspectSt, listInspectSt } from '#/api/eims/insp-st';
import { getDeptTree, userList } from '#/api/system/user';
import BasisSubTable from '#/views/eims/components/basis-sub-table.vue';
@@ -15,13 +18,22 @@
import { columns, querySchema } from './data';
import inspStDrawer from './insp-st-drawer.vue';
import type { Recordable } from '@vben/types';
import { $t } from '@vben/locales';
defineExpose({
  tableSelect
});
/**
 * 视图模式
 * day-根据日汇总
 * month-根据月汇总
 */
enum ViewMode {
  Day = 'Day',
  Month = 'Month'
}
const curViewMode = ref<ViewMode>(ViewMode.Month);
const formOptions: VbenFormProps = {
  commonConfig: {
    labelWidth: 80,
@@ -32,6 +44,14 @@
  collapsed: true,
  schema: querySchema(),
  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
  handleReset: async () => {
    // eslint-disable-next-line no-use-before-define
    const { formApi, reload } = tableApi;
    await formApi.resetForm();
    const formValues = formApi.form.values;
    formApi.setLatestSubmissionValues(formValues);
    await reload(formValues);
  },
  // 日期选择格式化
  fieldMappingTime: [['planTime', ['params[beginPlanTime]', 'params[endPlanTime]'], ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59']]]
};
@@ -52,6 +72,8 @@
  proxyConfig: {
    ajax: {
      query: async ({ page }, formValues = {}) => {
        const params = { 'viewMode': curViewMode.value };
        Object.assign(formValues, params);
        return await listInspectSt({
          pageNum: page.currentPage,
          pageSize: page.pageSize,
@@ -72,6 +94,46 @@
  },
  id: 'insp-st-index'
};
const fieldsToExclude = new Set(['action', 'inspTime', 'maintUserNames', 'specialNote', 'status']);
const gridOptions2: VxeGridProps = {
  checkboxConfig: {
    // 高亮
    highlight: true,
    // 翻页时保留选中状态
    reserve: true
    // 点击行选中
    // trigger: 'row'
  },
  columns: columns?.filter((column: any) => !fieldsToExclude.has(column?.field)),
  height: 'auto',
  keepSource: true,
  pagerConfig: {},
  proxyConfig: {
    ajax: {
      query: async ({ page }, formValues = {}) => {
        const params = { 'viewMode': curViewMode.value };
        Object.assign(formValues, params);
        return await listInspectSt({
          pageNum: page.currentPage,
          pageSize: page.pageSize,
          ...formValues
        });
      }
    }
  },
  rowConfig: {
    isHover: true,
    keyField: 'id'
  },
  sortConfig: {
    // 远程排序
    remote: true,
    // 支持多字段排序 默认关闭
    multiple: true
  },
  id: 'insp-st-index'
};
const recordId = ref<string>();
const [BasicTable, tableApi] = useVbenVxeGrid({
  formOptions,
@@ -80,7 +142,7 @@
    sortChange: (sortParams) => vxeSortEvent(tableApi, sortParams),
    cellClick: (e: any) => {
      const { row } = e;
      recordId.value = `${row.equId}_${row.planTime}`;
      recordId.value = `${row.equId}_${row.planTime}_${curViewMode.value}`;
    }
  }
});
@@ -151,15 +213,16 @@
    }
  ]);
}
const [InspStDrawer, inspStDrawerApi] = useVbenDrawer({
  connectedComponent: inspStDrawer
});
async function handleEdit(record: Recordable<any>) {
  inspStDrawerApi.setData({ id: record.id });
  inspStDrawerApi.open();
}
async function handleDelete(row: Recordable<any>) {
  await delInspectSt(row.id);
  await tableApi.query();
@@ -187,6 +250,24 @@
function tableSelect() {
  return tableApi.grid.getCheckboxRecords();
}
const dayBtn = ref<any>('default');
const monBtn = ref<any>('primary');
function queryData(type: ViewMode) {
  if (type === ViewMode.Day) {
    dayBtn.value = 'primary';
    monBtn.value = 'default';
    curViewMode.value = ViewMode.Day;
    tableApi.setGridOptions(gridOptions2);
  } else if (type === ViewMode.Month) {
    dayBtn.value = 'default';
    monBtn.value = 'primary';
    curViewMode.value = ViewMode.Month;
    tableApi.setGridOptions(gridOptions);
  }
  tableApi.query();
}
</script>
<template>
@@ -194,7 +275,9 @@
    <div class="flex h-full gap-[8px] flex-col">
      <BasicTable class="h-2/3" table-title="点检记录列表">
        <template #toolbar-tools>
          <Space >
          <Space>
            <Button :type="dayBtn" @click.stop="queryData(ViewMode.Day)">日视图</Button>
            <Button :type="monBtn" @click.stop="queryData(ViewMode.Month)">月视图</Button>
            <a-button
              :disabled="!vxeCheckboxChecked(tableApi)"
              danger
@@ -225,16 +308,9 @@
            </Popconfirm>
          </Space>
        </template>
      </BasicTable>
      <BasisSubTable
        :columns="recordCol"
        :list-api="listMaintOrderGroupDetail"
        :req-value="recordId"
        class="h-1/3"
        req-key="maintCode"
        title="保养实施项目"
      />
      <BasisSubTable :columns="recordCol" :list-api="listInspStRecord" :req-value="recordId" class="h-1/3"
                     req-key="inspCode" title="点检记录" />
    </div>
    <InspStDrawer @reload="tableApi.query()" />
  </Page>