Leo_Ding/GPU_Web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

代码修改

Browse Source
This commit is contained in:
qiuyuan 2026-01-15 15:31:42 +08:00
parent b2ebdca17d
commit 6ec2e38d13
2 changed files with 66 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/admin/account/cost/exchange/index.vue
View File

@ -318,7 +318,7 @@ const performExchange = async () => {
try {
// 调用兑换接口
const response = await exchangePoint({
const response:any = await exchangePoint({
exchange_value: selectedExchangeAmount.value
})
console.log('兑换结果:', response)

137
src/views/admin/home/index.vue
View File

@ -5,7 +5,7 @@
<!-- 左侧栏：实例、数据、邀请好友 -->
<a-col :span="16">
<!-- 实例卡片 -->
<a-card title="GPU容器实例" class="card">
<a-card title="GPU容器实例" class="card gpu-card">
<a-row :gutter="32" align="middle">
<!-- 第一栏：容器实例和运行中 -->
<a-col :span="18">
@ -44,14 +44,17 @@
<!-- 邀请好友卡片 -->
<a-card title="邀请好友得算力券" class="card margin-top">
<template #extra>
<a-button type="link" @click="goToRules">活动规则</a-button>
</template>
<a-row :gutter="24" class="invite-container">
<!-- 左侧：邀请信息和链接 -->
<a-col :span="24">
<div class="invite-content">
<div class="invite-status">
<div class="status-icon">
<!-- <div class="status-icon">
<LinkOutlined />
</div>
</div> -->
<div class="status-text">
<div class="status-title">暂无邀请链接</div>
<div class="status-desc">
@ -59,35 +62,17 @@
</div>
</div>
</div>
<div class="invite-actions">
<a-button
type="primary"
class="generate-btn"
@click="generateInviteLink"
>
<a-button type="primary" class="generate-btn" @click="generateInviteLink">
<template #icon>
<PlusOutlined />
</template>
生成邀请链接
</a-button>
<!-- 新增：活动规则链接 -->
<a-button
type="link"
class="rules-link"
@click="goToRules"
>
<template #icon>
<QuestionCircleOutlined />
</template>
查看活动规则
</a-button>
</div>
</div>
</a-col>
</a-row>
</a-card>
</a-col>
@ -95,7 +80,7 @@
<!-- 右侧栏：用户信息 + 费用信息 -->
<a-col :span="8">
<!-- 费用信息卡片 -->
<a-card class="card ">
<a-card class="card ">
<div class="fee-header">
<div class="fee-title">我的账号</div>
</div>
@ -105,29 +90,31 @@
<img src="../../../assets/nav.png" />
</span>
<div class="nav-account">
<p>
{{ userInfo.userName }}
<i class="fee-value">
<CopyOutlined />
</i>
</p>
<a-tag :color="getCertifyName(userInfo.certificationStatus).color">{{ getCertifyName(userInfo.certificationStatus).name }}</a-tag>
<a-tag :color="getCertifyName(userInfo.certificationStatus).color">{{
getCertifyName(userInfo.certificationStatus).name }}</a-tag>
<!-- <p>{{getCertifyName(userInfo.certificationStatus).name}}</p> -->
</div>
<span class="btn-item" style="cursor: pointer;" @click="router.push('/layout/admin/accountSet')">
<span class="btn-item" style="cursor: pointer;"
@click="router.push('/layout/admin/accountSet')">
账户设置
<ArrowRightOutlined />
</span>
</div>
<a-divider />
<div class="fee-title" style="padding-bottom: 15px;">资产账户</div>
<!-- 我的余额 -->
<div class="asset-item">
<div class="asset-icon-box balance-icon">
<!-- <div class="asset-icon-box balance-icon">
<WalletOutlined class="asset-icon" />
</div>
</div> -->
<div class="asset-content">
<div class="asset-name">我的余额</div>
<div class="asset-value" v-if="userInfo.balance >= 0">
@ -140,12 +127,12 @@
</div>
</div>
</div>
<!-- 我的权益 -->
<div class="asset-item">
<div class="asset-icon-box coupon-icon">
<!-- <div class="asset-icon-box coupon-icon">
<TagOutlined class="asset-icon" />
</div>
</div> -->
<div class="asset-content">
<div class="asset-name">我的权益</div>
<div class="rights-info">
@ -155,14 +142,14 @@
<span class="rights-text">算力点</span>
</div>
<div class="rights-value">
<span class="rights-amount">{{ userInfo.computingPowerPoint}}</span>
<span class="rights-amount">{{ userInfo.computingPowerPoint }}</span>
<span class="rights-unit">点</span>
</div>
</div>
<!-- 分割线 -->
<div class="rights-divider"></div>
<!-- 可用算力券 -->
<div class="rights-item">
<div class="rights-label">
@ -180,7 +167,7 @@
</a-button> -->
</div>
</div>
</div>
<!-- <a-divider /> -->
<!-- <div class="fee-links">
@ -234,14 +221,14 @@ const formatAmount = (amount: number): string => {
return amount.toFixed(2)
}
const certificationStatus = new Map<string, { name: string; color: string }>([
['PENDING_CERTIFICATION', { name: '待认证', color: '#faad14' }],
['CERTIFICATION_DFFILED', { name: '已提交', color: '#d9d9d9' }], // 注意拼写：DFFILED → FAILED?
['CERTIFICATION_PASSED', { name: '认证通过', color: '#52c41a' }],
['CERTIFICATION_FAILED', { name: '认证失败', color: '#ff4d4f' }],
['PENDING_CERTIFICATION', { name: '待认证', color: '#faad14' }],
['CERTIFICATION_DFFILED', { name: '已提交', color: '#d9d9d9' }], // 注意拼写：DFFILED → FAILED?
['CERTIFICATION_PASSED', { name: '认证通过', color: '#52c41a' }],
['CERTIFICATION_FAILED', { name: '认证失败', color: '#ff4d4f' }],
]);
const getCertifyName = (status: string): { name: string; color: string } => {
return certificationStatus.get(status) ?? { name: '未认证', color: 'gray' };
return certificationStatus.get(status) ?? { name: '未认证', color: 'gray' };
};
// 格式化算力点显示（添加千分位）
const formatComputingPoints = (points: number): string => {
@ -269,7 +256,7 @@ const goToRules = () => {
// 跳转到活动规则页面，假设路由为 '/invite/rules'
// 如果是在新窗口打开，可以使用 window.open('/invite/rules', '_blank')
router.push('/invite/rules')
// 或者使用外部链接
// window.open('https://your-domain.com/invite-rules', '_blank')
}
@ -306,12 +293,15 @@ const goToInvoice = () => {
background: #fff;
}
.gpu-card {
background: linear-gradient(180deg, rgba(250, 252, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
}
.margin-top {
margin-top: 20px;
}
/* 实例卡片样式 */
.stats-column {
display: flex;
@ -387,7 +377,7 @@ const goToInvoice = () => {
justify-content: center;
margin-right: 16px;
flex-shrink: 0;
.anticon {
font-size: 24px;
color: #1890ff;
@ -395,7 +385,9 @@ const goToInvoice = () => {
}
.status-text {
width: 100%;
flex: 1;
text-align: center;
}
.status-title {
@ -413,10 +405,8 @@ const goToInvoice = () => {
}
.invite-actions {
display: flex;
align-items: center;
gap: 16px;
margin-top: 8px;
width: 100%;
text-align: center;
}
.generate-btn {
@ -428,18 +418,18 @@ const goToInvoice = () => {
border: none;
box-shadow: 0 2px 0 rgba(5, 145, 255, 0.1);
transition: all 0.3s ease;
&:hover {
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3);
background: linear-gradient(90deg, #40a9ff, #5cdbd3);
}
&:active {
transform: translateY(0);
box-shadow: 0 2px 0 rgba(5, 145, 255, 0.1);
}
.anticon {
margin-right: 6px;
}
@ -451,11 +441,11 @@ const goToInvoice = () => {
height: auto;
font-size: 14px;
color: #1890ff;
&:hover {
color: #40a9ff;
}
.anticon {
margin-right: 4px;
font-size: 14px;
@ -474,13 +464,13 @@ const goToInvoice = () => {
margin-bottom: 20px;
padding-bottom: 12px;
border-bottom: 1px solid #f0f0f0;
.anticon {
color: #ff4d4f;
margin-right: 8px;
font-size: 16px;
}
span {
font-size: 16px;
font-weight: 600;
@ -499,7 +489,7 @@ const goToInvoice = () => {
align-items: flex-start;
margin-bottom: 16px;
line-height: 1.5;
&:last-child {
margin-bottom: 0;
}
@ -550,7 +540,7 @@ const goToInvoice = () => {
display: flex;
align-items: flex-start;
padding: 12px 0;
&:not(:last-child) {
border-bottom: 1px solid #f5f5f5;
}
@ -566,11 +556,11 @@ const goToInvoice = () => {
margin-right: 12px;
margin-top: 2px;
flex-shrink: 0;
&.balance-icon {
background: #1890ff;
}
&.coupon-icon {
background: #fa8c16;
}
@ -606,7 +596,7 @@ const goToInvoice = () => {
font-weight: 600;
color: #1890ff;
line-height: 1;
&:before {
content: '¥';
font-size: 14px;
@ -620,7 +610,7 @@ const goToInvoice = () => {
font-size: 12px;
color: #1890ff;
line-height: 1;
&:hover {
color: #40a9ff;
}
@ -641,7 +631,7 @@ const goToInvoice = () => {
justify-content: space-between;
align-items: center;
padding: 4px 0;
}
.rights-label {
@ -689,14 +679,16 @@ const goToInvoice = () => {
/* 算力点特殊样式 */
.rights-item:first-child {
.rights-amount {
color: #fa8c16; /* 算力点用橙色 */
color: #fa8c16;
/* 算力点用橙色 */
}
}
/* 算力券特殊样式 */
.rights-item:last-child {
.rights-amount {
color: #1890ff; /* 算力券用蓝色 */
color: #1890ff;
/* 算力券用蓝色 */
}
}
@ -707,7 +699,7 @@ const goToInvoice = () => {
color: #999;
line-height: 1;
margin-top: 4px;
&:hover {
color: #1890ff;
}
@ -731,6 +723,7 @@ const goToInvoice = () => {
.nav-account {
padding-left: 10px;
margin-top: -20px;
:first-child {
font-weight: 500;
@ -767,7 +760,7 @@ const goToInvoice = () => {
height: 20px;
font-size: 10px;
padding: 2px 5px;
margin-top: 42px;
margin-top: 30px;
margin-left: 10px;
border-radius: 5px;
border: 1px solid rgba(166, 166, 166, 1);
@ -786,7 +779,7 @@ const goToInvoice = () => {
height: auto;
color: #1890ff;
font-size: 12px;
&:hover {
color: #40a9ff;
}
@ -802,7 +795,7 @@ const goToInvoice = () => {
.invite-container {
flex-direction: column;
}
.invite-content {
padding-right: 0;
border-right: none;
@ -810,17 +803,17 @@ const goToInvoice = () => {
padding-bottom: 24px;
margin-bottom: 24px;
}
.rules-section {
padding-left: 0;
}
.invite-actions {
flex-direction: column;
align-items: flex-start;
gap: 12px;
}
.rules-link {
margin-left: 0;
}