分享首页播报

2024-06-03 11:53:59 +08:00
parent 3b22a391c1
commit 4374b2ed72
6 changed files with 291 additions and 20 deletions
--- a/pages/bookShop/commodityDetail.vue
+++ b/pages/bookShop/commodityDetail.vue
@@ -2,8 +2,11 @@
 	<view class="">
 		<view class="header">
 			<!-- 顶部导航栏 -->
-			<z-nav-bar title="商品详情" bgColor="red"></z-nav-bar>
+			<z-nav-bar title="商品详情" bgColor="red"><view class="icon_setUp" slot="right">
+			<image @click="newOnShare()" src="/static/share.png" class="per_mes_img" style="width: 40rpx; height: 40rpx; "></image>
+			</view></z-nav-bar>
 		</view>
+		
 		<view class="swiperBox">
 			<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000"
 				style="width: 100%;height: 100%;">
@@ -13,6 +16,10 @@
 				</swiper-item>
 			</swiper>
 		</view>
+		<!-- <view class="share flexbox" >
+			<text>分享</text>
+			
+		</view> -->
 		<view class="commodityContent">
 			<view class="commodityPrice" v-if="productInfo.activityPrice && productInfo.activityPrice > 0">
 				<span style="font-size: 28rpx;">￥</span><em>{{ productInfo.activityPrice }}</em>
@@ -273,6 +280,10 @@
 		</view>
 		<uni-goods-nav class="goods_nav" :fill="true" :options="options" :buttonGroup="buttonGroup" @click="onClick"
 			@buttonClick="buttonClick" />
+		<!-- 分享弹窗 -->
+		<uni-popup ref="share" type="share" safeArea backgroundColor="#fff">
+			<uni-popup-share @select="haveSelected"></uni-popup-share>
+		</uni-popup>
 		<music-play :playData="playData"></music-play>
 	</view>
 </template>
@@ -301,7 +312,12 @@ export default {
 			options: [{
 				icon: 'cart',
 				text: '购物车'
-			}],
+			},
+			{
+				icon: 'redo',
+				text: '分享'
+			}
+			],
 			buttonGroup: [{
 				text: '加入购物车',
 				backgroundColor: 'linear-gradient(90deg, #FFCD1E, #FF8A18)',
@@ -370,6 +386,51 @@ export default {
 				// 	break;
 			}
 		},
+		// 新写分享
+		newOnShare() {
+			this.$refs.share.open()
+		},
+		haveSelected(data) {
+			let image = ''
+			this.productInfo.productImages && this.productInfo.productImages != '' ? image = this.productInfo.productImages : image =
+				'static/fengziIcon.jpg'
+			console.log(data, ' 选择的是')
+			if (data.index == 0) {
+				// 分享到好友
+				uni.share({
+					provider: "weixin",
+					scene: "WXSceneSession",
+					type: 0,
+					href: this.$apkUrl,									
+					title: `${this.productInfo.productName}`,
+					// summary: `${this.productInfo.content}`,
+					imageUrl: image,					
+					success: function(res) {
+						console.log("success:" + JSON.stringify(res));
+					},
+					fail: function(err) {
+						console.log("fail:" + JSON.stringify(err));
+					}
+				});
+			} else if (data.index == 1) {
+				// 分享到朋友圈
+				uni.share({
+					provider: "weixin",
+					scene: "WXSceneTimeline",
+					type: 0,
+					href: this.$apkUrl,
+					title: `${this.productInfo.productName}`,
+					// summary: `${this.taskInfo.content}`,
+					imageUrl: image,
+					success: function(res) {
+						console.log("success:" + JSON.stringify(res));
+					},
+					fail: function(err) {
+						console.log("fail:" + JSON.stringify(err));
+					}
+				});
+			}
+		},
 		showImg(e) {
 			// console.log(e,'点击的内容')
 			// let contentimg = e.target.dataset.nodes;
@@ -541,10 +602,14 @@ export default {
 		},
 		// 点击购物车
 		onClick(e) {
-			console.log(e.content.text)
-			uni.navigateTo({
-				url: '../peanut/shopping'
-			});
+			console.log(e.content)
+			if(e.content.text == '分享'){	
+				this.$refs.share.open()
+			}else{
+				uni.navigateTo({
+					url: '../peanut/shopping'
+				});
+			}			
 		},
 		// 关联商品点击按钮组件
 		buttonClickLink(e) {
@@ -1298,4 +1363,5 @@ export default {
 .quanyi_book {
 	margin-bottom: 20rpx;
 }
+.icon_setUp{margin-right: 10px;}
 </style>