综合库存添加等级与品名筛选条件

zkqy-ui/src/views/orderMange/comprehensiveInventory/index.vue

@@ -24,22 +24,63 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+      <el-form-item label="等级" prop="levels">
+        <el-select
+          v-model="queryParams.levels"
+          placeholder="请选择等级"
+          clearable
+          filterable
+          @keyup.enter.native="handleQuery"
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="item in dropDownData.level"
+            :key="item.id"
+            :label="item.codeName"
+            :value="item.codeName"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="品名" prop="productId">
+        <el-select
+          v-model="queryParams.productId"
+          placeholder="请选择等级"
+          clearable
+          filterable
+          @keyup.enter.native="handleQuery"
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="item in allProductionOptions"
+            :key="item.id"
+            :label="item.productName"
+            :value="item.id"
+          >
+            <span class="discribe" style="float: left">{{
+              item.productName
+            }}</span>
+            <span style="float: right; color: #8492a6; font-size: 13px">{{
+              item.productSpecifications
+            }}</span>
+          </el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-button
           type="primary"
           icon="el-icon-search"
           size="mini"
           @click="handleQuery"
-        >搜索
+          >搜索
         </el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
-        >重置
+          >重置
         </el-button>
       </el-form-item>
     </el-form>
 
     <el-row :gutter="10" class="mb8">
-
       <right-toolbar
         :showSearch.sync="showSearch"
         @queryTable="getList"
@@ -48,23 +89,30 @@
 
     <el-table v-loading="loading" :data="comprehensiveInventoryList">
       <el-table-column label="品名" align="center" prop="productName" />
-      <el-table-column label="规格" align="center" prop="productSpecifications"/>
-      <el-table-column label="类型" align="center" prop="productType"/>
+      <el-table-column
+        label="规格"
+        align="center"
+        prop="productSpecifications"
+      />
+      <el-table-column label="类型" align="center" prop="productType" />
       <el-table-column label="色泽" align="center" prop="productColor" />
       <el-table-column label="等级" align="center" prop="levels" />
       <el-table-column label="箱数" align="center" prop="totalBoxNum" />
       <el-table-column label="筒数" align="center" prop="totalCanisterNum" />
       <el-table-column label="重量" align="center" prop="totalSuttle" />
 
-      <el-table-column label="批号" align="left" prop="lotNum" >
+      <el-table-column label="批号" align="left" prop="lotNum">
         <template slot-scope="scope">
-          <el-tooltip class="item" effect="dark" :content="scope.row.lotNum" placement="top">
+          <el-tooltip
+            class="item"
+            effect="dark"
+            :content="scope.row.lotNum"
+            placement="top"
+          >
             <span class="cell-content">{{ scope.row.lotNum }}</span>
           </el-tooltip>
         </template>
       </el-table-column>
-
-
     </el-table>
 
     <pagination
@@ -74,22 +122,26 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
-
-
   </div>
 </template>
 
 <script>
-import {
-  comprehensiveInventoryList,
-} from "@/api/system/ProductInventory";
+import { comprehensiveInventoryList } from "@/api/system/ProductInventory";
 import { getDictLabel } from "@/utils/other";
+import { getOptionLsit } from "@/api/codeListManage/productCodeList";
+import {
+  queryDropDownBoxData,
+  getSaleOrderProductionList,
+} from "@/api/dragform/form";
 
 export default {
   name: "ProductWarehousingRecord",
   // dicts: ["packaging_type"],
   data() {
     return {
+      productionOptions: [],
+      allProductionOptions: [],
+      dropDownData: {}, //等级下拉框数据
       // 遮罩层
       loading: true,
       // 选中数组
@@ -136,7 +188,7 @@ export default {
         warehouseregionId: null,
         warehousingTime: null,
         depositor: null,
-        productColor:null,
+        productColor: null,
       },
       // 表单参数
       form: {},
@@ -146,8 +198,41 @@ export default {
   },
   created() {
     this.getList();
+    this.getSelectOptions();
+    this.getSaleOrderProductionList();
   },
   methods: {
+    // 获取所有产品数据
+    async getSaleOrderProductionList() {
+      try {
+        let proRes = await getSaleOrderProductionList();
+        if (proRes.code == 200) {
+          console.log(proRes.data);
+          // let { production, customer } = proRes.data.resultMap;
+          this.allProductionOptions = proRes.data || [];
+          this.productionOptions =
+            this.allProductionOptions.slice(0, 500) || [];
+        } else {
+          throw Error("获取下拉框数据失败");
+        }
+      } catch (error) {
+        console.log(error);
+      }
+    },
+
+    // 获取下拉数据
+    async getSelectOptions() {
+      try {
+        let res = await getOptionLsit();
+        if (res.code == 200) {
+          this.dropDownData = res.data;
+        } else {
+          this.$message.error("网络异常!");
+        }
+      } catch (error) {
+        console.log(error);
+      }
+    },
     // 根据字典值获取字典描述
     getDictLabel(value, dicts) {
       return getDictLabel(value, dicts);