frontend-app/pages/other_package/invite_friends/invite_friends.vue

<template>
	<view class="invite_friends_warp">
		<view class="invite_img">
			<up-image :loading="imageLoading" :src="inviteImage" width="100%" height="460" bgColor="#f1f6ff00" shape="square"
				radius=10></up-image>
		</view>
		<view class="invite_but">
			<view class="save_but">
				<text style="margin-left: 10rpx;" @click="saveBaseImgFile">保存图片</text>
			</view>
		</view>
		<up-toast ref="uToastRef"></up-toast>
	</view>
</template>

<script>
import { getSharePoster, generateSharePoster } from '@/api/common.js';

export default {
	data() {
		return {
			inviteImage: null,
			imageLoading: false,
		}
	},
	mounted() {
		this.getSharePoster();
	},
	methods: {

		// 查询分享模版
		async getSharePoster() {
			this.imageLoading = true;
			const resp = await getSharePoster();
			if (resp && resp.bizcode === 100) {
				const data = resp.data[0];
				// 生成分享图
				const generateResp = await generateSharePoster({ id: data.id });
				if (generateResp && generateResp.bizcode === 100) {
					this.inviteImage = generateResp.data;
				}
			}
			this.imageLoading = false;
		},
		saveBaseImgFile() {
			uni.showLoading({
				title: '保存中...',
			})
			const currentBase64 = this.inviteImage;
			const bitmap = new plus.nativeObj.Bitmap('base64')
			bitmap.loadBase64Data(currentBase64, () => {
				const url = '_doc/' + new Date().getTime() + '.png'
				bitmap.save(
					url,
					{
						overwrite: false, // 是否覆盖
					},
					(i) => {
						uni.saveImageToPhotosAlbum({
							filePath: url,
							success: () => {
								uni.hideLoading();
								this.$refs.uToastRef.show({
									type: 'success',
									message: "图片保存到相册成功",
								});
								bitmap.clear()
							}
						})
					},
					(e) => {
						uni.hideLoading();
						console.log('图片保存失败', e)
						this.$refs.uToastRef.show({
							type: 'error',
							message: "图片保存失败",
						});
						bitmap.clear()
					}
				)
			},
				(e) => {
					uni.hideLoading();
					console.log('图片保存失败', e)
					this.$refs.uToastRef.show({
						type: 'error',
						message: "图片保存失败",
					});
					bitmap.clear()
				}
			)
		}
	}
}
</script>

<style lang="scss" scoped>
.invite_friends_warp {
	height: calc(100vh - 80rpx);
	padding: 40rpx;
}

.invite_img {
	margin-top: 52rpx;
	height: 930rpx;
}

.invite_but {
	padding: 20rpx 50rpx;
	margin-top: 52rpx;

	.save_but {
		text-align: center;
		background: $app-bt-bj;
		border-radius: 45rpx;
		width: 100%;
		color: #FFF;
		padding: 30rpx 0;
		font-weight: 500;
		font-size: 32rpx;
		color: #FFFFFF;
	}
}
</style>