Bläddra i källkod

编辑器- 弹窗添加搜索功能

xiebeibei 4 år sedan
förälder
incheckning
ab761a770c
2 ändrade filer med 64 tillägg och 2 borttagningar
  1. 63 1
      src/components/edit/edit-dialog.vue
  2. 1 1
      vue.config.js

+ 63 - 1
src/components/edit/edit-dialog.vue

@@ -53,8 +53,11 @@
 
                     </div>
                 </div>
-                <div class="tree">
+                <div class="tree" >
+                    <a-spin :spinning="spinning">
+                    <a-input-search placeholder="请输入关键字" v-if="majorId||sysId" style="width: 235px;margin: 10px 10px;"  v-model="selectVal"  @search="onSearchTree" />
                     <Tree @change="getTreeId" :data="treeData"/>
+                    </a-spin>
                 </div>
                 <div class="checkbox">
                     <a-table :pagination="false" :row-key='typeEdit=="Zone"?"location":"assetnum"'
@@ -113,6 +116,7 @@
         },
         data() {
             return {
+                spinning:false,
                 loading: false,
                 visible: false,
                 model: 'test1',
@@ -181,6 +185,8 @@
                 arrList: [],
                 selectList: [],
                 typeEdit: '',
+                selectVal:'',
+                sysId:''
             }
         },
         watch: {
@@ -188,6 +194,17 @@
                 if (val == '') {
                     this.queryGlsmsasset();
                 }
+            },
+            selectVal(val){
+                if(val==''){
+                    if(this.sysId!=''){
+                        this.getQuerySmsxtBy(this.sysId, this.typeEdit)
+                    }else{
+                        this.getQuerySmsxtBy(this.majorId,'Image')
+                    }
+
+                }
+
             }
         },
         methods: {
@@ -245,8 +262,10 @@
             },
             handleChange(val) {
                 console.log(val);
+                this.selectVal='';
                 this.tableData = [];
                 this.typeEdit = val.type;
+                this.sysId = val.id;
                 this.getQuerySmsxtBy(val.id, val.type)
             },
             handleMajor(val) {
@@ -260,6 +279,39 @@
                 console.log(e)
             },
             //获取treeId --classstructureid
+            onSearchTree(val){
+                let arr = [];
+                const reg = new RegExp(val, 'g')
+              if(this.typeEdit=='Zone'){
+                  this.treeData.map((item)=>{
+                      if(item.name.indexOf(val)!=-1){
+                          item.name=item.name.replace(reg, `<span style="color:#F96600">${val}</span>`);
+                          arr.push(item)
+                      }
+
+                  });
+
+              }
+                if(this.typeEdit=='Image'){
+                    this.treeData.map(item=>{
+                        if(item.name.indexOf(val)!=-1){
+                            item.name=item.name.replace(reg, `<span style="color:#F96600">${val}</span>`);
+                            arr.push(item)
+                        }else{
+                            item.children.map(item1=>{
+                                if(item1.name.indexOf(val)!=-1){
+                                    item.open=true;
+                                    item1.name=item1.name.replace(reg, `<span style="color:#F96600">${val}</span>`);
+                                    arr.push(item)
+                                }
+                            })
+                        }
+
+                    })
+
+                }
+                this.treeData = arr;
+            },
             getTreeId(id) {
                 if (this.typeEdit == 'Image') {
                     this.classstructureid = id.id;
@@ -430,11 +482,14 @@
             },
             // 获取设备大类下的分类和位置大类下的分类
             getQuerySmsxtBy(smsxt, type) {
+
                 if (type == 'Image') {
                     const data = {
                         smsxt: smsxt
                     }
+                    this.spinning = true
                     getQuerySmsxtBy(data, {}).then(res => {
+                        this.spinning = false;
                         if (res.result == 'success') {
                             if (res.data) {
                                 const data = res.data;
@@ -475,12 +530,16 @@
                         } else {
                             this.$message.error('获取失败');
                         }
+                    }).catch(()=>{
+                        this.spinning = false;
                     })
                 } else if (type == 'Zone') {
                     const data = {
                         dl: smsxt
                     }
+                    this.spinning = true
                     queryWzflByDl(data, {}).then(res => {
+                        this.spinning = false;
                         if (res.result == 'success') {
                             if (res.data) {
                                 const data = res.data;
@@ -498,6 +557,8 @@
                         } else {
                             this.$message.error('获取失败');
                         }
+                    }).catch(()=>{
+                        this.spinning = false;
                     })
                 }
 
@@ -508,6 +569,7 @@
             //如果有专业就带过来
             console.log(this.getmajorId);
             if (this.getmajorId) {
+                this.typeEdit = 'Image';
                 this.getQuerySmsxtBy(this.getmajorId, 'Image')
             }
             if (this.attrCards.length) {

+ 1 - 1
vue.config.js

@@ -26,7 +26,7 @@ module.exports = {
             },
             '/data': {
                 // target: 'http://192.168.200.87:9003',
-                target: 'http://60.205.177.43:9903', //阿里云
+                target: 'http://60.205.177.43', //阿里云
                 changeOrigin: true,
                 secure: false,
                 pathRewrite: {