From 22d496a528d9bf4f4917a3908ed804bb345bd5c5 Mon Sep 17 00:00:00 2001
From: dataeaseShu <tong.shu@fit2cloud.com>
Date: Mon, 6 Nov 2023 15:31:35 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20eslint=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 core/frontend/src/App.vue                     |  22 +-
 core/frontend/src/api/chart/chart.js          |   3 -
 core/frontend/src/api/dataset/dataset.js      |   2 +-
 core/frontend/src/api/link/index.js           |   4 +-
 core/frontend/src/api/panel/panel.js          |   2 +-
 .../components/canvas/components/TextAttr.vue |  18 +-
 .../components/editor/ComponentWrapper.vue    |  18 +-
 .../canvas/components/editor/DeEditor.vue     |  82 +++--
 .../canvas/components/editor/FieldsList.vue   |   5 +-
 .../canvas/components/editor/LinkageField.vue |   7 +-
 .../components/editor/TabCarouselDialog.vue   |   4 +-
 .../canvas/components/editor/ViewTrackBar.vue |   3 +-
 .../canvas/customComponent/DeFrame.vue        |   2 +-
 .../canvas/customComponent/DeRichTextView.vue |   7 +-
 .../canvas/customComponent/DeStreamMedia.vue  |   2 +-
 .../canvas/customComponent/DeVideo.vue        |   2 +-
 .../canvas/customComponent/UserViewDialog.vue |   2 +-
 .../src/components/canvas/store/copy.js       |  14 +-
 .../components/canvas/utils/shortcutKey.js    |  21 +-
 .../components/dataease/DeAsideContainer.vue  |   2 +-
 core/frontend/src/components/deDrag/index.vue |  12 +-
 .../src/components/elVisualSelect/index.vue   |   2 +-
 core/frontend/src/components/msgCfm/index.js  |  23 +-
 .../components/widget/deWidget/DeButton.vue   |   5 +-
 .../src/components/widget/deWidget/DeDate.vue |  49 ++-
 .../widget/deWidget/DeResetButton.vue         |   5 +-
 .../components/widget/deWidget/DeSelect.vue   |   2 +-
 .../src/components/widget/deWidget/DeTabs.vue |  22 +-
 core/frontend/src/layout/index.vue            |   2 +-
 core/frontend/src/mobile/main.js              |   1 -
 core/frontend/src/permission.js               |   2 +-
 core/frontend/src/router/mobile.js            |   2 +-
 core/frontend/src/store/index.js              |  36 +--
 core/frontend/src/store/modules/user.js       |   9 +-
 .../views/background/BackgroundOverall.vue    |   1 +
 core/frontend/src/views/background/index.vue  |   4 +-
 core/frontend/src/views/chart/chart/chart.js  |   4 +-
 .../src/views/chart/chart/table/table-info.js |  26 +-
 .../chart/components/ChartComponentS2.vue     |   4 +-
 .../chart/components/compare/CompareEdit.vue  |   1 -
 .../componentStyle/TitleSelector.vue          |  14 +-
 .../componentStyle/dialog/RemarkEditor.vue    |   2 +-
 .../chart/components/senior/Threshold.vue     |  53 ++--
 .../senior/dialog/TableThresholdEdit.vue      | 293 +++++++++---------
 .../src/views/chart/view/TitleRemark.vue      |   6 +-
 core/frontend/src/views/dataset/Form.vue      |   5 +-
 .../frontend/src/views/dataset/add/AddApi.vue |   6 +-
 .../src/views/dataset/add/AddCustom.vue       |   2 +-
 core/frontend/src/views/dataset/add/AddDB.vue |   6 +-
 .../src/views/dataset/add/AddExcel.vue        |  31 +-
 .../frontend/src/views/dataset/add/AddSQL.vue | 187 +++++------
 .../src/views/dataset/add/AddUnion.vue        |  18 +-
 core/frontend/src/views/dataset/add/util.js   |  12 +-
 .../src/views/dataset/data/ViewTable.vue      |  24 +-
 .../src/views/dataset/group/CreatDsGroup.vue  |   4 +-
 .../src/views/dataset/group/Group.vue         |  47 ++-
 .../views/dataset/group/GroupMoveSelector.vue |   2 +-
 core/frontend/src/views/mobile/index.vue      |  50 +--
 .../panel/appTemplate/AppTemplateContent.vue  |   7 +-
 .../appTemplate/component/TemplateItem.vue    |   6 +-
 .../appTemplate/component/TemplateList.vue    |   2 +-
 .../component/TemplateMoveList.vue            |  10 +-
 core/frontend/src/views/panel/edit/index.vue  |  44 +--
 .../src/views/panel/linkJumpSet/index.vue     |   2 +-
 .../src/views/panel/list/PanelList.vue        |  15 +-
 .../src/views/panel/list/PanelMain.vue        |   8 +-
 .../src/views/panel/list/PanelViewShow.vue    |  69 +++--
 .../src/views/panel/outerParamsSet/index.vue  |   6 +-
 .../panelStyle/BackgroundSelector.vue         |   1 -
 .../panelStyle/MobileBackgroundSelector.vue   |  15 +-
 .../panel/template/component/TemplateList.vue |   2 +-
 .../system/datasource/ApiHttpRequestForm.vue  |  33 +-
 .../src/views/system/datasource/DsAppForm.vue |   4 +-
 .../system/datasource/DsConfiguration.vue     |  35 ++-
 .../src/views/system/datasource/DsForm.vue    |   4 +-
 .../views/system/datasource/DsFormContent.vue |  70 ++---
 .../src/views/system/datasource/DsTable.vue   |  10 +-
 .../src/views/system/datasource/DsTree.vue    |   9 +-
 .../views/system/datasource/MsgContent.vue    |  13 +-
 .../system/relationship/consanguinity.vue     |  92 +++---
 .../views/system/sysParam/BasicSetting.vue    |   5 +-
 .../views/system/sysParam/EmailSetting.vue    |  15 +-
 .../views/system/user/PasswordUpdateForm.vue  |  23 +-
 .../src/views/system/user/PersonPwd.vue       |   2 +-
 core/frontend/src/views/wizard/index.vue      |  28 +-
 85 files changed, 904 insertions(+), 822 deletions(-)

diff --git a/core/frontend/src/App.vue b/core/frontend/src/App.vue
index 1ec6edbbca..380888af6b 100644
--- a/core/frontend/src/App.vue
+++ b/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>
diff --git a/core/frontend/src/api/chart/chart.js b/core/frontend/src/api/chart/chart.js
index be854d84bd..f812769b75 100644
--- a/core/frontend/src/api/chart/chart.js
+++ b/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}`,
diff --git a/core/frontend/src/api/dataset/dataset.js b/core/frontend/src/api/dataset/dataset.js
index 95ba9f0192..11a2d5de32 100644
--- a/core/frontend/src/api/dataset/dataset.js
+++ b/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({
diff --git a/core/frontend/src/api/link/index.js b/core/frontend/src/api/link/index.js
index 52d1481148..47c25f3672 100644
--- a/core/frontend/src/api/link/index.js
+++ b/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'
   })
 }
diff --git a/core/frontend/src/api/panel/panel.js b/core/frontend/src/api/panel/panel.js
index c0eddc88dd..86b9057988 100644
--- a/core/frontend/src/api/panel/panel.js
+++ b/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)
diff --git a/core/frontend/src/components/canvas/components/TextAttr.vue b/core/frontend/src/components/canvas/components/TextAttr.vue
index d0fca3718b..10580991ca 100644
--- a/core/frontend/src/components/canvas/components/TextAttr.vue
+++ b/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>
 
diff --git a/core/frontend/src/components/canvas/components/editor/ComponentWrapper.vue b/core/frontend/src/components/canvas/components/editor/ComponentWrapper.vue
index ebcfcf0084..828ee49abe 100644
--- a/core/frontend/src/components/canvas/components/editor/ComponentWrapper.vue
+++ b/core/frontend/src/components/canvas/components/editor/ComponentWrapper.vue
@@ -77,19 +77,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: {
@@ -136,7 +136,7 @@ export default {
     canvasStyleData: {
       type: Object,
       required: false,
-      default: function () {
+      default: function() {
         return {}
       }
     },
@@ -164,7 +164,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
@@ -325,7 +325,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) {
diff --git a/core/frontend/src/components/canvas/components/editor/DeEditor.vue b/core/frontend/src/components/canvas/components/editor/DeEditor.vue
index 1dfb9b573a..c3b68afeff 100644
--- a/core/frontend/src/components/canvas/components/editor/DeEditor.vue
+++ b/core/frontend/src/components/canvas/components/editor/DeEditor.vue
@@ -126,7 +126,7 @@
       :canvas-id="canvasId"
     />
     <!-- 右击菜单 -->
-    <ContextMenu/>
+    <ContextMenu />
 
     <!-- 对齐标线 -->
     <span
@@ -150,13 +150,13 @@
 </template>
 
 <script>
-import {mapState} from 'vuex'
+import { mapState } from 'vuex'
 import Shape from './Shape'
 import DeDrag from '@/components/deDrag'
 
 // eslint-disable-next-line no-unused-vars
-import {getComponentRotatedStyle, getStyle} from '@/components/canvas/utils/style'
-import {_$, imgUrlTrans} from '@/components/canvas/utils/utils'
+import { getComponentRotatedStyle, getStyle } from '@/components/canvas/utils/style'
+import { _$, imgUrlTrans } from '@/components/canvas/utils/utils'
 import ContextMenu from './ContextMenu'
 import MarkLine from './MarkLine'
 import Area from './Area'
@@ -164,19 +164,19 @@ import eventBus from '@/components/canvas/utils/eventBus'
 import Grid from './Grid'
 import PageLineEditor from './PageLineEditor'
 import PGrid from './PGrid'
-import {changeStyleWithScale} from '@/components/canvas/utils/translate'
+import { changeStyleWithScale } from '@/components/canvas/utils/translate'
 import UserViewDialog from '@/components/canvas/customComponent/UserViewDialog'
 import DeOutWidget from '@/components/dataease/DeOutWidget'
 import DragShadow from '@/components/deDrag/Shadow'
 import bus from '@/utils/bus'
 import LinkJumpSet from '@/views/panel/linkJumpSet'
-import {buildFilterMap, buildViewKeyMap, formatCondition, valueValid, viewIdMatch} from '@/utils/conditionUtil'
+import { buildFilterMap, buildViewKeyMap, formatCondition, valueValid, viewIdMatch } from '@/utils/conditionUtil'
 // 挤占式画布
 import _ from 'lodash'
 import _jq from 'jquery'
 import Background from '@/views/background/index'
 import PointShadow from '@/components/deDrag/PointShadow'
-import {hexColorToRGBA} from "@/views/chart/chart/util";
+import { hexColorToRGBA } from '@/views/chart/chart/util'
 
 // let positionBox = []
 // let coordinates = [] // 坐标点集合
@@ -190,11 +190,11 @@ let itemMaxX = 0
 
 function debounce(func, time) {
   if (!isOverlay) {
-    (function (t) {
+    (function(t) {
       isOverlay = true
-      setTimeout(function () {
+      setTimeout(function() {
         t()
-        setTimeout(function () {
+        setTimeout(function() {
           isOverlay = false
           if (lastTask !== undefined) {
             debounce(lastTask, time)
@@ -319,10 +319,10 @@ function init() {
   resetPositionBox.call(this)
   initPosition(this)
   let i = 0
-  const timeid = setInterval(function () {
+  const timeid = setInterval(function() {
     if (i >= vm.yourList.length) {
       clearInterval(timeid)
-      vm.$nextTick(function () {
+      vm.$nextTick(function() {
         vm.moveAnimate = true
       })
     } else {
@@ -339,7 +339,7 @@ function resizePlayer(item, newSize) {
   removeItemFromPositionBox.call(vm, item)
 
   const belowItems = findBelowItems.call(this, item)
-  _.forEach(belowItems, function (upItem) {
+  _.forEach(belowItems, function(upItem) {
     const canGoUpRows = canItemGoUp.call(vm, upItem)
     if (canGoUpRows > 0) {
       moveItemUp.call(vm, upItem, canGoUpRows)
@@ -426,7 +426,7 @@ function movePlayer(item, position) {
   removeItemFromPositionBox.call(vm, item)
 
   const belowItems = findBelowItems.call(this, item)
-  _.forEach(belowItems, function (upItem) {
+  _.forEach(belowItems, function(upItem) {
     const canGoUpRows = canItemGoUp.call(vm, upItem)
     if (canGoUpRows > 0) {
       moveItemUp.call(vm, upItem, canGoUpRows)
@@ -452,7 +452,7 @@ function removeItem(index) {
     removeItemFromPositionBox.call(vm, item)
 
     const belowItems = findBelowItems.call(this, item)
-    _.forEach(belowItems, function (upItem) {
+    _.forEach(belowItems, function(upItem) {
       const canGoUpRows = canItemGoUp.call(vm, upItem)
       if (canGoUpRows > 0) {
         moveItemUp.call(vm, upItem, canGoUpRows)
@@ -544,7 +544,7 @@ function findClosetCoords(item, tCoord) {
     y: collisionsItem[0].coord.el.y
   })
 
-  setTimeout(function () {
+  setTimeout(function() {
     isOverlay = false
   }, 200)
 }
@@ -592,7 +592,7 @@ function changeItemCoord(item) {
     el: item
   }
 
-  const index = _.findIndex(vm.coordinates, function (o) {
+  const index = _.findIndex(vm.coordinates, function(o) {
     return o.el._dragId === item._dragId
   })
   if (index !== -1) {
@@ -609,7 +609,7 @@ function emptyTargetCell(item) {
   const vm = this
   const belowItems = findBelowItems.call(vm, item)
 
-  _.forEach(belowItems, function (downItem, index) {
+  _.forEach(belowItems, function(downItem, index) {
     if (downItem._dragId === item._dragId) return
     const moveSize = item.y + item.sizey - downItem.y
     if (moveSize > 0) {
@@ -649,7 +649,7 @@ function moveItemDown(item, size) {
   const vm = this
   removeItemFromPositionBox.call(vm, item)
   const belowItems = findBelowItems.call(vm, item)
-  _.forEach(belowItems, function (downItem, index) {
+  _.forEach(belowItems, function(downItem, index) {
     if (downItem._dragId === item._dragId) return
     const moveSize = calcDiff.call(vm, item, downItem, size)
     if (moveSize > 0) {
@@ -722,7 +722,7 @@ function moveItemUp(item, size) {
 
   changeItemCoord.call(this, item)
 
-  _.forEach(belowItems, function (upItem, index) {
+  _.forEach(belowItems, function(upItem, index) {
     const moveSize = canItemGoUp.call(vm, upItem)
     if (moveSize > 0) {
       moveItemUp.call(vm, upItem, moveSize)
@@ -806,19 +806,19 @@ export default {
     dragStart: {
       required: false,
       type: Function,
-      default: function () {
+      default: function() {
       }
     },
     dragging: {
       required: false,
       type: Function,
-      default: function () {
+      default: function() {
       }
     },
     dragEnd: {
       required: false,
       type: Function,
-      default: function () {
+      default: function() {
       }
     },
     resizable: {
@@ -829,19 +829,19 @@ export default {
     resizeStart: {
       required: false,
       type: Function,
-      default: function () {
+      default: function() {
       }
     },
     resizing: {
       required: false,
       type: Function,
-      default: function () {
+      default: function() {
       }
     },
     resizeEnd: {
       required: false,
       type: Function,
-      default: function () {
+      default: function() {
       }
     },
     matrixCount: {
@@ -1147,7 +1147,7 @@ export default {
       return this.$refs['wrapperChild']
     },
     getAllWrapperChildRefs() {
-      let allChildRefs = []
+      const allChildRefs = []
       const currentChildRefs = this.getWrapperChildRefs()
       if (currentChildRefs && currentChildRefs.length > 0) {
         allChildRefs.push.apply(allChildRefs, currentChildRefs)
@@ -1290,7 +1290,7 @@ export default {
       }
       return -1
     },
-    pluginEditHandler({e, id}) {
+    pluginEditHandler({ e, id }) {
       let index = -1
       for (let i = 0; i < this.componentData.length; i++) {
         const item = this.componentData[i]
@@ -1400,12 +1400,12 @@ export default {
     getSelectArea() {
       const result = []
       // 区域起点坐标
-      const {x, y} = this.start
+      const { x, y } = this.start
       // 计算所有的组件数据，判断是否在选中区域内
       this.componentData.forEach(component => {
         if (component.isLock) return
 
-        const {left, top, width, height} = component.style
+        const { left, top, width, height } = component.style
         if (x <= left && y <= top && (left + width <= x + this.width) && (top + height <= y + this.height)) {
           result.push(component)
         }
@@ -1461,7 +1461,7 @@ export default {
 
     getTextareaHeight(element, text) {
       // eslint-disable-next-line prefer-const
-      let {lineHeight, fontSize, height} = element.style
+      let { lineHeight, fontSize, height } = element.style
       if (lineHeight === '') {
         lineHeight = 1.5
       }
@@ -1552,7 +1552,7 @@ export default {
       }
     },
     getRefLineParams(params) {
-      const {vLine, hLine} = params
+      const { vLine, hLine } = params
       this.vLine = vLine
       this.hLine = hLine
     },
@@ -1689,10 +1689,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
@@ -1705,8 +1701,8 @@ export default {
       newX = newX > 0 ? newX : 1
       newY = newY > 0 ? newY : 1
       if (item.sizex !== nowX || item.sizey !== nowY) {
-        debounce((function (newX, oldX, newY, oldY) {
-          return function () {
+        debounce((function(newX, oldX, newY, oldY) {
+          return function() {
             if (newX !== oldX || oldY !== newY) {
               movePlayer.call(vm, resizeItem, {
                 x: newX,
@@ -1742,8 +1738,8 @@ export default {
         return
       }
       if (newX !== oldX || oldY !== newY) {
-        debounce((function (newX, oldX, newY, oldY) {
-          return function () {
+        debounce((function(newX, oldX, newY, oldY) {
+          return function() {
             if (newX !== oldX || oldY !== newY) {
               movePlayer.call(vm, moveItem, {
                 x: newX,
@@ -1781,7 +1777,7 @@ export default {
       // 不使用copy 保持原有对象
       const finalList = []
       const _this = this
-      _.forEach(this.componentData, function (item, index) {
+      _.forEach(this.componentData, function(item, index) {
         if (_.isEmpty(item)) return
         if (_this.canvasId === item.canvasId) {
           delete item['_dragId']
@@ -1823,7 +1819,7 @@ export default {
     addItemBox(item) {
       this.yourList.push(item)
 
-      this.$nextTick(function () {
+      this.$nextTick(function() {
         addItem.call(this, item, this.yourList.length - 1)
       })
     },
@@ -1854,7 +1850,7 @@ export default {
     // 调整父级组件边界
     resizeParentBoundsRef() {
       const _this = this
-      _this.componentData.forEach(function (data, index) {
+      _this.componentData.forEach(function(data, index) {
         _this.$refs.deDragRef && _this.$refs.deDragRef[index] && _this.$refs.deDragRef[index].checkParentSize()
       })
     },
diff --git a/core/frontend/src/components/canvas/components/editor/FieldsList.vue b/core/frontend/src/components/canvas/components/editor/FieldsList.vue
index 9135f9aa45..9fcaa7108e 100644
--- a/core/frontend/src/components/canvas/components/editor/FieldsList.vue
+++ b/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"
diff --git a/core/frontend/src/components/canvas/components/editor/LinkageField.vue b/core/frontend/src/components/canvas/components/editor/LinkageField.vue
index fde3888639..37aa50eb8d 100644
--- a/core/frontend/src/components/canvas/components/editor/LinkageField.vue
+++ b/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)
           }
         })
diff --git a/core/frontend/src/components/canvas/components/editor/TabCarouselDialog.vue b/core/frontend/src/components/canvas/components/editor/TabCarouselDialog.vue
index 4cc284efe9..3b8aaac094 100644
--- a/core/frontend/src/components/canvas/components/editor/TabCarouselDialog.vue
+++ b/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()
     },
diff --git a/core/frontend/src/components/canvas/components/editor/ViewTrackBar.vue b/core/frontend/src/components/canvas/components/editor/ViewTrackBar.vue
index aa0d88a93a..e2a87a145f 100644
--- a/core/frontend/src/components/canvas/components/editor/ViewTrackBar.vue
+++ b/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"
diff --git a/core/frontend/src/components/canvas/customComponent/DeFrame.vue b/core/frontend/src/components/canvas/customComponent/DeFrame.vue
index 6a29cd9c0e..f63165a426 100644
--- a/core/frontend/src/components/canvas/customComponent/DeFrame.vue
+++ b/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>
diff --git a/core/frontend/src/components/canvas/customComponent/DeRichTextView.vue b/core/frontend/src/components/canvas/customComponent/DeRichTextView.vue
index a2c87f8c1b..c73fcf32c6 100644
--- a/core/frontend/src/components/canvas/customComponent/DeRichTextView.vue
+++ b/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>
 
-
diff --git a/core/frontend/src/components/canvas/customComponent/DeStreamMedia.vue b/core/frontend/src/components/canvas/customComponent/DeStreamMedia.vue
index 0ca7865460..3226caab68 100644
--- a/core/frontend/src/components/canvas/customComponent/DeStreamMedia.vue
+++ b/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>
diff --git a/core/frontend/src/components/canvas/customComponent/DeVideo.vue b/core/frontend/src/components/canvas/customComponent/DeVideo.vue
index c741c3c423..68d7b64f6e 100644
--- a/core/frontend/src/components/canvas/customComponent/DeVideo.vue
+++ b/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>
diff --git a/core/frontend/src/components/canvas/customComponent/UserViewDialog.vue b/core/frontend/src/components/canvas/customComponent/UserViewDialog.vue
index 4f23338f6c..d57c19d86c 100644
--- a/core/frontend/src/components/canvas/customComponent/UserViewDialog.vue
+++ b/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
       }
diff --git a/core/frontend/src/components/canvas/store/copy.js b/core/frontend/src/components/canvas/store/copy.js
index a15753e496..6232614813 100644
--- a/core/frontend/src/components/canvas/store/copy.js
+++ b/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 })
       }
diff --git a/core/frontend/src/components/canvas/utils/shortcutKey.js b/core/frontend/src/components/canvas/utils/shortcutKey.js
index 3434a446df..445b9591bc 100644
--- a/core/frontend/src/components/canvas/utils/shortcutKey.js
+++ b/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)) {
diff --git a/core/frontend/src/components/dataease/DeAsideContainer.vue b/core/frontend/src/components/dataease/DeAsideContainer.vue
index 4a76dff7df..42c6d6a37b 100644
--- a/core/frontend/src/components/dataease/DeAsideContainer.vue
+++ b/core/frontend/src/components/dataease/DeAsideContainer.vue
@@ -47,7 +47,7 @@ export default {
   data() {
     return {
       asideHidden: false,
-      currentWidth: '',
+      currentWidth: ''
     }
   },
   computed: {
diff --git a/core/frontend/src/components/deDrag/index.vue b/core/frontend/src/components/deDrag/index.vue
index 9b5a2d2d5d..546f5ca1f3 100644
--- a/core/frontend/src/components/deDrag/index.vue
+++ b/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>
diff --git a/core/frontend/src/components/elVisualSelect/index.vue b/core/frontend/src/components/elVisualSelect/index.vue
index a4b83b659d..d30a355ab0 100644
--- a/core/frontend/src/components/elVisualSelect/index.vue
+++ b/core/frontend/src/components/elVisualSelect/index.vue
@@ -23,7 +23,7 @@
         :indeterminate="isIndeterminate"
         @change="selectAllChange"
       >
-      <span :style="{ color: `${isConfig ? '#1F2329' : customStyle.wordColor} !important`}">{{ $t('dataset.check_all') }}</span>
+        <span :style="{ color: `${isConfig ? '#1F2329' : customStyle.wordColor} !important`}">{{ $t('dataset.check_all') }}</span>
       </el-checkbox>
     </p>
     <el-option
diff --git a/core/frontend/src/components/msgCfm/index.js b/core/frontend/src/components/msgCfm/index.js
index 36da4db467..4273166133 100644
--- a/core/frontend/src/components/msgCfm/index.js
+++ b/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()
+        })
     }
   }
 }
diff --git a/core/frontend/src/components/widget/deWidget/DeButton.vue b/core/frontend/src/components/widget/deWidget/DeButton.vue
index 73b86b83b9..f0e3af97be 100644
--- a/core/frontend/src/components/widget/deWidget/DeButton.vue
+++ b/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
   },
diff --git a/core/frontend/src/components/widget/deWidget/DeDate.vue b/core/frontend/src/components/widget/deWidget/DeDate.vue
index 3e67627917..86082f1363 100644
--- a/core/frontend/src/components/widget/deWidget/DeDate.vue
+++ b/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
diff --git a/core/frontend/src/components/widget/deWidget/DeResetButton.vue b/core/frontend/src/components/widget/deWidget/DeResetButton.vue
index 5c5babb3d7..a403ccc32e 100644
--- a/core/frontend/src/components/widget/deWidget/DeResetButton.vue
+++ b/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
   },
diff --git a/core/frontend/src/components/widget/deWidget/DeSelect.vue b/core/frontend/src/components/widget/deWidget/DeSelect.vue
index 1aa8f2ba68..848aa4b2d3 100644
--- a/core/frontend/src/components/widget/deWidget/DeSelect.vue
+++ b/core/frontend/src/components/widget/deWidget/DeSelect.vue
@@ -17,8 +17,8 @@
     popper-class="coustom-de-select"
     :list="data"
     :is-config="isConfig"
-    @resetKeyWords="filterMethod"
     :custom-style="customStyle"
+    @resetKeyWords="filterMethod"
     @change="changeValue"
     @focus="setOptionWidth"
     @blur="onBlur"
diff --git a/core/frontend/src/components/widget/deWidget/DeTabs.vue b/core/frontend/src/components/widget/deWidget/DeTabs.vue
index fd423cf34f..0f944a69af 100644
--- a/core/frontend/src/components/widget/deWidget/DeTabs.vue
+++ b/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)
       }
     },
diff --git a/core/frontend/src/layout/index.vue b/core/frontend/src/layout/index.vue
index 713665e8e9..5844c2831e 100644
--- a/core/frontend/src/layout/index.vue
+++ b/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')
     },
diff --git a/core/frontend/src/mobile/main.js b/core/frontend/src/mobile/main.js
index e8409c1118..8801d4afd3 100644
--- a/core/frontend/src/mobile/main.js
+++ b/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'
diff --git a/core/frontend/src/permission.js b/core/frontend/src/permission.js
index f16fefd7a3..f8a47ac745 100644
--- a/core/frontend/src/permission.js
+++ b/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']
diff --git a/core/frontend/src/router/mobile.js b/core/frontend/src/router/mobile.js
index 5629b964ea..f45ef23450 100644
--- a/core/frontend/src/router/mobile.js
+++ b/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')
   }
 ]
 
diff --git a/core/frontend/src/store/index.js b/core/frontend/src/store/index.js
index ac8405bae7..141596fa3f 100644
--- a/core/frontend/src/store/index.js
+++ b/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
diff --git a/core/frontend/src/store/modules/user.js b/core/frontend/src/store/modules/user.js
index efc51fd300..4156ec3ea9 100644
--- a/core/frontend/src/store/modules/user.js
+++ b/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)
           })
diff --git a/core/frontend/src/views/background/BackgroundOverall.vue b/core/frontend/src/views/background/BackgroundOverall.vue
index a6bd5e5f85..47563b7527 100644
--- a/core/frontend/src/views/background/BackgroundOverall.vue
+++ b/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',
diff --git a/core/frontend/src/views/background/index.vue b/core/frontend/src/views/background/index.vue
index 2e5a05762d..caca7576ab 100644
--- a/core/frontend/src/views/background/index.vue
+++ b/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',
diff --git a/core/frontend/src/views/chart/chart/chart.js b/core/frontend/src/views/chart/chart/chart.js
index 35005b24cf..255ca90a4d 100644
--- a/core/frontend/src/views/chart/chart/chart.js
+++ b/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,
diff --git a/core/frontend/src/views/chart/chart/table/table-info.js b/core/frontend/src/views/chart/chart/table/table-info.js
index b7a850d602..8f7179089f 100644
--- a/core/frontend/src/views/chart/chart/table/table-info.js
+++ b/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
 }
diff --git a/core/frontend/src/views/chart/components/ChartComponentS2.vue b/core/frontend/src/views/chart/components/ChartComponentS2.vue
index df048d2bc8..66120b643e 100644
--- a/core/frontend/src/views/chart/components/ChartComponentS2.vue
+++ b/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
diff --git a/core/frontend/src/views/chart/components/compare/CompareEdit.vue b/core/frontend/src/views/chart/components/compare/CompareEdit.vue
index c0e60093c4..7277d79a68 100644
--- a/core/frontend/src/views/chart/components/compare/CompareEdit.vue
+++ b/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',
diff --git a/core/frontend/src/views/chart/components/componentStyle/TitleSelector.vue b/core/frontend/src/views/chart/components/componentStyle/TitleSelector.vue
index 0d52ad248e..212cd10fcb 100644
--- a/core/frontend/src/views/chart/components/componentStyle/TitleSelector.vue
+++ b/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>
diff --git a/core/frontend/src/views/chart/components/componentStyle/dialog/RemarkEditor.vue b/core/frontend/src/views/chart/components/componentStyle/dialog/RemarkEditor.vue
index 94897e9c9d..f55ce3c755 100644
--- a/core/frontend/src/views/chart/components/componentStyle/dialog/RemarkEditor.vue
+++ b/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',
diff --git a/core/frontend/src/views/chart/components/senior/Threshold.vue b/core/frontend/src/views/chart/components/senior/Threshold.vue
index 1196bc3053..10d31c03c5 100644
--- a/core/frontend/src/views/chart/components/senior/Threshold.vue
+++ b/core/frontend/src/views/chart/components/senior/Threshold.vue
@@ -306,21 +306,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 +340,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 +678,7 @@ export default {
     },
     fieldValid(field) {
       // 检查字段和聚合方式是否不为空
-      return field && field.fieldId && field.summary;
+      return field && field.fieldId && field.summary
     },
     changeTableThreshold() {
       // check line config
diff --git a/core/frontend/src/views/chart/components/senior/dialog/TableThresholdEdit.vue b/core/frontend/src/views/chart/components/senior/dialog/TableThresholdEdit.vue
index 1201cd8c45..88deb13f7b 100644
--- a/core/frontend/src/views/chart/components/senior/dialog/TableThresholdEdit.vue
+++ b/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)))
diff --git a/core/frontend/src/views/chart/view/TitleRemark.vue b/core/frontend/src/views/chart/view/TitleRemark.vue
index b17f7728e8..b9ac3358ff 100644
--- a/core/frontend/src/views/chart/view/TitleRemark.vue
+++ b/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"
diff --git a/core/frontend/src/views/dataset/Form.vue b/core/frontend/src/views/dataset/Form.vue
index 325e965cb3..be43c40416 100644
--- a/core/frontend/src/views/dataset/Form.vue
+++ b/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"
diff --git a/core/frontend/src/views/dataset/add/AddApi.vue b/core/frontend/src/views/dataset/add/AddApi.vue
index 6a0b73606b..7f903da83e 100644
--- a/core/frontend/src/views/dataset/add/AddApi.vue
+++ b/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"
diff --git a/core/frontend/src/views/dataset/add/AddCustom.vue b/core/frontend/src/views/dataset/add/AddCustom.vue
index 81c9ec38db..2532b49e04 100644
--- a/core/frontend/src/views/dataset/add/AddCustom.vue
+++ b/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
diff --git a/core/frontend/src/views/dataset/add/AddDB.vue b/core/frontend/src/views/dataset/add/AddDB.vue
index ae6e540b6e..40533c8c20 100644
--- a/core/frontend/src/views/dataset/add/AddDB.vue
+++ b/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"
diff --git a/core/frontend/src/views/dataset/add/AddExcel.vue b/core/frontend/src/views/dataset/add/AddExcel.vue
index a16422a4e0..ba068a6ef8 100644
--- a/core/frontend/src/views/dataset/add/AddExcel.vue
+++ b/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
diff --git a/core/frontend/src/views/dataset/add/AddSQL.vue b/core/frontend/src/views/dataset/add/AddSQL.vue
index 2ef54cc9a2..1811ee3c80 100644
--- a/core/frontend/src/views/dataset/add/AddSQL.vue
+++ b/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'
                 }
               }
diff --git a/core/frontend/src/views/dataset/add/AddUnion.vue b/core/frontend/src/views/dataset/add/AddUnion.vue
index 9e551bbd9b..b1273d8b07 100644
--- a/core/frontend/src/views/dataset/add/AddUnion.vue
+++ b/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>
diff --git a/core/frontend/src/views/dataset/add/util.js b/core/frontend/src/views/dataset/add/util.js
index cf5444af53..09be30c272 100644
--- a/core/frontend/src/views/dataset/add/util.js
+++ b/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
-}
\ No newline at end of file
+  arr.sort((a, b) => {
+    return zh2py(a.name[0]) - zh2py(b.name[0])
+  })
+  return arr
+}
diff --git a/core/frontend/src/views/dataset/data/ViewTable.vue b/core/frontend/src/views/dataset/data/ViewTable.vue
index aa55f0983d..5cf97200f8 100644
--- a/core/frontend/src/views/dataset/data/ViewTable.vue
+++ b/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>
diff --git a/core/frontend/src/views/dataset/group/CreatDsGroup.vue b/core/frontend/src/views/dataset/group/CreatDsGroup.vue
index 42e62edcb2..a2c24d0d33 100644
--- a/core/frontend/src/views/dataset/group/CreatDsGroup.vue
+++ b/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="
diff --git a/core/frontend/src/views/dataset/group/Group.vue b/core/frontend/src/views/dataset/group/Group.vue
index 114ac16388..4e5802d2e7 100644
--- a/core/frontend/src/views/dataset/group/Group.vue
+++ b/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 {
diff --git a/core/frontend/src/views/dataset/group/GroupMoveSelector.vue b/core/frontend/src/views/dataset/group/GroupMoveSelector.vue
index 8a668582b7..0ad5f9093a 100644
--- a/core/frontend/src/views/dataset/group/GroupMoveSelector.vue
+++ b/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="
diff --git a/core/frontend/src/views/mobile/index.vue b/core/frontend/src/views/mobile/index.vue
index 4ea5925bb3..398e7beea8 100644
--- a/core/frontend/src/views/mobile/index.vue
+++ b/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)
diff --git a/core/frontend/src/views/panel/appTemplate/AppTemplateContent.vue b/core/frontend/src/views/panel/appTemplate/AppTemplateContent.vue
index 0dddb47a3a..83653237be 100644
--- a/core/frontend/src/views/panel/appTemplate/AppTemplateContent.vue
+++ b/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>
diff --git a/core/frontend/src/views/panel/appTemplate/component/TemplateItem.vue b/core/frontend/src/views/panel/appTemplate/component/TemplateItem.vue
index c21f0789f4..f6ec94ae04 100644
--- a/core/frontend/src/views/panel/appTemplate/component/TemplateItem.vue
+++ b/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
diff --git a/core/frontend/src/views/panel/appTemplate/component/TemplateList.vue b/core/frontend/src/views/panel/appTemplate/component/TemplateList.vue
index ca5ba0777d..40b3d3d692 100644
--- a/core/frontend/src/views/panel/appTemplate/component/TemplateList.vue
+++ b/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"
diff --git a/core/frontend/src/views/panel/appTemplate/component/TemplateMoveList.vue b/core/frontend/src/views/panel/appTemplate/component/TemplateMoveList.vue
index 952556810a..458f3217e3 100644
--- a/core/frontend/src/views/panel/appTemplate/component/TemplateMoveList.vue
+++ b/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>
diff --git a/core/frontend/src/views/panel/edit/index.vue b/core/frontend/src/views/panel/edit/index.vue
index ad66f0d474..e1b623485b 100644
--- a/core/frontend/src/views/panel/edit/index.vue
+++ b/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)
     }
   }
 }
diff --git a/core/frontend/src/views/panel/linkJumpSet/index.vue b/core/frontend/src/views/panel/linkJumpSet/index.vue
index 4594cbefd0..9e4de9061f 100644
--- a/core/frontend/src/views/panel/linkJumpSet/index.vue
+++ b/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}"
diff --git a/core/frontend/src/views/panel/list/PanelList.vue b/core/frontend/src/views/panel/list/PanelList.vue
index f972c4761e..7403e71f87 100644
--- a/core/frontend/src/views/panel/list/PanelList.vue
+++ b/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'
diff --git a/core/frontend/src/views/panel/list/PanelMain.vue b/core/frontend/src/views/panel/list/PanelMain.vue
index ee47cbca71..179d351bad 100644
--- a/core/frontend/src/views/panel/list/PanelMain.vue
+++ b/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"
diff --git a/core/frontend/src/views/panel/list/PanelViewShow.vue b/core/frontend/src/views/panel/list/PanelViewShow.vue
index 2076688bcd..1c0968f276 100644
--- a/core/frontend/src/views/panel/list/PanelViewShow.vue
+++ b/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
     },
diff --git a/core/frontend/src/views/panel/outerParamsSet/index.vue b/core/frontend/src/views/panel/outerParamsSet/index.vue
index f17820d1cf..5194d5d33d 100644
--- a/core/frontend/src/views/panel/outerParamsSet/index.vue
+++ b/core/frontend/src/views/panel/outerParamsSet/index.vue
@@ -287,12 +287,12 @@ export default {
     panelInfo() {
       return this.$store.state.panel.panelInfo
     },
-    viewSelectedField(){
+    viewSelectedField() {
       const viewIds = []
-      this.outerParamsInfo.targetViewInfoList.forEach((targetViewInfo)=>{
+      this.outerParamsInfo.targetViewInfoList.forEach((targetViewInfo) => {
         viewIds.push(targetViewInfo.targetViewId)
       })
-      console.log('viewIds='+JSON.stringify(viewIds))
+      console.log('viewIds=' + JSON.stringify(viewIds))
       return viewIds
     },
     ...mapState([
diff --git a/core/frontend/src/views/panel/subjectSetting/panelStyle/BackgroundSelector.vue b/core/frontend/src/views/panel/subjectSetting/panelStyle/BackgroundSelector.vue
index 9e15a08b9b..ade084ecf9 100644
--- a/core/frontend/src/views/panel/subjectSetting/panelStyle/BackgroundSelector.vue
+++ b/core/frontend/src/views/panel/subjectSetting/panelStyle/BackgroundSelector.vue
@@ -277,7 +277,6 @@ span {
   line-height: 22px;
 }
 
-
 ::v-deep .el-slider__input {
   width: 40px;
   padding-left: 0px;
diff --git a/core/frontend/src/views/panel/subjectSetting/panelStyle/MobileBackgroundSelector.vue b/core/frontend/src/views/panel/subjectSetting/panelStyle/MobileBackgroundSelector.vue
index 5591b64f29..48043da0ba 100644
--- a/core/frontend/src/views/panel/subjectSetting/panelStyle/MobileBackgroundSelector.vue
+++ b/core/frontend/src/views/panel/subjectSetting/panelStyle/MobileBackgroundSelector.vue
@@ -24,13 +24,13 @@
       >
         <el-col :span="4">
           <el-color-picker
-              v-model="mobileSetting.color"
-              :predefine="predefineColors"
-              size="mini"
-              class="color-picker-custom"
-              :disabled="!mobileSetting.customSetting"
-              @change="onChangeType"
-            />
+            v-model="mobileSetting.color"
+            :predefine="predefineColors"
+            size="mini"
+            class="color-picker-custom"
+            :disabled="!mobileSetting.customSetting"
+            @change="onChangeType"
+          />
         </el-col>
         <el-col :span="5">
           <span class="params-title-small">{{ $t('chart.not_alpha') }}</span>
@@ -282,7 +282,6 @@ span {
   line-height: 22px;
 }
 
-
 ::v-deep .el-slider__input {
   width: 40px;
   padding-left: 0px;
diff --git a/core/frontend/src/views/panel/template/component/TemplateList.vue b/core/frontend/src/views/panel/template/component/TemplateList.vue
index 01786f8645..230382bf88 100644
--- a/core/frontend/src/views/panel/template/component/TemplateList.vue
+++ b/core/frontend/src/views/panel/template/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"
diff --git a/core/frontend/src/views/system/datasource/ApiHttpRequestForm.vue b/core/frontend/src/views/system/datasource/ApiHttpRequestForm.vue
index 940d79a9a2..3f7ec565bb 100644
--- a/core/frontend/src/views/system/datasource/ApiHttpRequestForm.vue
+++ b/core/frontend/src/views/system/datasource/ApiHttpRequestForm.vue
@@ -37,23 +37,34 @@
             </el-tab-pane>
 
             <!--query 参数-->
-            <el-tab-pane :label="$t('datasource.query_param')" name="parameters">
-              <el-tooltip class="item-tabs" effect="dark" :content="$t('datasource.query_info')"
-                          placement="top-start" slot="label">
-              <span>{{ $t('datasource.query_param') }}
-                <div class="el-step__icon is-text ms-api-col ms-header" v-if="request.arguments.length>1">
-                  <div class="el-step__icon-inner">{{ request.arguments.length - 1 }}</div>
-                </div>
-              </span>
+            <el-tab-pane
+              :label="$t('datasource.query_param')"
+              name="parameters"
+            >
+              <el-tooltip
+                slot="label"
+                class="item-tabs"
+                effect="dark"
+                :content="$t('datasource.query_info')"
+                placement="top-start"
+              >
+                <span>{{ $t('datasource.query_param') }}
+                  <div
+                    v-if="request.arguments.length>1"
+                    class="el-step__icon is-text ms-api-col ms-header"
+                  >
+                    <div class="el-step__icon-inner">{{ request.arguments.length - 1 }}</div>
+                  </div>
+                </span>
               </el-tooltip>
               <api-variable
-                @editScenarioAdvance="editScenarioAdvance"
+                v-if="activeName === 'parameters'"
                 :scenario-definition="scenarioDefinition"
                 :with-more-setting="true"
                 :is-read-only="isReadOnly"
-                :isShowEnable="isShowEnable"
+                :is-show-enable="isShowEnable"
                 :parameters="request.arguments"
-                v-if="activeName === 'parameters'"
+                @editScenarioAdvance="editScenarioAdvance"
               />
             </el-tab-pane>
 
diff --git a/core/frontend/src/views/system/datasource/DsAppForm.vue b/core/frontend/src/views/system/datasource/DsAppForm.vue
index 581d5b5eac..29321f856f 100644
--- a/core/frontend/src/views/system/datasource/DsAppForm.vue
+++ b/core/frontend/src/views/system/datasource/DsAppForm.vue
@@ -800,7 +800,7 @@ export default {
             data.request = JSON.stringify(data.request)
             this.loading = true
             this.disabledNext = true
-            checkApiDatasource({'data': Base64.encode(JSON.stringify(data))}).then(res => {
+            checkApiDatasource({ 'data': Base64.encode(JSON.stringify(data)) }).then(res => {
               this.loading = false
               this.disabledNext = false
               this.apiItem.status = 'Success'
@@ -858,7 +858,7 @@ export default {
           const data = JSON.parse(JSON.stringify(this.apiItem))
           data.request = JSON.stringify(data.request)
           this.loading = true
-          checkApiDatasource({'data': Base64.encode(JSON.stringify(data))}).then(res => {
+          checkApiDatasource({ 'data': Base64.encode(JSON.stringify(data)) }).then(res => {
             this.loading = false
             this.$success(i18n.t('commons.success'))
             this.apiItem.fields = res.data.fields
diff --git a/core/frontend/src/views/system/datasource/DsConfiguration.vue b/core/frontend/src/views/system/datasource/DsConfiguration.vue
index b16707c570..53dea4b597 100644
--- a/core/frontend/src/views/system/datasource/DsConfiguration.vue
+++ b/core/frontend/src/views/system/datasource/DsConfiguration.vue
@@ -71,7 +71,10 @@
                     popper-class="api-table-delete"
                     trigger="click"
                   >
-                    <svg-icon :disabled="disabled" icon-class="icon_info_filled" />
+                    <svg-icon
+                      :disabled="disabled"
+                      icon-class="icon_info_filled"
+                    />
                     <div class="tips">
                       {{ $t('datasource.delete_this_item') }}
                     </div>
@@ -541,8 +544,8 @@
             :label="$t('datasource.isUseJsonPath')"
           >
             <el-input
-              :disabled="!apiItem.useJsonPath"
               v-model="apiItem.jsonPath"
+              :disabled="!apiItem.useJsonPath"
               :placeholder="$t('datasource.jsonpath_info')"
               class="input-with-select"
               size="small"
@@ -562,18 +565,24 @@
               </el-select>
 
               <el-button
-                :disabled="!apiItem.useJsonPath"
                 slot="append"
+                :disabled="!apiItem.useJsonPath"
                 @click="showApiData"
               >{{ $t('datasource.show_api_data') }}
               </el-button>
             </el-input>
           </el-form-item>
 
-          <div class="row-rules" v-show="apiItem.useJsonPath">
+          <div
+            v-show="apiItem.useJsonPath"
+            class="row-rules"
+          >
             <span>{{ $t('datasource.column_info') }}</span>
           </div>
-          <div class="table-container de-svg-in-table" v-show="apiItem.useJsonPath">
+          <div
+            v-show="apiItem.useJsonPath"
+            class="table-container de-svg-in-table"
+          >
             <el-table
               ref="apiItemTable"
               :data="originFieldItem.jsonFields"
@@ -1085,7 +1094,7 @@ export default {
       originFieldItem: {
         jsonFields: [],
         fields: []
-      },
+      }
     }
   },
   methods: {
@@ -1151,7 +1160,7 @@ export default {
             const data = Base64.encode(JSON.stringify(this.apiItem))
             this.loading = true
             this.disabledNext = true
-            checkApiDatasource({'data': data})
+            checkApiDatasource({ 'data': data })
               .then((res) => {
                 this.loading = false
                 this.disabledNext = false
@@ -1174,16 +1183,16 @@ export default {
         })
       }
     },
-    showApiData(){
+    showApiData() {
       this.$refs.apiItemBasicInfo.validate((valid) => {
         if (valid) {
           const data = Base64.encode(JSON.stringify(this.apiItem))
           this.loading = true
-          checkApiDatasource({'data': data, 'type': 'apiStructure'})
+          checkApiDatasource({ 'data': data, 'type': 'apiStructure' })
             .then((res) => {
-              res.data.jsonFields.forEach(((item) => {
+              res.data.jsonFields.forEach((item) => {
                 item.checked = false
-              }))
+              })
               this.originFieldItem.jsonFields = res.data.jsonFields
               this.loading = false
               this.$success(i18n.t('commons.success'))
@@ -1227,10 +1236,10 @@ export default {
         for (let i = 0; i < this.form.apiConfiguration.length; i++) {
           if (this.form.apiConfiguration[i].serialNumber === this.apiItem.serialNumber) {
             this.certinKey = !this.certinKey
-            if(this.form.apiConfiguration[i].name !== this.apiItem.name){
+            if (this.form.apiConfiguration[i].name !== this.apiItem.name) {
               this.apiItem.reName = true
               this.apiItem.orgName = this.form.apiConfiguration[i].name
-            }else {
+            } else {
               this.apiItem.reName = false
             }
             this.form.apiConfiguration[i] = JSON.parse(JSON.stringify(this.apiItem))
diff --git a/core/frontend/src/views/system/datasource/DsForm.vue b/core/frontend/src/views/system/datasource/DsForm.vue
index 2c14c69826..b51300773b 100644
--- a/core/frontend/src/views/system/datasource/DsForm.vue
+++ b/core/frontend/src/views/system/datasource/DsForm.vue
@@ -46,13 +46,13 @@
     <div style="height: calc(100% - 56px)">
       <DsFormContent
         ref="DsFormContent"
-        @editeTodisable="backToList"
         :outer-params="outerParams"
         :reference-position="referencePosition"
         :form-type.sync="formType"
         :type-map.sync="typeMap"
         :can-edit.sync="canEdit"
         :form-loading.sync="formLoading"
+        @editeTodisable="backToList"
         @refreshType="refreshType"
         @closeDraw="closeDraw"
         @setParams="setParams"
@@ -96,7 +96,7 @@ export default {
     },
     tips() {
       const { id, showModel } = this.params
-      if(showModel === 'copy'){
+      if (showModel === 'copy') {
         return this.$t('datasource.copy')
       }
       return id && showModel === 'show' && !this.canEdit
diff --git a/core/frontend/src/views/system/datasource/DsFormContent.vue b/core/frontend/src/views/system/datasource/DsFormContent.vue
index 4bc431cb55..425602dcef 100644
--- a/core/frontend/src/views/system/datasource/DsFormContent.vue
+++ b/core/frontend/src/views/system/datasource/DsFormContent.vue
@@ -71,8 +71,8 @@
           </el-form>
           <div class="de-row-rules">
             <span>{{
-                positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
-              }}</span>
+              positionCheck('appMarket') ? $t('app_template.datasource_info') : $t('datasource.basic_info')
+            }}</span>
           </div>
           <el-form
             ref="historyDsForm"
@@ -122,25 +122,25 @@
                   <span
                     v-if="
                       item.status !== 'Error' &&
-                      item.status !== 'Warning'
-                  "
+                        item.status !== 'Warning'
+                    "
                   >
-                  <svg-icon
-                    icon-class="db-de"
-                  />
-                </span>
+                    <svg-icon
+                      icon-class="db-de"
+                    />
+                  </span>
                   <span v-if="item.status === 'Error'">
-                  <svg-icon
-                    icon-class="de-ds-error"
-                    class="ds-icon-scene"
-                  />
-                </span>
+                    <svg-icon
+                      icon-class="de-ds-error"
+                      class="ds-icon-scene"
+                    />
+                  </span>
                   <span v-if="item.status === 'Warning'">
-                  <svg-icon
-                    icon-class="de-ds-warning"
-                    class="ds-icon-scene"
-                  />
-                </span>
+                    <svg-icon
+                      icon-class="de-ds-warning"
+                      class="ds-icon-scene"
+                    />
+                  </span>
                   <span>
                     {{ item.name }}
                   </span>
@@ -273,7 +273,7 @@
               formType === 'add'
                 ? true
                 : (hasDataPermission('manage', outerParams.panelPrivileges)
-                ||hasDataPermission('manage', outerParams.datasetPrivileges))
+                  ||hasDataPermission('manage', outerParams.datasetPrivileges))
             "
             @click="validaDatasource"
           >{{ $t('commons.validate') }}
@@ -840,16 +840,16 @@ export default {
     },
     saveAppMarketHistory() {
       this.$refs.historyDsForm.validate(valid => {
-          if (!valid) {
-            return false
-          }
-          const appApplyForm = {
-            ...this.attachForm,
-            ...this.historyDsForm
-          }
-          const method = this.formType === 'add' ? appApply : appEdit
-          this.appApplyMethod(method, appApplyForm)
+        if (!valid) {
+          return false
         }
+        const appApplyForm = {
+          ...this.attachForm,
+          ...this.historyDsForm
+        }
+        const method = this.formType === 'add' ? appApply : appEdit
+        this.appApplyMethod(method, appApplyForm)
+      }
       )
     },
     save() {
@@ -996,10 +996,10 @@ export default {
       }
       if (this.positionCheck('appMarket')) {
         this.$refs.attachParamsForm.validate(valid => {
-            if (!valid) {
-              return false
-            }
+          if (!valid) {
+            return false
           }
+        }
         )
       }
       this.$refs.dsForm.validate((valid) => {
@@ -1116,7 +1116,7 @@ export default {
     },
     reloadStatus(statusMap = {}) {
       this.form.apiConfiguration.forEach(ele => {
-         ele.status = statusMap[ele.name] || ele.status
+        ele.status = statusMap[ele.name] || ele.status
       })
     },
     validaDatasource() {
@@ -1151,10 +1151,10 @@ export default {
       }
       if (this.positionCheck('appMarket')) {
         this.$refs.attachParamsForm.validate(valid => {
-            if (!valid) {
-              return false
-            }
+          if (!valid) {
+            return false
           }
+        }
         )
       }
       this.$refs.dsForm.validate((valid) => {
diff --git a/core/frontend/src/views/system/datasource/DsTable.vue b/core/frontend/src/views/system/datasource/DsTable.vue
index dbf2b96ed1..fc316b2572 100644
--- a/core/frontend/src/views/system/datasource/DsTable.vue
+++ b/core/frontend/src/views/system/datasource/DsTable.vue
@@ -22,8 +22,8 @@
         <div class="ds-top">
           <deBtn
             v-if="privileges && canEdit"
-            secondary
             key="cancel"
+            secondary
             @click="editDatasource(false)"
           >{{ $t('commons.cancel') }}
           </deBtn>
@@ -64,11 +64,11 @@
         </div>
         <div style="height: calc(100% - 36px)">
           <ds-form-content
-            @editeTodisable="editDatasource"
-            :canEdit="canEdit"
             ref="DsFormContent"
-            @refresh-type="refreshType"
+            :can-edit="canEdit"
             :config-from-tabs="configFromTabs"
+            @editeTodisable="editDatasource"
+            @refresh-type="refreshType"
           />
         </div>
       </template>
@@ -90,7 +90,7 @@ export default {
   data() {
     return {
       activeName: 'detail',
-      canEdit: false,
+      canEdit: false
     }
   },
   computed: {
diff --git a/core/frontend/src/views/system/datasource/DsTree.vue b/core/frontend/src/views/system/datasource/DsTree.vue
index 7e6d1aabce..b04af22af6 100644
--- a/core/frontend/src/views/system/datasource/DsTree.vue
+++ b/core/frontend/src/views/system/datasource/DsTree.vue
@@ -173,7 +173,10 @@
                         <i class="el-icon-edit" />
                         {{ $t('chart.edit') }}
                       </el-dropdown-item>
-                      <el-dropdown-item command="copy" v-show="showView === 'Datasource'">
+                      <el-dropdown-item
+                        v-show="showView === 'Datasource'"
+                        command="copy"
+                      >
                         <svg-icon
                           icon-class="de-copy"
                           class="de-copy-icon"
@@ -432,7 +435,7 @@ export default {
   },
   methods: {
     getDatasourceRelationship({ queryType, label, id }) {
-     return getDatasourceRelationship(id).then((res) => {
+      return getDatasourceRelationship(id).then((res) => {
         const arr = res.data || []
         this.treeData = []
         this.dfsTree(arr, { queryType, label })
@@ -713,7 +716,7 @@ export default {
       this.dialogTitle = this.$t('datasource.edit_driver')
       this.driverForm = { ...row }
     },
-    _handleCopy(row){
+    _handleCopy(row) {
       if (this.showView === 'Datasource') {
         const param = { ...row, ...{ showModel: 'copy' }}
         this.switchMain('DsForm', param, this.tData, this.dsTypes)
diff --git a/core/frontend/src/views/system/datasource/MsgContent.vue b/core/frontend/src/views/system/datasource/MsgContent.vue
index 9caf290eea..84e2e3a27d 100644
--- a/core/frontend/src/views/system/datasource/MsgContent.vue
+++ b/core/frontend/src/views/system/datasource/MsgContent.vue
@@ -1,10 +1,13 @@
 <template>
   <div>
     <span>{{ someProp.title }}</span>
-    <br />
+    <br>
     <span class="use-html">{{ someProp.content }}</span>
-    <br />
-    <span @click="change" class="link-msg">{{ someProp.link }}</span>
+    <br>
+    <span
+      class="link-msg"
+      @click="change"
+    >{{ someProp.link }}</span>
   </div>
 </template>
 <script>
@@ -13,7 +16,7 @@ export default {
     someProp: {
       type: Object,
       default: () => {}
-    },
+    }
   },
   methods: {
     change() {
@@ -27,4 +30,4 @@ export default {
   color: #307eff;
   cursor: pointer;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/core/frontend/src/views/system/relationship/consanguinity.vue b/core/frontend/src/views/system/relationship/consanguinity.vue
index 4f5d40d08b..a0979dfdcc 100644
--- a/core/frontend/src/views/system/relationship/consanguinity.vue
+++ b/core/frontend/src/views/system/relationship/consanguinity.vue
@@ -1,6 +1,9 @@
 <template>
   <div :style="chartSize">
-    <div id="main" :style="chartSizeMax"></div>
+    <div
+      id="main"
+      :style="chartSizeMax"
+    />
   </div>
 </template>
 
@@ -16,7 +19,7 @@ export default {
     chartSize: {
       type: Object,
       default: () => {}
-    },
+    }
   },
   data() {
     return {
@@ -36,8 +39,8 @@ export default {
   computed: {
     chartSizeMax() {
       const { height } = this.chartSize
-      return this.maxSize > parseInt(height)/25  ? {
-        height: this.maxSize * 25  + 'px',
+      return this.maxSize > parseInt(height) / 25 ? {
+        height: this.maxSize * 25 + 'px',
         width: this.chartSize.width
       } : this.chartSize
     }
@@ -141,7 +144,7 @@ export default {
       })
     },
     deleteRepeat(arr = []) {
-      let list = JSON.parse(JSON.stringify(arr))
+      const list = JSON.parse(JSON.stringify(arr))
       const repeatPanel = {}
       list.forEach((ele) => {
         if (ele[6] === this.datasourcePanel[this.current.queryType]) {
@@ -192,9 +195,10 @@ export default {
       })
 
       arr.forEach((ele) => {
+        // eslint-disable-next-line
         const [index, start, end, width, id, name, type, pid] = ele
         if (type === this.datasourcePanel[this.current.queryType]) {
-          let dataset = dataItemListMap[pid]
+          const dataset = dataItemListMap[pid]
           if (repeatPanel[id]) {
             repeatPanel[id].push({ index, start })
           } else {
@@ -236,10 +240,9 @@ export default {
       const ctx = c.getContext('2d')
       ctx.font = '14px Arial'
       const dataItemList = []
-      let list = []
-      const repeatPanel = {}
+      const list = []
 
-      let max = {
+      const max = {
         dataset: 0,
         datasource: 0,
         panel: 0
@@ -248,7 +251,7 @@ export default {
       const { queryType, num, label } = this.current
       max[queryType] = ctx.measureText(label).width + 30
 
-      if (!arr.length)
+      if (!arr.length) {
         return [
           [[0, 0, max[queryType], max[queryType], num, label, queryType, 0]],
           {
@@ -257,10 +260,11 @@ export default {
             panel: 0
           }
         ]
+      }
 
       arr.forEach((ele, index) => {
         const { id, name, type, pid } = ele
-        let width = ctx.measureText(name).width + 30
+        const width = ctx.measureText(name).width + 30
         max[type] = Math.max(width, max[type])
         dataItemList.push([width, id, name, type, pid])
       })
@@ -331,7 +335,7 @@ export default {
           30
         )
       }
-      let gap = {
+      const gap = {
         dataset: maxGap('dataset', 'datasource'),
         datasource: maxGap('datasource', 'datasource'),
         panel: maxGap('panel', 'dataset')
@@ -347,6 +351,7 @@ export default {
 
       this.myChart = echarts.init(document.getElementById('main'))
       const that = this
+      // eslint-disable-next-line
       let [data, gap] = this.calculatedWidth(this.treeData)
       const gapDetail = {
         dataset: gap.dataset,
@@ -360,11 +365,11 @@ export default {
 
       const lineEnd = [clickNode[0]]
       lineData = lineData.map(ele => {
-        let arr = [...ele]
+        const arr = [...ele]
         if (clickNode[0] === ele[0]) {
           arr.push(1)
           lineEnd.push(ele[3])
-        } else if(clickNode[0] === ele[3]) {
+        } else if (clickNode[0] === ele[3]) {
           arr.push(1)
           lineEnd.push(ele[0])
         } else {
@@ -374,20 +379,20 @@ export default {
       })
 
       data = data.map(ele => {
-        let arr = [...ele]
+        const arr = [...ele]
         arr.push(Boolean(lineEnd.includes(ele[0])))
         return arr
       })
-      
+
       if (this.maxSize !== data.length) {
         this.maxSize = data.length
         return
       }
-      let option = {
+      const option = {
         xAxis: {
-          show: false, //不显示分隔线,
+          show: false, // 不显示分隔线,
           splitLine: {
-            show: false //不显示分隔线
+            show: false // 不显示分隔线
           }
         },
         grid: {
@@ -406,7 +411,7 @@ export default {
           show: false,
           type: 'category',
           splitLine: {
-            show: false //不显示分隔线
+            show: false // 不显示分隔线
           }
         },
         series: [
@@ -419,11 +424,11 @@ export default {
               y: 0
             },
             roam: true,
-            renderItem: function (params, api) {
-              let categoryIndex = api.value(0)
-              let startPoint = api.coord([api.value(1), categoryIndex])
-              let width = api.value(3)
-              let height = 22
+            renderItem: function(params, api) {
+              const categoryIndex = api.value(0)
+              const startPoint = api.coord([api.value(1), categoryIndex])
+              const width = api.value(3)
+              const height = 22
 
               const imageType = {
                 datasource: '/static/svg/de-datasource.svg',
@@ -431,19 +436,18 @@ export default {
                 dataset: '/static/svg/de-dataset.svg'
               }
 
-              
               return {
-                type: 'group', //当需要多个自定义拼接时，需要用group，此案例是文字和图形的拼接
+                type: 'group', // 当需要多个自定义拼接时，需要用group，此案例是文字和图形的拼接
                 children: [
                   {
                     type: 'text',
                     position: [
                       startPoint[0] + gapDetail[api.value(6)],
                       startPoint[1] - height / 2
-                    ], //相对位置
+                    ], // 相对位置
                     z2: 10,
                     style: {
-                      text: isNaN(api.value(5)) ? data.find(ele => ele[4] === api.value(4))[5] : api.value(5), //data中取值
+                      text: isNaN(api.value(5)) ? data.find(ele => ele[4] === api.value(4))[5] : api.value(5), // data中取值
                       color: '#1F2329',
                       x: 25,
                       y: 5
@@ -503,13 +507,11 @@ export default {
               y: [0, 3]
             },
             roam: true,
-            renderItem: function (params, api) {
-              let categoryIndex = api.value(0)
-              let categoryIndex2 = api.value(3)
-              let startPoint = api.coord([api.value(1), categoryIndex])
-              let endPoint = api.coord([api.value(2), categoryIndex2])
-              let height = 20
-
+            renderItem: function(params, api) {
+              const categoryIndex = api.value(0)
+              const categoryIndex2 = api.value(3)
+              const startPoint = api.coord([api.value(1), categoryIndex])
+              const endPoint = api.coord([api.value(2), categoryIndex2])
               function startPointX1() {
                 if (api.value(5) === 'dataset') {
                   return startPoint[0] + api.value(4)
@@ -526,10 +528,10 @@ export default {
                 }
               }
 
-              let x1 = startPointX1()
+              const x1 = startPointX1()
 
               return {
-                type: 'group', //当需要多个自定义拼接时，需要用group，此案例是文字和图形的拼接
+                type: 'group', // 当需要多个自定义拼接时，需要用group，此案例是文字和图形的拼接
                 children: [
                   {
                     type: 'bezierCurve',
@@ -539,10 +541,10 @@ export default {
                       y1: startPoint[1],
                       x2: endPoint[0] + gapDetail[api.value(5)],
                       y2: endPoint[1],
-                      cpx1:endPoint[0] + gapDetail[api.value(5)] - 50,
-                      cpx2:endPoint[0] + gapDetail[api.value(5)] - 10,
-                      cpy1:endPoint[1],
-                      cpy2:endPoint[1],
+                      cpx1: endPoint[0] + gapDetail[api.value(5)] - 50,
+                      cpx2: endPoint[0] + gapDetail[api.value(5)] - 10,
+                      cpy1: endPoint[1],
+                      cpy2: endPoint[1],
                       percent: 1
                     },
                     style: {
@@ -559,9 +561,9 @@ export default {
         ]
       }
       this.myChart.setOption(option, true)
-      this.myChart.on('click', function (params) {
-          that.initEchart(params.value)
-      });
+      this.myChart.on('click', function(params) {
+        that.initEchart(params.value)
+      })
     }
   }
 }
diff --git a/core/frontend/src/views/system/sysParam/BasicSetting.vue b/core/frontend/src/views/system/sysParam/BasicSetting.vue
index 7d34229fcd..6af1c4f9bc 100644
--- a/core/frontend/src/views/system/sysParam/BasicSetting.vue
+++ b/core/frontend/src/views/system/sysParam/BasicSetting.vue
@@ -47,7 +47,10 @@
             :content="$t('system_parameter_setting.front_time_out')"
             placement="top"
           >
-            <svg-icon class="tips" icon-class="icon_info_outlined" />
+            <svg-icon
+              class="tips"
+              icon-class="icon_info_outlined"
+            />
           </el-tooltip>
         </template>
         <el-input
diff --git a/core/frontend/src/views/system/sysParam/EmailSetting.vue b/core/frontend/src/views/system/sysParam/EmailSetting.vue
index 698c4e15d0..5c0f4c2959 100644
--- a/core/frontend/src/views/system/sysParam/EmailSetting.vue
+++ b/core/frontend/src/views/system/sysParam/EmailSetting.vue
@@ -90,7 +90,10 @@
             :content="$t('system_parameter_setting.test_mail_recipient')"
             placement="top"
           >
-            <svg-icon icon-class="icon_info_outlined" class="tips-not-absolute" />
+            <svg-icon
+              icon-class="icon_info_outlined"
+              class="tips-not-absolute"
+            />
           </el-tooltip>
         </template>
         <dePwd
@@ -106,7 +109,10 @@
             :content="$t('system_parameter_setting.to_enable_ssl')"
             placement="top"
           >
-            <svg-icon icon-class="icon_info_outlined" class="tips-not-absolute" />
+            <svg-icon
+              icon-class="icon_info_outlined"
+              class="tips-not-absolute"
+            />
           </el-tooltip>
         </el-checkbox>
 
@@ -118,7 +124,10 @@
             :content="$t('system_parameter_setting.to_enable_tsl')"
             placement="top"
           >
-            <svg-icon icon-class="icon_info_outlined" class="tips-not-absolute" />
+            <svg-icon
+              icon-class="icon_info_outlined"
+              class="tips-not-absolute"
+            />
           </el-tooltip>
         </el-checkbox>
       </el-form-item>
diff --git a/core/frontend/src/views/system/user/PasswordUpdateForm.vue b/core/frontend/src/views/system/user/PasswordUpdateForm.vue
index 0803def693..12d025ac0a 100644
--- a/core/frontend/src/views/system/user/PasswordUpdateForm.vue
+++ b/core/frontend/src/views/system/user/PasswordUpdateForm.vue
@@ -7,17 +7,30 @@
     label-width="auto"
     label-position="right"
   >
-    <el-form-item v-if="!oldPwd" :label="$t('user.origin_passwd')" prop="oldPwd">
+    <el-form-item
+      v-if="!oldPwd"
+      :label="$t('user.origin_passwd')"
+      prop="oldPwd"
+    >
       <dePwd v-model="form.oldPwd" />
     </el-form-item>
-    <el-form-item :label="$t('user.new_passwd')" prop="newPwd">
+    <el-form-item
+      :label="$t('user.new_passwd')"
+      prop="newPwd"
+    >
       <dePwd v-model="form.newPwd" />
     </el-form-item>
-    <el-form-item :label="$t('user.confirm_passwd')" prop="repeatPwd">
+    <el-form-item
+      :label="$t('user.confirm_passwd')"
+      prop="repeatPwd"
+    >
       <dePwd v-model="form.repeatPwd" />
     </el-form-item>
     <el-form-item>
-      <el-button type="primary" @click="save">{{
+      <el-button
+        type="primary"
+        @click="save"
+      >{{
         $t('commons.confirm')
       }}</el-button>
     </el-form-item>
@@ -34,7 +47,7 @@ export default {
   props: {
     oldPwd: {
       type: String,
-      default: ""
+      default: ''
     }
   },
   data() {
diff --git a/core/frontend/src/views/system/user/PersonPwd.vue b/core/frontend/src/views/system/user/PersonPwd.vue
index 8e5a4f1ca1..d55f5b630e 100644
--- a/core/frontend/src/views/system/user/PersonPwd.vue
+++ b/core/frontend/src/views/system/user/PersonPwd.vue
@@ -23,7 +23,7 @@ export default {
   },
   created() {
     this.$store.dispatch('app/toggleSideBarHide', true)
-  },
+  }
 }
 </script>
 <style lang="scss" scoped>
diff --git a/core/frontend/src/views/wizard/index.vue b/core/frontend/src/views/wizard/index.vue
index 6c2a77fcdd..3f4bace46d 100644
--- a/core/frontend/src/views/wizard/index.vue
+++ b/core/frontend/src/views/wizard/index.vue
@@ -30,12 +30,12 @@
           />
         </el-row>
         <el-row class="top_banner_card">
-          <wizard-card :details="cardList[0]"/>
+          <wizard-card :details="cardList[0]" />
           <wizard-card
             :details="cardList[1]"
             style="margin:0 24px 0 24px"
           />
-          <wizard-card-enterprise :details="cardList[2]"/>
+          <wizard-card-enterprise :details="cardList[2]" />
         </el-row>
         <el-row class="content_middle">
           <div class="content_middle_left">
@@ -44,15 +44,15 @@
               <div class="content_middle_more"><a
                 target="_blank"
                 href="https://space.bilibili.com/510493147/channel/collectiondetail?sid=262774"
-              >{{ $t('wizard.more') }}<i class="el-icon-arrow-right"/></a></div>
+              >{{ $t('wizard.more') }}<i class="el-icon-arrow-right" /></a></div>
             </el-row>
             <el-row style="margin-top: 12px">
-              <video-card :details="videoList[0]"/>
+              <video-card :details="videoList[0]" />
               <video-card
                 style="margin:0 12px 0 12px"
                 :details="videoList[1]"
               />
-              <video-card :details="videoList[2]"/>
+              <video-card :details="videoList[2]" />
             </el-row>
           </div>
           <div class="content_middle_right">
@@ -61,7 +61,7 @@
               <div class="content_middle_more"><a
                 target="_blank"
                 href="https://blog.fit2cloud.com/categories/dataease"
-              >{{ $t('wizard.more') }}<i class="el-icon-arrow-right"/></a></div>
+              >{{ $t('wizard.more') }}<i class="el-icon-arrow-right" /></a></div>
             </el-row>
             <el-row>
               <ul class="ul-custom">
@@ -93,17 +93,17 @@
             </el-row>
             <el-row class="contact_content">
               {{ $t('wizard.web') }}<a
-              style="text-decoration:underline;"
-              target="_blank"
-              href="https://www.dataease.io"
-            >www.dataease.io</a>
+                style="text-decoration:underline;"
+                target="_blank"
+                href="https://www.dataease.io"
+              >www.dataease.io</a>
             </el-row>
             <el-row class="contact_content">
               {{ $t('wizard.bbs') }}<a
-              style="text-decoration:underline;"
-              target="_blank"
-              href="https://bbs.fit2cloud.com/c/de"
-            >https://bbs.fit2cloud.com/c/de</a>
+                style="text-decoration:underline;"
+                target="_blank"
+                href="https://bbs.fit2cloud.com/c/de"
+              >https://bbs.fit2cloud.com/c/de</a>
             </el-row>
           </div>