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.
566 lines
16 KiB
566 lines
16 KiB
<template>
|
|
<view>
|
|
<view class="user">
|
|
<!-- 头像 -->
|
|
<view class="left">
|
|
<image src="/static/img/head.png" v-if="!user.headerImg"></image>
|
|
<image :src="user.headerImg" v-else></image>
|
|
</view>
|
|
<!-- 昵称,个性签名 -->
|
|
<view class="right">
|
|
<view class="username" v-if="!user.name">请授权登录</view>
|
|
<view class="username" v-else>{{user.name}}</view>
|
|
<view class="font14 fcorfff" v-if="!user.gold">金币: 0</view>
|
|
<view class="font14 fcorfff" v-else>金币: {{user.gold}} 个</view>
|
|
<!-- <view class="signature" @tap="toSetting">{{user.signature}}</view> -->
|
|
</view>
|
|
<!-- 二维码按钮 -->
|
|
<button class="erweima" v-if="user.phone == null" open-type="getPhoneNumber"
|
|
@getphonenumber="getPhoneNumber">
|
|
<image
|
|
src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNjE2ODUyMjc2NDc1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjI0MDMiIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNTEyIDUwOS4xbS00NDQuNCAwYTQ0NC40IDQ0NC40IDAgMSAwIDg4OC44IDAgNDQ0LjQgNDQ0LjQgMCAxIDAtODg4LjggMFoiIGZpbGw9IiNGQUIwMDEiIHAtaWQ9IjI0MDQiPjwvcGF0aD48cGF0aCBkPSJNODg3LjcgNDU5LjFjMC0xMzIuNS01OC0yNTEuMy0xNTAtMzMyLjdDNjcxLjYgODcuMiA1OTQuNCA2NC43IDUxMiA2NC43Yy0yNDUuNCAwLTQ0NC40IDE5OS00NDQuNCA0NDQuNCAwIDEzMi41IDU4IDI1MS4zIDE1MCAzMzIuNyA2Ni4yIDM5LjEgMTQzLjMgNjEuNyAyMjUuOCA2MS43IDI0NS40IDAgNDQ0LjMtMTk5IDQ0NC4zLTQ0NC40eiIgZmlsbD0iI0Y5RTQ4QSIgcC1pZD0iMjQwNSI+PC9wYXRoPjxwYXRoIGQ9Ik01NjggMTAyLjVjLTI0NS40IDAtNDQ0LjQgMTk5LTQ0NC40IDQ0NC40IDAgMTIyLjUgNDkuNyAyMzMuNCAxMzAgMzEzLjggNTcuNiAyNy4zIDEyMS44IDQyLjggMTg5LjggNDIuOCAyNDUuNCAwIDQ0NC40LTE5OSA0NDQuNC00NDQuNCAwLTEyMi41LTQ5LjctMjMzLjQtMTMwLTMxMy44LTU3LjYtMjcuMy0xMjEuOS00Mi44LTE4OS44LTQyLjh6IiBmaWxsPSIjRkVDRTBBIiBwLWlkPSIyNDA2Ij48L3BhdGg+PHBhdGggZD0iTTcwNC40IDYxNi40YzAgMjguNi00LjkgNDQuNi0yNS4yIDU0LjMtMTUuNCA3LjMtMzUgOS40LTYwLjIgMTAtMTEuOCAwLjMtMjIuMS03LjctMjUuNC0xOS0wLjQtMS41LTAuOS0zLjEtMS40LTQuNi01LjMtMTYuNyA3LjMtMzMuNiAyNC44LTMzLjYgOCAwIDE0LjMtMC4xIDE3LjEtMC4zIDcuOCAwIDkuNy0xLjkgOS43LTguMlY1MTQuM2MwLTE0LjMtMTEuNi0yNS45LTI1LjktMjUuOWgtMzYuNGMtMTQuMyAwLTI1LjkgMTEuNi0yNS45IDI1Ljl2MTk1LjVjMCAxNC4zLTExLjYgMjUuOS0yNS45IDI1LjlINTIxYy0xNC4zIDAtMjUuOS0xMS42LTI1LjktMjUuOVY1MTQuM2MwLTE0LjMtMTEuNi0yNS45LTI1LjktMjUuOWgtMzNjLTE0LjMgMC0yNS45IDExLjYtMjUuOSAyNS45djE0MS42YzAgMTQuMy0xMS42IDI1LjktMjUuOSAyNS45aC03LjNjLTE0LjMgMC0yNS45LTExLjYtMjUuOS0yNS45VjQ1OGMwLTE0LjMgMTEuNi0yNS45IDI1LjktMjUuOWg5Mi4yYzE0LjMgMCAyNS45LTExLjYgMjUuOS0yNS45di0xMC45YzAtMTQuOC0xMi40LTI2LjYtMjcuMi0yNS45LTM4LjggMS43LTc3LjUgMi43LTExNC42IDMtMTIuMSAwLjEtMjIuOS04LjMtMjUuNC0yMC4xIDAtMC4yLTAuMS0wLjQtMC4xLTAuNi0zLjQtMTYuMSA4LjMtMzEuNCAyNC44LTMxLjggMTE4LTIuNyAyNDUuOS0xMC42IDMzOC4zLTIyLjggMTEuNi0xLjUgMjIuNyA0LjkgMjcuMiAxNS43bDEuMSAyLjZjNi42IDE1LjgtMy40IDMzLjYtMjAuNCAzNS44LTM2LjkgNC45LTc3LjIgOC43LTExOS4zIDExLjktMTMuNSAxLTIzLjkgMTIuMy0yMy45IDI1Ljl2MTcuM2MwIDE0LjMgMTEuNiAyNS45IDI1LjkgMjUuOWg5N2MxNC4zIDAgMjUuOSAxMS42IDI1LjkgMjUuOXYxNTguM3oiIGZpbGw9IiNGRkZGRkYiIHAtaWQ9IjI0MDciPjwvcGF0aD48L3N2Zz4=">
|
|
</image>
|
|
</button>
|
|
<button class="erweima" v-else @click="toDeposit">
|
|
<image
|
|
src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNjE2ODUyMjc2NDc1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjI0MDMiIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNNTEyIDUwOS4xbS00NDQuNCAwYTQ0NC40IDQ0NC40IDAgMSAwIDg4OC44IDAgNDQ0LjQgNDQ0LjQgMCAxIDAtODg4LjggMFoiIGZpbGw9IiNGQUIwMDEiIHAtaWQ9IjI0MDQiPjwvcGF0aD48cGF0aCBkPSJNODg3LjcgNDU5LjFjMC0xMzIuNS01OC0yNTEuMy0xNTAtMzMyLjdDNjcxLjYgODcuMiA1OTQuNCA2NC43IDUxMiA2NC43Yy0yNDUuNCAwLTQ0NC40IDE5OS00NDQuNCA0NDQuNCAwIDEzMi41IDU4IDI1MS4zIDE1MCAzMzIuNyA2Ni4yIDM5LjEgMTQzLjMgNjEuNyAyMjUuOCA2MS43IDI0NS40IDAgNDQ0LjMtMTk5IDQ0NC4zLTQ0NC40eiIgZmlsbD0iI0Y5RTQ4QSIgcC1pZD0iMjQwNSI+PC9wYXRoPjxwYXRoIGQ9Ik01NjggMTAyLjVjLTI0NS40IDAtNDQ0LjQgMTk5LTQ0NC40IDQ0NC40IDAgMTIyLjUgNDkuNyAyMzMuNCAxMzAgMzEzLjggNTcuNiAyNy4zIDEyMS44IDQyLjggMTg5LjggNDIuOCAyNDUuNCAwIDQ0NC40LTE5OSA0NDQuNC00NDQuNCAwLTEyMi41LTQ5LjctMjMzLjQtMTMwLTMxMy44LTU3LjYtMjcuMy0xMjEuOS00Mi44LTE4OS44LTQyLjh6IiBmaWxsPSIjRkVDRTBBIiBwLWlkPSIyNDA2Ij48L3BhdGg+PHBhdGggZD0iTTcwNC40IDYxNi40YzAgMjguNi00LjkgNDQuNi0yNS4yIDU0LjMtMTUuNCA3LjMtMzUgOS40LTYwLjIgMTAtMTEuOCAwLjMtMjIuMS03LjctMjUuNC0xOS0wLjQtMS41LTAuOS0zLjEtMS40LTQuNi01LjMtMTYuNyA3LjMtMzMuNiAyNC44LTMzLjYgOCAwIDE0LjMtMC4xIDE3LjEtMC4zIDcuOCAwIDkuNy0xLjkgOS43LTguMlY1MTQuM2MwLTE0LjMtMTEuNi0yNS45LTI1LjktMjUuOWgtMzYuNGMtMTQuMyAwLTI1LjkgMTEuNi0yNS45IDI1Ljl2MTk1LjVjMCAxNC4zLTExLjYgMjUuOS0yNS45IDI1LjlINTIxYy0xNC4zIDAtMjUuOS0xMS42LTI1LjktMjUuOVY1MTQuM2MwLTE0LjMtMTEuNi0yNS45LTI1LjktMjUuOWgtMzNjLTE0LjMgMC0yNS45IDExLjYtMjUuOSAyNS45djE0MS42YzAgMTQuMy0xMS42IDI1LjktMjUuOSAyNS45aC03LjNjLTE0LjMgMC0yNS45LTExLjYtMjUuOS0yNS45VjQ1OGMwLTE0LjMgMTEuNi0yNS45IDI1LjktMjUuOWg5Mi4yYzE0LjMgMCAyNS45LTExLjYgMjUuOS0yNS45di0xMC45YzAtMTQuOC0xMi40LTI2LjYtMjcuMi0yNS45LTM4LjggMS43LTc3LjUgMi43LTExNC42IDMtMTIuMSAwLjEtMjIuOS04LjMtMjUuNC0yMC4xIDAtMC4yLTAuMS0wLjQtMC4xLTAuNi0zLjQtMTYuMSA4LjMtMzEuNCAyNC44LTMxLjggMTE4LTIuNyAyNDUuOS0xMC42IDMzOC4zLTIyLjggMTEuNi0xLjUgMjIuNyA0LjkgMjcuMiAxNS43bDEuMSAyLjZjNi42IDE1LjgtMy40IDMzLjYtMjAuNCAzNS44LTM2LjkgNC45LTc3LjIgOC43LTExOS4zIDExLjktMTMuNSAxLTIzLjkgMTIuMy0yMy45IDI1Ljl2MTcuM2MwIDE0LjMgMTEuNiAyNS45IDI1LjkgMjUuOWg5N2MxNC4zIDAgMjUuOSAxMS42IDI1LjkgMjUuOXYxNTguM3oiIGZpbGw9IiNGRkZGRkYiIHAtaWQ9IjI0MDciPjwvcGF0aD48L3N2Zz4=">
|
|
</image>
|
|
</button>
|
|
</view>
|
|
<!-- 订单-余额 -->
|
|
<view class="order">
|
|
<!-- 订单类型 -->
|
|
<view class="title">我的订单</view>
|
|
<view class="list">
|
|
<view class="box" v-for="(row,index) in orderList" :key="index" @tap="toOrderList(index)">
|
|
<view class="img">
|
|
<view class="icon" :class="row.icon"></view>
|
|
</view>
|
|
<view class="text">{{row.text}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 工具栏 -->
|
|
<view class="toolbar">
|
|
<view class="title">我的工具栏</view>
|
|
<view class="list">
|
|
<view class="box" v-for="(row,index) in mytoolbarList" :key="index" @tap="toPage(row.url)">
|
|
<view class="img">
|
|
<image :src="row.img"></image>
|
|
</view>
|
|
<view class="text">{{row.text}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 占位 -->
|
|
<view class="place-bottom"></view>
|
|
<authorize></authorize>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import {
|
|
GetPhoneNumber,
|
|
findUser
|
|
} from "../../../Utils/Api.js";
|
|
let app = getApp()
|
|
import authorize from '../../../components/Authorize';
|
|
export default {
|
|
components: {
|
|
authorize
|
|
},
|
|
data() {
|
|
return {
|
|
isfirst: true,
|
|
headerPosition: "fixed",
|
|
headerTop: null,
|
|
statusTop: null,
|
|
showHeader: true,
|
|
//个人信息,
|
|
user: "",
|
|
// 订单类型
|
|
orderList: [{
|
|
text: '待支付',
|
|
icon: "fukuan"
|
|
},
|
|
{
|
|
text: '已支付',
|
|
icon: "fahuo"
|
|
},
|
|
{
|
|
text: '已完成',
|
|
icon: "shouhuo"
|
|
},
|
|
// {
|
|
// text: '已退款',
|
|
// icon: "pingjia"
|
|
// },
|
|
{
|
|
text: '已取消',
|
|
icon: "pingjia"
|
|
},
|
|
],
|
|
// 工具栏列表
|
|
mytoolbarList: [{
|
|
url: '/pages/goods/recording/recording?id=1',
|
|
text: '充值记录',
|
|
img: '/static/img/user/mingxi.png'
|
|
},
|
|
{
|
|
url: '/pages/goods/recording/recording?id=2',
|
|
text: '消费记录',
|
|
img: '/static/img/user/quan.png'
|
|
},
|
|
{
|
|
url: '/pages/user/mineCoupons/mineCoupons',
|
|
text: '我的卡券',
|
|
img: '/static/img/user/choujiang.png'
|
|
},
|
|
{
|
|
url: '../../login/login',
|
|
text: '商户入口',
|
|
img: '/static/img/user/point.png'
|
|
}
|
|
|
|
]
|
|
}
|
|
},
|
|
//下拉刷新，需要自己在page.json文件中配置开启页面下拉刷新 "enablePullDownRefresh": true
|
|
onPullDownRefresh() {
|
|
setTimeout(function() {
|
|
uni.stopPullDownRefresh();
|
|
}, 1000);
|
|
},
|
|
onPageScroll(e) {
|
|
//兼容iOS端下拉时顶部漂移
|
|
this.headerPosition = e.scrollTop >= 0 ? "fixed" : "absolute";
|
|
this.headerTop = e.scrollTop >= 0 ? null : 0;
|
|
this.statusTop = e.scrollTop >= 0 ? null : -this.statusHeight + 'px';
|
|
},
|
|
onLoad() {
|
|
this.statusHeight = 0;
|
|
},
|
|
onReady() {
|
|
//此处，演示,每次页面初次渲染都把登录状态重置
|
|
uni.setStorage({
|
|
key: 'UserInfo',
|
|
data: false,
|
|
success: function() {},
|
|
fail: function(e) {}
|
|
});
|
|
},
|
|
onShow() {
|
|
if (app.globalData.userInfo) {
|
|
this.findUser();
|
|
}
|
|
},
|
|
methods: {
|
|
findUser() {
|
|
let params;
|
|
findUser(params).then(res => {
|
|
if (res.return_code == '000000') {
|
|
app.globalData.userInfo = res.return_data;
|
|
this.user = res.return_data;
|
|
uni.setStorage({
|
|
key: "user",
|
|
data: res.return_data
|
|
})
|
|
}
|
|
});
|
|
},
|
|
getPhoneNumber(PhoneNumber) {
|
|
let params = {
|
|
openId: app.globalData.openId,
|
|
iv: PhoneNumber.detail.iv,
|
|
encryptedData: PhoneNumber.detail.encryptedData
|
|
}
|
|
GetPhoneNumber(params).then(res => {
|
|
if (res.return_code == '000000') {
|
|
app.globalData.userInfo = res.return_data
|
|
.object
|
|
.highUser;
|
|
uni.setStorage({
|
|
key: "user",
|
|
data: res.return_data
|
|
.object
|
|
.highUser
|
|
})
|
|
this.toDeposit();
|
|
}
|
|
});
|
|
},
|
|
//消息列表
|
|
toMsg() {
|
|
// uni.navigateTo({
|
|
// url:'../../msg/msg'
|
|
// })
|
|
uni.showToast({
|
|
title: '暂未开通',
|
|
icon: 'none'
|
|
});
|
|
},
|
|
toOrderList(index) {
|
|
uni.navigateTo({
|
|
url: '../../user/order_list/order_list?tbIndex=' + index
|
|
})
|
|
},
|
|
// toSetting() {
|
|
// uni.navigateTo({
|
|
// url: '../../user/setting/setting'
|
|
// })
|
|
// },
|
|
toMyQR() {
|
|
uni.navigateTo({
|
|
url: '../../user/myQR/myQR'
|
|
})
|
|
},
|
|
toLogin() {
|
|
uni.showToast({
|
|
title: '请登录',
|
|
icon: "none"
|
|
});
|
|
uni.navigateTo({
|
|
url: '../../login/login'
|
|
})
|
|
this.isfirst = false;
|
|
},
|
|
isLogin() {
|
|
//实际应用中,用户登录状态应该用token等方法去维持登录状态.
|
|
const value = uni.getStorageSync('UserInfo');
|
|
if (value) {
|
|
return true;
|
|
}
|
|
return false
|
|
},
|
|
toDeposit() {
|
|
uni.navigateTo({
|
|
url: '../../user/deposit/deposit'
|
|
})
|
|
},
|
|
toPage(url) {
|
|
if (!url) {
|
|
uni.showToast({
|
|
title: '模板未包含此页面',
|
|
icon: "none"
|
|
});
|
|
return;
|
|
}
|
|
uni.navigateTo({
|
|
url: url
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss">
|
|
page {
|
|
position: relative;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.status {
|
|
width: 100%;
|
|
height: 0;
|
|
position: fixed;
|
|
z-index: 10;
|
|
background-color: #f06c7a;
|
|
top: 0;
|
|
/* #ifdef APP-PLUS */
|
|
height: var(--status-bar-height); //覆盖样式
|
|
/* #endif */
|
|
|
|
}
|
|
|
|
.header {
|
|
width: 92%;
|
|
padding: 0 4%;
|
|
height: 100upx;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
position: fixed;
|
|
top: 0;
|
|
z-index: 10;
|
|
background-color: #f06c7a;
|
|
/* #ifdef APP-PLUS */
|
|
top: var(--status-bar-height);
|
|
|
|
/* #endif */
|
|
.icon-btn {
|
|
width: 120upx;
|
|
height: 60upx;
|
|
flex-shrink: 0;
|
|
display: flex;
|
|
|
|
.icon {
|
|
color: #fff;
|
|
width: 60upx;
|
|
height: 60upx;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
font-size: 42upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.place {
|
|
background-color: #f06c7a;
|
|
height: 100upx;
|
|
/* #ifdef APP-PLUS */
|
|
margin-top: var(--status-bar-height);
|
|
/* #endif */
|
|
}
|
|
|
|
.place-bottom {
|
|
height: 300upx;
|
|
}
|
|
|
|
.user {
|
|
width: 92%;
|
|
padding: 0 4%;
|
|
display: flex;
|
|
align-items: center;
|
|
// position: relative;
|
|
background-color: #f06c7a;
|
|
padding-bottom: 40rpx;
|
|
|
|
.left {
|
|
width: 20vw;
|
|
height: 20vw;
|
|
flex-shrink: 0;
|
|
margin-right: 20upx;
|
|
border: solid 1upx #fff;
|
|
border-radius: 100%;
|
|
|
|
image {
|
|
width: 20vw;
|
|
height: 20vw;
|
|
border-radius: 100%;
|
|
}
|
|
|
|
}
|
|
|
|
.right {
|
|
width: 100%;
|
|
|
|
.username {
|
|
font-size: 36upx;
|
|
color: #fff;
|
|
}
|
|
|
|
.signature {
|
|
color: #eee;
|
|
font-size: 28upx;
|
|
}
|
|
}
|
|
|
|
.erweima {
|
|
flex-shrink: 0;
|
|
width: 50px;
|
|
height: 50px;
|
|
padding: 0;
|
|
margin-left: 5vw;
|
|
border-radius: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: linear-gradient(to left, #fbbb37 0%, #fcf0d0 105%);
|
|
|
|
.icon {
|
|
color: #7b6335;
|
|
font-size: 42upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.order {
|
|
.title {
|
|
padding-top: 10upx;
|
|
margin: 0 0 10upx 3%;
|
|
font-size: 30upx;
|
|
height: 80upx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
width: 92%;
|
|
margin: 30rpx 4% 30rpx 4%;
|
|
padding: 0rpx 0% 20rpx 0%;
|
|
background-color: #fff;
|
|
box-shadow: 0rpx 0rpx 25rpx rgba(0, 0, 0, 0.1);
|
|
border-radius: 15rpx;
|
|
|
|
.list {
|
|
display: flex;
|
|
padding-bottom: 10upx;
|
|
|
|
.box {
|
|
width: 25%;
|
|
|
|
.img {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
|
|
.icon {
|
|
font-size: 50upx;
|
|
color: #464646;
|
|
}
|
|
}
|
|
|
|
.text {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
font-size: 28upx;
|
|
color: #3d3d3d;
|
|
}
|
|
}
|
|
}
|
|
|
|
.balance-info {
|
|
display: flex;
|
|
padding: 10upx 0;
|
|
|
|
.left {
|
|
width: 75%;
|
|
display: flex;
|
|
|
|
.box {
|
|
width: 50%;
|
|
font-size: 28upx;
|
|
|
|
.num {
|
|
width: 100%;
|
|
height: 50upx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: flex-end;
|
|
color: #f9a453;
|
|
}
|
|
|
|
.text {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
color: #3d3d3d;
|
|
font-size: 28upx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.right {
|
|
border-left: solid 1upx #17e6a1;
|
|
width: 25%;
|
|
|
|
.box {
|
|
|
|
.img {
|
|
width: 100%;
|
|
height: 50upx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: flex-end;
|
|
|
|
.icon {
|
|
font-size: 45upx;
|
|
color: #e78901;
|
|
}
|
|
}
|
|
|
|
.text {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
font-size: 28upx;
|
|
color: #3d3d3d;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.VIP {
|
|
width: 84%;
|
|
margin: -65upx auto 20upx auto;
|
|
padding: 30upx 4%;
|
|
background: linear-gradient(to left, #dea96d 0%, #f6d59b 100%);
|
|
box-shadow: 0upx 0upx 25upx rgba(0, 0, 0, 0.2);
|
|
border-radius: 15upx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.img {
|
|
flex-shrink: 0;
|
|
width: 60upx;
|
|
height: 60upx;
|
|
|
|
image {
|
|
width: 60upx;
|
|
height: 60upx;
|
|
}
|
|
}
|
|
|
|
.title {
|
|
width: 100%;
|
|
color: #796335;
|
|
font-size: 30upx;
|
|
}
|
|
|
|
.tis {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
color: #fcf0d0;
|
|
font-size: 26upx;
|
|
}
|
|
}
|
|
|
|
.toolbar {
|
|
width: 92%;
|
|
margin: 0 4% 0 4%;
|
|
padding: 0 0 20upx 0;
|
|
background-color: #fff;
|
|
box-shadow: 0upx 0upx 25upx rgba(0, 0, 0, 0.1);
|
|
border-radius: 15upx;
|
|
|
|
.title {
|
|
padding-top: 10upx;
|
|
margin: 0 0 10upx 3%;
|
|
font-size: 30upx;
|
|
height: 80upx;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.box {
|
|
width: 25%;
|
|
margin-bottom: 30upx;
|
|
|
|
.img {
|
|
width: 23vw;
|
|
height: 10.5vw;
|
|
display: flex;
|
|
justify-content: center;
|
|
|
|
image {
|
|
width: 9vw;
|
|
height: 9vw;
|
|
}
|
|
}
|
|
|
|
.text {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
font-size: 26upx;
|
|
color: #3d3d3d;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|