parent
bad73ea7ab
commit
8651fa34a8
@ -1,460 +1,471 @@ |
||||
<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="/static/animg/personCenter/touxiang.png"></image> |
||||
</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> |
||||
<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"> |
||||
<u-icon name="account-fill" size="30"></u-icon> |
||||
</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><u-icon name="arrow-right" size="13"></u-icon></view> |
||||
</view> |
||||
<!-- #endif --> |
||||
</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('hotelOrder')"> |
||||
<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> |
||||
<view class="m-my-menu-list"> |
||||
<view class="btn-item" :hover-class="active - btn" @click="goPage('yijian')"> |
||||
<view class="btn-left"> |
||||
<view class="btn-img"> |
||||
<image src="/static/animg/personCenter/jianyi.png"></image> |
||||
</view> |
||||
<view class="btn-text">我的建议</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-left"> |
||||
<view class="btn-img"> |
||||
<image src="/static/animg/personCenter/tousu.png"></image> |
||||
</view> |
||||
<view class="btn-text">我的投诉</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="makeCall"> |
||||
<view class="btn-left"> |
||||
<view class="btn-img"> |
||||
<image src="/static/animg/personCenter/kefu.png"></image> |
||||
</view> |
||||
<view class="btn-text">客服电话</view> |
||||
</view> |
||||
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
||||
</view> |
||||
<view class="btn-item"> |
||||
<button class="btns" open-type="share" plain> |
||||
<view class="btn-left"> |
||||
<view class="btn-img"> |
||||
<image src="/static/animg/personCenter/fenxiang.png"></image> |
||||
</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-left"> |
||||
<view class="btn-img"> |
||||
<image src="/static/animg/personCenter/about.png"></image> |
||||
</view> |
||||
<view class="btn-text">关于“E鹿悦游”</view> |
||||
</view> |
||||
<view class="right"><u-icon name="arrow-right" size="13"></u-icon></view> |
||||
</view> |
||||
</view> |
||||
<f-login></f-login> |
||||
</view> |
||||
<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="/static/animg/personCenter/touxiang.png"></image> |
||||
</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> |
||||
<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"> |
||||
<u-icon name="account-fill" size="30"></u-icon> |
||||
</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="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('hotelOrder')"> |
||||
<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> |
||||
<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-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="btn-item" :hover-class="active - btn" @click="makeCall"> |
||||
<view class="btn-img"> |
||||
<image src="/static/animg/personCenter/kefu.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-item"> |
||||
<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> |
||||
<f-login></f-login> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import { mapState, mapMutations } from 'vuex'; |
||||
export default { |
||||
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(); |
||||
|
||||
|
||||
}, |
||||
makeCall() { |
||||
uni.makePhoneCall({ |
||||
phoneNumber: '0311-83886677' //仅为示例 |
||||
}); |
||||
}, |
||||
goPage(val) { |
||||
switch (val) { |
||||
case 'ticketOrder': |
||||
this.onTokenJump('/subPageC/order/order', '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; |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
import { |
||||
mapState, |
||||
mapMutations |
||||
} from 'vuex'; |
||||
export default { |
||||
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(); |
||||
|
||||
|
||||
}, |
||||
makeCall() { |
||||
uni.makePhoneCall({ |
||||
phoneNumber: '0311-83886677' //仅为示例 |
||||
}); |
||||
}, |
||||
goPage(val) { |
||||
switch (val) { |
||||
case 'ticketOrder': |
||||
this.onTokenJump('/subPageC/order/order', '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> |
||||
.myInfo { |
||||
// 这里设置高度,上拉显示菜单栏---正式环境删除 |
||||
min-height: 2000rpx; |
||||
} |
||||
|
||||
.headBox { |
||||
padding-top: 128rpx; |
||||
border-radius: 50% / 0 0 5% 5%; |
||||
overflow: hidden; |
||||
|
||||
.avatar { |
||||
width: 150rpx; |
||||
height: 150rpx; |
||||
border-radius: 50%; |
||||
margin-right: 25rpx; |
||||
|
||||
.head-head { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
|
||||
.nickName { |
||||
color: #1B1B1B; |
||||
|
||||
.btn { |
||||
font-size: 22rpx; |
||||
font-weight: normal; |
||||
color: #666; |
||||
background: #fff; |
||||
border-radius: 5rpx; |
||||
height: 45rpx; |
||||
line-height: 45rpx; |
||||
padding: 0 10rpx; |
||||
position: relative; |
||||
|
||||
.itemButton { |
||||
border-radius: 0; |
||||
text-align: left; |
||||
opacity: 0; |
||||
width: 100%; |
||||
height: 100%; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
} |
||||
} |
||||
|
||||
.name { |
||||
color: #1B1B1B; |
||||
font-weight: bold; |
||||
font-size: 32rpx; |
||||
} |
||||
|
||||
.placardVip { |
||||
background: #2a2e44; |
||||
color: #f4d6a1; |
||||
font-size: 22rpx; |
||||
padding: 4rpx 10rpx; |
||||
text-align: center; |
||||
border-radius: 4rpx; |
||||
} |
||||
} |
||||
|
||||
.detail { |
||||
color: #1B1B1B; |
||||
font-size: 24rpx; |
||||
padding-top: 6rpx; |
||||
} |
||||
|
||||
.vipBox { |
||||
padding: 0 24rpx; |
||||
|
||||
.card { |
||||
background-image: linear-gradient(to right, #314177, #202646); |
||||
padding: 16rpx 32rpx 24rpx 32rpx; |
||||
border-top-left-radius: 30rpx; |
||||
border-top-right-radius: 30rpx; |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
|
||||
.left { |
||||
display: flex; |
||||
flex-direction: row; |
||||
align-items: center; |
||||
|
||||
.title { |
||||
font-size: 40rpx; |
||||
font-weight: bold; |
||||
font-style: italic; |
||||
color: #f9bd90; |
||||
} |
||||
|
||||
.tips { |
||||
font-size: 24rpx; |
||||
color: #f9bd90; |
||||
margin-left: 20rpx; |
||||
} |
||||
} |
||||
|
||||
.right { |
||||
.button { |
||||
padding: 8rpx 16rpx; |
||||
color: 212849; |
||||
border-radius: 30rpx; |
||||
background: #f9bd90; |
||||
font-size: 24rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.main { |
||||
padding: 0 24rpx; |
||||
} |
||||
|
||||
.itemBox { |
||||
background: #fff; |
||||
padding: 0 24rpx; |
||||
border-radius: 20rpx; |
||||
overflow: hidden; |
||||
margin-top: 24rpx; |
||||
|
||||
.titleBox { |
||||
padding: 32rpx 0; |
||||
border-bottom: 1rpx solid #eee; |
||||
|
||||
.title { |
||||
font-size: 28rpx; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.word { |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
} |
||||
} |
||||
|
||||
.grid-text { |
||||
font-size: 24rpx; |
||||
color: #333; |
||||
padding-top: 10rpx; |
||||
} |
||||
} |
||||
|
||||
.m-content { |
||||
height: 100vh; |
||||
background-size: contain; |
||||
background-repeat: no-repeat; |
||||
|
||||
// padding-top: 200rpx; |
||||
|
||||
.headBox { |
||||
padding-left: 40rpx; |
||||
padding-right: 40rpx; |
||||
|
||||
.user-head-box { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
|
||||
.user-head { |
||||
display: flex; |
||||
justify-content: start; |
||||
align-items: center; |
||||
color: #1B1B1B; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.order-btn-box { |
||||
position: relative; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
margin: 20rpx; |
||||
|
||||
.left { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
align-items: center; |
||||
width: 48%; |
||||
height: 128rpx; |
||||
position: relative; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
} |
||||
|
||||
.top { |
||||
font-family: Source Han Sans SC; |
||||
font-weight: 500; |
||||
font-size: 32rpx; |
||||
color: #113961; |
||||
z-index: 9; |
||||
} |
||||
|
||||
.right { |
||||
margin-right: 40rpx; |
||||
margin-left: 20rpx; |
||||
} |
||||
} |
||||
|
||||
.rights { |
||||
.top { |
||||
color: #612C11; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
.m-my-menu-list { |
||||
background: #FFFFFF; |
||||
box-shadow: 0rpx 3rpx 10rpx 0rpx rgba(9, 131, 255, 0.1); |
||||
border-radius: 20rpx; |
||||
height: fit-content; |
||||
padding: 40rpx; |
||||
margin: 0 20rpx; |
||||
|
||||
.btn-item { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 10rpx 0; |
||||
|
||||
.btns { |
||||
background-color: unset; |
||||
border: none; |
||||
display: flex; |
||||
align-items: center; |
||||
width: 100%; |
||||
justify-content: space-between; |
||||
padding: 0; |
||||
border-color: transparent; |
||||
border-radius: unset; |
||||
box-sizing: content-box; |
||||
line-height: unset; |
||||
|
||||
.btn-left { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 10rpx 20rpx 10rpx 0; |
||||
|
||||
.btn-img { |
||||
width: 35rpx; |
||||
height: 35rpx; |
||||
margin-right: 20rpx; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.btn-left { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 10rpx 20rpx 10rpx 0; |
||||
|
||||
.btn-img { |
||||
width: 35rpx; |
||||
height: 35rpx; |
||||
margin-right: 20rpx; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
|
||||
.btn-text { |
||||
font-family: Source Han Sans SC; |
||||
font-weight: 400; |
||||
font-size: 28rpx; |
||||
color: #1B1B1B; |
||||
line-height: 40rpx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.active-btn { |
||||
background-color: #eee; |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
.myInfo { |
||||
// 这里设置高度,上拉显示菜单栏---正式环境删除 |
||||
min-height: 2000rpx; |
||||
} |
||||
|
||||
.headBox { |
||||
padding-top: 128rpx; |
||||
border-radius: 50% / 0 0 5% 5%; |
||||
overflow: hidden; |
||||
|
||||
.avatar { |
||||
width: 150rpx; |
||||
height: 150rpx; |
||||
border-radius: 50%; |
||||
margin-right: 25rpx; |
||||
|
||||
.head-head { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
|
||||
.nickName { |
||||
color: #1B1B1B; |
||||
|
||||
.btn { |
||||
font-size: 22rpx; |
||||
font-weight: normal; |
||||
color: #666; |
||||
background: #fff; |
||||
border-radius: 5rpx; |
||||
height: 45rpx; |
||||
line-height: 45rpx; |
||||
padding: 0 10rpx; |
||||
position: relative; |
||||
|
||||
.itemButton { |
||||
border-radius: 0; |
||||
text-align: left; |
||||
opacity: 0; |
||||
width: 100%; |
||||
height: 100%; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
} |
||||
} |
||||
|
||||
.name { |
||||
color: #1B1B1B; |
||||
font-weight: bold; |
||||
font-size: 32rpx; |
||||
} |
||||
|
||||
.placardVip { |
||||
background: #2a2e44; |
||||
color: #f4d6a1; |
||||
font-size: 22rpx; |
||||
padding: 4rpx 10rpx; |
||||
text-align: center; |
||||
border-radius: 4rpx; |
||||
} |
||||
} |
||||
|
||||
.detail { |
||||
color: #1B1B1B; |
||||
font-size: 24rpx; |
||||
padding-top: 6rpx; |
||||
} |
||||
|
||||
.vipBox { |
||||
padding: 0 24rpx; |
||||
|
||||
.card { |
||||
background-image: linear-gradient(to right, #314177, #202646); |
||||
padding: 16rpx 32rpx 24rpx 32rpx; |
||||
border-top-left-radius: 30rpx; |
||||
border-top-right-radius: 30rpx; |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
|
||||
.left { |
||||
display: flex; |
||||
flex-direction: row; |
||||
align-items: center; |
||||
|
||||
.title { |
||||
font-size: 40rpx; |
||||
font-weight: bold; |
||||
font-style: italic; |
||||
color: #f9bd90; |
||||
} |
||||
|
||||
.tips { |
||||
font-size: 24rpx; |
||||
color: #f9bd90; |
||||
margin-left: 20rpx; |
||||
} |
||||
} |
||||
|
||||
.right { |
||||
.button { |
||||
padding: 8rpx 16rpx; |
||||
color: 212849; |
||||
border-radius: 30rpx; |
||||
background: #f9bd90; |
||||
font-size: 24rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
.main { |
||||
padding: 0 24rpx; |
||||
} |
||||
|
||||
.itemBox { |
||||
background: #fff; |
||||
padding: 0 24rpx; |
||||
border-radius: 20rpx; |
||||
overflow: hidden; |
||||
margin-top: 24rpx; |
||||
|
||||
.titleBox { |
||||
padding: 32rpx 0; |
||||
border-bottom: 1rpx solid #eee; |
||||
|
||||
.title { |
||||
font-size: 28rpx; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.word { |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
} |
||||
} |
||||
|
||||
.grid-text { |
||||
font-size: 24rpx; |
||||
color: #333; |
||||
padding-top: 10rpx; |
||||
} |
||||
} |
||||
|
||||
.m-content { |
||||
height: 100vh; |
||||
background-size: contain; |
||||
background-repeat: no-repeat; |
||||
|
||||
// padding-top: 200rpx; |
||||
|
||||
.headBox { |
||||
padding-left: 40rpx; |
||||
padding-right: 40rpx; |
||||
|
||||
.user-head-box { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
|
||||
.user-head { |
||||
display: flex; |
||||
justify-content: start; |
||||
align-items: center; |
||||
color: #1B1B1B; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.order-btn-box { |
||||
position: relative; |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
margin: 20rpx; |
||||
|
||||
.left { |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
align-items: center; |
||||
width: 48%; |
||||
height: 128rpx; |
||||
position: relative; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
position: absolute; |
||||
left: 0; |
||||
top: 0; |
||||
} |
||||
|
||||
.top { |
||||
font-family: Source Han Sans SC; |
||||
font-weight: 500; |
||||
font-size: 32rpx; |
||||
color: #113961; |
||||
z-index: 9; |
||||
} |
||||
|
||||
.right { |
||||
margin-right: 40rpx; |
||||
margin-left: 20rpx; |
||||
} |
||||
} |
||||
|
||||
.rights { |
||||
.top { |
||||
color: #612C11; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
.m-my-menu-list { |
||||
background: #FFFFFF; |
||||
box-shadow: 0rpx 3rpx 10rpx 0rpx rgba(9, 131, 255, 0.1); |
||||
border-radius: 20rpx; |
||||
height: fit-content; |
||||
padding: 40rpx; |
||||
margin: 0 20rpx; |
||||
|
||||
.btn-item { |
||||
display: flex; |
||||
align-items: center; |
||||
|
||||
padding: 10rpx 0; |
||||
|
||||
.btns { |
||||
background-color: unset; |
||||
border: none; |
||||
display: flex; |
||||
align-items: center; |
||||
width: 100%; |
||||
|
||||
padding: 0; |
||||
border-color: transparent; |
||||
border-radius: unset; |
||||
box-sizing: content-box; |
||||
line-height: unset; |
||||
|
||||
.btn-img { |
||||
width: 35rpx; |
||||
height: 35rpx; |
||||
margin-right: 20rpx; |
||||
position: relative; |
||||
top: -5rpx; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
|
||||
.btn-left { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 10rpx 20rpx 10rpx 0; |
||||
|
||||
|
||||
} |
||||
} |
||||
|
||||
.btn-img { |
||||
width: 35rpx; |
||||
height: 35rpx; |
||||
margin-right: 20rpx; |
||||
position: relative; |
||||
top: -5rpx; |
||||
|
||||
image { |
||||
width: 35rpx; |
||||
} |
||||
} |
||||
|
||||
.btn-left { |
||||
display: flex; |
||||
flex:1; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 10rpx 20rpx 10rpx 0; |
||||
|
||||
|
||||
|
||||
.btn-text { |
||||
font-family: Source Han Sans SC; |
||||
font-weight: 400; |
||||
font-size: 30rpx; |
||||
color: #1B1B1B; |
||||
line-height: 40rpx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.active-btn { |
||||
background-color: #eee; |
||||
} |
||||
} |
||||
} |
||||
</style> |
Loading…
Reference in new issue