<template>
<view class="checkSubmit">
<view class="form-box" style="margin:0 30rpx">
<uni-forms ref="baseForm" label-position="left">
<view class="commons-title">
接班人员
</view>
<uni-forms-item label="接班人员" required>
<picker @change="bindPickerChange2" :range="userList" range-key="nickName">
<view class="" style="text-align: right;display: flex;justify-content: space-between;padding-top:20rpx">
<view class="" style="color:#999">
{{successorName || '请选择接班人员'}}
</view>
<uni-icons type="forward" size="20"></uni-icons>
</view>
</picker>
</uni-forms-item>
<view class="commons-title">
转班明细
</view>
<view style="border-bottom: 1rpx solid #000;" v-for="(i,index) in formData" :key="i.qrCode">
<uni-forms-item label="物料名称" required>
<view>
<view class="" style="text-align: right;display: flex;justify-content: space-between;padding-top:20rpx">
<view class="" style="color:#999" @click="openSelectQd(index)">
{{i.qrCodeName || '请选择物料或者扫描二维码'}}
</view>
<uni-icons type="scan" @click="scanCode(index)" size="20"></uni-icons>
<uni-icons @click="openSelectQd(index)" type="forward" size="20"></uni-icons>
</view>
</view>
</uni-forms-item>
<view style="width:90%">
<uni-forms-item label="称重结果" required>
<uni-easyinput v-model="i.weighingResults" />
<span style="position: absolute;right:-80rpx;top:10px">kg</span>
</uni-forms-item>
</view>
<uni-forms-item label="有无外包装" required>
<switch style="transform:scale(0.8)" @change="(e)=>switchChange(e,index,'outerPackaging')" />
</uni-forms-item>
<uni-forms-item label="有无卷芯" required>
<switch style="transform:scale(0.8)" @change="(e)=>switchChange(e,index,'convolution')" />
</uni-forms-item>
</view>
</uni-forms>
<button size="mini" type="default" style="width: 500rpx;margin: 20rpx auto;display: block;"
@click="add()">
添加明细
</button>
</view>
<view class="submit-box">
<view class="" style="line-height: 80rpx;text-align: center;">
本次转班：{{formData.length}} 件
</view>
<button @click="addShift" style="background: #0066CC;color:#fff;margin-bottom: 30rpx;">提交</button>
</view>
<uni-popup ref="popup" type="top">
<view class="search-box">
<uni-search-bar @confirm="getMaterial" v-model="req.materialName" @cancel="reload">
</uni-search-bar>
<ul>
<li @click="selectMaterialList(i)" v-for="i in materialList" :key="i.id">
{{i.name}}
</li>
</ul>
</view>
</uni-popup>
</view>
</template>
<script>
import {
getInfo
} from "@/util/api.js";
import Vue from 'vue'
import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue'
import {
dateFormat,
getTime
} from '../../util/uitl.js'
export default {
components: {
htzImageUpload,
},
data() {
return {
req:{
materialName:null,
},
formData: [],
userList:[],
materialList:[],
successorName:null,
successorId:null,
userData:null,
materialIndex:null,
}
},
onLoad(option) {
const v = this
v.getUser()
uni.getStorage({
key: "userInfo",
success(_data) {
v.userData = _data.data
},
fail() {
}
})
//v.getMaterial()
},
methods: {
selectMaterialList(i){
const v = this
console.log(i)
v.formData[v.materialIndex].qrCode = null
v.formData[v.materialIndex].qrCodeName = i.name
v.formData[v.materialIndex].quantity = null
v.formData[v.materialIndex].materialId = i.id
console.log(v.formData)
},
addShift(){
const v = this
console.log(v.formData,123123123)
if(!v.successorId){
uni.showToast({
icon:'none',
title: '请选择交接人员',
duration: 2000
});
return
}
if(v.formData.length == 0){
uni.showToast({
icon:'none',
title: '请添加明细',
duration: 2000
});
return
}
for (var i = 0; i < v.formData.length; i++) {
const element = v.formData[i]
element.shiftHandoverPersonneId = v.userData.id
element.successorId = v.successorId
element.count = v.formData.length
console.log(element.weighingResults)
if(element.weighingResults == 0 || !element.weighingResults){
uni.showToast({
icon:'none',
title: '请填写物料剩余数量',
duration: 2000
});
return
}
if(!element.materialId){
uni.showToast({
icon:'none',
title: '请选择物料',
duration: 2000
});
return
}
}
v.$post('/mgr/shiftChange/addShift',v.formData).then(res=>{
if(res.code == 200){
uni.showToast({
title: '提交成功，跳转中！'
})
setTimeout(()=>{
wx.reLaunch({
url: '/pages/home'
})
},500)
}
})
},
add(){
const v = this
v.formData.push({
shiftHandoverPersonneId:null,
successorId:null,
qrCode:null,
qrCodeName:null,
materialId:null,
quantity:null,
convolution:0,
outerPackaging:0,
weighingResults:0,
})
},
scanCode(index) {
const v = this
uni.scanCode({
onlyFromCamera: true,
success: function(res) {
uni.showToast({
icon: "loading",
title: '加载中',
duration: 1500
});
v.$post('/wx/common/gerMaterialInfoByQrcode', {
qrCode: res.result
}).then(res => {
if(res.code == 200){
v.formData[index].qrCode = res.data.qrCode
v.formData[index].qrCodeName = res.data.materialName
v.formData[index].quantity = res.data.quantity
v.formData[index].materialId = res.data.materialId
}
})
}
});
},
//打开搜索
openSelectQd(index){
const v = this
v.materialIndex = index
this.$refs.popup.open('top')
},
reload(){
this.req.keyword = null
this.getMaterial()
},
//物料信息
getMaterial(){
const v = this
v.$post('/wx/common/getMaterial',v.req).then(res=>{
if(res.code == 200){
v.materialList = res.data
}
})
},
//用户信息
getUser(){
const v = this
v.$post('/wx/common/getUser',v.formData).then(res=>{
if(res.code == 200){
v.userList = res.data
}
})
},
switchChange(e,index,key){
const v = this
e.detail.value ? v.formData[index][key] = 1 : v.formData[index][key] = 0
console.log(v.formData)
},
//选择人员
bindPickerChange2(e){
const v = this
console.log(v.userList[e.detail.value])
v.successorName = v.userList[e.detail.value].nickName
v.successorId = v.userList[e.detail.value].userId
},
},
}
</script>
<style lang="less">
.checkSubmit {
.search-box{
background-color: #fff;
ul{
li{
height: 80rpx;
line-height: 80rpx;
padding: 0 30rpx;
border-bottom: 1rpx solid #dcdcdc;
}
}
}
.submit-box {
padding: 0 30rpx;
}
.dtl {
padding: 30rpx;
border-bottom: 1rpx solid #dcdcdc;
font-size: 26rpx;
line-height: 40rpx;
}
.addQrcode-list {
height: 80rpx;
display: flex;
justify-content: space-between;
padding: 15rpx;
border-bottom: 1rpx solid #dcdcdc;
font-size: 24rpx;
.fl {
display: flex;
.code {
margin-right: 20rpx;
}
}
.fr {
line-height: 80rpx;
}
}
}
.popup-input-warp {
padding: 30rpx 40rpx;
}
.txt {
margin-bottom: 20rpx;
}
.imglist {
display: flex;
flex-wrap: wrap;
}
.imglist .item {
width: 150rpx;
height: 150rpx;
margin-right: 22rpx;
margin-bottom: 10rpx;
position: relative;
}
.imglist .last-item {
width: 150rpx;
height: 150rpx;
text-align: center;
line-height: 146rpx;
border: 2rpx dashed #8B97A9;
box-sizing: border-box;
}
.imglist .item image {
width: 100%;
height: 100%;
}
.imglist .item .delete {
width: 30rpx;
height: 30rpx;
position: absolute;
top: -25rpx;
right: -12rpx;
font-size: 40rpx;
font-weight: bold;
}
</style>