141 lines
3.1 KiB
Vue
141 lines
3.1 KiB
Vue
<template>
|
||
<view class="page-content bg-main-oil">
|
||
<view class="qr-container shadow bg-white">
|
||
<view class="text-xxl padding back-x" @tap="goBack(1)">
|
||
<text class="cuIcon-close ">
|
||
</text>
|
||
</view>
|
||
<view class="text-center logo">
|
||
<image style="width:180upx" :src="mainURL+'logo.png'" mode="widthFix"></image>
|
||
<!-- <image style="width:150upx" :src="mainURL+'bg-qy.png'" mode="widthFix"></image> -->
|
||
|
||
</view>
|
||
<view class="margin padding text-center oil-main-color text-xl">
|
||
<text @tap="getCompanyQrCode(id)">{{companyName}}</text>
|
||
<view class="cu-tag bg-red bg-main-oil padding-left self-tag" @tap="goBack(1)">
|
||
<text class="padding-left-sm">
|
||
<text class="cuIcon-order icon-exchange "></text>
|
||
切换企业</text>
|
||
</view>
|
||
</view>
|
||
<view class="padding-top text-center qr-part">
|
||
<view class="qrimg" @tap="copyQrStr">
|
||
<tki-qrcode ref="qrcode" cid="2" loadMake :val="val" :size="400" unit="upx" background="#fff" foreground="#000"
|
||
pdground="#000" :icon="iconUrl" iconSize="40" onval :usingComponents="usingComponents" showLoading @result="qrR" />
|
||
</view>
|
||
</view>
|
||
<view class="margin padding text-center bg-white ">
|
||
<text>使用星油扫一扫，司机即可快速加入该企业</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import partnerApi from '@/api/partner.js'
|
||
// 引入二维码库
|
||
import tkiQrcode from "../../../components/tki-qrcode/tki-qrcode.vue" //二维码生成器
|
||
export default {
|
||
components: {
|
||
tkiQrcode
|
||
},
|
||
data() {
|
||
return {
|
||
qrImg: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1102530589,2787379918&fm=11&gp=0.jpg",
|
||
val: '',
|
||
iconUrl: '../../static/img/qr-icon.png',
|
||
mainURL: this.global.mainURL,
|
||
id: '',
|
||
companyName: ''
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
console.log(option.id)
|
||
this.id = option.id
|
||
this.companyName = option.name
|
||
},
|
||
onShow() {
|
||
// this.qrInit()
|
||
this.getCompanyQrCode(this.id)
|
||
},
|
||
onPullDownRefresh() {
|
||
this.getCompanyQrCode(this.id)
|
||
},
|
||
created() {},
|
||
methods: {
|
||
goBack(num) {
|
||
uni.navigateBack({
|
||
delta: num
|
||
})
|
||
},
|
||
qrR() {
|
||
|
||
},
|
||
copyQrStr() {
|
||
uni.setClipboardData({
|
||
data: this.val,
|
||
success: () => {
|
||
uni.showToast({
|
||
title: '已复制',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
})
|
||
},
|
||
getCompanyQrCode(id) {
|
||
const data1 = {
|
||
companyId: id,
|
||
oilSiteCode: uni.getStorageSync('oilSite').oilSiteCode
|
||
}
|
||
partnerApi.getCompanyQrCode(data1).then(res => {
|
||
if (res.code == 20000) {
|
||
this.val = res.data
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.qr-container {
|
||
height: 80%;
|
||
position: absolute;
|
||
bottom: 0;
|
||
width: 750upx;
|
||
border-radius: 10px 10px 0 0;
|
||
box-shadow: 3px -3px 4px rgba(26, 26, 26, 0.2);
|
||
}
|
||
|
||
.logo {
|
||
position: absolute;
|
||
width: 100%;
|
||
top: -80rpx;
|
||
}
|
||
|
||
.qr-part {
|
||
position: relative;
|
||
z-index: 2;
|
||
}
|
||
|
||
.self-tag {
|
||
position: absolute;
|
||
right: 0;
|
||
top: 2em;
|
||
border-radius: 100upx 0 0 100upx;
|
||
}
|
||
|
||
.icon-exchange {
|
||
/* transform: scale(1, 1.8); */
|
||
transform: rotate(90deg);
|
||
position: absolute;
|
||
left: 15upx;
|
||
line-height: 1rem;
|
||
}
|
||
|
||
.back-x {
|
||
position: relative;
|
||
z-index: 3;
|
||
}
|
||
</style>
|