dev/dcp-app-gate/pages/cooperationExchange/cooperationExchangeList/cooperationActiveResults.vue

<template>
	<view class="rf-category activityIntroduction" style="margin:20upx 20upx;">
		<view style="height:50upx; display: flex;">
			<u-image src="@/static/img/cooperationExchange/20200608_03.gif" alt=""
				style="height: 100%;vertical-align: middle; width: 10upx;">
			</u-image>
			<text
				style="margin-left: 10px;font-weight: 700;color: #000;font-size: 42upx;">{{i18n("ActivityResults")}}</text>
		</view>
		<view class="content" v-for="(item,index) in countryList">
			<!-- <u-image v-if="state==1" :src="'./api/file/pub/${item.attachmentSavePath}'" alt="" style="width: 20%;height: 20%;"></u-image>
					<u-image v-if="state==2" src="@/static/img/cooperationExchange/txt.png" alt="" class="Messicon"></u-image>
					<u-image v-if="state==3" src="@/static/img/cooperationExchange/excel.png" alt="" class="Messicon"></u-image>
					<u-image v-if="state==6" src="@/static/img/cooperationExchange/powerpoint.png" alt="" class="Messicon"></u-image>
					<u-image v-if="state==5" src="@/static/img/cooperationExchange/pdf.png" alt="" class="Messicon"></u-image>
					<u-image v-if="state==4" src="@/static/img/cooperationExchange/word.png" alt="" class="Messicon"></u-image> -->
			<text class="func_name">{{item.attachmentName}}</text>
			<view class="func_dp">
				<!-- <text class="func-preview" @click="preview(item.attachmentSavePath)">{{i18n('preview')}}</text> -->
				<text class="func-download "
					@click="download(item.attachmentSavePath,item.attachmentName)">{{i18n('download')}}</text>
			</view>
		</view>
	</view>

</template>
<script>
	export default {
		name: "cooperationActiveResults",
		props: ["id", "countryList"],
		data() {
			return {
				i: 0,
			}
		},

		methods: {
			download(path, fileName) {
				uni.downloadFile({
					url: websiteUrl + path, //下载地址接口返回
					success: (data) => {
						if (data.statusCode === 200) {
							//文件保存到本地
							uni.saveFile({
								tempFilePath: data.tempFilePath, //临时路径
								success: function(res) {
									uni.showToast({
										icon: 'none',
										mask: true,
										title: '文件已保存：' + res.savedFilePath, //保存路径
										duration: 3000,
									});
									setTimeout(() => {
										//打开文档查看
										uni.openDocument({
											filePath: res.savedFilePath,
											success: function(res) {
												// console.log('打开文档成功');
											}
										});
									}, 3000)
								}
							});
						}
					},
					fail: (err) => {
						console.log(err);
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '失败请重新下载',
						});
					},
				});
				console.log('下载成功', 'https://localhost:8080/api/file/pub/' + path);
			},
			preview(url) {
				uni.navigateTo({
					url: '/pages/public/pdf?links=' + 'api/file/pub/' + url
				})
			},
			i18n(data) {
				return this.$t('common.' + data);
			},

		}
	}
</script>
<style scoped lang="scss">
	.rf-category {
		background-color: $color-white;
		/*  #ifdef  APP-PLUS  */
		margin-top: calc(20upx + var(--status-bar-height));
		/*  #endif  */
	}

	.activityIntroduction /deep/ img {
		max-width: 700upx !important;
	}

	.result {
		height: 100%;
		width: 100%;
		margin-top: 30upx;
	}

	.content {
		// height: 100%;
		vertical-align: center;
		margin: 30upx 2upx;
		width: 100%;
		position: relative;
		display: inline-block;

	}

	.func_dp {
		position: absolute;
		top: 50%;
		right: 10upx;
		transform: translateY(-50%);
		display: inline-block;
	}

	.func-download {
		color: rgb(10, 15, 255);
		margin: 0upx 36upx;
		float: right;
		/* line-height: 10upx; */
	}

	.func-preview {
		color: rgb(10, 15, 255);
		margin: 0upx 12upx;
		cursor: pointer;
		// float: right;
	}

	.func_name {
		display: inline-block;
		width: 60%;
		// overflow: hidden;
		white-space: pre-wrap;
	}

	/* .Messicon {
		height: 60upx;
		margin-top: 24upx;
		float: left;
		margin-right: 20upx;
	} */
</style>