SmartStorage/pages/exitMaterialSelect/exitMaterialSelect.vue

462 lines
15 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view>
<view class="search-bar">
<uni-easyinput
prefixIcon="search"
v-model="inputs"
placeholder="请输入名称"></uni-easyinput>
</view>
<view class="dataInfo">
<view
class="dataList"
v-for="(item, index) in searchData"
:key="index">
<checkbox-group @change="checkClick(item)">
<checkbox :checked="item.checked" />
</checkbox-group>
<view class="details">
<!-- <view class="img">
<image :src="item.url"></image>
</view> -->
<view class="text">
<text>类型名称{{ item.typeName }}</text>
<text>规格编号{{ item.typeCode }}</text>
<text>当前在用量{{ item.num }}</text>
<view
>退料数量<uni-easyinput
style="margin-top: 15rpx"
v-model="item.offNum"
placeholder="请输入"
@change="exitNumChange($event, index)"
type="number"></uni-easyinput
></view>
</view>
</view>
<!-- <view class="action">
<text @click="reduce(item)">-</text>
<text>{{item.offNum}}</text>
<text @click="add(item)">+</text>
</view> -->
</view>
</view>
<view class="buy" style="background-color: #fff">
<view class="checked">
<checkbox-group @tap="checkAll">
<checkbox :checked="allChecked" />
</checkbox-group>
<text>全选</text>
</view>
<view class="total">
<!-- {{ totalNum }} -->
<view class="bill" @click="finishCart">
<text>提交</text>
</view>
</view>
</view>
</view>
</template>
<script>
import { basePath } from "../../public";
export default {
data() {
return {
iptVal: "",
allChecked: false,
inputs: "",
list: [],
totalFine: "",
cartList: [],
agreementId: "",
submitList: {
parentId: "",
taskId: "",
backApplyDetails: "",
},
taskId: "",
};
},
computed: {
totalNum() {
//总计
var str = 0;
for (var i = 0; i < this.searchData.length; i++) {
if (this.searchData[i].checked) {
str += this.searchData[i].num;
}
}
this.totalFine = str;
return str;
},
searchData: function () {
//模糊查询
if (!this.inputs) {
return this.list;
}
return this.list.filter((item) => {
return item.typeName.includes(this.inputs);
});
},
},
methods: {
iconClick() {
console.log(this.iptVal);
},
add(item) {
//加加
let num = item.offNum;
/* if (num >= item.num) {
uni.showToast({
icon: 'none',
title: '退料数量不可大于当前在用量!'
})
} else { */
item.offNum = num + 1;
// }
},
reduce(item) {
//减减
let num = item.offNum;
if (num > 1) {
num -= 1;
} else if ((num = 1)) {
uni.showToast({
icon: "none",
title: "该器具无法再减少",
});
}
item.offNum = num;
},
// 单个商品的选择
checkClick(item) {
item.checked = !item.checked;
if (!item.checked) {
this.allChecked = false;
} else {
// 判断每一个商品是否是被选择的状态
const goods = this.list.every((item) => {
return item.checked === true;
});
if (goods) {
this.allChecked = true;
} else {
this.allChecked = false;
}
}
},
checkAll() {
this.allChecked = !this.allChecked;
if (this.allChecked) {
this.list.map((item) => {
item.checked = true;
});
} else {
this.list.map((item) => {
item.checked = false;
});
}
},
finishCart() {
let that = this;
that.cartList = that.list.filter((item) => {
return item.checked == true && item.offNum > 0;
});
console.log(that.cartList);
if (that.cartList.length == 0) {
uni.showToast({
icon: "none",
title: "请选择退料数量大于0的退料项",
});
} else {
uni.showModal({
title: "退料选择",
content: "确认提交吗?",
confirmText: "提交",
success: (modalRes) => {
if (modalRes.confirm) {
console.log(this.cartList);
that.submitList.backApplyDetails =
that.cartList.map((item) => {
return {
typeId: item["typeId"],
preNum: item["offNum"],
createBy:
uni.getStorageSync("userInfo")
.userid,
companyId: item["companyId"],
};
});
// 提交退料清单
let setArr = [];
that.submitList.backApplyDetails.forEach(
(list) => {
setArr.push(list.companyId);
}
);
let set = new Set(setArr);
console.log(set.size);
if (set.size == 1) {
that.submitList.companyId =
that.submitList.backApplyDetails[0].companyId;
that.submitList.taskId = that.taskId;
this.submitList.agreementId = this.agreementId
console.log(that.submitList);
that.$api.exitMaterial
.subExitMaterial(that.submitList)
.then((res) => {
console.log(res);
if (res.data.code == 200) {
uni.showToast({
icon: "none",
title: res.data.msg,
success: () => {
uni.navigateBack();
},
});
} else {
uni.showToast({
icon: "none",
title: res.data.msg,
});
}
})
.catch((err) => {
console.log(err);
});
} else {
uni.showToast({
icon: "none",
title: "无法同时退料机具设备和调试设备!",
});
}
}
},
});
}
},
exitNumChange(e, index) {
let that = this;
let numTest = /^\+?[1-9]\d*$/;
console.log(e, that.list[index].num);
if (!numTest.test(e)) {
uni.showToast({
icon: "none",
title: "退料数量输入有误!",
success: () => {
that.list[index].offNum = 0;
},
});
} else if (e > that.list[index].num) {
uni.showToast({
icon: "none",
title: "退料数量不得大于当前在用量!",
success: () => {
that.list[index].offNum = 0;
},
});
}
},
},
onLoad(params) {
let that = this;
console.log(params);
that.agreementId = params.agreeId;
that.submitList.parentId = params.id;
that.taskId = params.taskId;
// 退料物料选择
that.$api.exitMaterial
.selectMaterial({
agreementId: params.agreeId,
})
.then((res) => {
console.log(res);
if (res.data.code == 200) {
if (res.data.data.length == 0) {
uni.showToast({
icon: "none",
title: "当前物料已退完,请重新领料!",
});
} else {
for (let i = 0; i < res.data.data.length; i++) {
res.data.data[i].num = Number(
res.data.data[i].num.split(".")[0]
);
res.data.data[i].offNum = 0;
}
console.log(res);
that.list = res.data.data;
}
}
})
.catch((err) => {
console.log(err);
});
},
};
</script>
<style>
body {
box-sizing: border-box;
padding-bottom: 10vh;
}
.search-bar {
width: 95%;
margin: 20rpx auto;
}
/deep/uni-checkbox .uni-checkbox-input {
border-radius: 50%;
}
/deep/uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked {
border-color: #ddd;
color: #fff !important;
background-color: #2dcf8c !important;
}
/deep/uni-checkbox .uni-checkbox-input {
border-color: #ddd;
}
/deep/uni-checkbox .uni-checkbox-input:hover {
border-color: #ddd;
}
.search {
padding-top: 20rpx;
}
.search .searchIput {
background-color: #e6e6e6;
width: 95%;
margin: 0 auto;
height: 72rpx;
line-height: 72rpx;
border-radius: 50rpx;
padding: 0 32rpx;
box-sizing: border-box;
display: flex;
align-items: center;
}
.search .searchIput input {
font-size: 26rpx;
width: 100%;
color: grey;
}
.search .searchIput image {
width: 34rpx;
height: 34rpx;
}
.dataInfo {
width: 95%;
margin: 0 auto;
}
.dataInfo .dataList {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2px solid #f1f1f1;
padding: 25rpx 0;
}
.dataInfo .dataList .details {
display: flex;
align-items: center;
flex: 1;
font-size: 0;
}
.dataInfo .dataList .details .img image {
width: 200rpx;
height: 140rpx;
padding: 0 20rpx;
}
.dataInfo .dataList .details .text text {
color: #000;
font-size: 23rpx;
display: block;
padding: 10rpx 0;
}
.dataInfo .dataList .details .text {
color: red;
font-size: 25rpx;
}
.dataInfo .dataList .action text {
font-size: 25rpx;
color: #000;
border: 1px solid #c8c7cc;
display: inline-block;
line-height: 50rpx;
width: 60rpx;
text-align: center;
box-sizing: border-box;
}
.dataInfo .dataList .action text:nth-child(2) {
border-left: none;
border-right: none;
}
.buy {
display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
left: 50%;
bottom: 0;
width: 95%;
transform: translate(-50%, 0);
}
.buy .checked {
display: flex;
align-items: center;
}
.buy .checked text {
font-size: 25rpx;
color: #000;
padding: 0 12rpx;
}
.buy .total {
display: flex;
align-items: center;
justify-content: space-between;
}
.buy .total .price {
padding-right: 20rpx;
}
.buy .total .price text {
font-size: 27rpx;
color: #c8c7cc;
display: inline-block;
}
.buy .total .price text:last-child {
color: red;
font-weight: bold;
}
.buy .total .bill text {
font-size: 25rpx;
color: #fff;
display: inline-block;
background-color: red;
line-height: 70rpx;
width: 150rpx;
text-align: center;
}
</style>