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.
576 lines
12 KiB
576 lines
12 KiB
<template>
|
|
<view class="cotainer">
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<privacy-popup ref="privacyComponent" @agree-privacy="onAgreePrivacy"
|
|
@reject-privacy="onRejectPrivacy"></privacy-popup>
|
|
<!-- #endif -->
|
|
|
|
<view>
|
|
<view class="myswiper">
|
|
<u-swiper mode="none" border-radius="0" :list="list" height="440"></u-swiper>
|
|
</view>
|
|
<view class="tags">
|
|
<view v-for="item in tags">
|
|
<image src="../../static/index_tag.png" alt="" />
|
|
<text>{{item}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="menu">
|
|
<view class="menu-left">
|
|
<view @click="toUrl(1)">
|
|
<image src="../../static/index_icon4.png"></image>
|
|
<view>
|
|
<view>进入兑换</view>
|
|
<view>JIN RU DUI HUAN</view>
|
|
</view>
|
|
<view class="menu-btn">
|
|
<view>GO</view>
|
|
<u-icon name="arrow-right" size="18"></u-icon>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="menu-right">
|
|
<view class="menu-right-top" @click="toUrl(2)">
|
|
<view>
|
|
<image src="../../static/index_icon5.png"></image>
|
|
</view>
|
|
<view>
|
|
<view>
|
|
<view>商城入口</view>
|
|
<view>SHANG CHENG RU KOU</view>
|
|
</view>
|
|
<view class="menu-btn">
|
|
<view>GO</view>
|
|
<u-icon name="arrow-right" size="18"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="menu-right-bottom">
|
|
<view @click="toUrl(3)">
|
|
<view>
|
|
<image src="../../static/index_icon6.png" mode=""></image>
|
|
</view>
|
|
<view>更改预约</view>
|
|
</view>
|
|
<view @click="toUrl(4)">
|
|
<view>
|
|
<image src="../../static/index_icon7.png" mode=""></image>
|
|
</view>
|
|
<view>物流查询</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="contact" @click="toUrl(5)">
|
|
<image src="../../static/index_icon8.png"></image>
|
|
<view>
|
|
<view>蟹太太官方旗舰店</view>
|
|
<view>
|
|
<view>提货答疑 物流追踪</view>
|
|
<image src="../../static/index_icon9.png" mode=""></image>
|
|
</view>
|
|
<view class="contact-btn">
|
|
<view>
|
|
专属管家
|
|
<u-icon name="arrow-right" size="23"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ad">
|
|
<image src="../../static/index_title.png"></image>
|
|
<view class="ad-wrap">
|
|
<view @click="toAd(0)">
|
|
<image class="img1" :src="banner2[0]['upfile_url']"></image>
|
|
</view>
|
|
<view>
|
|
<image @click="toAd(1)" class="img2" :src="banner2[1]['upfile_url']"></image>
|
|
<image @click="toAd(2)" class="img3" :src="banner2[2]['upfile_url']"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<tabbar :currentPage="0"></tabbar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import PrivacyPopup from '@/components/privacy-popup/privacy-popup.vue';
|
|
import tabbar from '@/components/tabbar/tabbar.vue';
|
|
import {
|
|
ROOTPATH as baseUrl
|
|
} from "@/common/config.js"
|
|
import {
|
|
isNull,
|
|
toast
|
|
} from '@/common/util.js'
|
|
export default {
|
|
components: {
|
|
PrivacyPopup,
|
|
tabbar
|
|
},
|
|
data() {
|
|
return {
|
|
list: [],
|
|
tags: ['品牌自营', '品质保障', '顺丰包邮', '售后无忧'],
|
|
banner2:[]
|
|
|
|
}
|
|
},
|
|
onShareAppMessage() {
|
|
// return shareInfo
|
|
},
|
|
onShareTimeline() {
|
|
// return shareInfo
|
|
},
|
|
onLoad(option) {
|
|
this.getBanner()
|
|
let token = uni.getStorageSync('xtt_lifeData3')?uni.getStorageSync('xtt_lifeData3').vuex_token:''
|
|
if (isNull(token)) {
|
|
this.getToken()
|
|
}
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
onHide() {
|
|
|
|
},
|
|
methods: {
|
|
onAgreePrivacy() {
|
|
// 用户同意隐私政策
|
|
// 在这里添加您想要执行的代码
|
|
console.log('User agreed to the privacy policy');
|
|
// this.getToken()
|
|
},
|
|
onRejectPrivacy() {
|
|
// 用户拒绝隐私政策
|
|
// 在这里添加您想要执行的代码
|
|
// wx.exitMiniProgram();
|
|
console.log('User rejected the privacy policy');
|
|
},
|
|
async getBanner(){
|
|
const res = await this.$u.api.getConfig()
|
|
// 顶部图banner1
|
|
let arr = []
|
|
if(res.banner1.length>0){
|
|
res.banner1.map(item=>{
|
|
arr.push({
|
|
image:item.upfile_url
|
|
})
|
|
})
|
|
this.list = arr
|
|
}
|
|
// 底部三张 banner2
|
|
if(res.banner2.length>0){
|
|
this.banner2 = res.banner2
|
|
}
|
|
// 轮播图 banner3
|
|
let _arr = []
|
|
if(res.banner3.length>0){
|
|
res.banner3.map(item=>{
|
|
_arr.push({
|
|
image:item.upfile_url
|
|
})
|
|
})
|
|
uni.setStorageSync('banner3',_arr)
|
|
}
|
|
// 客服二维码
|
|
let _arr1 = []
|
|
if(res.banner4.length>0){
|
|
res.banner4.map(item=>{
|
|
_arr1.push({
|
|
image:item.upfile_url,
|
|
type:item.url
|
|
})
|
|
})
|
|
uni.setStorageSync('banner4',_arr1)
|
|
}
|
|
// 文字信息
|
|
uni.setStorageSync('configs',res.config)
|
|
},
|
|
async getToken() {
|
|
await uni.login({
|
|
provider: 'weixin',
|
|
success: (res) => {
|
|
|
|
this.$u.api.login({
|
|
code: res.code
|
|
}).then(res1 => {
|
|
uni.removeStorageSync("xtt_lifeData3")
|
|
uni.setStorageSync("xtt_lifeData3", {
|
|
'vuex_token': res1.token
|
|
})
|
|
// uni.request({
|
|
// url: baseUrl + '/api/mobile/user/show',
|
|
// header: {
|
|
// Authorization: `Bearer ${res1.token}`
|
|
// },
|
|
// method: "GET",
|
|
// success(res2) {
|
|
// uni.setStorageSync("xtt_lifeData3", {
|
|
// 'vuex_token': res1.token,
|
|
// "vuex_user": res2.user
|
|
// })
|
|
// },
|
|
// fail(err) {
|
|
// console.log("err", err)
|
|
|
|
// }
|
|
// })
|
|
}).catch(err => {
|
|
toast(JSON.stringify(err))
|
|
console.log('login-error:', JSON.stringify(err))
|
|
})
|
|
},
|
|
fail: (res) => {
|
|
console.log("errtoken", JSON.stringify(res))
|
|
toast(JSON.stringify(err))
|
|
}
|
|
});
|
|
},
|
|
toUrl(index) {
|
|
var url = ''
|
|
|
|
if (index == 1) {
|
|
url = '/packages/change/change'
|
|
}else if(index == 2){
|
|
uni.navigateToMiniProgram({
|
|
appId: 'wx28874f0da33453ab', // 小程序appid
|
|
path: '', // 打开的页面路径，若为空则打开首页
|
|
extraData: {
|
|
// 需要传递给小程序的数据
|
|
},
|
|
success(res) {
|
|
// 打开成功的回调
|
|
},
|
|
fail(err) {
|
|
// 打开失败的回调
|
|
}
|
|
})
|
|
return
|
|
} else if (index == 3) {
|
|
url = '/packages/myorder/myorder'
|
|
} else if (index == 4) {
|
|
url = '/packages/myorder/myorder'
|
|
} else if (index == 5) {
|
|
uni.navigateTo({
|
|
url:'/packages/product/talkwx'
|
|
})
|
|
} else if (index == 6) {
|
|
url = '/packages/product/fresh'
|
|
}
|
|
console.log("index",index,url)
|
|
if (!isNull(url)) {
|
|
uni.navigateTo({
|
|
url: url
|
|
})
|
|
}
|
|
|
|
},
|
|
toAd(index){
|
|
let item = this.banner2[index]
|
|
if(item.upfile_url){
|
|
uni.navigateToMiniProgram({
|
|
appId: item.appid?item.appid:'wx28874f0da33453ab', // 小程序appid
|
|
path: item.url?item.url:'', // 打开的页面路径，若为空则打开首页
|
|
extraData: {
|
|
// 需要传递给小程序的数据
|
|
},
|
|
success(res) {
|
|
// 打开成功的回调
|
|
},
|
|
fail(err) {
|
|
// 打开失败的回调
|
|
}
|
|
})
|
|
}
|
|
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.cotainer {
|
|
background-color: #f0efed;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
overflow: scroll;
|
|
padding-bottom:160rpx;
|
|
.myswiper {
|
|
// padding: 40rpx;
|
|
}
|
|
|
|
.tags {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
padding: 20rpx 0;
|
|
|
|
>view {
|
|
width: 25%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
image {
|
|
width: 30rpx;
|
|
height: 30rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
text {
|
|
color: #323232;
|
|
font-size: 25rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.menu {
|
|
// padding: 30rpx;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
background-color: #fff;
|
|
width: 100%;
|
|
height: 380rpx;
|
|
box-shadow: inset 0px 15px 15px -15px #dddddd, inset 0px -15px 15px -15px #dddddd;
|
|
|
|
padding: 20rpx 35rpx;
|
|
padding-left: 0;
|
|
|
|
>view {
|
|
height: 330rpx;
|
|
}
|
|
|
|
&-left {
|
|
width: 45%;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
border-right: 1px solid #7a7a7a;
|
|
padding: 0 35rpx;
|
|
|
|
image {
|
|
width: 81rpx;
|
|
height: 80rpx;
|
|
}
|
|
|
|
>view {
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
>view {
|
|
margin-top: 20rpx;
|
|
font-size: 28rpx;
|
|
color: #323232;
|
|
|
|
:last-child {
|
|
font-size: 17rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
&-right {
|
|
width: calc(55% - 35rpx);
|
|
margin-left: 35rpx;
|
|
|
|
>view {
|
|
height: 50%;
|
|
}
|
|
|
|
&-top {
|
|
display: flex;
|
|
align-items: center;
|
|
border-bottom: 1px solid #7a7a7a;
|
|
|
|
>view {
|
|
width: 55%;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
|
|
image {
|
|
width: 82rpx;
|
|
height: 81rpx;
|
|
}
|
|
|
|
>view {
|
|
:last-child {
|
|
font-size: 17rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
>view {
|
|
&:first-child {
|
|
width: 45%;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
&-bottom {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 28rpx;
|
|
color: #323232;
|
|
margin-top: 20rpx;
|
|
height: calc(50% - 20rpx) !important;
|
|
|
|
>view {
|
|
width: 50%;
|
|
height: 100%;
|
|
text-align: center;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
|
|
>view {
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
|
|
&:first-child {
|
|
height: 71rpx;
|
|
line-height: 71rpx;
|
|
margin-bottom: -20rpx;
|
|
}
|
|
}
|
|
|
|
&:first-child {
|
|
border-right: 1px solid #7a7a7a;
|
|
|
|
image {
|
|
width: 77rpx;
|
|
height: 71rpx;
|
|
}
|
|
}
|
|
|
|
&:last-child {
|
|
image {
|
|
width: 78rpx;
|
|
height: 59rpx;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&-btn {
|
|
background-color: #000;
|
|
color: #fff !important;
|
|
border-radius: 20rpx;
|
|
display: inline-block;
|
|
padding: 0 10rpx;
|
|
// line-height: 40rpx;
|
|
// height: 40rpx;
|
|
text-align: center;
|
|
margin-top: 20rpx;
|
|
font-size: 0 !important;
|
|
|
|
view {
|
|
font-size: 20rpx;
|
|
display: inline-block;
|
|
}
|
|
}
|
|
}
|
|
|
|
.contact {
|
|
width: 100%;
|
|
position: relative;
|
|
font-size: 30rpx;
|
|
color: #f6d9b6;
|
|
height: 242rpx;
|
|
|
|
>image {
|
|
width: 708rpx;
|
|
height: 223rpx;
|
|
// margin:20rpx auto;
|
|
position: absolute;
|
|
top: 21rpx;
|
|
left: 21rpx;
|
|
}
|
|
|
|
>view {
|
|
position: absolute;
|
|
z-index: 9;
|
|
top: 50rpx;
|
|
left: 60rpx;
|
|
|
|
>view {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 15rpx;
|
|
|
|
&:first-child {
|
|
color: #fff;
|
|
font-size: 20rpx;
|
|
}
|
|
}
|
|
|
|
image {
|
|
width: 35rpx;
|
|
height: 26rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
}
|
|
|
|
&-btn {
|
|
font-size: 24rpx;
|
|
border: 1px solid #f6d9b6;
|
|
border-radius: 50rpx;
|
|
width: 50%;
|
|
text-align: center;
|
|
/* justify-content: space-around; */
|
|
padding: 10rpx;
|
|
justify-content: center;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
}
|
|
|
|
.ad {
|
|
padding: 0 35rpx;
|
|
|
|
>image {
|
|
width: 212rpx;
|
|
height: 81rpx;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
&-wrap {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
view {
|
|
&:last-child {
|
|
width: 261rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.img1 {
|
|
width: 407rpx;
|
|
height: 271rpx;
|
|
}
|
|
|
|
.img2 {
|
|
width: 261rpx;
|
|
height: 132rpx;
|
|
}
|
|
|
|
.img3 {
|
|
width: 261rpx;
|
|
height: 132rpx;
|
|
}
|
|
}
|
|
}
|
|
</style> |