需求池12 单个沙盘图分享

pages-sandTable/sandTable.vue

@@ -34,7 +34,7 @@
 		</block>
 		<!-- 有权限 -->
 		<view v-show="noAuthor ==0 && isFinished" style="padding-top: 156rpx;">
-			<view style="position: fixed;top: 0;width: 100vw;">
+			<view style="position: fixed;top: 0;width: 100vw;z-index: 2;">
 				<view style="height: 2rpx;background-color: #F6F6F6;"></view>
 				  <view class="search-wrap">
 					  <van-search
@@ -72,8 +72,14 @@
 							<rich-text :nodes="item.name" class="sandTable-name"></rich-text>
 						</view>
 						<view class="sandTable-box-topR">
-							<image src="../static/sandTable/fullScreen.png" style="margin-right: 50rpx;" @click="previewImage(index)"></image>
-							<image src="../static/sandTable/sandTable-share.png" @click="generatePoster('detail',item)"></image>
+							<image src="../static/sandTable/fullScreen.png" style="margin-right: 32rpx;" @click="previewImage(index)"></image>
+							<image src="../static/share-poster-icon.png" style="margin-right: 32rpx;height: 40rpx;width: 40rpx;" @click="generatePoster('detail',item)"></image>
+							<button 
+								class="share-btn" 
+								open-type="share" 
+								:data-item="item">
+								<image src="../static/sandTable/sandTable-share.png" mode="aspectFill"/>
+							</button>
 						</view>
 					</view>
 					<view class="sandTable-item" @click="previewImage(index)">
@@ -186,7 +192,7 @@
 		onLoad(options) {
 			this.init(options)
 		},
-		onShow(options) {
+		onShow() {
 			// 预览图片结束时，会触发onShow，切回竖屏
 			uni.setPageOrientation({orientation : "portrait"})
 			if(this.haveGoToResult){
@@ -196,13 +202,36 @@
 			}
 		},
 		// 小程序自带分享
-		onShareAppMessage() {
-			let {keyword,chart_permission_id,is_high_light} = this.sandTableQuery
-		    return {
-		        title:'沙盘推演',
-				path:`/pages-sandTable/sandTable?keyword=${keyword}&chart_permission_id=${chart_permission_id}`+
-				`&is_high_light=${is_high_light}&firstClassifyId=${this.selectedFirstId}`
-		    }
+		onShareAppMessage({from,target}) {
+			if(from == 'menu'){
+				// 列表分享
+				let {keyword,chart_permission_id,is_high_light} = this.sandTableQuery
+				return {
+				    title:'沙盘推演',
+					path:`/pages-sandTable/sandTable?keyword=${keyword}&chart_permission_id=${chart_permission_id}`+
+					`&is_high_light=${is_high_light}&firstClassifyId=${this.selectedFirstId}`
+				}
+			}else if(from == 'button'){
+				// 单个分享
+				let {sandbox_id,chart_permission_id,chart_permission_name,name,pic_url} = target.dataset.item
+				let first_permission_id = 0
+				// 通过分享的沙盘图的二级分类Id，找到对应的一级Id
+				U:for (let item of this.classfyList) {
+					for (let it of item.list) {
+						if(it.chart_permission_id == chart_permission_id){
+							first_permission_id = item.id
+							break U
+						}
+					}
+				}
+				return {
+				    title:`${chart_permission_name}: ${name}`,
+					path:`/pages-sandTable/sandTable?sandbox_id=${sandbox_id}&chart_permission_id=${chart_permission_id}`+
+					`&firstClassifyId=${first_permission_id}`,
+					imageUrl:pic_url
+				}
+			}
+
 		},
 		onPullDownRefresh() {
 			this.sandTableQuery.curr_page=1
@@ -232,10 +261,13 @@
 			async init(options){
 				let obj={}
 				if(options.scene){
+					// 海报分享
 					let res = await apiGetSceneToParams({scene_key:options.scene})
 					if(res.code==200){
 						obj=JSON.parse(res.data)
 					}
+				}else{
+					obj = options
 				}
 				// 有sandbox_id 说明是单个分享进来的
 				if(obj.sandbox_id){
@@ -636,6 +668,16 @@
 				.sandTable-box-topR{
 					display: flex;
 					align-items: center;
+					.share-btn{
+						padding: 0;
+						height: unset;
+						line-height: unset;
+						font-size: 0;
+						border-radius: unset;
+						&::after{
+							border: none;
+						}
+					}
 					image{
 						width: 32rpx;
 						height: 32rpx;