|
|
@@ -1,57 +1,31 @@
|
|
|
<template>
|
|
|
<div class="sample-content">
|
|
|
<div @click="clickBtn" style="cursor: pointer" ref="cangku">
|
|
|
- <!-- <div>点击视图选择位置</div> -->
|
|
|
- <el-input
|
|
|
- placeholder="请输入内容"
|
|
|
- :value="showValue"
|
|
|
- id="valueDom"
|
|
|
- ></el-input>
|
|
|
+ <el-input placeholder="请输入内容" :value="showValue" id="valueDom"></el-input>
|
|
|
</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>
|
|
|
+ <el-dialog
|
|
|
+ title="仓库可视化"
|
|
|
+ :visible.sync="ifshow"
|
|
|
+ width="100%"
|
|
|
+ append-to-body
|
|
|
+ fullscreen
|
|
|
+ center>
|
|
|
+ <div slot="footer" class="selectArea">
|
|
|
<div class="top-content">
|
|
|
- <div class="top-title">仓库可视化</div>
|
|
|
<div class="query-content">
|
|
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
|
|
<el-form-item label="仓库名称:">
|
|
|
- <el-select
|
|
|
- v-model="formInline.cang_ku_ming_chen_value"
|
|
|
- placeholder="请选择样品"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in cangkuOption"
|
|
|
- :key="index"
|
|
|
- placeholder="区域"
|
|
|
- :label="item.cang_ku_ming_chen"
|
|
|
- :value="item.cang_ku_ming_chen"
|
|
|
- ></el-option>
|
|
|
+ <el-select v-model="formInline.cang_ku_ming_chen_value" placeholder="请选择样品">
|
|
|
+ <el-option v-for="(item, index) in cangkuOption" :key="index" placeholder="区域" :label="item.cang_ku_ming_chen" :value="item.cang_ku_ming_chen"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="margin-left: 50px" label="区域名称:">
|
|
|
- <el-select
|
|
|
- v-model="formInline.qu_yu_value"
|
|
|
- placeholder="请选择区域名称"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in quyu_arr"
|
|
|
- :key="index"
|
|
|
- placeholder="区域"
|
|
|
- :label="item.qu_yu_"
|
|
|
- :value="item.qu_yu_"
|
|
|
- ></el-option>
|
|
|
+ <el-select v-model="formInline.qu_yu_value" placeholder="请选择区域名称">
|
|
|
+ <el-option v-for="(item, index) in quyu_arr" :key="index" placeholder="区域" :label="item.qu_yu_" :value="item.qu_yu_"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <button
|
|
|
- type="button"
|
|
|
- class="el-button el-button--primary el-button--mini"
|
|
|
- @click="onSubmits"
|
|
|
- >
|
|
|
+ <button type="button" class="el-button el-button--primary el-button--mini" @click="onSubmits">
|
|
|
<i class="ibps-icon-search"></i><span>查询</span>
|
|
|
</button>
|
|
|
</el-form-item>
|
|
|
@@ -61,13 +35,7 @@
|
|
|
<div class="test-quyu">
|
|
|
<div class="test-list">
|
|
|
<ul class="list-items">
|
|
|
- <li
|
|
|
- class="list-item quyu-item"
|
|
|
- :style="{background: quyuShow == item.qu_yu_ ? '#FF9900' : '#e5baba',}"
|
|
|
- @click="qu_yu_Event"
|
|
|
- v-for="item in quyu_arr"
|
|
|
- :key="item.qu_yu_"
|
|
|
- >
|
|
|
+ <li class="list-item quyu-item" :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('冰箱')">{{ item.qu_yu_ | freezerFilters }}({{ item.cun_chu_tiao_jian }})</div>
|
|
|
<div v-if="!item.qu_yu_.includes('冰箱')">{{ item.qu_yu_ | freezerFilters }}</div>
|
|
|
</li>
|
|
|
@@ -77,22 +45,12 @@
|
|
|
<div class="body-content">
|
|
|
<div class="right-view">
|
|
|
<div class="goods-items">
|
|
|
- <div
|
|
|
- class="show-demo"
|
|
|
- v-for="(item, index) in listData"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
+ <div class="show-demo" v-for="(item, index) in listData" :key="index">
|
|
|
<div>
|
|
|
<div class="goods-level">
|
|
|
<div class="level-dsc">第{{ index | indexfilter(listData) }}层</div>
|
|
|
<div class="goods-list">
|
|
|
- <div
|
|
|
- v-for="(it, index) in listData[index]"
|
|
|
- :key="index"
|
|
|
- class="goods-dsc"
|
|
|
- :style="{background: !it.wu_liao_bian_ma_ ? '#67c23a' : '',}"
|
|
|
- @click="closeView(it)"
|
|
|
- >
|
|
|
+ <div v-for="(it, index) in listData[index]" :key="index" class="goods-dsc" :style="{background: !it.wu_liao_bian_ma_ ? '#67c23a' : '',}" @click="closeView(it)">
|
|
|
<div class="top-dsc">
|
|
|
<div class="position">
|
|
|
<p>名称:{{ it.wu_pin_ming_chen }}</p>
|
|
|
@@ -116,7 +74,9 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
+
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -127,6 +87,7 @@ export default {
|
|
|
ifshow: false,
|
|
|
showValue: "点击选择位置",
|
|
|
cangkuOption: [],
|
|
|
+ centerDialogVisible: false,
|
|
|
formInline: {
|
|
|
cang_ku_ming_chen_value: "主仓库",
|
|
|
qu_yu_value: "1号冰箱",
|
|
|
@@ -195,33 +156,25 @@ export default {
|
|
|
this.firstLoadQuyu("主仓库");
|
|
|
},
|
|
|
methods: {
|
|
|
- close() {
|
|
|
- this.ifshow = !this.ifshow;
|
|
|
- },
|
|
|
clickBtn() {
|
|
|
this.ifshow = !this.ifshow;
|
|
|
},
|
|
|
closeView(value) {
|
|
|
- let dom = document.getElementById("el-tooltip-2390");
|
|
|
+ let dom = document.getElementById("el-tooltip-2390");
|
|
|
const name = "cunFangWeiZhi"; //其他字段属性
|
|
|
this.$emit("change-data", name, value.cun_fang_wei_zhi_);
|
|
|
const name2 = "cangKuMingCheng"; //其他字段属性
|
|
|
const value2 = this.formInline.cang_ku_ming_chen_value; //字段的值
|
|
|
- // this.showValue = value2;
|
|
|
this.$emit("change-data", name2, value2);
|
|
|
this.ifshow = !this.ifshow;
|
|
|
},
|
|
|
firstLoadQuyu(cang_ku) {
|
|
|
let sqlString = `select DISTINCT subStr(wei_zhi_,1,4) as wei_zhi_,cun_chu_tiao_jian,qu_yu_ from t_ck where cang_ku_ming_chen = '${cang_ku}' order by wei_zhi_ asc`;
|
|
|
-
|
|
|
var this_ = this;
|
|
|
-
|
|
|
curdPost("sql", sqlString).then((response) => {
|
|
|
this_.quyu_arr = response.variables.data;
|
|
|
this_.quyu_arr.forEach((it) => {
|
|
|
- it.wei_zhi_.includes("-")
|
|
|
- ? ""
|
|
|
- : (it.qu_yu_ = it.qu_yu_ + it.wei_zhi_.slice(3, 4));
|
|
|
+ it.wei_zhi_.includes("-") ? "" : (it.qu_yu_ = it.qu_yu_ + it.wei_zhi_.slice(3, 4));
|
|
|
});
|
|
|
if (!this.firstLoadActive) {
|
|
|
this_.formInline.qu_yu_value = "";
|
|
|
@@ -244,12 +197,7 @@ export default {
|
|
|
},
|
|
|
sqlSlice(value, num) {
|
|
|
if (value.includes("冰箱")) {
|
|
|
- if (
|
|
|
- value.includes("T") ||
|
|
|
- value.includes("B") ||
|
|
|
- value.includes("L") ||
|
|
|
- value.includes("R")
|
|
|
- ) {
|
|
|
+ if ( value.includes("T") || value.includes("B") || value.includes("L") || value.includes("R")) {
|
|
|
return "BX" + num + value.slice(4, 5);
|
|
|
} else {
|
|
|
return "BX" + num;
|
|
|
@@ -258,7 +206,7 @@ export default {
|
|
|
return "HJ" + num;
|
|
|
} else if (value.includes("试剂柜")) {
|
|
|
return "SJG" + num;
|
|
|
- }else if(value.includes("液氮罐")){
|
|
|
+ } else if (value.includes("液氮罐")) {
|
|
|
return "YDG" + num;
|
|
|
}
|
|
|
},
|
|
|
@@ -275,13 +223,12 @@ export default {
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
- onSubmits() {
|
|
|
- //头部按钮查询事
|
|
|
+ onSubmits() {//头部按钮查询事
|
|
|
this.desShow = false;
|
|
|
let value = this.formInline.qu_yu_value;
|
|
|
let num = value.split("号")[0];
|
|
|
let type = this.sqlSlice(value, num);
|
|
|
- var sqlString =`select * from t_mjwlgl where cun_fang_wei_zhi_ like ` +"'%" +type +"%'";
|
|
|
+ var sqlString = `select * from t_mjwlgl where cun_fang_wei_zhi_ like ` + "'%" + type + "%'";
|
|
|
this.queryLoad(sqlString, type);
|
|
|
this.formInline.qu_yu_value = value;
|
|
|
this.quyuShow = value;
|
|
|
@@ -292,10 +239,10 @@ export default {
|
|
|
const labelsMap = {}; // map存储
|
|
|
let typeData = [];
|
|
|
var sqltype = "";
|
|
|
- if(py.includes("YDG")){
|
|
|
- sqltype = `select DISTINCT SUBSTR(wei_zhi_,1,9) as wei_zhi_ from t_ck where wei_zhi_ like ` +"'%" +py +"%'" +"ORDER BY wei_zhi_ ASC "; //
|
|
|
- }else{
|
|
|
- sqltype = `select DISTINCT SUBSTR(wei_zhi_,1,6) as wei_zhi_ from t_ck where wei_zhi_ like ` +"'%" +py +"%'" +"ORDER BY wei_zhi_ ASC "; //
|
|
|
+ if (py.includes("YDG")) {
|
|
|
+ sqltype = `select DISTINCT SUBSTR(wei_zhi_,1,9) as wei_zhi_ from t_ck where wei_zhi_ like ` + "'%" + py + "%'" + "ORDER BY wei_zhi_ ASC "; //
|
|
|
+ } else {
|
|
|
+ sqltype = `select DISTINCT SUBSTR(wei_zhi_,1,6) as wei_zhi_ from t_ck where wei_zhi_ like ` + "'%" + py +"%'" + "ORDER BY wei_zhi_ ASC "; //
|
|
|
}
|
|
|
curdPost("sql", sqltype).then((res) => {
|
|
|
typeData = res.variables.data; //查询该位置具有多少层
|
|
|
@@ -347,7 +294,7 @@ export default {
|
|
|
for (var prop in labelsMap) {
|
|
|
if (labelsMap.hasOwnProperty(prop)) {
|
|
|
if (labelsMap[prop].length > 1) {
|
|
|
- var item =[];
|
|
|
+ var item = [];
|
|
|
item.push(labelsMap[prop][0]);
|
|
|
newarr.push(item);
|
|
|
} else {
|
|
|
@@ -359,12 +306,11 @@ export default {
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
- qu_yu_Event(e) {
|
|
|
- //点击区域事件,加载可视化视图
|
|
|
+ qu_yu_Event(e) {//点击区域事件,加载可视化视图
|
|
|
let value = e.target.innerText;
|
|
|
let num = value.split("号")[0];
|
|
|
let type = this.sqlSlice(value, num);
|
|
|
- var sqlString =`select * from t_mjwlgl where cun_fang_wei_zhi_ like ` +"'%" + type +"%'";
|
|
|
+ var sqlString = `select * from t_mjwlgl where cun_fang_wei_zhi_ like ` + "'%" + type + "%'";
|
|
|
this.queryLoad(sqlString, type);
|
|
|
this.formInline.qu_yu_value = value;
|
|
|
this.quyuShow = value;
|
|
|
@@ -398,10 +344,9 @@ p {
|
|
|
.selectArea {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
- overflow: scroll;
|
|
|
- position: fixed;
|
|
|
- top: 0px;
|
|
|
- left: 0px;
|
|
|
+ // position: fixed;
|
|
|
+ // top: 0px;
|
|
|
+ // left: 0px;
|
|
|
background: white;
|
|
|
z-index: 2147483647 !important;
|
|
|
}
|
|
|
@@ -422,17 +367,10 @@ p {
|
|
|
color: #ffffff;
|
|
|
}
|
|
|
}
|
|
|
-.sample-content {
|
|
|
+.el-dialog__footer {
|
|
|
width: 100%;
|
|
|
.top-content {
|
|
|
width: 100%;
|
|
|
- .top-title {
|
|
|
- text-align: center;
|
|
|
- font-weight: bold;
|
|
|
- width: 100%;
|
|
|
- font-size: 18px;
|
|
|
- line-height: 40px;
|
|
|
- }
|
|
|
.query-content {
|
|
|
display: flex;
|
|
|
margin-left: 25px;
|
|
|
@@ -475,11 +413,6 @@ p {
|
|
|
.body-content {
|
|
|
margin-bottom: 70px;
|
|
|
display: flex;
|
|
|
- // box-sizing: border-box;
|
|
|
- // height:200px;
|
|
|
- // overflow: scroll;
|
|
|
- overflow-x: hidden;
|
|
|
- overflow-y: scroll;
|
|
|
.black {
|
|
|
position: fixed;
|
|
|
top: 300px;
|
|
|
@@ -502,7 +435,6 @@ p {
|
|
|
.goods-items {
|
|
|
width: 100%;
|
|
|
overflow-x: hidden;
|
|
|
- border: solid 2px rgb(202, 236, 247);
|
|
|
display: flex;
|
|
|
flex-direction: column-reverse;
|
|
|
.show-demo {
|
|
|
@@ -537,24 +469,13 @@ p {
|
|
|
box-sizing: border-box;
|
|
|
.top-dsc {
|
|
|
display: flex;
|
|
|
- // justify-content: space-between;
|
|
|
- // font-size: 12px;
|
|
|
- // height: 18px;
|
|
|
- // line-height: 18px;
|
|
|
.position > p {
|
|
|
text-align: left;
|
|
|
height: 18px;
|
|
|
line-height: 18px;
|
|
|
- // display: inline-block;
|
|
|
- // height: 18px;
|
|
|
- // line-height: 18px;
|
|
|
}
|
|
|
.right-content > p {
|
|
|
- // display: inline-block;
|
|
|
margin-left: 15px;
|
|
|
- // text-align: left;
|
|
|
- // height: 18px;
|
|
|
- // line-height: 18px;
|
|
|
}
|
|
|
}
|
|
|
.goods-demo {
|
|
|
@@ -586,8 +507,5 @@ p {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .body-content::-webkit-scrollbar {
|
|
|
- // display: none; /*隐藏滚动条*/
|
|
|
- }
|
|
|
}
|
|
|
</style>
|