全局公式增加搜索功能

src/views/formula/edit1.vue

@@ -69,18 +69,16 @@
           <el-col :span="8" class="h-100p">
             <el-card shadow="never" v-loading="treeLoad" class="h-100p ov-auto">
               <div style="overflow: auto;flex:1;max-height:500px">
-                <!-- <el-tree
-                  class="filter-tree"
-                  lazy
-                  :load="loadNode"
-                  @node-click="getNodeDetail"
-                  :props="defaultProps"
-                  :expand-on-click-node="false"
-                  highlight-current
-                  node-key="id"
-                  ref="tree"
-                >
-                </el-tree> -->
+                  <div class="flex">
+                      <el-input
+                        size="small"
+                        placeholder="输入关键字搜索"
+                        clearable
+                        @clear="allTreeShow = false"
+                        v-model="filterText">
+                      </el-input>
+                      <el-button size="small" class="mg-l-10" @click="treeFilter">搜索</el-button>
+                    </div>
                 <el-tree
                  style="display: inline-block;min-width: 100%;"
                   class="filter-tree"
@@ -94,9 +92,23 @@
                   ref="tree"
                  lazy
                   :load="loadNode"
+                   v-show="!allTreeShow"
                 
                 > 
                 </el-tree>
+                 <el-tree
+                  style="width: 100%"
+                  ref="treeall"
+                  v-loading="treeloading"
+                  :data="allTreeData"
+                  :props="defaultProps"
+                  @node-click="getNodeDetail"
+                  node-key="id"
+                  :expand-on-click-node="false"
+                  :filter-node-method="filterNode"
+                  v-show="allTreeShow"
+                >
+                </el-tree>
               </div>
             </el-card>
           </el-col>
@@ -160,7 +172,7 @@
         </el-row>
         <div class="text-align-c">
           <el-button size="small" @click="operationHandle" type="primary">保存</el-button>
-          <el-button size="small" @click="operationVisible = false">取消</el-button>
+          <el-button size="small" @click="canceloperationVisible ">取消</el-button>
         </div>
       </div>
     </div>
@@ -205,9 +217,18 @@
               <div class=" flex-d-c"  style="width:40%">
                 <component ref="dynamiccomponent" v-bind:is="componentMap[item.name]" :formulainfo="item" :curele="equationSelectEle" :formulamap="formulaMap" @uncheck="unCheckEleComp" class="flex1"></component>
                 <div class="flex1" v-show="item.showSelectEle" style="margin-top:10px;margin-bottom:30px">
+                  <div class="flex">
+                      <el-input
+                        size="small"
+                        placeholder="输入关键字搜索"
+                        clearable
+                        @clear="clearfiltertext"
+                        v-model="filterText">
+                      </el-input>
+                      <el-button size="small" class="mg-l-10" @click="treeFilter">搜索</el-button>
+                    </div>
                   <el-scrollbar style="height: 520px">
                     <el-tree
-                   
                       class="filter-tree"
                       :data="treeData"
                       :default-expanded-keys="defaultExpanded"
@@ -219,8 +240,22 @@
                       ref="tree"
                       lazy
                       :load="loadNode"
+                       v-show="!allTreeShow"
                     >
                     </el-tree>
+                    <el-tree
+                        style="width: 100%"
+                        ref="treeall"
+                        v-loading="treeloading"
+                        :data="allTreeData"
+                        :props="defaultProps"
+                        @node-click="getNodeDetailComp"
+                        node-key="id"
+                        :expand-on-click-node="false"
+                        :filter-node-method="filterNode"
+                        v-show="allTreeShow"
+                      >
+                      </el-tree>
                   </el-scrollbar>
                 </div>
               </div>
@@ -255,6 +290,16 @@
         <div class=" flex-d-c"  style="width:40%">
           <deviation-range ref="deviationrange" :formulainfo="deviationRange" :formulamap="formulaMap" @uncheck="unCheckEleComp" class="flex1"></deviation-range>
           <div class="flex1" v-show="deviationRange.showSelectEle" style="margin-top:10px;margin-bottom:30px">
+             <div class="flex">
+                      <el-input
+                        size="small"
+                        placeholder="输入关键字搜索"
+                        clearable
+                        @clear="clearfiltertext"
+                        v-model="filterText">
+                      </el-input>
+                      <el-button size="small" class="mg-l-10" @click="treeFilter">搜索</el-button>
+                </div>
             <el-scrollbar style="height: 520px">
               <el-tree
                 class="filter-tree"
@@ -268,8 +313,22 @@
                 ref="tree"
                 lazy
                 :load="loadNode"
+                v-show="!allTreeShow"
               >
               </el-tree>
+                 <el-tree
+                  style="width: 100%"
+                  ref="treeall"
+                  v-loading="treeloading"
+                  :data="allTreeData"
+                  :props="defaultProps"
+                  @node-click="getNodeDetailComp"
+                  node-key="id"
+                  :expand-on-click-node="false"
+                  :filter-node-method="filterNode"
+                  v-show="allTreeShow"
+                >
+                </el-tree>
             </el-scrollbar>
           </div>
         </div>
@@ -314,6 +373,16 @@
         <el-row :gutter="20">
           <el-col :span="8">
             <el-card shadow="never">
+                  <div class="flex">
+                      <el-input
+                        size="small"
+                        placeholder="输入关键字搜索表单"
+                        clearable
+                        @clear="clearfiltertext"
+                        v-model="filterText">
+                      </el-input>
+                      <el-button size="small" class="mg-l-10" @click="treeFilter">搜索</el-button>
+                    </div>
               <el-scrollbar style="height: 460px">
                 <el-tree
                   class="filter-tree"
@@ -327,7 +396,20 @@
                   ref="tree"
                      lazy
                   :load="loadNode"
-                 
+                 v-show="!allTreeShow"
+                >
+                </el-tree>
+                 <el-tree
+                  style="width: 100%"
+                  ref="treeall"
+                  v-loading="treeloading"
+                  :data="allTreeData"
+                  :props="defaultProps"
+                  @node-click="getNodeDetail"
+                  node-key="id"
+                  :expand-on-click-node="false"
+                  :filter-node-method="filterNode"
+                  v-show="allTreeShow"
                 >
                 </el-tree>
               </el-scrollbar>
@@ -466,7 +548,12 @@ export default {
       // eleid: "", //元素id
       // nodeid:'',//所在树节点id
       // pid:'',//项目id 私有树才有
+      filterText:'',//树形控件搜索文字
+      allTreeShow:'',//搜索树显示
       formulaid:'',
+      treeloading:false,//搜索树加载效果
+      allTreeData:[],//过滤树
+      
 
       treeData:[],//树节点
       treeLoad:false,
@@ -660,7 +747,77 @@ export default {
       }
      
     },
+    //搜索树
+    treeFilter() {
+      console.log('搜索');
+      this.eleTableList=[];
+      this.eleList=[];
+      this.eleListComp=[];
+      this.eleTableListComp =[];
+      this.eleTableId='';
+      this.eleTableIdComp=''
+      if (this.filterText&&this.treeId) {
+        this.allTreeShow = true;
+        this.allTreeData=[]
+        if (!this.allTreeData.length) {
+          this.treeloading = true;
+          if(this.globaltype===1&&!this.elementType){
+             let parentId=''
+             if(this.curData.hasChildren){
+               parentId=this.curData.id
+             }else{
+                parentId=this.curData.parentId
+             }
+            
+               tabTypeLazyTreeAll({parentId:parentId,current:1,size:1000,titleName:this.filterText}).then((res) => {
+                  this.treeloading = false;
+                  this.allTreeData = res.data.data.records;
+                    this.$nextTick(() => {
+                      console.log("过滤");
+                      this.$refs.treeall.filter(this.filterText);
+                    });
+              })
+             
+             
+          }else if(this.globaltype===1&&this.elementType){
+             let parentId=''
+             if(this.curData.hasChildren){
+               parentId=this.curData.id
+             }else{
+                parentId=this.curData.parentId
+             }
+             console.log(parentId,'parentId');
+                tabTypeLazyTree({parentId:parentId,projectId:this.projectid,pcurrent:1,size:1000,titleName:this.filterText}).then((res) => {
+                  this.treeloading = false;
+                  this.allTreeData = res.data.data.records;
+                });
+                this.$nextTick(() => {
+                    console.log("过滤");
+                    this.$refs.treeall.filter(this.filterText);
+                });
+          }
+        } else {
+          this.$refs.treeall.filter(this.filterText);
+        }
+      } else {
+        this.$message.warning('请先选择父节点')
+        this.allTreeShow = false;
+      }
+    },
+    clearfiltertext(){
+      this.allTreeShow=false;
+       this.eleTableList=[];
+      this.eleList=[];
+      this.eleListComp=[];
+      this.eleTableListComp =[];
+      this.eleTableId='';
+      this.eleTableIdComp=''
 
+    },
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.title.indexOf(value) !== -1;
+    },
     //获取项目列表
     getProjectList() {
       getProjectList(1, 999).then((res) => {
@@ -989,6 +1146,15 @@ export default {
 
       this.processFormula = JSON.parse(JSON.stringify(this.selectEleFormula));
       this.operationVisible = false;
+      this.allTreeShow=false;
+      this.filterText=''
+    },
+
+    canceloperationVisible(){
+      this.operationVisible=false;
+      this.allTreeShow=false;
+      this.filterText=''
+      console.log('取消');
     },
 
     //点选等式中的元素
@@ -1098,6 +1264,11 @@ export default {
     showChooseEle(argumenObj){
       this.argumenObj = argumenObj;
       this.chooseEleVisible = true;
+      this.eleList=[];
+      this.eleTableList=[];
+      this.eleTableId='';
+      this.allTreeShow=false;
+      this.filterText=''
       
     },
 
@@ -1294,13 +1465,14 @@ export default {
     },
  
     getNodeDetail(data,node){
+      console.log(data,node,'data');
       this.curNode=node;
       this.curData=data;
       this.treeId=data.initTableId;
        this.page.current=1;
       this.page.currentPage=1;
       this.input3=''
-        if(data.hasChildren===false&&node.level==2){
+        if(data.hasChildren===false){
            this.eleListable=true;
            getTableElments(this.treeId ).then((res)=>{
              if(res.data.code==200){
@@ -1361,8 +1533,10 @@ export default {
 
     getNodeDetailComp(data,node) {
        this.treeId=data.initTableId;
+       this.curNode=node;
+      this.curData=data;
        this.input3=''
-        if(data.hasChildren===false&&node.level==2){
+        if(data.hasChildren===false){
            getTableElments(this.treeId ).then((res)=>{
              if(res.data.code==200){
                if(res.data.data.length){

src/views/manager/wbsinfo/element.vue

@@ -752,7 +752,7 @@ export default {
     //关闭公式弹窗
     closeformulaComp(){
       console.log('关闭');
-        getTableElments(this.curEleTable.id).then((res) => {
+        getTableElments(this.curEleTable.initTableId).then((res) => {
 
         this.editEleListFilter = res.data.data;
         this.editEleListAll = [].concat(this.editEleListFilter);
@@ -1194,7 +1194,7 @@ export default {
     handleEditFormula ( row) {
        console.log(row,'row');
       this.curEleTable = row;
-      getTableElments(this.curEleTable.id).then((res) => {
+      getTableElments(this.curEleTable.initTableId).then((res) => {
 
         this.editEleListFilter = res.data.data;
         this.editEleListAll = [].concat(this.editEleListFilter);