1008 lines
25 KiB
Vue
1008 lines
25 KiB
Vue
<template>
|
||
<view class="dealer-index">
|
||
<view class="page-bg"></view>
|
||
<view class="header" :style="'margin-top: ' + statusBarHeight + 'px'"></view>
|
||
<view class="main-header">
|
||
<image class="bg-image" :src="bgImage" mode="scaleToFill"></image>
|
||
<!-- 用户信息 -->
|
||
<view class="user-info" @click="onLogin">
|
||
<u-avatar :src="userInfo.avatar" :size="64" mode="aspectFill"></u-avatar>
|
||
<view class="user-content">
|
||
<view class="nick-name">
|
||
<text>{{ userInfo.nickname }}</text>
|
||
<image src="../../static/icon/sex_man.png" mode="widthFix"></image>
|
||
</view>
|
||
<view class="user-id" v-if="userIdPrefix && userInfo.userId">
|
||
ID：{{ userIdPrefix }}{{ userInfo.userId }}</view>
|
||
<view class="roles-box">
|
||
<view class="login-tips">
|
||
<u-tag :text="userInfo.gradeName" plain size="mini" type="warning"></u-tag>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="switch" @click="$navTo('pages/user/user')">
|
||
<!-- <image src="@/static/icon/danshen.png" mode="widthFix"></image> -->
|
||
<image src="@/static/icon/switch2.png" mode="widthFix"></image>
|
||
<view class="switch-text">返回脱单</view>
|
||
</view>
|
||
<!-- <view class="setting">
|
||
<image src="../../static/icon/setting.png"></image>
|
||
</view> -->
|
||
</view>
|
||
|
||
<view class="main">
|
||
<!-- 开通会员 -->
|
||
<view class="buy-user" v-if="storeVn < 18">
|
||
<view class="desc">开通线上门店 自动解锁更多权益</view>
|
||
<view class="asset-left flex-box dis-flex flex-x-around">
|
||
<view class="asset-left-item">
|
||
<view class="item-name dis-flex flex-x-center">
|
||
<image class="buy-user-icon" src="../../static/icon/buy-user-08.png" mode="widthFix">
|
||
</image>
|
||
<text>线上脱单权益</text>
|
||
</view>
|
||
<view class="item-name dis-flex flex-x-center">
|
||
<image class="buy-user-icon" src="../../static/icon/buy-user-09.png" mode="widthFix">
|
||
</image>
|
||
<text>提升课程</text>
|
||
</view>
|
||
<view class="item-name dis-flex flex-x-center">
|
||
<image class="buy-user-icon" src="../../static/icon/buy-user-10.png" mode="widthFix">
|
||
</image>
|
||
<text>推广权益</text>
|
||
</view>
|
||
<view class="item-name dis-flex flex-x-center">
|
||
<image class="buy-user-icon" src="../../static/icon/buy-user-11.png" mode="widthFix">
|
||
</image>
|
||
<text>终身受益</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="open-member">
|
||
<u-button text="立即开通" size="small" color="linear-gradient(to bottom, #010002, #681752)"
|
||
@click="$push('sub_pages/dealer/grade/grade?id=' + 19)"></u-button>
|
||
</view>
|
||
</view>
|
||
<view v-else class="stroe-user">
|
||
<view class="item" @click="$push('sub_pages/profit/profit')">
|
||
<view class="profit">
|
||
<u-count-to :startVal="0" decimals="2" color="#ff0000"
|
||
:endVal="merchant.totalMoney"></u-count-to>
|
||
</view>
|
||
<view class="desc">总收益</view>
|
||
<!-- <u-tag text="收益明细" plain size="mini" type="info"></u-tag> -->
|
||
</view>
|
||
<view class="item">
|
||
<u-button text="立即升级" size="small" :disabled="!(storeVn < 26)"
|
||
color="linear-gradient(to bottom, #010002, #681752)"
|
||
@click="navToProfit(userInfo.gradeId)"></u-button>
|
||
</view>
|
||
</view>
|
||
<!-- 我的收益 -->
|
||
<view class="my-profit">
|
||
<view class="item" @click="navToProfit(userInfo.gradeId)">
|
||
<view class="profit">
|
||
<u-count-to :startVal="0" decimals="2" color="#ffffff"
|
||
:endVal="storeVn < 18 ? 0 : merchant.todayMoney"></u-count-to>
|
||
</view>
|
||
<view class="desc">今日收益</view>
|
||
</view>
|
||
<view class="item" @click="navToProfit(userInfo.gradeId)">
|
||
<view class="profit">
|
||
<u-count-to :startVal="0" decimals="2" color="#ffffff"
|
||
:endVal="storeVn < 18 ? 0 : merchant.monthMoney"></u-count-to>
|
||
</view>
|
||
<view class="desc">本月收益</view>
|
||
</view>
|
||
<view class="item" @click="navToProfit(userInfo.gradeId)">
|
||
<view class="profit">
|
||
<u-count-to :startVal="0" decimals="2" color="#ffffff" :endVal="storeVn < 18 ? 0 : merchant.money"></u-count-to>
|
||
</view>
|
||
<view class="desc">待提现</view>
|
||
</view>
|
||
</view>
|
||
<!-- 模块列表 -->
|
||
<view class="service" v-if="service.length > 0">
|
||
<block v-for="(item,index) in service" :key="index">
|
||
<view class="item" @click="navTo(item)">
|
||
<image :src="item.icon" mode="heightFix"></image>
|
||
<text>{{ item.name }}</text>
|
||
</view>
|
||
</block>
|
||
<view class="item" @click="onPoster(userInfo.gradeId)">
|
||
<image src="../../static/icon/buy-user-21.png" mode="heightFix"></image>
|
||
<text>邀请好友</text>
|
||
</view>
|
||
<view class="item" @click="onShowContact()">
|
||
<image src="../../static/icon/buy-user-22.png" mode="heightFix"></image>
|
||
<text>联系客服</text>
|
||
</view>
|
||
<!-- <view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-12.png" mode="heightFix"></image>
|
||
<text>单身团</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-13.png" mode="heightFix"></image>
|
||
<text>线上门店</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-14.png" mode="heightFix"></image>
|
||
<text>门店合伙人</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-15.png" mode="heightFix"></image>
|
||
<text>门店运营总监</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-17.png" mode="heightFix"></image>
|
||
<text>实体店</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-16.png" mode="heightFix"></image>
|
||
<text>旗舰店</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-18.png" mode="heightFix"></image>
|
||
<text>区县运营中心</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-19.png" mode="heightFix"></image>
|
||
<text>市级运营中心</text>
|
||
</view>
|
||
<view class="item" @click="$push('sub_pages/dealer/grade/grade')">
|
||
<image src="../../static/icon/buy-user-20.png" mode="heightFix"></image>
|
||
<text>省级运营中心</text>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<u-popup :show="showQrcode" mode="center" :round="10" @close="showQrcode = false">
|
||
<view class="qrcode-box">
|
||
<view class="poster">
|
||
<image src="https://file.wsdns.cn/20230619/5a6dac23dd16484eaad2ece5317e8563.jpg" mode="widthFix">
|
||
</image>
|
||
<view class="user">
|
||
<view class="avatar">
|
||
<u-avatar size="60" :src="userInfo.avatar"
|
||
customStyle="margin: -3px 5px -3px 0"></u-avatar>
|
||
<view class="user-info">
|
||
<text class="nickname">{{ userInfo.nickname }}</text>
|
||
<text class="phone">{{ userInfo.mobile }}</text>
|
||
</view>
|
||
</view>
|
||
<image class="qrcode-img" v-if="QrcodeUrl" :src="QrcodeUrl" mode="widthFix">
|
||
</image>
|
||
</view>
|
||
<view class="long-press">长按识别二维码</view>
|
||
</view>
|
||
<view class="gap">立即分享</view>
|
||
<view class="share">
|
||
<view class="btn">
|
||
<image src="../../static/icon/share01.png" mode="widthFix"></image>
|
||
朋友圈
|
||
</view>
|
||
<view class="btn">
|
||
<image src="../../static/icon/share02.png" mode="widthFix"></image>
|
||
微信
|
||
</view>
|
||
<view class="btn">
|
||
<image src="../../static/icon/share03.png" mode="widthFix"></image>
|
||
保存
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<u-popup :show="showContact" mode="center" :round="10" :closeable="true" @close="showContact = false">
|
||
<view class="matchamker">
|
||
<view class="btn-contant">
|
||
<u-button text="马上联系" color="linear-gradient(to bottom, #010002, #681752)" :disabled="disabled"
|
||
shape="circle" @click="contact('0771-3128860')"></u-button>
|
||
</view>
|
||
<!-- <view class="btn-contant">
|
||
<image class="qrcode-img" src="https://file.wsdns.cn/20230619/c69d45bc13344e5d827ba4b4ed9a0c31.png"
|
||
mode="widthFix">
|
||
</image>
|
||
<text class="matchamker-name">客服微信</text>
|
||
</view> -->
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import * as UserPlanEquityApi from '@/api/love-user-plan-equity.js'
|
||
import * as MerchantApi from '@/api/merchant.js'
|
||
import * as WxLoginApi from '@/api/wx-login.js'
|
||
import store from '@/store/index.js'
|
||
import storage from '@/utils/storage'
|
||
import {
|
||
getUser
|
||
} from '@/api/user.js'
|
||
import {
|
||
login
|
||
} from '@/api/login.js'
|
||
import {
|
||
username,
|
||
userIdPrefix
|
||
} from '@/config.js';
|
||
import http from '@/api'
|
||
|
||
/**
|
||
* 我的服务
|
||
* id: 标识; name: 标题名称; icon: 图标; type 类型(link和button); url: 跳转的链接
|
||
*/
|
||
const service = [{
|
||
id: 0,
|
||
name: '单身团',
|
||
icon: '../../static/icon/buy-user-12.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/offline/offline'
|
||
}, {
|
||
id: 19,
|
||
name: '线上门店',
|
||
icon: '../../static/icon/buy-user-13.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 20,
|
||
name: '门店合伙人',
|
||
icon: '../../static/icon/buy-user-14.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 21,
|
||
name: '门店运营总监',
|
||
icon: '../../static/icon/buy-user-15.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 22,
|
||
name: '实体店',
|
||
icon: '../../static/icon/buy-user-17.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 23,
|
||
name: '旗舰店',
|
||
icon: '../../static/icon/buy-user-16.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 24,
|
||
name: '区县运营中心',
|
||
icon: '../../static/icon/buy-user-18.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 25,
|
||
name: '市级运营中心',
|
||
icon: '../../static/icon/buy-user-19.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}, {
|
||
id: 26,
|
||
name: '省级运营中心',
|
||
icon: '../../static/icon/buy-user-20.png',
|
||
type: 'link',
|
||
show: true,
|
||
url: 'sub_pages/dealer/grade/grade'
|
||
}]
|
||
|
||
const userId = storage.get('userId')
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
userIdPrefix,
|
||
storeVn: 0,
|
||
bgImage: 'data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%221%22%20x1%3D%220%22%20x2%3D%221%22%20y1%3D%220%22%20y2%3D%220%22%20gradientTransform%3D%22matrix(6.123233995736766e-17%2C%201%2C%20-0.36308349769888226%2C%206.123233995736766e-17%2C%200.5%2C%200)%22%3E%3Cstop%20stop-color%3D%22%23101010%22%20stop-opacity%3D%221%22%20offset%3D%220.24%22%3E%3C%2Fstop%3E%3Cstop%20stop-color%3D%22%23160028%22%20stop-opacity%3D%221%22%20offset%3D%221%22%3E%3C%2Fstop%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22url(%231)%22%3E%3C%2Frect%3E%3C%2Fsvg%3E',
|
||
// 首次加载
|
||
statusBarHeight: 25,
|
||
// 是否已登录
|
||
isLogin: false,
|
||
showQrcode: false,
|
||
showContact: false,
|
||
// 系统设置
|
||
setting: {},
|
||
service,
|
||
// 当前用户信息
|
||
userInfo: {
|
||
nickname: '未登录',
|
||
userId: ''
|
||
},
|
||
form: {
|
||
userId
|
||
},
|
||
roleId: 0,
|
||
roleName: '注册用户',
|
||
// 已购买的套餐ID
|
||
buyIds: [],
|
||
merchant: {
|
||
// 总收益
|
||
totalMoney: 0.00,
|
||
// 当前可提现金额
|
||
money: 0.00,
|
||
// 今日收益
|
||
todayMoney: 0.00,
|
||
// 本月收益
|
||
monthMoney: 0.00
|
||
},
|
||
QrcodeUrl: ''
|
||
}
|
||
},
|
||
onLoad() {
|
||
this.getUserInfo()
|
||
this.getUserEquity()
|
||
this.getMerchant()
|
||
this.getQrCode()
|
||
// 设置navbar标题、颜色
|
||
uni.setNavigationBarColor({
|
||
frontColor: '#ffffff',
|
||
backgroundColor: '#101010'
|
||
})
|
||
},
|
||
onShow() {},
|
||
onPullDownRefresh() {
|
||
this.getUserInfo()
|
||
this.getUserEquity()
|
||
this.getMerchant()
|
||
uni.stopPullDownRefresh();
|
||
},
|
||
methods: {
|
||
navTo(item) {
|
||
if (item.show) {
|
||
this.$navTo(item.url + '?id=' + item.id)
|
||
} else {
|
||
this.$navTo('sub_pages/dealer/merchant/merchant?id=' + item.id)
|
||
}
|
||
},
|
||
|
||
getUserEquity() {
|
||
const app = this
|
||
const {
|
||
form
|
||
} = this
|
||
UserPlanEquityApi.listUserPlanEquity({
|
||
userId
|
||
}).then(result => {
|
||
console.log("result: ", result);
|
||
const list = result.data
|
||
// app.roleName = storage.get('roleName')
|
||
if (list.length > 0) {
|
||
const maxEquity = list[0]
|
||
console.log("maxEquity: ", maxEquity);
|
||
if (maxEquity.planId > 18) {
|
||
// app.roleName = maxEquity.planName
|
||
app.storeVn = maxEquity.planId
|
||
storage.set('storeName', maxEquity.planName)
|
||
storage.set('storeVn', maxEquity.planId)
|
||
}
|
||
}
|
||
list.map(d => {
|
||
app.buyIds.push(d.planId)
|
||
})
|
||
console.log("app.buyIds: ", app.buyIds);
|
||
// 隐藏已购买的套餐
|
||
app.service.map((d, i) => {
|
||
if (app.buyIds.indexOf(d.id) > -1) {
|
||
app.service[i].show = false
|
||
}
|
||
})
|
||
})
|
||
},
|
||
|
||
getUserInfo() {
|
||
const {
|
||
form
|
||
} = this
|
||
const app = this
|
||
uni.getSystemInfo({
|
||
success(data) {
|
||
if (data) {
|
||
app.statusBarHeight = data.statusBarHeight
|
||
}
|
||
}
|
||
})
|
||
getUser().then(res => {
|
||
if (res.code == 0 && res.data.username != 'www') {
|
||
app.form = res.data
|
||
app.userInfo = res.data
|
||
app.isLogin = true
|
||
} else {
|
||
app.isLogin = false
|
||
app.handleLogout()
|
||
}
|
||
})
|
||
|
||
},
|
||
getMerchant() {
|
||
const app = this
|
||
MerchantApi.listMerchant({
|
||
userId
|
||
}).then(res => {
|
||
console.log("res: ", res);
|
||
if (res.data.length > 0) {
|
||
app.merchant = res.data[0]
|
||
}
|
||
})
|
||
},
|
||
onLogin() {
|
||
const app = this
|
||
// 未登录状态
|
||
if (!app.isLogin) {
|
||
return this.$navTo('pages/login/index')
|
||
}
|
||
// 跳转登录页面
|
||
this.$navTo('pages/user/personal/index')
|
||
},
|
||
contact(phone) {
|
||
uni.makePhoneCall({
|
||
phoneNumber: phone
|
||
})
|
||
},
|
||
// 打开邀请码弹窗
|
||
onShowQrcode() {
|
||
const app = this
|
||
if (app.storeVn < 19) {
|
||
app.$error('未开通线上门店')
|
||
return false
|
||
}
|
||
app.getQrCode()
|
||
app.showQrcode = true
|
||
},
|
||
// 获取微信小程序码
|
||
getQrCode() {
|
||
const app = this
|
||
const QrcodeUrl = storage.get('QrcodeUrl')
|
||
if (QrcodeUrl) {
|
||
app.QrcodeUrl = QrcodeUrl
|
||
return false;
|
||
}
|
||
WxLoginApi.getWxQrCode().then(res => {
|
||
app.QrcodeUrl = QrcodeUrl
|
||
storage.set('QrcodeUrl', res.message)
|
||
}).catch(err => {
|
||
app.$error(err.message)
|
||
})
|
||
},
|
||
// 打开客服二维码
|
||
onShowContact() {
|
||
this.showContact = true
|
||
},
|
||
handleLogout() {
|
||
uni.redirectTo({
|
||
url: '/pages/login/index'
|
||
})
|
||
},
|
||
|
||
navToProfit(gradeId){
|
||
if(gradeId < 7){
|
||
return false
|
||
}
|
||
this.$push('sub_pages/profit/profit')
|
||
console.log("gradeId: ",gradeId);
|
||
},
|
||
onPoster(gradeId){
|
||
if(gradeId < 7){
|
||
return false
|
||
}
|
||
this.$push('sub_pages/dealer/poster/poster')
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
|
||
<style lang="scss" scoped>
|
||
.dealer-index {
|
||
background-color: #f3f3f3;
|
||
height: 100vh;
|
||
}
|
||
|
||
.page-bg {
|
||
width: 750rpx;
|
||
height: calc(100rpx + var(--status-bar-height));
|
||
display: block;
|
||
background-color: #101010;
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
z-index: -100;
|
||
}
|
||
|
||
// 页面头部
|
||
.main-header {
|
||
// background-color: #FBF7EF;
|
||
position: fixed;
|
||
top: 0;
|
||
width: 100%;
|
||
height: 420rpx;
|
||
background-size: 100% 100%;
|
||
overflow: hidden;
|
||
display: flex;
|
||
align-items: center;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.bg-image {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 0;
|
||
}
|
||
|
||
.user-info {
|
||
display: flex;
|
||
height: 120rpx;
|
||
padding-left: 30rpx;
|
||
z-index: 1;
|
||
|
||
.user-content {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
margin-left: 30rpx;
|
||
color: #ffffff;
|
||
|
||
.nick-name {
|
||
font-size: 30rpx;
|
||
font-weight: bold;
|
||
max-width: 270rpx;
|
||
display: flex;
|
||
flex-direction: row;
|
||
|
||
image {
|
||
margin-left: 10rpx;
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
}
|
||
}
|
||
|
||
.user-id {
|
||
font-weight: 300;
|
||
color: #efefef;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
.mobile {
|
||
margin-top: 15rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.user-grade {
|
||
align-self: baseline;
|
||
display: flex;
|
||
align-items: center;
|
||
background: #3c3c3c;
|
||
margin-top: 12rpx;
|
||
border-radius: 10rpx;
|
||
padding: 4rpx 12rpx;
|
||
|
||
.user-grade_icon .image {
|
||
display: block;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
|
||
.user-grade_name {
|
||
margin-left: 5rpx;
|
||
font-size: 26rpx;
|
||
color: #EEE0C3;
|
||
}
|
||
|
||
}
|
||
|
||
.roles-box {
|
||
display: flex;
|
||
|
||
.login-tips {
|
||
margin-top: 12rpx;
|
||
margin-right: 6rpx;
|
||
font-size: 30rpx;
|
||
display: flex;
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
}
|
||
|
||
.switch {
|
||
display: flex;
|
||
color: #ffffff;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
padding: 50rpx 50rpx 0 0;
|
||
// font-size: 24rpx;
|
||
z-index: 999;
|
||
|
||
image {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
}
|
||
|
||
.switch-text {
|
||
z-index: 9999;
|
||
// color: #eb9e4c;
|
||
// color: #681752;
|
||
color: #eb9e4c;
|
||
}
|
||
}
|
||
|
||
.setting {
|
||
color: #cecece;
|
||
position: absolute;
|
||
right: 2vh;
|
||
top: 1vh;
|
||
|
||
image {
|
||
width: 45rpx;
|
||
height: 45rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.main {
|
||
position: fixed;
|
||
top: 280rpx;
|
||
left: 25rpx;
|
||
z-index: 999;
|
||
|
||
// 开通会员
|
||
.buy-user {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin: 22rpx auto 22rpx auto;
|
||
padding: 22rpx 0;
|
||
width: 700rpx;
|
||
box-shadow: 0 1rpx 5rpx 0px #eaebec;
|
||
border-radius: 24rpx;
|
||
background: #fff;
|
||
position: relative;
|
||
|
||
.desc {
|
||
padding-top: 5rpx;
|
||
padding-left: 32rpx;
|
||
font-size: 28rpx;
|
||
color: #545454;
|
||
}
|
||
|
||
.asset-right {
|
||
width: 170rpx;
|
||
border-left: 1rpx solid #eee;
|
||
}
|
||
|
||
.asset-right-item {
|
||
text-align: center;
|
||
color: #545454;
|
||
|
||
.item-icon {
|
||
font-size: 44rpx;
|
||
}
|
||
|
||
.item-name {
|
||
margin-top: 14rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
.asset-left-item {
|
||
width: 700rpx;
|
||
text-align: center;
|
||
padding-left: 28rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.item-value {
|
||
font-size: 34rpx;
|
||
// color: #febd45;
|
||
}
|
||
|
||
.item-name {
|
||
color: #545454;
|
||
margin-top: 14rpx;
|
||
font-size: 24rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
flex-direction: column;
|
||
margin: 30rpx 25rpx 20rpx 0;
|
||
}
|
||
|
||
.buy-user-icon {
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
}
|
||
|
||
.open-member {
|
||
position: absolute;
|
||
right: 20rpx;
|
||
top: 20rpx;
|
||
}
|
||
}
|
||
|
||
.stroe-user {
|
||
// background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%221%22%20x1%3D%220%22%20x2%3D%221%22%20y1%3D%220%22%20y2%3D%220%22%20gradientTransform%3D%22matrix(6.123233995736766e-17%2C%201%2C%20-0.024693877551020406%2C%206.123233995736766e-17%2C%200.5%2C%200)%22%3E%3Cstop%20stop-color%3D%22%230a060d%22%20stop-opacity%3D%221%22%20offset%3D%220%22%3E%3C%2Fstop%3E%3Cstop%20stop-color%3D%22%23660061%22%20stop-opacity%3D%221%22%20offset%3D%220.95%22%3E%3C%2Fstop%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22url(%231)%22%3E%3C%2Frect%3E%3C%2Fsvg%3E');
|
||
background-color: #ffffff;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
color: #e99d42;
|
||
margin: 42rpx auto 42rpx auto;
|
||
padding: 22rpx 0rpx;
|
||
width: 700rpx;
|
||
height: 140rpx;
|
||
box-shadow: 0 1rpx 5rpx 0px #eaebec;
|
||
border-radius: 24rpx;
|
||
|
||
.item {
|
||
padding: 0 50rpx;
|
||
text-align: center;
|
||
|
||
.profit {
|
||
font-size: 40rpx;
|
||
font-weight: 500;
|
||
color: #e99d42;
|
||
}
|
||
|
||
.desc {
|
||
font-size: 24rpx;
|
||
color: #666666;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 功能列表
|
||
.service {
|
||
margin: 24rpx auto 24rpx auto;
|
||
padding: 30rpx 0;
|
||
width: 700rpx;
|
||
box-shadow: 0 1rpx 5rpx 0px #eaebec;
|
||
border-radius: 24rpx;
|
||
background: #fff;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
width: 165rpx;
|
||
padding-left: 8rpx;
|
||
margin: 25rpx 0;
|
||
font-size: 26rpx;
|
||
color: #545454;
|
||
|
||
image {
|
||
height: 50rpx;
|
||
width: 50rpx;
|
||
}
|
||
|
||
text {
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
// 退出登录
|
||
.my-logout {
|
||
display: flex;
|
||
justify-content: center;
|
||
margin-top: 50rpx;
|
||
|
||
.logout-btn {
|
||
width: 400rpx;
|
||
margin: 0 auto;
|
||
font-size: 28rpx;
|
||
color: #616161;
|
||
border-radius: 20rpx;
|
||
border: 1px solid #dcdcdc;
|
||
padding: 16rpx 0;
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
|
||
.flex-box {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.more {
|
||
padding-right: 20rpx;
|
||
font-size: 26rpx;
|
||
color: #999999;
|
||
}
|
||
}
|
||
|
||
.footer {
|
||
.btn-wrapper {
|
||
width: 360rpx;
|
||
margin: 50rpx auto;
|
||
// display: flex;
|
||
// align-items: center;
|
||
padding: 0 20rpx;
|
||
}
|
||
|
||
.xieyi {
|
||
font-size: 26rpx;
|
||
text-align: center;
|
||
color: #999999;
|
||
|
||
text {
|
||
color: #7f006f;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
// 我的收益
|
||
.my-profit {
|
||
background: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%221%22%20x1%3D%220%22%20x2%3D%221%22%20y1%3D%220%22%20y2%3D%220%22%20gradientTransform%3D%22matrix(6.123233995736766e-17%2C%201%2C%20-0.024693877551020406%2C%206.123233995736766e-17%2C%200.5%2C%200)%22%3E%3Cstop%20stop-color%3D%22%230a060d%22%20stop-opacity%3D%221%22%20offset%3D%220%22%3E%3C%2Fstop%3E%3Cstop%20stop-color%3D%22%23660061%22%20stop-opacity%3D%221%22%20offset%3D%220.95%22%3E%3C%2Fstop%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20fill%3D%22url(%231)%22%3E%3C%2Frect%3E%3C%2Fsvg%3E');
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
color: #ffffff;
|
||
margin: 42rpx auto 42rpx auto;
|
||
padding: 22rpx 0;
|
||
width: 700rpx;
|
||
height: 140rpx;
|
||
box-shadow: 0 1rpx 5rpx 0px #eaebec;
|
||
border-radius: 24rpx;
|
||
|
||
.item {
|
||
text-align: center;
|
||
|
||
.profit {
|
||
font-size: 38rpx;
|
||
font-weight: 500;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.desc {
|
||
font-size: 24rpx;
|
||
color: #d8d9dc;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
// 联系客服
|
||
.matchamker {
|
||
background: url('https://oss.jimeigroup.cn/static/my-hunjie-bg2.png');
|
||
background-size: 100% auto;
|
||
background-repeat: no-repeat;
|
||
border-radius: 20rpx;
|
||
position: relative;
|
||
display: flex;
|
||
justify-content: center;
|
||
width: 450rpx;
|
||
height: 500rpx;
|
||
padding: 30rpx;
|
||
|
||
.btn-contant {
|
||
position: absolute;
|
||
width: 360rpx;
|
||
margin: 50rpx auto;
|
||
bottom: 0;
|
||
padding: 0 20rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
|
||
.qrcode-img {
|
||
margin: auto;
|
||
width: 250rpx;
|
||
}
|
||
|
||
.matchamker-name {
|
||
text-align: center;
|
||
color: #999999;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 二维码
|
||
.qrcode-box {
|
||
border-radius: 20rpx;
|
||
position: relative;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
width: 660rpx;
|
||
height: 1000rpx;
|
||
|
||
.poster {
|
||
width: 580rpx;
|
||
height: 750rpx;
|
||
margin: 40rpx auto;
|
||
box-shadow: 0px 0px 10px #cccccc;
|
||
border-radius: 20rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
image {
|
||
width: 580rpx;
|
||
border-radius: 20rpx 20rpx 0 0;
|
||
}
|
||
|
||
.user {
|
||
padding: 20rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.avatar {
|
||
display: flex;
|
||
align-items: center;
|
||
height: 200rpx;
|
||
|
||
.user-info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
font-size: 26rpx;
|
||
|
||
.phone {
|
||
color: #999999;
|
||
}
|
||
}
|
||
}
|
||
|
||
.qrcode-img {
|
||
width: 140rpx;
|
||
}
|
||
}
|
||
|
||
.long-press {
|
||
color: #999999;
|
||
font-size: 26rpx;
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
.gap {
|
||
font-size: 28rpx;
|
||
margin: auto;
|
||
color: #999999;
|
||
}
|
||
|
||
.share {
|
||
width: 480rpx;
|
||
margin: auto;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
font-size: 26rpx;
|
||
|
||
.btn {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 24rpx;
|
||
color: #666666;
|
||
|
||
image {
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
</style> |