huangzhenbao/medical-mall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化细节

Browse Source
This commit is contained in:
huangzhenbao
2026-02-06 12:06:33 +08:00
parent b7545173c6
commit d00f0b7412
83 changed files with 3901 additions and 2354 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
pages/mall/admin/finance/withdrawal.uvue
View File

@@ -1,14 +1,14 @@
<template>
<template>
<view class="finance-withdrawal">
<!-- 头部筛选区 -->
<!-- 澶撮儴绛涢€夊尯 -->
<view class="filter-card">
<view class="filter-row">
<view class="filter-item">
<text class="filter-label">时间选择:</text>
<input class="date-input" type="text" v-model="timeRangeText" placeholder="请选择时间范围" />
<text class="filter-label">鏃堕棿閫夋嫨:</text>
<input class="date-input" type="text" v-model="timeRangeText" placeholder="璇烽€夋嫨鏃堕棿鑼冨洿" />
</view>
<view class="filter-item">
<text class="filter-label">提现状态:</text>
<text class="filter-label">鎻愮幇鐘舵€?</text>
<picker mode="selector" :range="statusOptions" range-key="text" @change="statusChange">
<view class="picker-view">
<text>{{ statusLabel }}</text>
@@ -17,7 +17,7 @@
</picker>
</view>
<view class="filter-item">
<text class="filter-label">提现方式:</text>
<text class="filter-label">鎻愮幇鏂瑰紡:</text>
<picker mode="selector" :range="methodOptions" range-key="text" @change="methodChange">
<view class="picker-view">
<text>{{ methodLabel }}</text>
@@ -26,14 +26,14 @@
</picker>
</view>
<view class="filter-item search-wrap">
<text class="filter-label">搜索:</text>
<input class="search-input" v-model="searchKeyword" placeholder="微信昵称/姓名/支付宝账号/银行卡号" />
<text class="filter-label">鎼滅储:</text>
<input class="search-input" v-model="searchKeyword" placeholder="寰俊鏄电О/濮撳悕/鏀粯瀹濊处鍙?閾惰鍗″彿" />
</view>
<button class="btn-query" @click="handleQuery">查询</button>
<button class="btn-query" @click="handleQuery">鏌ヨ</button>
</view>
</view>
<!-- 统计指标网格 -->
<!-- 缁熻鎸囨爣缃戞牸 -->
<view class="stats-grid">
<view class="stat-card" v-for="(item, index) in stats" :key="index">
<view class="icon-circle" :class="item.colorClass">
@@ -46,27 +46,27 @@
</view>
</view>
<!-- 操作按钮区 -->
<!-- 鎿嶄綔鎸夐挳鍖?-->
<view class="action-section">
<view class="btn-record">
<text class="btn-record-txt">佣金记录</text>
<text class="btn-record-txt">浣ｉ噾璁板綍</text>
</view>
</view>
<!-- 数据表格 (使用 Flex 模拟以确保兼容性和精度) -->
<!-- 鏁版嵁琛ㄦ牸 (浣跨敤 Flex 妯℃嫙浠ョ‘淇濆吋瀹规€у拰绮惧害) -->
<view class="table-container">
<view class="table-header">
<view class="th col-id"><text class="th-txt">ID</text></view>
<view class="th col-user"><text class="th-txt">用户信息</text></view>
<view class="th col-amount"><text class="th-txt">提现金额</text></view>
<view class="th col-fee"><text class="th-txt">提现手续费</text></view>
<view class="th col-net"><text class="th-txt">到账金额</text></view>
<view class="th col-method"><text class="th-txt">提现方式</text></view>
<view class="th col-qr"><text class="th-txt">收款码</text></view>
<view class="th col-time"><text class="th-txt">申请时间</text></view>
<view class="th col-remark"><text class="th-txt">备注</text></view>
<view class="th col-status"><text class="th-txt">审核状态</text></view>
<view class="th col-ops"><text class="th-txt">操作</text></view>
<view class="th col-user"><text class="th-txt">鐢ㄦ埛淇℃伅</text></view>
<view class="th col-amount"><text class="th-txt">鎻愮幇閲戦</text></view>
<view class="th col-fee"><text class="th-txt">鎻愮幇鎵嬬画璐?/text></view>
<view class="th col-net"><text class="th-txt">鍒拌处閲戦</text></view>
<view class="th col-method"><text class="th-txt">鎻愮幇鏂瑰紡</text></view>
<view class="th col-qr"><text class="th-txt">鏀舵鐮?/text></view>
<view class="th col-time"><text class="th-txt">鐢宠鏃堕棿</text></view>
<view class="th col-remark"><text class="th-txt">澶囨敞</text></view>
<view class="th col-status"><text class="th-txt">瀹℃牳鐘舵€?/text></view>
<view class="th col-ops"><text class="th-txt">鎿嶄綔</text></view>
</view>
<view class="table-body">
@@ -79,7 +79,7 @@
</view>
<view class="user-detail">
<text class="user-nickname">{{ item.nickname }}</text>
<text class="user-id">用户id:{{ item.userId }}</text>
<text class="user-id">鐢ㄦ埛id:{{ item.userId }}</text>
</view>
</view>
</view>
@@ -88,26 +88,26 @@
<view class="td col-net"><text class="td-txt green-txt">{{ item.netAmount }}</text></view>
<view class="td col-method">
<view class="method-box">
<text class="m-line">姓名:{{ item.name }}</text>
<text class="m-line">濮撳悕:{{ item.name }}</text>
<text class="m-line">{{ item.type }}:{{ item.account }}</text>
<text v-if="item.bank" class="m-line">银行开户地址:{{ item.bank }}</text>
<text v-if="item.bank" class="m-line">閾惰寮€鎴峰湴鍧€:{{ item.bank }}</text>
</view>
</view>
<view class="td col-qr">
<view class="qr-box" v-if="item.id === 57">
<text class="qr-icon-txt">■</text>
<text class="qr-icon-txt">鈻?/text>
</view>
</view>
<view class="td col-time"><text class="td-txt">{{ item.time }}</text></view>
<view class="td col-remark"><text class="td-txt">{{ item.remark || '' }}</text></view>
<view class="td col-status"><text class="td-txt">申请中</text></view>
<view class="td col-status"><text class="td-txt">鐢宠涓?/text></view>
<view class="td col-ops">
<view class="ops-box">
<text class="op-btn blue">编辑</text>
<text class="op-btn blue">缂栬緫</text>
<text class="op-sep">|</text>
<text class="op-btn blue">通过</text>
<text class="op-btn blue">閫氳繃</text>
<text class="op-sep">|</text>
<text class="op-btn blue">驳回</text>
<text class="op-btn blue">椹冲洖</text>
</view>
</view>
</view>
@@ -126,61 +126,61 @@ const methodValue = ref('all')
const searchKeyword = ref('')
const statusOptions = ref([
{ value: 'all', text: '全部' },
{ value: '0', text: '待审核' },
{ value: '1', text: '已通过' },
{ value: '-1', text: '已驳回' }
{ value: 'all', text: '鍏ㄩ儴' },
{ value: '0', text: '寰呭鏍? },
{ value: '1', text: '宸查€氳繃' },
{ value: '-1', text: '宸查┏鍥? }
])
const methodOptions = ref([
{ value: 'all', text: '全部' },
{ value: 'alipay', text: '支付宝' },
{ value: 'bank', text: '银行卡' },
{ value: 'weixin', text: '微信' }
{ value: 'all', text: '鍏ㄩ儴' },
{ value: 'alipay', text: '鏀粯瀹? },
{ value: 'bank', text: '閾惰鍗? },
{ value: 'weixin', text: '寰俊' }
])
const statusLabel = computed(() => {
const item = statusOptions.value.find((opt: any) => opt.value === statusValue.value)
return item ? item.text : '全部'
return item ? item.text : '鍏ㄩ儴'
})
const methodLabel = computed(() => {
const item = methodOptions.value.find((opt: any) => opt.value === methodValue.value)
return item ? item.text : '全部'
return item ? item.text : '鍏ㄩ儴'
})
const stats = ref([
{ label: '佣金总金额', value: '676809.25', icon: '$', colorClass: 'blue' },
{ label: '待提现金额', value: '71', icon: '¥', colorClass: 'orange' },
{ label: '已提现金额', value: '68879.25', icon: '$', colorClass: 'green' },
{ label: '未提现金额', value: '607930.00', icon: '¥', colorClass: 'pink' }
{ label: '浣ｉ噾鎬婚噾棰?, value: '676809.25', icon: '$', colorClass: 'blue' },
{ label: '寰呮彁鐜伴噾棰?, value: '71', icon: '楼', colorClass: 'orange' },
{ label: '宸叉彁鐜伴噾棰?, value: '68879.25', icon: '$', colorClass: 'green' },
{ label: '鏈彁鐜伴噾棰?, value: '607930.00', icon: '楼', colorClass: 'pink' }
])
const tableData = ref([
{
id: 57,
nickname: '用户昵称: 177****766',
nickname: '鐢ㄦ埛鏄电О: 177****766',
userId: '58837',
amount: '20.00',
fee: '0.00',
netAmount: '20.00',
name: '接口',
type: '支付宝',
name: '鎺ュ彛',
type: '鏀粯瀹?,
account: '1195953899',
time: '2025-10-24 16:04',
remark: ''
},
{
id: 56,
nickname: '用户昵称: 测试员的',
nickname: '鐢ㄦ埛鏄电О: 娴嬭瘯鍛樼殑',
userId: '20695',
amount: '1.00',
fee: '0.00',
netAmount: '1.00',
name: '123',
type: '银行卡',
type: '閾惰鍗?,
account: '4001231221',
bank: '中国银行',
bank: '涓浗閾惰',
time: '2025-07-04 15:11',
remark: ''
}
@@ -206,7 +206,7 @@ const handleQuery = () => {
min-height: 100vh;
}
/* 筛选样式更新 */
/* 绛涢€夋牱寮忔洿鏂?*/
.filter-card {
background-color: #fff;
padding: 24px;
@@ -284,7 +284,7 @@ const handleQuery = () => {
margin-bottom: 16px;
}
/* 统计卡片样式 */
/* 缁熻鍗＄墖鏍峰紡 */
.stats-grid {
display: flex;
flex-direction: row;
@@ -338,7 +338,7 @@ const handleQuery = () => {
margin-top: 6px;
}
/* 操作区域 */
/* 鎿嶄綔鍖哄煙 */
.action-section {
margin-bottom: 12px;
display: flex;
@@ -359,9 +359,9 @@ const handleQuery = () => {
font-size: 13px;
}
/* 表格容器样式 (Flex 模拟) */
/* 琛ㄦ牸瀹瑰櫒鏍峰紡 (Flex 妯℃嫙) */
.table-container {
background-color: #fff;
border-radius: 4px;
overflow: hidden;
display: flex;
@@ -411,7 +411,7 @@ const handleQuery = () => {
color: #606266;
}
/* 列宽定义 (与截图匹配) */
/* 鍒楀瀹氫箟 (涓庢埅鍥惧尮閰? */
.col-id { width: 60px; }
.col-user { width: 180px; justify-content: flex-start; }
.col-amount { width: 100px; }
@@ -424,7 +424,7 @@ const handleQuery = () => {
.col-status { width: 100px; }
.col-ops { width: 160px; }
/* 用户信息单元格 */
/* 鐢ㄦ埛淇℃伅鍗曞厓鏍?*/
.user-info-box {
display: flex;
flex-direction: row;
@@ -463,7 +463,7 @@ const handleQuery = () => {
color: #909399;
}
/* 提现方式单元格 */
/* 鎻愮幇鏂瑰紡鍗曞厓鏍?*/
.method-box {
display: flex;
flex-direction: column;
@@ -480,7 +480,7 @@ const handleQuery = () => {
font-weight: 600;
}
/* 收款码 */
/* 鏀舵鐮?*/
.qr-box {
width: 40px;
height: 40px;
@@ -496,7 +496,7 @@ const handleQuery = () => {
font-size: 16px;
}
/* 操作项 */
/* 鎿嶄綔椤?*/
.ops-box {
display: flex;
flex-direction: row;
@@ -515,3 +515,4 @@ const handleQuery = () => {
font-size: 12px;
}
</style>