Merge branch 'dev' into pr@dev_memory_component

2026-05-23 22:08:34 +08:00 · 2022-11-30 11:48:59 +08:00
parent c33d78cf4d b3da2200d5
commit d76045727d
48 changed files with 253 additions and 53 deletions
--- a/frontend/src/components/canvas/components/editor/CanvasOptBar.vue
+++ b/frontend/src/components/canvas/components/editor/CanvasOptBar.vue
@@ -106,6 +106,7 @@ export default {
      this.$router.back(-1)
    },
    exportPDF() {
+      this.$refs['widget-div'].style.display = ''
      this.$emit('link-export-pdf')
    },
    setWidgetStatus() {
--- a/frontend/src/components/canvas/components/editor/ComponentWrapper.vue
+++ b/frontend/src/components/canvas/components/editor/ComponentWrapper.vue
@@ -13,6 +13,7 @@
      :canvas-id="canvasId"
      :chart="chart"
      :show-position="showPosition"
+      :series-id-map="seriesIdMap"
      @showViewDetails="showViewDetails"
    />
    <div
@@ -149,7 +150,10 @@ export default {
  data() {
    return {
      previewVisible: false,
-      chart: null
+      chart: null,
+      seriesIdMap: {
+        id: ''
+      }
    }
  },
  computed: {
@@ -312,9 +316,14 @@ export default {
      }
    },
    clearHandler() {
-      if (this.$refs.deOutWidget && this.$refs.deOutWidget.clearHandler) {
+      if (this.$refs.deOutWidget?.clearHandler) {
        this.$refs.deOutWidget.clearHandler()
      }
+    },
+    responseResetButton() {
+      if (this.$refs.wrapperChild?.responseResetButton) {
+        this.$refs.wrapperChild.responseResetButton()
+      }
    }
  }
 }
--- a/frontend/src/components/canvas/components/editor/DeEditor.vue
+++ b/frontend/src/components/canvas/components/editor/DeEditor.vue
@@ -1106,6 +1106,11 @@ export default {
    },
    triggerResetButton() {
      this.triggerSearchButton(true)
+      this.$refs['wrapperChild']?.forEach(item => {
+        if (item?.['responseResetButton']) {
+          item.responseResetButton()
+        }
+      })
    },
    refreshButtonInfo(isClear = false) {
      const result = this.buildButtonFilterMap(this.componentData, isClear)
--- a/frontend/src/components/canvas/components/editor/EditBar.vue
+++ b/frontend/src/components/canvas/components/editor/EditBar.vue
@@ -144,6 +144,7 @@
      <map-layer-controller
        v-if="chart && showMapLayerController"
        :chart="chart"
+        :series-id-map="seriesIdMap"
      />
    </div>

@@ -239,6 +240,14 @@ export default {
    chart: {
      type: Object,
      default: null
+    },
+    seriesIdMap: {
+      type: Object,
+      default: () => {
+        return {
+          id: ''
+        }
+      }
    }
  },
  data() {
--- a/frontend/src/components/canvas/components/editor/Preview.vue
+++ b/frontend/src/components/canvas/components/editor/Preview.vue
@@ -95,6 +95,49 @@
        @closePreExport="closePreExport"
      />
    </el-dialog>
+
+    <!--视图详情-->
+    <el-dialog
+      :visible.sync="chartDetailsVisible"
+      width="80%"
+      class="dialog-css"
+      :destroy-on-close="true"
+      :show-close="true"
+      :append-to-body="false"
+      top="5vh"
+    >
+      <span
+        v-if="chartDetailsVisible"
+        style="position: absolute;right: 70px;top:15px"
+      >
+        <el-button
+          v-if="showChartInfoType==='enlarge' && showChartInfo && showChartInfo.type !== 'symbol-map'"
+          class="el-icon-picture-outline"
+          size="mini"
+          @click="exportViewImg"
+        >
+          {{ $t('chart.export_img') }}
+        </el-button>
+        <el-button
+          v-if="showChartInfoType==='details'"
+          size="mini"
+          @click="exportExcel"
+        >
+          <svg-icon
+            icon-class="ds-excel"
+            class="ds-icon-excel"
+          />{{ $t('chart.export') }}Excel
+        </el-button>
+      </span>
+      <user-view-dialog
+        v-if="chartDetailsVisible"
+        ref="userViewDialog-canvas-main"
+        :chart="showChartInfo"
+        :chart-table="showChartTableInfo"
+        :canvas-style-data="canvasStyleData"
+        :open-type="showChartInfoType"
+      />
+    </el-dialog>
  </div>
 </template>

@@ -117,10 +160,11 @@ import html2canvas from 'html2canvasde'
 import { queryAll } from '@/api/panel/pdfTemplate'
 import PDFPreExport from '@/views/panel/export/PDFPreExport'
 import { listenGlobalKeyDownPreview } from '@/components/canvas/utils/shortcutKey'
+import UserViewDialog from '@/components/canvas/customComponent/UserViewDialog'

 const erd = elementResizeDetectorMaker()
 export default {
-  components: { ComponentWrapper, CanvasOptBar, PDFPreExport },
+  components: { UserViewDialog, ComponentWrapper, CanvasOptBar, PDFPreExport },
  model: {
    prop: 'show',
    event: 'change'
@@ -189,6 +233,10 @@ export default {
  },
  data() {
    return {
+      chartDetailsVisible: false,
+      showChartInfo: {},
+      showChartTableInfo: {},
+      showChartInfoType: 'details',
      mainHeightCount: null,
      userInfo: null,
      previewMainDomId: 'preview-main-' + this.canvasId,
@@ -381,6 +429,7 @@ export default {
    if (this.terminal === 'mobile') {
      this.initMobileCanvas()
    }
+    this.canvasId === 'canvas-main' && bus.$on('pcChartDetailsDialog', this.openChartDetailsDialog)
    bus.$on('trigger-search-button', this.triggerSearchButton)
    bus.$on('trigger-reset-button', this.triggerResetButton)
    this.initPdfTemplate()
@@ -389,10 +438,19 @@ export default {
    erd.uninstall(this.$refs[this.previewTempRefId])
    erd.uninstall(this.$refs[this.previewRefId])
    clearInterval(this.timer)
+    this.canvasId === 'canvas-main' && bus.$off('pcChartDetailsDialog', this.openChartDetailsDialog)
    bus.$off('trigger-search-button', this.triggerSearchButton)
    bus.$off('trigger-reset-button', this.triggerResetButton)
  },
  methods: {
+    openChartDetailsDialog(paramInfo) {
+      if (this.canvasId === 'canvas-main') {
+        this.showChartInfo = paramInfo.showChartInfo
+        this.showChartTableInfo = paramInfo.showChartTableInfo
+        this.showChartInfoType = paramInfo.showChartInfoType
+        this.chartDetailsVisible = true
+      }
+    },
    initWatermark(waterDomId = 'preview-main-canvas-main') {
      if (this.panelInfo.watermarkInfo && this.canvasId === 'canvas-main') {
        if (this.userInfo) {
@@ -410,6 +468,11 @@ export default {
    },
    triggerResetButton() {
      this.triggerSearchButton(true)
+      this.$refs['viewWrapperChild']?.forEach(item => {
+        if (item?.responseResetButton) {
+          item.responseResetButton()
+        }
+      })
    },
    triggerSearchButton(isClear = false) {
      const result = this.buildButtonFilterMap(this.componentData, isClear)
@@ -585,10 +648,10 @@ export default {
      }
    },
    exportExcel() {
-      this.$refs['userViewDialog'].exportExcel()
+      this.$refs['userViewDialog-canvas-main'].exportExcel()
    },
    exportViewImg() {
-      this.$refs['userViewDialog'].exportViewImg()
+      this.$refs['userViewDialog-canvas-main'].exportViewImg()
    },
    deselectCurComponent(e) {
      if (!this.isClickComponent) {
--- a/frontend/src/components/canvas/customComponent/UserView.vue
+++ b/frontend/src/components/canvas/customComponent/UserView.vue
@@ -232,6 +232,11 @@ export default {
    ChartComponentG2
  },
  props: {
+    inScreen: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
    canvasId: {
      type: String,
      required: true
@@ -469,7 +474,7 @@ export default {
    },
    'cfilters': {
      handler: function(val1, val2) {
-        if ((isChange(val1, val2) || isChange(val1, this.filters)) && !this.isFirstLoad) {
+        if (isChange(val1, val2) && !this.isFirstLoad) {
          this.getData(this.element.propValue.viewId)
        }
      },
@@ -555,6 +560,11 @@ export default {
    }
  },
  methods: {
+    responseResetButton() {
+      if (!this.cfilters?.length) {
+        this.getData(this.element.propValue.viewId, false)
+      }
+    },
    exportExcel() {
      this.$refs['userViewDialog'].exportExcel()
    },
@@ -871,7 +881,13 @@ export default {
      this.showChartInfo = this.chart
      this.showChartTableInfo = tableChart
      this.showChartInfoType = params.openType
-      if (this.terminal === 'pc') {
+      if (!this.inScreen) {
+        bus.$emit('pcChartDetailsDialog', {
+          showChartInfo: this.showChartInfo,
+          showChartTableInfo: this.showChartTableInfo,
+          showChartInfoType: this.showChartInfoType
+        })
+      } else if (this.terminal === 'pc') {
        this.chartDetailsVisible = true
      } else {
        this.mobileChartDetailsVisible = true
--- a/frontend/src/components/canvas/store/layer.js
+++ b/frontend/src/components/canvas/store/layer.js
@@ -1,9 +1,11 @@
-import { toBottom, toTop, moveUp, moveDown } from '@/components/canvas/utils/utils'
+import { findCurComponentIndex, moveDown, moveUp, toBottom, toTop } from '@/components/canvas/utils/utils'
 import toast from '@/components/canvas/utils/toast'

 export default {
  mutations: {
-    upComponent({ componentData, curComponentIndex }) {
+
+    upComponent({ componentData, curComponent }) {
+      const curComponentIndex = findCurComponentIndex(componentData, curComponent)
      // 上移图层 index，表示元素在数组中越往后
      if (curComponentIndex < componentData.length - 1) {
        moveUp(componentData, curComponentIndex)
@@ -12,7 +14,8 @@ export default {
      }
    },

-    downComponent({ componentData, curComponentIndex }) {
+    downComponent({ componentData, curComponent }) {
+      const curComponentIndex = findCurComponentIndex(componentData, curComponent)
      // 下移图层 index，表示元素在数组中越往前
      if (curComponentIndex > 0) {
        moveDown(componentData, curComponentIndex)
@@ -21,14 +24,16 @@ export default {
      }
    },

-    topComponent({ componentData, curComponentIndex }) {
+    topComponent({ componentData, curComponent }) {
+      const curComponentIndex = findCurComponentIndex(componentData, curComponent)
      // 置顶
      if (curComponentIndex < componentData.length - 1) {
        toTop(componentData, curComponentIndex)
      }
    },

-    bottomComponent({ componentData, curComponentIndex }) {
+    bottomComponent({ componentData, curComponent }) {
+      const curComponentIndex = findCurComponentIndex(componentData, curComponent)
      // 置底
      if (curComponentIndex > 0) {
        toBottom(componentData, curComponentIndex)
--- a/frontend/src/components/canvas/utils/utils.js
+++ b/frontend/src/components/canvas/utils/utils.js
@@ -246,3 +246,15 @@ export function getNowCanvasComponentData(canvasId, showPosition) {
    return store.state.componentData.filter(item => item.canvasId === canvasId)
  }
 }
+
+export function findCurComponentIndex(componentData, curComponent) {
+  let curIndex = 0
+  for (let index = 0; index < componentData.length; index++) {
+    const element = componentData[index]
+    if (element.id && element.id === curComponent.id) {
+      curIndex = index
+      break
+    }
+  }
+  return curIndex
+}
--- a/frontend/src/components/dataease/DeOutWidget.vue
+++ b/frontend/src/components/dataease/DeOutWidget.vue
@@ -2,7 +2,7 @@
  <div
    ref="myContainer"
    class="my-container"
-    :style="autoStyle"
+    :style="inScreen?autoStyle:''"
  >
    <div
      ref="conditionMain"
--- a/frontend/src/components/deDrag/index.vue
+++ b/frontend/src/components/deDrag/index.vue
@@ -40,6 +40,7 @@
        :canvas-id="canvasId"
        :element="element"
        :chart="chart"
+        :series-id-map="seriesIdMap"
        @showViewDetails="showViewDetails"
        @amRemoveItem="amRemoveItem"
        @amAddItem="amAddItem"
@@ -431,7 +432,10 @@ export default {
      // 是否移动 （如果没有移动 不需要记录snapshot）
      hasMove: false,
      // 上次的鼠标指针纵向位置，用来判断指针是上移还是下移
-      latestMoveY: 0
+      latestMoveY: 0,
+      seriesIdMap: {
+        id: ''
+      }
    }
  },
  computed: {
--- a/frontend/src/components/widget/deWidget/DeTabs.vue
+++ b/frontend/src/components/widget/deWidget/DeTabs.vue
@@ -202,9 +202,7 @@
    </el-dialog>

    <text-attr
-      v-if="showAttr && curComponent.canvasId === activeCanvasId"
-      &&
-      is-edit
+      v-if="showAttr && curComponent.canvasId === activeCanvasId && isEdit"
      :canvas-id="curComponent.canvasId"
      :scroll-left="scrollLeft"
      :scroll-top="scrollTop"
@@ -466,15 +464,20 @@ export default {
      }
    },
    initCarousel() {
-      this.timer && clearInterval(this.timer)
-      if (this.element.style.carouselEnable) {
-        const switchTime = (this.element.style.switchTime || 5) * 1000
+      const _this = this
+      _this.timer && clearInterval(_this.timer)
+      if (_this.element.style.carouselEnable) {
+        const switchTime = (_this.element.style.switchTime || 5) * 1000
        let switchCount = 1
        // 轮播定时器
-        this.timer = setInterval(() => {
-          const nowIndex = switchCount % this.element.options.tabList.length
+        _this.timer = setInterval(() => {
+          const nowIndex = switchCount % _this.element.options.tabList.length
          switchCount++
-          this.activeTabName = this.element.options.tabList[nowIndex].name
+          _this.activeTabName = _this.element.options.tabList[nowIndex].name
+          const targetRef = _this.$refs['canvasTabRef-' + _this.activeTabName]
+          if (targetRef) {
+            targetRef[0].restore()
+          }
        }, switchTime)
      }
    },
@@ -705,21 +708,27 @@ export default {
 }

 ::v-deep .el-tabs__nav {
-  width: 100%;
+  display: flex;
+}
+::v-deep .el-tabs__nav-prev {
+  line-height: 25px;
+}
+::v-deep .el-tabs__nav-next {
+  line-height: 25px;
 }

 .tab-head-left ::v-deep .el-tabs__nav {
-  width: 100%;
+  display: flex;
  text-align: left;
 }

 .tab-head-right ::v-deep .el-tabs__nav {
-  width: 100%;
+  display: flex;
  text-align: right;
 }

 .tab-head-center ::v-deep .el-tabs__nav {
-  width: 100%;
+  display: flex;
  text-align: center;
 }