<template>
|
<default-header-page-layout ref="page" title="自制件空托呼叫">
|
<view
|
class="page-frame with-action-user-row"
|
:style="{ height: pageBodyHeight + 'px' }"
|
v-if="pageBodyHeight"
|
>
|
<action-user-row />
|
<view class="with-action-user-row-page-content">
|
<!-- 库区 -->
|
<selectItem
|
:selectData="areaData"
|
:value.sync="form.areaNo"
|
label="库区编码"
|
labelField="areaName"
|
valueField="areaNo"
|
/>
|
|
<selectItemWc2
|
:selectData="placeList"
|
:value.sync="form.placeNo"
|
label="库位编码"
|
labelField="placeNo"
|
valueField="placeNo"
|
@getPropData="getCurrentData"
|
/>
|
|
<scan-input-form-item
|
placeholder="请选择"
|
:clearable="false"
|
:hasScan="false"
|
:hasSearch="false"
|
@click.native="ctVisible = true"
|
class="forma-item"
|
label="托盘类型"
|
v-model="form.containerTypeCode"
|
/>
|
|
<EasyPicker
|
:visible.sync="ctVisible"
|
:list="ContainerType"
|
labelField="value"
|
valueField="code"
|
@select="getTypeVal"
|
/>
|
|
</view>
|
</view>
|
<template v-slot:footer>
|
<view class="bottom-btns-row">
|
<view class="btn-frame"
|
><u-button
|
:disabled="!Boolean(form.placeNo)"
|
type="primary"
|
text="呼叫托盘"
|
@click="onConfirm"
|
></u-button
|
></view>
|
</view>
|
</template>
|
</default-header-page-layout>
|
</template>
|
|
<script>
|
import DefaultHeaderPageLayout from "@/components/DefaultHeaderPageLayout.vue";
|
import ActionUserRow from "@/components/ActionUserRow.vue";
|
import ScanInputFormItem from "@/components/ScanInputFormItem.vue";
|
import EasySelectFormItem from "@/components/EasySelectFormItem.vue";
|
import EasyPicker from "@/components/EasyPicker.vue";
|
import selectItem from "@/components/selectItem.vue";
|
import selectItemWc2 from "@/components/selectItemWithSearchWc2.vue";
|
import {
|
$alert,
|
getDicList,
|
} from "@/static/js/utils/index.js";
|
import { palceList } from "@/service/mixins/mixins.js";
|
import { getAreaInfo } from "@/api/common.js";
|
import { callEmptyContainer } from "@/api/callEmptyContainer.js";
|
let initInterVal = null;
|
export default {
|
name: "emptyOutPage",
|
components: {
|
DefaultHeaderPageLayout,
|
ActionUserRow,
|
EasySelectFormItem,
|
ScanInputFormItem,
|
selectItem,
|
EasyPicker,
|
selectItemWc2
|
},
|
data() {
|
return {
|
pageBodyHeight: 0,
|
form: {
|
placeNo: "",
|
areaNo: "",
|
areaName: "",
|
containerTypeCode:"",
|
containerType: ""
|
},
|
areaData: [],
|
ctVisible: false,
|
ContainerType: [],
|
};
|
},
|
watch: {
|
"form.areaNo": {
|
handler(val, oldVal) {
|
if (val != "") {
|
this.form.placeNo = "";
|
this.form.containerNo = "";
|
this.placeList = [];
|
this.getPalceList({
|
areaCode: val,
|
});
|
}
|
},
|
},
|
},
|
methods: {
|
//库位模糊查询
|
async getCurrentData(PlaceNo) {
|
await this.getPalceList({
|
areaCode: this.form.areaNo,
|
PlaceNo: PlaceNo
|
});
|
},
|
// 选择托盘类型返回值
|
getTypeVal(val, valObj, index) {
|
this.form.containerTypeCode = valObj.value;
|
this.form.containerType = valObj.code;
|
},
|
// 选择库位返回值
|
async selectPlace(val, item) {
|
this.form.areaNo = item.areaCode;
|
this.form.placeNo = val;
|
let res = this.areaList.filter((obj) => obj.areaNo == item.areaCode);
|
this.form.areaName = res.length > 0 ? res[0].areaName : "";
|
},
|
|
// 获取库区数据
|
async getAreaList() {
|
try {
|
let { result } = await getAreaInfo();
|
this.areaData = result;
|
} catch (e) {
|
//TODO handle the exception
|
console.log(e);
|
}
|
},
|
async onConfirm() {
|
//判断库区是否为空
|
if(!this.form.areaNo){
|
$alert("请选择库区");
|
return;
|
}
|
//判断库位是否为空
|
if(!this.form.placeNo){
|
$alert("请选择库位");
|
return;
|
}
|
|
//判断托盘类型是否为空
|
if(!this.form.containerType){
|
$alert("请选择托盘类型");
|
return;
|
}
|
try {
|
await callEmptyContainer(this.form);
|
this.$modal('呼叫空托成功')
|
this.form = {
|
placeNo: "",
|
areaNo: "",
|
areaName: "",
|
containerTypeCode:"",
|
containerType: ""
|
};
|
} catch (e) {
|
console.log(e);
|
}
|
},
|
/* 页面初始化获取页面body高度的定时器 */
|
startInitInterval(callback) {
|
initInterVal = setInterval(() => {
|
if (this.pageBodyHeight) {
|
this.clearInitInterval();
|
callback && callback();
|
} else {
|
this.pageBodyHeight = this.$refs.page.getBodyHeight();
|
}
|
}, 200);
|
},
|
/* 清除定时器 */
|
clearInitInterval() {
|
try {
|
clearInterval(initInterVal);
|
initInterVal = null;
|
} catch (e) {
|
//TODO handle the exception
|
}
|
},
|
},
|
mixins: [palceList],
|
onReady() {
|
this.startInitInterval(async () => {
|
/* 页面初始化后需要执行的代码在这边调用 */
|
// this.getPalceList({
|
// areaCode: 'GGXX'
|
// })
|
this.ContainerType = getDicList(
|
this.$store,
|
"container_type"
|
).sysDictDatas;
|
this.getAreaList();
|
});
|
},
|
onUnload() {
|
this.clearInitInterval();
|
},
|
};
|
</script>
|
|
<style scoped lang="scss">
|
.bottom-btns-row {
|
display: flex;
|
padding: 10rpx 20rpx;
|
background-color: #fff;
|
|
.btn-frame {
|
width: 1%;
|
box-sizing: border-box;
|
flex-grow: 1;
|
}
|
|
.divider {
|
width: 20rpx;
|
flex-shrink: 0;
|
}
|
}
|
|
.forma-item {
|
margin-bottom: 24rpx;
|
}
|
|
.only-watch-container {
|
background-color: #d0ddd8;
|
min-height: 90rpx;
|
display: flex;
|
|
& > .label {
|
color: $u-tips-color;
|
font-size: 32rpx;
|
flex-shrink: 0;
|
padding-left: 20rpx;
|
padding-top: 22rpx;
|
}
|
|
& > .content {
|
width: 1px;
|
flex-grow: 1;
|
display: flex;
|
align-items: center;
|
font-size: 30rpx;
|
padding: 8rpx 0;
|
}
|
}
|
</style>
|
