购物车优化

hdApp/src/admin/billing/affirmGhs.vue

@@ -14,9 +14,10 @@
 				<view class="module-com">
 					<view class="commodity-view">
 						<view class="commodity-list">
-							<view class="commodity-item" v-for="(item, index) in list" :key="index">
+							<view class="commodity-item" v-for="(item, index) in selectList" :key="index">
 								<image class="item-icon" :src="item.cover" alt="" />
 								<view class="item-info">
+
 									<view class="info-line">
 										<text class="item-name">{{ item.itemName }}</text>
 										<text class="item-price">
@@ -26,12 +27,18 @@
 											</text>
 										</text>
 									</view>
-									<view class="info-line">
-										<text class="item-type"></text>
-										<text class="item-count">
-											<text>{{`${item.bigCount}`}}扎</text>
-										</text>
+
+									<view style="text-align:right;">
+										<view class="open-bx" >
+											<i class="iconfont iconjian" @click="delItem(item)" v-if="item.bigCount > 0 || item.smallCount > 0"></i>
+											<text class="num" @click="customUpdate(item)">
+											<text v-if="item.bigCount > 0" style="font-size:24upx;font-weight:bold;color:#3385ff;">{{ item.bigCount }}</text>
+											<text v-if="item.smallCount > 0" style="font-size:24upx;">{{ item.smallCount }}</text>
+											</text>
+											<i class="iconfont iconzeng" @click="addEvents(item)"></i>
+										</view>
 									</view>
+
 								</view>
 							</view>
 						</view>
@@ -79,6 +86,18 @@
 			</view>
 			<button class="admin-button-com blue middle" @click="affirmFormSubmit">提交</button>
 		</view>
+
+		<modal-module :show="isModel" @cancel="modalCancel" @click="affirm" :title="customData.itemName" color="#333" :size="32" padding="30upx 30upx" >
+			<template slot="customContent">
+				<view class="select-cmd_bx" v-if="customData">
+					<view class="kc"> </view>
+					<view class="num_bx">
+						<input v-model="customData.bigCount" :focus="isFocus" type="number" placeholder="扎数" />
+					</view>
+				</view>
+			</template>
+		</modal-module>
+
 	</view>
 </template>
 
@@ -100,7 +119,7 @@ import { getGhsDataApi } from "@/api/ghs/index";
 import { freight,createOrder } from "@/api/purchase/index";
 import { mapActions, mapGetters } from "vuex";
 import { shopHouponHas } from '@/api/coupon'
-
+import ModalModule from "@/components/plugin/modal";
 export default {
 	name: "BillingAffirm", // 开单确认
 	components: {
@@ -114,11 +133,13 @@ export default {
 		appAddressGroup,
 		appFormSend,
     	appTimer,
-		AppDatePicker
+		AppDatePicker,
+		ModalModule
 	},
 	mixins: [productMins],
 	data() {
 		return {
+			isModel: false,
 			pageType: "cg",
 			list:[],
 			autoLoad: false,
@@ -149,7 +170,11 @@ export default {
 			monthLater:'',
 			modifyPrice:0,
 			hasHb:0,
-			selectedHb:{couponAmount:0,hbId:0,couponSelInx:0}
+			selectedHb:{couponAmount:0,hbId:0,couponSelInx:0},
+			customData: {
+				bigCount: 0,
+				smallCount: 0
+			}
 		};
 	},
 	onLoad(e) {
@@ -190,6 +215,83 @@ export default {
 	},
 	methods: {
 		...mapActions(["initMerchantInfo"]),
+		customUpdate(item) {
+			if(item.variety == 0){
+				if(item.stock<=0){
+					uni.showToast({title:'没有货了',icon:'none'})
+					return
+				}
+				this.customNum({ ...item, bigCount: item.bigCount, smallCount: item.smallCount })
+			}else{
+				this.$msg('小菊请返回列表修改')
+			}
+		},
+		//自定义数量
+		customNum(info) {
+			this.isModel = true;
+			this.customData = info;
+			this.$nextTick(()=>{
+				this.customData.smallCount = 	this.customData.smallCount==0?null:this.customData.smallCount;
+				this.customData.bigCount = 	this.customData.bigCount==0?null:this.customData.bigCount;
+				this.isFocus = true;
+			})
+		},
+		modalCancel() {
+			this.isModel = false;
+			this.customData = {};
+		},
+		affirm(val) {
+			this.isFocus = false;
+			this.isFocusOne = false;
+			this.$nextTick(()=>{
+
+				//取消
+				if (val.index === 0) {
+					if(this.customData.bigCount>0 || this.customData.smallCount>0){
+					}else{
+						this.delAllEvent(this.customData)
+					}
+					this.modalCancel();
+					return false
+				}
+
+				//二个都不是数值
+				if(/(^[1-9]\d*$)/.test(this.customData.bigCount) == false && /(^[1-9]\d*$)/.test(this.customData.smallCount) == false){
+					this.delAllEvent(this.customData)
+					this.modalCancel();
+					return;
+				}
+
+				if(/(^[1-9]\d*$)/.test(this.customData.bigCount)){
+					if(this.customData.bigCount<=0){
+						uni.showToast({title:"数量要大于0",icon:"none"})
+						return;
+					}
+				}
+
+				if(/(^[1-9]\d*$)/.test(this.customData.smallCount)){
+					if(this.customData.smallCount<=0){
+						uni.showToast({title:"数量要大于0",icon:"none"})
+						return;
+					}
+				}
+
+				const { bigCount,smallCount,bigNum,bigUnit,smallNum,smallUnit,ratio} = this.customData;
+				const ratioNum = Number(ratio);
+				//超过库存时 设置为库存最大值 1
+				if (Number(bigCount) * ratioNum + Number(smallCount) > Number(bigNum) * ratioNum + Number(smallNum)) {
+					uni.showToast({
+						title: '库存还剩'+bigNum,
+						icon: "none"
+					});
+				} else {
+					this.updateItemEvent(this.customData)
+					this.modalCancel()
+				}
+
+			})
+
+		},
 		calcPrice(){
 			let allPrice = this.allPrice.toFixed(2)
 			this.modifyPrice = Number(allPrice)
@@ -201,6 +303,31 @@ export default {
 		init() {
 			this._getDet()
 		},
+		addEvents(item) {
+			if(item.variety == 0){
+				const ratio = Number(item.ratio);
+				if(this.offVerifyRepertory){
+					if(item.stock<=0){
+						uni.showToast({title:'没有货了',icon:'none'})
+						return
+					}
+					if (Number(this.bigCount) * ratio + Number(this.smallCount) >Number(item.bigNum) * ratio + Number(item.smallNum)) {
+						this.$msg("库存只剩"+item.bigNum);
+						return
+					}
+				}
+				this.addEvent(item)
+			}else{
+				this.$msg('小菊请返回列表修改')
+			}
+		},
+		delItem(item) {
+			if(item.variety == 0){
+				this.delEvent(item)
+			}else{
+				this.$msg('小菊请返回列表修改')
+			}
+		},
 		bindDateChange(e){
 			let date = e.detail.value
 			this.sendTimeWant = date
@@ -437,6 +564,60 @@ export default {
 								font-size: 24upx;
 							}
 						}
+
+
+			.open-bx {
+				align-items: center;
+				& .iconfont {
+					color: #3385ff;
+					font-size: 42upx;
+				}
+
+				.position{
+					display: block;
+					width: 70upx;
+					text-align: center;
+				}
+				.iconcachu {
+					margin: 0 6upx 0 20upx;
+					color: #ccc;
+					&.edit {
+						color: #3385ff;
+					}
+				}
+				& > .num {
+					display: inline-block;
+					width: 120upx;
+					height:45upx;
+					text-align:center;
+					margin: 0 8upx;
+					color: #868686;
+					border-radius: 22upx;
+					background-color: #f5f5f5;
+					padding: 3upx 0;
+					font-size: 25upx;
+				}
+				.change-input {
+					width: 164upx;
+					height: 60upx;
+					line-height: 60upx;
+					text-align: center;
+					background: #ffffff;
+					border: 1upx solid #dddddd;
+					border-radius: 4upx;
+					font-size: 25upx;
+				}
+				.btn-box{
+					width: 100upx;
+					height: 60upx;
+					line-height: 60upx;
+					color: #ffffff;
+					background: #3385ff;
+					text-align: center;
+					border-radius: 10upx;
+				}
+			}
+
 					}
 				}
 			}
@@ -549,5 +730,29 @@ export default {
 		float:left;
 	}
   }
+	.select-cmd_bx {
+		& .kc {
+			color: #999999;
+			font-size: 28upx;
+			font-weight: 400;
+			margin-bottom: 60upx;
+			text-align: center;
+			margin-top: 10upx;
+		}
+		& .num_bx {
+			display: flex;
+			align-items: center;
+			margin-bottom: 80upx;
+			& > input {
+				width: 480upx;
+				height: 80upx;
+				border: 1px solid #dddddd;
+				border-radius: 4upx;
+				text-align: center;
+				margin-left: 50upx;
+				font-size: 40upx;
+			}
+		}
+	}
 }
 </style>

hdApp/src/components/module/app-footer-cart.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="cart-ft_bx">
 		<div class="cart-ct_bx">
-			<view class="cart-lf_bx">
+			<view class="cart-lf_bx" @click="confirmEvent">
 				<view class="cart-dot_bx">
 					<i class="iconfont icongouwuche"></i>
 				</view>