成品开单

hdApp/src/admin/billing/affirmGoods.vue

@@ -0,0 +1,363 @@
+<!--姜枫 2021.04.11-->
+<template>
+	<view class="affirm-page">
+		<view class="affirm-view overscroll">
+			<!-- 门店信息 -->
+			<form>
+				<view class="module-com">
+					<view class="commodity-view">
+						<view class="commodity-list">
+							<view
+								class="commodity-item"
+								v-for="(item, index) in selectList"
+								:key="index"
+							>
+								<image class="item-icon" v-if="item.goodsStyle==1" :src="item.goodsStyleList[item.goodsStyleSelectIndex].img" alt="商品图" />
+								<image class="item-icon" v-else :src="item.smallImgList[0]" alt="商品图" />
+
+								<view class="item-info">
+									<view class="info-line">
+										<text class="item-name">{{ item.goodsName }}</text>
+										<text class="item-price">
+											<text class="unit">¥</text>
+
+<!--											<text class="price" v-if="item.goodsStyle==1"> {{ getSelectGoodsPrice(item) }}</text>-->
+											<text class="price" > {{ getSelectGoodsPrice(item) }}</text>
+										</text>
+									</view>
+									<view class="info-line">
+										<text class="item-type">{{ item.goodsStyleList[item.goodsStyleSelectIndex].styleName }}</text>
+										<text class="item-count">
+											<text v-if="item.bigCount > 0 || item.smallCount > 0">{{`${item.bigCount}`}}</text>
+										</text>
+									</view>
+								</view>
+							</view>
+						</view>
+						<view class="summary-bar">
+							<view class="operate-view" @click="gobackEvent">
+								<text class="iconfont icongouwuche"></text>
+								重选花材
+							</view>
+							<view class="describe-view">
+								共{{ allCount }}种,
+								<!-- 共16扎9支， -->
+								合计 ¥<text class="price">{{ allGoodsPrice }}</text>
+							</view>
+						</view>
+					</view>
+				</view>
+				<!-- 登录信息 -->
+				<view class="module-com input-line-wrap">
+					<tui-list-cell class="line-cell" :hover="false" :arrow="true">
+						<view class="tui-title ">客户</view>
+						<view class="tui-input" v-if="clientInfo.id" @click="showCustomer = true">{{ clientInfo.name }}</view>
+						<view class="tui-placeholder" style="width: 100%" v-else @click="showCustomer = true">请选择客户</view>
+					</tui-list-cell>
+<!--					<tui-list-cell class="line-cell" :hover="false" :arrow="false" >-->
+<!--						<view class="tui-title ">包装费</view>-->
+<!--						<input type="number" placeholder="请填写包装费和材料费" v-model="packingMoney" placeholder-class="tui-placeholder">-->
+<!--					</tui-list-cell>-->
+					<tui-list-cell class="line-cell" :hover="false" :arrow="false" >
+						<view class="tui-title ">运费</view>
+						<input type="number" placeholder="如果鲜花价格已经包含运费，请留空" v-model="freight" placeholder-class="tui-placeholder">
+					</tui-list-cell>
+					<tui-list-cell class="line-cell" :hover="false" :arrow="false">
+						<view class="tui-title ">结算方式</view>
+						<button class="admin-button-com mini-btn" :class="payType==res.id?'blue':'default'" style="margin-right: 10rpx"
+														@tap="payType=res.id"  v-for="(res,i) in getDictionariesInfo.htPayWayOption">
+							{{ res.name }}
+						</button>
+					</tui-list-cell>
+
+
+<!--					<appFormSend :form.sync="form"> </appFormSend>-->
+				</view>
+			</form>
+		</view>
+		<view class="under-bar">
+			<view class="price-view">
+				<text class="price-title">收款</text>
+				<text class="price-number">
+					¥ <text class="large">{{ Number(freight)+Number(allGoodsPrice)  }}</text>
+				</text>
+			</view>
+			<button class="admin-button-com blue middle" @click="affirmFormSubmit">开单</button>
+		</view>
+		<!-- 选择客户 -->
+		<AppCustomerSel :show.sync="showCustomer" @change="changeCustomerFn" />
+	</view>
+</template>
+
+<script>
+import TuiListCell from "@/components/plugin/list-cell";
+import AppAvatarModule from "@/components/module/app-avatar";
+import SimpleAddress from "@/components/plugin/simple-address";
+import AppAreaSel from "@/components/app-area-sel";
+import AppCustomerSel from "@/components/app-customer-sel";
+import productMins from "@/mixins/product";
+import suitProductMins from "@/mixins/suitProduct";
+
+import appFormRadioBtn from "@/components/app-formRadio-btn";
+import appAddressGroup from "@/components/app-address-group";
+import appSendTime from "@/components/app-send-time";
+import appFormSend from "@/components/app-form-send";
+const formUtil = require("@/utils/formValidation.js");
+import { createOrder,freight } from "@/api/order/index";
+// import { freight } from "@/api/order";
+import { mapActions, mapGetters } from "vuex";
+
+export default {
+	name: "BillingAffirm", // 开单确认
+	components: {
+		TuiListCell,
+		AppAvatarModule,
+		SimpleAddress,
+		AppAreaSel,
+		AppCustomerSel,
+		appFormRadioBtn,
+		appAddressGroup,
+		appSendTime,
+		appFormSend
+	},
+	mixins: [productMins,suitProductMins],
+	data() {
+		return {
+			autoLoad: false,
+			packingMoney:'',//包装费
+			freight:'',//运费
+			payType:null,//选中的-支付类型
+			clientInfo: '',//客户信息
+			showCustomer: false
+		};
+	},
+	onLoad() {
+		if (!this.getMerchantInfo) {
+			this.initMerchantInfo().then(data => {
+				uni.setNavigationBarTitle({
+					title: data.name
+				});
+			});
+		} else {
+			uni.setNavigationBarTitle({
+				title: this.getMerchantInfo.name
+			});
+		}
+	},
+	computed: {
+		...mapGetters(["getMerchantInfo", "getLoginInfo","getDictionariesInfo"])
+	},
+	methods: {
+		...mapActions(["initMerchantInfo"]),
+		// 选取客户
+		changeCustomerFn(info) {
+			console.log("changeCustomerFn", info);
+			this.clientInfo = info;
+		},
+		//确定开单
+		affirmFormSubmit(){
+			if(this.clientInfo==''){uni.showToast({title:'请选择客户！',icon:'none'});return;}
+			// if(this.packingMoney==''){uni.showToast({title:'请输入包装费！',icon:'none'});return;}
+			if(this.payType==null){uni.showToast({title:'请选择结算方式！',icon:'none'});return;}
+			const product = this.selectList.map(ele => {
+				if(ele.goodsStyle==1){
+					return {"goodsId":ele.goodsStyleList[ele.goodsStyleSelectIndex].id,"goodsStyleId":ele.goodsStyle,"goodsNum":ele.bigCount}
+				}else{
+					return {"goodsId":0,"goodsStyleId":ele.goodsStyle,"goodsNum":ele.bigCount}
+				}
+			});
+			let options = {
+				orderType:1,// 开单类型，1成品开单 2花材开单
+				sendCost:this.freight,// 运费
+				customId:this.clientInfo.id,// 客户
+				payWay:this.payType,//付款方式
+				goodsInfo:JSON.stringify(product),//下单商品
+			};
+			let self = this;
+			uni.showModal({
+				title: '提示',
+				content: '确认开单？',
+				success: function (res) {
+					if (res.confirm) {
+						createOrder(options).then(res => {
+							// this.$msg("下单成功");
+							self.resetSelectInfoByType(self.pageType);
+							const {
+								data: { orderId, orderSn }
+							} = res;
+							// 如果是客户跳转到客户成功页pagesClient/official/clientApply   供货员工下单到 /admin/billing/result
+							let url =
+								self.getLoginInfo.identity == "1"
+									? "pagesClient/official/clientApply"
+									: `/admin/billing/result?orderId=${orderId}&orderSn=${orderSn}`;
+							uni.redirectTo({url: url});
+						});
+					}
+				}
+			});
+		},
+
+
+
+		gobackEvent() {
+			uni.navigateBack({
+				delta: 1
+			});
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.admin-button-com {
+	margin-right: 20upx;
+}
+.affirm-page {
+	position: relative;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+
+	.affirm-view {
+		flex: 1;
+		padding: 20px;
+		background-color: #f0f2f6;
+
+		.commodity-view {
+			display: flex;
+			flex-direction: column;
+			.commodity-list {
+				padding: 20px;
+				.commodity-item {
+					display: flex;
+					margin-bottom: 20px;
+					.item-icon {
+						flex-shrink: 0;
+						width: 140px;
+						height: 140px;
+					}
+					.item-info {
+						display: flex;
+						flex-direction: column;
+						justify-content: center;
+						flex: 1;
+						margin-left: 20px;
+						.info-line {
+							margin-bottom: 20px;
+							display: flex;
+							justify-content: space-between;
+							align-items: flex-end;
+							.item-name {
+								color: #666;
+								font-size: 28px;
+							}
+							.item-price {
+								color: #333;
+								font-size: 22px;
+								.price {
+									font-size: 32px;
+									font-weight: bold;
+								}
+							}
+							.item-type {
+								color: #999;
+								font-size: 24px;
+							}
+							.item-count {
+								color: #666;
+								font-size: 24px;
+							}
+						}
+					}
+				}
+			}
+			.summary-bar {
+				padding: 0 20px;
+				height: 90px;
+				display: flex;
+
+				align-items: center;
+				justify-content: space-between;
+				border-top: 1px solid #eeeeee;
+				.operate-view {
+					display: flex;
+
+					align-items: center;
+					color: #3385ff;
+					font-size: 26px;
+					.iconfont {
+						margin-right: 20px;
+						font-size: 40px;
+					}
+				}
+				.describe-view {
+					display: flex;
+
+					align-items: center;
+					color: #333;
+					font-size: 24px;
+					.price {
+						font-weight: bold;
+						font-size: 36px;
+					}
+				}
+			}
+		}
+
+		.module-com {
+			background-color: #fff;
+			margin-bottom: 20px;
+
+			border-radius: 10px;
+			overflow: hidden;
+			.member-wrap {
+				.member-det {
+					font-size: 24px;
+					margin-left: 20px;
+				}
+			}
+			.remark-wrap {
+				align-items: flex-start;
+				.remark {
+					height: 240px;
+				}
+			}
+			// .tui-placeholder,
+			// .tui-input {
+			// 	padding-right: 30px;
+			// 	width: 100%;
+			// 	text-align: right;
+			// }
+		}
+	}
+	.under-bar {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0 20px;
+		width: 100%;
+		height: 100px;
+		background-color: #fff;
+
+		box-shadow: 0px -1px 6px 0px rgba(4, 0, 0, 0.06);
+		.price-view {
+			display: flex;
+			align-items: center;
+			font-size: 24px;
+			.price-title {
+				color: #333;
+			}
+			.price-number {
+				margin: 0 20px;
+				color: #ff2842;
+				.large {
+					font-size: 40px;
+				}
+			}
+		}
+		.admin-button-com {
+			width: 200px;
+		}
+	}
+}
+</style>

hdApp/src/admin/billing/index.vue

@@ -1,3 +1,4 @@
+<!--姜枫 2021.04.11-->
 <template>
 	<view class="billing_box_bg">
 		<app-tabs :tabs="tabs" :currentTab="tabIndex" @change="change" itemWidth="33.3%" />
@@ -27,10 +28,9 @@
 									:info="data"
 									:bigCount="getSelectItemById(data.id, res.classId).bigCount"
 									:smallCount="getSelectItemById(data.id, res.classId).smallCount"
-									@customNum="customNum"
-									@addGoods="suitAddEvent"
-									@addOneEvent="addCustomNumEvent"
-									@del="delEvent"
+									@addGoodsEvent="addGoodsEvent"
+									@addGoods="addGoods"
+									@del="delGoodsEvent"
 								></GoodsCommondity>
 							</view>
 							<!-- <Commondity
@@ -48,13 +48,7 @@
 				</block>
 				<!--内容部分 end -->
 			</scroll-view>
-<!---------------------------------------------------------------------------------------------------------------------->
-<!---------------------------------------------------------------------------------------------------------------------->
-<!---------------------------------------------------------------------------------------------------------------------->
-<!---------------------------------------------------------------------------------------------------------------------->
-<!---------------------------------------------------------------------------------------------------------------------->
-<!---------------------------------------------------------------------------------------------------------------------->
-<!---------------------------------------------------------------------------------------------------------------------->
+
 			<scroll-view scroll-y scroll-with-animation class="tab-view" :scroll-top="scrollTop" v-if="tabIndex == 1">
 				<div v-for="(item, index) in filterProductInfo" :key="index" class="tab-bar-item" :class="[classIndex == index ? 'active' : '']" :data-current="index" @tap.stop="swichClass">
 					<text>{{ item.className || "" }}</text>
@@ -144,7 +138,8 @@
 			padding="30rpx 30rpx"
 		>
 		</modal-module>
-		<FooterCart :price="allPrice" :count="allCount" @confirm="confirmSelectEvent" v-if="tabIndex == 1 || tabIndex == 0"></FooterCart>
+		<FooterCart :price="allGoodsPrice" :count="allGoodsCount" @confirm="confirmSelectGoodsEvent" v-if="tabIndex == 0"></FooterCart>
+		<FooterCart :price="allPrice" :count="allCount" @confirm="confirmSelectEvent" v-if="tabIndex == 1"></FooterCart>
 	</view>
 </template>
 
@@ -268,6 +263,15 @@ export default {
 				this.cancelEvent();
 			}
 		},
+		confirmSelectGoodsEvent() {
+			if (this.selectList.length > 0) {
+				uni.navigateTo({
+					url: "/admin/billing/affirmGoods"
+				});
+			} else {
+				this.$msg("请选择花材");
+			}
+		},
 		confirmSelectEvent() {
 			if (this.selectList.length > 0) {
 				uni.navigateTo({

hdApp/src/components/module/app-goods-commodity-style.vue

@@ -0,0 +1,186 @@
+<style lang="scss" scoped>
+.style-pop{
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	z-index: 9999;
+	.shade-box{
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		background: rgba(0,0,0,.6);
+	}
+	.style-pop-center{
+		position: absolute;
+		z-index: 1;
+		width: 670rpx;
+		padding: 30rpx;
+		background: #FFFFFF;
+		border-radius: 20rpx;
+		.style-pop-center-title{
+			padding-bottom: 10prx;
+			image{
+				width: 160rpx;
+				height: 160rpx;
+				border-radius: 20rpx;
+			}
+			.style-pop-center-title-msg{
+				position: relative;
+				width: calc(100% - 180rpx);
+				height: 160rpx;
+				padding: 20rpx 0;
+				font-size: 30rpx;
+				.style-pop-center-title-money{
+					position: absolute;
+					bottom: 20rpx;
+					color: #FF2842;
+					font-size: 34rpx;
+					font-weight: 600;
+				}
+			}
+		}
+		.style-pop-center-caption{
+			height: 90rpx;
+			color: #666666;
+			font-size: 32rpx;
+			.style-pop-center-caption-btn{
+				i{
+					color: #3385FF;
+					font-size: 40rpx;
+				}
+				.style-pop-center-caption-num{
+					width: 90rpx;
+					font-size: 24rpx;
+				}
+			}
+		}
+		.style-pop-center-menu-box{
+			display: flow-root;
+			.style-pop-center-menu{
+				float: left;
+				width: 190rpx;
+				height: 60rpx;
+				margin: 0 10rpx 10rpx 0;
+				background: #FFFFFF;
+				border: 1px solid #DDDDDD;
+				border-radius: 4rpx;
+				font-size: 28rpx;
+				&.active{
+					color: #FFFFFF;
+					background: #3385FF;
+					border: 1px solid #3385FF;
+				}
+			}
+		}
+		.style-pop-center-btn-box{
+			margin-top: 40rpx;
+			.style-pop-center-btn{
+				width: 296rpx;
+				height: 90rpx;
+				color: #666666;
+				background: #FFFFFF;
+				border: 1px solid #DDDDDD;
+				border-radius: 4rpx;
+				font-size: 32rpx;
+				&.active{
+					background: #3385FF;
+					color: #FFFFFF;
+					border: 1px solid #3385FF;
+				}
+			}
+		}
+	}
+}
+
+</style>
+<template>
+	<view class="flex-center style-pop">
+		<view class="shade-box" @tap="cancel"></view>
+		<view class="style-pop-center">
+			<view class="flex-space style-pop-center-title">
+				<image v-if="info.goodsStyleList!=''" :src="info.goodsStyleList[goodsStyleSelectIndex].img"></image>
+				<image v-else :src="info.smallImgList[0]"></image>
+				<view class="style-pop-center-title-msg">
+					{{ info.goodsName }}
+					<view class="style-pop-center-title-money" v-if="info.goodsStyleList!=''">￥{{info.goodsStyleList[goodsStyleSelectIndex].price}}</view>
+					<view class="style-pop-center-title-money" v-else>￥{{ info.price }}</view>
+				</view>
+			</view>
+			<view class="flex style-pop-center-caption" v-if="info.goodsStyleList!=''">款式</view>
+
+			<view class="style-pop-center-menu-box" v-if="info.goodsStyleList!=''">
+				<view class="flex-center style-pop-center-menu" :class="goodsStyleSelectIndex==i?'active':''"
+										v-for="(res,i) in info.goodsStyleList" :key="i" @tap="goodsStyleSelectIndex=i">{{ res.styleName }}</view>
+			</view>
+
+			<view class="flex-space style-pop-center-caption">
+				数量
+				<view class="flex style-pop-center-caption-btn">
+					<i class="iconfont iconjianqu" :class="delAnimationData?'animation':''" v-if="bigCountNum > 0" @tap="minusBigCount"></i>
+					<text class="flex-center style-pop-center-caption-num" >
+						<text v-if="bigCountNum > 0">{{ bigCountNum }}</text>
+					</text>
+					<i class="iconfont icontianjia" :class="addAnimationData?'animation':''" @tap="addBigCount"></i>
+				</view>
+			</view>
+			<view class="flex-space style-pop-center-btn-box">
+				<view class="flex-center style-pop-center-btn" @tap="cancel">取消</view>
+				<view class="flex-center style-pop-center-btn active" @click="ok">确定</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import animationMins from "@/mixins/animation";
+export default {
+	name: "appGoodsCommodityStyle",
+	mixins: [animationMins],
+	props: {
+		info: {
+			required: true,
+			type: Object,
+			default() {
+				return {};
+			}
+		},
+	bigCount: {
+		type: Number,
+		default: 0
+	}
+	},
+	data() {
+		return {
+			goodsStyleSelectIndex:0,
+			bigCountNum:1,
+		};
+	},
+	created() {},
+	mounted() {
+		this.bigCountNum = this.bigCount;
+	},
+	methods: {
+		//关闭
+		cancel(){
+			this.$emit('cancel')
+		},
+		ok(){
+			this.$emit('ok',this.bigCountNum,this.goodsStyleSelectIndex)
+		},
+		minusBigCount(){
+			this.animationFun('del');
+			this.bigCountNum--;
+		},
+		addBigCount(){
+			this.animationFun('add');
+			this.bigCountNum++;
+		},
+	},
+};
+</script>
+
+

hdApp/src/components/module/app-goods-commodity.vue

@@ -1,3 +1,4 @@
+<!--姜枫 2021.04.11-->
 <template>
 	<view class="item-cmd_bx">
 		<view class="img_bx" @click="addEvents">
@@ -9,14 +10,16 @@
 			<view class="num-open_bx">
 				<view class="price">￥{{ showPrice }}</view>
 				<view class="open-bx" >
-					<i class="iconfont iconjian" :class="delAnimationData?'animation':''" @click="delEvent" v-if="bigCount > 0"></i>
+					<i class="iconfont iconjianqu" :class="delAnimationData?'animation':''" @click="delEvent" v-if="bigCount > 0"></i>
 					<text class="num" >
-						<text >{{ bigCount }}</text>
+						<text v-if="bigCount > 0">{{ bigCount }}</text>
 					</text>
-					<i class="iconfont iconzeng" :class="addAnimationData?'animation':''" @click="addEvents"></i>
+					<i class="iconfont icontianjia" v-if="info.goodsStyle>0" :class="addAnimationData?'animation':''" @click="isGoodsStyle = true"></i>
+					<i class="iconfont icontianjia" v-else :class="addAnimationData?'animation':''" @click="addEvents"></i>
 				</view>
 			</view>
 		</view>
+		<goodsCommodityStyle v-if="isGoodsStyle" :bigCount="bigCount" :info="info" @cancel="isGoodsStyle=false" @ok="ok"></goodsCommodityStyle>
 	</view>
 </template>
 
@@ -27,12 +30,14 @@ import { autoPriceByIdApi, changePriceByIdApi } from '@/api/product/index'
 import productMins from "@/mixins/product";
 import animationMins from "@/mixins/animation";
 
+
 import allSelectInput from "@/components/module/allSelectInput";
+import goodsCommodityStyle from "@/components/module/app-goods-commodity-style";
 import allSelectInputMins from "@/mixins/allSelectInput";
 export default {
 	name: "Commodity",
 	components: {
-		AppImg,allSelectInput
+		AppImg,allSelectInput,goodsCommodityStyle
 	},
 	mixins: [productMins,animationMins,allSelectInputMins],
 	props: {
@@ -51,8 +56,7 @@ export default {
 	data() {
 		return {
 			COMMODITY_TYPE,
-			// isAllActive: false,
-			// isAllFocus: false,
+			isGoodsStyle: false,
 			isAloneAllActive: false,
 			isAloneAllFocus: false,
 
@@ -70,6 +74,16 @@ export default {
 		this.showPrice = this.info.price
 	},
 	methods: {
+		ok(bigCount,index){
+			let params = {
+				...this.info,
+				goodsStyleSelectIndex: index,
+				bigCount: bigCount
+			};
+			this.$emit("addGoodsEvent",params);
+			console.log(params);
+			this.isGoodsStyle = false;
+		},
 		addEvents() {
 			this.animationFun('add');
 			this.$emit("addGoods", this.info);

hdApp/src/components/my-popup.vue

@@ -0,0 +1,204 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" id="uni-popup---id">
+		<view :class="[ani, animation ? 'ani' : '', !custom ? 'uni-custom' : '']" class="uni-popup__mask" @click="close(true)" />
+		<view :class="['type-'+type, ani, animation ? 'ani' : '', !custom ? 'uni-custom' : '']" class="uni-popup__wrapper" @click="close(true)" >
+			<view class="uni-popup__wrapper-box" @click.stop="clear" :style="{width:width,height:height}">
+				<slot />
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'my-popup',
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// 是否开启自定义
+			custom: {
+				type: Boolean,
+				default: false
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			},
+			show: {
+				type: Boolean,
+				default: false
+			},
+			height:{
+				type: String,
+				default: 'inherit'
+			},
+			width:{
+				type: String,
+				default: 'inherit'
+			},
+		},
+		data() {
+			return {
+				ani: '',
+				showPopup: false
+			}
+		},
+		watch: {
+			show(newValue) {
+				if (newValue) {
+					this.open()
+				} else {
+					this.close()
+				}
+			}
+		},
+		created() {},
+		
+		mounted: function() {
+		},
+		
+		methods: {
+			clear() {},
+			open() {
+				this.$emit('change', {
+					show: true
+				})
+				this.showPopup = true
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this.ani = 'uni-' + this.type
+					}, 30)
+				})
+			},
+			close(type) {
+				if (!this.maskClick && type) return
+				this.$emit('change', {
+					show: false
+				});
+				this.$emit('hidePopup')
+				this.ani = ''
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this.showPopup = false
+					}, 300)
+				})
+			}
+		}
+	}
+</script>
+<style>
+	@charset "UTF-8";
+
+	.uni-popup {
+		position: fixed;
+		top: 0;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		z-index: 998;
+		overflow: hidden
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		z-index: 998;
+		background: rgba(0, 0, 0, .4);
+		opacity: 0
+	}
+
+	.uni-popup__mask.ani {
+		transition: all .3s
+	}
+
+	.uni-popup__mask.uni-bottom,
+	.uni-popup__mask.uni-center,
+	.uni-popup__mask.uni-top {
+		opacity: 1
+	}
+
+	.uni-popup__wrapper {
+		position: absolute;
+		z-index: 999;
+		box-sizing: border-box
+	}
+
+	.uni-popup__wrapper.ani {
+		transition: all .3s
+	}
+
+	.uni-popup__wrapper.type-top {
+		top: 0;
+		left: 0;
+		width: 100%;
+		transform: translateY(-100%)
+	}
+
+	.uni-popup__wrapper.type-bottom {
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		transform: translateY(100%)
+	}
+
+	.uni-popup__wrapper.type-center {
+		bottom: 0;
+		top: 0;
+		left: 0;
+		right: 0;
+		width: 100%;
+		height: inherit;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		transform: scale(1.2);
+		opacity: 0;
+		
+	}
+
+	.uni-popup__wrapper-box {
+		position: relative;
+		box-sizing: border-box
+	}
+
+	.uni-popup__wrapper.uni-custom .uni-popup__wrapper-box {
+		background: #fff;
+	}
+
+	.uni-popup__wrapper.uni-custom.type-center .uni-popup__wrapper-box {
+		position: relative;
+		border-radius: 15rpx;
+		max-width: 100%;
+		max-height: 100%;
+		overflow-y: scroll
+	}
+
+	.uni-popup__wrapper.uni-custom.type-bottom .uni-popup__wrapper-box,
+	.uni-popup__wrapper.uni-custom.type-top .uni-popup__wrapper-box {
+		width: 100%;
+		overflow-y: scroll
+	}
+
+	.uni-popup__wrapper.uni-bottom,
+	.uni-popup__wrapper.uni-top {
+		transform: translateY(0)
+	}
+
+	.uni-popup__wrapper.uni-center {
+		transform: scale(1);
+		opacity: 1
+	}
+</style>

hdApp/src/mixins/suitProduct.js

@@ -1,3 +1,4 @@
+// <!--姜枫 2021.04.11-->
 import { getGoodsDataApi } from "@/api/product/index";
 import { mapGetters, mapActions } from "vuex";
 import { copyObject } from "@/utils/util";
@@ -75,30 +76,30 @@ export default {
 
 
 		//选择商品总价
-		// allPrice() {
-		// 	let price = 0;
-		//
-		// 	if (this.selectList) {
-		// 		for (const item of this.selectList) {
-		// 			const itemInfo = this.getSelectItemById(item.id, item.classId);
-		// 			if (
-		// 				itemInfo &&
-		// 				!this.$util.isEmpty(itemInfo.bigPrice) &&
-		// 				!this.$util.isEmpty(itemInfo.smallPrice)
-		// 			) {
-		// 				price += item.bigCount * Number(itemInfo.bigPrice);
-		// 				price += item.smallCount * Number(itemInfo.smallPrice);
-		// 			}
-		// 		}
-		// 	}
-		//
-		// 	return Math.round(price * 100) / 100;
-		// },
+		allGoodsPrice() {
+			let price = 0;
+			console.log('this.selectList',this.selectList);
+			if (this.selectList) {
+					for (const item of this.selectList) {
+						if(item.goodsStyle==0){
+							price += item.bigCount * Number(item.price);
+					}else{
+							price += item.bigCount * Number(item.goodsStyleList[item.goodsStyleSelectIndex].price);
+						}
+				}
+
+			}
+
+			return Math.round(price * 100) / 100;
+		},
 		//选择商品总数
-		// allCount() {
-		// 	console.log(444444, this.selectList);
-		// 	return this.selectList.length;
-		// },
+		allGoodsCount() {
+			let length = 0;
+			this.selectList.forEach(element => {
+				length += Number(element.bigCount)
+			})
+			return length;
+		},
 		/**
 		 * 当前选中商品列表中是否有没有库存的商品
 		 */
@@ -162,15 +163,21 @@ export default {
 		/**
 		 * 获取当前选中商品总价
 		 */
-		// getSelectItemPrice(item) {
-		// 	let price = 0;
-		// 	const { bigCount, smallCount, bigPrice, smallPrice } = item;
-		// 	let sum =
-		// 		Number(bigCount) * Number(bigPrice) +
-		// 		Number(smallCount) * Number(smallPrice);
-		// 	price = Math.round(sum * 100) / 100;
-		// 	return price;
-		// },
+		getSelectGoodsPrice(item) {
+			let price = 0;
+
+			if(item.goodsStyle==0){
+				price = item.bigCount * Number(item.price);
+			}else{
+				price = item.bigCount * Number(item.goodsStyleList[item.goodsStyleSelectIndex].price);
+			}
+			// let sum = 0;
+			// if()
+			// 	Number(bigCount) * Number(bigPrice) +
+			// 	Number(smallCount) * Number(smallPrice);
+			// price = Math.round(sum * 100) / 100;
+			return price;
+		},
 		/**
 		 * 通过id获取当前选中的商品信息
 		 */
@@ -226,18 +233,58 @@ export default {
 		},
 
 		/**
-		 * 添加商品
+		 * 多风格-添加商品
 		 */
-		suitAddEvent(item) {
+		addGoodsEvent(item) {
 			const list = this.selectList;
+			//过滤空数据
+			if(item.bigCount==0||!item.bigCount){return}
+			let has = false;
+			for (let index = 0; index < list.length; index++) {
+				const element = list[index];
+				if (element.id == item.id && element.classId == item.classId) {
+					has = true;
+					list[index] = { ...element, bigCount: item.bigCount,goodsStyleSelectIndex: item.goodsStyleSelectIndex };
+
+					break;
+				}
+			}
+			if (!has) {
+				let info = { classId: item.classId, id: item.id };
+
+				const classInfo =
+					this.suitInfo &&
+					this.suitInfo.find(element => {
+						return element.classId == item.classId && element.child;
+					});
+				if (classInfo) {
+					info = classInfo.child.find(ele => {
+						return ele.id == item.id;
+					});
+				}
+
+				let params = {
+					...info,
+					bigCount: item.bigCount, //扎数
+					goodsStyleSelectIndex: item.goodsStyleSelectIndex, //选中的风格
+				};
+				list.push(params);
+			}
 
+			this.setSelectInfoByType({ type: this.pageType, info: list });
+			// this.$forceUpdate();
+		},
+		/**
+			* 添加商品
+			*/
+		addGoods(item) {
+			const list = this.selectList;
 			let has = false;
 			for (let index = 0; index < list.length; index++) {
 				const element = list[index];
 				if (element.id == item.id && element.classId == item.classId) {
 					has = true;
 					list[index] = { ...element, bigCount: ++element.bigCount };
-
 					break;
 				}
 			}
@@ -262,79 +309,32 @@ export default {
 					autoPrice: 0 //调价价格
 				};
 				list.push(params);
-
-				// if (info.bigNum && info.bigNum > 0) {
-				// } else {
-				// 	this.$msg("库存不足");
-				// }
 			}
 
 			this.setSelectInfoByType({ type: this.pageType, info: list });
 			// this.$forceUpdate();
 		},
-
 		/**
-		 * 减去商品
+		 * 多风格-减去商品
 		 */
-		// delEvent(item) {
-		// 	const list = this.selectList;
-		// 	let has = false;
-		// 	for (let index = 0; index < list.length; index++) {
-		// 		const element = list[index];
-		// 		if (element.id == item.id && element.classId == item.classId) {
-		// 			has = true;
-		//
-		// 			if (element.bigCount > 0) {
-		// 				list[index] = { ...element, bigCount: --element.bigCount };
-		// 			} else if (element.smallCount > 0) {
-		// 				list[index] = { ...element, smallCount: 0 };
-		// 			}
-		//
-		// 			if (this.isLimit) {
-		// 				const { bigCount, smallCount } = list[index];
-		// 				//超过库存时 设置为库存最大值
-		// 				const ratio = Number(item.ratio);
-		// 				if (
-		// 					Number(bigCount) * ratio + Number(smallCount) >
-		// 					Number(item.bigNum) * ratio + Number(item.smallNum)
-		// 				) {
-		// 					list[index].bigCount = Number(item.bigNum);
-		// 					list[index].smallCount = Number(item.smallNum);
-		// 				}
-		// 			}
-		// 			if (element.bigCount == 0 && element.smallCount == 0) {
-		// 				list.splice(index, 1);
-		// 			}
-		//
-		// 			break;
-		// 		}
-		// 	}
-		// 	if (!has) {
-		// 		let info = { classId: item.classId, id: item.id };
-		//
-		// 		const classInfo =
-		// 			this.productInfo &&
-		// 			this.productInfo.find(element => {
-		// 				return element.classId == item.classId && element.child;
-		// 			});
-		// 		if (classInfo) {
-		// 			info = classInfo.child.find(ele => {
-		// 				return ele.id == item.id;
-		// 			});
-		// 		}
-		// 		let params = {
-		// 			...info,
-		// 			bigCount: 1, //扎数
-		// 			smallCount: 0, //支数
-		// 			autoPrice: 0 //调价价格
-		// 		};
-		//
-		// 		list.push(params);
-		// 	}
-		// 	this.setSelectInfoByType({ type: this.pageType, info: list });
-		// 	// this.$forceUpdate();
-		// },
-		//减去所有商品
+		delGoodsEvent(item) {
+			const list = this.selectList;
+			for (let index = 0; index < list.length; index++) {
+				const element = list[index];
+				if (element.id == item.id && element.classId == item.classId) {
+
+					if (element.bigCount > 0) {
+						list[index] = { ...element, bigCount: --element.bigCount };
+					}
+					if (element.bigCount == 0 || !element.bigCount) {
+						list.splice(index, 1);
+					}
+					break;
+				}
+			}
+			this.setSelectInfoByType({ type: this.pageType, info: list });
+		},
+		// 减去所有商品
 		// delAllEvent(item) {
 		// 	const list = this.selectList;
 		// 	for (let index = 0; index < list.length; index++) {

hdApp/src/pages.json

@@ -443,6 +443,11 @@
 					"style": {
 						"navigationBarTitleText": "确认下单"
 					}
+				},{
+					"path": "affirmGoods",
+					"style": {
+						"navigationBarTitleText": "确认下单"
+					}
 				},
 				{
 					"path": "affirmPxClass",