pet-front/otherPages/binding/share/index.vue

<template>
	<view class="share w100 h100">
		<view class="flex-colc content w100">
			<image :src="url" mode=""></image>
			<view class="btn color-fff size-30 flex-rowc" @tap="getImageInfo">
				保存海报
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: "",
			}
		},
		onLoad(options) {
			this.url = options.url
		},
		methods: {
			getImageInfo() {
				// uni.getImageInfo({
				// 	src: this.url,
				// 	success: res => {
				// 		this.savePosterPath(res.path)
				// 	}
				// })
				uni.downloadFile({
					url: this.url,
					success: res => {

						this.savePosterPath(res.tempFilePath)
					}
				})
			},
			savePosterPath(path) {
				uni.getSetting({
					success: res => {
						console.log(res)
						if (res.authSetting['scope.writePhotosAlbum']) {
							uni.authorize({
								scope: 'scope.writePhotosAlbum',
								success: () => {
									uni.saveImageToPhotosAlbum({
										filePath: path,
										success: () => {
											uni.showToast({
												title: "保存成功"
											})
										},
										fail: () => {
											uni.showToast({
												title: "保存失败",
												icon: "none"
											})
										}
									})
								}
							})
						} else {
							uni.showModal({
								title: "权限提醒",
								content: "是否开启保存相册功能?",
								success: res1 => {
									if (res1.confirm) {
										uni.openSetting({
											success: result => {
												uni.showToast({
													title: "保存成功"
												})
											},
											fail: () => {
												uni.showToast({
													title: "保存失败",
													icon: "none"
												})
											}
										})
									}
								},
								fail: () => {
									uni.showToast({
										title: "保存失败",
										icon: "none"
									})
								}
							})
						}
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.share {
		background-color: #FFEFD8;
		width: 100vw;
		height: 100vh;

		.content {
			position: fixed;
			bottom: 30rpx;

		}

		image {
			width: 250rpx;
			height: 237rpx;
			background-color: #fff;
			margin-bottom: 186rpx;
		}

		.btn {
			width: 594rpx;
			height: 94rpx;
			border-radius: 94rpx;
			background-color: #FFBF60;
		}
	}
</style>