长图海报下载

library/longPoster/index.css

@@ -45,6 +45,7 @@ page{
 	width: 335rpx;
 	margin-right: calc(100% - 670rpx);
 	margin-bottom: 40rpx;
+	position: relative;
 }
 .poster-item:nth-child(2n){
 	margin-right: 0rpx;
@@ -71,6 +72,20 @@ page{
 	margin-top: 12rpx;
 	padding: 0 10rpx;
 }
+.zhuanfa{
+	position: absolute;
+	top: 20rpx;
+	right: 20rpx;
+	width: 87rpx;
+	height: 46rpx;
+	line-height: 46rpx;
+	background: rgba(0,0,0,.6);
+	border-radius: 23rpx 23rpx 23rpx 23rpx;
+	font-size: 24rpx;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+}
 
 .act-create{
 	width: 110rpx;

library/longPoster/index.vue

@@ -9,9 +9,10 @@
 		</view>
 		<view style="height: 120rpx;"></view>
 		<view class="ddflex" style="padding: 30rpx;">
-			<view class="poster-item" v-for="item in 36" @click="jumpUrl('/library/longPosterService/longPosterService')">
+			<view class="poster-item" v-for="item in 36">
 				<image class="poster-item-pic" src="http://img.zhiqiyun.com/test/2023/07/31/8b7ed072b68fe70f0d6f409a71a8b17b.png" mode="aspectFill"></image>
 				<view class="poster-item-title tover">年度理赔账单</view>
+				<view class="zhuanfa" @click="download('http://img.zhiqiyun.com/test/2023/07/31/8b7ed072b68fe70f0d6f409a71a8b17b.png')">转发</view>
 				<!-- <view class="poster-item-use">2056 人正在使用</view> -->
 			</view>
 		</view>
@@ -67,6 +68,25 @@
 			hideBtn() {
 				this.isShowbtn = false;
 			},
+			download(url){
+				uni.downloadFile({
+					url: url, //仅为示例，并非真实的资源
+					success: (res) => {
+						console.log(res)
+						if (res.statusCode === 200) {
+							console.log('下载成功');
+							var oA = document.createElement("a");
+							oA.download = ''; // 设置下载的文件名，默认是'下载'
+							oA.href = res.tempFilePath; //临时路径再保存到本地
+							document.body.appendChild(oA);
+							oA.click();
+							oA.remove(); // 下载之后把创建的元素删除
+							req.msg('已保存')
+						}
+				
+					}
+				});
+			}
 		},
 		mounted() {