Explorar o código

【Add】资讯增加海报跳转功能

liuxiangxin hai 3 meses
pai
achega
bc26fb65be
Modificáronse 1 ficheiros con 58 adicións e 19 borrados
  1. 58 19
      pages/article/detail.vue

+ 58 - 19
pages/article/detail.vue

@@ -5,7 +5,11 @@
 		<view class="rich_text">
 			<rich-text :nodes="articleInfo.content"></rich-text>
 		</view>
+		<view class="article_poster" v-if="articleInfo.poster" >
+			<image class="poster_img" show-menu-by-longpress @click="navigatoPage()" :src="articleInfo.poster" mode="widthFix"></image>
+		</view>
 		<view class="read_total">阅读:{{articleInfo.read_count}}</view>
+		<view>&nbsp;</view>
 		<view class="handle_box">
 			<view class="click_box" @click.stop="updateEvent(2)">
 				<uni-icons :type="articleInfo.is_hand?'hand-up-filled':'hand-up'" :color="articleInfo.is_hand?'#e03519':'#333333'" size="20"></uni-icons>
@@ -38,6 +42,8 @@
 					'share_count':0,
 					'is_hand':0,
 					'is_like':0,
+					'path':'',
+					'appid':'',
 					'insert_time':'',
 				},
 				// 请求参数
@@ -60,22 +66,22 @@
 		},
 		onShareAppMessage(obj) {
 			this.updateEvent(3);
-		  return {
-		    title: `999智控终端平台\n${this.articleInfo.title}`,
-		    path: "/pages/article/detail?id=" + this.articleInfo.id,
-		    promise: new Promise((resolve, reject) => {
-		      this.$http.request("api/share_message/get_item", { item_id: this.articleInfo.id, pages: "/pages/article/detail" }).then((callback) => {
-		        console.log(callback, "api/share_message/get_item");
-		        let obj = {
-		          title: callback.data?.title == "" ? `999智控终端平台\n${this.articleInfo.title}` : callback.data.title,
-		          path: "/pages/article/detail?id=" + this.articleInfo.id,
-		        };
-		        if (callback.data?.image_url !== "") {
-		          obj.imageUrl = callback.data.image_url;
-		        }
-		        resolve(obj);
-		      });
-		    }),
+			  return {
+				title: `999智控终端平台\n${this.articleInfo.title}`,
+				path: "/pages/article/detail?id=" + this.articleInfo.id,
+				promise: new Promise((resolve, reject) => {
+				  this.$http.request("api/share_message/get_item", { item_id: this.articleInfo.id, pages: "/pages/article/detail" }).then((callback) => {
+					console.log(callback, "api/share_message/get_item");
+					let obj = {
+					  title: callback.data?.title == "" ? `999智控终端平台\n${this.articleInfo.title}` : callback.data.title,
+					  path: "/pages/article/detail?id=" + this.articleInfo.id,
+					};
+					if (callback.data?.image_url !== "") {
+					  obj.imageUrl = callback.data.image_url;
+					}
+					resolve(obj);
+				  });
+				}),
 		  };
 		},
 		onShow() {
@@ -135,6 +141,28 @@
 				    }
 				  });
 				}
+			},
+			navigatoPage(){
+				// 没有跳转路径
+				if( !this.articleInfo.path ) return '';
+				// 如果路径有http
+				let url 	= this.articleInfo.path;
+				
+				console.log(url);
+				
+				// 判断是不是小程序链接
+				if ( url.includes("http") ) {
+				  // 转码
+				  let link_url = encodeURIComponent(url);
+				  // 跳转到webview
+				  uni.redirectTo({
+				    url: `/pages/webview/index?link_url=${link_url}`,
+				  });
+				} else {
+					console.log(this.articleInfo.appid);
+				  // 是否有appid
+				  this.articleInfo.appid ? uni.navigateToMiniProgram({appId:this.articleInfo.appid,path:url}) : uni.navigateTo({url:url});
+				}
 			}
 		}
 	}
@@ -177,17 +205,28 @@
 		  vertical-align: bottom; // 避免图片之间间隙
 		}
 	}
+	.article_poster{
+		width: 700rpx;
+		display: block;
+		overflow: hidden;
+		margin: 6rpx auto;
+		padding: 10rpx 25rpx;
+		background-color: #FFFFFF;
+		.poster_img{
+			width: 700rpx;
+			display: block;
+		}
+	}
 	.read_total{
 		width: 700rpx;
 		color: #999999;
 		display: block;
 		font-size: 26rpx;
 		overflow: hidden;
-		line-height: 40rpx;
+		line-height: 60rpx;
 		padding: 0rpx 25rpx;
-		padding-bottom: 60rpx;
+		margin-bottom: 122rpx;
 		background-color: #FFFFFF;
-		
 	}
 	.handle_box {
 	  left: 0rpx;