askbot-dragon 1.0.18 → 1.0.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "askbot-dragon",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",

package/src/components/tree.vue

@@ -4,11 +4,19 @@
       <span class="cacel" @click="cancelBtn">取消</span>
       <span class="primary" @click="saveData">确认</span>
     </div>
+    <div class="tree-input" v-if="setCascadeOption && setCascadeOption.length > 0">
+      <el-input
+          placeholder="请搜索"
+          v-model="filterText"
+      >
+      </el-input>
+    </div>
     <div class="tree-container">
       <el-tree :data="setCascadeOption"
                :props="defaultProps"
                ref="dataTree"
                node-key="value"
+               :filter-node-method="filterNode"
       >
        <span class="custom-tree-node" slot-scope="{ node,data}">
         <span class="tree-label">{{ node.label }}</span>
@@ -39,7 +47,8 @@ export default {
       checked:'',
       // dataTree:[],
       checkList:[],
-      checkDatas:[]
+      checkDatas:[],
+      filterText:""
     }
   },
   props:["dataOptions","fieldValue"],
@@ -89,6 +98,16 @@ export default {
       }
       return list
     },
+    filterNode(value, data, node) {
+      if (!value) return true;
+      let upperCase = value.toUpperCase()
+      let lowerCase = value.toLowerCase()
+      let serchFlag = false
+      if (node.parent && Object.prototype.toString.call(node.parent.data) == '[object Object]') {
+        serchFlag = node.parent.data.label.indexOf(value) !== -1 || node.parent.data.label.indexOf(upperCase) !== -1 || node.parent.data.label.indexOf(lowerCase) !== -1
+      }
+      return data.label.indexOf(value) !== -1 || data.label.indexOf(upperCase) !== -1 || data.label.indexOf(lowerCase) !== -1 || serchFlag;
+    },
   },
   computed: {
     dataTree() {
@@ -167,6 +186,11 @@ export default {
       return arr
     },
   },
+  watch:{
+    filterText(val) {
+      this.$refs.dataTree.filter(val);
+    }
+  }
   // mounted() {
   //   if (this.dataOptions.extInfo.cascadeDown.options){
   //     debugger
@@ -199,7 +223,7 @@ export default {
     margin: 0 20px;
     width: calc(100% - 40px);
     /*font-size: 14px;*/
-    padding-bottom: 30px;
+    padding-bottom: 20px;
     .primary{
       color: #366aff;
       cursor: pointer;
@@ -209,6 +233,10 @@ export default {
       cursor: pointer;
     }
   }
+  .tree-input{
+    width: calc(100% - 20px);
+    margin: 0 10px 10px 10px;
+  }
   .tree-container{
     height:260px;
     overflow-y: scroll;