wbs动态库修改

src/views/manager/wbsinfo.vue

@@ -1,5 +1,66 @@
 <template>
   <basic-container>
+        <div class="search-box">
+        <div class="search-box-left">
+            <el-input v-model="query.wbsName" placeholder="请输入名称" style="width: 200px;" class="filter-item"   size="small"/>
+            <el-select v-model="query.projectId" placeholder="项目名称" clearable style="width: 200px" class="filter-item"   size="small">
+              <el-option v-for="item in projectList" :key="item.id" :label="item.projectAlias" :value="item.id" />
+            </el-select>
+            <el-select v-model="query.wbsType" placeholder="划分类型" clearable style="width: 200px" class="filter-item"   size="small">
+              <el-option v-for="item in tabTypeList"  :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
+            </el-select>
+           
+            <el-button type="primary" @click="searchClick" class="custom-primary-btn"   size="small">搜索</el-button>
+            <el-button type="info" @click="clearSearch"   size="small">清空</el-button>
+        </div>
+        <div class="header-box-right">
+           <el-button
+            type="primary"
+            size="small"
+            icon="el-icon-plus"
+            plain
+        
+            @click="handleAdd"
+          >新增
+          </el-button>
+                <el-button
+            type="warning"
+            size="small"
+            icon="el-icon-sort"
+            plain
+      
+            @click="handleSort"
+          >排序
+          </el-button>
+              <el-button
+            type="danger"
+            size="small"
+            icon="el-icon-delete"
+            plain
+            v-if="permission.wbsinfo_delete"
+            @click="handleDelete"
+          >删 除
+          </el-button>
+          <!-- 新增元素按钮 -->
+          <el-button
+            size="small"
+            style="background-color:#FFA042;color:white;font-weight:bold"
+            plain
+            v-if="permission.wbsinfo_delete"
+            @click="handleElement"
+          >元素库
+          </el-button>
+          <el-button
+            size="small"
+            style="background-color:#2550A2;color:white;font-weight:bold"
+            plain
+            v-if="permission.wbsinfo_delete"
+            @click="handleParameter"
+          >参数库
+          </el-button>
+        </div>
+      
+    </div>
     <avue-crud
       :option="option"
       :table-loading="loading"
@@ -33,50 +94,7 @@
         </el-select>
   </template>
       <template slot="menuRight">
-          <el-button
-          type="primary"
-          size="small"
-          icon="el-icon-plus"
-          plain
-      
-          @click="handleAdd"
-        >新增
-        </el-button>
-               <el-button
-          type="warning"
-          size="small"
-          icon="el-icon-sort"
-          plain
-     
-          @click="handleSort"
-        >排序
-        </el-button>
-            <el-button
-          type="danger"
-          size="small"
-          icon="el-icon-delete"
-          plain
-          v-if="permission.wbsinfo_delete"
-          @click="handleDelete"
-        >删 除
-        </el-button>
-        <!-- 新增元素按钮 -->
-        <el-button
-          size="small"
-          style="background-color:#FFA042;color:white;font-weight:bold"
-          plain
-          v-if="permission.wbsinfo_delete"
-          @click="handleElement"
-        >元素库
-        </el-button>
-        <el-button
-          size="small"
-          style="background-color:#2550A2;color:white;font-weight:bold"
-          plain
-          v-if="permission.wbsinfo_delete"
-          @click="handleParameter"
-        >参数库
-        </el-button>
+         
       </template>
       <template
         slot-scope="{row,index}"
@@ -177,6 +195,7 @@ export default {
         searchShowBtn: false,
         columnBtn: false,
         dialogClickModal: false,
+          searchShow: false,
         column: [
           {
             label: "创建时间",
@@ -268,12 +287,13 @@ export default {
        sortProLoad:false,
        wbsList:[],
        sortWbsList:[],
-       projectList:[]
+       projectList:[],
+       tabTypeList:[],
 
     };
   },
   created () {
-  
+    this.getTabTypeList()
     this.getWbsList()
     this.getProjectList()
   },
@@ -333,6 +353,15 @@ export default {
     });
      return tagItems;
   },
+     getTabTypeList(){
+           let code = "wbs_type";
+            getDictionary({
+                code,
+            }).then((res) => {
+                    this.tabTypeList = res.data.data;
+            });
+
+    },
       //点击元素库
     handleElement(){
       console.log('元素库');
@@ -495,8 +524,6 @@ export default {
 
     },
     saveSort(ids){
-     
-        
         sortWbs(ids).then((res) => {
                     this.sortProLoad= false;
                     if(res.data.code==200){
@@ -510,6 +537,13 @@ export default {
       
 
 
+    },
+    searchClick(){ 
+      this.onLoad(this.page,this.query);
+    },
+    clearSearch(){
+      this.query = {};
+      this.onLoad(this.page,this.searchParams);
     }
   }
 };
@@ -518,11 +552,14 @@ export default {
 <style scoped lang="scss">
 .search-box{
   display: flex;
+  justify-content: space-between;
   .search-item{
     margin-right: 10px;
     margin-left: 10px;
   }
  
 }
-
+.filter-item{
+  margin-right: 10px;
+}
 </style>