1080 lines
29 KiB
Vue
1080 lines
29 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>{{userPhone}}</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(servicePhone)">{{servicePhone}}</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>
|
||
<u-popup :show="pop2Show" @click="pop2Show=false" mode="center" :round="30">
|
||
<view class="popBoxTwo" @click="pop2Show=false">
|
||
<image :src="path+'/assets/img/icon/bg4.png'" class="popTwoImg"></image>
|
||
<view class="popContent">
|
||
<text class="popTwoText1">工作证</text>
|
||
<text class="popTwoText2">{{personInfo.realname}}</text>
|
||
<!-- <text class="popTwoText3">工号：GH02301~</text> -->
|
||
<image :src="userinfo.avatar" class="popTowHeadImg"></image>
|
||
<view class="flex-center" style="margin-top: 40rpx;">
|
||
<view class="flex-center">
|
||
<text class="text1">人身保险</text>
|
||
<view class="status" v-if="personInfo.personal_insurance">已上传</view>
|
||
<view class="status">待上传</view>
|
||
</view>
|
||
<view class="flex-center" style="margin-left: 37rpx;">
|
||
<text class="text1">健康证</text>
|
||
<view class="status" v-if="personInfo.health_certificate">已上传</view>
|
||
<view class="status">待上传</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="popTwoText4">高空作业证</view> -->
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<custom-tab-bar :current-page="1" @centerClick="centerClick" />
|
||
</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:{},
|
||
personInfo: {},
|
||
headflag:false,
|
||
nickname:'微信用户',
|
||
person:{},
|
||
avatar:'/static/img/t2.png',
|
||
goodsData: {},
|
||
scrollAnimation: 300,
|
||
shareShow: false,
|
||
path: this.path,
|
||
passwordShow: false,
|
||
eyeOpen: false,
|
||
chargeShow: false,
|
||
chargeNum: '',
|
||
pop2Show: false,
|
||
userPhone: '',
|
||
servicePhone: ''
|
||
}
|
||
},
|
||
components:{
|
||
// sharePoster,
|
||
CustomTabBar
|
||
},
|
||
onLoad() {
|
||
this.servicePhone = uni.getStorageSync('servicePhone')
|
||
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: {
|
||
centerClick(val){
|
||
console.log(val,'fff')
|
||
this.pop2Show = true;
|
||
},
|
||
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 = this.path + res.data.person.avatar
|
||
}
|
||
_this.userinfo = res.data.user
|
||
_this.personInfo = res.data.person
|
||
// console.log(res.data.user)
|
||
_this.nickname = res.data.person.realname
|
||
_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
|
||
_this.userPhone = this.maskMiddleFour(res.data.user.mobile);
|
||
uni.setStorageSync('personInfo', res.data.person);
|
||
}else if(res.code == '0'){
|
||
_this.avatar = '/static/img/t2.png';
|
||
|
||
uni.setStorageSync('userToken', '');
|
||
this.headflag = false
|
||
}else{
|
||
}
|
||
})
|
||
},
|
||
maskMiddleFour(str) {
|
||
console.log(str)
|
||
if(str){
|
||
// 检查字符串长度是否至少为8，以确保有足够的字符来替换中间4位
|
||
str = str.toString().padStart(10, '0'); // 如果不足10位，前面补0
|
||
return str.slice(0, 4) + '****' + str.slice(-4);
|
||
}else{
|
||
return ''
|
||
}
|
||
|
||
},
|
||
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/login'
|
||
})
|
||
},
|
||
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;
|
||
}
|
||
|
||
.popBoxTwo{
|
||
width: 520rpx;
|
||
height: 800rpx;
|
||
.popTwoImg{
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 1;
|
||
}
|
||
.popContent{
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 2;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
.popTwoText1{
|
||
font-weight: bold;
|
||
font-size: 48rpx;
|
||
color: #7F5C2A;
|
||
line-height: 60rpx;
|
||
margin-top: 106rpx;
|
||
}
|
||
.popTwoText2{
|
||
font-weight: bold;
|
||
font-size: 36rpx;
|
||
color: #4F3D24;
|
||
margin-top: 29rpx;
|
||
}
|
||
.popTwoText3{
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #B8A58B;
|
||
}
|
||
.popTwoText4{
|
||
width: 420rpx;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
padding-left: 27rpx;
|
||
background: rgba(255,141,96,0.1);
|
||
border-radius: 10rpx;
|
||
// opacity: 0.1;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #C56742;
|
||
margin-top: 15rpx;
|
||
}
|
||
.popTowHeadImg{
|
||
width: 300rpx;
|
||
height: 300rpx;
|
||
background: #FCA30D;
|
||
border-radius: 30rpx;
|
||
margin-top: 23rpx;
|
||
}
|
||
.text1{
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
color: #000000;
|
||
}
|
||
.status{
|
||
width: 80rpx;
|
||
height: 36rpx;
|
||
line-height: 36rpx;
|
||
background: #FF8D60;
|
||
border-radius: 10rpx;
|
||
font-weight: 500;
|
||
font-size: 20rpx;
|
||
color: #FFFFFF;
|
||
margin-left: 9rpx;
|
||
text-align: center;
|
||
}
|
||
}
|
||
}
|
||
</style> |