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.
134 lines
3.7 KiB
134 lines
3.7 KiB
<template>
|
|
<view class="occupy-share">
|
|
<view class="os-address">
|
|
<view class="oa-name">
|
|
<image mode="aspectFit" :src="shareInfo.stadium_logo"></image>
|
|
<view>{{ shareInfo.stadium_name || '-' }}</view>
|
|
</view>
|
|
<view class="oa-info">
|
|
<view>地址：</view>
|
|
<view>{{ shareInfo.stadium_address || '-' }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="os-section">
|
|
<view class="os-des">
|
|
<view>①<text>截图</text>该页面后，发此图给朋友 </view>
|
|
<view>② 朋友<text>长按此图</text>识别下面的二维码<text>关注公众号</text> </view>
|
|
<view>③ 接收微信消息，<text>领取入场码</text></view>
|
|
<view>④ 领取成功后<text>仅限本人使用</text></view>
|
|
</view>
|
|
<image class="os-code-img" mode="aspectFit" :src="shareInfo.share_qrcode"></image>
|
|
<view class="os-tip">注：此码非入场码</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { API } from '../../../js/api'
|
|
import { servers } from '../../../js/server'
|
|
export default {
|
|
data(){
|
|
return {
|
|
shareInfo: {},
|
|
}
|
|
},
|
|
onLoad(options){
|
|
this.getShareCode({
|
|
brand_id: options.brand_id,
|
|
order_no: options.order_no,
|
|
})
|
|
},
|
|
methods: {
|
|
getShareCode({ brand_id, order_no }){
|
|
servers.get({
|
|
url: API.venue.takeUpShareQr,
|
|
data: { brand_id, order_no, },
|
|
failMsg: '加载失败！'
|
|
})
|
|
.then(res=> {
|
|
console.warn('shareInfo', res)
|
|
this.shareInfo = res || {};
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import '~style/public.scss';
|
|
page{
|
|
background-color: $themeColor;
|
|
}
|
|
.occupy-share{
|
|
padding-top: 32upx;
|
|
padding-left: 24upx;
|
|
padding-right: 24upx;
|
|
|
|
}
|
|
.os-address{
|
|
margin-bottom: 36upx;
|
|
.oa-name{
|
|
margin-bottom: 20upx;
|
|
@include centerFlex(flex-start);
|
|
>image{
|
|
flex-shrink: 0;
|
|
margin-right: 10upx;
|
|
width: 34upx;
|
|
height: 34upx;
|
|
}
|
|
>view{
|
|
line-height: 40upx;
|
|
font-size: 28upx;
|
|
color: #fff;
|
|
@include textHide(1);
|
|
}
|
|
}
|
|
.oa-info{
|
|
display: flex;
|
|
align-items: baseline;
|
|
>view{
|
|
line-height: 40upx;
|
|
font-size: 28upx;
|
|
color: #fff;
|
|
&:first-child{
|
|
flex-shrink: 0;
|
|
}
|
|
&+view{
|
|
flex-grow: 1;
|
|
word-break: break-all;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.os-section{
|
|
padding: 30upx 60upx 0;
|
|
height: 640upx;
|
|
overflow: hidden;
|
|
border-radius: 10upx;
|
|
background-color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
flex-direction: column;
|
|
.os-des{
|
|
margin-bottom: 16upx;
|
|
>view{
|
|
line-height: 52upx;
|
|
font-size: 28upx;
|
|
color: #1A1A1A;
|
|
>text{
|
|
color: $themeColor;
|
|
}
|
|
}
|
|
}
|
|
.os-code-img{
|
|
margin-bottom: 12upx;
|
|
width: 300upx;
|
|
height: 300upx;
|
|
}
|
|
}
|
|
.os-tip{
|
|
font-size: 24upx;
|
|
color: #9A9A9D;
|
|
}
|
|
</style>
|