lanan-old/lanan-master-uniapp/pages/tabBar/mine/qrcode.vue

102 lines
1.7 KiB
Vue
Raw Normal View History

2024-07-17 14:16:22 +08:00
<template>
<view class="container">
<view class="c-top">
<view style="width: 100%;height: 50px;"></view>
<view class="z-box">
<canvas style="width:200px; height: 200px;" canvas-id="myQrcode"></canvas>
</view>
<view class="t-jinse">
<text>小程序邀请码</text>
</view>
</view>
</view>
</template>
<script>
import drawQrcode from 'weapp-qrcode';
import {
getToken
} from '@/utils/auth'
export default {
data(){
return{
}
},
mounted() {
this.open()
},
methods:{
async open(){
const res = await this.$request({
url: '/getAppInfo',
}).then((res)=>{
console.log('userinfo',res.user.userId);
let texts ='https://www.nuoyunr.com/lananwx?id='+res.user.userId
drawQrcode({
width: 200,
height: 200,
canvasId: 'myQrcode',
text: texts,
})
})
},
}
}
</script>
<style scoped lang="scss">
.container{
width: 100%;
height: calc(100vh);
box-sizing: border-box;
background-color: #242A38;
}
.c-top{
width: 100%;
padding: 0px;
}
.z-box{
width: 200px;
height: 200px;
margin: 0 auto;
// box-sizing: border-box;
// padding: 10px ;
// border: 1px solid #F3BA60;
}
.t-jinse{
margin-top: 20px;
width: 100%;
text-align: center;
font-size: 18px;
line-height: 28px;
color: #F3BA60;
}
.t-title{
font-size: 18px;
font-weight: bold;
color:#FFFFFF;
}
.t-box{
margin-top: 20px;
width: 100%;
box-sizing: border-box;
background: rgba(255, 255, 255, 0.2);
padding: 0px 15px;
border-radius: 6px;
}
.box{
box-sizing: border-box;
padding: 18px 2px;
border-bottom: 0.5px solid #242A38;
color: rgba(210, 195, 175, 1) ;
}
</style>