From 29d0a570450e9d66820cd02ee9349d79f49b2a0f Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Tue, 1 Aug 2023 14:54:55 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E4=BB=AA=E8=A1=A8=E6=9D=BF):=20=E4=BB=AA?=
 =?UTF-8?q?=E8=A1=A8=E6=9D=BF=E5=A4=8D=E7=94=A8=E6=97=B6=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E9=80=89=E6=8B=A9=E9=80=82=E5=BA=94=E5=BD=93=E5=89=8D=E4=B8=BB?=
 =?UTF-8?q?=E9=A2=98=E5=92=8C=E4=BF=9D=E6=8C=81=E6=BA=90=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=20#5703?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/canvas/store/copy.js | 16 ++++--
 frontend/src/store/index.js                  |  6 +-
 frontend/src/views/panel/edit/index.vue      | 60 +++++++++++++++++++-
 3 files changed, 74 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/canvas/store/copy.js b/frontend/src/components/canvas/store/copy.js
index bdeadc74bf..a15753e496 100644
--- a/frontend/src/components/canvas/store/copy.js
+++ b/frontend/src/components/canvas/store/copy.js
@@ -123,7 +123,7 @@ export default {
       if (data.type === 'view') {
         chartCopy(data.propValue.viewId, state.panel.panelInfo.id).then(res => {
           const newView = deepCopy(data)
-          Vue.set(newView, 'needAdaptor', needAdaptor)
+          Vue.set(newView, 'needAdaptor', store.state.multiplexingStyleAdapt?needAdaptor:false)
           newView.id = uuid.v1()
           newView.propValue.viewId = res.data
           newView['canvasId'] = data.canvasId
@@ -131,7 +131,9 @@ export default {
           if (newView.filters && newView.filters.length) {
             newView.filters = []
           }
-          needAdaptor && adaptCurThemeCommonStyle(newView)
+          if(needAdaptor && store.state.multiplexingStyleAdapt){
+            adaptCurThemeCommonStyle(newView)
+          }
           store.commit('addComponent', { component: newView })
         })
       } else if (data.type === 'de-tabs') {
@@ -143,20 +145,24 @@ export default {
             const newViewId = uuid.v1()
             sourceAndTargetIds[item.content.propValue.viewId] = newViewId
             item.content.propValue.viewId = newViewId
-            Vue.set(item.content, 'needAdaptor', needAdaptor)
+            Vue.set(item.content, 'needAdaptor', store.state.multiplexingStyleAdapt?needAdaptor:false)
             if (item.content.filters && item.content.filters.length) {
               item.content.filters = []
             }
           }
         })
         chartBatchCopy({ 'sourceAndTargetIds': sourceAndTargetIds }, state.panel.panelInfo.id).then((rsp) => {
-          needAdaptor && adaptCurThemeCommonStyle(newCop,'copy')
+          if(needAdaptor && store.state.multiplexingStyleAdapt){
+            adaptCurThemeCommonStyle(newCop,'copy')
+          }
           store.commit('addComponent', { component: newCop })
         })
       } else {
         const newCop = deepCopy(data)
         newCop.id = uuid.v1()
-        needAdaptor && adaptCurThemeCommonStyle(newCop,'copy')
+        if(needAdaptor && store.state.multiplexingStyleAdapt) {
+          adaptCurThemeCommonStyle(newCop,'copy')
+        }
         store.commit('addComponent', { component: newCop })
       }
       if (state.isCut) {
diff --git a/frontend/src/store/index.js b/frontend/src/store/index.js
index 1b8bed91f8..26ab493d70 100644
--- a/frontend/src/store/index.js
+++ b/frontend/src/store/index.js
@@ -153,7 +153,8 @@ const data = {
     previewVisible: false,
     previewComponentData: [],
     currentCanvasNewId: [],
-    lastViewRequestInfo: {}
+    lastViewRequestInfo: {},
+    multiplexingStyleAdapt: true //复用样式跟随主题
   },
   mutations: {
     ...animation.mutations,
@@ -848,6 +849,9 @@ const data = {
       })
 
       bus.$emit('clear_panel_linkage', { viewId: viewId })
+    },
+    setMultiplexingStyleAdapt(state, value) {
+     state.multiplexingStyleAdapt = value
     }
   },
   modules: {
diff --git a/frontend/src/views/panel/edit/index.vue b/frontend/src/views/panel/edit/index.vue
index 85d11600e7..4ad1055a18 100644
--- a/frontend/src/views/panel/edit/index.vue
+++ b/frontend/src/views/panel/edit/index.vue
@@ -428,6 +428,22 @@
           {{ $t('panel.multiplexing') }}
         </span>
         <span style="float: right;">
+          <span class="adapt-text"> 样式适配： </span>
+          <el-select
+            style="width: 120px;margin-right: 16px"
+            v-model="multiplexingStyleAdaptSelf"
+            placeholder="Select"
+            placement="top-start"
+            size="mini"
+            @change="multiplexingStyleAdaptChange"
+          >
+            <el-option
+              v-for="item in copyOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
           <el-button
             type="primary"
             size="mini"
@@ -630,7 +646,12 @@ export default {
       activeToolsName: 'view',
       rightDrawOpen: false,
       editType: null,
-      buttonVisible: false
+      buttonVisible: false,
+      copyOptions: [
+        { label: '适应新主题', value: true },
+        { label: '保持源样式', value: false }
+      ],
+      multiplexingStyleAdaptSelf : true
     }
   },
 
@@ -754,6 +775,9 @@ export default {
     curCanvasScaleSelf() {
       return this.curCanvasScaleMap[this.canvasId]
     },
+    selectComponentCount(){
+      return Object.keys(this.curMultiplexingComponents).length
+    },
     ...mapState([
       'curComponent',
       'curCanvasScaleMap',
@@ -770,7 +794,8 @@ export default {
       'mobileLayoutStyle',
       'scrollAutoMove',
       'batchOptStatus',
-      'curMultiplexingComponents'
+      'curMultiplexingComponents',
+      'multiplexingStyleAdapt'
     ])
   },
 
@@ -835,6 +860,7 @@ export default {
     })
     this.loadMultiplexingViewTree()
     this.init(this.$store.state.panel.panelInfo.id)
+    this.multiplexingStyleAdaptSelf = this.multiplexingStyleAdapt
   },
   beforeDestroy() {
     bus.$off('component-on-drag', this.componentOnDrag)
@@ -1448,6 +1474,9 @@ export default {
       this.$store.commit('copyMultiplexingComponents')
       this.$store.commit('recordSnapshot')
       this.$store.commit('canvasChange')
+    },
+    multiplexingStyleAdaptChange(value){
+      this.$store.commit('setMultiplexingStyleAdapt',value)
     }
   }
 }
@@ -1727,4 +1756,31 @@ export default {
 .dialog-css ::v-deep .el-dialog__body {
   padding: 10px 20px 20px;
 }
+
+.multiplexing-footer {
+  position: relative;
+}
+
+.adapt-count {
+  position: absolute;
+  top: 18px;
+  left: 20px;
+  color: #646a73;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
+  text-align: left;
+}
+
+.adapt-select {
+  position: absolute;
+  top: 18px;
+  right: 220px;
+}
+.adapt-text {
+  font-size: 14px;
+  font-weight: 400;
+  color: #1f2329;
+  line-height: 22px;
+}
 </style>