|
|
@@ -3,7 +3,7 @@
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
- <title>用户控制台 - 提现管理</title>
|
|
|
+ <title>提现管理系统</title>
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
|
|
|
@@ -20,6 +20,7 @@
|
|
|
body {
|
|
|
background-color: #f5f7fb;
|
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
|
+ padding: 20px;
|
|
|
}
|
|
|
|
|
|
.profile-avatar-container {
|
|
|
@@ -63,14 +64,8 @@
|
|
|
.box {
|
|
|
border-radius: 8px;
|
|
|
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
|
|
|
- border: none;
|
|
|
+ border: 1px solid #eaeaea;
|
|
|
margin-bottom: 25px;
|
|
|
- transition: transform 0.3s ease;
|
|
|
- }
|
|
|
-
|
|
|
- .box:hover {
|
|
|
- transform: translateY(-5px);
|
|
|
- box-shadow: 0 6px 12px rgba(0,0,0,0.1);
|
|
|
}
|
|
|
|
|
|
.box-success {
|
|
|
@@ -78,7 +73,7 @@
|
|
|
}
|
|
|
|
|
|
.panel-heading {
|
|
|
- background-color: #fff;
|
|
|
+ background-color: #f8f9fa;
|
|
|
padding: 15px 20px;
|
|
|
border-bottom: 1px solid #eee;
|
|
|
font-weight: 600;
|
|
|
@@ -110,7 +105,6 @@
|
|
|
|
|
|
.btn-success:hover {
|
|
|
background-color: #27ae60;
|
|
|
- transform: translateY(-2px);
|
|
|
}
|
|
|
|
|
|
.nav-tabs {
|
|
|
@@ -168,21 +162,21 @@
|
|
|
border-radius: 4px;
|
|
|
font-weight: 500;
|
|
|
transition: all 0.2s;
|
|
|
- }
|
|
|
-
|
|
|
- .btn-refresh {
|
|
|
- background-color: var(--primary-color);
|
|
|
- color: white;
|
|
|
+ border: 1px solid #ddd;
|
|
|
+ background: #fff;
|
|
|
+ color: #555;
|
|
|
}
|
|
|
|
|
|
.btn-refresh:hover {
|
|
|
- background-color: #2980b9;
|
|
|
+ background-color: var(--primary-color);
|
|
|
color: white;
|
|
|
+ border-color: var(--primary-color);
|
|
|
}
|
|
|
|
|
|
.btn-summary {
|
|
|
background-color: var(--warning-color);
|
|
|
color: white;
|
|
|
+ border-color: var(--warning-color);
|
|
|
}
|
|
|
|
|
|
.btn-summary:hover {
|
|
|
@@ -199,38 +193,6 @@
|
|
|
100% { transform: rotate(360deg); }
|
|
|
}
|
|
|
|
|
|
- .balance-card {
|
|
|
- background: linear-gradient(135deg, #3498db, #8e44ad);
|
|
|
- color: white;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 20px;
|
|
|
- margin-bottom: 20px;
|
|
|
- box-shadow: 0 4px 6px rgba(0,0,0,0.1);
|
|
|
- }
|
|
|
-
|
|
|
- .balance-label {
|
|
|
- font-size: 14px;
|
|
|
- opacity: 0.8;
|
|
|
- }
|
|
|
-
|
|
|
- .balance-amount {
|
|
|
- font-size: 28px;
|
|
|
- font-weight: 700;
|
|
|
- margin: 5px 0;
|
|
|
- }
|
|
|
-
|
|
|
- .withdraw-info {
|
|
|
- background-color: #f8f9fa;
|
|
|
- padding: 15px;
|
|
|
- border-radius: 8px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .withdraw-info p {
|
|
|
- margin-bottom: 8px;
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
-
|
|
|
.no-data {
|
|
|
text-align: center;
|
|
|
padding: 40px 20px;
|
|
|
@@ -265,24 +227,44 @@
|
|
|
color: #e74c3c;
|
|
|
}
|
|
|
|
|
|
- .section-title {
|
|
|
- font-size: 18px;
|
|
|
- font-weight: 600;
|
|
|
+ .form-group {
|
|
|
margin-bottom: 20px;
|
|
|
- color: #2c3e50;
|
|
|
- position: relative;
|
|
|
- padding-left: 15px;
|
|
|
}
|
|
|
|
|
|
- .section-title:before {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 5px;
|
|
|
- height: 20px;
|
|
|
- width: 4px;
|
|
|
- background-color: var(--primary-color);
|
|
|
- border-radius: 2px;
|
|
|
+ .form-group label {
|
|
|
+ font-weight: 500;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ color: #34495e;
|
|
|
+ }
|
|
|
+
|
|
|
+ .withdraw-info {
|
|
|
+ background-color: #f8f9fa;
|
|
|
+ padding: 15px;
|
|
|
+ border-radius: 8px;
|
|
|
+ margin-top: 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .withdraw-info i {
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-danger {
|
|
|
+ color: #e74c3c;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-warning {
|
|
|
+ color: #f39c12;
|
|
|
+ }
|
|
|
+
|
|
|
+ .text-primary {
|
|
|
+ color: #3498db;
|
|
|
+ }
|
|
|
+
|
|
|
+ .balance-info {
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #7f8c8d;
|
|
|
}
|
|
|
|
|
|
.fadeInRight {
|
|
|
@@ -299,20 +281,10 @@
|
|
|
transform: translateX(0);
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- .form-group {
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .form-group label {
|
|
|
- font-weight: 500;
|
|
|
- margin-bottom: 8px;
|
|
|
- color: #34495e;
|
|
|
- }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
-<div class="container mt-5 mb-5">
|
|
|
+<div class="container mt-3 mb-5">
|
|
|
<div class="row animated fadeInRight">
|
|
|
<div class="col-md-4">
|
|
|
<div class="box box-success">
|
|
|
@@ -320,39 +292,41 @@
|
|
|
个人资料
|
|
|
</div>
|
|
|
<div class="panel-body">
|
|
|
- <div class="balance-card">
|
|
|
- <div class="balance-label">账户余额</div>
|
|
|
- <div class="balance-amount">¥8,450.00</div>
|
|
|
- <div class="balance-info">可提现金额: ¥8,450.00</div>
|
|
|
- </div>
|
|
|
-
|
|
|
<form id="update-form" role="form" data-toggle="validator" method="POST" action="#">
|
|
|
<div class="form-group">
|
|
|
- <label for="money" class="control-label">提现金额:</label>
|
|
|
- <input type="number" class="form-control" id="money" name="row[money]" value="" data-rule="required" placeholder="输入提现金额"/>
|
|
|
+ <label for="money" class="control-label">余额:</label>
|
|
|
+ <input type="text" class="form-control" id="money" name="row[money]" value="0.00" data-rule="required" disabled />
|
|
|
+ </div>
|
|
|
+ <div class="form-group">
|
|
|
+ <label for="withdraw-amount" class="control-label">提现金额:</label>
|
|
|
+ <input type="number" class="form-control" id="withdraw-amount" name="row[withdraw_amount]" value="" data-rule="required" placeholder="输入提现金额"/>
|
|
|
+ <div class="invalid-feedback">提现金额不能为空</div>
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<label for="name" class="control-label">姓名:</label>
|
|
|
<input type="text" class="form-control" id="name" name="row[name]" value="" data-rule="required" placeholder="收款人姓名"/>
|
|
|
+ <div class="invalid-feedback">姓名不能为空</div>
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<label for="type" class="control-label">开户行/支付宝:</label>
|
|
|
<input type="text" class="form-control" id="type" name="row[type]" value="" data-rule="required" placeholder="开户行或支付宝"/>
|
|
|
+ <div class="invalid-feedback">开户行/支付宝不能为空</div>
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<label for="cord" class="control-label">卡号/帐号:</label>
|
|
|
<input type="text" class="form-control" id="cord" name="row[cord]" value="" data-rule="required" placeholder="银行卡号或支付宝账号"/>
|
|
|
+ <div class="invalid-feedback">卡号/帐号不能为空</div>
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<button type="submit" class="btn btn-success w-100">
|
|
|
- <i class="fas fa-paper-plane me-2"></i> 提现
|
|
|
+ 提现
|
|
|
</button>
|
|
|
</div>
|
|
|
|
|
|
<div class="withdraw-info">
|
|
|
- <p><i class="fas fa-info-circle me-2 text-primary"></i> 提现申请将在1-3个工作日内处理</p>
|
|
|
- <p><i class="fas fa-exclamation-circle me-2 text-warning"></i> 单笔最低提现金额: ¥100.00</p>
|
|
|
- <p><i class="fas fa-exclamation-triangle me-2 text-danger"></i> 提现手续费: 1.0% (最低¥2.00)</p>
|
|
|
+ <p><i class="fas fa-info-circle text-primary"></i> 提现申请将在1-3个工作日内处理</p>
|
|
|
+ <p><i class="fas fa-exclamation-circle text-warning"></i> 单笔最低提现金额: ¥100.00</p>
|
|
|
+ <p><i class="fas fa-exclamation-triangle text-danger"></i> 提现手续费: 1.0% (最低¥2.00)</p>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
@@ -382,13 +356,14 @@
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<th>提取金额</th>
|
|
|
- <th>手续费</th>
|
|
|
+ <th>提取手续费</th>
|
|
|
<th>类型</th>
|
|
|
<th>提取帐号</th>
|
|
|
- <th>姓名</th>
|
|
|
+ <th>提取姓名</th>
|
|
|
<th>实际到账</th>
|
|
|
<th>提取时间</th>
|
|
|
- <th>状态</th>
|
|
|
+ <th>备注</th>
|
|
|
+ <th>是否审核</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody>
|
|
|
@@ -400,7 +375,8 @@
|
|
|
<td>张先生</td>
|
|
|
<td>¥1,188.00</td>
|
|
|
<td>2023-06-15 14:30</td>
|
|
|
- <td><span class="status-badge status-approved">已完成</span></td>
|
|
|
+ <td>正常提现</td>
|
|
|
+ <td><span class="status-badge status-approved">已审核</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td>¥800.00</td>
|
|
|
@@ -410,7 +386,8 @@
|
|
|
<td>李女士</td>
|
|
|
<td>¥792.00</td>
|
|
|
<td>2023-06-10 10:15</td>
|
|
|
- <td><span class="status-badge status-approved">已完成</span></td>
|
|
|
+ <td>正常提现</td>
|
|
|
+ <td><span class="status-badge status-approved">已审核</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td>¥2,500.00</td>
|
|
|
@@ -420,7 +397,8 @@
|
|
|
<td>王先生</td>
|
|
|
<td>¥2,475.00</td>
|
|
|
<td>2023-06-05 16:45</td>
|
|
|
- <td><span class="status-badge status-approved">已完成</span></td>
|
|
|
+ <td>正常提现</td>
|
|
|
+ <td><span class="status-badge status-approved">已审核</span></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
<td>¥500.00</td>
|
|
|
@@ -430,6 +408,7 @@
|
|
|
<td>赵女士</td>
|
|
|
<td>¥495.00</td>
|
|
|
<td>2023-06-01 09:20</td>
|
|
|
+ <td>正常提现</td>
|
|
|
<td><span class="status-badge status-pending">审核中</span></td>
|
|
|
</tr>
|
|
|
</tbody>
|
|
|
@@ -503,10 +482,40 @@
|
|
|
$('#update-form').submit(function(e) {
|
|
|
e.preventDefault();
|
|
|
|
|
|
+ let isValid = true;
|
|
|
+
|
|
|
// 表单验证
|
|
|
- const amount = parseFloat($('#money').val());
|
|
|
+ const amount = parseFloat($('#withdraw-amount').val());
|
|
|
if (isNaN(amount) || amount < 100) {
|
|
|
- toastr.warning('提现金额不能低于¥100.00');
|
|
|
+ $('#withdraw-amount').addClass('is-invalid');
|
|
|
+ isValid = false;
|
|
|
+ } else {
|
|
|
+ $('#withdraw-amount').removeClass('is-invalid');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!$('#name').val()) {
|
|
|
+ $('#name').addClass('is-invalid');
|
|
|
+ isValid = false;
|
|
|
+ } else {
|
|
|
+ $('#name').removeClass('is-invalid');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!$('#type').val()) {
|
|
|
+ $('#type').addClass('is-invalid');
|
|
|
+ isValid = false;
|
|
|
+ } else {
|
|
|
+ $('#type').removeClass('is-invalid');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!$('#cord').val()) {
|
|
|
+ $('#cord').addClass('is-invalid');
|
|
|
+ isValid = false;
|
|
|
+ } else {
|
|
|
+ $('#cord').removeClass('is-invalid');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!isValid) {
|
|
|
+ toastr.warning('请填写所有必填字段');
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
@@ -516,6 +525,9 @@
|
|
|
// 模拟处理延迟
|
|
|
setTimeout(function() {
|
|
|
toastr.success('提现申请已提交,将在1-3个工作日内处理');
|
|
|
+
|
|
|
+ // 清空表单
|
|
|
+ $('#update-form')[0].reset();
|
|
|
}, 1500);
|
|
|
});
|
|
|
});
|