Parcourir la source

H5详情页增加分享给好友弹窗提示

lyb il y a 4 ans
Parent
commit
01eb356a0a

+ 47 - 19
components/alert/timelinePopup.vue

@@ -1,29 +1,56 @@
 <template>
 	<view class="">
+		
 		<view class="modal" :class="timelineShow ? 'show' : ''" @click="timelineShow = false">
 			<image class="img" src="/static/poster/arrow.png"></image>
-			<view class="view text-white">
-				<view class="flex align-center text-bold margin-bottom" style="font-size: 36upx;">
-					<view class="bg-base flex justify-center align-center margin-right"
-						style="width: 50upx;height: 50upx;border-radius: 16upx;">1</view>
-					<view class="flex align-center">
-						<view>点击右上角</view>
-						<image class="margin-lr-sm" src="/static/poster/point.png" style="width: 60upx;height: 38upx;">
-						</image>
-						<view>按钮</view>
+			<template v-if="PopupTyPe === 'friendsCircle'">
+				<view class="view text-white">
+					<view class="flex align-center text-bold margin-bottom" style="font-size: 36upx;">
+						<view class="bg-base flex justify-center align-center margin-right"
+							style="width: 50upx;height: 50upx;border-radius: 16upx;">1</view>
+						<view class="flex align-center">
+							<view>点击右上角</view>
+							<image class="margin-lr-sm" src="/static/poster/point.png" style="width: 60upx;height: 38upx;">
+							</image>
+							<view>按钮</view>
+						</view>
+					</view>
+					<view class="flex align-center text-bold" style="font-size: 36upx;">
+						<view class="bg-base flex justify-center align-center margin-right"
+							style="width: 50upx;height: 50upx;border-radius: 16upx;">2</view>
+						<view class="flex align-center">
+							<view>选择</view>
+							<image class="margin-lr-sm" src="/static/poster/pyq.png" style="width: 48upx;height: 48upx;">
+							</image>
+							<view>分享到朋友圈</view>
+						</view>
 					</view>
 				</view>
-				<view class="flex align-center text-bold" style="font-size: 36upx;">
-					<view class="bg-base flex justify-center align-center margin-right"
-						style="width: 50upx;height: 50upx;border-radius: 16upx;">2</view>
-					<view class="flex align-center">
-						<view>选择</view>
-						<image class="margin-lr-sm" src="/static/poster/pyq.png" style="width: 48upx;height: 48upx;">
-						</image>
-						<view>分享到朋友圈</view>
+			</template>
+			<template v-else>
+				<view class="view text-white">
+					<view class="flex align-center text-bold margin-bottom" style="font-size: 36upx;">
+						<view class="bg-base flex justify-center align-center margin-right"
+							style="width: 50upx;height: 50upx;border-radius: 16upx;">1</view>
+						<view class="flex align-center">
+							<view>点击右上角</view>
+							<image class="margin-lr-sm" src="/static/poster/point.png" style="width: 60upx;height: 38upx;">
+							</image>
+							<view>按钮</view>
+						</view>
+					</view>
+					<view class="flex align-center text-bold" style="font-size: 36upx;">
+						<view class="bg-base flex justify-center align-center margin-right"
+							style="width: 50upx;height: 50upx;border-radius: 16upx;">2</view>
+						<view class="flex align-center">
+							<view>选择</view>
+							<image class="margin-lr-sm" src="/static/poster/zhuanfa.png" style="width: 48upx;height: 48upx;">
+							</image>
+							<view>转发给好友</view>
+						</view>
 					</view>
 				</view>
-			</view>
+			</template>
 		</view>
 	</view>
 </template>
@@ -33,7 +60,8 @@
 		name: '',
 		data() {
 			return {
-				timelineShow: false
+				timelineShow: false,
+				PopupTyPe: '', //朋友圈:friendsCircle 朋友:friend
 			};
 		},
 		methods: {

+ 3 - 0
pages/activity/activityDetail.vue

@@ -433,9 +433,12 @@
 					return
 				}
 				if (item.name == '好友') {
+					this.$refs.timelinePopup.PopupTyPe = 'friend';
+					this.$refs.timelinePopup.show()
 					return
 				}
 				if (item.name == '朋友圈') {
+					this.$refs.timelinePopup.PopupTyPe = 'friendsCircle';
 					this.$refs.timelinePopup.show()
 				}
 			},

BIN
static/poster/zhuanfa.png