折叠要货计划和供应商发货申请的查询区域

src/components/TableHead/src/TableHead.vue

@@ -9,9 +9,10 @@
       </div>
       <div class="tableNavRightBtns">
         <!-- 右侧按钮 -->
-        <slot name="rightBtn"></slot>
+        <slot name="rightBtn_left"></slot>
         <ButtonBase :Butttondata="buttonsRight" @button-base-click="buttonBaseClick" @updata-table-columns="updataTableColumns"
     :allSchemas="allSchemas" :detailAllSchemas="detailAllSchemas" ref="rowDropRef"/>
+    <slot name="rightBtn_right"></slot>
       </div>
     </div>
     <slot></slot>

src/views/wms/purchasereceiptManage/supplierdeliver/purchasePlanMain/index.vue

@@ -1,19 +1,30 @@
 <template>
-  <ContentWrap>
+  <ContentWrap v-if="visibleSearch">
     <!-- 搜索工作栏 -->
-    <Search ref="seachRef" :schema="[...PurchasePlanMain.allSchemas.searchSchema,...PurchasePlanDetail.allSchemas.searchSchema]" @search="searchList" @reset="searchList" @searchTableSuccess="searchQueryTableSuccess" @onChange="onSearchChange"/>
+    <Search ref="seachRef" :schema="[...PurchasePlanMain.allSchemas.searchSchema,...PurchasePlanDetail.allSchemas.searchSchema]" @search="searchList" @reset="searchList" @searchTableSuccess="searchQueryTableSuccess" @onChange="onSearchChange" @foldUpClick="foldUpClick"/>
   </ContentWrap>
 
   <!-- 列表头部 -->
   <TableHead :HeadButttondata="HeadButttondata" @button-base-click="buttonBaseClick" :routeName="routeName"
     @updataTableColumns="updataTableColumns" @searchFormClick="searchFormClick"
     :allSchemas="PurchasePlanMain.allSchemas" :detailAllSchemas="PurchasePlanDetail.allSchemas">
-    <template #rightBtn>
+    <template #rightBtn_left>
       <div style="display:flex;justify-content: center;align-items: center">
         <span>计划数量包含0</span>
         <el-switch v-model="isZero" style="margin:0 5px" @change="zeroChange"/>
       </div>
     </template>
+    <template #rightBtn_right>
+      <el-tooltip
+        effect="dark"
+        content="查询条件"
+        placement="top-start"
+      >
+      <el-button @click="foldUpClick ">
+            <Icon :icon="visibleSearch ? 'ep:arrow-up' : 'ep:arrow-down'" />
+          </el-button>
+      </el-tooltip>
+    </template>
   </TableHead>
 
   <!-- 列表 -->
@@ -146,7 +157,25 @@
       formRef.setValues(setV)
     })
   }
-
+  // 为了折叠
+  const visibleSearch = ref(false)
+  const updateTable = ref(true)
+  const foldUpClick = ()=>{
+    visibleSearch.value = !visibleSearch.value
+    // let tableList = tableObject.tableList
+    // tableObject.tableList = []
+    // updateTable.value = !updateTable.value
+    tableObject.loading = true
+    let timer = setTimeout(() => {
+      tableObject.loading = false
+      // tableObject.tableList = tableList
+      // updateTable.value = !updateTable.value
+      if(timer){
+        clearTimeout(timer)
+        timer = null
+      }
+    }, 500);
+  }
   // 查询页面返回
   const searchTableSuccess = (formField, searchField, val, formRef, type, row) => {
     console.log('searchTableSuccess', formField, searchField, val, formRef, type, row)

src/views/wms/purchasereceiptManage/supplierdeliver/supplierdeliverRequestMain/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <ContentWrap>
+  <ContentWrap v-if="visibleSearch">
     <!-- 搜索工作栏 -->
     <Search
       :schema="[
@@ -20,7 +20,19 @@
     @searchFormClick="searchFormClick"
     :allSchemas="SupplierdeliverRequestMain.allSchemas"
     :detailAllSchemas="SupplierdeliverRequestDetail.allSchemas"
-  />
+  >
+  <template #rightBtn_right>
+      <el-tooltip
+        effect="dark"
+        content="查询条件"
+        placement="top-start"
+      >
+      <el-button @click="foldUpClick ">
+            <Icon :icon="visibleSearch ? 'ep:arrow-up' : 'ep:arrow-down'" />
+          </el-button>
+      </el-tooltip>
+    </template>
+  </TableHead>
 
   <!-- 列表 -->
   <ContentWrap>
@@ -391,6 +403,19 @@ const searchTableSuccessLabel = (formField, searchField, val, formRef, type, row
     }
   })
 }
+// 为了折叠
+const visibleSearch = ref(false)
+const foldUpClick = ()=>{
+  visibleSearch.value = !visibleSearch.value
+  tableObject.loading = true
+  let timer = setTimeout(() => {
+    tableObject.loading = false
+    if(timer){
+      clearTimeout(timer)
+      timer = null
+    }
+  }, 500);
+}
 
 const { tableObject, tableMethods } = useTable({
   getListApi: SupplierdeliverRequestDetailApi.getSupplierdeliverRequestDetailPage // 分页接口