fix:物料可视化增加条件查询

src/views/warehouse/cangku.vue

@@ -24,6 +24,7 @@
               <el-select
                 v-model="formInline.qu_yu_value"
                 placeholder="请选择区域名称"
+                clearable 
               >
                 <el-option
                   v-for="(item, index) in quyu_arr"
@@ -31,9 +32,26 @@
                   placeholder="区域"
                   :label="item.qu_yu_"
                   :value="item.qu_yu_"
+                  
                 ></el-option>
               </el-select>
             </el-form-item>
+            <span style="margin:0 14px;line-height: 32px;font-size: 12px;color: #606266;">物料名称</span>
+            <div style="display:inline-block;width:250px">
+              <el-input
+              placeholder="请输入内容"
+              v-model="wlmc"
+              clearable>
+              </el-input>
+            </div>
+            <span style="margin:0 14px;line-height: 32px;font-size: 12px;color: #606266;">物料代码</span>
+            <div style="display:inline-block;width:250px">
+              <el-input
+              placeholder="请输入内容"
+              v-model="wlbm"
+              clearable>
+              </el-input>
+            </div>
             <el-form-item>
               <button
                 type="button"
@@ -79,34 +97,21 @@
             >
               <div>
                 <div class="goods-level">
-                  <div class="level-dsc" @click="closeView(listData[index])">
-                    <!-- 第{{ index | indexfilter(listData) }}层 -->
-                    第{{ index }}层
-                  </div>
-                  <div @click="closeView(listData[index])" class="goods-list">
+                  <div class="level-dsc" v-if="index.length ==1" > 第{{ index }}层</div>
+                  <div class="level-dsc" v-else>{{ index|ChineseFilter }}</div>
+                  <div  class="goods-list" :style="{margin:index.length ==1?'0px 0px 20px 0px':'0 0 20px 0px'}">
                     <div
                       v-for="(it, index) in listData[index]"
                       :key="index"
-                      class="goods-dsc"
-                      :style="{
-                        background: it.wu_liao_bian_ma_ ? '' : '#67c23a',
-                      }"
+                      class="goods-dsc" :style="{ background: it.wu_liao_bian_ma_ ? '' : '#67c23a'}"
                     >
                       <div class="top-dsc">
                         <div class="position">
                           <div style="display:flex;justify-content: flex-start;text-align: left;">
                             <span> 名称：</span>
-                            <p style="width: 80px">
-                              
-                              {{ it.wu_liao_ming_chen || 空 }}
-                            </p>
+                            <p style="width: 80px">{{ it.wu_liao_ming_chen || '空' }}</p>
                           </div>
-
-                          <p>
-                            编码：{{
-                              it.wu_liao_bian_ma_ || it.wu_liao_bian_ma_
-                            }}
-                          </p>
+                          <p>编码：{{ it.wu_liao_bian_ma_ || it.wu_liao_bian_ma_ }} </p>
                           <p>位置：{{ it.wei_zhi_ || it.cun_fang_wei_zhi_ }}</p>
                           <p>货号:{{ it.huo_hao_ || "空" }}</p>
                         </div>
@@ -167,6 +172,8 @@ export default {
       loading: false,
       pagination: {},
       secondshow: false,
+      wlmc:'',
+      wlbm:'',
     };
   },
   filters: {
@@ -189,6 +196,27 @@ export default {
         return value;
       }
     },
+    ChineseFilter(value){
+      let str
+      if(value.includes("BX")){
+        str = value.replace("BX",'冰箱');
+        return str;
+      }else if(value.includes("SJG")){
+        str = value.replace("SJG",'试剂柜');
+        return str;
+      }else if(value.includes("HJ")){
+        str = value.replace("HJ",'货架')
+        return str;
+      }else if(value.includes("WHPG")){
+        str = value.replace("WHPG",'危化品柜');
+        return str;
+      }
+      // else if(value.includes("BX")){
+      //   value.replace("BX",'')
+      // }else if(value.includes("BX")){
+      //   value.replace("BX",'')
+      // }
+    },
     specimenFilters: function (value) {
       if (value == "" || value == undefined) {
         return "未占用";
@@ -266,18 +294,68 @@ export default {
       // debugger;
       //头部按钮查询事
       // var sqlString = `select * from t_mjwlgl where cang_ku_ming_chen = '${this.formInline.cang_ku_ming_chen_value}' and qu_yu_ = '${this.formInline.qu_yu_value}'`;
-      let py = this.formInline.qu_yu_value.split("号")[1].replace(/^\s*/g, "");
-      let num = this.formInline.qu_yu_value.split("号")[0];
-      let quyu = this.sqlSlice(py);
-      let type = (quyu + num).replace(/^\s*/g, "");
-      var sqlString =
-        "select * from t_mjwlgl where cang_ku_ming_chen = '" +
-        this.formInline.cang_ku_ming_chen_value +
-        "' and cun_fang_wei_zhi_ like " +
-        "'%" +
-        type +
-        "%'";
-      this.queryLoad(sqlString, type);
+      if(this.formInline.qu_yu_value){
+        let py = this.formInline.qu_yu_value.split("号")[1].replace(/^\s*/g, "");
+        let num = this.formInline.qu_yu_value.split("号")[0];
+        let quyu = this.sqlSlice(py);
+        let type = (quyu + num).replace(/^\s*/g, "");
+        var sqlString ="select * from t_mjwlgl where cang_ku_ming_chen = '" +this.formInline.cang_ku_ming_chen_value +"' and cun_fang_wei_zhi_ like " +"'%" +type +"%'";
+        this.queryLoad(sqlString, type);
+     }
+     if(this.wlbm ||this.wlmc){
+      let wheresql = ` WHERE wu_liao_ming_chen ='${this.wlmc||''}' AND wu_liao_bian_ma_='${this.wlbm||''}'`
+      if(!this.wlmc){
+        wheresql = wheresql.replace("wu_liao_ming_chen ='' AND",'');
+      }
+      if(!this.wlbm){
+        wheresql = wheresql.replace("AND wu_liao_bian_ma_=''",'');
+      }
+      
+      var sqlShuju ="select * from t_mjwlgl" + wheresql;
+      let sqlWeizhi = "select DISTINCT cun_fang_wei_zhi_ from t_mjwlgl" + wheresql;
+      console.log(sqlShuju,sqlWeizhi)
+        this.queryLoadmc(sqlShuju,sqlWeizhi);
+     }
+    },
+   async queryLoadmc(sqlShuju,sqlWeizhi){
+      let this_ = this;
+      let datas;
+      let typeArr ={};
+      await curdPost("sql", sqlShuju).then((res) => {
+        datas = res.variables.data;
+      })
+      await curdPost("sql", sqlWeizhi).then((res) => {
+        console.log(res)
+        let typeData = res.variables.data;
+        typeData.forEach((item) => {
+            typeArr[item.cun_fang_wei_zhi_] = [];
+            if(typeArr.length == 0){
+                this.$message({
+                message: '警告哦，这是一条警告消息',
+                type: 'warning'
+              });
+              return;
+            }
+            if (datas.length == 0) {//没有物料信息             
+              typeArr[item.cun_fang_wei_zhi_].push(item);
+            } else {
+              datas.forEach((it, index) => {
+                if (item.cun_fang_wei_zhi_ == it.cun_fang_wei_zhi_) {
+                  typeArr[item.cun_fang_wei_zhi_].push(it);
+                } else if (
+                  item.cun_fang_wei_zhi_ != it.cun_fang_wei_zhi_ &&
+                  index == datas.length - 1
+                ) {
+                  if (!typeArr[item.cun_fang_wei_zhi_].length) {
+                    typeArr[item.cun_fang_wei_zhi_].push(item);
+                  }
+                }
+              });
+            }
+          });
+      })
+      this_.listData = typeArr;
+      console.log(typeArr,"查询数据")
     },
     queryLoad(sql, py) {
       let this_ = this;
@@ -286,38 +364,22 @@ export default {
       const labelsMap = {}; // map存储
       let typeData = [];
       let typeArr = [];
-      var sqltype =
-        `select DISTINCT wei_zhi_ from t_ck where wei_zhi_ like ` +
-        "'%" +
-        py +
-        "%'" +
-        " and cang_ku_ming_chen ='" +
-        this.formInline.cang_ku_ming_chen_value +
-        "' ORDER BY wei_zhi_ ASC ";
+      var sqltype =`select DISTINCT wei_zhi_ from t_ck where wei_zhi_ like ` + "'%" + py + "%'" +" and cang_ku_ming_chen ='" + this.formInline.cang_ku_ming_chen_value + "' ORDER BY wei_zhi_ ASC ";
       let weiSlice = "SUBSTR(wei_zhi_, 1, 6)";
       if (py.includes("WHPG")) {
         weiSlice = "SUBSTR(wei_zhi_, 1, 7)";
       }
-      let classSql =
-        `select DISTINCT ${weiSlice} AS wei_zhi_  from t_ck where wei_zhi_ like ` +
-        "'%" +
-        py +
-        "%'" +
-        " and cang_ku_ming_chen ='" +
-        this.formInline.cang_ku_ming_chen_value +
-        "' ORDER BY wei_zhi_ ASC ";
+      let classSql =`select DISTINCT ${weiSlice} AS wei_zhi_  from t_ck where wei_zhi_ like ` +"'%" + py + "%'" +" and cang_ku_ming_chen ='" +this.formInline.cang_ku_ming_chen_value + "' ORDER BY wei_zhi_ ASC ";
       curdPost("sql", sqltype).then((res) => {
         typeData = res.variables.data; //查询具体仓库某个货架的所有位置
         curdPost("sql", sql).then((res) => {
           datas = res.variables.data; //具体仓库某个货架的所有物料数据
           typeData.forEach((item) => {
             typeArr[item.wei_zhi_] = [];
-            if (datas.length == 0) {
-              //没有物料信息
+            if (datas.length == 0) { //没有物料信息         
               typeArr[item.wei_zhi_].push(item);
             } else {
               datas.forEach((it, index) => {
-                console.log(item.wei_zhi_, it.cun_fang_wei_zhi_);
                 if (item.wei_zhi_ == it.cun_fang_wei_zhi_) {
                   typeArr[item.wei_zhi_].push(it);
                 } else if (
@@ -331,7 +393,6 @@ export default {
               });
             }
           });
-          console.log(typeArr);
           curdPost("sql", classSql).then((res2) => {
             let resData = res2.variables.data;
             resData.forEach((item) => {