车间能级提升-智能设备管理系统
zhuguifei
2025-02-28 74448f9a9f1f8cb779023db3ea9eda762fc6ad0a
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<script setup lang="ts">
import { watch } from 'vue';
 
import { useVbenVxeGrid, type VxeGridProps, vxeSortEvent } from '#/adapter/vxe-table';
import { listRepairRecord } from '#/api/eims/repair-record';
 
import { columns } from '../repair-record/data';
 
interface Props {
  reqId?: string;
  resId?: string;
}
 
const props = defineProps<Props>();
 
const gridOptions: VxeGridProps = {
  checkboxConfig: {
    // 高亮
    highlight: true,
    // 翻页时保留选中状态
    reserve: true
    // 点击行选中
    // trigger: 'row'
  },
  columns,
  height: 'auto',
  keepSource: true,
  pagerConfig: {},
  proxyConfig: {
    ajax: {
      query: async ({ page }, formValues = {}) => {
        if (props.reqId) {
          const params = { reqId: props.reqId };
          Object.assign(formValues, params);
        } else if (props.resId) {
          const params = { resId: props.resId };
          Object.assign(formValues, params);
        } else {
          const params = { resId: -1 };
          Object.assign(formValues, params);
        }
        return await listRepairRecord({
          pageNum: page.currentPage,
          pageSize: page.pageSize,
          ...formValues
          // ...useRoleBaseFilters()
        });
      }
    }
  },
  rowConfig: {
    isHover: true,
    keyField: 'id'
  },
  sortConfig: {
    // 远程排序
    remote: true,
    // 支持多字段排序 默认关闭
    multiple: true
  },
  id: 'eims-repair-record-index'
};
 
const [BasicTable, tableApi] = useVbenVxeGrid({
  gridOptions,
  gridEvents: {
    sortChange: (sortParams) => vxeSortEvent(tableApi, sortParams)
  }
});
 
// 使用 watch 监听 resId 的变化
watch(
  () => props.reqId,
  (newVal, oldVal) => {
    if (newVal !== oldVal && newVal) {
      tableApi.query();
    }
  },
  { immediate: false }
);
 
// 使用 watch 监听 resId 的变化
watch(
  () => props.resId,
  (newVal, oldVal) => {
    if (newVal !== oldVal && newVal) {
      tableApi.query();
    }
  },
  { immediate: false }
);
</script>
 
<template>
  <div class="w-full">
    <BasicTable table-title="操作记录" />
  </div>
</template>