Merge branch 'dev' into pr@dev@feat_filter_select_first

core/backend/src/main/java/io/dataease/service/chart/ChartViewService.java

@@ -357,6 +357,11 @@ public class ChartViewService {
         }
         List<ChartViewFieldDTO> extStack = gson.fromJson(view.getExtStack(), new TypeToken<List<ChartViewFieldDTO>>() {
         }.getType());
+        if (CollectionUtils.isNotEmpty(xAxis) && StringUtils.equals(xAxis.get(0).getGroupType(), "q") && StringUtils.equalsIgnoreCase(view.getRender(), "antv")) {
+            List<ChartViewFieldDTO> xAxisExt = gson.fromJson(view.getXAxisExt(), new TypeToken<List<ChartViewFieldDTO>>() {
+            }.getType());
+            extStack.addAll(xAxisExt);
+        }
         List<ChartViewFieldDTO> extBubble = gson.fromJson(view.getExtBubble(), new TypeToken<List<ChartViewFieldDTO>>() {
         }.getType());
         List<ChartFieldCustomFilterDTO> fieldCustomFilter = new ArrayList<ChartFieldCustomFilterDTO>();
@@ -640,6 +645,9 @@ public class ChartViewService {
             yAxis.addAll(sizeField);
         }
         List<ChartViewFieldDTO> extStack = gson.fromJson(view.getExtStack(), tokenType);
+        if (CollectionUtils.isNotEmpty(xAxis) && StringUtils.equals(xAxis.get(0).getGroupType(), "q") && StringUtils.equalsIgnoreCase(view.getRender(), "antv")) {
+            extStack.addAll(xAxisExt);
+        }
         List<ChartViewFieldDTO> extBubble = gson.fromJson(view.getExtBubble(), tokenType);
         List<ChartFieldCustomFilterDTO> fieldCustomFilter = gson.fromJson(view.getCustomFilter(), filterTokenType);
         List<ChartViewFieldDTO> drill = gson.fromJson(view.getDrillFields(), tokenType);
@@ -939,6 +947,8 @@ public class ChartViewService {
                             if (!checkDrillExist(xAxis, extStack, nextDrillField.getId(), view)) {
                                 // get drill list first element's sort,then assign to nextDrillField
                                 nextDrillField.setSort(getDrillSort(xAxis, drill.get(0)));
+                                nextDrillField.setDrill(true);
+
                                 if (isAntVScatterNumberXAxis) {
                                     extStack.add(nextDrillField);
                                 } else {

core/backend/src/main/java/io/dataease/service/chart/util/ChartDataBuild.java

@@ -303,8 +303,10 @@ public class ChartDataBuild {
             }
         }
         List<ChartViewFieldDTO> extGroupList = new ArrayList<>();
+        List<ChartViewFieldDTO> extBaseGroupList = new ArrayList<>();
         if (xIsNumber) {
             extGroupList.addAll(extGroup);
+            extBaseGroupList.addAll(extGroup.stream().filter(d -> !d.isDrill()).collect(Collectors.toList()));
         }
 
 
@@ -374,11 +376,20 @@ public class ChartDataBuild {
                 }
 
                 if (CollectionUtils.isNotEmpty(extGroup) && xIsNumber) { //有分组时其实就是第一个
+                    String catalog = null;
                     if (isDrill) {
-                        axisChartDataDTO.setCategory(row[extGroupList.size() - 1]);
+                        catalog = row[extGroupList.size() - 1];
                     } else {
-                        axisChartDataDTO.setCategory(row[0]);
+                        catalog = row[0];
                     }
+                    axisChartDataDTO.setCategory(StringUtils.defaultIfBlank(catalog, "null"));
+
+                    if (!extBaseGroupList.isEmpty()) {
+                        axisChartDataDTO.setField(row[extBaseGroupList.size() - 1]);
+                    } else {
+                        axisChartDataDTO.setField(yAxis.get(j).getName());
+                    }
+
                 } else {
                     axisChartDataDTO.setCategory(yAxis.get(j).getName());
                 }

core/frontend/src/App.vue

@@ -13,7 +13,7 @@
       :title="$t('user.change_password')"
       :show-close="false"
     >
-      <PasswordUpdateForm oldPwd="dataease" />
+      <PasswordUpdateForm old-pwd="dataease" />
     </el-dialog>
   </div>
 </template>
@@ -26,21 +26,15 @@ import PasswordUpdateForm from '@/views/system/user/PasswordUpdateForm.vue'
 export default {
   name: 'App',
   components: { PluginCom, PasswordUpdateForm },
-  computed: {
-    ...mapState('user', [
-      'passwordModified',
-    ])
-  },
   data() {
     return {
       showPasswordModifiedDialog: false
     }
   },
-  mounted() {
-    const passwordModified = JSON.parse(localStorage.getItem('passwordModified'))
-    if (typeof passwordModified === 'boolean') {
-      this.$store.commit('user/SET_PASSWORD_MODIFIED', passwordModified)
-    }
+  computed: {
+    ...mapState('user', [
+      'passwordModified'
+    ])
   },
   watch: {
     passwordModified: {
@@ -49,6 +43,12 @@ export default {
       },
       immediate: true
     }
+  },
+  mounted() {
+    const passwordModified = JSON.parse(localStorage.getItem('passwordModified'))
+    if (typeof passwordModified === 'boolean') {
+      this.$store.commit('user/SET_PASSWORD_MODIFIED', passwordModified)
+    }
   }
 }
 </script>

core/frontend/src/api/chart/chart.js

@@ -153,7 +153,6 @@ export const viewOptions = panelId => {
   })
 }
 
-
 export function getDatasourceRelationship(id) {
   return request({
     url: `/api/relation/datasource/${id}`,
@@ -162,7 +161,6 @@ export function getDatasourceRelationship(id) {
   })
 }
 
-
 export function getDatasetRelationship(id) {
   return request({
     url: `/api/relation/dataset/${id}`,
@@ -171,7 +169,6 @@ export function getDatasetRelationship(id) {
   })
 }
 
-
 export function getPanelRelationship(id) {
   return request({
     url: `/api/relation/panel/${id}`,

core/frontend/src/api/dataset/dataset.js

@@ -138,7 +138,7 @@ export function fieldList(id, showLoading = true) {
 }
 
 export function fieldListWithPermission(id, showLoading = true) {
-  //初始模板中的过滤组件无需走后台
+  // 初始模板中的过滤组件无需走后台
   if (id.indexOf('no_auth') > -1) {
     return new Promise(function(resolve) {
       resolve({

core/frontend/src/api/link/index.js

@@ -66,9 +66,9 @@ export function loadGenerate(resourceId) {
   })
 }
 
-export function loadResource(resourceId,userId) {
+export function loadResource(resourceId, userId) {
   return request({
-    url: 'api/link/resourceDetail/' + resourceId+'/'+ userId,
+    url: 'api/link/resourceDetail/' + resourceId + '/' + userId,
     method: 'get'
   })
 }

core/frontend/src/api/panel/panel.js

@@ -192,7 +192,7 @@ export function initPanelData(panelId, useCache = false, callback) {
         watermarkOpen: response.data.watermarkOpen,
         watermarkInfo: watermarkInfo
       })
-      const targetPanelId = response.data.panelType==='system'?response.data.source:panelId
+      const targetPanelId = response.data.panelType === 'system' ? response.data.source : panelId
       // 刷新联动信息
       getPanelAllLinkageInfo(targetPanelId).then(rsp => {
         store.commit('setNowPanelTrackInfo', rsp.data)

core/frontend/src/components/canvas/components/TextAttr.vue

@@ -24,7 +24,7 @@
           >
             <el-tooltip :content="item.tooltip">
               <span style="float: left;">
-                <i :class="item.icon"/>
+                <i :class="item.icon" />
               </span>
             </el-tooltip>
           </el-radio-button>
@@ -47,7 +47,7 @@
               :value="item.value"
             >
               <span style="float: left;">
-                <i :class="item.icon"/>
+                <i :class="item.icon" />
               </span>
               <span style="float: right; color: #8492a6; font-size: 12px">{{ item.label }}</span>
             </el-option>
@@ -257,7 +257,7 @@
               @click="goColor"
             />
           </el-tooltip>
-          <div :style="letterDivColor"/>
+          <div :style="letterDivColor" />
           <el-color-picker
             ref="colorPicker"
             v-model="styleInfo.color"
@@ -279,7 +279,7 @@
               @click="goBoardColor"
             />
           </el-tooltip>
-          <div :style="boardDivColor"/>
+          <div :style="boardDivColor" />
           <el-color-picker
             ref="boardColorPicker"
             v-model="styleInfo.borderColor"
@@ -302,7 +302,7 @@
               @click="goBackgroundColor"
             />
           </el-tooltip>
-          <div :style="backgroundDivColor"/>
+          <div :style="backgroundDivColor" />
           <el-color-picker
             ref="backgroundColorPicker"
             v-model="styleInfo.backgroundColor"
@@ -318,7 +318,7 @@
         style="width: 20px;float: left;margin-top: 2px;margin-left: 2px;"
       >
         <el-tooltip :content="$t('panel.video_info')">
-          <VideoLinks :link-info="curComponent.videoLinks"/>
+          <VideoLinks :link-info="curComponent.videoLinks" />
         </el-tooltip>
       </div>
 
@@ -327,7 +327,7 @@
         style="width: 20px;float: left;margin-top: 2px;margin-left: 2px;"
       >
         <el-tooltip :content="$t('panel.stream_media_info')">
-          <StreamMediaLinks :link-info="curComponent.streamMediaLinks"/>
+          <StreamMediaLinks :link-info="curComponent.streamMediaLinks" />
         </el-tooltip>
       </div>
 
@@ -336,7 +336,7 @@
         style="width: 20px;float: left;margin-top: 2px;margin-left: 2px;"
       >
         <el-tooltip :content="$t('panel.web_addr')">
-          <FrameLinks :link-info="curComponent.frameLinks"/>
+          <FrameLinks :link-info="curComponent.frameLinks" />
         </el-tooltip>
       </div>
       <div
@@ -356,7 +356,7 @@
         style="width: 20px;float: left;margin-top: 2px;margin-left: 10px;"
       >
         <el-tooltip :content="$t('panel.tab_inner_style')">
-          <tab-style :style-info="styleInfo"/>
+          <tab-style :style-info="styleInfo" />
         </el-tooltip>
       </div>
 

core/frontend/src/components/canvas/components/editor/ComponentWrapper.vue

@@ -78,19 +78,19 @@
 </template>
 
 <script>
-import {getStyle} from '@/components/canvas/utils/style'
+import { getStyle } from '@/components/canvas/utils/style'
 import runAnimation from '@/components/canvas/utils/runAnimation'
-import {mixins} from '@/components/canvas/utils/events'
-import {mapState} from 'vuex'
+import { mixins } from '@/components/canvas/utils/events'
+import { mapState } from 'vuex'
 import DeOutWidget from '@/components/dataease/DeOutWidget'
 import EditBar from '@/components/canvas/components/editor/EditBar'
 import MobileCheckBar from '@/components/canvas/components/editor/MobileCheckBar'
 import CloseBar from '@/components/canvas/components/editor/CloseBar'
-import {hexColorToRGBA} from '@/views/chart/chart/util'
-import {imgUrlTrans} from '@/components/canvas/utils/utils'
+import { hexColorToRGBA } from '@/views/chart/chart/util'
+import { imgUrlTrans } from '@/components/canvas/utils/utils'
 
 export default {
-  components: {CloseBar, MobileCheckBar, DeOutWidget, EditBar},
+  components: { CloseBar, MobileCheckBar, DeOutWidget, EditBar },
   mixins: [mixins],
   props: {
     canvasId: {
@@ -137,7 +137,7 @@ export default {
     canvasStyleData: {
       type: Object,
       required: false,
-      default: function () {
+      default: function() {
         return {}
       }
     },
@@ -165,7 +165,7 @@ export default {
     },
     chart() {
       if (this.config.propValue?.viewId) {
-        const viewInfo = this.panelViewDetailsInfo[this.config.propValue.viewId];
+        const viewInfo = this.panelViewDetailsInfo[this.config.propValue.viewId]
         return viewInfo ? JSON.parse(viewInfo) : null
       }
       return null
@@ -329,7 +329,7 @@ export default {
       e.stopPropagation()
       const _this = this
       setTimeout(() => {
-        _this.$store.commit('setCurComponent', {component: _this.config, index: _this.index})
+        _this.$store.commit('setCurComponent', { component: _this.config, index: _this.index })
       }, 200)
     },
     showViewDetails(params) {

core/frontend/src/components/canvas/components/editor/DeEditor.vue

@@ -1693,10 +1693,6 @@ export default {
       const resizeItem = _.get(infoBox, 'resizeItem')
       const vm = this
       vm.$set(resizeItem, 'isPlayer', true)
-      const startX = infoBox.startX
-      const startY = infoBox.startY
-      const moveXSize = e.pageX - startX // X方向移动的距离
-      const moveYSize = e.pageY - startY // Y方向移动的距离
       let nowX = Math.round(item.style.width * this.matrixScaleWidth)
       let nowY = Math.round(item.style.height * this.matrixScaleHeight)
       nowX = nowX > 0 ? nowX : 1

core/frontend/src/components/canvas/components/editor/FieldsList.vue

@@ -1,5 +1,8 @@
 <template>
-  <div @mousedown="fieldsAreaDown" class="field-main">
+  <div
+    class="field-main"
+    @mousedown="fieldsAreaDown"
+  >
     <el-button
       v-for="(field) in fields"
       :key="field.id"

core/frontend/src/components/canvas/components/editor/LinkageField.vue

@@ -133,8 +133,8 @@
 </template>
 
 <script>
-import {mapState} from 'vuex'
-import {checkSameDataSet} from '@/api/chart/chart'
+import { mapState } from 'vuex'
+import { checkSameDataSet } from '@/api/chart/chart'
 
 export default {
 
@@ -179,7 +179,6 @@ export default {
     ])
   },
   mounted() {
-    const _this = this
     // 初始化映射关系 如果当前是相同的数据集且没有关联关系，则自动补充映射关系
     checkSameDataSet(this.curLinkageView.propValue.viewId, this.element.propValue.viewId).then(res => {
       const chartDetails = JSON.parse(this.panelViewDetailsInfo[this.curLinkageView.propValue.viewId])
@@ -189,7 +188,7 @@ export default {
 
       if (res.data === 'YES' && this.linkageInfo.linkageFields.length === 0) {
         this.sourceLinkageInfo.targetViewFields.forEach(item => {
-          if (curCheckAllAxisStr.includes(item.id)&&targetCheckAllAxisStr.includes(item.id)) {
+          if (curCheckAllAxisStr.includes(item.id) && targetCheckAllAxisStr.includes(item.id)) {
             this.addLinkageField(item.id, item.id)
           }
         })

core/frontend/src/components/canvas/components/editor/TabCarouselDialog.vue

@@ -66,8 +66,8 @@ export default {
       }
     },
     onSubmit() {
-      this.curComponent.style.carouselEnable  = this.carouselEnable
-      this.curComponent.style.switchTime  = this.switchTime
+      this.curComponent.style.carouselEnable = this.carouselEnable
+      this.curComponent.style.switchTime = this.switchTime
       this.$store.commit('canvasChange')
       this.onClose()
     },

core/frontend/src/components/canvas/components/editor/ViewTrackBar.vue

@@ -1,7 +1,8 @@
 <template>
   <div>
     <el-dropdown
-      trigger="click">
+      trigger="click"
+    >
       <input
         id="input"
         ref="trackButton"

core/frontend/src/components/canvas/customComponent/DeFrame.vue

@@ -45,7 +45,7 @@
       class="info-class"
     >
       <span>{{ $t('panel.link_add_tips_pre') }}</span>
-      <i class="icon iconfont icon-chaolianjie"/>
+      <i class="icon iconfont icon-chaolianjie" />
       <span>{{ $t('panel.web_add_tips_suf') }}</span>
     </div>
   </el-row>

core/frontend/src/components/canvas/customComponent/DeRichTextView.vue

@@ -156,11 +156,11 @@ export default {
     bus.$off('fieldSelect-' + this.element.propValue.viewId)
   },
   methods: {
-    changeRightDrawOpen(param){
-      if(param){
+    changeRightDrawOpen(param) {
+      if (param) {
         this.drawLeft = 'auto!important'
         this.drawRight = '380px'
-      }else{
+      } else {
         this.drawLeft = 'none'
         this.drawRight = 'auto'
       }
@@ -302,4 +302,3 @@ export default {
 }
 </style>
 
-

core/frontend/src/components/canvas/customComponent/DeStreamMedia.vue

@@ -33,7 +33,7 @@
       class="info-stream-class"
     >
       <span>{{ $t('panel.link_add_tips_pre') }}</span>
-      <i class="icon iconfont icon-chaolianjie"/>
+      <i class="icon iconfont icon-chaolianjie" />
       <span>{{ $t('panel.stream_media_add_tips') }}</span>
     </div>
   </el-row>

core/frontend/src/components/canvas/customComponent/DeVideo.vue

@@ -27,7 +27,7 @@
       class="info-class"
     >
       <span>{{ $t('panel.link_add_tips_pre') }}</span>
-      <i class="icon iconfont icon-chaolianjie"/>
+      <i class="icon iconfont icon-chaolianjie" />
       <span>{{ $t('panel.video_add_tips') }}</span>
     </div>
   </el-row>

core/frontend/src/components/canvas/customComponent/UserViewDialog.vue

@@ -225,7 +225,7 @@ export default {
             }
           })
         }
-        const result = { ...temp, ...{ DetailAreaCode: DetailAreaCode } }
+        const result = { ...temp, ...{ DetailAreaCode: DetailAreaCode }}
         this.setLastMapChart(result)
         return result
       }

core/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', store.state.multiplexingStyleAdapt?needAdaptor:false)
+          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,7 @@ export default {
           if (newView.filters && newView.filters.length) {
             newView.filters = []
           }
-          if(needAdaptor && store.state.multiplexingStyleAdapt){
+          if (needAdaptor && store.state.multiplexingStyleAdapt) {
             adaptCurThemeCommonStyle(newView)
           }
           store.commit('addComponent', { component: newView })
@@ -145,23 +145,23 @@ export default {
             const newViewId = uuid.v1()
             sourceAndTargetIds[item.content.propValue.viewId] = newViewId
             item.content.propValue.viewId = newViewId
-            Vue.set(item.content, 'needAdaptor', store.state.multiplexingStyleAdapt?needAdaptor:false)
+            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) => {
-          if(needAdaptor && store.state.multiplexingStyleAdapt){
-            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()
-        if(needAdaptor && store.state.multiplexingStyleAdapt) {
-          adaptCurThemeCommonStyle(newCop,'copy')
+        if (needAdaptor && store.state.multiplexingStyleAdapt) {
+          adaptCurThemeCommonStyle(newCop, 'copy')
         }
         store.commit('addComponent', { component: newCop })
       }

core/frontend/src/components/canvas/utils/shortcutKey.js

@@ -9,9 +9,6 @@ const vKey = 86 // 粘贴
 const cKey = 67 // 复制
 const xKey = 88 // 剪切
 
-const yKey = 89 // 重做
-const zKey = 90 // 撤销
-
 const gKey = 71 // 组合
 const bKey = 66 // 拆分
 
@@ -33,7 +30,7 @@ const ignoreComponent = ['de-button', 'de-reset-button']
 const basemap = {
   [vKey]: paste,
   [gKey]: redo,
-  [bKey]: undo,
+  [bKey]: undo
 }
 
 // 组件未锁定状态下可以执行的操作
@@ -50,7 +47,6 @@ const unlockMap = {
 
 let isCtrlOrCommandDown = false
 
-
 // 检查当前页面是否有弹框
 const checkDialog = () => {
   let haveDialog = false
@@ -141,21 +137,6 @@ function undo() {
   store.commit('undo')
 }
 
-function compose() {
-  if (store.state.areaData.components.length) {
-    store.commit('compose')
-    store.commit('recordSnapshot')
-  }
-}
-
-function decompose() {
-  const curComponent = store.state.curComponent
-  if (curComponent && !curComponent.isLock && curComponent.component === 'Group') {
-    store.commit('decompose')
-    store.commit('recordSnapshot')
-  }
-}
-
 function copyAndPast() {
   if (store.state.curComponent) {
     if (ignoreComponent.includes(store.state.curComponent.component)) {

core/frontend/src/components/dataease/DeAsideContainer.vue

@@ -47,7 +47,7 @@ export default {
   data() {
     return {
       asideHidden: false,
-      currentWidth: '',
+      currentWidth: ''
     }
   },
   computed: {

core/frontend/src/components/deDrag/index.vue

@@ -66,7 +66,7 @@
         @mousedown.stop.prevent="handleDown(handlei, $event)"
         @touchstart.stop.prevent="handleTouchDown(handlei, $event)"
       >
-        <slot :name="handlei"/>
+        <slot :name="handlei" />
       </div>
       <div
         :id="componentCanvasId"
@@ -74,22 +74,22 @@
         class="main-background"
       >
         <div
-          v-show="!this.element.editing"
+          v-show="!element.editing"
           class="de-drag-area de-drag-top"
           @mousedown="elementMouseDown"
         />
         <div
-          v-show="!this.element.editing && this.element.type !=='de-tabs'"
+          v-show="!element.editing && element.type !=='de-tabs'"
           class="de-drag-area de-drag-right"
           @mousedown="elementMouseDown"
         />
         <div
-          v-show="!this.element.editing && this.element.type !=='de-tabs'"
+          v-show="!element.editing && element.type !=='de-tabs'"
           class="de-drag-area de-drag-bottom"
           @mousedown="elementMouseDown"
         />
         <div
-          v-show="!this.element.editing && this.element.type !=='de-tabs'"
+          v-show="!element.editing && element.type !=='de-tabs'"
           class="de-drag-area de-drag-left"
           @mousedown="elementMouseDown"
         />
@@ -99,7 +99,7 @@
           class="svg-background"
           :icon-class="mainSlotSvgInner"
         />
-        <slot/>
+        <slot />
       </div>
     </div>
   </div>

core/frontend/src/components/msgCfm/index.js

@@ -42,8 +42,7 @@ export default {
         })
     },
     withLink(options, confirmButtonTextInfo) {
-      const h = this.$createElement;
-      const that = this
+      const h = this.$createElement
       const { title, content, type = 'danger', cb, confirmButtonText = confirmButtonTextInfo || this.$t('commons.delete'), showCancelButton = true, cancelButtonText = this.$t('commons.cancel'), cancelCb = () => {}, finallyCb = () => {}, link = '', templateDel, linkTo } = options
       const customClass = `de-confirm de-confirm-fail de-use-html`
       const confirmButtonClass = `de-confirm-${type}-btn de-confirm-btn`
@@ -55,14 +54,14 @@ export default {
                 title,
                 content,
                 link
-              },
+              }
             },
             on: {
               change: () => {
                 linkTo()
               }
             }
-          }),
+          })
         ]),
         duration: 0,
         confirmButtonText,
@@ -71,18 +70,18 @@ export default {
         cancelButtonClass: 'de-confirm-btn de-confirm-plain-cancel',
         confirmButtonClass,
         customClass,
-        iconClass: 'el-icon-warning',
+        iconClass: 'el-icon-warning'
       }).then(action => {
-        if ('confirm' === action) {
+        if (action === 'confirm') {
           cb()
         }
       })
-      .catch((action) => {
-        cancelCb(action)
-      })
-      .finally(() => {
-        finallyCb()
-      })
+        .catch((action) => {
+          cancelCb(action)
+        })
+        .finally(() => {
+          finallyCb()
+        })
     }
   }
 }

core/frontend/src/components/suspensionSelector/index.vue

@@ -107,6 +107,13 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+  .form-item ::v-deep .el-checkbox__label {
+    font-size: 12px;
+  }
+  .form-item ::v-deep .el-radio__label {
+    font-size: 12px;
+  }
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/components/widget/deWidget/DeButton.vue

@@ -15,7 +15,6 @@
 
 <script>
 import bus from '@/utils/bus'
-import { mapState } from 'vuex'
 export default {
 
   props: {
@@ -27,9 +26,9 @@ export default {
       type: Boolean,
       default: true
     },
-    canvasStyleData:{
+    canvasStyleData: {
       type: Object,
-      default: {}
+      default: () => {}
     },
     size: String
   },

core/frontend/src/components/widget/deWidget/DeDate.vue

@@ -21,28 +21,44 @@
       @focus="toFocus"
       @blur="onBlur"
     />
-    <div v-if="isMobileStatus" class="vant-mobile" :class="isRange && 'wl50'" @click="showPopup"/>
-    <div v-if="isMobileStatus && isRange" class="vant-mobile" :class="['datetimerange', 'datetime', 'daterange'].includes(componentType) && 'wr50'" @click="showPopupRight"/>
-    <van-popup get-container="body" v-if="isMobileStatus" v-model="showDate" position="bottom" style="height: auto">
+    <div
+      v-if="isMobileStatus"
+      class="vant-mobile"
+      :class="isRange && 'wl50'"
+      @click="showPopup"
+    />
+    <div
+      v-if="isMobileStatus && isRange"
+      class="vant-mobile"
+      :class="['datetimerange', 'datetime', 'daterange'].includes(componentType) && 'wr50'"
+      @click="showPopupRight"
+    />
+    <van-popup
+      v-if="isMobileStatus"
+      v-model="showDate"
+      get-container="body"
+      position="bottom"
+      style="height: auto"
+    >
       <van-datetime-picker
         v-if="showdDatetimePicker"
-        @confirm="confirm"
-        @cancel="cancel"
         v-model="currentDate"
         :type="componentTypeVant"
         title="选择时间"
         :min-date="minDate"
         :max-date="maxDate"
-        />
-        <van-picker
-          v-else
-          title="选择时间"
-          :default-index="defaultIndex"
-          show-toolbar
-          :columns="columns"
-          @confirm="onConfirm"
-          @cancel="onCancel"
-        />
+        @confirm="confirm"
+        @cancel="cancel"
+      />
+      <van-picker
+        v-else
+        title="选择时间"
+        :default-index="defaultIndex"
+        show-toolbar
+        :columns="columns"
+        @confirm="onConfirm"
+        @cancel="onCancel"
+      />
     </van-popup>
   </div>
 </template>
@@ -51,7 +67,7 @@
 import { ApplicationContext } from '@/utils/ApplicationContext'
 import { timeSection } from '@/utils'
 import bus from '@/utils/bus'
-import customInput from '@/components/widget/deWidget/customInput' 
+import customInput from '@/components/widget/deWidget/customInput'
 import { dateMap, years, seconds } from '@/components/widget/deWidget/serviceNameFn'
 import { mapState } from 'vuex'
 import vanPopup from 'vant/lib/popup'
@@ -262,6 +278,7 @@ export default {
   },
   methods: {
     showPopupRight() {
+      // eslint-disable-next-line
       const [_, end] = this.values || []
       !!end && (this.currentDate = new Date(end))
       this.selectSecondInput = true

core/frontend/src/components/widget/deWidget/DeResetButton.vue

@@ -15,7 +15,6 @@
 
 <script>
 import bus from '@/utils/bus'
-import { mapState } from 'vuex'
 export default {
 
   props: {
@@ -27,9 +26,9 @@ export default {
       type: Boolean,
       default: true
     },
-    canvasStyleData:{
+    canvasStyleData: {
       type: Object,
-      default: {}
+      default: () => {}
     },
     size: String
   },

core/frontend/src/components/widget/deWidget/DeTabs.vue

@@ -76,8 +76,8 @@
           style="width: 100%;height:100%"
         >
           <Preview
-            :component-data="tabCanvasComponentData(item.name)"
             :ref="'canvasTabRef-'+item.name"
+            :component-data="tabCanvasComponentData(item.name)"
             :canvas-style-data="canvasStyleData"
             :canvas-id="element.id+'-'+item.name"
             :panel-info="panelInfo"
@@ -315,9 +315,9 @@ export default {
       return Boolean(this.$store.state.dragComponentInfo)
     },
     headClass() {
-      if(this.tabsAreaScroll){
+      if (this.tabsAreaScroll) {
         return 'tab-head-left'
-      }else{
+      } else {
         return 'tab-head-' + this.element.style.headPosition
       }
     },
@@ -474,7 +474,7 @@ export default {
     bus.$on('add-new-tab', this.addNewTab)
     this.$nextTick(() => {
       this.activeTabName = this.element.options.tabList[0].name
-    });
+    })
     this.$store.commit('setTabActiveTabNameMap', { tabId: this.element.id, activeTabName: this.activeTabName })
     this.setContentThemeStyle()
   },
@@ -490,12 +490,12 @@ export default {
     setTabLayout: _.debounce(function() {
       this.headClassScroll = !!this.$refs.deTabsConstom.$refs.tabsConstom.$refs.nav.scrollable && 'head-class-scroll'
     }, 100),
-    calcTabLength(){
-      this.$nextTick(()=>{
-        if(this.element.options.tabList.length>1){
-          const containerDom = document.getElementById("tab-"+this.element.options.tabList[this.element.options.tabList.length -1].name)
+    calcTabLength() {
+      this.$nextTick(() => {
+        if (this.element.options.tabList.length > 1) {
+          const containerDom = document.getElementById('tab-' + this.element.options.tabList[this.element.options.tabList.length - 1].name)
           this.tabsAreaScroll = containerDom.parentNode.scrollWidth > containerDom.parentNode.parentNode.scrollWidth
-        }else{
+        } else {
           this.tabsAreaScroll = false
         }
       })
@@ -504,7 +504,7 @@ export default {
       return this.element.type
     },
     getWrapperChildRefs() {
-      let refsSubAll = []
+      const refsSubAll = []
       const _this = this
       this.element.options.tabList.forEach(tabItem => {
         const refsSub = _this.$refs['canvasTabRef-' + tabItem.name]
@@ -544,7 +544,7 @@ export default {
             if (targetRef) {
               targetRef[0]?.restore()
             }
-          });
+          })
         }, switchTime)
       }
     },

core/frontend/src/icons/svg/icon-setting.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.32881 19.7336L4.01769 19.3947C2.92844 18.2083 2.11122 16.7932 1.63213 15.2477L1.49707 14.8121L3.54513 12L1.49707 9.18788L1.63213 8.7522C2.11122 7.20676 2.92844 5.79166 4.01769 4.60522L4.32881 4.26634L7.77063 4.64253L9.16859 1.4557L9.61685 1.35478C10.3936 1.17991 11.1916 1.09088 12.0005 1.09088C12.8093 1.09088 13.6073 1.17991 14.3841 1.35478L14.8323 1.4557L16.2303 4.64253L19.6721 4.26634L19.9832 4.60522C21.0725 5.79166 21.8897 7.20676 22.3688 8.7522L22.5038 9.18788L20.4558 12L22.5038 14.8121L22.3688 15.2477C21.8897 16.7932 21.0725 18.2083 19.9832 19.3947L19.6721 19.7336L16.2303 19.3574L14.8323 22.5442L14.3841 22.6452C13.6073 22.82 12.8093 22.9091 12.0005 22.9091C11.1916 22.9091 10.3936 22.82 9.61685 22.6452L9.16859 22.5442L7.77063 19.3574L4.32881 19.7336ZM7.8139 17.5236C8.46003 17.453 9.07723 17.8099 9.33833 18.4051L10.4588 20.9593C10.9641 21.0466 11.4792 21.0908 12.0005 21.0908C12.5217 21.0908 13.0368 21.0466 13.5421 20.9593L14.6626 18.4051C14.9237 17.8099 15.5409 17.453 16.187 17.5236L18.9412 17.8247C19.6064 17.024 20.1309 16.1142 20.4889 15.1338L18.8445 12.876C18.4643 12.3538 18.4643 11.646 18.8445 11.1239L20.4889 8.86603C20.1309 7.88562 19.6064 6.97584 18.9412 6.17518L16.187 6.47621C15.5409 6.54684 14.9237 6.18994 14.6626 5.59472L13.5421 3.04054C13.0368 2.95327 12.5217 2.90901 12.0005 2.90901C11.4792 2.90901 10.9641 2.95327 10.4588 3.04054L9.33833 5.59472C9.07723 6.18994 8.46003 6.54684 7.8139 6.47621L5.05969 6.17518C4.39449 6.97584 3.87002 7.88562 3.51199 8.86603L5.15637 11.1239C5.53664 11.646 5.53664 12.3538 5.15637 12.876L3.51199 15.1338C3.87002 16.1142 4.39449 17.024 5.05969 17.8247L7.8139 17.5236ZM12.0005 16.5454C9.49866 16.5454 7.47232 14.5094 7.47232 12C7.47232 9.49055 9.49866 7.45451 12.0005 7.45451C14.5023 7.45451 16.5286 9.49055 16.5286 12C16.5286 14.5094 14.5023 16.5454 12.0005 16.5454ZM12.0005 14.7273C13.4961 14.7273 14.7104 13.5072 14.7104 12C14.7104 10.4928 13.4961 9.27275 12.0005 9.27275C10.5048 9.27275 9.2905 10.4928 9.2905 12C9.2905 13.5072 10.5048 14.7273 12.0005 14.7273Z" fill="CurrentColor"/>
+</svg>

core/frontend/src/icons/svg/icon_switch_outlined.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.49999 8.41356C2.49999 8.54617 2.55267 8.67334 2.64643 8.76711C2.7402 8.86088 2.86738 8.91356 2.99999 8.91356H21.25C22.154 8.91356 22.594 7.80956 21.9375 7.18756L16.825 2.34406C16.7773 2.29887 16.7212 2.26352 16.6599 2.24001C16.5986 2.21651 16.5332 2.20533 16.4676 2.20709C16.4019 2.20885 16.3372 2.22354 16.2773 2.2503C16.2173 2.27706 16.1632 2.31538 16.118 2.36306L15.426 3.09356C15.3355 3.18903 15.2863 3.31629 15.289 3.44778C15.2918 3.57928 15.3462 3.7044 15.4405 3.79606L18.7405 7.00256H2.99999C2.93433 7.00256 2.86931 7.01549 2.80865 7.04062C2.74798 7.06575 2.69286 7.10257 2.64643 7.149C2.60001 7.19543 2.56318 7.25055 2.53805 7.31122C2.51292 7.37188 2.49999 7.4369 2.49999 7.50256V8.41356ZM2.74999 15.0001C1.84599 15.0001 1.40599 16.1041 2.06249 16.7261L7.17499 21.5701C7.22268 21.6152 7.27881 21.6505 7.34016 21.674C7.4015 21.6974 7.46687 21.7086 7.53253 21.7068C7.59818 21.705 7.66284 21.6902 7.7228 21.6634C7.78276 21.6366 7.83685 21.5983 7.88199 21.5506L8.56999 20.8251C8.61514 20.7774 8.65046 20.7212 8.67392 20.6599C8.69738 20.5985 8.70852 20.5332 8.70671 20.4675C8.7049 20.4019 8.69017 20.3372 8.66336 20.2772C8.63656 20.2173 8.5982 20.1632 8.55049 20.1181L5.25999 17.0001H21C21.1326 17.0001 21.2598 16.9474 21.3535 16.8536C21.4473 16.7598 21.5 16.6327 21.5 16.5001V15.5001C21.5 15.3674 21.4473 15.2403 21.3535 15.1465C21.2598 15.0527 21.1326 15.0001 21 15.0001H2.74999Z" fill="CurrentColor"/>
+</svg>

core/frontend/src/lang/en.js

@@ -2431,7 +2431,6 @@ export default {
     webFormat: 'Please enter the correct URL starting with [https:// or http://]'
   },
   auth: {
-    selct_filter_fields: 'Please select a filter field',
     no_item_selected: 'Please select organization、user or role on the left',
     no_resource_selected: 'Please select resource on the left',
     search_pre: 'Search by ',

core/frontend/src/lang/tw.js

@@ -2425,7 +2425,6 @@ export default {
     webFormat: '請輸入以[https://或http://]開頭的正確網址'
   },
   auth: {
-    selct_filter_fields: '請選擇篩選字段',
     no_item_selected: '請在左側選擇組織、角色或用戶',
     no_resource_selected: '請在左側選擇資源',
     search_pre: '通過',

core/frontend/src/lang/zh.js

@@ -2425,7 +2425,6 @@ export default {
     webFormat: '请输入以[https://或http://]开头的正确网址'
   },
   auth: {
-    selct_filter_fields: '请选择筛选字段',
     no_item_selected: '请在左侧选择组织、角色或用户',
     no_resource_selected: '请在左侧选择资源',
     search_pre: '通过',

core/frontend/src/layout/index.vue

@@ -143,8 +143,8 @@ export default {
   },
   methods: {
     webMsgTopicCall(param) {
-      const ip = param
       const msg = this.$t('multi_login_lang.forced_offline')
+      // eslint-disable-next-line
       this.$error(eval(msg))
       bus.$emit('sys-logout')
     },

core/frontend/src/mobile/main.js

@@ -11,7 +11,6 @@ import store from '../store'
 import router from '../router/mobile.js'
 import message from '../utils/message'
 import '@/icons' // icon
-import '@/permission' // permission control
 import api from '@/api/index.js'
 import filter from '@/filter/filter'
 import directives from '../directive'

core/frontend/src/permission.js

@@ -57,7 +57,7 @@ const routeBefore = (callBack) => {
     callBack()
   }
 }
-router.beforeEach(async (to, from, next) => routeBefore(() => {
+router.beforeEach(async(to, from, next) => routeBefore(() => {
   // start progress bar
   NProgress.start()
   const mobileIgnores = ['/delink', '/de-auto-login']

core/frontend/src/router/mobile.js

@@ -5,7 +5,7 @@ Vue.use(Router)
 export const constantRoutes = [
   {
     path: '/',
-    component: () => import('@/views/mobile/index.vue'),
+    component: () => import('@/views/mobile/index.vue')
   }
 ]
 

core/frontend/src/store/index.js

@@ -22,14 +22,14 @@ import layer from '@/components/canvas/store/layer'
 import snapshot from '@/components/canvas/store/snapshot'
 import lock from '@/components/canvas/store/lock'
 import task from './modules/task'
-import {formatCondition, valueValid} from '@/utils/conditionUtil'
-import {Condition} from '@/components/widget/bean/Condition'
+import { formatCondition, valueValid } from '@/utils/conditionUtil'
+import { Condition } from '@/components/widget/bean/Condition'
 
-import {DEFAULT_COMMON_CANVAS_STYLE_STRING} from '@/views/panel/panel'
+import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel'
 import bus from '@/utils/bus'
-import {BASE_MOBILE_STYLE} from '@/components/canvas/customComponent/component-list'
-import {TYPE_CONFIGS} from '@/views/chart/chart/util'
-import {deepCopy} from '@/components/canvas/utils/utils'
+import { BASE_MOBILE_STYLE } from '@/components/canvas/customComponent/component-list'
+import { TYPE_CONFIGS } from '@/views/chart/chart/util'
+import { deepCopy } from '@/components/canvas/utils/utils'
 
 Vue.use(Vuex)
 
@@ -156,7 +156,7 @@ const data = {
     previewComponentData: [],
     currentCanvasNewId: [],
     lastViewRequestInfo: {},
-    multiplexingStyleAdapt: true //复用样式跟随主题
+    multiplexingStyleAdapt: true // 复用样式跟随主题
   },
   mutations: {
     ...animation.mutations,
@@ -201,7 +201,7 @@ const data = {
       })
     },
 
-    setCurComponent(state, {component, index}) {
+    setCurComponent(state, { component, index }) {
       if (!component && state.curComponent) {
         Vue.set(state.curComponent, 'editing', false)
       }
@@ -239,7 +239,7 @@ const data = {
         state.previewCanvasScale.scalePointHeight = scale.scaleHeight
       }
     },
-    setShapeStyle({curComponent, canvasStyleData, curCanvasScaleMap}, {top, left, width, height, rotate}) {
+    setShapeStyle({ curComponent, canvasStyleData, curCanvasScaleMap }, { top, left, width, height, rotate }) {
       if (curComponent) {
         const curCanvasScaleSelf = curCanvasScaleMap[curComponent.canvasId]
         if (top || top === 0) curComponent.style.top = Math.round((top / curCanvasScaleSelf.scalePointHeight))
@@ -250,7 +250,7 @@ const data = {
       }
     },
 
-    setShapeSingleStyle({curComponent}, {key, value}) {
+    setShapeSingleStyle({ curComponent }, { key, value }) {
       curComponent.style[key] = value
     },
 
@@ -274,14 +274,14 @@ const data = {
     setMobileComponentData(state, mobileComponentData = []) {
       Vue.set(state, 'mobileComponentData', mobileComponentData)
     },
-    addComponent(state, {component, index}) {
+    addComponent(state, { component, index }) {
       if (index !== undefined) {
         state.componentData.splice(index, 0, component)
       } else {
         state.componentData.push(component)
         state.currentCanvasNewId.push(component.id)
       }
-      this.commit('setCurComponent', {component: component, index: index || state.componentData.length - 1})
+      this.commit('setCurComponent', { component: component, index: index || state.componentData.length - 1 })
     },
     removeViewFilter(state, componentId) {
       state.componentData = state.componentData.map(item => {
@@ -372,7 +372,7 @@ const data = {
         trackInfo = state.nowPanelTrackInfo
         // 兼容情况，当源视图多个字段匹配目标视图一个字段的时候，默认只保留当前点击的维度，将改维度排序到组件结尾，去重时即可保留
         const activeDimensionIndex = data.dimensionList.findIndex(dimension => dimension.id === data.name)
-        if (activeDimensionIndex > -1 && activeDimensionIndex != dimensionSort.length - 1) {
+        if (activeDimensionIndex > -1 && activeDimensionIndex !== dimensionSort.length - 1) {
           const dimensionLast = dimensionSort[dimensionSort.length - 1]
           dimensionSort[dimensionSort.length - 1] = dimensionSort[activeDimensionIndex]
           dimensionSort[activeDimensionIndex] = dimensionLast
@@ -466,7 +466,7 @@ const data = {
           const currentFilters = element.outerParamsFilters || [] // 外部参数信息
 
           // 外部参数 可能会包含多个参数
-          Object.keys(params).forEach(function (sourceInfo) {
+          Object.keys(params).forEach(function(sourceInfo) {
             // 获取外部参数的值 sourceInfo 是外部参数名称 支持数组传入
             let paramValue = params[sourceInfo]
             let operator = 'in'
@@ -668,13 +668,13 @@ const data = {
         }
       }
     },
-    updateComponentViewsData(state, {viewId, propertyKey, propertyValue}) {
+    updateComponentViewsData(state, { viewId, propertyKey, propertyValue }) {
       state.componentViewsData[viewId][propertyKey] = propertyValue
     },
     removeCurMultiplexingComponentWithId(state, id) {
       delete state.curMultiplexingComponents[id]
     },
-    addCurMultiplexingComponent(state, {component, componentId}) {
+    addCurMultiplexingComponent(state, { component, componentId }) {
       if (componentId) {
         if (component.type === 'custom-button' && component.serviceName === 'buttonSureWidget') {
           const copyComponent = deepCopy(component)
@@ -771,7 +771,7 @@ const data = {
       state.changeProperties[propertyInfo.custom][propertyInfo.property] = propertyInfo.value
     },
     initCanvasBase(state) {
-      this.commit('setCurComponent', {component: null, index: null})
+      this.commit('setCurComponent', { component: null, index: null })
       this.commit('clearLinkageSettingInfo', false)
       this.commit('resetViewEditInfo')
       this.commit('initCurMultiplexingComponents')
@@ -861,7 +861,7 @@ const data = {
         }
       })
 
-      bus.$emit('clear_panel_linkage', {viewId: viewId})
+      bus.$emit('clear_panel_linkage', { viewId: viewId })
     },
     setMultiplexingStyleAdapt(state, value) {
       state.multiplexingStyleAdapt = value

core/frontend/src/store/modules/user.js

@@ -4,7 +4,6 @@ import { resetRouter } from '@/router'
 import { format } from '@/utils/formatUi'
 import { getLanguage } from '@/lang/index'
 import Cookies from 'js-cookie'
-import router from '@/router'
 import i18n from '@/lang'
 import { $alert, $confirm } from '@/utils/message'
 const getDefaultState = () => {
@@ -70,7 +69,7 @@ const mutations = {
   },
   SET_PASSWORD_MODIFIED: (state, passwordModified) => {
     state.passwordModified = passwordModified
-  },
+  }
 }
 
 const actions = {
@@ -84,7 +83,7 @@ const actions = {
         commit('SET_LOGIN_MSG', null)
         setToken(data.token)
         let passwordModified = true
-        if (data.hasOwnProperty('passwordModified')) {
+        if (Object.prototype.hasOwnProperty.call(data, 'passwordModified')) {
           passwordModified = data.passwordModified
         }
         commit('SET_PASSWORD_MODIFIED', passwordModified)
@@ -110,8 +109,8 @@ const actions = {
           reject('Verification failed, please Login again.')
         }
         const historyUserId = localStorage.getItem('userId')
-        if(historyUserId && historyUserId !== data.userId+''){
-          const clearLocalStorage = [ 'panel-main-tree', 'panel-default-tree','chart-tree','dataset-tree']
+        if (historyUserId && historyUserId !== data.userId + '') {
+          const clearLocalStorage = ['panel-main-tree', 'panel-default-tree', 'chart-tree', 'dataset-tree']
           clearLocalStorage.forEach((item) => {
             localStorage.removeItem(item)
           })

core/frontend/src/views/background/BackgroundOverall.vue

@@ -192,6 +192,7 @@ import { COLOR_PANEL } from '@/views/chart/chart/chart'
 import { uploadFileResult } from '@/api/staticResource/staticResource'
 import bus from '@/utils/bus'
 import BackgroundItemOverall from '@/views/background/BackgroundItemOverall'
+import { hexColorToRGBA } from '@/views/chart/chart/util'
 
 export default {
   name: 'BackgroundOverall',

core/frontend/src/views/background/index.vue

@@ -51,12 +51,12 @@
         >
           <el-color-picker
             ref="colorPicker"
-            @change="colorChange"
             v-model="curComponent.commonBackground.color"
             :disabled="!curComponent.commonBackground.backgroundColorSelect"
             size="mini"
             class="color-picker-style"
             :predefine="predefineColors"
+            @change="colorChange"
           />
         </el-col>
         <el-col :span="3">
@@ -263,7 +263,7 @@ import { deepCopy, imgUrlTrans } from '@/components/canvas/utils/utils'
 import { COLOR_PANEL } from '@/views/chart/chart/chart'
 import { uploadFileResult } from '@/api/staticResource/staticResource'
 import { COMMON_BACKGROUND_NONE } from '@/components/canvas/customComponent/component-list'
-import {hexColorToRGBA} from "@/views/chart/chart/util";
+import { hexColorToRGBA } from '@/views/chart/chart/util'
 
 export default {
   name: 'Background',

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

@@ -35,7 +35,7 @@ export const DEFAULT_COLOR_CASE = {
   mapStyle: 'normal',
   mapLineGradient: false,
   mapLineSourceColor: '#146C94',
-  mapLineTargetColor: '#576CBC',
+  mapLineTargetColor: '#576CBC'
 }
 
 export const DEFAULT_COLOR_CASE_DARK = {
@@ -57,7 +57,7 @@ export const DEFAULT_COLOR_CASE_DARK = {
   mapStyle: 'darkblue',
   mapLineGradient: false,
   mapLineSourceColor: '#2F58CD',
-  mapLineTargetColor: '#3795BD',
+  mapLineTargetColor: '#3795BD'
 }
 export const DEFAULT_SIZE = {
   barDefault: true,

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

@@ -246,6 +246,9 @@ export function getLabel(chart) {
                 contentItems.push(valueFormatter(param.value, formatterCfg))
               }
               res = contentItems.join('\n')
+            } else if (chart.type === 'scatter' && xAxis && xAxis.length > 0 && xAxis[0].groupType === 'q') {
+              // 针对散点图
+              res = param.field
             } else {
               for (let i = 0; i < yAxis.length; i++) {
                 const f = yAxis[i]
@@ -313,13 +316,18 @@ export function getTooltip(chart) {
       const t = JSON.parse(JSON.stringify(customAttr.tooltip))
       if (t.show) {
         tooltip = {}
-        let xAxis, yAxis, extStack
+        let xAxis, yAxis, extStack, xAxisExt
 
         try {
           xAxis = JSON.parse(chart.xaxis)
         } catch (e) {
           xAxis = JSON.parse(JSON.stringify(chart.xaxis))
         }
+        try {
+          xAxisExt = JSON.parse(chart.xaxisExt)
+        } catch (e) {
+          xAxisExt = JSON.parse(JSON.stringify(chart.xaxisExt))
+        }
         try {
           yAxis = JSON.parse(chart.yaxis)
         } catch (e) {
@@ -467,14 +475,18 @@ export function getTooltip(chart) {
           }
           //
           if (chart.type === 'scatter' && xAxis && xAxis.length > 0 && xAxis[0].groupType === 'q') {
-            tooltip.fields = ['x', 'category', 'value', 'group']
+            tooltip.fields = ['x', 'category', 'value', 'group', 'field']
             tooltip.customContent = (title, data) => {
               const key1 = xAxis[0]?.name
-              let key2, v1, v2
+              let key2, v1, v2, subGroup
+
+              let hasSubGroup = false
 
               if (data && data.length > 0) {
                 title = data[0].data.category
                 key2 = data[0].data.group
+                subGroup = data[0].data.field
+                hasSubGroup = xAxisExt.length > 0
 
                 const fx = xAxis[0]
                 if (fx.formatterCfg) {
@@ -499,6 +511,12 @@ export function getTooltip(chart) {
               return `
                      <div>
                        <div class="g2-tooltip-title">${title}</div>
+                       ` +
+                      (hasSubGroup
+                        ? `<div class="g2-tooltip-item">
+                                <span class="g2-tooltip-name">${xAxisExt[0].name}:</span><span class="g2-tooltip-value">${subGroup}</span>
+                            </div>` : ``) +
+                    `
                        <div class="g2-tooltip-item">
                            <span class="g2-tooltip-name">${key1}:</span><span class="g2-tooltip-value">${v1}</span>
                        </div>

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

@@ -1,4 +1,4 @@
-import { TableSheet, S2Event, PivotSheet, DataCell, EXTRA_FIELD, TOTAL_VALUE, BaseEvent } from '@antv/s2'
+import { TableSheet, S2Event, PivotSheet, DataCell, EXTRA_FIELD, TOTAL_VALUE } from '@antv/s2'
 import { getCustomTheme, getSize } from '@/views/chart/chart/common/common_table'
 import { DEFAULT_COLOR_CASE, DEFAULT_TOTAL } from '@/views/chart/chart/chart'
 import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
@@ -551,12 +551,12 @@ function getConditions(chart) {
       }
     }
 
-    let filedValueMap = getFieldValueMap(chart)
+    const filedValueMap = getFieldValueMap(chart)
     for (let i = 0; i < conditions.length; i++) {
       const field = conditions[i]
       res.text.push({
         field: field.field.dataeaseName,
-        mapping(value,rowData) {
+        mapping(value, rowData) {
           return {
             fill: mappingColor(value, valueColor, field, 'color', filedValueMap, rowData)
           }
@@ -564,7 +564,7 @@ function getConditions(chart) {
       })
       res.background.push({
         field: field.field.dataeaseName,
-        mapping(value,rowData) {
+        mapping(value, rowData) {
           return {
             fill: mappingColor(value, valueBgColor, field, 'backgroundColor', filedValueMap, rowData)
           }
@@ -575,7 +575,7 @@ function getConditions(chart) {
   return res
 }
 
-function getValue(field, filedValueMap, rowData){
+function getValue(field, filedValueMap, rowData) {
   if (field.summary === 'value') {
     return rowData[field.curField.dataeaseName]
   } else {
@@ -589,7 +589,7 @@ function mappingColor(value, defaultColor, field, type, filedValueMap, rowData)
     let flag = false
     const t = field.conditions[i]
     if (field.field.deType === 2 || field.field.deType === 3 || field.field.deType === 4) {
-      let tv,max,min;
+      let tv, max, min
       if (t.field === '1') {
         if (t.term === 'between') {
           max = parseFloat(getValue(t.maxField, filedValueMap, rowData))
@@ -648,7 +648,7 @@ function mappingColor(value, defaultColor, field, type, filedValueMap, rowData)
         color = defaultColor
       }
     } else if (field.field.deType === 0 || field.field.deType === 5) {
-      let tv;
+      let tv
       if (t.field === '1') {
         tv = getValue(t.targetField, filedValueMap, rowData)
       } else {
@@ -692,9 +692,9 @@ function mappingColor(value, defaultColor, field, type, filedValueMap, rowData)
       }
     } else {
       // time
-      let tv;
+      let tv
       if (t.field === '1') {
-        let fieldValue = getValue(t.targetField, filedValueMap, rowData);
+        const fieldValue = getValue(t.targetField, filedValueMap, rowData)
         if (fieldValue) {
           tv = new Date(fieldValue.replace(/-/g, '/') + ' GMT+8').getTime()
         }
@@ -760,12 +760,12 @@ function showTooltip(s2Instance, event, fieldMap) {
   })
 }
 
-function getFieldValueMap(view){
-  let fieldValueMap = {}
+function getFieldValueMap(view) {
+  const fieldValueMap = {}
   if (view.data && view.data.dynamicAssistData && view.data.dynamicAssistData.length > 0) {
     view.data.dynamicAssistData.forEach(ele => {
       fieldValueMap[ele.summary + '-' + ele.fieldId] = ele.value
-    });
+    })
   }
-  return fieldValueMap;
+  return fieldValueMap
 }

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

@@ -3452,7 +3452,43 @@ export function getColors(chart, colors, reset) {
         isCustom: false
       })
     }
-  } else if (includesAny(chart.type, 'bar', 'scatter', 'radar', 'area') && !chart.type.includes('group')) {
+  } else if (chart.type === 'scatter') {
+    const xAxis = JSON.parse(chart.xaxis)
+    if (chart.data && chart.render === 'antv' && xAxis && xAxis.length > 0 && xAxis[0].groupType === 'q') {
+      const data = chart.data.data
+      const groups = []
+      for (let i = 0; i < data.length; i++) {
+        const d = data[i]
+        if (!groups.includes(d.category)) {
+          groups.push(d.category)
+        }
+      }
+      for (let i = 0; i < groups.length; i++) {
+        const s = groups[i]
+        seriesColors.push({
+          name: s,
+          color: colors[i % colors.length],
+          isCustom: false
+        })
+      }
+    } else {
+      if (Object.prototype.toString.call(chart.yaxis) === '[object Array]') {
+        series = JSON.parse(JSON.stringify(chart.yaxis))
+      } else {
+        series = JSON.parse(chart.yaxis)
+      }
+      if (series) {
+        for (let i = 0; i < series.length; i++) {
+          const s = series[i]
+          seriesColors.push({
+            name: s.name,
+            color: colors[i % colors.length],
+            isCustom: false
+          })
+        }
+      }
+    }
+  } else if ((includesAny(chart.type, 'bar', 'radar', 'area')) && !chart.type.includes('group')) {
     if (Object.prototype.toString.call(chart.yaxis) === '[object Array]') {
       series = JSON.parse(JSON.stringify(chart.yaxis))
     } else {
@@ -3499,7 +3535,6 @@ export function getColors(chart, colors, reset) {
       // if (customSortData && customSortData.length > 0) {
       //   data = customSort(customSortData, data)
       // }
-
       for (let i = 0; i < data.length; i++) {
         const s = data[i]
         seriesColors.push({

core/frontend/src/views/chart/components/ChartComponentS2.vue

@@ -67,8 +67,8 @@
           >
             {{ $t('chart.total') }}
             <span>{{
-                (chart.datasetMode === 0 && !not_support_page_dataset.includes(chart.datasourceType)) ? chart.totalItems : ((chart.data && chart.data.tableRow) ? chart.data.tableRow.length : 0)
-              }}</span>
+              (chart.datasetMode === 0 && !not_support_page_dataset.includes(chart.datasourceType)) ? chart.totalItems : ((chart.data && chart.data.tableRow) ? chart.data.tableRow.length : 0)
+            }}</span>
             {{ $t('chart.items') }}
           </span>
           <de-pagination

core/frontend/src/views/chart/components/compare/CompareEdit.vue

@@ -56,7 +56,6 @@
 
 <script>
 import { compareDayList, compareMonthList, compareYearList } from '@/views/chart/chart/compare'
-import { SUPPORT_Y_M } from '@/views/chart/chart/chart'
 
 export default {
   name: 'CompareEdit',

core/frontend/src/views/chart/components/componentStyle/BackgroundColorSelector.vue

@@ -117,6 +117,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/LegendSelector.vue

@@ -221,6 +221,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/LegendSelectorAntV.vue

@@ -225,6 +225,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/MarginSelector.vue

@@ -251,6 +251,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/SplitSelector.vue

@@ -247,6 +247,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/SplitSelectorAntV.vue

@@ -147,9 +147,9 @@ export default {
 </script>
 
 <style scoped>
-  .el-divider--horizontal {
-    margin: 10px 0
-  }
+.el-divider--horizontal {
+  margin: 10px 0
+}
 .shape-item{
   padding: 6px;
   border: none;
@@ -165,6 +165,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/TitleSelector.vue

@@ -51,17 +51,17 @@
               />
             </el-select>
             <el-tooltip
-                class="item"
-                effect="dark"
-                placement="bottom"
+              class="item"
+              effect="dark"
+              placement="bottom"
             >
               <div
-                  slot="content"
-                  v-html="$t('chart.font_family_tip')"
+                slot="content"
+                v-html="$t('chart.font_family_tip')"
               />
               <i
-                  class="el-icon-info"
-                  style="cursor: pointer;color: #606266;margin-left: 4px;"
+                class="el-icon-info"
+                style="cursor: pointer;color: #606266;margin-left: 4px;"
               />
             </el-tooltip>
           </el-form-item>
@@ -303,6 +303,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/TitleSelectorAntV.vue

@@ -423,4 +423,12 @@ span {
 .dialog-css ::v-deep .el-dialog__body {
   padding: 10px 20px 20px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 </style>

core/frontend/src/views/chart/components/componentStyle/XAxisSelector.vue

@@ -478,6 +478,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/XAxisSelectorAntV.vue

@@ -465,6 +465,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/YAxisExtSelector.vue

@@ -465,6 +465,14 @@ export default {
   font-size: 12px;
   line-height: 38px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }

core/frontend/src/views/chart/components/componentStyle/YAxisExtSelectorAntV.vue

@@ -454,6 +454,14 @@ export default {
   justify-content: space-between;
   align-items: center;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .form-item-slider ::v-deep .el-form-item__label{
   font-size: 12px;
   line-height: 38px;

core/frontend/src/views/chart/components/componentStyle/YAxisSelector.vue

@@ -471,6 +471,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/YAxisSelectorAntV.vue

@@ -461,6 +461,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/componentStyle/dialog/RemarkEditor.vue

@@ -32,7 +32,7 @@ import 'tinymce/plugins/nonbreaking'
 import 'tinymce/plugins/pagebreak'
 import { imgUrlTrans } from '@/components/canvas/utils/utils'
 import { mapState } from 'vuex'
-import {hexColorToRGBA} from "@/views/chart/chart/util";
+import { hexColorToRGBA } from '@/views/chart/chart/util'
 // 编辑器引入
 export default {
   name: 'RemarkEditor',

core/frontend/src/views/chart/components/senior/Threshold.vue

@@ -7,6 +7,7 @@
         :model="thresholdForm"
         label-width="80px"
         size="mini"
+        @submit.native.prevent
       >
         <el-form-item
           :label="$t('chart.threshold_range')+'(%)'"
@@ -46,6 +47,7 @@
         :model="thresholdForm"
         label-width="80px"
         size="mini"
+        @submit.native.prevent
       >
         <el-form-item
           :label="$t('chart.threshold_range')+'(%)'"
@@ -306,21 +308,30 @@
                 >{{ $t('chart.filter_not_empty') }}</span>
               </el-col>
 
-              <el-col :span="4" v-if="!item.term.includes('null') && !item.term.includes('empty')">
-                  <span
-                          v-if="item.field === '0'"
-                          :title="$t('chart.field_fixed')"
-                  >{{ $t('chart.field_fixed') }}</span>
-                  <span
-                          v-if="item.field === '1'"
-                          :title="$t('chart.field_dynamic')"
-                  >{{ $t('chart.field_dynamic') }}</span>
+              <el-col
+                v-if="!item.term.includes('null') && !item.term.includes('empty')"
+                :span="4"
+              >
+                <span
+                  v-if="item.field === '0'"
+                  :title="$t('chart.field_fixed')"
+                >{{ $t('chart.field_fixed') }}</span>
+                <span
+                  v-if="item.field === '1'"
+                  :title="$t('chart.field_dynamic')"
+                >{{ $t('chart.field_dynamic') }}</span>
               </el-col>
-              <el-col :span="4" v-if="item.term.includes('null') || item.term.includes('empty')">
+              <el-col
+                v-if="item.term.includes('null') || item.term.includes('empty')"
+                :span="4"
+              >
                   &nbsp;
               </el-col>
 
-              <el-col :span="10" v-if="item.field === '0'">
+              <el-col
+                v-if="item.field === '0'"
+                :span="10"
+              >
                 <span
                   v-if="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
                   :title="item.value"
@@ -331,14 +342,20 @@
                 <span v-else>&nbsp;</span>
               </el-col>
 
-              <el-col :span="10" v-if="item.field === '1'">
-                <span v-if="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
-                      :title="item.targetField.curField.name + '(' + $t('chart.' + item.targetField.summary) + ')'">{{ item.targetField.curField.name + '(' + $t('chart.' + item.targetField.summary) + ')' }}</span>
+              <el-col
+                v-if="item.field === '1'"
+                :span="10"
+              >
+                <span
+                  v-if="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
+                  :title="item.targetField.curField.name + '(' + $t('chart.' + item.targetField.summary) + ')'"
+                >{{ item.targetField.curField.name + '(' + $t('chart.' + item.targetField.summary) + ')' }}</span>
 
-
-                <span v-else-if="!item.term.includes('null') && !item.term.includes('empty') && item.term === 'between'"
-                      :title="item.minField.curField.name + '(' + $t('chart.' + item.minField.summary) + ')' + ' ≤' + $t('chart.drag_block_label_value') + '≤ ' + item.maxField.curField.name + '(' + $t('chart.' + item.maxField.summary) + ')'">
-                    {{ item.minField.curField.name + '(' + $t('chart.' + item.minField.summary) + ')' + ' ≤' + $t('chart.drag_block_label_value') + '≤ ' + item.maxField.curField.name + '(' + $t('chart.' + item.maxField.summary) + ')' }}
+                <span
+                  v-else-if="!item.term.includes('null') && !item.term.includes('empty') && item.term === 'between'"
+                  :title="item.minField.curField.name + '(' + $t('chart.' + item.minField.summary) + ')' + ' ≤' + $t('chart.drag_block_label_value') + '≤ ' + item.maxField.curField.name + '(' + $t('chart.' + item.maxField.summary) + ')'"
+                >
+                  {{ item.minField.curField.name + '(' + $t('chart.' + item.minField.summary) + ')' + ' ≤' + $t('chart.drag_block_label_value') + '≤ ' + item.maxField.curField.name + '(' + $t('chart.' + item.maxField.summary) + ')' }}
                 </span>
 
                 <span v-else>&nbsp;</span>
@@ -663,7 +680,7 @@ export default {
     },
     fieldValid(field) {
       // 检查字段和聚合方式是否不为空
-      return field && field.fieldId && field.summary;
+      return field && field.fieldId && field.summary
     },
     changeTableThreshold() {
       // check line config

core/frontend/src/views/chart/components/senior/dialog/TableThresholdEdit.vue

@@ -95,35 +95,35 @@
 
           <el-col :span="3">
             <el-select
-                v-show="!item.term.includes('null') && !item.term.includes('empty')"
-                v-model="item.field"
-                size="mini"
-                style="margin-left: 10px;"
-                @change="changeThresholdField(item)"
+              v-show="!item.term.includes('null') && !item.term.includes('empty')"
+              v-model="item.field"
+              size="mini"
+              style="margin-left: 10px;"
+              @change="changeThresholdField(item)"
             >
               <el-option
-                  v-for="opt in fieldTypeOptions"
-                  :key="opt.value"
-                  :label="opt.label"
-                  :value="opt.value"
+                v-for="opt in fieldTypeOptions"
+                :key="opt.value"
+                :label="opt.label"
+                :value="opt.value"
               />
             </el-select>
           </el-col>
           <el-col
-              v-if="item.field === '0'"
-              :span="12"
+            v-if="item.field === '0'"
+            :span="12"
           >
-              <el-input
-                v-show="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
-                v-model="item.value"
-                class="value-item"
-                style="margin-left: 10px;"
-                :placeholder="$t('chart.drag_block_label_value')"
-                size="mini"
-                clearable
-                @change="changeThreshold"
-              />
-              <span v-if="item.term === 'between'">
+            <el-input
+              v-show="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
+              v-model="item.value"
+              class="value-item"
+              style="margin-left: 10px;"
+              :placeholder="$t('chart.drag_block_label_value')"
+              size="mini"
+              clearable
+              @change="changeThreshold"
+            />
+            <span v-if="item.term === 'between'">
               <el-input
                 v-model="item.min"
                 class="item-long-between"
@@ -144,8 +144,8 @@
             </span>
           </el-col>
           <el-col
-              v-if="item.field === '1'"
-              :span="12"
+            v-if="item.field === '1'"
+            :span="12"
           >
             <span v-show="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'">
               <el-select
@@ -162,45 +162,45 @@
                   :label="fieldOption.name"
                   :value="fieldOption.id"
                 >
-                <span style="float: left">
-                  <svg-icon
-                    v-if="fieldOption.deType === 0"
-                    icon-class="field_text"
-                    class="field-icon-text"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 1"
-                    icon-class="field_time"
-                    class="field-icon-time"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 2 || fieldOption.deType === 3"
-                    icon-class="field_value"
-                    class="field-icon-value"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 5"
-                    icon-class="field_location"
-                    class="field-icon-location"
-                  />
-                </span>
+                  <span style="float: left">
+                    <svg-icon
+                      v-if="fieldOption.deType === 0"
+                      icon-class="field_text"
+                      class="field-icon-text"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 1"
+                      icon-class="field_time"
+                      class="field-icon-time"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 2 || fieldOption.deType === 3"
+                      icon-class="field_value"
+                      class="field-icon-value"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 5"
+                      icon-class="field_location"
+                      class="field-icon-location"
+                    />
+                  </span>
                   <span style="float: left; color: #8492a6; font-size: 12px">{{ fieldOption.name }}</span>
                 </el-option>
               </el-select>
               <el-select
-                  v-model="item.targetField.summary"
-                  size="mini"
-                  class="item-long select-item"
-                  style="margin-left: 10px;"
-                  :placeholder="$t('chart.aggregation')"
-                  @change="changeThreshold"
-                  @visible-change="$forceUpdate()"
+                v-model="item.targetField.summary"
+                size="mini"
+                class="item-long select-item"
+                style="margin-left: 10px;"
+                :placeholder="$t('chart.aggregation')"
+                @change="changeThreshold"
+                @visible-change="$forceUpdate()"
               >
                 <el-option
-                        v-for="opt in getSummaryOptions(fieldItem.field.deType)"
-                        :key="opt.id"
-                        :value="opt.id"
-                        :label="opt.name"
+                  v-for="opt in getSummaryOptions(fieldItem.field.deType)"
+                  :key="opt.id"
+                  :value="opt.id"
+                  :label="opt.name"
                 />
               </el-select>
             </span>
@@ -220,28 +220,28 @@
                   :label="fieldOption.name"
                   :value="fieldOption.id"
                 >
-                <span style="float: left">
-                  <svg-icon
-                    v-if="fieldOption.deType === 0"
-                    icon-class="field_text"
-                    class="field-icon-text"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 1"
-                    icon-class="field_time"
-                    class="field-icon-time"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 2 || fieldOption.deType === 3"
-                    icon-class="field_value"
-                    class="field-icon-value"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 5"
-                    icon-class="field_location"
-                    class="field-icon-location"
-                  />
-                </span>
+                  <span style="float: left">
+                    <svg-icon
+                      v-if="fieldOption.deType === 0"
+                      icon-class="field_text"
+                      class="field-icon-text"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 1"
+                      icon-class="field_time"
+                      class="field-icon-time"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 2 || fieldOption.deType === 3"
+                      icon-class="field_value"
+                      class="field-icon-value"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 5"
+                      icon-class="field_location"
+                      class="field-icon-location"
+                    />
+                  </span>
                   <span style="float: left; color: #8492a6; font-size: 12px">{{ fieldOption.name }}</span>
                 </el-option>
               </el-select>
@@ -255,10 +255,10 @@
                 @visible-change="$forceUpdate()"
               >
                 <el-option
-                        v-for="opt in getSummaryOptions(fieldItem.field.deType)"
-                        :key="opt.id"
-                        :value="opt.id"
-                        :label="opt.name"
+                  v-for="opt in getSummaryOptions(fieldItem.field.deType)"
+                  :key="opt.id"
+                  :value="opt.id"
+                  :label="opt.name"
                 />
               </el-select>
               <span style="margin: 0 4px;">≤{{ $t('chart.drag_block_label_value') }}≤</span>
@@ -275,28 +275,28 @@
                   :label="fieldOption.name"
                   :value="fieldOption.id"
                 >
-                <span style="float: left">
-                  <svg-icon
-                    v-if="fieldOption.deType === 0"
-                    icon-class="field_text"
-                    class="field-icon-text"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 1"
-                    icon-class="field_time"
-                    class="field-icon-time"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 2 || fieldOption.deType === 3"
-                    icon-class="field_value"
-                    class="field-icon-value"
-                  />
-                  <svg-icon
-                    v-if="fieldOption.deType === 5"
-                    icon-class="field_location"
-                    class="field-icon-location"
-                  />
-                </span>
+                  <span style="float: left">
+                    <svg-icon
+                      v-if="fieldOption.deType === 0"
+                      icon-class="field_text"
+                      class="field-icon-text"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 1"
+                      icon-class="field_time"
+                      class="field-icon-time"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 2 || fieldOption.deType === 3"
+                      icon-class="field_value"
+                      class="field-icon-value"
+                    />
+                    <svg-icon
+                      v-if="fieldOption.deType === 5"
+                      icon-class="field_location"
+                      class="field-icon-location"
+                    />
+                  </span>
                   <span style="float: left; color: #8492a6; font-size: 12px">{{ fieldOption.name }}</span>
                 </el-option>
               </el-select>
@@ -320,7 +320,6 @@
 
           </el-col>
 
-
           <el-col
             :span="3"
             style="display: flex;align-items: center;justify-content: center;"
@@ -400,22 +399,22 @@ export default {
         backgroundColor: '#ffffff00',
         min: '0',
         max: '1',
-        targetField:{},
-        minField:{},
-        maxField:{}
+        targetField: {},
+        minField: {},
+        maxField: {}
       },
       summaryOptions: [{
-          id: 'value',
-          name: this.$t('chart.value')
+        id: 'value',
+        name: this.$t('chart.value')
       }, {
-          id: 'avg',
-          name: this.$t('chart.avg')
+        id: 'avg',
+        name: this.$t('chart.avg')
       }, {
-          id: 'max',
-          name: this.$t('chart.max')
+        id: 'max',
+        name: this.$t('chart.max')
       }, {
-          id: 'min',
-          name: this.$t('chart.min')
+        id: 'min',
+        name: this.$t('chart.min')
       }],
       textOptions: [
         {
@@ -546,13 +545,13 @@ export default {
     initConditionField(item) {
       // 兼容旧数据
       if (!item.targetField) {
-        item.targetField = {};
+        item.targetField = {}
       }
       if (!item.minField) {
-        item.minField = {};
+        item.minField = {}
       }
       if (!item.maxField) {
-        item.maxField = {};
+        item.maxField = {}
       }
     },
     initOptions(item) {
@@ -609,7 +608,7 @@ export default {
       this.fields.forEach(ele => {
         // 视图字段和计数字段不可用
         if (ele.chartId || ele.id === 'count') {
-          return;
+          return
         }
         if (ele.deType === 0 || ele.deType === 5) {
           this.fieldsByType.text.push(ele)
@@ -622,17 +621,17 @@ export default {
     },
     getSummaryOptions(deType) {
       if (deType === 1) {
-          // 时间
-          return this.summaryOptions.filter(ele => {
-              return ele.id !== 'avg'
-          })
+        // 时间
+        return this.summaryOptions.filter(ele => {
+          return ele.id !== 'avg'
+        })
       } else if (deType === 0 || deType === 5) {
-          // 文本、地理位置
-          return this.summaryOptions.filter(ele => {
-              return ele.id === 'value'
-          })
+        // 文本、地理位置
+        return this.summaryOptions.filter(ele => {
+          return ele.id === 'value'
+        })
       } else {
-          return this.summaryOptions
+        return this.summaryOptions
       }
     },
     addThreshold() {
@@ -651,31 +650,31 @@ export default {
         if (item.term === 'between') {
           item.minField.curField = this.getQuotaField(item.minField.fieldId)
           item.maxField.curField = this.getQuotaField(item.maxField.fieldId)
-          item.targetField = {};
+          item.targetField = {}
         } else {
           item.targetField.curField = this.getQuotaField(item.targetField.fieldId)
-          item.minField = {};
-          item.maxField = {};
+          item.minField = {}
+          item.maxField = {}
         }
       } else {
-          item.targetField = {};
-          item.minField = {};
-          item.maxField = {};
+        item.targetField = {}
+        item.minField = {}
+        item.maxField = {}
       }
       this.changeThreshold()
     },
     getQuotaField(id) {
-        if (!id) {
-            return {}
-        }
-        const fields = this.fields.filter(ele => {
-            return ele.id === id
-        })
-        if (fields.length === 0) {
-            return {}
-        } else {
-            return fields[0]
-        }
+      if (!id) {
+        return {}
+      }
+      const fields = this.fields.filter(ele => {
+        return ele.id === id
+      })
+      if (fields.length === 0) {
+        return {}
+      } else {
+        return fields[0]
+      }
     },
     addConditions(item) {
       item.conditions.push(JSON.parse(JSON.stringify(this.thresholdCondition)))

core/frontend/src/views/chart/components/shapeAttr/ColorSelector.vue

@@ -120,6 +120,7 @@
                 v-show="showProperty('customColor')"
                 class="custom-color-style"
               >
+                aaa
                 <div
                   v-for="(item,index) in colorForm.seriesColors"
                   :key="index"
@@ -640,6 +641,13 @@ export default {
   font-size: 12px;
 }
 
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item {
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/ColorSelectorExt.vue

@@ -361,6 +361,13 @@ export default {
   font-size: 12px;
 }
 
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item {
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/LabelSelector.vue

@@ -330,6 +330,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/LabelSelectorAntV.vue

@@ -422,14 +422,14 @@ export default {
 </script>
 
 <style scoped>
-  .shape-item{
-    padding: 6px;
-    border: none;
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-  }
+.shape-item{
+  padding: 6px;
+  border: none;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
 .form-item-slider ::v-deep .el-form-item__label{
   font-size: 12px;
   line-height: 38px;
@@ -437,6 +437,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/SizeSelector.vue

@@ -1211,6 +1211,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/SizeSelectorAntV.vue

@@ -1788,6 +1788,13 @@ export default {
     font-size: 12px;
   }
 
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
   .el-select-dropdown__item {
     padding: 0 20px;
   }

core/frontend/src/views/chart/components/shapeAttr/TooltipSelector.vue

@@ -220,6 +220,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/TooltipSelectorAntV.vue

@@ -165,6 +165,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/components/shapeAttr/TotalCfg.vue

@@ -469,6 +469,14 @@ export default {
 .form-item ::v-deep .el-form-item__label{
   font-size: 12px;
 }
+
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
+
 .el-select-dropdown__item{
   padding: 0 20px;
 }

core/frontend/src/views/chart/view/ChartEdit.vue

@@ -105,11 +105,12 @@
                   <span class="el-dropdown-link">
                     <el-button
                       :title="$t('dataset.field_manage')"
-                      icon="el-icon-setting"
                       type="text"
                       size="mini"
                       style="float: right;width: 20px;margin-left: 4px;"
-                    />
+                    >
+                      <svg-icon icon-class="icon-setting" />
+                    </el-button>
                   </span>
                   <el-dropdown-menu slot="dropdown">
                     <el-dropdown-item
@@ -129,12 +130,13 @@
                 </el-dropdown>
                 <el-button
                   :title="$t('chart.change_ds')"
-                  icon="el-icon-refresh"
                   type="text"
                   size="mini"
                   style="float: right;width: 20px;margin-left: 4px;"
                   @click="changeDs"
-                />
+                >
+                  <svg-icon icon-class="icon_switch_outlined" />
+                </el-button>
               </div>
 
               <div
@@ -920,6 +922,67 @@
                         <span class="drag-placeholder-style-span">{{ $t('chart.placeholder_field') }}</span>
                       </div>
                     </el-row>
+                    <el-row
+                      v-if="view.type === 'scatter' && view.render === 'antv'"
+                      class="padding-lr"
+                    >
+                      <span class="data-area-label">
+                        <span>
+                          {{ $t('chart.chart_group') }}
+                        </span>
+                        /
+                        <span>{{ $t('chart.dimension') }}</span>
+                        <el-tooltip
+                          class="item"
+                          effect="dark"
+                          placement="bottom"
+                        >
+                          <div slot="content">
+                            {{ $t('chart.scatter_group_tip') }}
+                          </div>
+                          <i
+                            class="el-icon-info"
+                            style="cursor: pointer;color: #606266;"
+                          />
+                        </el-tooltip>
+                        <i
+                          class="el-icon-arrow-down el-icon-delete data-area-clear"
+                          @click="clearData('xaxisExt')"
+                        />
+                      </span>
+                      <draggable
+                        v-model="view.xaxisExt"
+                        group="drag"
+                        animation="300"
+                        :move="onMove"
+                        class="drag-block-style"
+                        @add="addXaxisExt"
+                        @update="calcData(true)"
+                      >
+                        <transition-group class="draggable-group">
+                          <dimension-ext-item
+                            v-for="(item,index) in view.xaxisExt"
+                            :key="item.id"
+                            :param="param"
+                            :index="index"
+                            :item="item"
+                            :dimension-data="dimension"
+                            :quota-data="quota"
+                            :chart="chart"
+                            @onDimensionItemChange="dimensionItemChange"
+                            @onDimensionItemRemove="dimensionItemRemove"
+                            @editItemFilter="showDimensionEditFilter"
+                            @onNameEdit="showRename"
+                          />
+                        </transition-group>
+                      </draggable>
+                      <div
+                        v-if="!view.xaxisExt || view.xaxisExt.length === 0"
+                        class="drag-placeholder-style"
+                      >
+                        <span class="drag-placeholder-style-span">{{ $t('chart.placeholder_field') }}</span>
+                      </div>
+                    </el-row>
                     <!--extBubble-->
                     <el-row
                       v-if="view.type && view.type.includes('scatter')"
@@ -2084,31 +2147,34 @@ export default {
     },
     watchChartTypeChangeObj(newVal, oldVal) {
       this.view.isPlugin = newVal.isPlugin
-      if (newVal.id === oldVal.id && newVal.type !== oldVal.type && oldVal.type === 'table-info' && this.view.xaxis.length > 0) {
-        // 针对明细表切换为其他图表
-        this.$message({
-          showClose: true,
-          message: this.$t('chart.table_info_switch'),
-          type: 'warning'
-        })
-        this.view.xaxis = []
-      }
-      if (newVal.id === oldVal.id && newVal.type !== oldVal.type) {
-        this.view.senior.threshold = {}
-      }
       if (newVal.type === oldVal.type && newVal.render === oldVal.render && newVal.isPlugin === oldVal.isPlugin) {
         return
       }
-      if (newVal.render === 'antv' && newVal.type === 'chart-mix') {
-        // 针对antv组合图，清理自定义排序
-        this.view.xaxis.forEach(x => {
-          x.customSort = []
-          x.sort = 'none'
-        })
-      }
-      if (oldVal.id !== 'echart') {
-        this.setChartDefaultOptions()
-        this.calcData(true, 'chart', true, newVal.type !== oldVal.type, newVal.render !== oldVal.render)
+      // 针对同一个图表，更改类型或者render时
+      if (newVal.id === oldVal.id) {
+        if (newVal.type !== oldVal.type && oldVal.type === 'table-info' && this.view.xaxis.length > 0) {
+          // 针对明细表切换为其他图表
+          this.$message({
+            showClose: true,
+            message: this.$t('chart.table_info_switch'),
+            type: 'warning'
+          })
+          this.view.xaxis = []
+        }
+        if (newVal.type !== oldVal.type) {
+          this.view.senior.threshold = {}
+        }
+        if (newVal.render === 'antv' && newVal.type === 'chart-mix') {
+          // 针对antv组合图，清理自定义排序
+          this.view.xaxis.forEach(x => {
+            x.customSort = []
+            x.sort = 'none'
+          })
+        }
+        if (newVal.type !== oldVal.type || newVal.render !== oldVal.render) {
+          this.setChartDefaultOptions()
+          this.calcData(true, 'chart', true, newVal.type !== oldVal.type, newVal.render !== oldVal.render)
+        }
       }
     }
   },
@@ -3152,7 +3218,7 @@ export default {
         this.dragCheckType(this.view.xaxisExt, 'd')
       }
       this.dragMoveDuplicate(this.view.xaxisExt, e)
-      if ((this.view.type === 'map' || this.view.type === 'word-cloud') && this.view.xaxisExt.length > 1) {
+      if ((this.view.type === 'map' || this.view.type === 'word-cloud' || this.view.type === 'scatter') && this.view.xaxisExt.length > 1) {
         this.view.xaxisExt = [this.view.xaxisExt[0]]
       }
       this.calcData(true)

core/frontend/src/views/chart/view/ChartStyle.vue

@@ -766,6 +766,16 @@ span {
   font-size: 12px;
 }
 
+.form-item {
+  ::v-deep .el-form-item__content {
+    .el-checkbox {
+      .el-checkbox__label {
+        font-size: 12px;
+      }
+    }
+  }
+}
+
 .no-properties {
   width: 100%;
   text-align: center;

core/frontend/src/views/chart/view/TitleRemark.vue

@@ -1,6 +1,8 @@
 <template>
-  <span style="transform: translate(0);display: inline-block;position: relative;
-    z-index: 10;">
+  <span
+    style="transform: translate(0);display: inline-block;position: relative;
+    z-index: 10;"
+  >
     <el-popover
       placement="bottom"
       trigger="hover"

core/frontend/src/views/dataset/Form.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="de-dataset-form">
-    <div v-loading="saveDisabled" class="top">
+    <div
+      v-loading="saveDisabled"
+      class="top"
+    >
       <span class="name">
         <i
           class="el-icon-arrow-left"

core/frontend/src/views/dataset/add/AddApi.vue

@@ -9,7 +9,7 @@
       class="arrow-right"
       @click="showLeft = true"
     >
-      <i class="el-icon-d-arrow-right"/>
+      <i class="el-icon-d-arrow-right" />
     </p>
     <div
       v-show="showLeft"
@@ -172,8 +172,8 @@
           class="data"
         >
           <span class="result-num">{{
-              `${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')}`
-            }}</span>
+            `${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')}`
+          }}</span>
           <div class="table-grid">
             <ux-grid
               ref="plxTable"

core/frontend/src/views/dataset/add/AddCustom.vue

@@ -24,7 +24,7 @@
         </el-button>
       </el-row>
     </el-row>
-    <el-divider/>
+    <el-divider />
     <el-row>
       <el-form :inline="true">
         <el-form-item

core/frontend/src/views/dataset/add/AddDB.vue

@@ -9,7 +9,7 @@
       class="arrow-right"
       @click="showLeft = true"
     >
-      <i class="el-icon-d-arrow-right"/>
+      <i class="el-icon-d-arrow-right" />
     </p>
     <div
       v-show="showLeft"
@@ -179,8 +179,8 @@
           class="data"
         >
           <span class="result-num">{{
-              `${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')}`
-            }}</span>
+            `${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')}`
+          }}</span>
           <div class="table-grid">
             <ux-grid
               ref="plxTable"

core/frontend/src/views/dataset/add/AddExcel.vue

@@ -8,7 +8,7 @@
       class="arrow-right"
       @click="showLeft = true"
     >
-      <i class="el-icon-d-arrow-right"/>
+      <i class="el-icon-d-arrow-right" />
     </p>
     <div
       v-show="showLeft"
@@ -21,16 +21,16 @@
             effect="dark"
             placement="right"
           >
-      <div slot="content">
-        {{ $t('dataset.excel_info_1') }}<br>
-        {{ $t('dataset.excel_info_2') }}<br>
-        {{ $t('dataset.excel_info_3') }}
-      </div>
-      <svg-icon icon-class="icon_info_outlined" /></el-tooltip></span>
-      <i
-        class="el-icon-d-arrow-left"
-        @click="showLeft = false"
-      />
+            <div slot="content">
+              {{ $t('dataset.excel_info_1') }}<br>
+              {{ $t('dataset.excel_info_2') }}<br>
+              {{ $t('dataset.excel_info_3') }}
+            </div>
+            <svg-icon icon-class="icon_info_outlined" /></el-tooltip></span>
+        <i
+          class="el-icon-d-arrow-left"
+          @click="showLeft = false"
+        />
       </p>
       <el-upload
         :action="baseUrl + 'dataset/table/excel/upload'"
@@ -150,14 +150,14 @@
               min-width="200px"
               :field="field.fieldName"
               :title="field.remarks"
-              :fieldType="field.fieldType"
+              :field-type="field.fieldType"
               :resizable="true"
             >
               <template #header>
                 <el-dropdown
+                  :key="field.fieldName + field.fieldType"
                   placement="bottom-start"
                   trigger="click"
-                  :key="field.fieldName + field.fieldType"
                   @command="(type) => handleCommand(type, field)"
                 >
                   <span class="type-switch">
@@ -179,7 +179,7 @@
                       icon-class="field_value"
                       class="field-icon-value"
                     />
-                    <i class="el-icon-arrow-down el-icon--right"/></span>
+                    <i class="el-icon-arrow-down el-icon--right" /></span>
                   <el-dropdown-menu
                     slot="dropdown"
                     style="width: 178px"
@@ -237,8 +237,9 @@ import { $alert } from '@/utils/message'
 import store from '@/store'
 import msgCfm from '@/components/msgCfm/index'
 import cancelMix from './cancelMix'
-import Config from "@/settings";
+import Config from '@/settings'
 import { updateCacheTree } from '@/components/canvas/utils/utils'
+import { setToken } from '@/utils/auth'
 
 const token = getToken()
 const RefreshTokenKey = Config.RefreshTokenKey

core/frontend/src/views/dataset/add/AddSQL.vue

@@ -23,8 +23,8 @@
             />
           </el-select>
           <el-select
-            :disabled="param.tableId"
             v-model="mode"
+            :disabled="param.tableId"
             style="width: 120px; margin: 0 12px"
             filterable
             :placeholder="$t('dataset.connect_mode')"
@@ -35,16 +35,16 @@
               value="0"
             />
             <el-option
+              v-if="engineMode !== 'simple'"
               :label="$t('dataset.sync_data')"
               value="1"
-              v-if="engineMode !== 'simple'"
               :disabled="disabledSync"
             />
           </el-select>
           <el-select
-            :disabled="param.tableId"
             v-if="mode === '1'"
             v-model="syncType"
+            :disabled="param.tableId"
             style="width: 120px"
             filterable
             :placeholder="$t('dataset.connect_mode')"
@@ -71,7 +71,7 @@
             class="de-text-btn"
             @click="dataReference = true"
           >
-            <svg-icon icon-class="data-reference"/>
+            <svg-icon icon-class="data-reference" />
             {{ $t('deDataset.data_reference') }}
           </el-button>
           <el-button
@@ -81,17 +81,17 @@
             class="de-text-btn"
             @click="variableMgm"
           >
-            <svg-icon icon-class="reference-setting"/>
+            <svg-icon icon-class="reference-setting" />
             {{ $t('sql_variable.variable_mgm') }}
           </el-button>
-          <el-divider direction="vertical"/>
+          <el-divider direction="vertical" />
           <el-button
             class="de-text-btn"
             type="text"
             size="small"
             @click="getSQLPreview"
           >
-            <svg-icon icon-class="reference-play"/>
+            <svg-icon icon-class="reference-play" />
             {{ $t('deDataset.run_a_query') }}
           </el-button>
         </el-col>
@@ -112,7 +112,7 @@
                 dataTable = ''
                 ;keywords = ''
               "
-            ><i class="el-icon-arrow-left"/> {{ $t('chart.back') }}</span>
+            ><i class="el-icon-arrow-left" /> {{ $t('chart.back') }}</span>
             <span v-else>{{ $t('deDataset.data_reference') }}</span>
             <i
               style="cursor: pointer"
@@ -132,7 +132,7 @@
               :title="(showTable && dataTable) || selectedDatasource.name"
               class="grey-name"
             >
-              <svg-icon icon-class="db-de"/>
+              <svg-icon icon-class="db-de" />
               {{ (showTable && dataTable) || selectedDatasource.name }}
             </span>
             <span class="grey">
@@ -147,12 +147,15 @@
           v-if="!dataSource"
           class="no-select-datasource"
         >{{
-            $t('deDataset.to_start_using')
-          }}</span>
+          $t('deDataset.to_start_using')
+        }}</span>
         <template v-else>
-          <el-input :placeholder="$t('fu.search_bar.please_input')" style="padding: 5px" size="small"
-                    v-model="keywords"
-          ></el-input>
+          <el-input
+            v-model="keywords"
+            :placeholder="$t('fu.search_bar.please_input')"
+            style="padding: 5px"
+            size="small"
+          />
           <div
             v-if="dataSource && !dataTable"
             v-loading="tableLoading"
@@ -164,10 +167,10 @@
               class="table-or-field"
               @click="typeSwitch(ele)"
             >
-            <span
-              :title="`${ele.name}${ele.remark ? ':' + ele.remark : ''}`"
-              class="name"
-            >{{ ele.name }}</span>
+              <span
+                :title="`${ele.name}${ele.remark ? ':' + ele.remark : ''}`"
+                class="name"
+              >{{ ele.name }}</span>
               <i
                 v-clipboard:copy="ele.name"
                 v-clipboard:success="onCopy"
@@ -187,10 +190,10 @@
               :key="ele.fieldName"
               class="table-or-field field"
             >
-            <span
-              :title="`${ele.fieldName}${ele.remark ? ':' + ele.remark : ''}`"
-              class="name"
-            >{{ ele.fieldName }}</span>
+              <span
+                :title="`${ele.fieldName}${ele.remark ? ':' + ele.remark : ''}`"
+                class="name"
+              >{{ ele.fieldName }}</span>
               <i
                 v-clipboard:copy="ele.fieldName"
                 v-clipboard:success="onCopy"
@@ -232,10 +235,10 @@
               v-if="tabActive === 'result'"
               class="result-num"
             >{{
-                `(${$t('dataset.preview_show')} 1000 ${$t(
-                  'dataset.preview_item'
-                )})`
-              }}</span>
+              `(${$t('dataset.preview_show')} 1000 ${$t(
+                'dataset.preview_item'
+              )})`
+            }}</span>
 
             <span
               class="drag"
@@ -274,28 +277,32 @@
               :description="$t('deDataset.run_failed')"
             >{{ errMsgCont }}
             </el-empty>
-            <div style="float: left; min-width: 100%;" v-else-if="fields.length">
-              <el-table
-              :data="plxTableData"
-              size="mini"
-              border
+            <div
+              v-else-if="fields.length"
+              style="float: left; min-width: 100%;"
             >
-              <el-table-column
-                v-for="field in fields"
-                :key="field.fieldName"
-                min-width="200px"
-                :prop="field.fieldName"
-                :label="field.remarks"
-                resizable>
-                <template slot-scope="scope">
-                  <span>{{ at(scope.row, field.fieldName)[0] }}</span>
-                </template>
-              </el-table-column>
-            </el-table>
+              <el-table
+                :data="plxTableData"
+                size="mini"
+                border
+              >
+                <el-table-column
+                  v-for="field in fields"
+                  :key="field.fieldName"
+                  min-width="200px"
+                  :prop="field.fieldName"
+                  :label="field.remarks"
+                  resizable
+                >
+                  <template slot-scope="scope">
+                    <span>{{ at(scope.row, field.fieldName)[0] }}</span>
+                  </template>
+                </el-table-column>
+              </el-table>
             </div>
             <el-table
-              :data="plxTableData"
               v-else
+              :data="plxTableData"
               size="mini"
               border
             >
@@ -391,7 +398,7 @@
             direction="rtl"
           >
             <div class="content">
-              <i class="el-icon-info"/>
+              <i class="el-icon-info" />
               {{ $t('dataset.sql_variable_limit_1') }}<br>
               {{ $t('dataset.sql_variable_limit_2') }}<br>
             </div>
@@ -478,7 +485,8 @@
                     v-model="scope.row.defaultValue"
                     size="small"
                     type="text"
-                    :placeholder="$t('fu.search_bar.please_input')">
+                    :placeholder="$t('fu.search_bar.please_input')"
+                  >
                     <el-select
                       slot="prepend"
                       v-model="scope.row.defaultValueScope"
@@ -517,7 +525,10 @@
                       />
                     </el-select>
                   </el-input>
-                  <div v-if="['DATETIME-YEAR', 'DATETIME-YEAR-MONTH', 'DATETIME-YEAR-MONTH-DAY', 'DATETIME'].includes(scope.row.type[0])" class="el-input-group el-input-group--prepend de-group__prepend">
+                  <div
+                    v-if="['DATETIME-YEAR', 'DATETIME-YEAR-MONTH', 'DATETIME-YEAR-MONTH-DAY', 'DATETIME'].includes(scope.row.type[0])"
+                    class="el-input-group el-input-group--prepend de-group__prepend"
+                  >
                     <div class="el-input-group__prepend">
                       <el-select
                         v-model="scope.row.defaultValueScope"
@@ -532,45 +543,45 @@
                         />
                       </el-select>
                     </div>
-                  <el-date-picker
-                    v-if="scope.row.type[0] === 'DATETIME-YEAR'"
-                    v-model="scope.row.defaultValue"
-                    type="year"
-                    size="small"
-                    value-format="yyyy"
-                    :placeholder="$t('dataset.select_year')"
-                  />
+                    <el-date-picker
+                      v-if="scope.row.type[0] === 'DATETIME-YEAR'"
+                      v-model="scope.row.defaultValue"
+                      type="year"
+                      size="small"
+                      value-format="yyyy"
+                      :placeholder="$t('dataset.select_year')"
+                    />
 
-                  <el-date-picker
-                    v-if="scope.row.type[0] === 'DATETIME-YEAR-MONTH'"
-                    v-model="scope.row.defaultValue"
-                    type="month"
-                    size="small"
-                    :format="scope.row.type[1]"
-                    :value-format="scope.row.type[1]"
-                    :placeholder="$t('dataset.select_month')"
-                  />
+                    <el-date-picker
+                      v-if="scope.row.type[0] === 'DATETIME-YEAR-MONTH'"
+                      v-model="scope.row.defaultValue"
+                      type="month"
+                      size="small"
+                      :format="scope.row.type[1]"
+                      :value-format="scope.row.type[1]"
+                      :placeholder="$t('dataset.select_month')"
+                    />
 
-                  <el-date-picker
-                    v-if="scope.row.type[0] === 'DATETIME-YEAR-MONTH-DAY'"
-                    v-model="scope.row.defaultValue"
-                    type="date"
-                    size="small"
-                    :format="scope.row.type[1]"
-                    :value-format="scope.row.type[1]"
-                    :placeholder="$t('dataset.select_date')"
-                  />
+                    <el-date-picker
+                      v-if="scope.row.type[0] === 'DATETIME-YEAR-MONTH-DAY'"
+                      v-model="scope.row.defaultValue"
+                      type="date"
+                      size="small"
+                      :format="scope.row.type[1]"
+                      :value-format="scope.row.type[1]"
+                      :placeholder="$t('dataset.select_date')"
+                    />
 
-                  <el-date-picker
-                    v-if="scope.row.type[0] === 'DATETIME'"
-                    v-model="scope.row.defaultValue"
-                    type="datetime"
-                    size="small"
-                    :format="scope.row.type[1]"
-                    :value-format="scope.row.type[1]"
-                    :placeholder="$t('dataset.select_time')"
-                  />
-                </div>
+                    <el-date-picker
+                      v-if="scope.row.type[0] === 'DATETIME'"
+                      v-model="scope.row.defaultValue"
+                      type="datetime"
+                      size="small"
+                      :format="scope.row.type[1]"
+                      :value-format="scope.row.type[1]"
+                      :placeholder="$t('dataset.select_time')"
+                    />
+                  </div>
                 </template>
               </el-table-column>
             </el-table>
@@ -579,15 +590,15 @@
                 secondary
                 @click="closeVariableMgm"
               >{{
-                  $t('dataset.cancel')
-                }}
+                $t('dataset.cancel')
+              }}
               </deBtn>
               <deBtn
                 type="primary"
                 @click="saveVariable()"
               >{{
-                  $t('dataset.confirm')
-                }}
+                $t('dataset.confirm')
+              }}
               </deBtn>
             </div>
           </el-drawer>
@@ -1092,7 +1103,7 @@ export default {
             for (let i = 0; i < this.variables.length; i++) {
               if (this.variables[i].variableName === name) {
                 obj = this.variables[i]
-                if(!obj.hasOwnProperty("defaultValueScope")){
+                if (Object.prototype.hasOwnProperty.call(obj, 'defaultValueScope')) {
                   obj.defaultValueScope = 'EDIT'
                 }
               }

core/frontend/src/views/dataset/add/AddUnion.vue

@@ -53,8 +53,8 @@
       <div class="sql-title">
         {{ $t('deDataset.data_preview') }}
         <span class="result-num">{{
-            `(${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')})`
-          }}</span>
+          `(${$t('dataset.preview_show')} 1000 ${$t('dataset.preview_item')})`
+        }}</span>
         <span
           class="drag"
           @mousedown="mousedownDrag"
@@ -96,8 +96,8 @@
           secondary
           @click="closeSelectDs()"
         >{{
-            $t('dataset.cancel')
-          }}
+          $t('dataset.cancel')
+        }}
         </deBtn>
         <deBtn
           :disabled="!tempDs.id"
@@ -122,21 +122,21 @@
       size="840px"
       direction="rtl"
     >
-      <union-edit :union-param="unionParam"/>
+      <union-edit :union-param="unionParam" />
       <div class="de-foot">
         <deBtn
           secondary
           @click="closeEditUnion()"
         >{{
-            $t('dataset.cancel')
-          }}
+          $t('dataset.cancel')
+        }}
         </deBtn>
         <deBtn
           type="primary"
           @click="confirmEditUnion()"
         >{{
-            $t('dataset.confirm')
-          }}
+          $t('dataset.confirm')
+        }}
         </deBtn>
       </div>
     </el-drawer>

core/frontend/src/views/dataset/add/util.js

@@ -1,12 +1,12 @@
 import pyjs from 'js-pinyin'
 
 export function zh2py(str) {
-    return pyjs.getFullChars(str).toLowerCase().charCodeAt()
+  return pyjs.getFullChars(str).toLowerCase().charCodeAt()
 }
 
 export function pySort(arr = []) {
-    arr.sort((a, b) => {
-        return zh2py(a.name[0]) - zh2py(b.name[0])
-    })
-    return arr
-}
+  arr.sort((a, b) => {
+    return zh2py(a.name[0]) - zh2py(b.name[0])
+  })
+  return arr
+}

core/frontend/src/views/dataset/data/ViewTable.vue

@@ -17,14 +17,14 @@
             v-if="table.mode === 0"
             class="de-tag primary"
           >{{
-              $t('dataset.direct_connect')
-            }}</span>
+            $t('dataset.direct_connect')
+          }}</span>
           <span
             v-if="table.mode === 1"
             class="de-tag warning"
           >{{
-              $t('dataset.sync_data')
-            }}</span>
+            $t('dataset.sync_data')
+          }}</span>
         </template>
         <span
           v-if="syncStatus === 'Underway'"
@@ -33,7 +33,7 @@
         >
           {{ $t('dataset.dataset_sync') }}
         </span>
-        <el-divider direction="vertical"/>
+        <el-divider direction="vertical" />
         <span class="create-by">{{ $t('dataset.create_by') }}</span>
         <span class="create-by">:{{ table.creatorName || 'N/A' }}</span>
         <el-popover
@@ -48,7 +48,11 @@
             :data="table"
             :tab-status="tabStatus"
           />
-          <svg-icon slot="reference" class="detail" icon-class="icon_info_outlined" />
+          <svg-icon
+            slot="reference"
+            class="detail"
+            icon-class="icon_info_outlined"
+          />
         </el-popover>
       </el-col>
       <el-col
@@ -77,11 +81,11 @@
           </deBtn>
           <el-dropdown-menu slot="dropdown">
             <el-dropdown-item command="0">
-              <svg-icon icon-class="icon_add-entry_outlined"/>
+              <svg-icon icon-class="icon_add-entry_outlined" />
               {{ $t('dataset.excel_replace') + $t('chart.chart_data') }}
             </el-dropdown-item>
             <el-dropdown-item command="1">
-              <svg-icon icon-class="icon_doc-replace_outlined"/>
+              <svg-icon icon-class="icon_doc-replace_outlined" />
               {{ $t('dataset.excel_add') + $t('chart.chart_data') }}
             </el-dropdown-item>
           </el-dropdown-menu>
@@ -218,7 +222,7 @@
         >
           <div class="tree-cont">
             <div class="content">
-              <rowAuth ref="rowAuth"/>
+              <rowAuth ref="rowAuth" />
             </div>
           </div>
         </el-form-item>
@@ -234,8 +238,8 @@
         >{{ $t('dataset.cancel') }}
         </deBtn>
         <deBtn
-          type="primary"
           v-loading="exportDatasetLoading"
+          type="primary"
           @click="exportDatasetRequest"
         >{{ $t('dataset.confirm') }}
         </deBtn>

core/frontend/src/views/dataset/group/CreatDsGroup.vue

@@ -18,7 +18,7 @@
         :label="$t('dataset.name')"
         prop="name"
       >
-        <el-input v-model="datasetForm.name"/>
+        <el-input v-model="datasetForm.name" />
       </el-form-item>
       <el-form-item
         :label="$t('deDataset.folder')"
@@ -45,7 +45,7 @@
               class="custom-tree-node-dataset"
             >
               <span v-if="data.modelInnerType === 'group'">
-                <svg-icon icon-class="scene"/>
+                <svg-icon icon-class="scene" />
               </span>
               <span
                 style="

core/frontend/src/views/dataset/group/Group.vue

@@ -111,8 +111,8 @@
               class="no-tdata-new"
               @click="() => clickAdd()"
             >{{
-                $t('deDataset.create')
-              }}</span>
+              $t('deDataset.create')
+            }}</span>
           </div>
           <el-tree
             v-else
@@ -134,7 +134,7 @@
             >
               <span style="display: flex; flex: 1; width: 0">
                 <span>
-                  <svg-icon icon-class="scene"/>
+                  <svg-icon icon-class="scene" />
                 </span>
                 <span
                   style="
@@ -242,15 +242,15 @@
                       class="de-card-dropdown"
                     >
                       <el-dropdown-item command="rename">
-                        <svg-icon icon-class="de-ds-rename"/>
+                        <svg-icon icon-class="de-ds-rename" />
                         {{ $t('dataset.rename') }}
                       </el-dropdown-item>
                       <el-dropdown-item command="move">
-                        <svg-icon icon-class="de-ds-move"/>
+                        <svg-icon icon-class="de-ds-move" />
                         {{ $t('dataset.move_to') }}
                       </el-dropdown-item>
                       <el-dropdown-item command="delete">
-                        <svg-icon icon-class="de-ds-trash"/>
+                        <svg-icon icon-class="de-ds-trash" />
                         {{ $t('dataset.delete') }}
                       </el-dropdown-item>
                     </el-dropdown-menu>
@@ -353,15 +353,15 @@
                       class="de-card-dropdown"
                     >
                       <el-dropdown-item command="editTable">
-                        <svg-icon icon-class="de-ds-rename"/>
+                        <svg-icon icon-class="de-ds-rename" />
                         {{ $t('dataset.rename') }}
                       </el-dropdown-item>
                       <el-dropdown-item command="moveDs">
-                        <svg-icon icon-class="de-ds-move"/>
+                        <svg-icon icon-class="de-ds-move" />
                         {{ $t('dataset.move_to') }}
                       </el-dropdown-item>
                       <el-dropdown-item command="deleteTable">
-                        <svg-icon icon-class="de-ds-trash"/>
+                        <svg-icon icon-class="de-ds-trash" />
                         {{ $t('dataset.delete') }}
                       </el-dropdown-item>
                     </el-dropdown-menu>
@@ -434,7 +434,7 @@
           :label="$t('dataset.name')"
           prop="name"
         >
-          <el-input v-model="tableForm.name"/>
+          <el-input v-model="tableForm.name" />
         </el-form-item>
       </el-form>
       <div
@@ -445,8 +445,8 @@
           secondary
           @click="closeTable()"
         >{{
-            $t('dataset.cancel')
-          }}
+          $t('dataset.cancel')
+        }}
         </deBtn>
         <deBtn
           type="primary"
@@ -469,8 +469,8 @@
           :title="moveDialogTitle"
           class="text-overflow"
         >{{
-            moveDialogTitle
-          }}</span>
+          moveDialogTitle
+        }}</span>
         {{ $t('dataset.m2') }}
       </template>
       <group-move-selector
@@ -483,8 +483,8 @@
           secondary
           @click="closeMoveGroup()"
         >{{
-            $t('dataset.cancel')
-          }}
+          $t('dataset.cancel')
+        }}
         </deBtn>
         <deBtn
           :disabled="groupMoveConfirmDisabled"
@@ -508,8 +508,8 @@
           :title="moveDialogTitle"
           class="text-overflow"
         >{{
-            moveDialogTitle
-          }}</span>
+          moveDialogTitle
+        }}</span>
         {{ $t('dataset.m2') }}
       </template>
       <group-move-selector
@@ -521,8 +521,8 @@
           secondary
           @click="closeMoveDs()"
         >{{
-            $t('dataset.cancel')
-          }}
+          $t('dataset.cancel')
+        }}
         </deBtn>
         <deBtn
           :disabled="dsMoveConfirmDisabled"
@@ -534,7 +534,7 @@
     </el-drawer>
 
     <!-- 新增数据集文件夹 -->
-    <CreatDsGroup ref="CreatDsGroup"/>
+    <CreatDsGroup ref="CreatDsGroup" />
   </el-col>
 </template>
 
@@ -692,7 +692,7 @@ export default {
   },
   methods: {
     init(cache = true) {
-      const { id, name } = this.$route.params
+      const { id } = this.$route.params
       const modelInfo = localStorage.getItem('dataset-tree')
       const userCache = modelInfo && cache
       if (userCache) {
@@ -890,8 +890,7 @@ export default {
             _this.expandedArray.push(table.sceneId)
             _this.$refs.datasetTreeRef.setCurrentKey(table.id)
             const renameNode = { id: table.id, name: table.name, label: table.name }
-            updateCacheTree('rename', 'dataset-tree', renameNode, this.tData)
-            ('rename', 'dataset-tree', response.data, this.tData)
+            updateCacheTree('rename', 'dataset-tree', renameNode, this.tData)('rename', 'dataset-tree', response.data, this.tData)
             this.$emit('switchComponent', { name: '' })
           })
         } else {

core/frontend/src/views/dataset/group/GroupMoveSelector.vue

@@ -24,7 +24,7 @@
         >
           <span style="display: flex; flex: 1; width: 0">
             <span v-if="data.modelInnerType === 'group'">
-              <svg-icon icon-class="scene"/>
+              <svg-icon icon-class="scene" />
             </span>
             <span
               style="

core/frontend/src/views/mobile/index.vue

@@ -4,7 +4,7 @@
     class="this_mobile_canvas_main"
     :style="mobileCanvasStyle"
   >
-    <canvas-opt-bar/>
+    <canvas-opt-bar />
     <de-canvas
       ref="canvasMainRef"
       :canvas-style-data="canvasStyleData"
@@ -20,54 +20,54 @@ import DeCanvas from '@/components/canvas/DeCanvas'
 import CanvasOptBar from '@/components/canvas/components/editor/CanvasOptBar'
 import {
   imgUrlTrans,
-  getNowCanvasComponentData,
-} from "@/components/canvas/utils/utils";
-import { mapState } from "vuex";
-import { hexColorToRGBA } from "@/views/chart/chart/util";
+  getNowCanvasComponentData
+} from '@/components/canvas/utils/utils'
+import { mapState } from 'vuex'
+import { hexColorToRGBA } from '@/views/chart/chart/util'
 export default {
   components: { DeCanvas, CanvasOptBar },
   data() {
     return {
-      canvasId: "canvas-main",
-      previewVisible: false,
-    };
+      canvasId: 'canvas-main',
+      previewVisible: false
+    }
   },
   computed: {
-    ...mapState(["canvasStyleData", "mobileLayoutStatus", 'componentData']),
+    ...mapState(['canvasStyleData', 'mobileLayoutStatus', 'componentData']),
     mainCanvasComponentData() {
-      return getNowCanvasComponentData(this.canvasId);
+      return getNowCanvasComponentData(this.canvasId)
     },
     mobileCanvasStyle() {
-      let style;
+      let style
       if (this.canvasStyleData.openCommonStyle) {
         const styleInfo =
           this.canvasStyleData.panel.mobileSetting &&
           this.canvasStyleData.panel.mobileSetting.customSetting
             ? this.canvasStyleData.panel.mobileSetting
-            : this.canvasStyleData.panel;
+            : this.canvasStyleData.panel
         if (
-          styleInfo.backgroundType === "image" &&
-          typeof styleInfo.imageUrl === "string"
+          styleInfo.backgroundType === 'image' &&
+          typeof styleInfo.imageUrl === 'string'
         ) {
           style = {
-            background: `url(${imgUrlTrans(styleInfo.imageUrl)}) no-repeat`,
-          };
-        } else if (styleInfo.backgroundType === "color") {
+            background: `url(${imgUrlTrans(styleInfo.imageUrl)}) no-repeat`
+          }
+        } else if (styleInfo.backgroundType === 'color') {
           const colorRGBA = hexColorToRGBA(
             styleInfo.color,
-            styleInfo.alpha === undefined ? 100 : styleInfo.alpha,
-          );
+            styleInfo.alpha === undefined ? 100 : styleInfo.alpha
+          )
           style = {
-            background: colorRGBA,
-          };
+            background: colorRGBA
+          }
         } else {
           style = {
-            background: "#f7f8fa",
-          };
+            background: '#f7f8fa'
+          }
         }
       }
-      return style;
-    },
+      return style
+    }
   },
   mounted() {
     this.$store.commit('setMobileLayoutStatus', true)

core/frontend/src/views/panel/appTemplate/AppTemplateContent.vue

@@ -77,7 +77,7 @@
           :label="dialogTitleLabel"
           prop="name"
         >
-          <el-input v-model="templateEditForm.name"/>
+          <el-input v-model="templateEditForm.name" />
         </el-form-item>
         <el-form-item
           :label="$t('app_template.app_group_icon')"
@@ -95,7 +95,7 @@
               :http-request="upload"
               :file-list="fileList"
             >
-              <i class="el-icon-plus"/>
+              <i class="el-icon-plus" />
             </el-upload>
             <el-dialog
               top="25vh"
@@ -161,8 +161,7 @@
         :source-template-info="currentMoveItem"
         @closeDialog="moveItemDialogShow=false"
         @templateMoveClose="templateMoveClose"
-      >
-      </template-move-list>
+      />
     </el-dialog>
   </div>
 </template>

core/frontend/src/views/panel/appTemplate/component/TemplateItem.vue

@@ -29,18 +29,18 @@
         trigger="click"
         @command="handleCommand"
       >
-        <i class="el-icon-more"/>
+        <i class="el-icon-more" />
         <el-dropdown-menu
           slot="dropdown"
           class="de-card-dropdown"
         >
           <slot>
             <el-dropdown-item command="update">
-              <i class="el-icon-edit"/>
+              <i class="el-icon-edit" />
               {{ $t('commons.update') }}
             </el-dropdown-item>
             <el-dropdown-item command="delete">
-              <i class="el-icon-delete"/>
+              <i class="el-icon-delete" />
               {{ $t('commons.uninstall') }}
             </el-dropdown-item>
             <el-dropdown-item

core/frontend/src/views/panel/appTemplate/component/TemplateList.vue

@@ -47,7 +47,7 @@
             @command="(type) => clickMore(type, ele)"
           >
             <span class="el-dropdown-link">
-              <i class="el-icon-more"/>
+              <i class="el-icon-more" />
             </span>
             <el-dropdown-menu
               slot="dropdown"

core/frontend/src/views/panel/appTemplate/component/TemplateMoveList.vue

@@ -43,16 +43,16 @@
         secondary
         @click="cancel()"
       >{{
-          $t('commons.cancel')
-        }}
+        $t('commons.cancel')
+      }}
       </deBtn>
       <deBtn
         type="primary"
-        @click="save()"
         :disabled="!activeTemplate"
+        @click="save()"
       >{{
-          $t('commons.confirm')
-        }}
+        $t('commons.confirm')
+      }}
       </deBtn>
     </el-row>
   </div>

core/frontend/src/views/panel/edit/index.vue

@@ -165,12 +165,12 @@
               v-show=" show &&showIndex===1"
               :canvas-id="canvasId"
             />
-            <subject-setting v-show=" show &&showIndex===2"/>
-            <assist-component v-show=" show &&showIndex===3"/>
+            <subject-setting v-show=" show &&showIndex===2" />
+            <assist-component v-show=" show &&showIndex===3" />
           </div>
         </el-drawer>
         <!--PC端画布区域-->
-        <canvas-opt-bar v-if="!previewVisible&&!mobileLayoutStatus"/>
+        <canvas-opt-bar v-if="!previewVisible&&!mobileLayoutStatus" />
         <de-canvas
           v-if="!previewVisible&&!mobileLayoutStatus"
           ref="canvasMainRef"
@@ -196,12 +196,21 @@
               :style="customCanvasMobileStyle"
               class="this_mobile_canvas"
             >
-              <el-row class="this_mobile_canvas_top"/>
+              <el-row class="this_mobile_canvas_top" />
               <el-row class="this_mobile_canvas_inner_top">
                 {{ panelInfo.name }}
               </el-row>
-              <el-row v-loading="mobileLoading" class="this_mobile_canvas_main_outer">
-                <iframe  src="./mobile.html" @load="handleLoad" frameborder="0" width="360" height="570"></iframe>
+              <el-row
+                v-loading="mobileLoading"
+                class="this_mobile_canvas_main_outer"
+              >
+                <iframe
+                  src="./mobile.html"
+                  frameborder="0"
+                  width="360"
+                  height="570"
+                  @load="handleLoad"
+                />
               </el-row>
               <el-row class="this_mobile_canvas_inner_bottom">
                 <el-col :span="12">
@@ -230,14 +239,14 @@
                   />
                 </el-col>
               </el-row>
-              <el-row class="this_mobile_canvas_bottom"/>
+              <el-row class="this_mobile_canvas_bottom" />
             </div>
           </el-col>
           <el-col
             :span="14"
             class="this_mobile_canvas_cell this_mobile_canvas_wait_cell"
           >
-            <component-wait/>
+            <component-wait />
           </el-col>
         </el-row>
       </de-main-container>
@@ -255,7 +264,7 @@
           />
         </div>
         <div v-if="showBatchViewToolsAside">
-          <chart-style-batch-set/>
+          <chart-style-batch-set />
         </div>
         <div v-if="!showViewToolsAside&&!showBatchViewToolsAside">
           <el-row style="height: 40px">
@@ -274,7 +283,7 @@
             >{{ $t('panel.position_adjust') }}</span>
           </el-row>
           <el-row>
-            <position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix"/>
+            <position-adjust v-if="curComponent&&!curComponent.auxiliaryMatrix" />
             <div
               v-else
               class="view-selected-message-class"
@@ -416,8 +425,8 @@
         <span style="float: right;">
           <span class="adapt-text"> 样式适配： </span>
           <el-select
-            style="width: 120px;margin-right: 16px"
             v-model="multiplexingStyleAdaptSelf"
+            style="width: 120px;margin-right: 16px"
             placeholder="Select"
             placement="top-start"
             size="mini"
@@ -540,7 +549,7 @@ import TextAttr from '@/components/canvas/components/TextAttr'
 import { userLoginInfo } from '@/api/systemInfo/userLogin'
 import { activeWatermark } from '@/components/canvas/tools/watermark'
 import PositionAdjust from '@/views/chart/view/PositionAdjust'
-import {hexColorToRGBA} from "@/views/chart/chart/util";
+import { hexColorToRGBA } from '@/views/chart/chart/util'
 export default {
   name: 'PanelEdit',
   components: {
@@ -840,12 +849,10 @@ export default {
     bus.$on('mobile-status-change', this.mobileStatusChange)
     window.addEventListener('message', (event) => {
       if (event.data.type === 'deleteComponentWithId') {
-        console.log('event1', event.data)
         this.$store.commit('deleteComponentWithId', event.data.value)
         this.deleteComponentWithId(event.data.value)
       }
       if (event.data.type === 'setComponentData') {
-        console.log('setComponentData', event.data)
         this.$store.commit('setComponentData', event.data.value)
         setTimeout(() => {
           bus.$emit('editSave')
@@ -896,10 +903,8 @@ export default {
       }
     },
     mobileStatusChange(type, value) {
-      console.log('mobileLayoutStatustype', type, this.mobileLayoutStatus)
       if (!this.mobileLayoutStatus) return
       const iframe = document.querySelector('iframe')
-      console.log('iframe', iframe)
       if (iframe) {
         iframe.contentWindow.postMessage(
           {
@@ -909,9 +914,6 @@ export default {
           '*'
         )
       }
-      // if (['setCanvasStyle', 'addComponent'].includes(type)) {
-        
-      // }
     },
     initWatermark() {
       if (this.panelInfo.watermarkInfo) {
@@ -1514,8 +1516,8 @@ export default {
       this.$store.commit('recordSnapshot')
       this.$store.commit('canvasChange')
     },
-    multiplexingStyleAdaptChange(value){
-      this.$store.commit('setMultiplexingStyleAdapt',value)
+    multiplexingStyleAdaptChange(value) {
+      this.$store.commit('setMultiplexingStyleAdapt', value)
     }
   }
 }

core/frontend/src/views/panel/linkJumpSet/index.vue

@@ -302,7 +302,7 @@
                       clearable
                     />
                     <div class="field-height">
-                      <el-divider/>
+                      <el-divider />
                       <draggable
                         v-model="linkJumpInfoArray"
                         :options="{group:{name: 'drag',pull:'clone'},sort: true}"

core/frontend/src/views/panel/list/PanelList.vue

@@ -174,7 +174,7 @@
                   />
                 </span>
                 <span v-if="data.nodeType === 'folder'">
-                  <svg-icon icon-class="scene"/>
+                  <svg-icon icon-class="scene" />
                 </span>
                 <span
                   :class="data.status"
@@ -211,7 +211,7 @@
                       <el-dropdown-item
                         :command="beforeClickEdit('folder', 'new', data, node)"
                       >
-                        <svg-icon icon-class="scene"/>
+                        <svg-icon icon-class="scene" />
                         <span style="margin-left: 5px">{{ $t('panel.groupAdd') }}</span>
                       </el-dropdown-item>
                       <el-dropdown-item
@@ -334,7 +334,7 @@
             :label="$t('commons.name')"
             prop="name"
           >
-            <el-input v-model="groupForm.name"/>
+            <el-input v-model="groupForm.name" />
           </el-form-item>
         </el-form>
         <div
@@ -345,8 +345,8 @@
             size="mini"
             @click="close()"
           >{{
-              $t('panel.cancel')
-            }}
+            $t('panel.cancel')
+          }}
           </el-button>
           <el-button
             type="primary"
@@ -422,8 +422,8 @@
             size="mini"
             @click="closeMoveGroup()"
           >{{
-              $t('dataset.cancel')
-            }}
+            $t('dataset.cancel')
+          }}
           </el-button>
           <el-button
             :disabled="groupMoveConfirmDisabled"
@@ -451,7 +451,6 @@ import {
   groupTree,
   initPanelData, panelMove,
   panelToTop,
-  panelUpdate,
   viewPanelLog
 } from '@/api/panel/panel'
 import { mapState } from 'vuex'

core/frontend/src/views/panel/list/PanelMain.vue

@@ -8,7 +8,7 @@
         @tab-click="handleClick"
       >
         <el-tab-pane name="PanelList">
-          <span slot="label"><i class="el-icon-document tablepanel-i"/>{{ $t('panel.panel_list') }}</span>
+          <span slot="label"><i class="el-icon-document tablepanel-i" />{{ $t('panel.panel_list') }}</span>
           <panel-list
             v-show="activeName==='PanelList'"
             ref="panelList"
@@ -18,14 +18,14 @@
           name="panels_star"
           :lazy="true"
         >
-          <span slot="label"><i class="el-icon-star-off tablepanel-i"/>{{ $t('panel.store') }}</span>
-          <enshrine v-if="activeName==='panels_star'"/>
+          <span slot="label"><i class="el-icon-star-off tablepanel-i" />{{ $t('panel.store') }}</span>
+          <enshrine v-if="activeName==='panels_star'" />
         </el-tab-pane>
         <el-tab-pane
           name="panels_share"
           :lazy="true"
         >
-          <span slot="label"><i class="el-icon-share tablepanel-i"/>{{ $t('panel.share') }}</span>
+          <span slot="label"><i class="el-icon-share tablepanel-i" />{{ $t('panel.share') }}</span>
           <share-tree
             v-if="showShare"
             ref="share_tree"

core/frontend/src/views/panel/list/PanelViewShow.vue

@@ -17,7 +17,7 @@
         style="border-bottom: 1px solid;border-bottom-color:#E6E6E6;"
       >
         <div style="height: 100%;">
-          <share-head/>
+          <share-head />
         </div>
       </el-row>
       <el-row
@@ -31,10 +31,13 @@
             :span="12"
             style="font-size: 14px;display: flex"
           >
-            <div :title="showName" style="text-overflow:ellipsis;overflow: hidden;white-space: nowrap;font-size: 14px;max-width: 300px"><span
-              class="panel-name"
-            >
-              {{ panelInfo.name || '测试仪表板' }}</span>
+            <div
+              :title="showName"
+              style="text-overflow:ellipsis;overflow: hidden;white-space: nowrap;font-size: 14px;max-width: 300px"
+            ><span
+               class="panel-name"
+             >
+               {{ panelInfo.name || '测试仪表板' }}</span>
               <span
                 v-if="panelInfo.isDefault"
                 style="color: green;font-size: 12px"
@@ -49,41 +52,47 @@
                 v-if="!hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
                 style="margin-left: 9px"
               >
-              <el-tooltip :content="$t('panel.store')">
-                <i
-                  class="el-icon-star-off"
-                  @click="star"
-                />
-              </el-tooltip>
-            </span>
+                <el-tooltip :content="$t('panel.store')">
+                  <i
+                    class="el-icon-star-off"
+                    @click="star"
+                  />
+                </el-tooltip>
+              </span>
               <span
                 v-if="hasStar && panelInfo && showType !== 1&&panelInfo.status==='publish'"
                 style="margin-left: 9px"
               >
-              <el-tooltip :content="$t('commons.cancel') + $t('panel.store')">
-                <i
-                  class="el-icon-star-on"
-                  @click="unstar"
-                />
-              </el-tooltip>
-            </span>
+                <el-tooltip :content="$t('commons.cancel') + $t('panel.store')">
+                  <i
+                    class="el-icon-star-on"
+                    @click="unstar"
+                  />
+                </el-tooltip>
+              </span>
               <template v-if="panelInfo.creatorName">
                 <el-divider
                   style="margin: 0 16px;"
                   direction="vertical"
                 />
-                <span :title="panelInfo.creatorName" class="panel-create">
-                {{ $t('panel.create_by') + ':' + panelInfo.creatorName }}
-              </span>
+                <span
+                  :title="panelInfo.creatorName"
+                  class="panel-create"
+                >
+                  {{ $t('panel.create_by') + ':' + panelInfo.creatorName }}
+                </span>
               </template>
               <el-popover
                 placement="right-start"
                 width="400"
                 trigger="click"
               >
-                <panel-detail-info/>
-                <svg-icon slot="reference" style="margin-left: 4px;cursor: pointer;font-size: 14px;" class="icon-class"
-                          icon-class="icon_info_outlined"
+                <panel-detail-info />
+                <svg-icon
+                  slot="reference"
+                  style="margin-left: 4px;cursor: pointer;font-size: 14px;"
+                  class="icon-class"
+                  icon-class="icon_info_outlined"
                 />
               </el-popover>
             </div>
@@ -436,14 +445,14 @@ export default {
     }
   },
   computed: {
-    showName(){
+    showName() {
       let name = this.panelInfo.name || '测试仪表板'
-      if(this.panelInfo.isDefault){
-        name = name +'('+ this.$t('panel.default_panel_name') +':'+ this.panelInfo.defaultPanelName +')'
+      if (this.panelInfo.isDefault) {
+        name = name + '(' + this.$t('panel.default_panel_name') + ':' + this.panelInfo.defaultPanelName + ')'
       }
 
-      if(this.panelInfo.sourcePanelName){
-        name = name +'('+ this.$t('panel.source_panel_name') +':'+ this.panelInfo.sourcePanelName +')'
+      if (this.panelInfo.sourcePanelName) {
+        name = name + '(' + this.$t('panel.source_panel_name') + ':' + this.panelInfo.sourcePanelName + ')'
       }
       return name
     },

core/frontend/src/views/panel/subjectSetting/panelStyle/BackgroundSelector.vue

@@ -231,6 +231,12 @@ export default {
 .form-item ::v-deep .el-form-item__label {
   font-size: 12px;
 }
+.form-item ::v-deep .el-checkbox__label {
+  font-size: 12px;
+}
+.form-item ::v-deep .el-radio__label {
+  font-size: 12px;
+}
 
 .el-select-dropdown__item {
   padding: 0 20px;
@@ -277,7 +283,6 @@ span {
   line-height: 22px;
 }
 
-
 ::v-deep .el-slider__input {
   width: 40px;
   padding-left: 0px;