386 lines
10 KiB
Vue
386 lines
10 KiB
Vue
<template>
|
||
<view>
|
||
<u-navbar back-text="返回" title="成品上架" :background="background"></u-navbar>
|
||
<u-form ref="testForm">
|
||
<!-- <u-form-item :border-bottom="false">
|
||
<p>单号:</p>
|
||
<u-input :border="true" v-model="receiveRequestName" placeholder="请扫描条码"
|
||
:focus="focusReceiveRequestName" @confirm="serachList" />
|
||
</u-form-item> -->
|
||
<u-form-item :border-bottom="false">
|
||
<p>条码:</p>
|
||
<u-input :border="true" v-model="barCode" placeholder="请扫描条码" :focus="focusBarCode"
|
||
@confirm="searchBarcode" />
|
||
</u-form-item>
|
||
<u-form-item :border-bottom="false">
|
||
<!-- <p>库位:</p>
|
||
<!-- <u-input :border="true" v-model="kw" placeholder="请扫描库位" :focus="focusKw" @confirm="ship" /> -->
|
||
<view>
|
||
<picker @change="ship" :range="listKW">
|
||
<label>选择库位：</label>
|
||
<label class="">{{listKW[index]}}</label>
|
||
</picker>
|
||
</view>
|
||
|
||
|
||
</u-form-item>
|
||
</u-form>
|
||
<view class="uni-padding-wrap uni-common-mt">
|
||
<uni-segmented-control :current="current" :values="items" :style-type="styleType"
|
||
:active-color="activeColor" @clickItem="onClickItem" />
|
||
</view>
|
||
<view>
|
||
<view v-show="current === 0">
|
||
<view class="material">
|
||
<u-form ref="materialform">
|
||
<uni-z-table :style="{'height': tabH+'px'}" :tableData="requestData" :columns="matColumns"
|
||
:showBottomSum="true" :rowNumbers="true" :pagination="true" >
|
||
</uni-z-table>
|
||
</u-form>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-show="current === 1">
|
||
<uni-card :is-shadow="false">
|
||
<view v-for="item in barCodeData">
|
||
<!-- SELECT
|
||
BSP.PALLETNAME ,
|
||
BSP.FGCODE ,
|
||
BSP.GRADE ,
|
||
BSP.REVISIONCODE ,
|
||
BSP.CHECKINCODE ,
|
||
BSP.DOMESTICEXPORT ,
|
||
BSP.BOXQTY ,
|
||
BSP.PANELQTY
|
||
FROM
|
||
ZIMES.BSFGMS_SHIP_PALLET BSP
|
||
WHERE BSP.PALLETNAME = '' AND BSP.INTERFACEFLAG = 'N' -->
|
||
<u-form>
|
||
<u-form-item>FGCODE: {{item.FGCODE}}</u-form-item>
|
||
<u-form-item>条码: {{item.PALLETNAME}}</u-form-item>
|
||
<u-form-item>内外销: {{item.DOMESTICEXPORT}}</u-form-item>
|
||
<u-form-item>BOXQTY: {{item.BOXQTY}}</u-form-item>
|
||
<u-form-item>PANELQTY: {{item.PANELQTY}}</u-form-item>
|
||
<u-form-item>GRADE: {{item.GRADE}}</u-form-item>
|
||
<u-form-item>REVISIONCODE: {{item.REVISIONCODE}}</u-form-item>
|
||
<u-form-item>CHECKINCODE: {{item.CHECKINCODE}}</u-form-item>
|
||
</u-form>
|
||
</view>
|
||
</uni-card>
|
||
</view>
|
||
|
||
<view v-show="current === 2">
|
||
<uni-z-table :style="{'height': tabH+'px'}" :tableData="returnData" :columns="returnColumns"
|
||
:showBottomSum="true" :rowNumbers="true" :pagination="true">
|
||
</uni-z-table>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
listKW: ['CK0015','CK0016'],
|
||
items: ['BOX列表', '成品信息', '已入库列表'], //分栏器的选项卡
|
||
tabH: 800, //表格的宽度
|
||
background: {
|
||
backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
|
||
}, //返回按钮的样式
|
||
//分栏器的样式
|
||
styles: [{
|
||
value: 'button',
|
||
text: '按钮',
|
||
checked: true
|
||
},
|
||
{
|
||
value: 'text',
|
||
text: '文字'
|
||
}
|
||
],
|
||
colors: ['#007aff', '#4cd964', '#dd524d'],
|
||
current: 0,
|
||
colorIndex: 0,
|
||
activeColor: '#007aff',
|
||
styleType: 'text',
|
||
//---------------------------------------- 分割线上方都是引用的外部的组件使用的样式，下方才是是使用的数据
|
||
barCode: "", //条码
|
||
kw: "", //库位
|
||
receiveRequestName: "", //单据号
|
||
requestData: [], //材料列表
|
||
barCodeData: [], //条码信息
|
||
returnData: [], //已退料列表
|
||
shipRequestDetailName: "", //行号
|
||
focusBarCode: false, //条码焦点是否选中
|
||
focusReceiveRequestName: true, //默认选中单号焦点
|
||
focusKw: false, //库位焦点是否选中
|
||
ISRELEASE:"", //是否已扫描
|
||
siteName:"",
|
||
userId:"",
|
||
//对应材料列表下的表格的列
|
||
// SELECT
|
||
// BSB.BOXNAME ,
|
||
// BSB.PALLETNAME ,
|
||
// BSB.FGCODE ,
|
||
// BSB.GRADE ,
|
||
// BSB.REVISIONCODE ,
|
||
// BSB.DOMESTICEXPORT ,
|
||
// BSB.CHECKINCODE
|
||
// FROM
|
||
// ZIMES.BSFGMS_SHIP_BOX BSB
|
||
// WHERE
|
||
// BSB.PALLETNAME = ''
|
||
matColumns: [{
|
||
title: '箱号',
|
||
field: "BOXNAME",
|
||
width: 240,
|
||
sort: true,
|
||
align: "left"
|
||
},
|
||
{
|
||
title: '栈板号',
|
||
field: "PALLETNAME",
|
||
width: 280,
|
||
sort: true,
|
||
align: "left"
|
||
},
|
||
{
|
||
title: '完工料号',
|
||
field: "FGCODE",
|
||
width: 280,
|
||
sort: true,
|
||
align: "left"
|
||
},
|
||
{
|
||
title: 'Lot等级',
|
||
field: "GRADE",
|
||
width: 150,
|
||
sort: true,
|
||
align: "right"
|
||
},
|
||
{
|
||
title: '成品等级',
|
||
field: "REVISIONCODE",
|
||
width: 150,
|
||
sort: true,
|
||
align: "right"
|
||
},
|
||
{
|
||
title: 'Check In',
|
||
field: "CHECKINCODE",
|
||
width: 180,
|
||
sort: true,
|
||
align: "center"
|
||
},
|
||
{
|
||
title: '内外销',
|
||
field: "DOMESTICEXPORT",
|
||
width: 180,
|
||
sort: true,
|
||
align: "right"
|
||
}
|
||
],
|
||
|
||
//对应已退料的表格的列
|
||
returnColumns: [{
|
||
title: '行号',
|
||
field: "ROWNO",
|
||
width: 120,
|
||
sort: true,
|
||
align: "left"
|
||
|
||
},
|
||
{
|
||
title: '条码编号',
|
||
field: "PACKINGCODE",
|
||
width: 260,
|
||
sort: true,
|
||
align: "left"
|
||
},
|
||
{
|
||
title: '物料编号',
|
||
field: "MATERIALSPECNAME",
|
||
width: 280,
|
||
sort: true,
|
||
align: "left"
|
||
},
|
||
{
|
||
title: '数量',
|
||
field: "QTY",
|
||
width: 150,
|
||
sort: true,
|
||
align: "right"
|
||
}
|
||
]
|
||
}
|
||
},
|
||
mounted() {
|
||
this.tabH = this.$GetRemainingHeight(5, 30); //定义表格的高度
|
||
let that=this
|
||
uni.getStorage({
|
||
key:"sitename",
|
||
success(res) {
|
||
that.siteName=res.data
|
||
}
|
||
})
|
||
uni.getStorage({
|
||
key:"userid",
|
||
success(res) {
|
||
that.userId=res.data
|
||
}
|
||
})
|
||
},
|
||
methods: {
|
||
//分栏器的点击事件
|
||
onClickItem(e) {
|
||
if (this.current !== e.currentIndex) {
|
||
this.current = e.currentIndex //获取当前选中的index
|
||
}
|
||
},
|
||
//焦点初始化，让页面所有的焦点同时只能存在一个
|
||
initfocus() {
|
||
this.focusReceiveRequestName = false //单号焦点
|
||
this.focusBarCode = false //条码焦点
|
||
this.focusKw = false //库位焦点
|
||
},
|
||
//获取焦点的公共方法
|
||
getfocus(nextfocus) {
|
||
this.initfocus()
|
||
this[nextfocus] //不能用this.nextfocus
|
||
this.$nextTick(() => { //vue是数据全部修改后才进行的视图更新，哪nextTick函数就是为了拿到最新的数据，还不懂的可以去百度
|
||
this[nextfocus] = true
|
||
})
|
||
},
|
||
|
||
|
||
//扫描条码-------------回车搜索
|
||
searchBarcode() {
|
||
if (this.barCode == "") {
|
||
this.$showMessage("条码不能为空")
|
||
this.$playFail()
|
||
this.getfocus('focusBarCode')
|
||
return
|
||
}
|
||
this.getbarcodeinfo() //搜索条码信息
|
||
|
||
},
|
||
|
||
//扫描库位入库
|
||
ship() {
|
||
if (this.barCode == "") {
|
||
this.$showMessage("请扫描条码")
|
||
this.$playFail()
|
||
this.getfocus('focusBarCode')
|
||
return
|
||
}
|
||
if (this.kw == "") {
|
||
this.$showMessage("请扫描库位")
|
||
this.$playFail()
|
||
this.getfocus('focusKw')
|
||
return
|
||
}
|
||
this.scanKw() //扫描库位入库
|
||
},
|
||
|
||
//扫描库位入库
|
||
scanKw() {
|
||
//发送入库请求
|
||
this.$MyRequest('/productinto/stockInPallet',{
|
||
barCode: this.barCode, //条码
|
||
billNo: this.receiveRequestName, //单号
|
||
userId: this.userId, //登录用户
|
||
site: this.siteName, //工厂名称
|
||
storageName: this.kw //库位
|
||
}).then(res=>{
|
||
if (res.data.success) {
|
||
this.$showMessage(res.data.message)
|
||
this.$playSuccess()
|
||
this.barCode = ""
|
||
this.kw = "" //清空条码和库位
|
||
this.getfocus('focusBarCode') //焦点聚焦到条码
|
||
} else {
|
||
this.$showMessage(res.data.message)
|
||
this.$playFail()
|
||
this.kw = "" //清空库位，焦点回到库位
|
||
this.getfocus('focusKw')
|
||
}
|
||
this.receivedmaterial() //请求后端展示已入库数据
|
||
}).catch(err=>{
|
||
//调用失败的话重新获取焦点发送请求
|
||
this.$showMessage(err);
|
||
this.$palyFail()
|
||
this.kw = '';
|
||
this.getfocus('focusKw')
|
||
})
|
||
},
|
||
|
||
//获取条码明细
|
||
getbarcodeinfo() {
|
||
this.$MyRequest('/productinto/getPalletInfo',{
|
||
barCode: this.barCode
|
||
}).then(res=>{
|
||
if (res.data.success) {
|
||
this.barCodeData = res.data.resultObj //获取条码的数据
|
||
this.current = 0 //扫描条码的时候直接跳转到条码明细这个分栏器
|
||
setTimeout(()=>{
|
||
this.onClickItem(e)
|
||
})
|
||
if (res.data.resultObj != null) {
|
||
this.getmateriallist();
|
||
}
|
||
this.getfocus('focusKw') //条码下移到库位输入框
|
||
} else {
|
||
this.$showMessage(res.data.message)
|
||
this.barCode=""
|
||
this.getfocus('focusBarCode')
|
||
}
|
||
}).catch(err=>{
|
||
this.$showMessage(err)
|
||
this.barCode = "" //清空条码
|
||
this.getfocus('focusBarCode')
|
||
})
|
||
},
|
||
|
||
//获取材料列表
|
||
getmateriallist() {
|
||
this.$MyRequest('/productinto/getBoxInfo',{
|
||
barCode: this.barCode
|
||
}).then(res=>{
|
||
if (res.data.success) {
|
||
this.requestData = res.data.resultObj //接后端返回的物料参数，并展示在表格里面
|
||
this.getfocus('focusKw')
|
||
} else {
|
||
this.$showMessage(res.data.message) //单号有问题的话重新聚焦在单号输入框
|
||
this.getfocus('focusBarCode')
|
||
}
|
||
}).catch(err=>{
|
||
this.$showMessage(err)
|
||
this.getfocus('focusBarCode') //请求失败的话重新聚焦在单号输入框
|
||
})
|
||
},
|
||
|
||
//获取已入库列表
|
||
receivedmaterial() {
|
||
this.$MyRequest('/productinto/getintolist',{
|
||
receiveRequestName: this.receiveRequestName
|
||
}).then(res=>{
|
||
console.log(res)
|
||
if (res.data.success) {
|
||
this.returnData = res.data.resultObj//接数据后展示
|
||
} else console.log("已入库列表"+res.data.message)
|
||
}).catch(err=>{
|
||
this.$showMessage(err)
|
||
})
|
||
},
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
|
||
</style>
|
||
|