diff --git a/frontend/src/components/ElTreeSelect/index.vue b/frontend/src/components/ElTreeSelect/index.vue
index 7dea1fd05c..ac3ad6d816 100644
--- a/frontend/src/components/ElTreeSelect/index.vue
+++ b/frontend/src/components/ElTreeSelect/index.vue
@@ -14,6 +14,7 @@
       v-model="labels"
       v-popover:popover
       :style="styles"
+      :collapse-tags="showNumber"
       class="el-tree-select-input"
       :disabled="disabled"
       popper-class="select-option"
@@ -77,7 +78,9 @@ export default {
       type: Object,
       // {}
       default() {
-        return {}
+        return {
+          width: '100%'
+        }
       }
     },
     // 下拉框 挂类
@@ -119,8 +122,10 @@ export default {
       }
     },
     // 树渲染方法，具体参考el-tree Function(h, { node, data, store }) {}
+    // eslint-disable-next-line vue/require-default-prop
     treeRenderFun: Function,
     // 搜索过滤方法，具体参考el-tree Function(h, { value, data, node }) {}
+    // eslint-disable-next-line vue/require-default-prop
     filterNodeMethod: Function,
     /*
         文本框参数，几乎支持el-select所有的API<br>
@@ -215,7 +220,8 @@ export default {
       ids: [], // 存储id
       visible: false, // popover v-model
       width: 150,
-      showParent: false
+      showParent: false,
+      showNumber: false
     }
   },
   computed: {
@@ -241,6 +247,9 @@ export default {
           this.ids = val === '' ? [] : [val]
         }
       }
+    },
+    labels: function() {
+      this.setShowNumber()
     }
   },
   created() {
@@ -549,6 +558,22 @@ export default {
          */
     filterFun(val) {
       this.$refs.tree.filter(val)
+    },
+
+    setShowNumber() {
+      this.showNumber = false
+
+      this.$nextTick(() => {
+        if (!this.selectParams.multiple || !this.$refs.select || !this.$refs.select.$refs.tags) {
+          return
+        }
+        const kids = this.$refs.select.$refs.tags.children[0].children
+        let contentWidth = 0
+        kids.forEach(kid => {
+          contentWidth += kid.offsetWidth
+        })
+        this.showNumber = contentWidth > ((this.$refs.select.$refs.tags.clientWidth - 35) * 0.9)
+      })
     }
   }
 }
diff --git a/frontend/src/components/dataease/DeOutWidget.vue b/frontend/src/components/dataease/DeOutWidget.vue
index 16e7c3b21a..cf053feefc 100644
--- a/frontend/src/components/dataease/DeOutWidget.vue
+++ b/frontend/src/components/dataease/DeOutWidget.vue
@@ -13,7 +13,6 @@
       <div
         ref="deContentContainer"
         class="condition-content"
-        :style="titleStyle"
         :class="element.options.attrs.title ? '' : 'condition-content-default'"
       >
         <div class="condition-content-container">
@@ -174,6 +173,7 @@ export default {
   .condition-content {
     overflow: auto hidden;
     letter-spacing: 0px !important;
+    width: 100%;
   }
   .condition-content-container {
     position: relative;
diff --git a/frontend/src/components/widget/DeWidget/DeSelectTree.vue b/frontend/src/components/widget/DeWidget/DeSelectTree.vue
index 0c73552eda..f9a879600b 100644
--- a/frontend/src/components/widget/DeWidget/DeSelectTree.vue
+++ b/frontend/src/components/widget/DeWidget/DeSelectTree.vue
@@ -5,7 +5,6 @@
     ref="deSelectTree"
     v-model="value"
     popover-class="test-class-wrap"
-    :is-single="isSingle"
     :data="datas"
     :select-params="selectParams"
     :tree-params="treeParams"
@@ -45,9 +44,8 @@ export default {
   },
   data() {
     return {
-      showNumber: false,
-      selectOptionWidth: 0,
       show: true,
+      selectOptionWidth: 0,
       datas: [],
       value: this.isSingle ? '' : [],
       selectParams: {
@@ -135,14 +133,17 @@ export default {
     },
     'element.options.attrs.multiple': function(value, old) {
       if (typeof old === 'undefined' || value === old) return
+
       if (!this.inDraw) {
         this.value = value ? [] : null
         this.element.options.value = ''
       }
-
       this.show = false
       this.$nextTick(() => {
         this.show = true
+        this.$nextTick(() => {
+          this.$refs.deSelectTree && this.$refs.deSelectTree.treeDataUpdateFun(this.datas)
+        })
       })
     }
 
@@ -212,25 +213,14 @@ export default {
         this.element.options.manualModify = true
       }
       this.setCondition()
-      this.showNumber = false
-
-      this.$nextTick(() => {
-        if (!this.element.options.attrs.multiple || !this.$refs.deSelect || !this.$refs.deSelect.$refs.tags) {
-          return
-        }
-        const kids = this.$refs.deSelect.$refs.tags.children[0].children
-        let contentWidth = 0
-        kids.forEach(kid => {
-          contentWidth += kid.offsetWidth
-        })
-        this.showNumber = contentWidth > ((this.$refs.deSelectTree.$refs.tags.clientWidth - 30) * 0.9)
-      })
     },
 
     setCondition() {
+      const val = this.formatFilterValue()
+
       const param = {
         component: this.element,
-        value: this.formatFilterValue(),
+        value: val,
         operator: this.operator,
         isTree: true
       }
@@ -267,7 +257,8 @@ export default {
         return results
         // return this.value
       }
-      return this.value.split(',')
+      const result = this.value.split(',').map(v => v.replaceAll(SEPARATOR, ','))
+      return result
     },
 
     fillValueDerfault() {
@@ -286,14 +277,6 @@ export default {
       return datas.filter(item => !!item)
     },
 
-    setOptionWidth(event) {
-      // 下拉框弹出时，设置弹框的宽度
-      this.$nextTick(() => {
-        // this.selectOptionWidth = event.srcElement.offsetWidth + 'px'
-        this.selectOptionWidth = event.srcElement.parentElement.parentElement.offsetWidth + 'px'
-      })
-    },
-
     /* 下面是树的渲染方法 */
 
     _filterFun(value, data, node) {
@@ -308,9 +291,9 @@ export default {
     _searchFun(value) {
       console.log(value, '<--_searchFun')
       // 自行判断 是走后台查询，还是前端过滤
-      this.$refs.treeSelect.filterFun(value)
+      this.$refs.deSelectTree.filterFun(value)
       // 后台查询
-      // this.$refs.treeSelect.treeDataUpdateFun(treeData);
+      // this.$refs.deSelectTree.treeDataUpdateFun(treeData);
     },
     // 自定义render
     _renderFun(h, { node, data, store }) {
diff --git a/frontend/src/components/widget/serviceImpl/TextSelectTreeServiceImpl.js b/frontend/src/components/widget/serviceImpl/TextSelectTreeServiceImpl.js
index 9180883558..23674de94f 100644
--- a/frontend/src/components/widget/serviceImpl/TextSelectTreeServiceImpl.js
+++ b/frontend/src/components/widget/serviceImpl/TextSelectTreeServiceImpl.js
@@ -88,7 +88,11 @@ class TextSelectTreeServiceImpl extends WidgetService {
     const param = {
       component: element,
       value: !value ? [] : Array.isArray(value) ? value : value.toString().split(','),
-      operator: element.options.attrs.multiple ? 'in' : 'eq'
+      operator: element.options.attrs.multiple ? 'in' : 'eq',
+      isTree: true
+    }
+    if (param.value && param.value.length) {
+      param.value = param.value.map(val => val.replaceAll('-de-', ','))
     }
     return param
   }
diff --git a/frontend/src/utils/conditionUtil.js b/frontend/src/utils/conditionUtil.js
index 4416b25f4c..27ba99e879 100644
--- a/frontend/src/utils/conditionUtil.js
+++ b/frontend/src/utils/conditionUtil.js
@@ -27,8 +27,19 @@ export const valueValid = condition => {
 
 export const formatCondition = obj => {
   const { component, value, operator, isTree } = obj
-  const fieldId = component.options.attrs.fieldId
+
+  let fieldId = component.options.attrs.fieldId
   const viewIds = component.options.attrs.viewIds
+  if (isTree && !component.options.attrs.multiple && value && value.length) {
+    // 单选树
+    const val = value[0]
+    if (val) {
+      const len = val.split(',').length
+      if (len) {
+        fieldId = fieldId.split(',').slice(0, len).join(',')
+      }
+    }
+  }
   const condition = new Condition(component.id, fieldId, operator, value, viewIds, isTree)
   return condition
 }
diff --git a/frontend/src/views/chart/chart/util.js b/frontend/src/views/chart/chart/util.js
index 45621bf8bb..be28d2bf41 100644
--- a/frontend/src/views/chart/chart/util.js
+++ b/frontend/src/views/chart/chart/util.js
@@ -1191,27 +1191,27 @@ export const TYPE_CONFIGS = [
         'tableItemBgColor',
         'tableFontColor',
         'alpha'
+      ],
+      'size-selector': [
+        'tablePageMode',
+        'tablePageSize',
+        'tableTitleFontSize',
+        'tableItemFontSize',
+        'tableTitleHeight',
+        'tableItemHeight',
+        'tableColumnMode'
+      ],
+      'title-selector': [
+        'show',
+        'title',
+        'fontSize',
+        'color',
+        'hPosition',
+        'vPosition',
+        'isItalic',
+        'isBolder'
       ]
-    },
-    'size-selector': [
-      'tablePageMode',
-      'tablePageSize',
-      'tableTitleFontSize',
-      'tableItemFontSize',
-      'tableTitleHeight',
-      'tableItemHeight',
-      'tableColumnMode'
-    ],
-    'title-selector': [
-      'show',
-      'title',
-      'fontSize',
-      'color',
-      'hPosition',
-      'vPosition',
-      'isItalic',
-      'isBolder'
-    ]
+    }
   },
 
   {
diff --git a/frontend/src/views/system/test/MyTree.vue b/frontend/src/views/system/test/MyTree.vue
deleted file mode 100644
index 12ae1d25dc..0000000000
--- a/frontend/src/views/system/test/MyTree.vue
+++ /dev/null
@@ -1,150 +0,0 @@
-<!--
- * @Author: dawdler
- * @Date: 2020-12-26 11:52:05
- * @Description: demo
- * @LastModifiedBy: dawdler
--->
-<template>
-  <el-tree-select
-    ref="treeSelect"
-    v-model="values"
-    popover-class="test-class-wrap"
-    :styles="styles"
-    :select-params="selectParams"
-    :tree-params="treeParams"
-    :filter-node-method="_filterFun"
-    :tree-render-fun="_renderFun"
-    @searchFun="_searchFun"
-  />
-</template>
-<script>
-import ElTreeSelect from '@/components/ElTreeSelect'
-export default {
-  name: 'MyTreeSelect',
-  components: { ElTreeSelect },
-  props: {
-    params: Object,
-    isSingle: {
-      type: Boolean,
-      default() {
-        return false
-      }
-    }
-  },
-  data() {
-    return {
-      styles: {
-        width: '300px'
-      },
-      // 单选value为字符串，多选为数组
-      values: this.isSingle ? '' : [],
-      selectParams: {
-        clearable: true,
-        placeholder: '请输入内容'
-      },
-      treeParams: {
-        clickParent: false,
-        filterable: true,
-        // 只想要子节点，不需要父节点
-        leafOnly: false,
-        includeHalfChecked: false,
-        'check-strictly': false,
-        'default-expand-all': true,
-        'expand-on-click-node': false,
-        'render-content': this._renderFun,
-        data: [],
-        props: {
-          children: 'children',
-          label: 'name',
-          rootId: '0',
-          disabled: 'disabled',
-          parentId: 'parentId',
-          value: 'id'
-        },
-        ...this.params
-      }
-    }
-  },
-  watch: {},
-  created() {},
-  mounted() {
-    // 手动更新树数据
-    const data = []
-    const { label, children, parentId, value, rootId } = this.treeParams.props
-    for (let i = 0; i < 5; i++) {
-      const rootNode = {
-        [label]: `节点${i}`,
-        [parentId]: rootId,
-        [value]: i,
-        [children]: []
-      }
-      for (let a = 0; a < 5; a++) {
-        const subId = `${rootNode[value]}_${a}`
-        const subNode = {
-          [label]: `子节点${subId}`,
-          [parentId]: rootNode[value],
-          [value]: subId,
-          [children]: []
-        }
-        for (let b = 0; b < 5; b++) {
-          const endId = `${subId}_${b}`
-          const endNode = {
-            [label]: `末级节点${endId}`,
-            [parentId]: subNode[value],
-            [value]: endId,
-            [children]: []
-          }
-          subNode[children].push(endNode)
-        }
-        rootNode[children].push(subNode)
-      }
-      data.push(rootNode)
-    }
-    const myNode = {
-      [label]: '测试超长节点啊啊啊测试超长节点啊啊啊测试超长节点啊啊啊测试超长节点啊啊啊测试超长节点啊啊啊测试超长节点啊啊啊',
-      [parentId]: rootId,
-      [value]: 1000,
-      [children]: []
-    }
-    data.push(myNode)
-    this.$nextTick(() => {
-      this.$refs.treeSelect.treeDataUpdateFun(data)
-    })
-  },
-  methods: {
-    _filterFun(value, data, node) {
-      if (!value) return true
-      return data.id.toString().indexOf(value.toString()) !== -1
-    },
-    // 树点击
-    _nodeClickFun(data, node, vm) {
-      console.log('this _nodeClickFun', this.values, data, node)
-    },
-    // 树过滤
-    _searchFun(value) {
-      console.log(value, '<--_searchFun')
-      // 自行判断 是走后台查询，还是前端过滤
-      this.$refs.treeSelect.filterFun(value)
-      // 后台查询
-      // this.$refs.treeSelect.treeDataUpdateFun(treeData);
-    },
-    // 自定义render
-    _renderFun(h, { node, data, store }) {
-      const { props, clickParent } = this.treeParams
-      return (
-        <span class={['custom-tree-node', !clickParent && data[props.children] && data[props.children].length ? 'disabled' : null]}>
-          <span>{node.label}</span>
-        </span>
-      )
-    }
-  }
-}
-</script>
-<style lang="less">
-.disabled {
-    cursor: no-drop;
-}
-.custom-tree-node {
-    width: calc(100% - 40px);
-}
-</style>
diff --git a/frontend/src/views/system/test/index.vue b/frontend/src/views/system/test/index.vue
deleted file mode 100644
index 0e6f81a882..0000000000
--- a/frontend/src/views/system/test/index.vue
+++ /dev/null
@@ -1,69 +0,0 @@
-<!--
- * @moduleName: 测试el-tree-select
- * @Author: dawdler
- * @Date: 2018-12-19 14:03:03
- * @LastModifiedBy: dawdler
- -->
-<template>
-  <div id="app111">
-    <el-form label-width="120px">
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="单选">
-            <MyTree :is-single="true" :params="{ clickParent: true, showParent: true }" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="多选">
-            <MyTree :params="{ clickParent: true, showParent: true }" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="弹框关闭调试">
-            <el-select v-model="test" multiple placeholder="请选择" @change="_selectChange">
-              <el-option v-for="item in testData" :key="item" :label="item" :value="item" />
-            </el-select>
-            <div>
-              测试焦点触发
-              <svg>
-                <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
-              </svg>
-            </div>
-          </el-form-item>
-        </el-col>
-      </el-row>
-    </el-form>
-  </div>
-</template>
-<script>
-import MyTree from './MyTree'
-export default {
-  name: 'App111',
-
-  components: { MyTree },
-  data() {
-    return {
-      test: '',
-      testData: ['test1', 'test2']
-    }
-  },
-  created() {},
-  mounted() {},
-  methods: {
-    // 下拉框修改
-    _selectChange(val) {
-      console.log(val, '<-select change')
-    }
-  }
-}
-</script>
-<style lang="less">
-#app111 {
-    display: flex;
-    justify-content: space-between;
-    width: 100%;
-}
-.el-select {
-    width: 300px;
-}
-</style>