fix(仪表板): 过滤器标题隐藏后再开启被清空

frontend/src/components/dataease/DeOutWidget.vue

@@ -1,7 +1,7 @@
 <template>
   <div ref="myContainer" class="my-container">
     <div ref="conditionMain" :style="outsideStyle" class="condition-main">
-      <div v-if="element.options.attrs.title" ref="deTitleContainer" :style="titleStyle" class="condition-title">
+      <div v-if="element.options.attrs.showTitle && element.options.attrs.title" ref="deTitleContainer" :style="titleStyle" class="condition-title">
         <div class="condition-title-absolute">
           <div class="first-title">
             <div class="span-container">
@@ -13,7 +13,7 @@
       <div
         ref="deContentContainer"
         class="condition-content"
-        :class="element.options.attrs.title ? '' : 'condition-content-default'"
+        :class="(element.options.attrs.showTitle && element.options.attrs.title) ? '' : 'condition-content-default'"
       >
         <div class="condition-content-container">
           <div class="first-element">

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

@@ -366,12 +366,12 @@
           <svg-icon icon-class="warn-tre" style="width: 20px;height: 20px;float: right" />
         </el-col>
         <el-col :span="21">
-          <span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{$t('panel.panel_cache_use_tips')}}</span>
+          <span style="font-size: 13px;margin-left: 10px;font-weight: bold;line-height: 20px">{{ $t('panel.panel_cache_use_tips') }}</span>
         </el-col>
       </el-row>
       <div slot="footer" class="dialog-footer">
-        <el-button size="mini" @click="useCache(false)">{{$t('panel.no')}}</el-button>
+        <el-button size="mini" @click="useCache(false)">{{ $t('panel.no') }}</el-button>
-        <el-button type="primary" size="mini" @click="useCache(true)">{{$t('panel.yes')}}</el-button>
+        <el-button type="primary" size="mini" @click="useCache(true)">{{ $t('panel.yes') }}</el-button>
       </div>
     </el-dialog>
 
@@ -387,7 +387,7 @@ import FilterGroup from '../filter'
 import SubjectSetting from '../SubjectSetting'
 import bus from '@/utils/bus'
 import Editor from '@/components/canvas/components/Editor/index'
-import {deepCopy, imgUrlTrans, matrixBaseChange} from '@/components/canvas/utils/utils'
+import { deepCopy, imgUrlTrans, matrixBaseChange } from '@/components/canvas/utils/utils'
 import componentList, {
   BASE_MOBILE_STYLE,
   COMMON_BACKGROUND,
@@ -562,7 +562,7 @@ export default {
         return false
       } else if (this.curComponent && this.showAttrComponent.includes(this.curComponent.type)) {
         // 过滤组件有标题才显示
-        if (this.curComponent.type === 'custom' && !this.curComponent.options.attrs.title) {
+        if (this.curComponent.type === 'custom' && (!this.curComponent.options.attrs.showTitle || !this.curComponent.options.attrs.title)) {
           return false
         } else {
           return true
@@ -721,8 +721,8 @@ export default {
       bus.$on('delete-condition', this.deleteCustomComponent)
       bus.$on('current-component-change', this.asideRefresh)
     },
-    asideRefresh(){
+    asideRefresh() {
-      if(this.$refs['chartEditRef']){
+      if (this.$refs['chartEditRef']) {
         this.$refs['chartEditRef'].resetChartData()
       }
     },
@@ -790,7 +790,7 @@ export default {
         setTimeout(() => {
           if (useCache) {
             _this.$store.commit('recordSnapshot', 'cache')
-            _this.$store.commit('recordChangeTimes' )
+            _this.$store.commit('recordChangeTimes')
           } else {
             _this.$store.commit('refreshSaveStatus')
           }

frontend/src/views/panel/filter/ButtonDialog.vue

@@ -76,7 +76,7 @@ export default {
         if (showName) {
           result = this.$t(showName)
         }
-        if (item.options.attrs.title) {
+        if (item.options.attrs.showTitle && item.options.attrs.title) {
           result += '【' + item.options.attrs.title + '】'
         }
 

frontend/src/views/panel/filter/filterMain/FilterControl.vue

@@ -50,8 +50,13 @@
           </el-checkbox>
           <el-popover v-model="titlePopovervisible" placement="bottom-end" :disabled="!attrs.showTitle" width="200">
             <div style="width: 100%;overflow-y: auto;overflow-x: hidden;word-break: break-all;position: relative;">
-              <el-input v-model="attrs.title" :placeholder="$t('panel.input_title')" type="textarea" maxlength="15"
+              <el-input
-                        show-word-limit/>
+                v-model="attrs.title"
+                :placeholder="$t('panel.input_title')"
+                type="textarea"
+                maxlength="15"
+                show-word-limit
+              />
             </div>
 
             <i
@@ -75,7 +80,7 @@
                   class="de-checkbox"
                 >
                   <div class="span-div">
-                    <svg-icon :icon-class="item.type" class="chart-icon"/>
+                    <svg-icon :icon-class="item.type" class="chart-icon" />
                     <span v-if="item.name && item.name.length <= 7" style="margin-left: 6px">{{ item.name }}</span>
                     <el-tooltip v-else class="item" effect="dark" :content="item.name" placement="left">
                       <span style="margin-left: 6px">{{ item.name }}</span>
@@ -107,8 +112,10 @@
                   class="de-checkbox"
                 >
                   <div class="span-div">
-                    <span v-if="item.alias && item.alias.length <= 7"
+                    <span
-                          style="margin-left: 6px">{{ item.alias }}</span>
+                      v-if="item.alias && item.alias.length <= 7"
+                      style="margin-left: 6px"
+                    >{{ item.alias }}</span>
                     <el-tooltip v-else class="item" effect="dark" :content="item.alias" placement="left">
                       <span style="margin-left: 6px">{{ item.alias }}</span>
                     </el-tooltip>
@@ -164,9 +171,9 @@ export default {
       parametersVisible: false,
       timePopovervisible: false,
       accuracyOptions: [
-        {id: 'HH', name: 'HH'},
+        { id: 'HH', name: 'HH' },
-        {id: 'HH:mm', name: 'HH:mm'},
+        { id: 'HH:mm', name: 'HH:mm' },
-        {id: 'HH:mm:ss', name: 'HH:mm:ss'}
+        { id: 'HH:mm:ss', name: 'HH:mm:ss' }
 
       ]
 
@@ -179,61 +186,44 @@ export default {
     if ('timeYearWidget,timeMonthWidget,timeDateWidget,textSelectWidget,numberSelectWidget'.indexOf(this.widget.name) !== -1) {
       this.showParams = true
     }
-}
+  },
-,
+  methods: {
-methods: {
+    multipleChange(value) {
-  multipleChange(value)
-  {
       this.fillAttrs2Filter()
-  }
+    },
-,
+    showTimeChange(value) {
-  showTimeChange(value)
-  {
       this.attrs.accuracy = this.accuracyOptions[1].id
       this.attrs.default.isDynamic = false
       this.fillAttrs2Filter()
-  }
+    },
-,
+    checkedViewsChange(values) {
-  checkedViewsChange(values)
-  {
       this.fillAttrs2Filter()
-  }
+    },
-,
+    enableRangeChange(value) {
-  enableRangeChange(value)
-  {
       if (!value) {
         this.attrs.viewIds = []
       }
       this.fillAttrs2Filter()
-  }
+    },
-,
+    enableParametersChange(value) {
-  enableParametersChange(value)
-  {
       if (!value) {
         this.attrs.parameters = []
       }
       this.fillAttrs2Filter()
-  }
+    },
-,
+    showTitleChange(value) {
-  showTitleChange(value)
-  {
       if (!value) {
-      this.attrs.title = ''
         this.element.style.backgroundColor = ''
       }
       this.fillAttrs2Filter()
-  }
+    },
-,
+    showVisualChange(value) {
-  showVisualChange(value)
-  {
       this.fillAttrs2Filter()
-  }
+    },
-,
 
-  fillAttrs2Filter()
+    fillAttrs2Filter() {
-  {
+    }
   }
-}
 }
 
 </script>