zs 2 年之前
父節點
當前提交
9d57b082c5
共有 2 個文件被更改,包括 389 次插入26 次删除
  1. 24 16
      pagesHome/order/components/banner_1.vue
  2. 365 10
      pagesHome/order/detail.vue

+ 24 - 16
pagesHome/order/components/banner_1.vue

@@ -1,18 +1,20 @@
 <template>
 	<view class="banner">
 		<view class="banner_1">
-			<swiper class="swiper" circular :indicator-dots="true" indicator-color="#ffffff" indicator-active-color="#FB1438" :interval="3000" :duration="1000">
-				<swiper-item class="list" v-for="(item,index) in goodsInfo.file" :key="index">
+			<swiper class="swiper" circular :indicator-dots="true" indicator-color="#ffffff"
+				indicator-active-color="#FB1438" :interval="3000" :duration="1000">
+				<swiper-item class="list" v-for="(item,index) in fileList" :key="index">
 					<image class="image" :src="item.url" mode="aspectFit">
 					</image>
 				</swiper-item>
 			</swiper>
 			<!-- 是否关注商品 -->
 			<view class="goodsColect">
-				<text @tap="toGoodscolect" :class="['iconfont',goodsColect?'icon-yduishoucangshixin-copy':'icon-yduishoucangkongxin']"></text>
+				<text @tap="toGoodscolect"
+					:class="['iconfont',goodsColect?'icon-yduishoucangshixin-copy':'icon-yduishoucangkongxin']"></text>
 			</view>
-			<view class="acttags" v-if="goodsInfo.act_tags&&goodsInfo.act_tags.length>0">
-				<text v-for="(i,indexx) in goodsInfo.act_tags" :key="indexx">{{i.label}}</text>
+			<view class="acttags" v-if="acttagsList.length>0">
+				<text v-for="(i,indexx) in acttagsList" :key="indexx">{{i.label}}</text>
 			</view>
 		</view>
 	</view>
@@ -29,23 +31,29 @@
 			}
 		},
 		data() {
-			return {};
-		},
-		onLoad: function(e) {
-
-		},
-		onShow: function() {
-
-		},
-		onUnload: function() {
-
+			return {
+				// 图片
+				fileList: [],
+				// 活动
+				acttagsList: [],
+			};
 		},
 		methods: {
 			toGoodscolect() {
 				const that = this;
 				that.$emit('toGoodscolect')
 			}
-		}
+		},
+		watch: {
+			goodsInfo: {
+				deep: true,
+				immediate: true,
+				handler(val) {
+					if (val && val.file.length > 0) this.$set(this, `fileList`, val.file)
+					if (val && val.act_tags.length > 0) this.$set(this, `acttagsList`, val.act_tags)
+				}
+			}
+		},
 	}
 </script>
 

+ 365 - 10
pagesHome/order/detail.vue

@@ -5,30 +5,125 @@
 				<scroll-view scroll-y="true" class="scroll-view">
 					<view class="list-scroll-view">
 						<view class="one_1">
-							<banner :goodsInfo="goodsInfo" :goodsColect="goodsColect" @toGoodscolect="toGoodscolect">
+							<banner :goodsInfo="info.goods" :goodsColect="goodsColect"
+								@toGoodscolect="toGoodscolect">
 							</banner>
 						</view>
 						<view class="one_2">
-							<text class="money_1" v-if="infospecs.leader_price"><text>团长价¥</text>{{infospecs.leader_price||0}}</text>
+							<text class="money_1"
+								v-if="infospecs.leader_price"><text>团长价¥</text>{{infospecs.leader_price||0}}</text>
 							<text class="money" v-if="infospecs.price"><text>特价¥</text>{{infospecs.price||0}}</text>
-							<text class="money" v-if="!infospecs.price&&!infospecs.leader_price"><text>¥</text>{{infospecs.sell_money||0}}</text>
+							<text class="money"
+								v-if="!infospecs.price&&!infospecs.leader_price"><text>¥</text>{{infospecs.sell_money||0}}</text>
 							<text class="money"><text>¥</text>{{infospecs.flow_money||0}}</text>
 						</view>
 						<view class="one_3" v-if="discount">
-							<text v-if="discount.full_decrement&&discount.full_decrement.length>0" class="act" v-for="(item,index) in discount.full_decrement" :key="index">{{item}}</text>
-							<text v-if="discount.full_fold&&discount.full_decrement.length>0" class="act" v-for="(item,index) in discount.full_fold" :key="index">{{item}}</text>
+							<text v-if="discount.full_decrement&&discount.full_decrement.length>0" class="act"
+								v-for="(item,index) in discount.full_decrement" :key="index">{{item}}</text>
+							<text v-if="discount.full_fold&&discount.full_decrement.length>0" class="act"
+								v-for="(item,index) in discount.full_fold" :key="index">{{item}}</text>
 						</view>
 						<view class="one_4">
 							<text class="num">已售{{info.goods&&info.goods.sell_num||0}}件</text>
 						</view>
 						<view class="one_5">
-							5
+							<view class="name">
+								{{info.goods&&info.goods.name}}
+							</view>
+							<view class="brief">
+								{{info.goods&&info.goods.shot_brief||''}}
+							</view>
+							<view class="money">
+								<!-- <text>运费{{infospecs.freight||'包邮'}}元</text> -->
+								<text>{{info.goods&&info.goods.send_time}}内发货</text>
+							</view>
+						</view>
+						<view class="one_6" @tap="toActivity">
+							<view class="l">
+								<text>{{info.act&&info.act.length>0?`活动`:`暂无活动`}}</text>
+							</view>
+							<view class="r">
+								<text class="iconfont icon-jiantouyou"></text>
+							</view>
+						</view>
+						<view class="one_6" @tap="toSpec">
+							<view class="l">
+								选择规格
+							</view>
+							<view class="r">
+								<text class="iconfont icon-jiantouyou"></text>
+							</view>
+						</view>
+						<view class="one_6" @tap="toEvaluate">
+							<view class="l">
+								<text>{{evaluate_num>0?`商品评价(${evaluate_num})`:`暂无评价`}}</text>
+							</view>
+							<view class="r">
+								<text class="iconfont icon-jiantouyou"></text>
+							</view>
+						</view>
+						<view class="one_7" v-if="info.sets&&info.sets.length>0" @tap="toSets">
+							<view class="one_7_1">
+								优惠套装<text>({{info.sets.length||0}})</text>
+							</view>
+							<view class="one_7_2">
+								<view class="image" v-for="(set,index) in info.sets[0].set" :key="index">
+									<image class="image" :src="set.file&&set.file.length>0?set.file[0].url:''"
+										mode="aspectFit">
+									</image>
+								</view>
+								<view class="money">
+									<view class="money_1">共{{info.sets[0].goods_total}}件</view>
+									<view class="money_2">¥{{info.sets[0].sell_money}}</view>
+								</view>
+							</view>
+						</view>
+						<view class="one_8">
+							<view class="one_8_1">
+								<view class="shop_1">
+									<image class="image"
+										:src="info.shop&&info.shop.logo&&info.shop.logo.length>0?info.shop.logo[0].url:''"
+										mode="aspectFit"></image>
+								</view>
+								<view class="shop_2">
+									<view class="name">{{info.shop&&info.shop.name}}</view>
+									<view class="num"><text>宝贝数:</text>{{info.shop&&info.shop.goods_num||0}}</view>
+								</view>
+							</view>
+							<view class="one_8_2">
+								<view class="score_1">
+									<text>商品:</text>
+									<text>{{info.shop&&info.shop.goods_score||5}}</text>
+									<text>|</text>
+								</view>
+								<view class="score_1">
+									<text>发货:</text>
+									<text>{{info.shop&&info.shop.send_score||5}}</text>
+									<text>|</text>
+								</view>
+								<view class="score_1">
+									<text>服务:</text>
+									<text>{{info.shop&&info.shop.service_score||5}}</text>
+								</view>
+							</view>
+							<view class="one_8_3">
+								<view class="btn">
+									<button size="mini" @tap="toShop">进入店铺</button>
+								</view>
+								<view class="btn">
+									<button size="mini" @tap="toShopcolect">{{shopColect==true?'已关注':'关注'}}</button>
+								</view>
+							</view>
+						</view>
+						<view class="one_9">
+							<rich-text :nodes="info.goods&&info.goods.brief"></rich-text>
 						</view>
 					</view>
 				</scroll-view>
 			</view>
 			<view class="two">
-				<uni-goods-nav :options="options" :button-group="buttonGroup" @click="toNavleft" @buttonClick="toNavright" />
+				<uni-goods-nav :options="options" :button-group="buttonGroup" @click="toNavleft"
+					@buttonClick="toNavright" />
 			</view>
 		</view>
 	</mobile-frame>
@@ -58,8 +153,6 @@
 				evaluate_num: 0,
 				// 商品详情
 				info: {},
-				// 商品详情
-				goodsInfo: {},
 				// 规格
 				infospecs: {},
 				// 优惠
@@ -237,7 +330,6 @@
 							that.$set(that, `infospecs`, indexSpecs[0])
 						}
 						that.$set(that, `info`, data);
-						that.$set(that, `goodsInfo`, data?.goods);
 						// 优惠
 						act = data.act.find(i => i.type == '5')
 						if (act) that.$set(that.discount, `full_decrement`, act.text.split(';'));
@@ -305,6 +397,97 @@
 					})
 				}
 			},
+			// 活动说明
+			toActivity() {
+				const that = this;
+				if (that.info.act.length > 0) {
+					that.$set(that, `popupShow`, '2')
+					that.$refs.specShow.open();
+				}
+			},
+			// 活动说明
+			toActivity() {
+				const that = this;
+				if (that.info.act.length > 0) {
+					that.$set(that, `popupShow`, '2')
+					that.$refs.specShow.open();
+				}
+			},
+			// 选择规格
+			toSpec() {
+				const that = this;
+				this.$set(that, `popupShow`, '1')
+				that.$refs.specShow.open();
+			},
+			// 选择规格
+			toSpecs(e) {
+				const that = this;
+				let specs = that.info.specs;
+				let dataIndex = specs.findIndex(i => i._id == e._id);
+				that.$set(that, `is_specs`, dataIndex);
+				let specsInfo = that.group_config.find(i => i.spec._id == e._id)
+				if (specsInfo?._id && that.user.is_leader == '0') e.can_group = '0'
+				else e.can_group = '1'
+				let limit = that.buyList.find((i) => i.value == e.buy_limit);
+				if (limit) e.buy_name = limit.label
+				that.$set(that, `specsInfo`, e)
+				that.$set(that, `buy_num`, 1);
+				if (e.num <= 0) that.$set(that, `is_zero`, true)
+				else that.$set(that, `is_zero`, false)
+			},
+			// 评价
+			toEvaluate() {
+				const that = this;
+				uni.navigateTo({
+					url: `/pagesHome/order/appraise?id=${that.info.goods._id}`
+				})
+			},
+			// 查看套装
+			toSets() {
+				const that = this;
+				if (that.info.sets.length > 0) {
+					that.$set(that, `popupShow`, '3')
+					that.$refs.specShow.open();
+				}
+			},
+			// 套装详情
+			toDeatil(e) {
+				const that = this;
+				uni.navigateTo({
+					url: `/pagesHome/order/detail?id=${e.goods}`
+				})
+			},
+			// 进入店铺
+			toShop() {
+				const that = this;
+				let info = that.info;
+				uni.navigateTo({
+					url: `/pagesHome/shop/index?id=${info.shop._id}`
+				})
+			},
+			// 关注店铺
+			async toShopcolect() {
+				const that = this;
+				let user = that.user;
+				if (user && user._id) {
+					let res = await that.$api(`/storeShop`, `POST`, {
+						customer: user._id,
+						shop: that.info.shop._id
+					});
+					if (res.errcode == '0') {
+						uni.showToast({
+							title: res.data.msg,
+							icon: 'none'
+						})
+						that.$set(that, `shopColect`, res.data.result)
+					}
+				} else {
+					uni.showToast({
+						title: '暂无账号,无法关注商铺',
+						icon: 'none'
+					})
+				}
+			},
 			// 店铺,购物车
 			toNavleft(e) {
 				const that = this;
@@ -418,6 +601,178 @@
 				}
 
 			}
+
+			.one_5 {
+				border-bottom: 0.5vw solid var(--f9Color);
+				padding: 2vw;
+
+				.name {
+					font-size: 17px;
+					font-weight: bold;
+					margin: 0 0 2vw 0;
+				}
+
+				.brief {
+					font-size: 14px;
+					color: #858585;
+					margin: 0 0 1vw 0;
+				}
+
+				.money {
+					font-size: 13px;
+					color: #858585;
+
+					text {
+						padding: 0 2vw 0 0;
+					}
+				}
+			}
+
+			.one_6 {
+				display: flex;
+				justify-content: space-between;
+				padding: 2vw;
+				border-bottom: 0.5vw solid var(--f9Color);
+				font-size: 14px;
+			}
+
+			.one_7 {
+				padding: 2vw;
+				border-bottom: 2vw solid var(--f9Color);
+				border-top: 1vw solid var(--f9Color);
+
+				.one_7_1 {
+					padding: 2vw 0;
+					font-size: 14px;
+
+					text {
+						padding: 0 0 0 1vw;
+						font-size: 12px;
+						color: #858585;
+					}
+				}
+
+				.one_7_2 {
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					padding: 2vw;
+					border-radius: 5px;
+					background-color: var(--f9Color);
+
+					.image {
+						width: 20vw;
+						height: 20vw;
+
+						.image {
+							width: 100%;
+							height: 100%;
+							border-radius: 5px;
+							background-color: #fff;
+						}
+					}
+
+					.money {
+						text-align: center;
+
+						.money_1 {
+							font-size: 12px;
+							color: #858585;
+						}
+
+						.money_2 {
+							font-size: 12px;
+							color: #ff0000;
+						}
+					}
+				}
+			}
+
+			.one_8 {
+				padding: 2vw;
+				border-bottom: 0.5vw solid var(--f9Color);
+
+				.one_8_1 {
+					margin: 0 0 1vw 0;
+					display: flex;
+
+					.shop_1 {
+						width: 15vw;
+						height: 15vw;
+						border: 1px solid #f1f1f1;
+
+						.image {
+							width: 100%;
+							height: 100%;
+						}
+					}
+
+					.shop_2 {
+						width: 78vw;
+						padding: 0 0 0 2vw;
+
+						.name {
+							font-size: 14px;
+							margin: 0 0 1vw 0;
+						}
+
+						.num {
+							font-size: 12px;
+							color: #858585;
+
+							text:last-child {
+								color: #000;
+							}
+						}
+					}
+				}
+
+				.one_8_2 {
+					margin: 0 0 2vw 0;
+					display: flex;
+					justify-content: space-between;
+					padding: 2vw 0;
+
+					.score_1 {
+						width: 33vw;
+						text-align: center;
+						font-size: 14px;
+						color: #858585;
+
+						text:nth-child(2) {
+							color: #ff0000;
+						}
+
+						text:nth-child(3) {
+							float: right;
+						}
+					}
+				}
+
+				.one_8_3 {
+					display: flex;
+					justify-content: space-around;
+
+					.btn {
+						width: 40vw;
+
+						button {
+							width: 100%;
+							font-size: 15px;
+
+						}
+					}
+				}
+			}
+
+			.one_9 {
+				padding: 2vw;
+
+				.rich-img {
+					width: 100% !important;
+					display: block;
+				}
+			}
 		}
 
 		.two {