增加站台盘点
LAPTOP-S9HJSOEB\昊天
2 years ago
parent
09fec84220
commit
cd488332e1
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB After Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
@ -0,0 +1,371 @@
|
||||
<template>
|
||||
<div class="subsection">
|
||||
<a-layout style="width: 1500px">
|
||||
<a-layout style="width: 100%;height: 310px">
|
||||
<a-layout-sider width="110px">
|
||||
<a-tabs default-active-key="1" tab-position="left" @change="changeTabLeft" v-if="total.row > nums.row">
|
||||
<a-tab-pane
|
||||
v-for="index in latticeRow"
|
||||
:key="index"
|
||||
>
|
||||
<span slot="tab" >
|
||||
{{ getRandom(latticeRow + 1 -index, latticeRow, nums.row, total.row) }}
|
||||
<a-icon type="close-circle" v-if="status.row[index] === 1" style="color: #d81e06"/>
|
||||
<a-icon type="check-circle" v-else-if="status.row[index] === 2" style="color: #1afa29" />
|
||||
<a-icon type="exclamation-circle" v-else style="color: #909399" />
|
||||
</span>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-layout-sider>
|
||||
<a-layout-content>
|
||||
<!-- <slot :data="{select, nums, random}"></slot> -->
|
||||
<div class="roadway-buttom">
|
||||
<div class="roadway-box">
|
||||
|
||||
<div class="line" v-for="(row,rowIndex) in total.row" :key="rowIndex" v-if="row >= random.row[0] && row <= random.row[1]">
|
||||
<div v-for="(column,index) in total.column" :key="index" class="el" v-if="column >= random.column[0] && column <= random.column[1]">
|
||||
|
||||
<!--渲染默认巷道框架规格 定位浮在 已有巷道上做对应-->
|
||||
<span
|
||||
class="default"
|
||||
:id="`${direction}-${side}-${random.row[0] + random.row[1] - rowIndex - 1}-${column}`"
|
||||
@click="tocheckPage(random.row[0] + random.row[1] - rowIndex - 1,column)">
|
||||
{{ random.row[0] + random.row[1] - rowIndex - 1}}-{{column}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-layout-content>
|
||||
</a-layout>
|
||||
<a-layout-footer>
|
||||
<!-- <a-tabs default-active-key="1" tab-position="bottom" @change="value => select.row = value" v-if="total.row > nums.row"> -->
|
||||
<a-tabs default-active-key="1" tab-position="bottom" @change="changeTab" v-if="total.column > nums.column">
|
||||
<a-tab-pane
|
||||
v-for="index in latticeColumn"
|
||||
:key="index"
|
||||
>
|
||||
<span slot="tab">
|
||||
{{ getRandom(index, latticeColumn, nums.column, total.column) }}
|
||||
<!-- <a-icon :id="`${shelveId}-row-${getRandom(index,latticeRow,nums.row,total.row)}`"/> -->
|
||||
<a-icon type="close-circle" v-if="status.column[index] === 1" style="color: #d81e06" />
|
||||
<a-icon type="check-circle" v-else-if="status.column[index] === 2" style="color: #1afa29" />
|
||||
<a-icon type="exclamation-circle" v-else style="color: #909399" />
|
||||
</span>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-layout-footer>
|
||||
</a-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Subsection",
|
||||
components: {},
|
||||
props: {
|
||||
// 默认行第一个 列第一个
|
||||
select: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
row: 1,
|
||||
column: 1
|
||||
}
|
||||
}
|
||||
},
|
||||
// 总共数据
|
||||
total:{
|
||||
type: Object,
|
||||
default:()=>{
|
||||
return {}
|
||||
}
|
||||
},
|
||||
nums: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
row: 10,
|
||||
column: 15
|
||||
}
|
||||
}
|
||||
},
|
||||
direction: {
|
||||
type: Number,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
side: {
|
||||
type: Number,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
|
||||
streetId: {
|
||||
type: Number,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
streetName: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
computed: {
|
||||
// 应有的格子数
|
||||
latticeRow() {
|
||||
return parseInt(this.total.row / this.nums.row) + (this.total.row % this.nums.row > 0 ? 1 : 0);
|
||||
},
|
||||
latticeColumn() {
|
||||
return parseInt(this.total.column / this.nums.column) + (this.total.column % this.nums.column > 0 ? 1 : 0);
|
||||
},
|
||||
random() {
|
||||
|
||||
return {
|
||||
|
||||
row: this.getRandomRow(this.select.row),
|
||||
column: this.getRandomColumn(this.select.column),
|
||||
}
|
||||
},
|
||||
watchDirection(){
|
||||
return this.direction;
|
||||
},
|
||||
watchSide(){
|
||||
return this.side;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
watchDirection() {
|
||||
this.getStatus();
|
||||
},
|
||||
watchSide() {
|
||||
this.getStatus();
|
||||
},
|
||||
immediate: true,
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
status: {
|
||||
row: {},
|
||||
column: {}
|
||||
},
|
||||
timer: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.getStatus();
|
||||
})
|
||||
this.$on('hook:activated', () => {
|
||||
this.timer = window.setInterval(this.getStatus, 3000);
|
||||
})
|
||||
this.timer = window.setInterval(this.getStatus, 3000);
|
||||
|
||||
this.$on('hook:deactivated', () => {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
})
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
console.log("beforeDestroy")
|
||||
window.clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
destroyed() {
|
||||
window.clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
|
||||
methods: {
|
||||
changeTab(value){
|
||||
this.select.column = value
|
||||
this.getStatus()
|
||||
},
|
||||
changeTabLeft(value){
|
||||
this.select.row = value
|
||||
this.getStatus()
|
||||
|
||||
},
|
||||
// 获取行或列的范围字符串
|
||||
getRandom(index, lattice, num, total) {
|
||||
if(index !== lattice) {
|
||||
return `${(index - 1) * num + 1} - ${index * num}`;
|
||||
}else {
|
||||
return `${(index - 1) * num + 1} - ${total}`;
|
||||
}
|
||||
},
|
||||
// 获取行和列的范围数组
|
||||
getRandomRow(val) {
|
||||
console.log(this.latticeRow + 1 - val, this.latticeRow, this.nums.row, this.total.row)
|
||||
return this.getRandom(this.latticeRow + 1 - val, this.latticeRow, this.nums.row, this.total.row).split(' - ').map(item => Number(item));
|
||||
},
|
||||
getRandomColumn(val) {
|
||||
return this.getRandom(val, this.latticeColumn, this.nums.column, this.total.column).split(' - ').map(item => Number(item));
|
||||
},
|
||||
|
||||
getStatusBg(row,column,status) {
|
||||
var dom = document.getElementById(this.direction+"-"+this.side+"-"+row+'-'+column);
|
||||
var color = status == 1 ?'#d81e06': (status == 2|| status == 3) ? '#1afa29': '#bfbfbf';
|
||||
dom.style.background = color
|
||||
},
|
||||
|
||||
getStatus(){
|
||||
|
||||
var columnTab = []
|
||||
for(let c = 1; c <= this.latticeColumn ;c++){
|
||||
let tab = this.getRandom(c,this.latticeColumn,this.nums.column,this.total.column)
|
||||
columnTab.push(tab)
|
||||
}
|
||||
var rowTab = []
|
||||
for(let r = 1; r <= this.latticeRow ;r++){
|
||||
let tab = this.getRandom(r,this.latticeRow,this.nums.row,this.total.row)
|
||||
rowTab.push(tab)
|
||||
}
|
||||
this.$api.httpApi.getStatusByRowColumn({
|
||||
data: {
|
||||
columnStart: this.random.column[0],
|
||||
columnEnd: this.random.column[1],
|
||||
rowStart: this.random.row[0],
|
||||
rowEnd: this.random.row[1],
|
||||
streetId: this.streetId,
|
||||
direction: this.direction,
|
||||
side: this.side,
|
||||
rowTabs: rowTab,
|
||||
columnTabs: columnTab
|
||||
}
|
||||
}).then(res => {
|
||||
if(res.code == 200){
|
||||
if(res.data.stocks){
|
||||
for(let a of res.data.stocks){
|
||||
this.getStatusBg(a.row,a.column,a.status)
|
||||
}
|
||||
}
|
||||
|
||||
var i = 1;
|
||||
for(let a in res.data.columnTabStatus){
|
||||
this.$set(this.status.column, i, res.data.columnTabStatus[a]);
|
||||
|
||||
i++;
|
||||
}
|
||||
|
||||
|
||||
var j = 0;
|
||||
for(let a in res.data.rowTabStatus){
|
||||
j++;
|
||||
}
|
||||
for(let a in res.data.rowTabStatus){
|
||||
this.$set(this.status.row, j, res.data.rowTabStatus[a]);
|
||||
|
||||
j--;
|
||||
}
|
||||
}
|
||||
}).catch(err => {
|
||||
|
||||
});
|
||||
},
|
||||
tocheckPage(row,column){
|
||||
this.$router.push({
|
||||
name: 'checkOperation',
|
||||
query: {row: row, column: column, direction: this.direction,side:this.side, streetId: this.streetId, name:this.streetName}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.subsection /deep/{
|
||||
width: 100%;
|
||||
height: 360px;
|
||||
overflow: hidden;
|
||||
.ant-tabs-nav .ant-tabs-tab {
|
||||
// padding: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
|
||||
&:hover{
|
||||
background: #40a9ff;
|
||||
border-color: #40a9ff;
|
||||
}
|
||||
background: #40a9ff;
|
||||
border-color: #40a9ff;
|
||||
box-shadow: -1px 0 0 0 #40a9ff;
|
||||
}
|
||||
.ant-radio-button-wrapper-checked {
|
||||
box-shadow: -1px 0 0 0 #40a9ff;
|
||||
}
|
||||
.radio-button-cell {
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
.ant-layout-sider {
|
||||
height: 100%;
|
||||
.ant-tabs {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.ant-tabs-tab {
|
||||
padding: 8px;
|
||||
margin-bottom: 5px;
|
||||
width: 104px;
|
||||
}
|
||||
}
|
||||
.ant-layout-footer {
|
||||
// width: 500px;
|
||||
padding: 0 0 0 110px;
|
||||
.ant-tabs {
|
||||
// width: 735px;
|
||||
}
|
||||
.ant-tabs-bottom-bar {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
.ant-layout, .ant-layout-sider, .ant-layout-footer {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,266 @@
|
||||
<template>
|
||||
<div class="history">
|
||||
|
||||
<div style="display:flex">
|
||||
<div style="margin-left: 10px,width:100,height:200,float:left">
|
||||
<ul style="width:400,line-height:40">
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
{{street.name}}-{{realCheck.direction == ''?'左右':(realCheck.direction == 1?"左":"右")}}-{{realCheck.side == ''?'深浅':(realCheck.side == 1?"浅":"深")}}-{{realCheck.row}}层-{{realCheck.column}}列
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
核对状态:{{realCheck.status == 1?"盘点正确":"盘点异常"}}
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
系统条码:{{realCheck.WMSCode}}
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
盘点结果条码:{{realCheck.checkCode}}
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
系统品规:
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
盘点结果品规:
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
系统数量:{{realCheck.WMSCount}}
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
盘点结果数量:{{realCheck.checkCode}}
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span class="img-box-title">
|
||||
盘点时间:{{realCheck.time}}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div >
|
||||
<a-row type="flex" justify="space-around" style="height:300,margin-left:400">
|
||||
<a-col :span="4">
|
||||
<p>顶部图片1</p>
|
||||
<viewer >
|
||||
<img class="historyImg" :src="realCheck.topPic1"/>
|
||||
</viewer>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<p>顶部图片2</p>
|
||||
<viewer >
|
||||
<img class="historyImg" :src="realCheck.topPic2"/>
|
||||
</viewer>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row type="flex" justify="space-around" align="middle" style="height:300">
|
||||
|
||||
|
||||
<a-col :span="4">
|
||||
<p>侧面图片1</p>
|
||||
<viewer >
|
||||
<img class="historyImg" :src="realCheck.sidePic1"/>
|
||||
</viewer>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<p>侧面图片2</p>
|
||||
<viewer >
|
||||
<img class="historyImg" :src="realCheck.sidePic2"/>
|
||||
</viewer>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row type="flex" justify="space-around" align="middle" style="height:300">
|
||||
|
||||
<a-col :span="4">
|
||||
<p>侧面图片3</p>
|
||||
<viewer >
|
||||
<img class="historyImg" :src="realCheck.sidePic3"/>
|
||||
</viewer>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<p>侧面图片4</p>
|
||||
<viewer >
|
||||
<img class="historyImg" :src="realCheck.sidePic4"/>
|
||||
</viewer>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import Model from "./model.vue"
|
||||
export default {
|
||||
name: "checkMonitoring",
|
||||
data() {
|
||||
return {
|
||||
queryParam: {
|
||||
orderNum: ''
|
||||
},
|
||||
street: '',
|
||||
streetId:'',
|
||||
SRMNumber:'',
|
||||
|
||||
streets:[],
|
||||
realCheck:{
|
||||
direction:'',
|
||||
side:'',
|
||||
|
||||
column:'',
|
||||
row:'',
|
||||
WMSCode:'',
|
||||
WMSCategory:'',
|
||||
WMSCount:'',
|
||||
checkCode:'',
|
||||
checkCategory:'',
|
||||
checkCount:'',
|
||||
topPic1:'',
|
||||
topPic2:'',
|
||||
sidePic1:'',
|
||||
sidePic2:'',
|
||||
sidePic3:'',
|
||||
sidePic4:'',
|
||||
time:'',
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.request();
|
||||
this.$nextTick(() => {
|
||||
this.getRealTimeCheck();
|
||||
})
|
||||
this.$on('hook:activated', () => {
|
||||
this.timer = window.setInterval(this.getRealTimeCheck, 3000);
|
||||
})
|
||||
this.timer = window.setInterval(this.getRealTimeCheck, 3000);
|
||||
|
||||
this.$on('hook:deactivated', () => {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
console.log("beforeDestroy")
|
||||
window.clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
destroyed() {
|
||||
window.clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
methods: {
|
||||
request() {
|
||||
this.$api.httpApi.getAllStreet({
|
||||
}).then(res => {
|
||||
console.log("update data")
|
||||
this.streets = res.data
|
||||
this.street = res.data[0]
|
||||
this.streetId = this.street.id
|
||||
this.SRMNumber = this.street.plcId
|
||||
this.getRealTimeCheck();
|
||||
}).catch(err => {
|
||||
|
||||
});
|
||||
},
|
||||
handleChange(value) {
|
||||
|
||||
this.street = value
|
||||
console.log("street:"+this.street);
|
||||
this.getRealTimeCheck();
|
||||
|
||||
},
|
||||
getRealTimeCheck(){
|
||||
|
||||
console.log("SRMNUmber:"+this.SRMNumber);
|
||||
this.$axios.get('/clientTest/realtimeCheck', {
|
||||
params: {SRMNumber:this.SRMNumber}
|
||||
}).then(res => {
|
||||
if (res.code == 200) {
|
||||
if(res.data != null){
|
||||
this.realCheck = res.data
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
this.$message.error('获取失败');
|
||||
}
|
||||
}).catch(err => {
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Model
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.history {
|
||||
padding: 24px;
|
||||
}
|
||||
.ant-drawer-content-wrapper {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.ant-drawer-body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ant-advanced-search-form .ant-form-item {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.historyImg {
|
||||
width: 900px;
|
||||
height:auto;
|
||||
margin: 5px;
|
||||
}
|
||||
ul {
|
||||
|
||||
height: 100%;
|
||||
margin-bottom: 0;
|
||||
padding-inline-start: 0;
|
||||
|
||||
li {
|
||||
background-color: #ffaf11;
|
||||
|
||||
margin: 10px 0;
|
||||
padding: 5px;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #494e52;
|
||||
|
||||
.img-box-title {
|
||||
width: 230px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,326 @@
|
||||
<template>
|
||||
<div class="history bg-white">
|
||||
<div class="ant-advanced-search-form">
|
||||
<a-form layout="inline" :form="queryParam">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="4">
|
||||
<a-form-item label="巷道">
|
||||
<a-select @change="handleChange" :value="select" style="width:100px">
|
||||
<a-select-option v-for="i in listData" :key="i.name" :value="i.id">
|
||||
{{i.name}}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
</a-col>
|
||||
<a-col :span="2">
|
||||
<a-form-item label="左右">
|
||||
<a-select v-model="queryParam.leftRight" @change="leftRightChange" >
|
||||
<a-select-option :value=-1>
|
||||
未选择
|
||||
</a-select-option>
|
||||
<a-select-option :value=1>
|
||||
左侧
|
||||
</a-select-option>
|
||||
<a-select-option :value=2>
|
||||
右侧
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
</a-col>
|
||||
<a-col :span="2">
|
||||
<a-form-item label="深浅" v-if="queryParam.side >= 0">
|
||||
<a-select style="width: 50px" :key="queryParam.side" >
|
||||
<a-select-option :key=-1>
|
||||
未选择
|
||||
</a-select-option>
|
||||
<a-select-option :key=1>
|
||||
浅
|
||||
</a-select-option>
|
||||
<a-select-option :key=2>
|
||||
深
|
||||
</a-select-option>
|
||||
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
|
||||
</a-col>
|
||||
<a-col :span="2" style="text-align: left">
|
||||
<a-form-item label="行号">
|
||||
<a-input v-model="queryParam.row" placeholder="请输入" style="width:50px;" type="number"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="2" style="text-align: left">
|
||||
<a-form-item label="列号">
|
||||
<a-input v-model="queryParam.column" placeholder="请输入" style="width:50px;" type="number"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4" style="text-align: left">
|
||||
<a-form-item label="盘点号">
|
||||
<a-input v-model="queryParam.lotnum" placeholder="请输入" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4">
|
||||
<a-form-item label="时间">
|
||||
<a-range-picker
|
||||
@change="onTimeChange"
|
||||
v-model="time"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
:show-time="{
|
||||
defaultValue: [moment('00:00', 'HH:mm'), moment('23:59', 'HH:mm')],
|
||||
//defaultValue: [moment('00:00', 'YYYY-MM-DD HH:mm'), moment('23:59', 'YYYY-MM-DD HH:mm')],
|
||||
}"
|
||||
>
|
||||
<a-icon slot="suffixIcon" type="calendar"/>
|
||||
</a-range-picker>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="4" style="text-align: right">
|
||||
<a-button type="primary" @click="handleSearch">搜索</a-button>
|
||||
<a-button style="margin-left: 15px" @click="reset">重置</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:row-key="record => record.id"
|
||||
:data-source="data"
|
||||
:pagination="pagination"
|
||||
@change="handleGetHistoryList"
|
||||
>
|
||||
<span slot="checkNum" slot-scope="text">
|
||||
{{ text }}
|
||||
</span>
|
||||
<span slot="goodsLocation" slot-scope="text">
|
||||
{{ text.direction == 1 ?"左":"右"}}-{{ text.side == 1 ?"浅":"深"}}-{{ text.row}}-{{ text.column}}
|
||||
</span>
|
||||
<span slot="status" slot-scope="text">
|
||||
{{ statusMap[text.status] }}
|
||||
</span>
|
||||
<span slot="pic" slot-scope="text" style="width:auto">
|
||||
|
||||
<template>
|
||||
<span style="height:100%;">
|
||||
<happy-scroll color="rgba(100,100,100,0.5)" size="8" class="scroll-box" style="width:320px;height:90px;">
|
||||
<viewer><img class="historyImg" :src="imgUrl+text.pic"/></viewer>
|
||||
</happy-scroll>
|
||||
</span>
|
||||
|
||||
</template>
|
||||
|
||||
</span>
|
||||
</a-table>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {imgUrl} from "@/api/importExcel";
|
||||
import moment from 'moment';
|
||||
export default {
|
||||
name: "historyCheck",
|
||||
data() {
|
||||
return {
|
||||
statusMap: {0:"未盘点",1:"盘点异常",2:"核对正确",3:"人工核对正确"},
|
||||
queryParam: {
|
||||
lotnum: '',
|
||||
side : -1,
|
||||
leftRight : -1
|
||||
},
|
||||
listData:[],
|
||||
time:[],
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
data: [],
|
||||
|
||||
select: '',
|
||||
pagination:{
|
||||
total: 0,
|
||||
defaultPageSize: 10, // 默认每页显示数量
|
||||
showTotal: total => `共 ${total} 条数据`,// 显示总数
|
||||
showSizeChanger: true, // 显示可改变每页数量
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
onShowSizeChange: (current, pageSize) => this.pageSize = pageSize // 改变每页数量时更新显示
|
||||
},
|
||||
imgUrl: imgUrl,
|
||||
columns: [
|
||||
{
|
||||
title: "盘点批次号",
|
||||
dataIndex: "lotnum",
|
||||
},
|
||||
{
|
||||
title: "货位({左右}-{深浅}-{行}-{列})",
|
||||
scopedSlots: {customRender: 'goodsLocation'},
|
||||
},
|
||||
{
|
||||
title: "系统托盘条码号",
|
||||
dataIndex: "wmsTrayCode",
|
||||
},
|
||||
{
|
||||
title: "扫描托盘条码号",
|
||||
dataIndex: "trayCode",
|
||||
},
|
||||
{
|
||||
title: "盘点状态",
|
||||
scopedSlots: {customRender: 'status'},
|
||||
},
|
||||
{
|
||||
title: "照片",
|
||||
scopedSlots: {customRender: 'pic'},
|
||||
width:320,
|
||||
},
|
||||
{
|
||||
title: "时间",
|
||||
dataIndex: "createTime",
|
||||
},
|
||||
|
||||
],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getStreetList();
|
||||
this.handleSearch();
|
||||
},
|
||||
methods: {
|
||||
moment,
|
||||
//获取巷道列表
|
||||
getStreetList() {
|
||||
this.$api.httpApi.getAllStreet({
|
||||
}).then(res => {
|
||||
this.listData = res.data;
|
||||
}).catch(err => {
|
||||
console.error(err);
|
||||
});
|
||||
},
|
||||
//获取巷道详情
|
||||
getStreetDetail(id) {
|
||||
this.$axios.get('/street/' + id, {
|
||||
data: {}
|
||||
}).then(res => {
|
||||
this.streetDetail = res.data
|
||||
this.select = this.streetDetail.name;
|
||||
this.queryParam.streetId = this.streetDetail.id;
|
||||
}).catch(err => {
|
||||
|
||||
})
|
||||
},
|
||||
handleChange(value) {
|
||||
this.getStreetDetail(value)
|
||||
this.queryParam.leftRight = -1
|
||||
this.queryParam.side = -1
|
||||
|
||||
},
|
||||
// 左右货架切换
|
||||
leftRightChange(value) {
|
||||
if (value == 1) {
|
||||
//单伸
|
||||
if(this.streetDetail.leftType == 0){
|
||||
this.queryParam.side = -1
|
||||
}else{
|
||||
this.queryParam.side = 0
|
||||
}
|
||||
} else if (value == 2) {
|
||||
if(this.streetDetail.rightType == 0){
|
||||
this.queryParam.side = -1
|
||||
}else{
|
||||
this.queryParam.side = 0
|
||||
|
||||
}
|
||||
} else{
|
||||
this.queryParam.side = -1
|
||||
}
|
||||
},
|
||||
handleSearch() {
|
||||
console.log(this.queryParam)
|
||||
this.pageNum = 1
|
||||
this.request()
|
||||
},
|
||||
handleGetHistoryList(pagination) {
|
||||
console.log(pagination)
|
||||
if(pagination){
|
||||
this.pagination.current = pagination.current;
|
||||
this.pagination.pageSize = pagination.pageSize;
|
||||
this.pageNum = pagination.current;
|
||||
this.pageSize = pagination.pageSize;
|
||||
}
|
||||
this.request();
|
||||
},
|
||||
request() {
|
||||
this.$api.httpApi.checkLog({
|
||||
data: {
|
||||
pageNum: this.pageNum,
|
||||
pageSize: this.pageSize,
|
||||
...this.queryParam
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res.data)
|
||||
const pagination = {...this.pagination};
|
||||
pagination.total = res.data.total;
|
||||
this.pagination = pagination;
|
||||
this.data = res.data.list
|
||||
}).catch(err => {
|
||||
|
||||
});
|
||||
},
|
||||
onTimeChange(date, dateString) {
|
||||
this.handleReset()
|
||||
console.log(date)
|
||||
console.log(dateString)
|
||||
console.log(date[0].format('YYYY-MM-DD HH:mm'))
|
||||
this.pageNum = 1
|
||||
|
||||
this.queryParam.startTimestamp = date[0].format('YYYY-MM-DD HH:mm:ss')
|
||||
this.queryParam.endTimestamp = date[1].format('YYYY-MM-DD HH:mm:ss')
|
||||
},
|
||||
handleReset() {
|
||||
this.queryParam.startTimestamp = ""
|
||||
this.queryParam.endTimestamp = ""
|
||||
this.pageNum = 1
|
||||
|
||||
},
|
||||
reset() {
|
||||
this.queryParam.startTimestamp = ""
|
||||
this.queryParam.endTimestamp = ""
|
||||
this.queryParam.lotnum = ""
|
||||
this.queryParam.side = -1
|
||||
this.queryParam.leftRight = -1
|
||||
this.queryParam.streetId = 0
|
||||
|
||||
this.select = null;
|
||||
this.time = []
|
||||
this.pageNum = 1
|
||||
this.pageSize = 10
|
||||
this.queryParam.row = null
|
||||
this.queryParam.column = null
|
||||
this.request()
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.history {
|
||||
padding: 24px;
|
||||
}
|
||||
.ant-drawer-content-wrapper {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.ant-drawer-body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ant-advanced-search-form .ant-form-item {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.historyImg {
|
||||
width: 80px;
|
||||
height:auto;
|
||||
margin: 5px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue