Browse Source

Merge branch 'master' of http://47.112.106.152:10880/MP/kailin_mp

liuxiangxin 6 months ago
parent
commit
04cf47ef41
1 changed files with 191 additions and 120 deletions
  1. 191 120
      pages/product/index.vue

+ 191 - 120
pages/product/index.vue

@@ -42,7 +42,7 @@
 			<button class="show_car" data-eventsync="true" @click="showSpecPopup(2)" >加入购物车</button>
 		</view>
 		<view class="to_bottom"> --- 到底了 --- </view>
-		<uni-popup ref="specPopup" :show="true" type="bottom" class="popup" background-color="#FFFFFF" @change="popupChange" >
+		<uni-popup ref="specPopup" :show="true" type="bottom" class="popup" background-color="#FFFFFF" @change="popupChange" @maskClick="onSpecPopupClose">
 			<view class="order_info">
 				<view class="custom_addr" v-if="specBtnType==1" @click="showAddrPopup()">
 					<view class="contact_user">
@@ -241,6 +241,8 @@
 				isShowPrice:false,
 				// 选择的skuid
 				sku_id:0,
+				//是否选择所有规格
+				hasValidSpecSelected: false,
 			}
 		},
 		onLoad(param) {
@@ -333,6 +335,10 @@
 				if(this.productInfo.product_sku.length === 1){
 					this.defaultSkuStatus();
 				}
+				//如果当前商品没有规格,可以直接加入购物车
+				if(this.productInfo.product_attr.length === 0){
+					this.hasValidSpecSelected = true;
+				}
 			},
 			// 优惠券弹出层
 			openCoupon(){
@@ -408,6 +414,14 @@
 					})
 					return;
 				}
+				//规格没有选中全
+				if(!this.hasValidSpecSelected){
+					uni.showToast({
+						title:"请选择所有规格",
+						icon:"none"
+					})
+					return;
+				}
 				//需要下单的产品信息参数传给completion页面
 				let productInfo = [{name:this.productInfo.name,spec:this.productInfo.spec,price:this.productInfo.price}]
 				//转成json字符串
@@ -471,6 +485,15 @@
 					})
 					return;
 				}
+					
+				//规格没有选中全
+				if(!this.hasValidSpecSelected){
+					uni.showToast({
+						title:"请选择所有规格",
+						icon:"none"
+					})
+					return;
+				}
 				// 商品信息
 				let data = {product_id:this.productInfo.id,buy_num:this.quantity,skuid:this.sku_id};
 				// 请求接口
@@ -675,83 +698,83 @@
 				})
 			},
 			// 设置默认sku
-			setDefaultSpec(){
-				// 如果列表存在
-				if( this.productInfo.product_sku.length ){
-					//如果列表大于1
-					if(this.productInfo.product_sku.length > 1){
-						//循环sku列表
-						for(var k = 0 ; k < this.productInfo.product_sku.length;k++ ){
-							//全部规格都已经下架
-							if(k === this.productInfo.product_sku.length){
-								uni.showToast({
-									title:"当前商品已全部下架",
-									icon:"error"
-								})
-								this.productInfo.stock = 0;
-								return;
-							}
-							// 获取第一个没有下架的sku作为默认值
-							if(this.productInfo.product_sku[k].status === 0){
-								var attr_ids = this.productInfo.product_sku[k].attr_ids.split(",");
-								break;
-							}
-						}
-						// 循环规格列表
-						for ( let i in this.productInfo.product_attr ) {
-							// 再循环属性
-							for (let j in this.productInfo.product_attr[i].attr_list) {
-								// 如果不等于id
-								if( attr_ids.includes(this.productInfo.product_attr[i].attr_list[j].id + '') ){
-									// 设置选中
-									this.productInfo.product_attr[i].attr_list[j].active = 1;
-								}else{
-									this.productInfo.product_attr[i].attr_list[j].active = 0;
-								}
-							}
-						}
-						// 产品价格修改
-						this.productInfo.price = this.productInfo.product_sku[k].price;
-						// 产品规格修改
-						// this.productInfo.spec = this.productInfo.product_sku[k].attr_names;
-						// 产品库存
-						this.productInfo.stock = this.productInfo.product_sku[k].stock;
-						// 产品SKU
-						this.sku_id 		= this.productInfo.product_sku[k].id;
-						// 计算价格
-						this.priceHandler();
-						// 优惠券是否可用
-						this.checkCoupon();
-					}else{
-						var attr_ids = this.productInfo.product_sku[0].attr_ids.split(",");
-						// 循环规格列表
-						for ( let i in this.productInfo.product_attr ) {
-							// 再循环属性
-							for (let j in this.productInfo.product_attr[i].attr_list) {
-								// 如果不等于id
-								if( attr_ids.includes(this.productInfo.product_attr[i].attr_list[j].id + '') ){
-									// 设置选中
-									this.productInfo.product_attr[i].attr_list[j].active = 1;
-								}else{
-									this.productInfo.product_attr[i].attr_list[j].active = 0;
-								}
-							}
-						}
-						// 产品价格修改
-						this.productInfo.price = this.productInfo.product_sku[0].price;
-						// 产品规格修改
-						this.productInfo.spec = this.productInfo.product_sku[0].attr_names;
-						// 产品库存
-						this.productInfo.stock = this.productInfo.product_sku[0].stock;
-						// 产品SKU
-						this.sku_id = this.productInfo.product_sku[0].id;
-						// 计算价格
-						this.priceHandler();
-						// 优惠券是否可用
-						this.checkCoupon();
-					}
-				}
-			},
+			// setDefaultSpec(){
+			// 	// 如果列表存在
+			// 	if( this.productInfo.product_sku.length ){
+			// 		//如果列表大于1
+			// 		if(this.productInfo.product_sku.length > 1){
+			// 			//循环sku列表
+			// 			for(var k = 0 ; k < this.productInfo.product_sku.length;k++ ){
+			// 				//全部规格都已经下架
+			// 				if(k === this.productInfo.product_sku.length){
+			// 					uni.showToast({
+			// 						title:"当前商品已全部下架",
+			// 						icon:"error"
+			// 					})
+			// 					this.productInfo.stock = 0;
+			// 					return;
+			// 				}
+			// 				// 获取第一个没有下架的sku作为默认值
+			// 				if(this.productInfo.product_sku[k].status === 0){
+			// 					var attr_ids = this.productInfo.product_sku[k].attr_ids.split(",");
+			// 					break;
+			// 				}
+			// 			}
+			// 			// 循环规格列表
+			// 			for ( let i in this.productInfo.product_attr ) {
+			// 				// 再循环属性
+			// 				for (let j in this.productInfo.product_attr[i].attr_list) {
+			// 					// 如果不等于id
+			// 					if( attr_ids.includes(this.productInfo.product_attr[i].attr_list[j].id + '') ){
+			// 						// 设置选中
+			// 						this.productInfo.product_attr[i].attr_list[j].active = 1;
+			// 					}else{
+			// 						this.productInfo.product_attr[i].attr_list[j].active = 0;
+			// 					}
+			// 				}
+			// 			}
+			// 			// 产品价格修改
+			// 			this.productInfo.price = this.productInfo.product_sku[k].price;
+			// 			// 产品规格修改
+			// 			// this.productInfo.spec = this.productInfo.product_sku[k].attr_names;
+			// 			// 产品库存
+			// 			this.productInfo.stock = this.productInfo.product_sku[k].stock;
+			// 			// 产品SKU
+			// 			this.sku_id 		= this.productInfo.product_sku[k].id;
+			// 			// 计算价格
+			// 			this.priceHandler();
+			// 			// 优惠券是否可用
+			// 			this.checkCoupon();
+			// 		}else{
+			// 			var attr_ids = this.productInfo.product_sku[0].attr_ids.split(",");
+			// 			// 循环规格列表
+			// 			for ( let i in this.productInfo.product_attr ) {
+			// 				// 再循环属性
+			// 				for (let j in this.productInfo.product_attr[i].attr_list) {
+			// 					// 如果不等于id
+			// 					if( attr_ids.includes(this.productInfo.product_attr[i].attr_list[j].id + '') ){
+			// 						// 设置选中
+			// 						this.productInfo.product_attr[i].attr_list[j].active = 1;
+			// 					}else{
+			// 						this.productInfo.product_attr[i].attr_list[j].active = 0;
+			// 					}
+			// 				}
+			// 			}
+			// 			// 产品价格修改
+			// 			this.productInfo.price = this.productInfo.product_sku[0].price;
+			// 			// 产品规格修改
+			// 			this.productInfo.spec = this.productInfo.product_sku[0].attr_names;
+			// 			// 产品库存
+			// 			this.productInfo.stock = this.productInfo.product_sku[0].stock;
+			// 			// 产品SKU
+			// 			this.sku_id = this.productInfo.product_sku[0].id;
+			// 			// 计算价格
+			// 			this.priceHandler();
+			// 			// 优惠券是否可用
+			// 			this.checkCoupon();
+			// 		}
+			// 	}
+			// },
 			// 属性变更
 			attrChange(spec_index,attr_index){
 				// 判断当前属性是否选择。选择的跳过
@@ -769,66 +792,94 @@
 				//选择选项
 				this.productInfo.product_attr[spec_index].attr_list[attr_index].active = 1;
 				//选中的规格
-				var attr_ids = [];
+				 var attr_ids = [];
+				
 				// 循环规格
 				for ( let i in this.productInfo.product_attr ) {
 					// 再循环属性
-					for (let j in this.productInfo.product_attr[i].attr_list) {
-						// 如果选中的
-						if( this.productInfo.product_attr[i].attr_list[j].active ){
-							attr_ids.push(this.productInfo.product_attr[i].attr_list[j].id);
+					// for (let j in this.productInfo.product_attr[i].attr_list) {
+					// 	// 如果选中的
+					// 	if( this.productInfo.product_attr[i].attr_list[j].active ){
+					// 		this.attr_ids.push(this.productInfo.product_attr[i].attr_list[j].id);
+					// 	}
+					// }
+					 for (let j in this.productInfo.product_attr[i].attr_list) {
+						if (this.productInfo.product_attr[i].attr_list[j].active) {
+							if (this.productInfo.product_attr[i].spec_id === 1) {
+								attr_ids.push({ spec_id: 1, id: this.productInfo.product_attr[i].attr_list[j].id });
+							} else if (this.productInfo.product_attr[i].spec_id === 2) {
+								attr_ids.push({ spec_id: 2, id: this.productInfo.product_attr[i].attr_list[j].id });
+							}
 						}
 					}
 				}
 				// 如果选项不足的话
 				if( attr_ids.length != this.productInfo.product_attr.length) return ;
 				// 转成字符串
-				var attrids	= attr_ids.join(",");
+				// var attrids	= this.attr_ids.join(",");
+				// 转成字符串
+				let colorAttridsStr = attr_ids.filter((item) => item.spec_id === 1).map((item) => item.id).join(",");
+				let sizeAttridsStr = attr_ids.filter((item) => item.spec_id === 2).map((item) => item.id).join(",");
+				let	isSelectionComplete = 0;
+	
+				// 判断是否两个规格下的属性都已选中
+				if (colorAttridsStr && colorAttridsStr.length > 0 && sizeAttridsStr && sizeAttridsStr.length > 0) {
+					this.hasValidSpecSelected = true;
+					isSelectionComplete = 1;
+				} else {
+					this.hasValidSpecSelected = false;
+					isSelectionComplete = 0;
+				}
+				
 				// 如果当前点击的属性对应的SKU状态为未下架(初始化为0)
 				let currentSKUStatus = 0;
 				// 匹配规格
 				if( this.productInfo.product_sku.length ){
 					// 是否有对应的SKU
-					let  haveSku				= 0;
-					// 循环sku
-					for (let i in this.productInfo.product_sku) {
-						// 如果sku不匹配
-						if( this.productInfo.product_sku[i].attr_ids != attrids ) continue;
-						// 设置有SKU
-						haveSku	= 1;
-						// 获取当前匹配到的SKU的状态
-						currentSKUStatus = this.productInfo.product_sku[i].status;
-						// 如果商品已经下架(status等于1),则恢复当前规格下所有属性原来的active状态
-						if(currentSKUStatus === 1){
-							uni.showToast({title:"该规格已下架",icon:"none"});
-							for (let k in originalActiveStates) {
-								this.productInfo.product_attr[spec_index].attr_list[k].active = originalActiveStates[k];
+					let  haveSku	= false;
+					// 先检查colorAttridsStr和sizeAttridsStr是否都已正确生成
+					if (colorAttridsStr && colorAttridsStr.length > 0 && sizeAttridsStr && sizeAttridsStr.length > 0) {
+						// 循环sku
+						for (let i in this.productInfo.product_sku) {
+							// 如果sku不匹配
+							if( this.productInfo.product_sku[i].attr_ids != colorAttridsStr + "," + sizeAttridsStr ) continue;
+							// 设置有SKU
+							haveSku	= 1;
+							// 获取当前匹配到的SKU的状态
+							currentSKUStatus = this.productInfo.product_sku[i].status;
+							// 如果商品已经下架(status等于1),则恢复当前规格下所有属性原来的active状态
+							if(currentSKUStatus === 1){
+								uni.showToast({title:"该规格已下架",icon:"none"});
+								for (let k in originalActiveStates) {
+									this.productInfo.product_attr[spec_index].attr_list[k].active = originalActiveStates[k];
+								}
+								continue;
 							}
-							continue;
-						}
-						// 如果商品没有库存
-						if( this.productInfo.product_sku[i].stock <= 0 ){
-							uni.showToast({title:"该规格库存不足",icon:"none"});
-							for (let k in originalActiveStates) {
-								this.productInfo.product_attr[spec_index].attr_list[k].active = originalActiveStates[k];
+							// 如果商品没有库存
+							if( this.productInfo.product_sku[i].stock <= 0 ){
+								uni.showToast({title:"该规格库存不足",icon:"none"});
+								for (let k in originalActiveStates) {
+									this.productInfo.product_attr[spec_index].attr_list[k].active = originalActiveStates[k];
+								}
+								continue;
 							}
-							continue;
+							// console.log("我怎么没有执行?");
+							// 产品价格修改
+							this.productInfo.price = this.productInfo.product_sku[i].price;
+							// 产品规格修改
+							this.productInfo.spec = this.productInfo.product_sku[i].attr_names;
+							// 产品库存
+							this.productInfo.stock = this.productInfo.product_sku[i].stock;
+							// 产品SKU
+							this.sku_id = this.productInfo.product_sku[i].id;
+							// 计算价格
+							this.priceHandler();
+							// 优惠券是否可用
+							this.checkCoupon();
 						}
-						// 产品价格修改
-						this.productInfo.price = this.productInfo.product_sku[i].price;
-						// 产品规格修改
-						this.productInfo.spec = this.productInfo.product_sku[i].attr_names;
-						// 产品库存
-						this.productInfo.stock = this.productInfo.product_sku[i].stock;
-						// 产品SKU
-						this.sku_id = this.productInfo.product_sku[i].id;
-						// 计算价格
-						this.priceHandler();
-						// 优惠券是否可用
-						this.checkCoupon();
-					}
+					}	
 					// 如果没有对应的SKU
-					if( !haveSku ){
+					if( !haveSku && isSelectionComplete ){
 						uni.showToast({title:"该规格已下架",icon:"none"});
 						for (let k in originalActiveStates) {
 							this.productInfo.product_attr[spec_index].attr_list[k].active = originalActiveStates[k];
@@ -836,6 +887,26 @@
 					}
 				}
 			},
+			//specPopup关闭时重置数据
+			onSpecPopupClose(){
+				
+				if(this.productInfo.product_attr.length){
+					
+					let colorSpecAttrList = this.productInfo.product_attr.find((spec) => spec.spec_id === 1).attr_list;
+					let sizeSpecAttrList = this.productInfo.product_attr.find((spec) => spec.spec_id === 2).attr_list;
+					for (let i in colorSpecAttrList) {
+						 colorSpecAttrList[i].active = 0;
+					}
+					// 恢复尺寸规格下属性的原始active状态
+					for (let i in sizeSpecAttrList) {
+						 sizeSpecAttrList[i].active = 0;
+					}	
+				}
+				//重置上一次规格全部选中
+				this.hasValidSpecSelected = false;
+				// 恢复颜色分类规格下属性的原始active状态
+				this.$refs.specPopup.close()
+			},
 			//只有一组sku默认规格是否已下架
 			defaultSkuStatus(){
 				if(this.productInfo.product_sku.length){