733 lines
25 KiB
Vue
733 lines
25 KiB
Vue
<template>
|
|
<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.photoUrl"></image>
|
|
</view>
|
|
<view class="text">
|
|
<text>{{ item.parentName }}</text>
|
|
<text>规格：{{ item.typeName }}</text>
|
|
<!-- <text>￥{{item.price}}</text> -->
|
|
</view>
|
|
</view>
|
|
<view class="action">
|
|
<text @click="reduce(item)">-</text>
|
|
<text>{{ item.bookNum }}</text>
|
|
<text @click="add(item)">+</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <button @click="delCart">删除</button> -->
|
|
<view class="buy">
|
|
<view class="checked">
|
|
<checkbox-group @tap="checkAll">
|
|
<checkbox :checked="allChecked" />
|
|
</checkbox-group>
|
|
<text>全选</text>
|
|
</view>
|
|
<view class="total">
|
|
<!-- <view class="price">
|
|
<text>总计：</text>
|
|
<text>￥{{totalPrice}}</text>
|
|
</view> -->
|
|
<view class="bill" @click="finishCart">
|
|
<text>确认申请</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<uni-popup ref="popup" type="center" :mask-click="false">
|
|
<view class="popup">
|
|
<view class="pop-top">
|
|
<h4>部门工程选择</h4>
|
|
<uni-icons
|
|
style="color: #aaaaaa; font-weight: bold"
|
|
type="closeempty"
|
|
size="32"
|
|
@click="closePopup">
|
|
</uni-icons>
|
|
</view>
|
|
<view class="select-area">
|
|
<uni-forms
|
|
ref="deptForm"
|
|
:modelValue="deptFormData"
|
|
:rules="rules">
|
|
<uni-forms-item
|
|
name="leaseType"
|
|
required
|
|
label="领用类型"
|
|
label-width="100">
|
|
<uni-data-select
|
|
v-model="deptFormData.leaseType"
|
|
:localdata="leaseTypeRange"></uni-data-select>
|
|
</uni-forms-item>
|
|
<uni-forms-item
|
|
v-if="deptFormData.leaseType == 1"
|
|
name="costBearingParty"
|
|
required
|
|
label="费用承担方"
|
|
label-width="100">
|
|
<uni-data-select
|
|
v-model="deptFormData.costBearingParty"
|
|
:localdata="
|
|
costBearingPartyRange
|
|
"></uni-data-select>
|
|
</uni-forms-item>
|
|
<uni-forms-item
|
|
name="deptName"
|
|
required
|
|
label="选择部门"
|
|
label-width="100">
|
|
<uni-data-select
|
|
v-model="deptFormData.deptName"
|
|
:localdata="deptRange"
|
|
@change="deptChange"></uni-data-select>
|
|
</uni-forms-item>
|
|
<uni-forms-item
|
|
name="projName"
|
|
required
|
|
label="选择工程"
|
|
label-width="100">
|
|
<uni-data-select
|
|
v-model="deptFormData.projName"
|
|
:localdata="projRange"
|
|
@change="projChange"></uni-data-select>
|
|
</uni-forms-item>
|
|
<button class="submit-btn" @click="formSubmit">
|
|
保存
|
|
</button>
|
|
</uni-forms>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import { basePath } from "../../public";
|
|
export default {
|
|
data() {
|
|
return {
|
|
allChecked: false,
|
|
inputs: "",
|
|
list: [],
|
|
delList: [],
|
|
delArr: [],
|
|
totalFine: "",
|
|
totalGoods: [],
|
|
sendData: {},
|
|
deptFormData: {
|
|
deptName: "",
|
|
projName: "",
|
|
agreementId: null,
|
|
agreementCode: null,
|
|
leaseType: 0,
|
|
costBearingParty: "",
|
|
unitId: "",
|
|
},
|
|
deptRange: [],
|
|
leaseTypeRange: [
|
|
{ text: "工程租赁", value: 0 },
|
|
{ text: "长期领用", value: 1 },
|
|
],
|
|
costBearingPartyRange: [
|
|
{ text: "01", value: "01" },
|
|
{ text: "03", value: "03" },
|
|
],
|
|
projRange: [],
|
|
rules: {
|
|
deptName: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: "请选择部门！",
|
|
},
|
|
],
|
|
},
|
|
leaseType: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: "请选择租赁方式！",
|
|
},
|
|
],
|
|
},
|
|
projName: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: "请选择工程！",
|
|
},
|
|
],
|
|
},
|
|
},
|
|
};
|
|
},
|
|
computed: {
|
|
totalPrice() {
|
|
//总计金额
|
|
var str = 0;
|
|
for (var i = 0; i < this.searchData.length; i++) {
|
|
if (this.searchData[i].checked) {
|
|
str +=
|
|
this.searchData[i].num * this.searchData[i].price;
|
|
}
|
|
}
|
|
this.totalFine = str;
|
|
return str;
|
|
},
|
|
searchData: function () {
|
|
//模糊查询
|
|
if (!this.inputs) {
|
|
return this.list;
|
|
}
|
|
return this.list.filter((item) => {
|
|
return item.name.includes(this.inputs);
|
|
});
|
|
},
|
|
},
|
|
methods: {
|
|
async projChange(e) {
|
|
// console.log(e, "单位变更时====");
|
|
const { data: res } =
|
|
await this.$api.exitMaterial.ifAgreementNew({
|
|
projectId: e,
|
|
unitId: this.deptFormData.unitId,
|
|
});
|
|
|
|
this.deptFormData.agreementCode = res.data.agreementCode;
|
|
this.deptFormData.agreementId = res.data.agreementId;
|
|
|
|
console.log(res, "获取协议id");
|
|
},
|
|
add(item) {
|
|
//加加
|
|
let that = this;
|
|
let num = item.bookNum;
|
|
item.bookNum = num + 1;
|
|
that.$api.fetchMaterial
|
|
.itemNumChange({
|
|
id: item.id,
|
|
bookNum: item.bookNum,
|
|
})
|
|
.then((res) => {
|
|
console.log(res);
|
|
});
|
|
},
|
|
reduce(item) {
|
|
//减减
|
|
let that = this;
|
|
let num = item.bookNum;
|
|
if (num > 1) {
|
|
num -= 1;
|
|
} else if ((num = 1)) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "该器具无法再减少",
|
|
});
|
|
}
|
|
item.bookNum = num;
|
|
that.$api.fetchMaterial
|
|
.itemNumChange({
|
|
id: item.id,
|
|
bookNum: item.bookNum,
|
|
})
|
|
.then((res) => {
|
|
console.log(res);
|
|
});
|
|
},
|
|
// 单个商品的选择
|
|
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.totalGoods = that.list.filter((item) => {
|
|
return item.checked == true;
|
|
});
|
|
if (that.totalGoods.length == 0) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "未选择任何商品！",
|
|
});
|
|
} else {
|
|
that.$refs.popup.open();
|
|
}
|
|
},
|
|
formatDate(value) {
|
|
if (typeof value == "undefined") {
|
|
return "";
|
|
} else {
|
|
let date = new Date(parseInt(value));
|
|
let y = date.getFullYear();
|
|
let MM = date.getMonth() + 1;
|
|
MM = MM < 10 ? "0" + MM : MM;
|
|
let d = date.getDate();
|
|
d = d < 10 ? "0" + d : d;
|
|
let h = date.getHours();
|
|
h = h < 10 ? "0" + h : h;
|
|
let m = date.getMinutes();
|
|
m = m < 10 ? "0" + m : m;
|
|
let s = date.getSeconds();
|
|
s = s < 10 ? "0" + s : s;
|
|
return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
|
|
}
|
|
},
|
|
closePopup() {
|
|
this.$refs.popup.close();
|
|
},
|
|
|
|
async getgreementId() {
|
|
const params = {
|
|
unitId: this.deptFormData.deptName,
|
|
projectId: this.deptFormData.projName,
|
|
};
|
|
const res = await this.$api.exitMaterial.ifAgreement(params);
|
|
if (res.data.code == 200) {
|
|
this.deptFormData = {
|
|
...this.deptFormData,
|
|
...res.data.data,
|
|
};
|
|
} else {
|
|
this.deptFormData.deptName = "";
|
|
this.deptFormData.projName = "";
|
|
|
|
uni.showToast({
|
|
duration: 1000,
|
|
title: "当前单位和工程未上传协议",
|
|
});
|
|
}
|
|
console.log("getgreementId ==============", res);
|
|
},
|
|
|
|
async formSubmit() {
|
|
// await this.getgreementId();
|
|
// if ((this.deptFormData.deptName = "")) {
|
|
// return;
|
|
// }
|
|
let that = this;
|
|
that.$refs.deptForm.validate().then((formData) => {
|
|
console.log(formData, that.totalGoods);
|
|
that.totalGoods = that.totalGoods.map((item) => {
|
|
return {
|
|
id: item["id"],
|
|
createBy:
|
|
uni.getStorageSync("userInfo").sysUser.userName,
|
|
companyId: item["companyId"],
|
|
status: "0",
|
|
// createTime: that.formatDate(new Date().getTime()),
|
|
typeId: item["typeId"],
|
|
preNum: item["bookNum"],
|
|
};
|
|
});
|
|
that.sendData = {
|
|
companyId:
|
|
uni.getStorageSync("userInfo").sysUser.companyId,
|
|
createBy:
|
|
uni.getStorageSync("userInfo").sysUser.userName,
|
|
unitId: formData.deptName,
|
|
projectId: formData.projName,
|
|
agreementId: that.deptFormData.agreementId,
|
|
agreementCode: that.deptFormData.agreementCode,
|
|
leaseType: that.deptFormData.leaseType,
|
|
costBearingParty: that.deptFormData.costBearingParty,
|
|
taskType: 29,
|
|
types: 2,
|
|
taskStatus: 31,
|
|
// createTime: that.formatDate(new Date().getTime()),
|
|
leaseApplyInfo: {
|
|
leasePerson:
|
|
uni.getStorageSync("userInfo").sysUser.userName,
|
|
phone: uni.getStorageSync("userInfo").sysUser
|
|
.phonenumber,
|
|
},
|
|
leaseApplyDetails: that.totalGoods,
|
|
};
|
|
console.log(
|
|
"that.sendData =================== ",
|
|
that.sendData
|
|
);
|
|
// 提交预约商品
|
|
that.$api.fetchMaterial
|
|
.subCart(that.sendData)
|
|
.then((res) => {
|
|
console.log(res);
|
|
if (res.data.code == 200) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: res.data.msg,
|
|
success: () => {
|
|
uni.redirectTo({
|
|
url: "/pages/orderCart/orderCart",
|
|
});
|
|
},
|
|
});
|
|
} else {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: res.data.msg,
|
|
});
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
that.$refs.popup.close();
|
|
});
|
|
},
|
|
deptChange(e) {
|
|
this.deptFormData.unitId = e;
|
|
let that = this;
|
|
console.log(e);
|
|
// 切换部门时展示工程
|
|
this.$api.fetchMaterial
|
|
.getProjList(
|
|
{
|
|
id: e,
|
|
},
|
|
null
|
|
)
|
|
.then((res) => {
|
|
console.log(res);
|
|
if (res.data.code == 200) {
|
|
that.projRange = res.data.data.map((item) => {
|
|
return {
|
|
text: item["name"],
|
|
value: item["id"],
|
|
};
|
|
});
|
|
}
|
|
})
|
|
.catch((err) => {});
|
|
},
|
|
},
|
|
|
|
onNavigationBarButtonTap() {
|
|
let that = this;
|
|
that.delArr = [];
|
|
let isChecked = that.list.every((item) => {
|
|
return item.checked == false;
|
|
});
|
|
if (that.list.length != 0 && isChecked == false) {
|
|
uni.showModal({
|
|
title: "删除商品",
|
|
content: "确认删除商品吗？",
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
that.delList = that.list.filter((item) => {
|
|
return item.checked != false;
|
|
});
|
|
/* that.list = that.list.filter((item) => {
|
|
return item.checked == false
|
|
}) */
|
|
/* uni.showToast({
|
|
icon: 'none',
|
|
title: '商品删除成功！'
|
|
}) */
|
|
for (let i = 0; i < that.delList.length; i++) {
|
|
that.delArr.push(that.delList[i].id);
|
|
}
|
|
that.$api.fetchMaterial
|
|
.delCart(JSON.stringify(that.delArr))
|
|
.then((res) => {
|
|
console.log(res);
|
|
if (res.data.code == 200) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: res.data.msg,
|
|
success: () => {
|
|
uni.redirectTo({
|
|
url: "/pages/orderCart/orderCart",
|
|
});
|
|
},
|
|
});
|
|
} else {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "删除商品失败！",
|
|
});
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
},
|
|
onShow() {
|
|
let that = this;
|
|
/* if (uni.getStorageSync('goodList').length != 0) {
|
|
that.list = uni.getStorageSync('goodList')
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '预约车内暂无设备！'
|
|
})
|
|
} */
|
|
// 初始化查询全部部门
|
|
that.$api.fetchMaterial
|
|
.getDeptList()
|
|
.then((res) => {
|
|
if (res.data.code == 200) {
|
|
that.deptRange = res.data.data.map((item) => {
|
|
return {
|
|
text: item["name"],
|
|
value: item["id"],
|
|
};
|
|
});
|
|
console.log(that.deptRange);
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
// 初始化查询预约车内所有商品
|
|
that.$api.fetchMaterial
|
|
.getCartDetail()
|
|
.then((res) => {
|
|
if (res.data.code == 200) {
|
|
for (let i = 0; i < res.data.data.length; i++) {
|
|
res.data.data[i].checked = false;
|
|
}
|
|
that.list = res.data.data;
|
|
}
|
|
console.log(that.list);
|
|
if (that.list.length == 0) {
|
|
uni.showToast({
|
|
icon: "none",
|
|
title: "预约车内暂无商品！",
|
|
});
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
body {
|
|
box-sizing: border-box;
|
|
padding-bottom: 10vh;
|
|
}
|
|
|
|
/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 text:last-child {
|
|
/* 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;
|
|
border-radius: 30rpx;
|
|
background: linear-gradient(#fe4a3f, #ff9600);
|
|
line-height: 70rpx;
|
|
width: 150rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.popup {
|
|
width: 80vw;
|
|
height: 50vh;
|
|
background-color: #fff;
|
|
border-radius: 15rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.popup > .pop-top {
|
|
width: 100%;
|
|
height: 5vh;
|
|
background-color: #f5f5f5;
|
|
box-sizing: border-box;
|
|
padding: 0 25rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.popup > .select-area {
|
|
width: 85%;
|
|
height: 70%;
|
|
margin: 40rpx auto;
|
|
}
|
|
|
|
.popup > .select-area > .submit-btn {
|
|
background-color: #409eff;
|
|
color: #fff;
|
|
}
|
|
</style>
|