You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
121 lines
2.4 KiB
121 lines
2.4 KiB
10 months ago
|
<template>
|
||
|
|
||
|
<BaseContainer>
|
||
|
<NavBar title="推广海报" />
|
||
|
|
||
|
<TkiQrcode
|
||
|
loadMake
|
||
|
v-if="isQrcodeCanvasVisable"
|
||
|
ref="qrcode"
|
||
|
:showLoading="false"
|
||
|
:val="qrcodeText"
|
||
|
@result="handleQrcodeCreateSuccess"
|
||
|
/>
|
||
|
|
||
|
<canvas
|
||
|
canvas-id="poster"
|
||
|
v-if="isPosterCanvasVisable"
|
||
|
class="poster-canvas"
|
||
|
/>
|
||
|
<template v-if="filename">
|
||
|
<image
|
||
|
mode="widthFix"
|
||
|
@longpress="handleLonePress"
|
||
|
class="poster-img"
|
||
|
:src="filename"
|
||
|
/>
|
||
|
<view class="poster-tips">长按图片,保存至手机</view>
|
||
|
</template>
|
||
|
</BaseContainer>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { getPosterSpecial } from "@/api/spread";
|
||
|
import posterMixin from "@/mixins/poster";
|
||
|
|
||
|
import userInfoMixin from "@/mixins/userInfo";
|
||
|
|
||
|
export default {
|
||
|
mixins: [posterMixin, userInfoMixin],
|
||
|
data() {
|
||
|
return {
|
||
|
special_id: 0,
|
||
|
url: "",
|
||
|
poster_image: "",
|
||
|
site_name: "",
|
||
|
};
|
||
|
},
|
||
|
computed: {
|
||
|
shareQrcodeData() {
|
||
|
return {
|
||
|
spread_uid: this.userInfo?.uid,
|
||
|
special_id: this.special_id,
|
||
|
};
|
||
|
},
|
||
|
},
|
||
|
onLoad(options) {
|
||
|
const { special_id ,is_light } = this.$util.mergeLaunchParams(options);
|
||
|
this.is_preview = false;
|
||
|
this.special_id = special_id;
|
||
|
this.getPosterInfo().then(() => {
|
||
|
this.createSharePoster("special", {
|
||
|
id: this.special_id,
|
||
|
spread_uid: this.userInfo?.uid,
|
||
|
url: is_light ==0 ?'pages/special/details' :'pages/special/single_details'
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
methods: {
|
||
|
handleLonePress() {
|
||
|
// #ifndef H5
|
||
|
uni.saveImageToPhotosAlbum({
|
||
|
filePath: this.filename,
|
||
|
success: () => {
|
||
|
this.$util.showMsg("保存成功");
|
||
|
},
|
||
|
fail: (err) => {
|
||
|
this.$util.showMsg(err.msg);
|
||
|
},
|
||
|
});
|
||
|
// #endif
|
||
|
},
|
||
|
async getPosterInfo() {
|
||
|
try {
|
||
|
const { data } = await getPosterSpecial(this.special_id);
|
||
|
const { url, poster_image, site_name } = data;
|
||
|
Object.assign(this, {
|
||
|
url,
|
||
|
poster_image,
|
||
|
site_name,
|
||
|
});
|
||
|
} catch (err) {
|
||
|
this.$util.showMsg(err);
|
||
|
}
|
||
|
},
|
||
|
},
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style scoped lang="scss">
|
||
|
.poster-canvas {
|
||
|
width: 600px;
|
||
|
height: 960px;
|
||
|
}
|
||
|
|
||
|
page {
|
||
|
background-color: #666;
|
||
|
}
|
||
|
|
||
|
.poster-img {
|
||
|
width: 80%;
|
||
|
margin: 70rpx auto;
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.poster-tips {
|
||
|
font-size: 24rpx;
|
||
|
text-align: center;
|
||
|
color: #cecece;
|
||
|
}
|
||
|
</style>
|