952 lines
26 KiB
Vue
952 lines
26 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="bgBox"></view>
|
|
<!-- <view class="headTitle">个人中心</view> -->
|
|
<view class="flexView">
|
|
<view class="statusBox"></view>
|
|
<view style="height: 88rpx;flex-shrink: 0;"></view>
|
|
<view class="headTitle">个人中心</view>
|
|
<view class="head-read" >
|
|
<view class="flex" v-if="headflag" @click="openface()">
|
|
<image class="read-img" :src="avatar" mode="aspectFill"></image>
|
|
<view class="flex-box" >
|
|
<view class="flex-box-text">{{nickname}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex" v-else @click="gologin()">
|
|
<image class="read-img" :src="avatar" mode="aspectFill"></image>
|
|
<view class="flex-box" >
|
|
<view class="flex-box-text">登录</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="walletWrap">
|
|
<image :src="path+'/assets/img/icon/bg1.png'" class="walletBg"></image>
|
|
<view class="walletBox">
|
|
<view class="flex-between">
|
|
<image :src="path+'/assets/img/icon/wallet.png'" class="img1"></image>
|
|
<view class="flex-center" @click="gopage2('/pages/mine/priceRecord')">
|
|
<text class="text1">资金记录</text>
|
|
<u-icon name="arrow-right" color="#333333" size="12" style="margin-top: 5rpx;"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="text2">账户余额</view>
|
|
<view class="flex-between">
|
|
<view class="flex-center">
|
|
<text v-if="eyeOpen" class="priceText">{{user_money}}</text>
|
|
<text v-else class="priceText">{{hidePrice(user_money)}}</text>
|
|
<image @click="clickEye" v-if="eyeOpen" :src="path+'/assets/img/icon/eyeOpen.png'" class="img2"></image>
|
|
<image @click="clickEye" v-else :src="path+'/assets/img/icon/eyeCloese.png'" class="img3"></image>
|
|
</view>
|
|
<view class="priceBtn flex-center" @click="chargeShow = true">充值</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="fuwu mainwidth2 orderBox">
|
|
<view class="fsz32 flex-between orderHead">
|
|
<view class="orderLable">我的订单 </view>
|
|
<view class="flex-center" @click="gopage2('/pages/order/order')">
|
|
<text class="moreText">更多</text>
|
|
<u-icon name="arrow-right" color="#282F38" size="12"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="menuBox">
|
|
<view class="menuView" @click="linkOrder(2)">
|
|
<image :src="path+'/assets/img/icon/reservation.png'" class="menuIcon"></image>
|
|
<text class="menuText">已预约</text>
|
|
</view>
|
|
<view class="menuView" @click="linkOrder(3)">
|
|
<image :src="path+'/assets/img/icon/serve.png'" class="menuIcon"></image>
|
|
<text class="menuText">待服务</text>
|
|
</view>
|
|
<view class="menuView" @click="linkOrder(4)">
|
|
<image :src="path+'/assets/img/icon/finish.png'" class="menuIcon"></image>
|
|
<text class="menuText">已完成</text>
|
|
</view>
|
|
<view class="menuView" @click="linkOrder(5)">
|
|
<image :src="path+'/assets/img/icon/evaluate.png'" class="menuIcon"></image>
|
|
<text class="menuText">已评价</text>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
<view class="fuwu mainwidth2">
|
|
<view class="fsz32 flex-between listBox" @click="gopage2('/pages/mine/orderConfig')">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/config2.png'" class="listIcon"></image>
|
|
<text class="listLabel">接单设置</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view>
|
|
<view class="fsz32 flex-between listBox" open-type="feedback" @click="linkFeekback">
|
|
<!-- button class="slide-Items" open-type="feedback" -->
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/advise.png'" class="listIcon"></image>
|
|
<text class="listLabel">意见反馈</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view>
|
|
<view class="fsz32 flex-between listBox" @click="linkPage('/pages/mine/apply')">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/pen.png'" class="listIcon"></image>
|
|
<text class="listLabel">我的签约</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view>
|
|
<!-- <view class="fsz32 flex-between listBox" @click="linkPage('/pages/mine/promotion')">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/send.png'" class="listIcon"></image>
|
|
<text class="listLabel">推广奖金</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view> -->
|
|
<view class="fsz32 flex-between listBox" @click="linkPage('/pages/question/index')">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/question.png'" class="listIcon"></image>
|
|
<text class="listLabel">常见问题</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view>
|
|
<view class="fsz32 flex-between listBox">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/customerService.png'" class="listIcon"></image>
|
|
<text class="listLabel">联系客服</text>
|
|
</view>
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/phone.png'" class="listIcon"></image>
|
|
<text class="phoneText" @click="callPhone('400-423-888')">400-423-888</text>
|
|
</view>
|
|
</view>
|
|
<button class="fsz32 flex-between listBox" open-type="contact">
|
|
<view class="flex-center">
|
|
<!-- <button class="flex-center slide-Items" open-type="contact"> -->
|
|
<image :src="path+'/assets/img/icon/message.png'" class="listIcon"></image>
|
|
<text class="listLabel">在线客服</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</button>
|
|
<!-- <view class="fsz32 flex-between listBox" @click="linkPage('/pages/mine/editInfo')">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/question.png'" class="listIcon"></image>
|
|
<text class="listLabel">信息编辑</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view>
|
|
<view class="fsz32 flex-between listBox" @click="linkPage('/pages/question/index')">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/question.png'" class="listIcon"></image>
|
|
<text class="listLabel">密码设置</text>
|
|
</view>
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view> -->
|
|
</view>
|
|
<view class="fuwu mainwidth2 qrcodeBox" @click="linkPage('/pages/poster/sharePoster')">
|
|
<!-- <view class="padding15 fsz32" @click="shareShow = true">
|
|
推广二维码
|
|
</view> -->
|
|
<view class="fsz32 h3-list flex-between padding15">
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/qrcode.png'" class="listIcon"></image>
|
|
<text class="listLabel">推广二维码</text>
|
|
<text class="commission">赚佣金</text>
|
|
</view>
|
|
<view class="flex-center">
|
|
<image :src="path+'/assets/img/icon/share.png'" style="width: 111rpx;height: 26rpx;"></image>
|
|
<!-- <text style="font-size: 26rpx;font-weight: 800;">立即分享</text> -->
|
|
<image src="/static/img/right.png" style="width: 50rpx;height:50rpx;"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<u-popup :show="passwordShow" mode="center" @close="close" @open="open" :round="10">
|
|
<view class="passwordBox">
|
|
<view class="flex-between">
|
|
<text class="text2">设置支付密码</text>
|
|
<u-icon name="close" color="#333333" size="18" @click="passwordShow = false"></u-icon>
|
|
</view>
|
|
<view class="passwordView flex-between">
|
|
<text class="text1">原密码:</text>
|
|
<input type="text" class="input1" placeholder="请输入原密码" />
|
|
</view>
|
|
<view class="passwordView flex-between">
|
|
<text class="text1">新密码:</text>
|
|
<input type="text" class="input1" placeholder="请输入原密码" />
|
|
</view>
|
|
<view class="passwordView flex-between">
|
|
<text class="text1">确认密码:</text>
|
|
<input type="text" class="input1" placeholder="请输入原密码" />
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<u-popup :show="chargeShow" mode="center" @close="close" @open="open" :round="10">
|
|
<view class="passwordBox">
|
|
<view class="flex-between">
|
|
<text class="text2">充值</text>
|
|
<u-icon name="close" color="#333333" size="18" @click="chargeShow = false"></u-icon>
|
|
</view>
|
|
<view class="passwordView flex-between">
|
|
<text class="text1">充值金额:</text>
|
|
<input v-model="chargeNum" type="number" class="input1" placeholder="请输入充值金额" />
|
|
</view>
|
|
<view class="flex-center" style="margin-top: 50rpx;">
|
|
<view class="cancleBtn flex-center" @click="chargeShow = false">取消</view>
|
|
<view class="confirmBtn flex-center" @click="createRecharge" style="margin-left: 30rpx;">确定</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<!-- <view class="fuwu mainwidth2">
|
|
<view class="h3-title fsz32">
|
|
我的服务
|
|
</view>
|
|
<view class="mine_card ">
|
|
<view class="li" @click="gopage2('/pages/order/order')">
|
|
<image src="/static/img/40.png" mode="widthFix"></image>
|
|
<view class="fsz30">用户订单</view>
|
|
</view>
|
|
<view class="li" @click="gopage2('/pages/address/list')" >
|
|
<image src="/static/img/46.png" mode="widthFix"></image>
|
|
<view class="fsz30">用户地址</view>
|
|
</view>
|
|
<view class="li" @click="gopage2('/pages/exchange/goodslist')">
|
|
<image src="/static/img/48.png" mode="widthFix"></image>
|
|
<view class="fsz30">积分商品</view>
|
|
</view>
|
|
<view class="li" @click="gopage2('/pages/exchange/orderlist')" >
|
|
<image src="/static/img/51.png" mode="widthFix"></image>
|
|
<view class="fsz30">兑换订单</view>
|
|
</view>
|
|
|
|
<view class="li" >
|
|
<button class="slide-Items" open-type="contact" >
|
|
<image src="/static/img/kefu.png" mode="widthFix"></image>
|
|
<view class="fsz30" style="margin-top: -20px;">在线客服</view>
|
|
</button>
|
|
</view>
|
|
<view class="li" @click="gopage2('/pages/question/index')">
|
|
<image src="/static/img/47.png" mode="widthFix"></image>
|
|
<view class="fsz30" >常见问题</view>
|
|
</view>
|
|
<view class="li" @click="goabout()" >
|
|
<image src="/static/img/43.png" mode="widthFix"></image>
|
|
<view class="fsz30">关于我们</view>
|
|
</view>
|
|
<view class="li" >
|
|
<button class="slide-Items" open-type="feedback" >
|
|
<image src="/static/img/52.png" mode="widthFix"></image>
|
|
<view class="fsz30" style="margin-top: -20px;">意见反馈</view>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="fuwu mainwidth2">
|
|
<view class="h3-title fsz32">
|
|
回收员工作台
|
|
</view>
|
|
<view class="mine_card " >
|
|
|
|
<view class="li" @click="goworkerpage('/pages/person/orderlist')" v-if="person && person.status ==2">
|
|
<image src="/static/img/39.png" mode="widthFix"></image>
|
|
<view class="fsz30">回收员订单</view>
|
|
</view>
|
|
<view class="li" @click="goworkerpage('/pages/person/qiangdan')" v-if="person && person.status ==2">
|
|
<image src="/static/img/49.png" mode="widthFix"></image>
|
|
<view class="fsz30">抢单大厅</view>
|
|
</view>
|
|
|
|
<view class="li" @click="goadd('')" v-else>
|
|
<image src="/static/img/41.png" mode="widthFix"></image>
|
|
<view class="fsz30">成为回收员</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
<!-- <view v-show="shareShow" style="position: fixed;left: 0;bottom:0;width: 100%;">
|
|
<sharePoster
|
|
ref="wanlShare2"
|
|
page="pages/user"
|
|
:scene="{shareId: '123', qr:'g'}"
|
|
:scrollAnimation="scrollAnimation"
|
|
:shareTitle="goodsData.title"
|
|
:shareText="goodsData.description"
|
|
:image="goodsData.image"
|
|
:price="goodsData.interval_price"
|
|
:marketPrice="goodsData.market_price"
|
|
isReport
|
|
@change="shareChange"
|
|
@closePoster="closePoster"
|
|
/>
|
|
</view> -->
|
|
<view style="height: 220rpx; flex-shrink: 0;"></view>
|
|
</view>
|
|
<custom-tab-bar :current-page="1" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// import sharePoster from '../poster/sharePoster.vue';
|
|
import CustomTabBar from '@/components/CustomTabBar.vue';
|
|
export default {
|
|
data() {
|
|
return {
|
|
exchange_shop:'',
|
|
point:0,
|
|
user_money:0,
|
|
person_money:0,
|
|
exchange_shop:'',
|
|
userinfo:{},
|
|
headflag:false,
|
|
nickname:'微信用户',
|
|
person:{},
|
|
avatar:'/static/img/t2.png',
|
|
goodsData: {},
|
|
scrollAnimation: 300,
|
|
shareShow: false,
|
|
path: this.path,
|
|
passwordShow: false,
|
|
eyeOpen: false,
|
|
chargeShow: false,
|
|
chargeNum: ''
|
|
}
|
|
},
|
|
components:{
|
|
// sharePoster,
|
|
CustomTabBar
|
|
},
|
|
onLoad() {
|
|
|
|
var token = uni.getStorageSync('userToken');
|
|
if (!token) {
|
|
this.headflag = false
|
|
return false;
|
|
}
|
|
this.getinfo()
|
|
this.getauth();
|
|
},
|
|
onShow() {
|
|
uni.hideTabBar({
|
|
fail: () => {},
|
|
});
|
|
var token = uni.getStorageSync('userToken');
|
|
if (!token) {
|
|
this.headflag = false
|
|
return false;
|
|
}
|
|
this.getinfo()
|
|
this.getauth()
|
|
|
|
},
|
|
methods: {
|
|
createRecharge(){
|
|
console.log(this.person)
|
|
let data = {
|
|
amount: Number(this.chargeNum),
|
|
person_id: this.person.id
|
|
}
|
|
this.$api.createRecharge(data,res=>{
|
|
if(res.code == '1'){
|
|
// this.typelist = res.data.type
|
|
uni.showToast({ title: "充值成功" , icon: 'success' })
|
|
}else{
|
|
uni.showToast({ title: res.msg, icon: 'none' })
|
|
}
|
|
})
|
|
},
|
|
clickEye(){
|
|
this.eyeOpen = !this.eyeOpen
|
|
},
|
|
hidePrice(val){
|
|
let star = ''
|
|
for(let i=1;i < val.length;i++){
|
|
star += '*'
|
|
}
|
|
return star
|
|
},
|
|
linkOrder(val){
|
|
uni.navigateTo({
|
|
url: '/pages/order/order?type='+val
|
|
})
|
|
},
|
|
linkFeekback(){
|
|
uni.navigateTo({
|
|
url: '/pages/feedback/index'
|
|
})
|
|
},
|
|
callPhone(phoneNumber) {
|
|
uni.makePhoneCall({
|
|
phoneNumber: phoneNumber, // 必需，电话号码字符串
|
|
success: (res) => {
|
|
console.log("拨号成功", res);
|
|
},
|
|
fail: (err) => {
|
|
console.error("拨号失败", err);
|
|
}
|
|
});
|
|
},
|
|
linkPage(path){
|
|
uni.navigateTo({
|
|
url: path
|
|
})
|
|
},
|
|
getauth(){
|
|
var _this = this;
|
|
_this.$api.userInfo({},res=>{
|
|
if(res.code == '1'){
|
|
uni.setStorageSync('userInfo', res.data.user);
|
|
if(res.data.user.status =='hidden' ){
|
|
uni.setStorageSync('userToken', '');
|
|
this.headflag = false
|
|
_this.avatar = '/static/img/t2.png';
|
|
uni.showToast({ title: "您的账号已被禁止" , icon: 'none' })
|
|
return false;
|
|
}
|
|
if(res.data.user.avatar){
|
|
_this.avatar = res.data.user.avatar
|
|
}
|
|
// console.log(res.data.user)
|
|
_this.nickname = res.data.user.nickname
|
|
_this.point = res.data.user.user_point
|
|
_this.user_money = res.data.user.money
|
|
_this.person_money = res.data.user.person_money
|
|
_this.person = res.data.person
|
|
}else if(res.code == '0'){
|
|
_this.avatar = '/static/img/t2.png';
|
|
|
|
uni.setStorageSync('userToken', '');
|
|
this.headflag = false
|
|
}else{
|
|
}
|
|
})
|
|
},
|
|
gopage2(url){
|
|
|
|
var token = uni.getStorageSync('userToken');
|
|
if (token) {
|
|
if(url =='/pages/order/order2'){
|
|
uni.switchTab({
|
|
url:'/pages/order/order'
|
|
})
|
|
}else{
|
|
uni.navigateTo({
|
|
url:url
|
|
})
|
|
}
|
|
return false;
|
|
|
|
}else{
|
|
this.gologin()
|
|
}
|
|
},
|
|
goworkerpage(url){
|
|
var token = uni.getStorageSync('userToken');
|
|
if (token) {
|
|
if(this.person){
|
|
if(this.person.status !=2){
|
|
uni.showToast({ title: "身份不符合回收员" , icon: 'none' })
|
|
return false;
|
|
}
|
|
}
|
|
if(!this.person){
|
|
return false;
|
|
}
|
|
uni.navigateTo({
|
|
url: url
|
|
})
|
|
|
|
} else{
|
|
this.gologin()
|
|
}
|
|
},
|
|
goadd(){
|
|
|
|
var token = uni.getStorageSync('userToken');
|
|
if (token) {
|
|
if(this.person){
|
|
if(this.person.status ==1){
|
|
uni.showToast({ title: "请等待审核", icon: 'none' })
|
|
return false;
|
|
}
|
|
if(this.person.status ==3){
|
|
uni.showToast({ title: "您的申请被拒绝" , icon: 'none' })
|
|
return false;
|
|
}
|
|
if(this.person.status ==2){
|
|
uni.showToast({ title: "您的申请已经审核通过，不需要在申请" , icon: 'none' })
|
|
return false;
|
|
}
|
|
}
|
|
uni.navigateTo({
|
|
url:'/pages/person/add'
|
|
})
|
|
|
|
} else{
|
|
this.gologin()
|
|
}
|
|
|
|
},
|
|
|
|
// 登陆
|
|
gologin(){
|
|
uni.navigateTo({
|
|
url:'../login/authorize'
|
|
})
|
|
},
|
|
goabout(){
|
|
uni.navigateTo({
|
|
url:'/pages/about/about'
|
|
})
|
|
},
|
|
// 查看是否有token
|
|
getinfo(){
|
|
|
|
var token = uni.getStorageSync('userToken');
|
|
if (token) {
|
|
this.headflag = true
|
|
|
|
}else{
|
|
this.headflag = false
|
|
}
|
|
},
|
|
openface(){
|
|
uni.navigateTo({
|
|
url:'/pages/mine/edituser'
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content{
|
|
background: #F5F5FA;
|
|
overflow: hidden;
|
|
height: 100vh;
|
|
}
|
|
.listIcon{
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
.listLabel{
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
margin-left: 12rpx;
|
|
}
|
|
.commission{
|
|
background: #FFBF12;
|
|
border-radius: 16rpx 16rpx 16rpx 0px;
|
|
font-weight: 500;
|
|
font-size: 20rpx;
|
|
color: #FFFFFF;
|
|
margin-left: 14rpx;
|
|
padding: 6rpx 13rpx;
|
|
}
|
|
.qrcodeBox{
|
|
background: linear-gradient(90deg, #FFF6EB 0%, #FFFCF1 100%)!important;
|
|
margin-bottom: 20rpx!important;
|
|
}
|
|
.phoneText{
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #FB8E0C;
|
|
margin-left: 7rpx;
|
|
margin-right: 18rpx;
|
|
}
|
|
.listBox{
|
|
padding: 32rpx 0rpx;
|
|
margin: 0 32rpx;
|
|
border-bottom: solid 1px #eee;
|
|
}
|
|
.listBox:last-child{
|
|
border-bottom: none
|
|
}
|
|
button::after{
|
|
border: none;
|
|
}button{
|
|
background: #fff;padding: 0 15rpx;
|
|
|
|
}
|
|
page{background-color: #eee !important;}
|
|
.bgBox{
|
|
width: 100%;
|
|
height: 500rpx;
|
|
background: linear-gradient(0deg, #F5F5FA 0%, #FFF9EA 100%);
|
|
position: fixed;
|
|
left: 0;
|
|
top: calc(88rpx + var(--status-bar-height));
|
|
z-index: 0;
|
|
}
|
|
.moreText{
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
}
|
|
.orderLable{
|
|
font-weight: 800;
|
|
font-size: 26rpx;
|
|
color: #62442B;
|
|
}
|
|
.orderBox{
|
|
padding: 32rpx 0 29rpx!important;
|
|
.orderHead{
|
|
padding: 0 35rpx 7rpx 29rpx;
|
|
}
|
|
}
|
|
.mine_card{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
.li{
|
|
flex: 0 0 25%;
|
|
text-align: center;
|
|
margin-bottom: 15rpx;
|
|
color: #333333;
|
|
position: relative;
|
|
image{
|
|
width: 100rpx;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
>.fsz26{
|
|
position: absolute;
|
|
background: #e01f20;
|
|
min-width: 36rpx;
|
|
min-height: 36rpx;
|
|
border-radius: 50%;
|
|
top: 0;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
.mine_card2{
|
|
padding-top: 25rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
|
|
.flexView {
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
position: relative;
|
|
flex-direction: column;
|
|
overflow: auto;
|
|
|
|
.head-read {
|
|
// background-color: #00a73b;
|
|
padding-bottom: 10rpx;
|
|
.flex {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 43rpx 50rpx 24rpx 35rpx;
|
|
position: relative;
|
|
.read-img {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
border-radius: 100%;
|
|
overflow: hidden;
|
|
margin-right: 20rpx;
|
|
border: 4rpx solid rgba(255, 255, 255, 0.3);
|
|
}
|
|
.flex-box {
|
|
flex: 1;
|
|
min-width: 0;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
&-text {
|
|
margin: 10rpx 0;
|
|
// color: #f5f5f5;
|
|
// font-weight: normal;
|
|
// font-weight: bold;
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
.arrow {
|
|
position: relative;
|
|
padding-right: 30rpx;
|
|
span {
|
|
font-size: 28rpx;
|
|
color: white;
|
|
}
|
|
&:after {
|
|
content: ' ';
|
|
display: inline-block;
|
|
height: 12rpx;
|
|
width: 12rpx;
|
|
border-width: 4rpx 4rpx 0 0;
|
|
border-color: #848484;
|
|
border-style: solid;
|
|
transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
|
|
position: relative;
|
|
top: -4rpx;
|
|
position: absolute;
|
|
top: 50%;
|
|
margin-top: -8rpx;
|
|
right: 4rpx;
|
|
border-radius: 2rpx;
|
|
}
|
|
}
|
|
.arrow-one:after {
|
|
border-color: white;
|
|
margin-top: -6rpx;
|
|
}
|
|
}
|
|
}
|
|
.white-box {
|
|
width: 94%;
|
|
background: white;
|
|
border-radius: 10rpx;margin: -75rpx auto 0rpx;
|
|
box-shadow: 0 6rpx 20rpx #e7e7e7;
|
|
.tx {
|
|
padding-top: 26rpx;
|
|
overflow: hidden;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-content: center;
|
|
&-grid {
|
|
box-sizing: border-box;
|
|
&:first-child {
|
|
margin-left: 40rpx;
|
|
}
|
|
&-comm-sign {
|
|
display: block;
|
|
border-radius: 40rpx 0 0 40rpx;
|
|
font-size: 26rpx;
|
|
padding: 16rpx 44rpx;
|
|
background: linear-gradient(to right, #fef082, #ffc551);
|
|
background-color: #fef082;
|
|
color: #cf4400;
|
|
}
|
|
&-text {
|
|
display: block;
|
|
color: #333;
|
|
font-size: 26rpx;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
.title {
|
|
font-size: 26rpx;
|
|
font-weight: normal;
|
|
}
|
|
.money {
|
|
font-size: 50rpx;
|
|
color: #ff6423;
|
|
letter-spacing: 2rpx;
|
|
margin-bottom: 10rpx;
|
|
&-b {
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.palace {
|
|
padding-bottom: 25rpx;
|
|
overflow: hidden;
|
|
display: flex;
|
|
justify-content: center;
|
|
padding-top: 25rpx;
|
|
&-grid {
|
|
flex: 1;
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
&:not(:last-child) {
|
|
&:after {
|
|
width: 1rpx;
|
|
height: 80rpx;
|
|
background: #fddece;
|
|
content: ' ';
|
|
display: inline-block;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
}
|
|
}
|
|
&-text {
|
|
display: block;
|
|
text-align: center;
|
|
color: #333;
|
|
font-size: 32rpx;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
&-name {
|
|
font-size: 26rpx;
|
|
font-weight: normal;
|
|
}
|
|
&-data {
|
|
font-size: 32rpx;
|
|
letter-spacing: 2rpx;
|
|
margin-bottom: 12rpx;
|
|
&-b {
|
|
font-size: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
.h3-list{
|
|
margin: 0px 10px 0px 10px;
|
|
border-bottom: solid 1px #eee;
|
|
padding: 10px 0px;
|
|
}
|
|
.h3-list:last-child{
|
|
border-bottom: none
|
|
}
|
|
.h3-title{margin: 0px 10px 15px 10px;
|
|
border-bottom: solid 1px #eee;
|
|
padding: 10px 0px;}
|
|
.fuwu{background:#fff;border-radius:20rpx;box-sizing:border-box;padding:0rpx;margin:20rpx 35rpx 0rpx 35rpx;;box-sizing:border-box}
|
|
.menuBox{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.menuView{
|
|
width: 25%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: 20rpx;
|
|
.menuIcon{
|
|
width: 87rpx;
|
|
height: 87rpx;
|
|
}
|
|
.menuText{
|
|
margin-top: 19rpx;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
}
|
|
.headTitle{
|
|
font-weight: bold;
|
|
font-size: 34rpx;
|
|
color: #181622;
|
|
// margin-top: 29rpx;
|
|
text-align: center;
|
|
// margin-bottom: 25rpx;
|
|
// padding: 29rpx 0 25rpx;
|
|
height: calc(88rpx + var(--status-bar-height));
|
|
line-height: 88rpx;
|
|
background: #FEF9EB;
|
|
position: fixed;
|
|
width: 100%;
|
|
z-index: 99;
|
|
padding-top: var(--status-bar-height);
|
|
}
|
|
.statusBox{
|
|
height: var(--status-bar-height);
|
|
flex-shrink: 0;
|
|
}
|
|
.walletWrap{
|
|
width: 680rpx;
|
|
height: 240rpx;
|
|
border-radius: 20rpx;
|
|
position: relative;
|
|
margin: 0 auto;
|
|
flex-shrink: 0;
|
|
.walletBg{
|
|
width: 680rpx;
|
|
height: 240rpx;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 0;
|
|
}
|
|
.walletBox{
|
|
width: 680rpx;
|
|
height: 240rpx;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 1;
|
|
padding: 32rpx 29rpx;
|
|
.img1{
|
|
width: 95rpx;
|
|
height: 23rpx;
|
|
}
|
|
.text1{
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
margin-right: 10rpx;
|
|
}
|
|
.text2{
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #62442B;
|
|
margin-top: 32rpx;
|
|
}
|
|
.img2{
|
|
width: 34rpx;
|
|
height: 34rpx;
|
|
margin-left: 29rpx;
|
|
}
|
|
.img3{
|
|
width: 34rpx;
|
|
height: 34rpx;
|
|
margin-left: 29rpx;
|
|
}
|
|
.priceBtn{
|
|
width: 124rpx;
|
|
height: 60rpx;
|
|
background: #FFF2E2;
|
|
border-radius: 30rpx;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
}
|
|
.priceText{
|
|
font-weight: 500;
|
|
font-size: 48rpx;
|
|
color: #62442B;
|
|
}
|
|
}
|
|
}
|
|
.passwordBox{
|
|
padding: 40rpx 45rpx;
|
|
border-radius: 30rpx;
|
|
.text2{
|
|
font-weight: bold;
|
|
font-size: 36rpx;
|
|
color: #000000;
|
|
}
|
|
.passwordView{
|
|
margin-top: 40rpx;
|
|
.text1{
|
|
font-size: 30rpx;
|
|
color: #000000;
|
|
width: 160rpx;
|
|
text-align: right;
|
|
}
|
|
.input1{
|
|
margin-left: 15rpx;
|
|
border: 1rpx solid rgba(0,0,0,.1);
|
|
border-radius: 10rpx;
|
|
padding: 15rpx;
|
|
padding-left: 20rpx;
|
|
font-size: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
.cancleBtn{
|
|
width: 260rpx;
|
|
height: 90rpx;
|
|
background: #F2F2F2;
|
|
border-radius: 45rpx;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #444444;
|
|
}
|
|
.confirmBtn{
|
|
width: 260rpx;
|
|
height: 90rpx;
|
|
background: #FB8F0C;
|
|
border-radius: 45rpx;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
</style> |