|
|
|
@ -1,187 +1,194 @@ |
|
|
|
|
<template> |
|
|
|
|
<view class="m-content" :style="{ 'background-image': `url(${haedBg})` }"> |
|
|
|
|
|
|
|
|
|
<view class="headBox"> |
|
|
|
|
<!-- #ifdef MP --> |
|
|
|
|
<!-- 登录 --> |
|
|
|
|
<view class="u-flex u-p-l-30 u-p-r-20 u-p-t-30 u-p-b-30 user-head-box"> |
|
|
|
|
<view class="user-head" v-if="userInfo.accessToken"> |
|
|
|
|
<view class="u-m-r-20"> |
|
|
|
|
<view class="avatar u-flex" style="justify-content: center"> |
|
|
|
|
<image class="head-head" src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/touxiang.png"> |
|
|
|
|
</image> |
|
|
|
|
<view class="m-content" :style="{ 'background-image': `url(${haedBg})` }"> |
|
|
|
|
|
|
|
|
|
<view class="headBox"> |
|
|
|
|
<!-- #ifdef MP --> |
|
|
|
|
<!-- 登录 --> |
|
|
|
|
<view class="u-flex u-p-l-30 u-p-r-20 u-p-t-30 u-p-b-30 user-head-box"> |
|
|
|
|
<view class="user-head" v-if="userInfo.accessToken"> |
|
|
|
|
<view class="u-m-r-20"> |
|
|
|
|
<view class="avatar u-flex" style="justify-content: center"> |
|
|
|
|
<image class="head-head" |
|
|
|
|
src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/touxiang.png"> |
|
|
|
|
</image> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="u-flex-1"> |
|
|
|
|
<view class="nickName u-flex"> |
|
|
|
|
<view class="name u-m-r-10" v-if="userInfo.nickName">{{ userInfo.nickName }}</view> |
|
|
|
|
<view class="name u-m-r-10" v-else>游客</view> |
|
|
|
|
<view class="u-flex-1"> |
|
|
|
|
<view class="nickName u-flex"> |
|
|
|
|
<view class="name u-m-r-10" v-if="userInfo.nickName">{{ userInfo.nickName }}</view> |
|
|
|
|
<view class="name u-m-r-10" v-else>游客</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="detail" v-if="userInfo.phone">手机号:{{ userInfo.phone | phone }}</view> |
|
|
|
|
<view class="detail" v-else>手机号:未绑定</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="detail" v-if="userInfo.phone">手机号:{{ userInfo.phone | phone }}</view> |
|
|
|
|
<view class="detail" v-else>手机号:未绑定</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="user-head" v-else> |
|
|
|
|
<view class="u-m-r-20"> |
|
|
|
|
<view class="avatar u-flex" style="justify-content: center"> |
|
|
|
|
<image class="head-head" src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/touxiang.png"> |
|
|
|
|
</image> |
|
|
|
|
<view class="user-head" v-else> |
|
|
|
|
<view class="u-m-r-20"> |
|
|
|
|
<view class="avatar u-flex" style="justify-content: center"> |
|
|
|
|
<image class="head-head" |
|
|
|
|
src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/touxiang.png"> |
|
|
|
|
</image> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="u-flex-1" @click="openLogin"> |
|
|
|
|
<view class="u-font-lg" style=" font-weight: bold">请点击登录</view> |
|
|
|
|
<view class="detail">登录后享受更好的服务体验</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="u-flex-1" @click="openLogin"> |
|
|
|
|
<view class="u-font-lg" style=" font-weight: bold">请点击登录</view> |
|
|
|
|
<view class="detail">登录后享受更好的服务体验</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<!-- #endif --> |
|
|
|
|
</view> |
|
|
|
|
<view class="my-order">我的订单</view> |
|
|
|
|
<view class="order-btn-box"> |
|
|
|
|
<view class="left" @click="goPage('ticketOrder')"> |
|
|
|
|
<image src="/static/animg/personCenter/senceDd.png"></image> |
|
|
|
|
<view class="top">景区订单</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<!-- #endif --> |
|
|
|
|
</view> |
|
|
|
|
<view class="left rights" @click="goPage('homestayOrder')"> |
|
|
|
|
<image src="/static/animg/personCenter/hotelDd.png"></image> |
|
|
|
|
|
|
|
|
|
<view class="top">住宿订单</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
<view class="my-order">我的订单</view> |
|
|
|
|
<view class="order-btn-box"> |
|
|
|
|
<view class="left" @click="goPage('ticketOrder')"> |
|
|
|
|
<image src="/static/animg/personCenter/senceDd.png"></image> |
|
|
|
|
<view class="top">景区订单</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="left rights" @click="goPage('homestayOrder')"> |
|
|
|
|
<image src="/static/animg/personCenter/hotelDd.png"></image> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="share-box"> |
|
|
|
|
<image src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/share.png"></image> |
|
|
|
|
<button class="btns" open-type="share" plain></button> |
|
|
|
|
</view> |
|
|
|
|
<view class="m-my-menu-list"> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="goPage('yijian')"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/jianyi.png" mode="widthFix"></image> |
|
|
|
|
<view class="top">住宿订单</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">我的建议</view> |
|
|
|
|
<view class="left rights m-t-24" @click="goPage('shopOrder')"> |
|
|
|
|
<image src="/static/animg/personCenter/hotelDd.png"></image> |
|
|
|
|
<view class="top">商城订单</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="goPage('tousu')"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/tousu.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">我的投诉</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
<view class="share-box"> |
|
|
|
|
<image src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/share.png"></image> |
|
|
|
|
<button class="btns" open-type="share" plain></button> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="makeCall"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/kefu.png" mode="widthFix"></image> |
|
|
|
|
<view class="m-my-menu-list"> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="goPage('yijian')"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/jianyi.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">我的建议</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">客服电话</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="goPage('tousu')"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/tousu.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">我的投诉</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn"> |
|
|
|
|
<button class="btns" open-type="share" plain> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="makeCall"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/fenxiang.png" mode="widthFix"></image> |
|
|
|
|
<image src="/static/animg/personCenter/kefu.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">分享推荐</view> |
|
|
|
|
<view class="btn-text">客服电话</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</button> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="goPage('about')"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/about.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">关于“E鹿悦游”</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn"> |
|
|
|
|
<button class="btns" open-type="share" plain> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/fenxiang.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">分享推荐</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</button> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-item" hover-class="active-btn" @click="goPage('about')"> |
|
|
|
|
<view class="btn-img"> |
|
|
|
|
<image src="/static/animg/personCenter/about.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="btn-left"> |
|
|
|
|
<view class="btn-text">关于“E鹿悦游”</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
|
|
|
|
</view> |
|
|
|
|
<f-login></f-login> |
|
|
|
|
<m-tabBar :activeIndex="3"></m-tabBar> |
|
|
|
|
</view> |
|
|
|
|
<f-login></f-login> |
|
|
|
|
<m-tabBar :activeIndex="3"></m-tabBar> |
|
|
|
|
</view> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import { |
|
|
|
|
mapState, |
|
|
|
|
mapMutations |
|
|
|
|
} from 'vuex'; |
|
|
|
|
import mTabBar from "@/components/m-tabBar/mTabBar.vue"; |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
components: { |
|
|
|
|
mTabBar |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
haedBg: this.$config.ROOTPATH + "/upload/image/2024/mapIcon/daolan/mybg.png" |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
onShareAppMessage(res) { |
|
|
|
|
if (res.from === 'button') { // 来自页面内分享按钮 |
|
|
|
|
console.log(res.target) |
|
|
|
|
} |
|
|
|
|
return { |
|
|
|
|
title: 'E鹿悦游', |
|
|
|
|
path: '/pages/index/index' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
|
...mapState(['PrimaryColor', 'userInfo']), |
|
|
|
|
freeSpecsButtonBackground() { |
|
|
|
|
return this.$u.colorToRgba(this.$u.rgbToHex(this.PrimaryColor), 0.75); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
...mapMutations(['setLoginPopupShow']), |
|
|
|
|
openLogin() { |
|
|
|
|
this.judgeLogin(); |
|
|
|
|
|
|
|
|
|
import { |
|
|
|
|
mapState, |
|
|
|
|
mapMutations |
|
|
|
|
} from 'vuex'; |
|
|
|
|
import mTabBar from "@/components/m-tabBar/mTabBar.vue"; |
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
components: { |
|
|
|
|
mTabBar |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
haedBg: this.$config.ROOTPATH + "/upload/image/2024/mapIcon/daolan/mybg.png" |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
onShareAppMessage(res) { |
|
|
|
|
if (res.from === 'button') { // 来自页面内分享按钮 |
|
|
|
|
console.log(res.target) |
|
|
|
|
} |
|
|
|
|
return { |
|
|
|
|
title: 'E鹿悦游', |
|
|
|
|
path: '/pages/index/index' |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
makeCall() { |
|
|
|
|
uni.makePhoneCall({ |
|
|
|
|
phoneNumber: '0311-83886677' //仅为示例 |
|
|
|
|
}); |
|
|
|
|
computed: { |
|
|
|
|
...mapState(['PrimaryColor', 'userInfo']), |
|
|
|
|
freeSpecsButtonBackground() { |
|
|
|
|
return this.$u.colorToRgba(this.$u.rgbToHex(this.PrimaryColor), 0.75); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
goPage(val) { |
|
|
|
|
switch (val) { |
|
|
|
|
case 'ticketOrder': |
|
|
|
|
this.onTokenJump('/subPageC/order/order', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'homestayOrder': |
|
|
|
|
this.onTokenJump('/subPageC/orderHomestay/orderList', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'yijian': |
|
|
|
|
this.onTokenJump('/subPageB/suggest/sug_list?type=2', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'tousu': |
|
|
|
|
this.onTokenJump('/subPageB/suggest/sug_list?type=1', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'about': |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: '/subPageA/personcenter/aboutus' |
|
|
|
|
}); |
|
|
|
|
break; |
|
|
|
|
methods: { |
|
|
|
|
...mapMutations(['setLoginPopupShow']), |
|
|
|
|
openLogin() { |
|
|
|
|
this.judgeLogin(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
makeCall() { |
|
|
|
|
uni.makePhoneCall({ |
|
|
|
|
phoneNumber: '0311-83886677' //仅为示例 |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
goPage(val) { |
|
|
|
|
switch (val) { |
|
|
|
|
case 'ticketOrder': |
|
|
|
|
this.onTokenJump('/subPageC/order/order', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'homestayOrder': |
|
|
|
|
this.onTokenJump('/subPageC/orderHomestay/orderList', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'shopOrder': |
|
|
|
|
this.onTokenJump('/subPageC/orderShop/orderList', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'yijian': |
|
|
|
|
this.onTokenJump('/subPageB/suggest/sug_list?type=2', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'tousu': |
|
|
|
|
this.onTokenJump('/subPageB/suggest/sug_list?type=1', 'navigateTo') |
|
|
|
|
break; |
|
|
|
|
case 'about': |
|
|
|
|
uni.navigateTo({ |
|
|
|
|
url: '/subPageA/personcenter/aboutus' |
|
|
|
|
}); |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="scss" |
|
|
|
|
scoped> |
|
|
|
|
<style lang="scss" scoped> |
|
|
|
|
.myInfo { |
|
|
|
|
// 这里设置高度,上拉显示菜单栏---正式环境删除 |
|
|
|
|
min-height: 2000rpx; |
|
|
|
@ -358,6 +365,7 @@ export default { |
|
|
|
|
.order-btn-box { |
|
|
|
|
position: relative; |
|
|
|
|
display: flex; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
align-items: center; |
|
|
|
|
margin: 20rpx; |
|
|
|
@ -497,18 +505,18 @@ export default { |
|
|
|
|
margin-bottom: 28rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.share-box{ |
|
|
|
|
padding: 0 20rpx; |
|
|
|
|
.share-box { |
|
|
|
|
padding: 0 20rpx; |
|
|
|
|
margin-bottom: 20rpx; |
|
|
|
|
height: 120rpx; |
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
|
|
image{ |
|
|
|
|
|
|
|
|
|
image { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.btns{ |
|
|
|
|
.btns { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
position: absolute; |
|
|
|
@ -519,4 +527,4 @@ export default { |
|
|
|
|
border: none; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
</style> |