<template>
|
<view class="overflow">
|
<cu-custom bgColor="bg-white" :isBack="true">
|
<block slot="backText">
|
</block>
|
<block slot="content">借用归还</block>
|
</cu-custom>
|
<view class="flex justify-end align-center padding_right30rpx padding_top12rpx">
|
<text class="fontSize12rpx"> 操作人:{{operator}} </text>
|
</view>
|
<!-- <view class="text-bold width fontSize32rpx">
|
<view class="flex justify-between align-center" style="padding: 10rpx 10rpx;background-color: #d6d6d6;">
|
<text class="width23 padding10">借用人</text>
|
<text>{{borrower}}</text>
|
</view>
|
<view class="flex justify-between align-center margin_top10rpx" style="padding: 10rpx 10rpx;background-color: #d6d6d6;">
|
<text class="width23 padding10">借用单号</text>
|
<text>{{borrowNo}}</text>
|
</view>
|
</view> -->
|
<u-form labelPosition="top" :model="warehouse" ref="warehouseRef">
|
<u-row class="border_bottom margin_top10rpx padding10" style="background-color: #fff;">
|
<u-col span="10">
|
<u-form-item label="借用人:" prop="containerCode" required
|
style="font-size: 16px;font-weight: bold;padding: 0;">
|
<input v-model="warehouse.containerCode" placeholder="请录入或扫码" @focus="focu=true"
|
@blur="getContainerDetails" style="font-weight: bolder;margin-left: 15rpx;"
|
class="width padding_left25rpx">
|
</input>
|
<u-icon name="close-circle-fill" color="#848484" v-if="warehouse.containerCode && focu"
|
@click="warehouse.containerCode=''"></u-icon>
|
</u-form-item>
|
</u-col>
|
<u-col span="2">
|
<u-icon class="iconfont icon-saoma fontSize60rpx"></u-icon>
|
</u-col>
|
</u-row>
|
<u-row class="border_bottom margin_top10rpx padding10" style="background-color: #fff;">
|
<u-col span="10">
|
<u-form-item label="借用单号:" prop="materialCode" required
|
style="font-size: 16px;font-weight: bold;padding: 0;">
|
<text class="padding_left30rpx fontSize36rpx" :class="warehouse.materialCode?'':'text-80'"
|
style="font-weight: bolder;">{{warehouse.materialCode?warehouse.materialCode:'请选择借用单号'}}</text>
|
<u-select v-model="modalshow" :list="wolist" @confirm="confirm"></u-select>
|
</u-form-item>
|
</u-col>
|
<u-col span="2">
|
<u-icon name="arrow-down" class="padding_left30rpx" @tap="openOrder"></u-icon>
|
</u-col>
|
</u-row>
|
</u-form>
|
<modal-code :rescode='rescode' :resmessage='resmessage' ref="resmodal" />
|
<view v-if="singlist.length>0" :style="'height:calc(100vh - '+(CustomBar+155)+'px'">
|
<view class="margin_top10rpx overflow_auto" style="height:calc(100% - 265rpx)">
|
<scroll-view scroll-y="true">
|
<u-swipe-action :show="item.show" :index="eindex" v-for="(item, eindex) in singlist" :key="eindex"
|
@click="longpress" @open="open" @close='close' :options="options">
|
<view class="item u-border-bottom">
|
<!-- 此层wrap在此为必写的,否则可能会出现标题定位错误 -->
|
<view class="title-wrap">
|
<view :key="eindex+'singlist'"
|
:class="item.cardNum?'bd-ffe6c9':item.edit?'clickactive':''"
|
class="fontSize32rpx width margin_auto background_fff padding15 border_radius margin_bottom10rpx relative box_sizing transition">
|
<u-row>
|
<u-col span="12" class="flex align-center">
|
<view class="flex justify-center align-center"
|
style="background-color: #f18202;color: #fff;border-radius: 50vh;width: 20px;height: 20px;">
|
{{eindex+1}}
|
</view>
|
<view class="color_f18202 padding_left10rpx">
|
{{item.orderNo}} ({{item.wareMaterialCode}})
|
<text class="color_666666 padding_left10rpx" v-if="item.barNo"> -
|
批次:{{item.barNo}}</text>
|
</view>
|
</u-col>
|
</u-row>
|
<u-row>
|
<u-col span="4">
|
<view class="" style="padding: 10rpx 0 10rpx 45rpx;color: #808080;">
|
大类:{{item.wareMaterialSubTypeName}}
|
</view>
|
</u-col>
|
<u-col span="4">
|
<view class="" style="padding: 10rpx 0 10rpx 45rpx;color: #808080;">
|
小类:{{item.wareMaterialName}}
|
</view>
|
</u-col>
|
<u-col span="4">
|
<view class="" style="padding: 10rpx 0 10rpx 45rpx;color: #808080;">
|
借用数:{{item.quantity}}
|
</view>
|
</u-col>
|
|
</u-row>
|
<u-row>
|
<u-col span="6">
|
<input disabled=""
|
class="border_bottom_f18202 width45 fontSize32rpx text-left"
|
style="margin:10rpx 0 10rpx 45rpx;" v-model="item.unit"
|
placeholder="单位" />
|
</u-col>
|
<u-col span="5">
|
<input
|
class="border_bottom_f18202 width text-left fontSize32rpx padding_left10rpx"
|
v-model="item.requantity" type="number" @focus='dc(item)'
|
@blur="changeNum(item)" @click="clicki(item)" placeholder="请输入归还数量" />
|
</u-col>
|
</u-row>
|
</view>
|
</view>
|
</view>
|
</u-swipe-action>
|
</scroll-view>
|
</view>
|
<u-popup v-model="detailshow" border-radius="14" @close="detailshow=false" mode="bottom">
|
<view class="pop ">
|
<h2 class="text_align_center padding_bottom18 padding15">物料信息</h2>
|
<view class="line flex justify-between">
|
<text class="text-gray">物料编号</text>
|
<text>{{materlist.wareMaterialCode}}</text>
|
</view>
|
|
<view class="line flex justify-between">
|
<text class="text-gray">物料名称</text>
|
<text>{{materlist.wareMaterialName}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">物料类型</text>
|
<text>{{materlist.wareMaterialTypeName}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">物料规格</text>
|
<text>{{materlist.specificationModel}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">长(mm)</text>
|
<text>{{materlist.long}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">宽(mm)</text>
|
<text>{{materlist.width}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">高(mm)</text>
|
<text>{{materlist.high}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">重量(kg)</text>
|
<text>{{materlist.weight}}</text>
|
</view>
|
<!-- <view class="line flex justify-between">
|
<text class="text-gray">价格</text>
|
<text>{{materlist.price}}</text>
|
</view> -->
|
<view class="line flex justify-between">
|
<text class="text-gray">条码</text>
|
<text>{{materlist.barCode}}</text>
|
</view>
|
<view class="line flex justify-between">
|
<text class="text-gray">单位</text>
|
<text>{{materlist.unit}}</text>
|
</view>
|
</view>
|
</u-popup>
|
</view>
|
<button-modal :empTytowerShow='true' garmenTitle='确认' cleaningTitle='重置' @reset="reset" @submit='submit' />
|
|
</view>
|
</template>
|
|
<script>
|
import ButtonModal from '@/components/buttonModal.vue'
|
import ModalCode from '@/components/ModalCode.vue'
|
import {
|
selectpeople,
|
query,
|
borrowAdd
|
} from '@/api/receive/receive.js'
|
import {
|
getDate
|
} from '@/utils/dateTime.js'
|
export default {
|
data() {
|
return {
|
rescode: 0,
|
resmessage: "",
|
detailshow: false,
|
modalshow: false, //借用单号弹窗
|
operator: '',
|
focu: false, //清空按钮隐显
|
focuM: false, //物料隐显按钮
|
Datetime: getDate(),
|
// borrowNo:'',//借用单号
|
// borrower:'',//借用人
|
wolist: [], //借用单号
|
singlist: [
|
// {
|
// "warematerialCode": "string",
|
// "collectNo": "string",
|
// "purchaseNo": "string",
|
// "category": "string",
|
// "wareMaterialTypeName": "string",
|
// "specificationModel": "string",
|
// "long": "string",
|
// "width": "string",
|
// "high": "string",
|
// "weight": "string",
|
// "barCode": "string",
|
// "company": "string",
|
// "uncollectedQuantity": 0,
|
// "id": 0
|
// },
|
], //物料详情
|
options: [{
|
text: '详情',
|
style: {
|
backgroundColor: '#fc9f35'
|
}
|
}],
|
materlist: {},
|
warehouse: {
|
containerCode: '',
|
materialCode: ''
|
},
|
warehouseRules: {
|
containerCode: [{
|
required: true,
|
message: '借用人不能为空',
|
trigger: 'blur'
|
}],
|
materialCode: [{
|
required: true,
|
message: '借用单号不能为空',
|
trigger: 'blur'
|
}]
|
},
|
containerCodeRules: {
|
containerCode: [{
|
required: true,
|
message: '借用人不能为空',
|
trigger: 'blur'
|
}],
|
},
|
materialCodeRules: {
|
materialCode: [{
|
required: true,
|
message: '借用单号不能为空',
|
trigger: 'blur'
|
}]
|
},
|
};
|
},
|
components: {
|
ButtonModal,
|
ModalCode
|
},
|
onReady() {
|
// this.$refs.warehouseRef.setRules(this.warehouseRules)
|
},
|
mounted() {
|
this.operator = JSON.parse(uni.getStorageSync('userInfo')).name
|
},
|
methods: {
|
//查询借用人
|
getContainerDetails() {
|
this.$refs.warehouseRef.setRules(this.containerCodeRules)
|
this.$refs.warehouseRef.validate(valid => {
|
if (valid) {
|
setTimeout(() => {
|
this.focu = false
|
if (this.warehouse.containerCode !== '') {
|
selectpeople(this.warehouse.containerCode).then((res) => {
|
if (res.code == 200) {
|
res.data.forEach((item, index) => {
|
this.wolist.push({
|
key: index + 1,
|
label: item
|
})
|
})
|
if (res.data.length == 0) {
|
this.rescode = 400
|
this.resmessage = '暂无数据'
|
this.$refs.resmodal.show = true
|
return
|
}
|
} else {
|
this.resmessage = res.message
|
this.rescode = res.code
|
this.$refs.resmodal.show = true
|
}
|
})
|
}
|
}, 200)
|
}
|
})
|
},
|
//借用单号
|
openOrder() {
|
if (this.wolist.length == 0) {
|
this.resmessage = '暂无数据'
|
this.rescode = 400
|
this.$refs.resmodal.show = true
|
} else {
|
this.modalshow = true
|
}
|
},
|
//借用单号确认
|
confirm(e) {
|
this.warehouse.materialCode = e[0].label
|
this.getMaterialDetails()
|
},
|
//物料查询
|
getMaterialDetails() {
|
this.$refs.warehouseRef.setRules(this.materialCodeRules)
|
this.$refs.warehouseRef.validate(valid => {
|
if (valid) {
|
setTimeout(() => {
|
this.focuM = false
|
if (this.warehouse.materialCode !== '') {
|
query(this.warehouse.materialCode).then((res) => {
|
if (res.code == 200) {
|
this.singlist = res.data.rows
|
this.singlist.forEach(item => {
|
item.requantity = item.quantity
|
if (item.requantity > 0) {
|
item.edit = true
|
}
|
})
|
if (res.data.rows.length == 0) {
|
this.rescode = 400
|
this.resmessage = '暂无数据'
|
this.$refs.resmodal.show = true
|
return
|
}
|
res.data.rows.forEach(item => {
|
if (item.unquantity > 0) {
|
item.edit = true
|
this.$forceUpdate()
|
}
|
})
|
} else {
|
this.resmessage = res.message
|
this.rescode = res.code
|
this.$refs.resmodal.show = true
|
}
|
})
|
}
|
}, 200)
|
}
|
})
|
},
|
//删除详情
|
longpress(index, eindex) {
|
this.singlist[index].cardNum = true
|
this.materlist = this.singlist[index]
|
this.detailshow = true
|
},
|
//编辑状态样式
|
dc(e) {
|
e.cardNum = true
|
this.$forceUpdate()
|
},
|
//卡片选中
|
clicki(e) {
|
e.cardNum = true
|
this.$forceUpdate()
|
},
|
// 如果打开一个的时候,不需要关闭其他,则无需实现本方法
|
open(index) {
|
// 先将正在被操作的swipeAction标记为打开状态,否则由于props的特性限制,
|
// 原本为'false',再次设置为'false'会无效
|
this.singlist[index].cardNum = true;
|
this.$forceUpdate()
|
this.singlist[index].show = true;
|
this.singlist.map((val, idx) => {
|
if (index != idx) this.singlist[idx].show = false;
|
})
|
},
|
close(index) {
|
this.singlist[index].show = false;
|
this.singlist[index].cardNum = false;
|
this.$forceUpdate()
|
},
|
//改变组盘数量
|
changeNum(val) {
|
val.cardNum = false
|
if (val.requantity && val.requantity > 0) {
|
val.edit = true
|
this.$forceUpdate()
|
} else {
|
val.edit = false
|
this.$forceUpdate()
|
}
|
|
},
|
//全部取消
|
reset() {
|
this.singlist.forEach(item => {
|
item.unquantity = ""
|
item.edit = false
|
})
|
this.$forceUpdate()
|
},
|
//重置页面信息
|
rest() {
|
this.warehouse.containerCode = ''
|
this.warehouse.materialCode = ''
|
this.singlist.forEach(item => {
|
item.requantity = ''
|
})
|
this.singlist = []
|
},
|
//确认
|
submit() {
|
this.$refs.warehouseRef.setRules(this.warehouseRules)
|
this.$refs.warehouseRef.validate(valid => {
|
if (valid) {
|
let arr = this.singlist.filter(item => item.edit)
|
if (arr.length == 0 && this.singlist.length !== 0) {
|
uni.showModal({
|
title: '提示',
|
content: '未填写归还数量',
|
showCancel: false
|
})
|
return
|
}
|
let matatilDetails = []
|
arr.forEach(item => {
|
item.materialCode = item.code
|
item.completeQuantity = item.unquantity
|
matatilDetails.push({
|
id: item.ordersId,
|
wareMaterialCode: item.wareMaterialCode,
|
wareMaterialName: item.wareMaterialName,
|
batchNo: item.batchNo,
|
barCode: item.barCode,
|
quantity: item.requantity
|
})
|
})
|
let params = {
|
createdTime: this.Datetime,
|
updatedTime: this.Datetime,
|
createdUserId: JSON.parse(uni.getStorageSync('userInfo')).id,
|
createdUserName: JSON.parse(uni.getStorageSync('userInfo')).name,
|
updatedUserId: JSON.parse(uni.getStorageSync('userInfo')).id,
|
updatedUserName: JSON.parse(uni.getStorageSync('userInfo')).name,
|
orderType:12,
|
orderNo:this.singlist[0].orderNo,
|
data: matatilDetails
|
}
|
borrowAdd(params).then((res) => {
|
this.$refs.resmodal.show = true
|
this.rescode = res.code
|
this.resmessage = res.message
|
if (res.code == 200) {
|
this.rest()
|
}
|
})
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
|
</style>
|