[CODE]: 出入库条件筛选

src/views/reportManagement/Statistics/index.vue

@@ -2,41 +2,14 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
       <el-form-item label="仓库" prop="fwarehouseid">
-        <el-select
-          v-model="queryParams.fWarehouseid"
-          filterable
-          remote
-          clearable
-          size="small"
-          :remote-method="warehouseRemoteMethod"
-          @keyup.enter.native="handleQuery"
-          placeholder="请选择仓库"
-        >
-          <el-option
-            v-for="(dict, index) in warehouseOptions"
-            :key="index.fId"
-            :label="dict.fName"
-            :value="dict.fId"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="库区" prop="fWarehouseLocationid">
-        <el-select
-          v-model="queryParams.fWarehouseLocationid"
-          filterable
-          remote
-          size="small"
-          :remote-method="kqhouseRemoteMethod"
-          placeholder="请选择库区"
-        >
-          <el-option
-            v-for="(dict, index) in kqhouseOptions"
-            :key="index.fId"
-            :label="dict.fName"
-            :value="dict.fId"
-          ></el-option>
-        </el-select>
+        <treeselect style="width:160px"
+                    v-model="queryParams.fWarehouseid"
+                    :options="fWarehouseidOption"
+                    @select="treeseLect"
+                    :show-count="true"
+                    placeholder="请选择归属库区" />
       </el-form-item>
+
       <el-form-item label="货物名称" prop="fgoodsid">
         <el-select
           v-model="queryParams.fGoodsid"
@@ -56,16 +29,18 @@
           ></el-option>
         </el-select>
       </el-form-item>
-      <el-form-item label="入库日期" prop="createTime">
+      <el-form-item label="业务日期" prop="timeInterval">
         <el-date-picker
           v-model="queryParams.timeInterval"
           type="daterange"
           value-format="yyyy-MM-dd"
           clearable
+          style="width: 60%"
           range-separator="至"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
-          @keyup.enter.native="handleQuery">
+          @keyup.enter.native="handleQuery"
+        >
         </el-date-picker>
       </el-form-item>
       <el-form-item label="贸易方式" prop="fTrademodeid">
@@ -303,17 +278,22 @@
 
 <script>
 import { listWhgenleg, getWhgenleg, delWhgenleg, addWhgenleg, updateWhgenleg, exportWhgenleg , } from "@/api/reportManagement/Statistics";
-import {listWarehouse} from "@/api/basicdata/warehouse";
+import {listWarehouse, treeselect} from "@/api/basicdata/warehouse";
 import {listArea} from "@/api/basicdata/area";
 import {listGoods} from "@/api/basicdata/goods";
 import {listCorps} from "@/api/basicdata/corps";
+import Treeselect from '@riophae/vue-treeselect'
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
 export default {
   name: "Whgenleg",
   components: {
+    Treeselect
   },
   data() {
     return {
+      //仓库树状下拉
+      fWarehouseidOption:[],
       options:[{
         name:'出库',
         key:'SJCK'
@@ -384,8 +364,20 @@ export default {
     this.getDicts("data_trademodes").then((response) => {
       this.fTrademodeidOptions = response.data;
     });
+    treeselect().then(response => {
+      this.fWarehouseidOption = response.data
+    })
   },
   methods: {
+    treeseLect(tree){
+      this.queryParams.fWarehouseid = tree.id
+    },
+    getTreeselect() {
+      treeselect().then(response => {
+        this.warehousesOptions = response.data;
+      });
+    },
+
     // 贸易方式(数据字典),对���t_trademodels 字典翻译
     fTrademodeidFormat(row, column) {
       return this.selectDictLabel(this.fTrademodeidOptions, row.fTrademodeid);