fix:物料选择位置

src/views/component/weiZhiChangGui.vue

@@ -1,14 +1,13 @@
 <template>
   <div class="sample-content">
-    <!-- 表格組件 -->
-    <!-- <div @dblclick="clickBtn">{{ showValue }}</div> -->
     <div @click="clickBtn" style="cursor: pointer;" >
       <div >点击视图选择位置</div>
-      <!-- <input placeholder="请输入内容" :value="showValue"  id="valueDom" @click="onChange"> -->
     </div>
-    <!-- <el-input></el-input> -->
-    <div class="selectArea" v-show="ifshow">
-      <div @click="close" class="close-content"> <i class="el-icon-close"></i><el-button class="closeBtn">关闭视图</el-button></div>
+    <div class="selectArea" v-if="ifshow">
+      <div @click="close" class="close-content"> 
+        <i class="el-icon-close"></i>
+        <el-button class="closeBtn">关闭视图</el-button>
+      </div>
       <div class="top-content">
         <div class="top-title">库存可视化</div>
         <div class="query-content">
@@ -58,18 +57,16 @@
           <ul class="list-items">
             <li
               class="list-item quyu-item"
-              :style="{
-                background: quyuShow == item.qu_yu_ ? '#FF9900' : '#e5baba',
-              }"
+              :style="{background: quyuShow == item.qu_yu_ ? '#FF9900' : '#e5baba'}"
               @click="qu_yu_Event"
               v-for="item in quyu_arr"
               :key="item.qu_yu_"
             >
-              <div v-if="item.qu_yu_.includes('冰箱')">
+              <div v-show="item.qu_yu_.includes('冰箱')">
                 {{ item.qu_yu_ | freezerFilters }}({{ item.cun_chu_tiao_jian }})
               </div>
 
-              <div v-if="!item.qu_yu_.includes('冰箱')">
+              <div v-show="!item.qu_yu_.includes('冰箱')">
                 {{ item.qu_yu_ | freezerFilters }}
               </div>
             </li>
@@ -84,7 +81,7 @@
               v-for="(item, index) in listData"
               :key="index"
             >
-              <div v-loading="loading">
+              <div>
                 <div class="goods-level">
                   <div class="level-dsc">
                     第{{ index }}层
@@ -99,12 +96,16 @@
                     >
                       <div class="top-dsc">
                         <div class="position">
-                          <div style="text-align: left;"><div style="width:38px;display: inline-block;vertical-align: top;">名称：</div><span style="width: 115px; display: inline-block; white-space: break-spaces;text-align: left;">{{ it.wu_liao_ming_chen || '空' }} </span></div>
+                          <div style="text-align: left;">
+                            <div style="width:38px;display: inline-block;vertical-align: top;">名称：</div>
+                            <span style="width: 115px; display: inline-block; white-space: break-spaces;text-align: left;">{{ it.wu_liao_ming_chen || '空' }} </span>
+                          </div>
                           <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 style="text-align: left;"><div style="width:38px;display: inline-block;vertical-align: top;">货号:</div><span style="width: 115px; display: inline-block; white-space: break-spaces;text-align: left;">{{ it.huo_hao_ || "空" }} </span></div>
-
+                          <div style="text-align: left;">
+                            <div style="width:38px;display: inline-block;vertical-align: top;">货号:</div>
+                            <span style="width: 115px; display: inline-block; white-space: break-spaces;text-align: left;">{{ it.huo_hao_ || "空" }} </span>
+                          </div>
                         </div>
                         <div class="right-content">
                           <p>入库批号:{{ it.ru_ku_pi_hao_ || "空" }}</p>
@@ -112,11 +113,7 @@
                           <p>有效期:{{ it.you_xiao_qi_ || "空" }}</p>
                           <p>库存量：{{ it.ku_cun_liang_ || "空" }}</p>
                         </div>
-                        <!-- <div class="condition">{{ it.cun_chu_tiao_jian }}</div> -->
                       </div>
-                      <!-- <div class="bottom-dsc">
-                        {{ it.wu_pin_ming_cheng | specimenFilters }} 
-                      </div> -->
                     </div>
                   </div>
                 </div>
@@ -160,13 +157,11 @@ export default {
       selectActive: "",
       cenghao: [],
       warehouse: [],
-      loading: false,
       pagination: {},
       secondshow: false,
       ifshow: false,
       showValue: "",
       value:"",
-      loading:true
     };
   },
   props: {
@@ -181,13 +176,6 @@ export default {
       type:Boolean,
       default: false
     },
-    // component_12u7eoo:{
-    //   type:String,
-    //   default(){
-    //     return 111
-    //   }
-    // }
-    
   },
   filters: {
     indexfilter: function (value, data) {
@@ -272,15 +260,15 @@ export default {
       const name2 = "biaoZhunZhi"; //其他字段属性
       const value2= this.formInline.cang_ku_ming_chen_value; //字段的值
       this.$emit("change-data", name2, value2);
-      this.ifshow = !this.ifshow;
+      this.ifshow = false;
     },
     close() {
-      this.ifshow = !this.ifshow;
+      this.ifshow = false;
     },
-    firstLoadQuyu(cang_ku) {
+    async firstLoadQuyu(cang_ku) {
       let sqlString = `select distinct qu_yu_,cun_chu_tiao_jian from t_ck where cang_ku_ming_chen = '${cang_ku}' order by qu_yu_ asc`;
       var this_ = this;
-      curdPost("sql", sqlString).then((response) => {
+      await curdPost("sql", sqlString).then((response) => {
         this_.quyu_arr = response.variables.data;
         if (!this.firstLoadActive) {
           this_.formInline.qu_yu_value = "";
@@ -294,11 +282,7 @@ export default {
       this.selectActive = 1;
       this.firstLoadActive = true;
       this.quyuShow = "1号试剂柜";
-      var sqlString =
-        "select * from t_mjwlgl where cang_ku_ming_chen = '试剂库1'  and cun_fang_wei_zhi_ like" +
-        "'%" +
-        "SJG1" +
-        "%'";
+      var sqlString ="select * from t_mjwlgl where cang_ku_ming_chen = '试剂库1'  and cun_fang_wei_zhi_ like" +"'%" +"SJG1" +"%'";
       this.queryLoad(sqlString, "SJG1");
     },
     sqlSlice(value) {
@@ -315,11 +299,11 @@ export default {
           "";
       }
     },
-    loadQueryData() {
+    async loadQueryData() {
       //查询选择仓库数据查询
       var sqlString = "select distinct cang_ku_ming_chen from t_ck ";
       var this_ = this;
-      curdPost("sql", sqlString).then((response) => {
+      await curdPost("sql", sqlString).then((response) => {
         this_.cangkuOption = response.variables.data;
         this_.cangkuOption.forEach((item, index) => {
           if (!item) {
@@ -332,32 +316,28 @@ export default {
       this.desShow = false;
       //头部按钮查询事
       // 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 qu_yu_value = this.formInline.qu_yu_value
+      let py = qu_yu_value.split("号")[1].replace(/^\s*/g, "");
+      let num = 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 +
-        "%'";
+      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);
     },
-    queryLoad(sql, py) {
-      //数据加载
+    async queryLoad(sql, py) {//数据加载   
       let this_ = this;
       var datas = [];
       this.cenghao = [];
       const labelsMap = {}; // map存储
       let typeData = [];
       let typeArr = [];
+      this_.listData = [];
       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 classSql = `select DISTINCT SUBSTR(wei_zhi_,1,6) 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) => {
+      await  curdPost("sql", sqltype).then((res) => {
         typeData = res.variables.data; //查询具体仓库某个货架的所有位置
-        curdPost("sql", sql).then((res) => {
+      });
+      await curdPost("sql", sql).then((res) => {
           datas = res.variables.data; //具体仓库某个货架的所有物料数据
           typeData.forEach((item) => {
             typeArr[item.wei_zhi_] = [];
@@ -376,7 +356,8 @@ export default {
               });
             }
           });
-          curdPost("sql", classSql).then((res2) => {
+        });
+      await curdPost("sql", classSql).then((res2) => {
             let resData = res2.variables.data;
             resData.forEach((item) => {
               let layer = item.wei_zhi_;
@@ -391,13 +372,8 @@ export default {
               }
             });
             this_.listData = labelsMap;
-            console.log(this.listData)
-            if(this_.listData[1].length >0){
-              this_.loading = false;
-            }
+            console.log(this_.listData)
           });
-        });
-      });
     },
     qu_yu_Event(e) {
       //点击区域事件，加载可视化视
@@ -411,7 +387,6 @@ export default {
       let quyu = this.sqlSlice(py);
       let type = (quyu + num).replace(/^\s*/g, "");
       var sqlString =`select * from t_mjwlgl where cun_fang_wei_zhi_ like  ` +"'%" +type +"%'" + "  and cang_ku_ming_chen = '" + this.formInline.cang_ku_ming_chen_value +"'";
-      // console.log(sqlString, type);
       this.queryLoad(sqlString, type);
       this.formInline.qu_yu_value = value;
       this.quyuShow = value;
@@ -423,12 +398,12 @@ export default {
       this.loadQueryData();
       this.firstLoadViewData();
       this.firstLoadQuyu("试剂库1");
-      this.ifshow = !this.ifshow;
+      this.ifshow = true;
     },
   },
   watch: {
     //监控仓库名称变化 触发第一次加载数据
-    "formInline.cang_ku_ming_chen_value": async function (newdata) {
+    "formInline.cang_ku_ming_chen_value": function (newdata) {
       this.firstLoadQuyu(newdata);
     },
     "formInline.qu_yu_value": function (newdata) {
@@ -436,9 +411,6 @@ export default {
       this.quyuShow = newdata;
       this.firstLoadActive = false;
     },
-    // formData(val) {
-    //   // console.log(val, "watching");
-    // },
   },
 };
 </script>