mall_client/zyhs3_uniapp/pages/home/zhongYiWanShangMy.vue

1365 lines
31 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
<u-navbar @leftClick="handlerRight" title="我的资产" :titleStyle="{ color: '#000' }" :border="false"
:placeholder="true" leftIconColor="#000"></u-navbar>
<!-- 顶部卡片START -->
<view class="top-top flex-between">
<view class="top-top-left flex">
<view class="title">
尊敬的
</view>
<view class="name">
{{nickname}}
</view>
<view class="real-box" v-if="authenticationShow != 1" @click="goAuthentication('/pages/user/authentication/authentication')">
<view class="img-1">
<image
src="@/static/newBinLang/wode/SketchPngaaafd3e35248fe3788122ce6bef0f7dd5cd2c0e55cc4f89214ada25eb3b7e591.png" />
</view>
<view class="t">
未实名
</view>
<view class="img-2">
<image
src="@/static/newBinLang/wode/SketchPng5a64799ecd89b4cc1d9260ffc7d00224a524dd6dbab17334b0c8435dbac3cde5.png" />
</view>
</view>
</view>
</view>
<!-- 资产概览(从 myAsset.vue 迁移) -->
<view class="top-box">
<view class="top-row">
<view class="row1-col">
<view class="title">
消费额
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_10}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="grp">
</view>
<view class="row1-col">
<view class="title">
消费券
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_9}}
</view>
<view class="unit">
</view>
</view>
</view>
<!-- <view class="grp">
</view>
<view class="row1-col">
<view class="title">
消费金
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_16}}
</view>
<view class="unit">
</view>
</view>
</view> -->
</view>
<!-- 第二行 -->
<view class="top-row row-next">
<view class="row1-col">
<view class="title">
消费金
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_16}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col">
<view class="title">
槟果
</view>
<view class="price-group">
<view class="price">
{{dataInfo.myInteger}}
</view>
<view class="unit">
</view>
</view>
</view>
</view>
<!-- 第二行 -->
<view class="top-row row-next">
<view class="row1-col">
<view class="title">
冻结资产
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_14}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col">
<view class="title">
补贴
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_12}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col" v-if="assetMap.asset_8!=-1">
<view class="title">
分红额
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_8}}
</view>
<view class="unit">
</view>
</view>
</view>
</view>
<view class="top-row row-next">
<view class="row1-col">
<view class="title">
我的槟榔
</view>
<view class="price-group">
<view class="price">
{{assetInfo.assetTree}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col">
<view class="title">
获赠棵数
</view>
<view class="price-group">
<view class="price">
{{assetInfo.giveAssetTree}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col">
<view class="title">
槟榔收益
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_13}}
</view>
<view class="unit">
</view>
</view>
</view>
</view>
<!-- <view class="asset-card">
<view class="hazelnut-card">
<view class="bl-title">
<view class="card-title">槟榔资产</view>
</view>
<view class="middle-section">
<view class="bl-item">
<view class="name">
我的槟榔:
</view>
<view class="count_box" v-if="pageload">
<view class="count">
{{assetInfo.assetTree}}
</view>
<view class="unit">
</view>
</view>
<view class="" v-else>正在获取中...</view>
</view>
<view class="bl-item">
<view class="name">
获赠棵数:
</view>
<view class="count_box" v-if="pageload">
<view class="count">
{{assetInfo.giveAssetTree}}
</view>
<view class="unit">
</view>
</view>
<view class="" v-else>正在获取中...</view>
</view>
<view class="bl-item">
<view class="name">
槟榔收益:
</view>
<view class="count_box" v-if="pageload">
<view class="count">
{{assetMap.asset_13}}
</view>
<view class="unit">
</view>
</view>
<view class="" v-else>正在获取中...</view>
</view>
</view>
</view>
<view class="gap"></view>
<view class="hazelnut-card">
<view class="bg-title">
<view class="card-title">我的槟果</view>
<view class="count_box">
<view class="count">
{{dataInfo.myInteger}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="middle-section">
<view class="asset-info">
<view class="info-item">槟果价格:</view>
<view class="value" v-if="pageload">
¥ {{dataInfo.integerWorth}}
</view>
<view v-else>正在获取中...</view>
</view>
<view class="asset-info">
<view class="info-item">可兑总价:</view>
<view class="value" v-if="pageload">
¥ {{dataInfo.totalWorth}}
</view>
<view v-else>正在获取中...</view>
</view>
<u-button
type="warning"
shape="circle"
size="normal"
:custom-style="{ background: '#ff9e44', border: 'none', fontSize: '24rpx',margin: '15rpx 0 0',width: '40%' }"
@click="onPointsExchange"
>
闪兑
</u-button>
</view>
</view>
</view> -->
</view>
<!-- <view class="binglang-row row-next">
<view class="row1-col">
<view class="title">
我的槟榔
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_14}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col">
<view class="title">
获赠棵数
</view>
<view class="price-group">
<view class="price">
{{dataInfo.myInteger}}
</view>
<view class="unit">
</view>
</view>
</view>
<view class="row1-col">
<view class="title">
槟榔收益
</view>
<view class="price-group">
<view class="price">
{{assetMap.asset_14}}
</view>
<view class="unit">
</view>
</view>
</view>
</view> -->
<!-- 中间的银行卡,提现申请(从 myAsset.vue 迁移) -->
<view class="zhong-box">
<view class="item" v-for="(item,i) in navList" :key="i" @click="goto(item.path)">
<view class="item-group">
<image :src="item.icon" mode=""></image>
<view>
{{item.name}}
</view>
</view>
</view>
</view>
<view class="handle-box">
<view class="handle-detail">
<view class="handle-item" @click="goto(item.path)" v-for="(item,index) in otherList" :key="index">
<view class="item-box">
<view class="item-icon">
<image :src="item.icon" mode=""></image>
</view>
<view class="handle-name">
{{ item.name }}
</view>
</view>
<view class="item-right">
<image class="right" src="@/static/back.png" />
</view>
</view>
</view>
</view>
<!-- 顶部卡片END -->
<view class="container">
<!-- 按钮组START -->
<view class="btn_group">
<view class="title">其他服务</view>
<u-gap height="10"></u-gap>
<view class="content">
<view class="item" v-for="(v, i) in icons" :key="i" @click="handleBuilding(v.link)">
<view class="icon">
<image :src="v.icon" mode="heightFix" />
</view>
<view class="name">{{ v.name }}</view>
</view>
</view>
</view>
<!-- 按钮组END -->
</view>
<!-- 代理等级 -->
<u-popup :show="dldjShow" mode="center" round="10">
<view class="dldj-box">
<view class="dldj-title">{{ dlInfo.status == 0?'代理等级申请中':dlInfo.status == 1? '代理等级申请被驳回':'申请代理等级' }}
</view>
<view class="dldj-input" @click="dlPickerShow = true">
<text>
{{dlLevel != null ? agency_level.find(i => i.dictValue == dlLevel).dictLabel || '请选择':'请选择' }}
</text>
<u-icon name="arrow-right" size="12"></u-icon>
</view>
<view class="dldj-btns">
<u-button size="mini" :text="dlInfo.status == 0? '修改申请':'申请' " type="success"
@click="applyBlAgency"></u-button>
<u-button size="mini" text="关闭" type="info" @click="closeDldj"></u-button>
</view>
</view>
</u-popup>
<u-picker v-if="agency_level.length" :show="dlPickerShow" :columns="[agency_level.slice(1)]" keyName="dictLabel"
@confirm="dlConfirm" @cancel="dlPickerShow = false"></u-picker>
<!-- 兑付资产、补贴转余额、消费金转余额输入框 -->
<uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog mode="input" v-model="moneyToBalance" :title="dialogTitle" placeholder="请输入兑换资产数量" @confirm="dialogInputConfirm">
</uni-popup-dialog>
</uni-popup>
<!-- 输入框示例(绑定银行卡与提现) -->
<uni-popup ref="inputDialogRef" type="dialog">
<uni-popup-dialog mode="input" :title="dialogTitle" placeholder="请输入兑换资产数量" @confirm="dialogInputConfirm">
<view style="width:100%;display: flex;text-align: center;align-items: center;flex-direction: column;">
<uni-easyinput disabled style="margin-top: 20rpx;" trim="all" @click="showBank=true"
v-model="cashInfo.bankName" placeholder="请选择开户行"></uni-easyinput>
<uni-easyinput style="margin-top: 10rpx;" trim="all" v-model="cashInfo.changeMoney"
placeholder="请输入金额"></uni-easyinput>
</view>
</uni-popup-dialog>
</uni-popup>
<u-action-sheet :show="showBank" :actions="bankList" title="请选择提现开户行" @close="showBank = false"
@select="handlerBank">
</u-action-sheet>
</view>
</template>
<script>
import storage from "@/utils/storage";
import {
getMyAsset,
authenticationApi,
integerInfo,
countIntegerPriceApi,
myAssetDetail,
balanceCaseApply,
caseTree2Balance,
caseWared2Balance,
fund2Balance
} from "@/api/system/api.js";
import {
getBankList
} from '@/api/system/user.js';
import {
mapMutations
} from "vuex";
import url from "../../common/http/url";
export default {
data() {
return {
icons: [
{
icon: require("@/static/newBinLang/wode/dakuan@2x.png"),
name: "打款",
link: "/pages/licai/mine/recharge/recharge?assetType=10",
},
{
icon: require("@/static/newBinLang/wode/goumaijilu@2x.png"),
name: "购买记录",
link: "/pages/home/myService/buyLog?quYv="+7,
},
{
icon: require("@/static/newBinLang/wode/fenhongshouyi@2x.png"),
name: "分红收益",
// link: "/pages/home/myService/recored?changeReason=分红收益",
link: "/pages/home/myService/recored?changeType=24",
}
],
authenticationShow: 2,
balance: 0,
pageload: false,
chuzhonggao: 0,
tuiguang: 0,
agencyLevel: 0,
statistics: {
ljNum: 0,
},
assetInfo: {},
teamInfo: {},
ljTeamInfo: {},
platformInfo: {
count: 0,
plants: 0,
},
assetMap: {
"asset_8": -1,
"asset_13": 0,
"asset_12": 0,
"asset_9": 0,
"asset_15": 0,
"asset_10": 0,
"asset_11": 0,
"asset_14": 0,
"asset_16": 0,
"asset_99": 0
},
navList: [{
name: "银行卡",
path: "/pages/licai/mine/account/bankList?use=2",
icon: require("@/static/newBinLang/asset/yinhangka@2x.png"),
bgColor: "rgb(16, 160, 244)",
},
{
name: "绑定银行卡",
path: "/pages/licai/mine/account/bindBank?use=2",
icon: require("@/static/newBinLang/asset/bangdingyinhangka@2x.png"),
bgColor: "rgb(16, 160, 244)",
},
{
name: "提现申请",
path: "cashBalance",
icon: require("@/static/newBinLang/asset/tixianshenqing@2x.png"),
bgColor: "rgb(11, 190, 60)",
},
{
name: "余额转账",
path: "/pages/licai/mine/account/change?asstype=10",
icon: require("@/static/newBinLang/asset/yuezhuanzhang@2x.png"),
bgColor: "rgb(11, 190, 60)",
},
],
otherList: [{
name: "资产变更记录",
path: "/pages/home/myService/recored",
icon: require("@/static/newBinLang/asset/zichanbiangeng@2x.png"),
bgColor: "rgb(11, 190, 160)",
},
{
name: "兑付资产转余额",
path: "tree2Balance",
icon: require("@/static/newBinLang/asset/duifuzichanzhuan@2x.png"),
bgColor: "rgb(11, 190, 60)",
}, {
name: "补贴转余额",
path: "caseWared2Balance",
icon: require("@/static/newBinLang/asset/jiangjinzichanzhuan@2x.png"),
bgColor: "rgb(11, 190, 60)",
},{
name: "消费券转账",
// path: "fund2Balance",
path: "/pages/licai/mine/account/change?asstype=9",
icon: require("@/static/newBinLang/asset/xfjzhuan@2x.png"),
bgColor: "rgb(11, 190, 60)",
}
],
showBank: false,
bankList: [],
cashInfo: {
bankName: '',
bankId: '',
changeMoney: ''
},
name: this.$store.state.user.name,
// version: getApp().globalData.config.appInfo.version,
userInfo: JSON.parse(uni.getStorageSync("App-UserInfo")),
abc_level: [],
agency_level: [],
dldjShow: false,
dlInfo: {},
dlLevel: null,
dlPickerShow: false,
dataInfo:{
integerWorth:0,
myInteger:0,
totalWorth:0
},
dialogTitle: "",
cashType: "",
integerInputValue: "",
authInfo: {},
moneyToBalance: '',
cashAwardInfo: {
handleType: 1,
changeMoney: ''
},
};
},
computed: {
avatar() {
return this.$store.state.user.avatar;
},
windowHeight() {
// return uni.getSystemInfoSync().windowHeight - 50;
},
integerExchangeWorth(){
const price = parseFloat(this.dataInfo && this.dataInfo.integerWorth || 0) || 0
const count = parseFloat(this.integerInputValue || 0) || 0
const total = price * count
return (Math.ceil(total * 100) / 100).toFixed(2)
}
},
created() {
let userInfo = uni.getStorageSync("userInfo") || {nickname:''};
this.nickname = userInfo.nickname
},
async onShow() {
await this.checkToken()
await this.authentication()
await this.getData() // 槟果资产
await this.getMyAssetApi() // 槟榔树资产
await this.getAssetList() // 资产列表
await this.getMyBindBank() // 获取我的绑定银行卡
this.pageload = true
},
onLoad() {
this.getMyBindBank()
},
methods: {
getData(){
integerInfo().then((res)=>{
this.dataInfo = res
let totalWorth = res.integerWorth * res.myInteger
this.dataInfo.totalWorth = (Math.ceil(totalWorth * 100) / 100).toFixed(2)
})
},
handlerRight() {
// uni.navigateTo({
// url: '/pages/user/index'
// })
uni.navigateBack({
delta: 1
});
},
...mapMutations(["logout"]),
//就是点击下边四个tab的时候调用一下这个接口返回false的话就调用一下退出登录给他退掉
checkToken() {
this.$http("GET", "/user/userCache").then((res) => {
if (!res.data) {
this.logout();
}
});
},
async getMyBindBank() {
let { rows } = await getBankList();
rows.forEach(x => { x.name = x.bankLabel + x.bankCardNumber });
this.bankList = rows
},
handlerBank(e) {
this.cashInfo.bankId = e.id;
this.cashInfo.bankName = e.name;
this.$refs.inputDialogRef.open()
},
async getMyAssetApi() {
let res = await getMyAsset();
this.assetInfo = res
},
async authentication() {
let res = await authenticationApi();
this.authInfo = res
this.authenticationShow = res.status
this.why = res.why
},
handleToInfo() {
// console.log("1")
this.$tab.navigateTo("/pages/licai/mine/info/index");
},
handleToEditInfo() {
console.log("1");
// this.$tab.navigateTo('/pages/licai/mine/info /edit')
},
handleToSetting() {
this.$tab.navigateTo("/pages/licai/mine/setting/index");
},
handleToLogin() {
console.log("1");
// this.$tab.reLaunch('/pages/licai/login')
},
handleToAvatar() {
this.$tab.navigateTo("/pages/licai/mine/avatar/index");
},
handleLogout() {
this.$modal.confirm("确定注销并退出系统吗?").then(() => {
this.$store.dispatch("LogOut").then(() => {
this.$tab.reLaunch("/pages/licai/index");
});
});
},
handleHelp() {
this.$tab.navigateTo("/pages/licai/mine/help/index");
},
handleAbout() {
this.$tab.navigateTo("/pages/licai/mine/about/index");
},
handleJiaoLiuQun() {
this.$modal.showToast("QQ群133713780");
},
handleBuilding(url) {
if (url == 'dldj') {
this.openDldj()
return
}
if (!url) return this.$msg("暂未开放");
this.$tab.navigateTo(url);
},
openDldj() {
getMyAgencyRecord().then(res => {
if (res.code == 200) {
if (res.data.status == 1) {
this.$msg("你已申请过代理等级");
return
}
this.dlInfo = res.data
this.dldjShow = true
this.dlLevel = res.data.newLevel
}
})
},
closeDldj() {
this.dldjShow = false
},
dlConfirm(e) {
this.dlLevel = e.value[0].dictValue
this.dlPickerShow = false
},
applyBlAgency() {
if (this.dlLevel == null) {
return this.$msg("请选择会员等级")
}
applyBlAgency({
id: this.dlInfo.id,
applyLevel: this.dlLevel
}).then(res => {
if (res.code == 200) {
this.$modal.showToast("操作成功,请等待审核");
this.dldjShow = false
}
}).catch(err => {
return this.$msg(err.message)
})
},
// onPointsExchange() {
// this.cashType = 'integer2balance'
// this.integerInputValue = ''
// this.dialogTitle = "当前槟榔果数量:" + (this.dataInfo && this.dataInfo.myInteger || 0)
// this.$refs.inputDialogBingGuo.open()
// },
fillAllInteger(){
this.integerInputValue = this.dataInfo && this.dataInfo.myInteger || 0
},
inputDialogToggle() {
// if (this.cashType == "cashBalance") {
// this.cashInfo = { bankName: '', bankId: '', changeMoney: '' }
// this.showBank = true
// return
// }
if (this.cashType == "cashBalance") {
this.cashInfo = {
bankName: '',
bankId: '',
changeMoney: ''
}
this.showBank = true
} else {
this.$refs.inputDialog.open()
}
},
async dialogInputConfirm(val){
if (this.cashType == "caseWared2Balance") {
val = this.moneyToBalance
this.cashAwardInfo.changeMoney = val
}
if (this.cashType == "fund2Balance") {
val = this.moneyToBalance
}
if (this.cashType == "cashBalance") {
val = this.cashInfo.changeMoney
if (!this.cashInfo.bankId) {
this.$msg("请选择有效提现银行卡")
return
}
}
if (parseFloat(val).toString() == "NaN") {
this.$msg("请填写数字")
return
}
if (parseFloat(val) <= 0) {
this.$msg("操作失败,填写错误")
return
}
//判断是否金额并且判断是否积分大于
if (parseFloat(val) > this.cashAsset) {
this.$msg("操作失败,资产不足")
return
}
if (this.cashType == "cashBalance") {
console.log()
await balanceCaseApply(this.cashInfo)
this.$msg("提现申请成功,请等待审核!")
return
}
if (this.cashType == "tree2Balance") {
await caseTree2Balance({
changeMoney: val
})
this.$msg("兑付成功,请稍后刷新资产明细!")
return
}
if (this.cashType == "caseWared2Balance") {
//奖金闪兑
await caseWared2Balance(this.cashAwardInfo)
this.$msg("兑换成功,请稍后刷新资产明细!")
this.moneyToBalance = ""
return
}
if (this.cashType == "fund2Balance") {
await fund2Balance({
changeMoney: val
})
this.$msg("兑换成功,请稍后刷新资产明细!")
this.moneyToBalance = ""
return
}
},
// async dialogInputConfirmBingGuo(val){
// if(this.cashType === 'integer2balance'){
// val = this.integerInputValue
// }
// if (parseFloat(val).toString() == "NaN") {
// this.$msg("请填写数字")
// return
// }
// if (val <= 0) {
// this.$msg("请填写大于0的数字")
// return
// }
// //判断是否金额并且判断是否槟榔果大于
// if (val > this.dataInfo.myInteger) {
// this.$msg("操作失败,资产不足")
// return
// }
// //槟榔果闪兑
// await handleCashInteger({
// changeMoney: val
// })
// this.$msg("兑换成功,请稍后刷新资产明细!")
// setTimeout(async()=>{
// await countIntegerPriceApi();
// await this.getData()
// },2000)
// },
async getAssetList() {
let resp = await myAssetDetail()
resp.forEach(asset => {
this.assetMap['asset_' + asset.assetType] = asset.value.toFixed(2)
})
},
goto(url) {
if (url == "cashBalance") {
this.cashAsset = this.assetMap['asset_' + 10]
this.cashType = url
this.dialogTitle = "当前消费余额:" + this.cashAsset
this.inputDialogToggle()
return
}
if (url == "tree2Balance") {
this.cashAsset = this.assetMap['asset_' + 13]
this.cashType = url
this.dialogTitle = "当前槟榔收益:" + this.cashAsset
this.$refs.inputDialog.open()
return
}
if (url == "caseWared2Balance") {
this.cashAsset = this.assetMap['asset_' + 12]
this.cashType = url
this.dialogTitle = "当前补贴:" + this.cashAsset
this.$refs.inputDialog.open()
return
}
if (url == "fund2Balance") {
this.cashAsset = this.assetMap['asset_' + 16]
this.cashType = url
this.dialogTitle = "当前消费金:" + this.cashAsset
this.$refs.inputDialog.open()
return
}
uni.navigateTo({ url });
},
goAuthentication(path) {
if (path.indexOf('authentication') >= 0) {
if (this.authInfo.status == 3) {
this.$navigateTo('/pages/user/authentication/authentication')
return
} else {
this.$navigateTo('/pages/user/authentication/result')
return
}
// await this.$http("GET", url.user.getVerifyInfo).then(({
// code,
// data
// }) => {
// if (code == 200) {
// if (data) {
// this.$navigateTo('/pages/user/authentication/result')
// } else {
// this.$navigateTo('/pages/user/authentication/authentication')
// }
// }
// }).catch(({
// msg
// }) => {
// console.log('msg', msg)
// })
// return;
}
}
},
};
</script>
<style>
page {
/* background-color: #A3F4E4; */
}
</style>
<style lang="scss" scoped>
@import "./common/style/base.scss";
.team_count {
font-size: 36rpx;
margin-left: 178rpx;
}
.mine-container {
width: 100%;
height: 100%;
overflow-y: scroll;
}
.three_data {
margin-top: 40rpx;
display: flex;
justify-content: space-between;
.items {
width: 32%;
text-align: center;
.active_color {
color: #eff158;
}
.value {
font-size: 32rpx;
}
.msg {
color: #ccc;
font-size: 26rpx;
margin: 5rpx 0;
}
.label {
color: #ccc;
font-size: 26rpx;
}
}
}
.container {
margin: 0 20rpx;
box-sizing: border-box;
box-shadow: 0px 2rpx 10rpx 1rpx rgba(122, 141, 173, 0.2);
border-radius: 16rpx;
}
.btn_group {
margin-bottom: 30rpx;
background: #fff;
border-radius: 15rpx;
padding: 20rpx 30rpx 0 30rpx;
box-sizing: border-box;
.title {
font-weight: 600;
color: #000;
padding: 15rpx 0rpx;
box-sizing: border-box;
}
.content {
display: flex;
flex-wrap: wrap;
.item {
width: 25%;
margin-bottom: 30rpx;
// border: 1px solid red;
display: flex;
flex-direction: column;
align-items: center;
.icon {
height: 60rpx;
// border: 1px solid red;
image {
height: 100%;
}
}
.name {
font-size: 28rpx;
color: #111;
margin-top: 12rpx;
font-weight: 500;
}
}
}
}
.dldj-box {
padding: 30rpx 20rpx 40rpx;
width: 600rpx;
.dldj-title {
text-align: center;
font-size: 26rpx;
margin-bottom: 30rpx;
}
.dldj-input {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 40rpx;
border: solid 1rpx #eee;
padding: 10rpx;
border-radius: 10rpx;
font-size: 22rpx;
}
.dldj-btns {
.u-button {
margin-top: 20rpx;
height: 70rpx;
}
}
}
.asset-card {
border-radius: 16rpx;
padding: 24rpx;
margin-top: 24rpx;
box-shadow: 0px 2rpx 10rpx 1rpx rgba(122, 141, 173, 0.2);
background: rgba(255, 255, 255, 0.5);
// background: linear-gradient(180deg, #88ddff, #b7dfef);
display: flex;
flex-direction: row;
justify-content: space-around;
.hazelnut-card {
display: flex;
flex-direction: column;
// justify-content: center;
flex: 1;
.bl-title {
flex-shrink: 0;
display: flex;
justify-content: center;
align-items: center;
padding: 15rpx 0;
.card-title {
font-size: 36rpx;
font-weight: 600;
color: #333333;
// padding-left: 30rpx;
}
}
.bg-title {
display: flex;
padding: 6rpx;
justify-content: center;
flex-direction: column;
align-items: center;
color: #333333;
font-size: 30rpx;
font-weight: 600;
.count_box .count {
font-weight: 500;
}
}
.count_box {
display: flex;
font-size: 30rpx;
color: #F80B0B;
align-items: center;
margin-right: -15rpx;
.unit {
margin-left: 10rpx;
font-size: 28rpx;
color: #808080;
font-weight: 400;
}
}
.middle-section {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 10rpx;
.bl-item {
flex: 1;
display: flex;
align-items: center;
font-weight: 400;
font-size: 28rpx;
color: #4e4e4e;
// padding: 10rpx 0;
.name {
margin: 0 10rpx;
}
}
.asset-info {
display: flex;
gap: 8rpx;
padding: 8rpx 0;
.value {
font-size: 28rpx;
color: #000000;
font-weight: 500;
}
}
.info-item {
display: flex;
align-items: center;
flex-wrap: nowrap;
font-size: 24rpx;
color: #666666;
line-height: 1.4;
}
/* 统一“我的槟榔:”和“棵”的样式,不影响 .count */
.label {
font-size: 24rpx;
color: #666666;
line-height: 1.4;
}
/* 让 v-if 包裹的这一层横向排列(数量 + 单位 同行) */
.info-item > view {
display: flex;
align-items: center;
}
.info-item .count_box {
display: flex;
align-items: baseline;
}
.info-item .count_box .label {
margin-left: 8rpx;
}
}
}
.gap {
width: 1rpx;
background: radial-gradient(#92a6b5, transparent);
margin: 0 15rpx;
align-self: stretch;
}
}
/* ===== 资产概览样式(从 myAsset.vue 迁移) ===== */
.top-box {
display: flex;
flex-direction: column;
justify-content: space-between;
background: #77E9D2;
border-bottom-right-radius: 24rpx;
border-bottom-left-radius: 24rpx;
padding: 0 20rpx 20rpx 20rpx;
// margin: 0 20rpx 0 20rpx;
.top-row {
display: flex;
justify-content: space-between;
.grp {
flex: 0;
border: 1rpx solid #8bbbb1;
margin: 15rpx 0;
}
}
.row-next {
margin-top: 20rpx;
background: rgba(255, 255, 255, 0.5);
border-radius: 16rpx;
}
}
.binglang-row {
margin: 20rpx 20rpx 0 20rpx;
display: flex;
justify-content: space-between;
background: rgba(255, 255, 255, 0.5);
border-radius: 16rpx;
}
.row1-col {
flex: 1;
padding: 15rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.title {
font-weight: 500;
font-size: 32rpx;
color: #484848;
margin-bottom: 15rpx;
text-align: center;
}
.price-group {
display: flex;
align-items: center;
.price {
font-size: 33rpx;
color: #000000;
font-weight: 600;
}
.unit {
margin-left: 8rpx;
font-weight: 400;
font-size: 28rpx;
color: #636262;
}
}
}
/* ===== 中间的银行卡,提现申请样式(从 myAsset.vue 迁移) ===== */
.zhong-box {
margin: 20rpx;
display: flex;
justify-content: space-between;
background: #FFFFFF;
border-radius: 16rpx;
.item {
display: flex;
padding: 20rpx;
.item-group {
display: flex;
flex-direction: column;
align-items: center;
image {
width: 64rpx;
height: 64rpx;
}
view {
margin-top: 10rpx;
font-weight: 400;
font-size: 28rpx;
color: #484848;
}
}
}
}
.handle-box {
margin: 20rpx;
background: #FFFFFF;
border-radius: 16rpx;
padding: 0 20rpx;
box-shadow: 0px 2rpx 10rpx 1rpx rgba(122, 141, 173, 0.2);
.handle-detail {
display: flex;
flex-direction: column;
.handle-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24rpx 0;
border-bottom: 1rpx solid #eee;
&:last-child {
border-bottom: none;
}
.item-box {
display: flex;
align-items: center;
.item-icon {
width: 60rpx;
height: 60rpx;
margin-right: 15rpx;
image {
width: 100%;
height: 100%;
}
}
.handle-name {
font-size: 28rpx;
color: #484848;
font-weight: 400;
}
}
.item-right {
flex-shrink: 0;
.right {
width: 20rpx;
height: 20rpx;
}
}
}
}
}
.top-top {
display: flex;
padding: 20rpx;
background-image: url("~@/static/newBinLang/wode/SketchPng1257a64db24f6cf69b63bf7a03ddb6abfd87c6a8bf9ef4963effb4ea548a1ecc.png");
background-size: 100% 100%;
align-items: center;
.name {
margin: 0 10rpx;
}
.real-box {
background-color: #fff;
border-radius: 20rpx;
border-top-right-radius: 5rpx;
font-size: 23rpx;
font-weight: 600;
align-items: center;
padding: 10rpx;
display: flex;
align-items: center;
.t {
margin: 0 10rpx 5rpx 10rpx;
}
image {
width: 20rpx;
height: 20rpx;
}
}
.top-top-right {
padding-right: 15rpx;
}
}
</style>