755 lines
19 KiB
Vue
755 lines
19 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view style="
|
||
height: 40px;
|
||
color: #fff;
|
||
text-align: right;
|
||
display: flex;
|
||
">
|
||
<view style="display: flex;align-items: center;height: 40px;flex: 1;">
|
||
<view style="height: 40px;line-height: 40px;margin-right: 5px;">
|
||
<image style="height: 25px;border-radius: 50%;margin-top: 6px;" src="/static/logo.png"
|
||
mode="heightFix">
|
||
</image>
|
||
</view>
|
||
<view style="display: flex;flex-direction: column;height: 40px;align-items: center;">
|
||
<view style="height: 18px;font-size: 13px;margin-top: 2px;">元算力</view>
|
||
<view style="font-size: 8px;height: 18px;">--Onlife--</view>
|
||
</view>
|
||
</view>
|
||
<view class="top-rig">
|
||
<view style="color: black;font-weight: bold;font-size: 15px;">
|
||
{{userMoneyAdressOptions(userMoneyAdress)}}
|
||
</view>
|
||
<view class="">
|
||
<u-icon @tap="showMoney" size="20" style="margin-left: 10rpx;"
|
||
:name="isShowMoney ? 'eye-fill' : 'eye-off'"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="card" style="margin-top: 20px;">
|
||
<view class="info-row">
|
||
<text class="info-label">我的認購(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ computingPower.my_miner_fee || 0 }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
</view>
|
||
<view class="card">
|
||
<view class="card-header">
|
||
<text>我的算力 (G)</text>
|
||
<!-- <button @tap="getMinerlist" class="small-button">查看訂單</button> -->
|
||
<view class="todel" @click="getMinerlist">
|
||
查看訂單<u-icon name="arrow-right" color="#A0A0FF" size="16" style="margin-left: 10rpx;"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">認購的算力(G):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ computingPower.my_miner || 0 }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">服務中的算力(G):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ computingPower.valid_miner || 0 }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
<!-- 剩餘 -->
|
||
<view class="info-row">
|
||
<text class="info-label">算力總花費(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value"> {{ computingPower.my_miner_fee }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
</view>
|
||
<view class="card">
|
||
<view class="card-header">
|
||
<text>資產收益</text>
|
||
<!-- <button class="small-button" @tap="socreGet('資產收益領取')">立即領取</button> -->
|
||
<view class="todel" @click="socreGet('資產收益領取')">
|
||
立即領取<u-icon name="arrow-right" color="#A0A0FF" size="16" style="margin-left: 10rpx;"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">我的總收益(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ zichanshouyi.all }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">待領取收益(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ zichanshouyi.await }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">已領取收益(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ zichanshouyi.collected }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
</view>
|
||
<view class="card">
|
||
<view class="card-header">
|
||
<text>市場佣金</text>
|
||
<!-- <button class="small-button" @tap="socreGet('佣金收益領取')">立即領取</button> -->
|
||
<view class="todel" @click="socreGet('佣金收益領取')">
|
||
立即領取<u-icon name="arrow-right" color="#A0A0FF" size="16" style="margin-left: 10rpx;"></u-icon>
|
||
</view>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">我的總收益(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ shicyongj.all }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">待領取收益(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ shicyongj.await }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
<view class="info-row">
|
||
<text class="info-label">已領取收益(USDT):</text>
|
||
<text v-if="isShowMoney" class="info-value">{{ shicyongj.collected }}</text>
|
||
<text v-else class="info-value">****</text>
|
||
</view>
|
||
</view>
|
||
<view class="card">
|
||
<view class="card-header">
|
||
<text>領取記錄</text>
|
||
</view>
|
||
<view class="withdrawal-container">
|
||
<view class="table-header">
|
||
<view class="th">提現金額</view>
|
||
<view class="th">狀態</view>
|
||
<view class="th">操作</view>
|
||
</view>
|
||
<scroll-view class="table-body" scroll-y @scrolltolower="loadMore" :style="{height: 250 + 'px'}">
|
||
<view class="no-data" v-if="list.length === 0">暫無數據</view>
|
||
<view class="tr" v-for="(item, index) in list" :key="index">
|
||
<view v-if="isShowMoney" class="td">{{ item.amount }}</view>
|
||
<view v-else class="td">****</view>
|
||
<view v-if="isShowMoney" class="td">
|
||
<text v-if="item.status == 0" style="color: orange;">審核中</text>
|
||
<text v-if="item.status == 1" style="color: green;">已完成</text>
|
||
<text v-if="item.status == -1" style="color: red;">已拒絕</text>
|
||
</view>
|
||
<view v-else class="td">****</view>
|
||
<view v-if="isShowMoney" class="td">
|
||
<button class="btn-detail" @click="viewDetail(item)">詳細</button>
|
||
</view>
|
||
<view v-else class="td">****</view>
|
||
</view>
|
||
|
||
<view class="loading" v-if="loading">加載中...</view>
|
||
<view class="no-more" v-if="noMore">沒有更多數據了</view>
|
||
</scroll-view>
|
||
</view>
|
||
</view>
|
||
<!-- 查看訂單 -->
|
||
<view class="modal" v-if="showModal">
|
||
<view class="modal-content">
|
||
<view class="modal-header">
|
||
<text class="modal-title">訂單詳細</text>
|
||
<text class="modal-close" @click="showModal = false">×</text>
|
||
</view>
|
||
<view class="modal-body" v-for="item in suanliList" :key="item.id">
|
||
<view class="modal-item" style="display: flex;border-bottom: 1px solid darkgrey;">
|
||
<text class="modal-label">訂單號:</text>
|
||
<text class="modal-value">{{item.order_no}}</text>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">訂單算力(G):</text>
|
||
<text class="modal-value">{{item.value}}</text>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">收益天數:</text>
|
||
<view class="modal-value">{{item.reward_day}}</view>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">服務期限:</text>
|
||
<view class="modal-value">{{item.timeline}}</view>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">累計收益:</text>
|
||
<text class="modal-value">{{item.reward_all}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 顯示資產信息 -->
|
||
<view class="modal" v-if="moneyModal">
|
||
<view class="modal-content" style="height: 32vh;">
|
||
<view class="modal-header">
|
||
<view class="zz_content">請輸入支付密碼</view>
|
||
</view>
|
||
<view class="modal-body" style="border:none;">
|
||
<view class="modal-item">
|
||
<text class="modal-label">支付密碼:</text>
|
||
<u--input color="#fff" style="width: 70%;" :value="zhifuMima" :password="showPassword"
|
||
border="none" @input="handleInput"></u--input>
|
||
<img :src="!showPassword ? showpwdImg : hidepwdImg" @tap="changePassword()"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
</view>
|
||
<view class="modal-footer">
|
||
<button class="modal-button cancel" @tap="moneyModal = false">取消</button>
|
||
<button class="modal-button confirm" @tap="modalBtn">確定</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="modal" v-if="detailDialog">
|
||
<view class="modal-content" style="height: 50vh;">
|
||
<view class="modal-header">
|
||
<text class="modal-title">領取詳細</text>
|
||
<text class="modal-close" @click="detailDialog = false">×</text>
|
||
</view>
|
||
<view class="modal-body">
|
||
<view class="modal-item" style="display: flex;border-bottom: 1px solid darkgrey;">
|
||
<text class="modal-label">申請金額:</text>
|
||
<text class="modal-value">{{detailrowinfos.amount}}</text>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">到賬金額:</text>
|
||
<text class="modal-value">{{detailrowinfos.paid_fee}}</text>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">手續費:</text>
|
||
<view class="modal-value">{{detailrowinfos.charge_fee}}</view>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">手續費率:</text>
|
||
<view class="modal-value">{{detailrowinfos.charge_rate}}</view>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">交易hash:</text>
|
||
<text class="modal-value">{{detailrowinfos.tx}}</text>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">申請時間:</text>
|
||
<view class="modal-value">{{formatDate(detailrowinfos.createtime * 1000)}}</view>
|
||
</view>
|
||
<view class="modal-item">
|
||
<text class="modal-label">到賬時間:</text>
|
||
<text class="modal-value"
|
||
v-if="detailrowinfos.updatetime">{{formatDate(detailrowinfos.updatetime * 1000)}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
_miners,
|
||
_cashoutscore,
|
||
_taxinfo,
|
||
_minerordlist,
|
||
_rewardstatic,
|
||
_userInfos,
|
||
_walletinfo,
|
||
_getwithdrawlogs
|
||
} from "@/request/api.js"
|
||
import MD5 from "blueimp-md5";
|
||
export default {
|
||
data() {
|
||
return {
|
||
emailCode:"",
|
||
googleCode:"",
|
||
emaiTip:"發送",
|
||
googleTip:"發送",
|
||
detailrowinfos: {},
|
||
detailDialog: false,
|
||
list: [],
|
||
page: 1,
|
||
pageSize: 10,
|
||
loading: false,
|
||
noMore: false,
|
||
scrollHeight: 500,
|
||
showpwdImg: "static/icon/eye_on.png",
|
||
hidepwdImg: "static/icon/eye_off.png",
|
||
showPassword: true,
|
||
zhifuMima: "",
|
||
moneyModal: false,
|
||
userMoneyAdress: "",
|
||
showModal: false,
|
||
computingPower: {}, //我的算力
|
||
taxinfoNum: {}, //領取相關
|
||
suanliList: [], //算力訂單詳細
|
||
zichanshouyi: {}, //資產收益
|
||
shicyongj: {}, //市場佣金
|
||
userInfos: {},
|
||
isShowMoney: false,
|
||
}
|
||
},
|
||
onShow() {
|
||
// 計算滾動區域高度
|
||
const sysInfo = uni.getSystemInfoSync();
|
||
this.scrollHeight = sysInfo.windowHeight - 100; // 減去表頭和其他元素高度
|
||
this.list = [];
|
||
this.page = 1;
|
||
this.pageSize = 10;
|
||
this.getUserInfos();
|
||
},
|
||
methods: {
|
||
async tosendemail(){
|
||
if (this.emaiTip == "發送") {
|
||
let num = 60;
|
||
let emaiTimer = setInterval(() => {
|
||
this.emaiTip = num + 's';
|
||
num--;
|
||
if (num < 0) {
|
||
this.emaiTip = "發送";
|
||
clearInterval(emaiTimer)
|
||
}
|
||
}, 1000)
|
||
let res = await _emailSend({
|
||
email: this.userInfos.email,
|
||
event: "check"
|
||
});
|
||
if (res.code === 1) {
|
||
uni.showToast({
|
||
title: '發送成功',
|
||
icon: 'none'
|
||
});
|
||
}else{
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
});
|
||
}
|
||
} else {
|
||
return
|
||
}
|
||
},
|
||
googleemail() {
|
||
let num = 60;
|
||
let googleTimer = setInterval(() => {
|
||
this.googleTip = num + 's';
|
||
num--;
|
||
if (num < 0) {
|
||
this.googleTip = "發送";
|
||
clearInterval(googleTimer)
|
||
}
|
||
}, 1000)
|
||
},
|
||
viewDetail(item) {
|
||
this.detailrowinfos = {};
|
||
this.detailDialog = true;
|
||
this.detailrowinfos = {
|
||
...item
|
||
};
|
||
},
|
||
formatDate(timestamp) {
|
||
const date = new Date(timestamp);
|
||
const year = date.getFullYear();
|
||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||
const day = String(date.getDate()).padStart(2, '0');
|
||
const hour = String(date.getHours()).padStart(2, '0');
|
||
const minute = String(date.getMinutes()).padStart(2, '0');
|
||
const miao = String(date.getSeconds()).padStart(2, '0');
|
||
return `${year}-${month}-${day} ${hour}:${minute}:${miao}`;
|
||
},
|
||
loadMore(){
|
||
this.page++;
|
||
this.getrawLogs();
|
||
},
|
||
handleData(newData) {
|
||
if (newData.length < this.pageSize) {
|
||
this.noMore = true;
|
||
}
|
||
|
||
this.list = [...this.list, ...newData];
|
||
this.page++;
|
||
this.loading = false;
|
||
},
|
||
async getrawLogs() {
|
||
let res = await _getwithdrawlogs({page:this.page,listrow:this.pageSize});
|
||
if (res.code === 1) {
|
||
const newData = res.data.data;
|
||
this.handleData(newData);
|
||
}
|
||
console.log(res, '領取記錄')
|
||
},
|
||
async modalBtn() {
|
||
let _that = this;
|
||
if (!_that.zhifuMima) return uni.showToast({
|
||
title: '請輸入您的支付密碼',
|
||
icon: 'none'
|
||
})
|
||
const params = {
|
||
paykey: MD5(_that.zhifuMima + (Math.floor(Date.now() / 1000))),
|
||
timestamp: Math.floor(Date.now() / 1000),
|
||
event: "seepanel"
|
||
}
|
||
let res = await _walletinfo(params);
|
||
if (res.code === 1) {
|
||
_that.isShowMoney = true;
|
||
_that.moneyModal = false;
|
||
_that.zhifuMima = "";
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
})
|
||
}
|
||
},
|
||
changePassword() {
|
||
this.showPassword = !this.showPassword;
|
||
},
|
||
handleInput(event) {
|
||
this.zhifuMima = event;
|
||
},
|
||
showMoney() {
|
||
if (this.isShowMoney) {
|
||
this.isShowMoney = false;
|
||
} else {
|
||
this.moneyModal = true;
|
||
}
|
||
},
|
||
async getUserInfos() {
|
||
let res = await _userInfos();
|
||
if (res.code === 1) {
|
||
this.userInfos = res.data.userinfo;
|
||
this.userMoneyAdress = this.userInfos.wallet.address;
|
||
this.getMiners();
|
||
this.getrawLogs();
|
||
this.getTaxinfo();
|
||
this.getRewardstatic();
|
||
}
|
||
},
|
||
userMoneyAdressOptions(data) {
|
||
let start = data.substring(0, 6);
|
||
let end = data.substring(data.length - 4);
|
||
let middle = "……";
|
||
let finalString = start + middle + end;
|
||
return finalString
|
||
},
|
||
//算力訂單
|
||
async getMinerlist() {
|
||
let res = await _minerordlist();
|
||
if (res.code === 1) {
|
||
this.suanliList = res.data;
|
||
if (this.suanliList.length > 0) {
|
||
this.showModal = true;
|
||
} else {
|
||
uni.showToast({
|
||
title: "暫無訂單",
|
||
icon: "none"
|
||
})
|
||
}
|
||
}
|
||
},
|
||
//算力列表
|
||
async getMiners() {
|
||
let res = await _miners();
|
||
if (res.code === 1) {
|
||
this.computingPower = res.data;
|
||
this.getTaxinfo();
|
||
this.getRewardstatic();
|
||
}
|
||
},
|
||
async getRewardstatic() {
|
||
let res = await _rewardstatic();
|
||
if (res.code === 1) {
|
||
this.zichanshouyi = res.data.prop; //資產收益
|
||
this.shicyongj = res.data.commission; //市場佣金
|
||
}
|
||
},
|
||
//領取收益相關
|
||
async getTaxinfo() {
|
||
let res = await _taxinfo();
|
||
if (res.code === 1) {
|
||
this.taxinfoNum = res.data;
|
||
}
|
||
},
|
||
//領取收益
|
||
async socreGet(type) {
|
||
let score = null;
|
||
let a = Number(this.zichanshouyi.await);
|
||
let b = Number(this.shicyongj.await);
|
||
let c = Number(this.taxinfoNum.cashoutmin);
|
||
type == "資產收益領取" ? score = a : score = b;
|
||
if (score < c) {
|
||
uni.showToast({
|
||
title: `待領取收益大於等於${this.taxinfoNum.cashoutmin}可領取`,
|
||
icon: "none",
|
||
duration: 1000
|
||
})
|
||
return
|
||
}
|
||
const params = {
|
||
score,
|
||
type
|
||
};
|
||
let res = await _cashoutscore(params);
|
||
if (res.code === 1) {
|
||
uni.showToast({
|
||
title: `領取成功!`,
|
||
icon: "none",
|
||
duration: 1000
|
||
})
|
||
this.getRewardstatic();
|
||
} else {
|
||
uni.showToast({
|
||
title: `領取失敗!`,
|
||
icon: "none",
|
||
duration: 1000
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.container {
|
||
border-top: 1px solid dimgrey;
|
||
width: 100vw;
|
||
min-height: 100vh;
|
||
padding: 20px;
|
||
box-sizing: border-box;
|
||
background: linear-gradient(to bottom, #000033, #51599b);
|
||
}
|
||
|
||
.card {
|
||
background: linear-gradient(to bottom, #393C84, #9193C6);
|
||
border-radius: 30rpx;
|
||
padding: 30rpx;
|
||
box-sizing: border-box;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
|
||
.card-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 10px;
|
||
color: white;
|
||
border-bottom: 1.5px solid #A8AAE0;
|
||
height: 40px;
|
||
line-height: 40px;
|
||
}
|
||
|
||
.small-button {
|
||
background-color: #4caf50;
|
||
height: 25px;
|
||
line-height: 25px;
|
||
color: white;
|
||
border-radius: 15px;
|
||
font-size: 12px;
|
||
margin-right: 2%;
|
||
}
|
||
|
||
.info-row {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 13px;
|
||
}
|
||
|
||
.info-label {
|
||
color: #e0e0e0;
|
||
width: 55%;
|
||
}
|
||
|
||
.info-value {
|
||
color: white;
|
||
font-weight: bold;
|
||
border: 1px solid #A8AADD;
|
||
flex: 1;
|
||
border-radius: 10px;
|
||
height: 60rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
// 彈窗
|
||
.modal {
|
||
position: fixed;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
top: 0;
|
||
background-color: rgba(0, 0, 0, 0.6);
|
||
display: flex;
|
||
align-items: flex-end;
|
||
z-index: 999;
|
||
}
|
||
|
||
.modal-content {
|
||
background-color: #b6b5c8;
|
||
border-radius: 20px 20px 0 0;
|
||
padding: 20px;
|
||
box-sizing: border-box;
|
||
width: 100%;
|
||
animation: slideUp 0.3s ease-out;
|
||
box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.1);
|
||
height: 37vh;
|
||
overflow: auto;
|
||
}
|
||
|
||
@keyframes slideUp {
|
||
from {
|
||
transform: translateY(100%);
|
||
}
|
||
|
||
to {
|
||
transform: translateY(0);
|
||
}
|
||
}
|
||
|
||
.modal-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.modal-title {
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
color: #333;
|
||
}
|
||
|
||
.modal-close {
|
||
font-size: 24px;
|
||
color: #999;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.modal-body {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.modal-item {
|
||
display: flex;
|
||
margin-bottom: 15px;
|
||
padding-bottom: 10px;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.modal-label {
|
||
color: #666;
|
||
font-size: 14px;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.modal-value {
|
||
flex: 1;
|
||
font-weight: bold;
|
||
color: #333;
|
||
font-size: 14px;
|
||
word-break: break-all;
|
||
text-align: right;
|
||
overflow: hidden;
|
||
/* 超出部分隱藏 */
|
||
text-overflow: ellipsis;
|
||
/* 超出部分顯示省略號 */
|
||
white-space: nowrap;
|
||
/* 不換行 */
|
||
}
|
||
|
||
.modal-footer {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.modal-button {
|
||
width: 48%;
|
||
height: 44px;
|
||
border-radius: 22px;
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
border: none;
|
||
cursor: pointer;
|
||
transition: all 0.3s ease;
|
||
}
|
||
|
||
.modal-button.cancel {
|
||
background-color: #f0f0f0;
|
||
color: #333;
|
||
}
|
||
|
||
.modal-button.cancel:hover {
|
||
background-color: #e0e0e0;
|
||
}
|
||
|
||
.modal-button.confirm {
|
||
background-color: #4CAF50;
|
||
color: white;
|
||
}
|
||
|
||
.modal-button.confirm:hover {
|
||
background-color: #45a049;
|
||
}
|
||
|
||
.todel {
|
||
display: flex;
|
||
font-size: 24rpx;
|
||
color: #A0A0FF;
|
||
}
|
||
|
||
.top-rig {
|
||
padding: 10rpx 20rpx;
|
||
display: flex;
|
||
background-color: #DADBF1;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 30rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
.withdrawal-container {
|
||
width: 100%;
|
||
}
|
||
|
||
.table-header {
|
||
display: flex;
|
||
font-weight: bold;
|
||
border-bottom: 1rpx solid #f0f0f0;
|
||
}
|
||
|
||
.th {
|
||
flex: 1;
|
||
padding: 20rpx 0rpx;
|
||
text-align: center;
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.table-body {
|
||
width: 100%;
|
||
|
||
}
|
||
|
||
.tr {
|
||
display: flex;
|
||
border-bottom: 1rpx solid #f0f0f0;
|
||
}
|
||
|
||
.td {
|
||
flex: 1;
|
||
padding: 20rpx 10rpx;
|
||
text-align: center;
|
||
font-size: 26rpx;
|
||
color: #fff;
|
||
}
|
||
|
||
.btn-detail {
|
||
font-size: 24rpx;
|
||
padding: 4rpx 16rpx;
|
||
background-color: #45a049;
|
||
color: white;
|
||
border-radius: 6rpx;
|
||
border: none;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.loading,
|
||
.no-more,
|
||
.no-data {
|
||
text-align: center;
|
||
padding: 20rpx;
|
||
color: #999;
|
||
font-size: 26rpx;
|
||
}
|
||
|
||
.no-data {
|
||
padding: 100rpx 0;
|
||
}
|
||
</style> |