18
This commit is contained in:
cansnow
@@ -14,11 +14,11 @@
|
||||
</uni-nav-bar>
|
||||
<view style="flex:1;display: flex;flex-direction: column;align-items: center;justify-content: center;">
|
||||
<view class="info_card">
|
||||
<my-avatar :src="userInfo.faceURL" :desc="userInfo.nickname" size="64" />
|
||||
<my-avatar :src="source.faceURL" :desc="source.showName" size="64" />
|
||||
<view class="id_row">
|
||||
<text class="nickname">{{ userInfo.nickname }}</text>
|
||||
<view class="id_row_copy" @click="copy">
|
||||
<text class="id">{{ userInfo.userID }}</text>
|
||||
<text class="nickname">{{ source.showName }}</text>
|
||||
<view class="id_row_copy" @click="copy(source.code)">
|
||||
<text class="id">{{ source.code }}</text>
|
||||
<image style="width: 32rpx; height: 32rpx" src="@/static/images/id_copy.png" mode="" />
|
||||
</view>
|
||||
</view>
|
||||
@@ -29,7 +29,7 @@
|
||||
<view style="width: 80%;display: flex;align-items: center;justify-content: center;height: 20%;">
|
||||
<u-button type="default" plain :hairline="false" iconColor="#9aa2b2" @click="scan">扫一扫</u-button>
|
||||
<u-button type="default" plain :hairline="false" iconColor="#9aa2b2">换个样式</u-button>
|
||||
<u-button type="default" plain :hairline="false" iconColor="#9aa2b2">保存图片</u-button>
|
||||
<u-button @click="save" type="default" plain :hairline="false" iconColor="#9aa2b2">保存图片</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -39,6 +39,8 @@
|
||||
import QRCode from "@/components/qrcode.js";
|
||||
import UserBase from '@/components/User.vue';
|
||||
import util from "@/util";
|
||||
import { mapGetters } from "vuex";
|
||||
import md5 from "md5";
|
||||
export default {
|
||||
mixins:[UserBase],
|
||||
components: {
|
||||
@@ -46,15 +48,54 @@
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
qrcodeUrl:"",
|
||||
qrcode_src:"",
|
||||
source:{
|
||||
type:"user",
|
||||
showName:"",
|
||||
faceURL:"",
|
||||
code:"",
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
console.log(this.userInfo)
|
||||
computed:{
|
||||
...mapGetters(["storeFriendList","storeGroupList","config"]),
|
||||
},
|
||||
onLoad(opt) {
|
||||
if(opt.sourceInfo){
|
||||
this.source = JSON.parse(opt.sourceInfo);
|
||||
}else{
|
||||
this.source = {
|
||||
type:"user",
|
||||
showName:"",
|
||||
faceURL:"",
|
||||
code:"",
|
||||
};
|
||||
}
|
||||
console.log(this.config);
|
||||
if(this.source.type == "user"){
|
||||
this.qrcodeUrl = `${this.config.website}/u/${this.source.code}`;
|
||||
}else{
|
||||
this.qrcodeUrl = `${this.config.website}/g/${this.source.code}`;
|
||||
}
|
||||
console.log(this.qrcodeUrl);
|
||||
this.createQrcode();
|
||||
},
|
||||
methods: {
|
||||
...util,
|
||||
save(){
|
||||
const _this = this;
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath:_this.qrcode_src,
|
||||
success() {
|
||||
util.success("保存成功");
|
||||
},
|
||||
fail(e) {
|
||||
console.log(e);
|
||||
util.error("保存失败");
|
||||
}
|
||||
})
|
||||
},
|
||||
createQrcode() {
|
||||
const _this = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
@@ -64,7 +105,7 @@
|
||||
usingComponents: true, // 是否是自定义组件
|
||||
showLoading: false, // 是否显示loading
|
||||
loadingText: "", // loading文字
|
||||
text: "/pages/common/invite_register?code=", // 生成内容
|
||||
text: `${this.qrcodeUrl}`, // 生成内容
|
||||
size: 320, // 二维码大小
|
||||
background: "#fff", // 背景色
|
||||
foreground: '#000000', // 前景色
|
||||
@@ -73,7 +114,7 @@
|
||||
image: "", // 二维码图标
|
||||
imageSize: 40, // 二维码图标大小
|
||||
cbResult: function(res) { // 生成二维码的回调
|
||||
//_this.qrcode_src = (res)
|
||||
_this.qrcode_src = (res)
|
||||
//resolve(res);
|
||||
},
|
||||
});
|
||||
@@ -84,48 +125,46 @@
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.info_card {
|
||||
width: 600rpx;
|
||||
height: 196rpx;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
margin: 0 auto 0 auto;
|
||||
padding: 0 36rpx;
|
||||
color: #0c1c33;
|
||||
.info_card {
|
||||
width: 600rpx;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
margin: 0 auto 0 auto;
|
||||
padding: 40rpx 36rpx;
|
||||
color: #0c1c33;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.id_row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 16rpx;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-around;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
|
||||
.id_row {
|
||||
&_copy {
|
||||
@include vCenterBox();
|
||||
display: flex;
|
||||
//height: 46px;
|
||||
margin-left: 16rpx;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
|
||||
&_copy {
|
||||
@include vCenterBox();
|
||||
}
|
||||
|
||||
.nickname {
|
||||
@include nomalEllipsis();
|
||||
max-width: 400rpx;
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
.id {
|
||||
color: #8e9ab0;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
.nickname {
|
||||
@include nomalEllipsis();
|
||||
max-width: 400rpx;
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
.id {
|
||||
color: #8e9ab0;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user