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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
| <template>
| <AppContainer>
| <ProTableV2
| :columns="columns"
| :show-pagination="false"
| :table-data="dbAuditLogs"
| :column-render-map="columnsRenderProps"
| >
| <template #oldValues="{ row }">
| <el-button
| type="primary"
| link
| @click="handleAdd({ json: { oldValues: JSON.parse(row.oldValues) } })"
| >查看</el-button
| >
| </template>
| <template #newValues="{ row }">
| <el-button
| type="primary"
| link
| @click="handleAdd({ json: { newValues: JSON.parse(row.newValues) } })"
| >查看</el-button
| >
| </template>
| <template #createdUser="{ row }">
| <el-button
| type="primary"
| link
| @click="handleAdd({ json: { createdUser: JSON.parse(JSON.stringify(row.createdUser)) } })"
| >查看</el-button
| >
| </template>
| </ProTableV2>
| <JsonViewerDialog v-bind="dialogProps" />
| </AppContainer>
| </template>
|
| <script setup lang="ts">
| import {
| AppContainer,
| ProTableV2,
| defineColumns,
| ProTableV2Props,
| useFormDialog,
| defineOperationBtns,
| } from '@bole-core/components';
| import JsonViewerDialog from './JsonViewerDialog.vue';
|
| defineOptions({
| name: 'DbAuditLogsView',
| });
|
| type Props = {
| dbAuditLogs: API.GetDbAuditLogsQueryResultItem[];
| };
| const activeName = ref('1');
| const props = withDefaults(defineProps<Props>(), {
| dbAuditLogs: () => [] as API.GetDbAuditLogsQueryResultItem[],
| });
|
| const columns = defineColumns(
| [
| 'tableName',
| 'primaryKey',
| 'operate',
| 'oldValues',
| 'newValues',
| 'createdUser',
| 'createdTime',
| ].map((x, index) => ({
| id: index + '',
| enCode: x,
| name: x,
| }))
| );
|
| const operationBtns = defineOperationBtns([
| {
| data: {
| enCode: 'detailBtn',
| name: '查看',
| },
| emits: {
| onClick: (role) => openDialog(role),
| },
| },
| ]);
|
| const columnsRenderProps: ProTableV2Props['columnRenderMap'] = {
| operate: { type: 'enum', valueEnum: EnumDbAuditOperateText },
| createdTime: { type: 'date', format: 'YYYY-MM-DD HH:mm:ss' },
| };
|
| const { dialogProps, handleAdd } = useFormDialog({
| defaultFormParams: {
| json: null,
| },
| });
|
| function openDialog(row: API.GetDbAuditLogsQueryResultItem) {
| handleAdd({
| json: {
| oldValues: JSON.parse(row.oldValues),
| newValues: JSON.parse(row.newValues),
| createdUser: JSON.parse(JSON.stringify(row.createdUser)),
| },
| });
| }
| </script>
|
| <style lang="scss" scoped>
| @use '@/style/common.scss' as *;
| </style>
|
|
