|
|
<template>
|
|
|
<div class="check-page">
|
|
|
<a-button type="primary" @click="exportStock" class="export-all">
|
|
|
导出全部巷道
|
|
|
</a-button>
|
|
|
<div class="title-info">
|
|
|
<span class="explain">颜色说明：</span>
|
|
|
<span class="info-text">
|
|
|
<a-tag color="#d81e06" style="width:30px;height:20px;margin-right:6px"></a-tag>
|
|
|
盘点错误
|
|
|
</span>
|
|
|
<span class="info-text">
|
|
|
<a-tag color="#1afa29" style="width:30px;height:20px;margin-right:6px"></a-tag>
|
|
|
盘点正确
|
|
|
</span>
|
|
|
<span class="info-text">
|
|
|
<a-tag color="#bfbfbf" style="width:30px;height:20px;margin-right:6px"></a-tag>
|
|
|
未盘点
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div style="margin-top: 10px">
|
|
|
<a-select :default-value="data[0].name"
|
|
|
@change="handleChange" class="select-roadway">
|
|
|
<a-select-option v-for="i in data" :key="i.name" :value="i.id">
|
|
|
{{i.name}}
|
|
|
</a-select-option>
|
|
|
</a-select>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<!--左货架DOM-->
|
|
|
<div class="center-box">
|
|
|
<span class="shelf-number">
|
|
|
左货架号: {{leftShelveId.shelveId}}
|
|
|
</span>
|
|
|
|
|
|
<a-radio-group v-model="size" style="margin:10px 0" @change="getStockRowColumn"
|
|
|
v-if="streetDetail.leftInsideShelveId && streetDetail.leftOutsideShelveId">
|
|
|
<a-radio-button value="leftOutsideShelveId">
|
|
|
外
|
|
|
</a-radio-button>
|
|
|
<a-radio-button value="leftInsideShelveId">
|
|
|
内
|
|
|
</a-radio-button>
|
|
|
</a-radio-group>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="check-content" v-for="item in data" :key="item.id">
|
|
|
<subsection v-if="item.id == select" :total="{row: item.leftColumn, column: item.leftRow}" :shelveId="leftShelveId.shelveId" :streetId="item.id" :streetName="item.name" type="left" :inOut="leftShelveId.shelveType" >
|
|
|
</subsection>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<!--单伸类型右货架DOM-->
|
|
|
<div class="center-box">
|
|
|
<span class="shelf-number">
|
|
|
右货架号: {{rightShelveId.shelveId}}
|
|
|
</span>
|
|
|
|
|
|
<a-radio-group v-model="size2" style="margin:10px 0" @change="getStockRowColumn"
|
|
|
v-if="streetDetail.rightInsideShelveId && streetDetail.rightOutsideShelveId">
|
|
|
<a-radio-button value="rightOutsideShelveId">
|
|
|
外
|
|
|
</a-radio-button>
|
|
|
<a-radio-button value="rightInsideShelveId">
|
|
|
内
|
|
|
</a-radio-button>
|
|
|
</a-radio-group>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="check-content" v-for="item in data" :key="item.name">
|
|
|
<subsection v-if="item.id == select" :total="{row:item.rightColumn, column: item.rightRow}" :shelveId="rightShelveId.shelveId" :streetId="item.id" :streetName="item.name" type="right" :inOut="rightShelveId.shelveType">
|
|
|
</subsection>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import Subsection from "./Subsection";
|
|
|
export default {
|
|
|
name:'checkManage',
|
|
|
data() {
|
|
|
return {
|
|
|
size: 'leftOutsideShelveId',
|
|
|
size2: 'rightOutsideShelveId',
|
|
|
data: [],
|
|
|
select: '',
|
|
|
streetId: 0,
|
|
|
streetDetail: {},
|
|
|
checkList: [],
|
|
|
stockInfo: {
|
|
|
left: {},
|
|
|
right: {}
|
|
|
},
|
|
|
timer: null,
|
|
|
|
|
|
leftShelveId:{},
|
|
|
rightShelveId:{}
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
|
|
|
},
|
|
|
|
|
|
mounted() {
|
|
|
this.request();
|
|
|
},
|
|
|
created(){
|
|
|
|
|
|
},
|
|
|
// activated() {
|
|
|
// this.request();
|
|
|
// },
|
|
|
// beforeRouteLeave(to, form, next) {
|
|
|
// this.timer && clearInterval(this.timer);
|
|
|
// next();
|
|
|
// },
|
|
|
methods: {
|
|
|
//获取巷道列表
|
|
|
request() {
|
|
|
this.$api.httpApi.getStreetList({
|
|
|
data: {
|
|
|
pageNum: 1,
|
|
|
pageSize: 50,
|
|
|
}
|
|
|
}).then(res => {
|
|
|
console.log("update data")
|
|
|
for(let i = 0;i<res.data.list.length;i++){
|
|
|
console.log(res.data.list[i])
|
|
|
this.$set(this.data,i,res.data.list[i])
|
|
|
}
|
|
|
console.log(this.data)
|
|
|
this.select = res.data.list[0].id
|
|
|
//this.$set(this.select,res.data.list[0].id,0)
|
|
|
this.getStreetDetail(this.select);
|
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
|
});
|
|
|
},
|
|
|
// 获取盘点状态
|
|
|
async getStockRowColumn() {
|
|
|
this.rightShelveChange();
|
|
|
this.leftShelveChange();
|
|
|
|
|
|
},
|
|
|
rightShelveChange() {
|
|
|
let shelveId;
|
|
|
let shelveType = 'none';
|
|
|
if(this.streetDetail.rightShelveId) {
|
|
|
shelveId = this.streetDetail.rightShelveId;
|
|
|
}else if(this.streetDetail.rightInsideShelveId && this.size2 =='rightInsideShelveId'){
|
|
|
shelveId = this.streetDetail.rightInsideShelveId;
|
|
|
shelveType = 'inside';
|
|
|
}else if(this.streetDetail.rightOutsideShelveId && this.size2 == 'rightOutsideShelveId'){
|
|
|
shelveId = this.streetDetail.rightOutsideShelveId;
|
|
|
shelveType = 'out';
|
|
|
};
|
|
|
this.rightShelveId.shelveId = shelveId;
|
|
|
this.rightShelveId.shelveType = shelveType;
|
|
|
|
|
|
},
|
|
|
leftShelveChange() {
|
|
|
let shelveId;
|
|
|
let shelveType = 'none';
|
|
|
if(this.streetDetail.leftShelveId) {
|
|
|
shelveId = this.streetDetail.leftShelveId;
|
|
|
}else if(this.streetDetail.leftInsideShelveId && this.size =='leftInsideShelveId'){
|
|
|
shelveId = this.streetDetail.leftInsideShelveId;
|
|
|
shelveType = 'inside';
|
|
|
}else if(this.streetDetail.leftOutsideShelveId && this.size== 'leftOutsideShelveId'){
|
|
|
shelveId = this.streetDetail.leftOutsideShelveId;
|
|
|
shelveType = 'out';
|
|
|
};
|
|
|
this.leftShelveId.shelveId = shelveId;
|
|
|
this.leftShelveId.shelveType = shelveType;
|
|
|
},
|
|
|
getStatus(data, rowCol) {
|
|
|
return (data[rowCol] || {}).status;
|
|
|
},
|
|
|
// 获取状态对应的颜色
|
|
|
getStatusBg(data, rowCol) {
|
|
|
let status = this.getStatus(data, rowCol);
|
|
|
return status == 1 ?'#d81e06': status == 2 ? '#1afa29': '#bfbfbf';
|
|
|
},
|
|
|
//获取巷道详情
|
|
|
getStreetDetail(id) {
|
|
|
this.$axios.get('/street/' + id, {
|
|
|
data: {}
|
|
|
}).then(res => {
|
|
|
this.streetDetail = res.data
|
|
|
this.getStockRowColumn()
|
|
|
}).catch(err => {
|
|
|
|
|
|
})
|
|
|
},
|
|
|
|
|
|
handleChange(value) {
|
|
|
|
|
|
this.select = value
|
|
|
|
|
|
this.getStreetDetail(value)
|
|
|
//this.getStockList(value);
|
|
|
//this.getStockRowColumn()
|
|
|
this.leftShelveChange();
|
|
|
this.rightShelveChange();
|
|
|
},
|
|
|
tocheckOperation(checkObj, item) {
|
|
|
console.log(checkObj)
|
|
|
console.log(item)
|
|
|
this.$router.push({name: 'checkOperation', query: {checkObj: checkObj, item: item}})
|
|
|
},
|
|
|
|
|
|
exportStock() {
|
|
|
this.$api.httpApi.exportStock({
|
|
|
params: {
|
|
|
streetId: this.select,
|
|
|
}
|
|
|
}).then(res => {
|
|
|
let blob = new Blob([res], {type: "application/vnd.ms-excel"})
|
|
|
this.$utils.downloadFile('巷道列表.xls', blob)
|
|
|
}).catch(err => {
|
|
|
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
components: {Subsection}
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.check-page {
|
|
|
position: relative;
|
|
|
|
|
|
.title-info {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: start;
|
|
|
|
|
|
.explain {
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
|
|
|
.info-text {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
margin-right: 15px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.ant-tag {
|
|
|
margin-right: 0;
|
|
|
display: block;
|
|
|
line-height: 25px;
|
|
|
text-align: center;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
|
|
|
.roadway-top, roadway-buttom {
|
|
|
padding: 5px 0;
|
|
|
width: 100%;
|
|
|
}
|
|
|
|
|
|
.roadway-box {
|
|
|
transform: rotateX(180deg);
|
|
|
padding: 10px 10px 0 0;
|
|
|
.line {
|
|
|
display: flex;
|
|
|
transform: rotateX(180deg); //两次垂直镜像翻转让原本由上到下排列的div 更改为由下到上
|
|
|
|
|
|
.el {
|
|
|
width: 46px;
|
|
|
height: 25px;
|
|
|
line-height: 25px;
|
|
|
margin: 2px;
|
|
|
font-size: 12px;
|
|
|
text-align: center;
|
|
|
border-radius: 4px;
|
|
|
cursor: pointer;
|
|
|
position: relative;
|
|
|
.default {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
bottom: 0;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.center-box {
|
|
|
width: 500px;
|
|
|
height: 52px;
|
|
|
line-height: 52px;
|
|
|
.shelf-number {
|
|
|
display: inline-block;
|
|
|
width: 200px;
|
|
|
}
|
|
|
}
|
|
|
.export-all {
|
|
|
position: absolute;
|
|
|
right: 20px;
|
|
|
}
|
|
|
}
|
|
|
</style>
|