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
| <template>
| <el-dialog v-model="visible" title="操作日志" width="1100px" destroy-on-close>
| <div class="log-container">
| <avue-crud ref="crudRef" :data="tableData" :option="tableOption" :table-loading="loading">
| <!-- <template #type="{ row }">
| <el-tag :type="getTypeTag(row.type)">
| {{ row.typeDesc || row.type }}
| </el-tag>
| </template> -->
| </avue-crud>
| </div>
| <template #footer>
| <el-button @click="visible = false">关 闭</el-button>
| </template>
| </el-dialog>
| </template>
|
| <script setup lang="ts">
| import { ref } from 'vue';
| import { listReceivableFeeManagementLog} from "@/api/cwgl/receivableFeeManagementLog";
|
|
| const visible = ref(false);
| const loading = ref(false);
| const tableData = ref([]);
|
| const tableOption = {
| header: false,
| tip: false, // 隐藏“当前已选择”提示
| addBtn: false,
|
| editBtn: false,
| delBtn: false,
| menu: false, // 隐藏操作列
| border: true,
| stripe: true,
| column: [
| {
| label: '操作人',
| prop: 'operator',
| width: 120
| },
| {
| label: '操作时间',
| prop: 'operationTime',
| width: 180
| },
| // {
| // label: '操作类型',
| // prop: 'type',
| // slot: true, // 开启自定义插槽用于展示 Tag
| // width: 120
| // },
| {
| label: '操作描述',
| prop: 'operationDesc',
| overHidden: true // 内容过长时显示省略号
| },
| {
| label: '记录创建时间',
| prop: 'createTime',
| overHidden: true // 内容过长时显示省略号
| }
| ]
| };
|
| // 根据类型返回不同的 Tag 颜色
| const getTypeTag = (type: string) => {
| const map: Record<string, string> = {
| 'add': 'success',
| 'edit': 'warning',
| 'del': 'danger',
| 'import': 'info',
| 'export': 'primary'
| };
| return map[type] || '';
| };
|
| // 暴露给外部调用的打开方法
| const open = (logs: any[]) => {
| visible.value = true;
| loading.value = true;
| // 模拟异步加载
| setTimeout(() => {
| tableData.value = logs || [];
| loading.value = false;
| }, 300);
| };
|
| defineExpose({ open });
| </script>
|
| <style scoped>
| .log-container {
| padding: 10px 0;
| }
| </style>
|
|
