fix(视图): 修复表格在 http 环境下无法复制

core/frontend/src/views/chart/chart/common/common.js

@@ -1,6 +1,8 @@
 import { hexColorToRGBA } from '@/views/chart/chart/util'
 import { DEFAULT_XAXIS_STYLE, DEFAULT_YAXIS_EXT_STYLE, DEFAULT_YAXIS_STYLE } from '@/views/chart/chart/chart'
 import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
+import { $success } from '@/utils/message'
+import i18n from '@/lang'
 
 export function componentStyle(chart_option, chart) {
   let xAxisLabelFormatter = null
@@ -398,3 +400,26 @@ export const reverseColor = colorValue => {
   const str = '000000' + (0xFFFFFF - colorValue).toString(16)
   return '#' + str.substring(str.length - 6, str.length)
 }
+
+export const copyString = (content, notify) => {
+  const clipboard = navigator.clipboard || {
+    writeText: data => {
+      return new Promise(resolve => {
+        const inputDom = document.createElement('input')
+        inputDom.setAttribute('style', 'z-index: -1;position: fixed;opacity: 0;')
+        inputDom.setAttribute('type', 'text')
+        inputDom.setAttribute('value', data)
+        document.body.appendChild(inputDom)
+        inputDom.select()
+        document.execCommand('copy')
+        inputDom.remove()
+        resolve()
+      })
+    }
+  }
+  clipboard.writeText(content).then(() => {
+    if (notify) {
+      $success(i18n.t('commons.copy_success'))
+    }
+  })
+}

core/frontend/src/views/chart/chart/table/table-info.js

@@ -17,6 +17,7 @@ import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
 import { handleTableEmptyStrategy, hexColorToRGBA } from '@/views/chart/chart/util'
 import { maxBy, minBy, find } from 'lodash-es'
 import TableTooltip from '@/views/chart/components/table/TableTooltip.vue'
+import { copyString } from '@/views/chart/chart/common/common'
 
 class SortTooltip extends BaseTooltip {
   vueCom
@@ -1093,7 +1094,7 @@ function getTooltipPosition(event) {
   return result
 }
 
-function copyContent(s2Instance, event, fieldMap) {
+function copyContent(s2Instance, event, fieldMeta) {
   event.preventDefault()
   const cell = s2Instance.getCell(event.target)
   const valueField = cell.getMeta().valueField
@@ -1102,7 +1103,7 @@ function copyContent(s2Instance, event, fieldMap) {
   // 单元格
   if (cellMeta?.data) {
     const value = cellMeta.data[valueField]
-    const metaObj = find(fieldMap, m =>
+    const metaObj = find(fieldMeta, m =>
       m.field === valueField
     )
     content = value?.toString()
@@ -1112,11 +1113,15 @@ function copyContent(s2Instance, event, fieldMap) {
   } else {
     // 列头&行头
     content = cellMeta.value
+    const fieldMap = fieldMeta?.reduce((p, n) => {
+      p[n.field] = n.name
+      return p
+    },{})
     if (fieldMap?.[content]) {
       content = fieldMap[content]
     }
   }
   if (content) {
-    navigator.clipboard.writeText(content)
+    copyString(content, true)
   }
 }

core/frontend/src/views/chart/components/table/TableNormal.vue

@@ -114,6 +114,7 @@ import { DEFAULT_COLOR_CASE, DEFAULT_SCROLL, DEFAULT_SIZE, NOT_SUPPORT_PAGE_DATA
 import { mapState } from 'vuex'
 import DePagination from '@/components/deCustomCm/pagination.js'
 import ViewTrackBar from '@/components/canvas/components/editor/ViewTrackBar.vue'
+import { copyString } from '@/views/chart/chart/common/common'
 export default {
   name: 'TableNormal',
   components: { ViewTrackBar, DePagination },
@@ -502,6 +503,13 @@ export default {
           this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
         }
       }
+      if (this.showSummary) {
+        const footerArr = this.$refs.tableContainer.getElementsByClassName('elx-footer--row')
+        if (footerArr.length) {
+          const footer = footerArr.item(0)
+          footer.addEventListener('contextmenu', this.summaryRightClick)
+        }
+      }
     },
     getRowStyle({ row, rowIndex }) {
       if (rowIndex % 2 !== 0) {
@@ -658,10 +666,29 @@ export default {
     },
     cellRightClick(event) {
       if (event.target?.innerText) {
-        navigator.clipboard.writeText(event.target.innerText)
+        copyString(event.target.innerText, true)
       }
       event.preventDefault()
     },
+    summaryRightClick(event) {
+      let targetDom
+      if (event.target.classList.contains('elx-cell--item')) {
+        targetDom = event.target
+      }
+      if (!targetDom) {
+        const tmp = event.target.getElementsByClassName('elx-cell--item')
+        if (tmp.length) {
+          targetDom = tmp.item(0)
+        }
+      }
+      if (targetDom) {
+        const content = targetDom.innerText
+        if (content?.trim()) {
+          copyString(content, true)
+        }
+        event.preventDefault()
+      }
+    },
     antVActionPost(dimensionList, name, param) {
       this.pointParam = {
         data: {