四零语境前端代码仓库
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.
 
 
 

106 lines
2.1 KiB

<template>
<view class="share-page">
<!-- <uv-status-bar></uv-status-bar> -->
<!-- 主要内容区域 -->
<view class="content">
<!-- 中间图片 -->
<view class="image-container">
<image
class="share-image"
:src="Qrcode"
mode="widthFix"
></image>
</view>
</view>
<!-- 底部固定按钮 -->
<view class="bottom-button-container">
<uv-button :custom-style="{
height: '82rpx',
borderRadius: '198rpx',
background: '#06DADC',
border: '2rpx solid #06DADC',
lineHeight: '82rpx',
fontSize: '36rpx'
}" type="primary" @click="save">保存到相册</uv-button>
<uv-safe-bottom></uv-safe-bottom>
</view>
</view>
</template>
<script>
export default {
data() {
return {
Qrcode: '',
}
},
methods: {
handleShare() {
// 分享逻辑
uni.showToast({
title: '分享功能',
icon: 'none'
})
},
async getQrcode() {
// const res = await this.$api.promotion.qrCode()
// if (res.code === 200) {
uni.getImageInfo({
src: `${this.$config.baseURL}/promotion/qrCode?token=${uni.getStorageSync('token')}`,
success: function (image) {
console.log(image.width);
console.log(image.path);
this.Qrcode = image.path;
console.log(image.height);
}
});
// }
}
},
onShow() {
this.getQrcode()
},
}
</script>
<style lang="scss" scoped>
.share-page {
min-height: 100vh;
background-color: #f5f5f5;
display: flex;
flex-direction: column;
}
.content {
flex: 1;
padding-bottom: 200rpx;
display: flex;
align-items: center;
justify-content: center;
.image-container {
display: flex;
justify-content: center;
align-items: center;
.share-image {
width: 670rpx;
border-radius: 16rpx;
}
}
}
// 底部固定按钮
.bottom-button-container {
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: 30rpx 40rpx;
background: rgba(255, 255, 255, 0.95);
border-top: 1px solid #F1F1F1;
}
</style>