150 lines
3.2 KiB
Vue
150 lines
3.2 KiB
Vue
<template>
|
|
<!-- 瑞幸咖啡首页 -->
|
|
<view class="content">
|
|
<!-- 顶部图 -->
|
|
<view class="banner">
|
|
<image class="img" :src="qnyurl('xbk_indexback.jpg','xbk')" mode="widthFix"></image>
|
|
</view>
|
|
<view class="stote-operate">
|
|
<navigator url="/pages/restaurant/home/home" hover-class="none" style="width: 100%;height: auto;">
|
|
<view class="stote-operate-order">
|
|
<image class="img" :src="qnyurl('place.png','xbk')"></image>
|
|
</view>
|
|
</navigator>
|
|
<view class="stote-operate-orders" @tap="oreder">
|
|
<image class="img" :src="qnyurl('orders.png','xbk')"></image>
|
|
</view>
|
|
<view class="stote-operate-service" @tap="location">
|
|
<image class="img" :src="qnyurl('service.png','xbk')"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {mapMutations} from 'vuex'
|
|
// 客服链接
|
|
import { RXSERVICE} from '@/static/js/serviceurl.js';
|
|
// 共用混入
|
|
import mixin from '@/static/js/mixin/mixin.js';
|
|
// 点餐混入
|
|
import restaurantmixins from '@/static/js/mixin/restaurantmixins.js';
|
|
import {
|
|
KFCrestaurant
|
|
} from '@/static/js/share.js';
|
|
export default {
|
|
mixins: [mixin,restaurantmixins],
|
|
data() {
|
|
return {
|
|
showw:false
|
|
}
|
|
},
|
|
onShow() {
|
|
// 只要显示该页面就将导航索引重置
|
|
this.SETNAVINDEX(0);
|
|
},
|
|
onLoad() {
|
|
this.SETBRANDINFOR({
|
|
brand_id:10,
|
|
brand_name:'星巴克'
|
|
});
|
|
// 设置微信分享标识
|
|
this.$wx.miniProgram.postMessage({
|
|
data:{
|
|
title: '和你一起来享受星巴克时光 ，美好生活快来点这里有折扣哦',
|
|
imageUrl:'https://img.agrimedia.cn/chwl/xbk/xbk_sharing.jpg',
|
|
ISH5:true,
|
|
CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_xbk',
|
|
}
|
|
});
|
|
},
|
|
methods: {
|
|
oreder() {
|
|
let self = this;
|
|
// 点击订单时将导航索引设置为1表明显示订单页面
|
|
uni.navigateTo({
|
|
url: '/pages/restaurant/home/home',
|
|
success() {
|
|
self.SETNAVINDEX(1);
|
|
}
|
|
})
|
|
},
|
|
/**
|
|
* @跳转客服
|
|
* */
|
|
service() {
|
|
window.location.href = RXSERVICE;
|
|
},
|
|
},
|
|
|
|
onShareAppMessage() {
|
|
return XBKSharing();
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page{
|
|
width: 100%;
|
|
min-height: 100%;
|
|
background-color: #F7F7F7;
|
|
}
|
|
.banner {
|
|
width: 100%;
|
|
|
|
// height: 490rpx;
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.stote-operate {
|
|
width: 100%;
|
|
height: auto;
|
|
padding: 32rpx;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
position: fixed;
|
|
top: 41%;
|
|
.stote-operate-order {
|
|
width: 100%;
|
|
height: 241rpx;
|
|
position: relative;
|
|
|
|
.diancan {
|
|
position: absolute;
|
|
top: 68px;
|
|
left: 78rpx;
|
|
width: 181rpx;
|
|
height: 64rpx;
|
|
background: #FFFFFF;
|
|
box-shadow: 0 10rpx 16rpx 0 rgba(44, 94, 255, 0.2400);
|
|
border-radius: 32rpx;
|
|
color: #4B6FE7;
|
|
text-align: center;
|
|
line-height: 60rpx;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.stote-operate-orders,
|
|
.stote-operate-service {
|
|
width: 332rpx;
|
|
height: 217rpx;
|
|
margin-top: 30rpx;
|
|
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|