<template>
|
<!-- 分拣 -->
|
<view class="">
|
<view class="scan">
|
<u-input :focus='focus' @confirm="tray" v-model="value" @input="tray" :border="true" placeholder="请扫托盘" />
|
<i class="iconfont icon-saoma" @click="scan"></i>
|
</view>
|
<view class="title" style="display: flex;">
|
<text style="font-size: 1rem;">占用空间：</text>
|
<u-number-box v-model="proportion" :max="100" bg-color="#f4f4f4" style="margin-right: 5px;">
|
</u-number-box>%
|
</view>
|
<view class="" v-show="show">
|
<view class="title">
|
<view class="">
|
<text>跟踪号：</text>
|
<text>{{tracking}}</text>
|
</view>
|
</view>
|
<view class="tab">
|
<u-tabs :list="tabs" :is-scroll="false" :current="current" @change="change" active-color="#80adb1"
|
bar-width="0"></u-tabs>
|
</view>
|
<view class="" style="border: 1px solid #000;margin: 10px 2%;">
|
</view>
|
<view class="table">
|
<table>
|
<tr>
|
<th>物料编号</th>
|
<th v-if="display">分拣数量</th>
|
<th v-else>数量</th>
|
<th>单位</th>
|
</tr>
|
<tr v-for="(item,index) in orderList" :key="index" style="width: 100%;">
|
<td @click="details(item,index)" style="width: 55%;">
|
<view class="">
|
{{item.materialCode}}
|
</view>
|
<view class="">
|
{{item.materialName}}
|
</view>
|
</td>
|
<td v-if="display" style="height: 32px;border-bottom: 1px solid #c6c6c6;width: 5rem;">
|
<u-number-box v-model="item.pickQty" color="#595c5a" :input-width="65" :input-height="49"
|
bg-color="transparent " :max="item.stockQty" :positive-integer="false"
|
style="margin: 0 auto;"></u-number-box>
|
</td>
|
<td v-else style="height: 32px;border-bottom: 1px solid #c6c6c6;width: 5rem;">
|
{{item.stockQty}}
|
</td>
|
<td>{{item.unit}}</td>
|
</tr>
|
</table>
|
</view>
|
<u-modal v-model="showModel" title="物料详情">
|
<view class="slot-content">
|
<view class="list">
|
<view class="">
|
<text>销售单号：</text>
|
<u-input disabled v-model="List.saleCode"></u-input>
|
</view>
|
<view class="">
|
<text>跟踪号：</text>
|
<u-input disabled v-model="List.trankingNumber"></u-input>
|
</view>
|
<view class="">
|
<text>物料名称：</text>
|
<u-input disabled v-model="List.materialName"></u-input>
|
</view>
|
<view class="">
|
<text>物料编号：</text>
|
<u-input disabled v-model="List.materialCode"></u-input>
|
</view>
|
<view class="">
|
<text>移动类型：</text>
|
<u-input disabled v-model="List.moveType"></u-input>
|
</view>
|
<view class="SKU">
|
<text>库存单位：</text>
|
<u-input disabled v-model="List.unit"></u-input>
|
</view>
|
<view class="SKU">
|
<text>分拣数量：</text>
|
<u-input disabled v-model="List.pickQty"></u-input>
|
</view>
|
<view class="SKU">
|
<text>库存数量：</text>
|
<u-input disabled v-model="List.stockQty"></u-input>
|
</view>
|
</view>
|
</view>
|
</u-modal>
|
<view class="btn">
|
<u-button @click="reset">重置</u-button>
|
<u-button type="success" plain @click="confirm">确认分拣</u-button>
|
</view>
|
</view>
|
</view>
|
|
</template>
|
<script>
|
import {
|
sorting,
|
confirm
|
} from '../../api/sorting.js'
|
export default {
|
data() {
|
return {
|
value: '', //托盘号
|
tabs: [{ //选项卡
|
name: '待出库明细'
|
}, {
|
name: '全部明细'
|
}],
|
current: 0, //选项卡默认第一项
|
sell: '', //销售单号
|
tracking: '', //跟踪号
|
type: '', //移动类型
|
orderList: [
|
// {
|
// materialCode: 22,
|
// materialName: 222,
|
// pickQty: 3,
|
// stockQty: 3,
|
// unit: 'pp'
|
// },
|
], //明细列表
|
List: [{
|
// saleCode: '',
|
// trankingNumber: 11,
|
// materialName: 'pp',
|
// materialCode: '123',
|
// moveType: 'p',
|
// unit: 0
|
}], //物料详情
|
show: false,
|
showModel: false, //物料详情模态框
|
display: true, //待出库数量栏
|
checkItem: '', //单选数据
|
proportion: 100, //占用空间
|
focus:true,//聚焦
|
all: false,
|
creator:""
|
}
|
},
|
mounted() {
|
let creator = uni.getStorageSync('creator') || ''
|
if(creator){
|
this.creator = JSON.parse(creator) || ''//修改人
|
}
|
},
|
methods: {
|
tray() {
|
this.proportion=100 //设置占用空间默认值 【EditBy shaocx,2022-08-30】
|
this.orderList=[]
|
this.all = true
|
let params = {
|
plateCode: this.value
|
}
|
sorting(params).then((res) => {
|
if (res.data.status == 200) {
|
this.show = true
|
if (this.current == 0) {
|
this.orderList = res.data.materials.filter(picker => {
|
return picker.pickQty != 0
|
})
|
this.tracking = this.orderList[0].trankingNumber //跟踪号
|
} else if (this.current == 1) {
|
this.orderList = res.data.materials
|
this.tracking = this.orderList[0].trankingNumber //跟踪号
|
}
|
//赋值显示空间占比 【EditBy shaocx,2022-10-15】
|
this.proportion=res.data.materials[0].positionLength
|
} else {
|
this.$u.toast('此托盘不需要分拣')
|
}
|
})
|
},
|
change(index) {
|
this.current = index;
|
if (this.current == 0) {
|
this.display = true
|
} else {
|
this.display = false
|
}
|
this.tray()
|
},
|
details(val, i) {
|
this.List = val
|
this.showModel = true
|
},
|
//重置，全不选
|
reset() {
|
this.tray()
|
},
|
//确认分拣
|
confirm() {
|
uni.showModal({
|
title: '提示',
|
content: '是否确认分拣',
|
showCancel: true,
|
cancelColor: '#333333',
|
success: (res => {
|
if (res.confirm) {
|
let params = '' | []
|
if (this.all == true) {
|
let params = this.orderList
|
let plateCode = this.value
|
let percentage = this.proportion
|
let creator = this.creator || '';
|
confirm(params, plateCode, percentage,creator).then((res) => {
|
if (res.data.status == 200) {
|
this.show = false
|
this.orderList = ''
|
this.value = ''
|
this.$u.toast(res.data.msg)
|
} else {
|
this.show = true
|
this.$u.toast(res.data.msg)
|
}
|
})
|
}
|
|
} else if (res.cancel) {}
|
})
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
page {
|
background-color: white;
|
}
|
.active {
|
background-color: rgba(128, 173, 177, .4);
|
}
|
|
.scan {
|
display: flex;
|
padding: 10px 13%;
|
position: relative;
|
|
/deep/.u-input--border[data-v-fdbb9fe6] {
|
border: 1px solid #b5b5b5 !important;
|
}
|
|
.iconfont {
|
position: absolute;
|
right: calc(13% + 5px);
|
top: 20px;
|
color: #b5b5b5;
|
}
|
}
|
|
.table {
|
table {
|
border-collapse: collapse;
|
width: 90%;
|
margin: 0 auto;
|
}
|
|
th {
|
background-color: #f5f6f8;
|
}
|
|
table,
|
th,
|
td {
|
border: 1px solid #c6c6c6;
|
text-align: center;
|
padding: 5px;
|
}
|
|
}
|
|
.title {
|
padding: 5px 13%;
|
font-size: 1.2rem;
|
line-height: 2rem;
|
color: #818181;
|
}
|
|
.tab {
|
border-bottom: 1px solid #b5b5b5;
|
margin: 0 5%;
|
/deep/.u-tab-item[data-v-0de61367] {
|
border: 1px solid #b5b5b5;
|
border-bottom: none;
|
border-radius: 5px 5px 0 0;
|
margin: 10px 0px 0;
|
}
|
}
|
|
.list {
|
margin: 10px 5%;
|
border-radius: 5px;
|
border: 1px solid #b5b5b5;
|
font-size: 1rem;
|
|
.SKU {
|
/deep/.uni-input-input {
|
width: 5rem;
|
}
|
}
|
|
>view {
|
display: flex;
|
align-items: center;
|
padding: 0 10%;
|
line-height: 1.8rem;
|
|
/deep/.uni-input-input {
|
background-color: #f5f5f5;
|
border-radius: 15px;
|
height: 1.7rem;
|
width: 98%;
|
padding-left: 5px;
|
display: flex;
|
align-items: center;
|
}
|
}
|
|
.bottom {
|
display: flex;
|
justify-content: space-around;
|
|
>view {
|
text-align: center;
|
|
/deep/.uni-input-input {
|
width: 3.5rem;
|
text-align: center;
|
}
|
}
|
|
.sort {
|
/deep/.uni-input-input {
|
background-color: #f5f5f5;
|
width: 3.5rem;
|
text-align: center;
|
}
|
|
/deep/.u-input--border[data-v-fdbb9fe6] {
|
height: 1.7rem;
|
display: flex;
|
align-items: center;
|
}
|
}
|
}
|
}
|
|
.choose {
|
display: flex;
|
margin: 0 5%;
|
font-size: 1rem;
|
color: #b5b5b5;
|
|
>view {
|
margin: 0 10px;
|
}
|
}
|
|
.btn {
|
margin: 21px 5%;
|
display: flex;
|
justify-content: space-between;
|
|
.u-btn {
|
width: 48%;
|
margin: 10px 0px;
|
}
|
}
|
</style>
|
