操作记录页面显示优化

Signed-off-by: TanYibin <5491541@qq.com>

操作记录页面显示优化
Signed-off-by: TanYibin <5491541@qq.com>
谭毅彬
1 parent beb33c45
Showing 1 changed file with 38 additions and 36 deletions
ant-design-vue-jeecg/src/views/system/monitor/OperationLog.vue
@@ -75,24 +75,17 @@
         class="j-table-force-nowrap"
         @change="handleTableChange">
  
-        <template slot="htmlSlot" slot-scope="text">
-          <div v-html="text"></div>
-        </template>
-        <template slot="imgSlot" slot-scope="text">
-          <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
-          <img v-else :src="getImgView(text)" height="25px" alt=""
-               style="max-width:80px;font-size: 12px;font-style: italic;"/>
-        </template>
-        <template slot="fileSlot" slot-scope="text">
-          <span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
-          <a-button
-            v-else
-            :ghost="true"
-            type="primary"
-            icon="download"
-            size="small"
-            @click="downloadFile(text)">下载
-          </a-button>
+        <template :slot="expandedRowRender" slot-scope="record">
+          <div style="margin: 0">
+            <div v-if="record.contentReturn">
+              <a-button @click="copyToClipboard(record.contentReturn)" type="link" icon="copy" style="vertical-align: revert;"></a-button>
+              <span style="vertical-align: initial; word-break:break-all; white-space:pre-wrap; overflow:hidden; color:#0066CC;">方法响应内容：{{ record.contentReturn }}</span>
+            </div>
+            <div v-if="record.contentException">
+              <a-button @click="copyToClipboard(record.contentException)" type="link" icon="copy" style="vertical-align: revert;"></a-button>
+              <span style="vertical-align: initial; word-break:break-all; white-space:pre-wrap; overflow:hidden; color:red">方法异常内容：{{ record.contentException }}</span>
+            </div>
+          </div>
         </template>
  
         <span slot="action" slot-scope="text, record">
@@ -113,6 +106,7 @@ import {mixinDevice} from &#39;@/utils/mixin&#39;
 import {JeecgListMixin} from '@/mixins/JeecgListMixin'
 import OperationLogModal from './modules/OperationLogModal'
 import JEllipsis from "@comp/jeecg/JEllipsis"
+import ClipboardJS from 'clipboard'
  
 export default {
   name: 'OperationLogList',
@@ -150,32 +144,19 @@ export default {
           customRender: (t) => ellipsis1(t)
         },
         {
-          title: '操作时间',
-          align: "center",
-          dataIndex: 'operationTime'
-        },
-        {
-          title: '操作耗时',
-          align: "center",
-          dataIndex: 'operationCostTime'
-        },
-        {
-          title: '操作人姓名',
+          title: '操作人',
           align: "center",
           dataIndex: 'operatorName'
         },
         {
-          title: '操作结果状态',
+          title: '操作时间',
           align: "center",
-          dataIndex: 'operationStatus_dictText'
+          dataIndex: 'operationTime'
         },
         {
-          title: '操作',
-          dataIndex: 'action',
+          title: '操作耗时',
           align: "center",
-          fixed: "right",
-          width: 80,
-          scopedSlots: {customRender: 'action'}
+          dataIndex: 'operationCostTime'
         }
       ],
       url: {
@@ -188,17 +169,38 @@ export default {
       },
       dictOptions: {},
       superFieldList: [],
+      expandedRowRender: undefined
     }
   },
   created() {
     this.getSuperFieldList();
   },
+  mounted() {
+    this.expandedRowRender = "expandedRowRender";
+  },
   computed: {
     importExcelUrl: function () {
       return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
     },
   },
   methods: {
+    copyToClipboard(content) {
+      const clipboard = new ClipboardJS('.copy-button', {
+        text: () => content
+      });
+
+      clipboard.on('success', () => {
+        clipboard.destroy();
+        this.$message.success('已复制到剪贴板');
+      });
+
+      clipboard.on('error', () => {
+        clipboard.destroy();
+        this.$message.error('复制失败');
+      });
+
+      clipboard.onClick(event); // 添加这一行来触发点击事件
+    },
     getQueryParams() {
       // 重写查询条件
       let sqp = {}