feat: 银行端

This commit is contained in:
FlowerWater
2025-12-20 12:43:50 +08:00
parent 9591234e70
commit 06df763ed4
21 changed files with 3473 additions and 230 deletions

2
.gitignore vendored
View File

@@ -45,4 +45,4 @@ src/manifest.json
# 更新 uni-app 官方版本 # 更新 uni-app 官方版本
# npx @dcloudio/uvm@latest # npx @dcloudio/uvm@latest
src/pages.json # src/pages.json

View File

@@ -37,6 +37,7 @@ export default defineUniPages({
{ path: 'me/index', style: { navigationBarTitleText: '商家中心' } }, { path: 'me/index', style: { navigationBarTitleText: '商家中心' } },
{ path: 'me/shop', style: { navigationBarTitleText: '店铺设置' } }, { path: 'me/shop', style: { navigationBarTitleText: '店铺设置' } },
{ path: 'me/account', style: { navigationBarTitleText: '账号安全' } }, { path: 'me/account', style: { navigationBarTitleText: '账号安全' } },
{ path: 'loan/assist', style: { navigationBarTitleText: '贷款辅助材料' } },
], ],
}, },
{ {
@@ -44,6 +45,7 @@ export default defineUniPages({
pages: [ pages: [
{ path: 'dashboard/index', style: { navigationBarTitleText: '银行工作台' } }, { path: 'dashboard/index', style: { navigationBarTitleText: '银行工作台' } },
{ path: 'audit/list', style: { navigationBarTitleText: '审核列表' } }, { path: 'audit/list', style: { navigationBarTitleText: '审核列表' } },
{ path: 'audit/detail', style: { navigationBarTitleText: '审核详情' } },
{ path: 'customer/list', style: { navigationBarTitleText: '客户管理' } }, { path: 'customer/list', style: { navigationBarTitleText: '客户管理' } },
{ path: 'me/index', style: { navigationBarTitleText: '银行中心' } }, { path: 'me/index', style: { navigationBarTitleText: '银行中心' } },
], ],

231
src/api/loan.ts Normal file
View File

@@ -0,0 +1,231 @@
// import { request } from '@/utils/http'
import type { LoanApplication, RelatedMerchant, AssistMaterial } from '@/typings/loan'
import { LoanStatus } from '@/typings/loan'
/**
* [用户端] 获取用户交易过的商家列表
*/
export function getUserMerchants() {
// Mock数据
return new Promise<{ list: RelatedMerchant[] }>((resolve) => {
setTimeout(() => {
resolve({
list: [
{
merchantId: 'M001',
merchantName: '乐高玩具旗舰店',
lastTradeTime: '2025-12-01',
selected: false,
assistStatus: 'pending'
},
{
merchantId: 'M002',
merchantName: '迪士尼官方店',
lastTradeTime: '2025-11-20',
selected: false,
assistStatus: 'pending'
},
{
merchantId: 'M003',
merchantName: '泡泡玛特',
lastTradeTime: '2025-11-15',
selected: false,
assistStatus: 'pending'
},
{
merchantId: 'M004',
merchantName: '奥特曼官方玩具店',
lastTradeTime: '2025-11-10',
selected: false,
assistStatus: 'pending'
},
{
merchantId: 'M005',
merchantName: '玩具反斗城',
lastTradeTime: '2025-11-05',
selected: false,
assistStatus: 'pending'
},
{
merchantId: 'M006',
merchantName: 'KidsLand',
lastTradeTime: '2025-10-20',
selected: false,
assistStatus: 'pending'
}
]
})
}, 500)
})
}
/**
* [用户端] 提交贷款申请
*/
export function submitLoanApplication(data: any) {
return new Promise<{ id: string }>((resolve) => {
setTimeout(() => {
resolve({ id: `LA${Date.now()}` })
}, 1000)
})
}
// 模拟数据库
let mockDatabase: LoanApplication[] = []
/**
* [银行端] 获取贷款申请列表
*/
export function getLoanApplicationList(params: any) {
return new Promise<{ list: LoanApplication[], total: number }>((resolve) => {
setTimeout(() => {
// 如果没有数据,初始化一些 Mock 数据
if (mockDatabase.length === 0) {
mockDatabase = [
{
id: 'LA20251219001',
userId: 'U001',
userName: '张三',
userPhone: '13800138000',
amount: 50,
term: 1,
status: LoanStatus.SUBMITTED,
createTime: '2025-12-19 10:00:00',
updateTime: '2025-12-19 10:00:00',
relatedMerchants: [
{
merchantId: 'M001',
merchantName: '乐高玩具旗舰店',
lastTradeTime: '2025-12-01',
selected: true,
assistStatus: 'pending'
}
],
personalInfo: {
name: '张三',
phone: '13800138000',
idCard: '440106199001011234',
region: ['广东省', '广州市', '天河区'],
detailAddress: '天河路1号'
},
businessInfo: {
businessProject: '玩具零售',
businessTime: '3年',
annualIncome: 100,
hasDebt: 'no',
loanDemand: 50,
assets: ['house', 'car']
},
documentInfo: {
businessLicense: 'https://via.placeholder.com/150',
otherMaterials: []
},
processRecords: []
}
]
}
resolve({
list: mockDatabase,
total: mockDatabase.length
})
}, 500)
})
}
/**
* [银行端] 获取贷款申请详情
*/
export function getLoanApplicationDetail(id: string) {
return new Promise<LoanApplication>((resolve, reject) => {
setTimeout(() => {
const item = mockDatabase.find(i => i.id === id)
if (item) {
resolve(item)
} else {
// Fallback for demo
if (mockDatabase.length > 0) resolve(mockDatabase[0])
else reject('Not found')
}
}, 500)
})
}
/**
* [银行端] 流程操作
*/
export function operateLoanApplication(id: string, action: string, data?: any) {
return new Promise<void>((resolve) => {
setTimeout(() => {
const item = mockDatabase.find(i => i.id === id)
if (item) {
// 更新状态逻辑
switch (action) {
case 'accept': item.status = LoanStatus.ACCEPTED; break;
case 'investigate': item.status = LoanStatus.INVESTIGATING; break;
case 'report': item.status = LoanStatus.REPORTED; break;
case 'approve': item.status = LoanStatus.APPROVED; break;
case 'sign': item.status = LoanStatus.SIGNED; break;
case 'disburse': item.status = LoanStatus.DISBURSED; break;
case 'reject': item.status = LoanStatus.REJECTED; break;
}
// 添加记录
item.processRecords.push({
step: action as any,
operator: '银行管理员',
operateTime: new Date().toLocaleString(),
...data
})
}
resolve()
}, 500)
})
}
/**
* [商家端] 获取待办列表
*/
export function getMerchantPendingAssistList() {
return new Promise<{ list: any[] }>((resolve) => {
setTimeout(() => {
// 找到所有关联了当前商家的未处理申请
// 这里简化逻辑,直接返回 Mock
resolve({
list: [
{
loanId: 'LA20251219001',
userName: '张三',
applyTime: '2025-12-19 10:00:00',
amount: 50,
status: 'pending'
}
]
})
}, 500)
})
}
/**
* [商家端] 提交辅助材料
*/
export function submitAssistMaterial(loanId: string, materials: any[]) {
return new Promise<void>((resolve) => {
setTimeout(() => {
const item = mockDatabase.find(i => i.id === loanId)
// 简化:更新第一个匹配的商家状态
if (item && item.relatedMerchants.length > 0) {
item.relatedMerchants[0].assistStatus = 'submitted'
item.relatedMerchants[0].materials = {
merchantId: item.relatedMerchants[0].merchantId,
merchantName: item.relatedMerchants[0].merchantName,
loanApplicationId: loanId,
materials: materials,
submitTime: new Date().toLocaleString(),
status: 'submitted'
}
}
resolve()
}, 800)
})
}

288
src/pages.json Normal file
View File

@@ -0,0 +1,288 @@
{
"globalStyle": {
"navigationStyle": "default",
"navigationBarTitleText": "unibest",
"navigationBarBackgroundColor": "#f8f8f8",
"navigationBarTextStyle": "black",
"backgroundColor": "#FFFFFF"
},
"easycom": {
"autoscan": true,
"custom": {
"^fg-(.*)": "@/components/fg-$1/fg-$1.vue",
"^(?!z-paging-refresh|z-paging-load-more)z-paging(.*)": "z-paging/components/z-paging$1/z-paging$1.vue",
"^wd-(.*)": "wot-design-uni/components/wd-$1/wd-$1.vue"
}
},
"preloadRule": {
"pages/login/index": {
"network": "all",
"packages": [
"pagesMerchant",
"pagesBank"
]
}
},
"pages": [
// GENERATED BY UNI-PAGES, PLATFORM: H5
{
"path": "pages/index/index",
"type": "home",
"style": {
"navigationBarTitleText": "数字广东"
}
},
{
"path": "pages/finance/credit",
"type": "page",
"style": {
"navigationBarTitleText": "信用额度",
"enablePullDownRefresh": true
}
},
{
"path": "pages/finance/settlement",
"type": "page",
"style": {
"navigationBarTitleText": "应结账款",
"enablePullDownRefresh": true
}
},
{
"path": "pages/goods/cart",
"type": "page",
"style": {
"navigationBarTitleText": "购物车"
}
},
{
"path": "pages/goods/detail",
"type": "page",
"style": {
"navigationBarTitleText": "商品详情",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/login/index",
"type": "page",
"style": {
"navigationBarTitleText": "登录",
"navigationBarBackgroundColor": "#ffffff"
}
},
{
"path": "pages/me/loan-application-records",
"type": "page",
"style": {
"navigationBarTitleText": "助贷申请记录",
"navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/me/loan-application",
"type": "page",
"style": {
"navigationBarTitleText": "贷款申请",
"navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/me/me",
"type": "page",
"style": {
"navigationBarTitleText": "我的",
"navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/member/index",
"type": "page",
"style": {
"navigationBarTitleText": "会员中心",
"navigationBarBackgroundColor": "#1a1a1a",
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/order/confirm",
"type": "page",
"style": {
"navigationBarTitleText": "确认订单"
}
},
{
"path": "pages/order/detail",
"type": "page",
"style": {
"navigationBarTitleText": "订单详情"
}
},
{
"path": "pages/order/list",
"type": "page",
"style": {
"navigationBarTitleText": "我的订单",
"enablePullDownRefresh": true
}
},
{
"path": "pages/sort/index",
"type": "page",
"style": {
"navigationBarTitleText": "分类",
"disableScroll": true
}
}
],
"subPackages": [
{
"root": "pagesMerchant",
"pages": [
// GENERATED BY UNI-PAGES, PLATFORM: H5
{
"path": "dashboard/index",
"style": {
"navigationBarTitleText": "商家工作台"
}
},
{
"path": "order/list",
"style": {
"navigationBarTitleText": "订单管理"
}
},
{
"path": "order/detail",
"style": {
"navigationBarTitleText": "订单详情"
}
},
{
"path": "goods/list",
"style": {
"navigationBarTitleText": "商品管理"
}
},
{
"path": "goods/edit",
"style": {
"navigationBarTitleText": "编辑商品"
}
},
{
"path": "finance/index",
"style": {
"navigationBarTitleText": "财务中心"
}
},
{
"path": "finance/settlement",
"style": {
"navigationBarTitleText": "结算记录"
}
},
{
"path": "finance/withdraw",
"style": {
"navigationBarTitleText": "申请提现"
}
},
{
"path": "me/index",
"style": {
"navigationBarTitleText": "商家中心"
}
},
{
"path": "me/shop",
"style": {
"navigationBarTitleText": "店铺设置"
}
},
{
"path": "me/account",
"style": {
"navigationBarTitleText": "账号安全"
}
},
{
"path": "loan/assist",
"style": {
"navigationBarTitleText": "贷款辅助材料"
}
}
]
},
{
"root": "pagesBank",
"pages": [
// GENERATED BY UNI-PAGES, PLATFORM: H5
{
"path": "dashboard/index",
"style": {
"navigationBarTitleText": "银行工作台"
}
},
{
"path": "audit/list",
"style": {
"navigationBarTitleText": "审核列表"
}
},
{
"path": "audit/detail",
"style": {
"navigationBarTitleText": "审核详情"
}
},
{
"path": "customer/list",
"style": {
"navigationBarTitleText": "客户管理"
}
},
{
"path": "me/index",
"style": {
"navigationBarTitleText": "银行中心"
}
}
]
}
],
"tabBar": {
"custom": true,
"color": "#999999",
"selectedColor": "#018d71",
"backgroundColor": "#F8F8F8",
"borderStyle": "black",
"height": "50px",
"fontSize": "10px",
"iconWidth": "24px",
"spacing": "3px",
"list": [
// GENERATED BY UNI-PAGES, PLATFORM: H5
{
"text": "首页",
"pagePath": "pages/index/index"
},
{
"text": "分类",
"pagePath": "pages/sort/index"
},
{
"text": "购物车",
"pagePath": "pages/goods/cart"
},
{
"text": "我的",
"pagePath": "pages/me/me"
}
]
}
}

View File

@@ -352,15 +352,25 @@ function validateForm() {
} }
// 提交表单 // 提交表单
function handleSubmit() { async function handleSubmit() {
// 取消表单校验,直接提交 if (!validateForm()) return
uni.showLoading({ uni.showLoading({
title: '提交中...' title: '提交中...'
}) })
// 模拟提交 try {
setTimeout(() => { // 收集选中的商家
const selectedMerchants = merchantList.value.filter(item => item.selected)
// 构建提交数据
const submitData = {
...formData.value,
relatedMerchants: selectedMerchants
}
await submitLoanApplication(submitData)
uni.hideLoading() uni.hideLoading()
uni.showToast({ uni.showToast({
title: '提交成功', title: '提交成功',
@@ -371,13 +381,48 @@ function handleSubmit() {
setTimeout(() => { setTimeout(() => {
uni.navigateBack() uni.navigateBack()
}, 1500) }, 1500)
}, 2000) } catch (error) {
uni.hideLoading()
uni.showToast({
title: '提交失败',
icon: 'none'
})
}
} }
// 返回上一页 // 返回上一页
function handleBack() { function handleBack() {
uni.navigateBack() uni.navigateBack()
} }
// 商家选择相关
import { getUserMerchants, submitLoanApplication } from '@/api/loan'
import type { RelatedMerchant } from '@/typings/loan'
const merchantList = ref<RelatedMerchant[]>([])
onMounted(async () => {
const res = await getUserMerchants()
merchantList.value = res.list
})
function toggleMerchant(item: RelatedMerchant) {
item.selected = !item.selected
}
// 展开/收起逻辑
const isExpanded = ref(false)
const displayedMerchants = computed(() => {
if (isExpanded.value) {
return merchantList.value
}
return merchantList.value.slice(0, 3)
})
function toggleExpand() {
isExpanded.value = !isExpanded.value
}
</script> </script>
<template> <template>
@@ -558,6 +603,51 @@ function handleBack() {
</view> </view>
</view> </view>
<!-- 关联商家模块 -->
<view class="form-card">
<view class="card-title">
<view class="title-bar"></view>
<text class="title-text">关联商家 (辅助证明)</text>
</view>
<view class="form-content">
<view class="merchant-tip">
选择交易过的商家系统将通知商家为您提供交易辅助材料有助于提高审批通过率
</view>
<view class="merchant-list">
<view
v-for="item in displayedMerchants"
:key="item.merchantId"
class="merchant-item"
:class="{ active: item.selected }"
@click="toggleMerchant(item)"
>
<view class="check-box">
<text v-if="item.selected" class="i-carbon-checkmark"></text>
</view>
<view class="merchant-info">
<text class="name">{{ item.merchantName }}</text>
<text class="time">最近交易: {{ item.lastTradeTime }}</text>
</view>
</view>
<!-- 展开/收起按钮 -->
<view
v-if="merchantList.length > 3"
class="expand-btn"
@click="toggleExpand"
>
<text>{{ isExpanded ? '收起' : '展开更多 (' + (merchantList.length - 3) + ')' }}</text>
<text
class="i-carbon-chevron-down arrow"
:class="{ up: isExpanded }"
></text>
</view>
</view>
</view>
</view>
<!-- 证件信息模块 --> <!-- 证件信息模块 -->
<view class="form-card"> <view class="form-card">
<view class="card-title"> <view class="card-title">
@@ -911,6 +1001,8 @@ function handleBack() {
color: #FF4D4F; color: #FF4D4F;
margin-top: 8rpx; margin-top: 8rpx;
} }
} }
.submit-bar { .submit-bar {
@@ -939,4 +1031,101 @@ function handleBack() {
} }
} }
} }
</style>
<style lang="scss" scoped>
/* 补充商家选择样式 */
.merchant-tip {
font-size: 26rpx;
color: #666;
background: #fdf5e6;
padding: 20rpx;
border-radius: 8rpx;
margin-bottom: 24rpx;
line-height: 1.5;
}
.merchant-list {
display: flex;
flex-direction: column;
gap: 20rpx;
.merchant-item {
display: flex;
align-items: center;
padding: 20rpx;
background: #f8f8f8;
border-radius: 12rpx;
border: 2rpx solid transparent;
transition: all 0.2s;
&.active {
background: #e6f7eb;
border-color: #28c445;
.check-box {
background: #28c445;
border-color: #28c445;
}
}
.check-box {
width: 40rpx;
height: 40rpx;
border: 2rpx solid #ddd;
border-radius: 8rpx;
margin-right: 20rpx;
display: flex;
align-items: center;
justify-content: center;
background: #fff;
flex-shrink: 0; /* 防止压缩 */
text {
font-size: 28rpx;
color: #fff;
}
}
.merchant-info {
display: flex;
flex-direction: column;
.name {
font-size: 30rpx;
color: #333;
font-weight: 500;
margin-bottom: 6rpx;
}
.time {
font-size: 24rpx;
color: #999;
}
}
}
.expand-btn {
display: flex;
align-items: center;
justify-content: center;
padding: 20rpx 0;
gap: 8rpx;
font-size: 26rpx;
color: #666;
.arrow {
transition: transform 0.3s;
font-size: 24rpx;
&.up {
transform: rotate(180deg);
}
}
&:active {
opacity: 0.7;
}
}
}
</style> </style>

View File

@@ -205,6 +205,11 @@ function handleLogout() {
<!-- 常用功能 --> <!-- 常用功能 -->
<view class="section-card"> <view class="section-card">
<view class="cell-group"> <view class="cell-group">
<view class="cell" @click="navigateTo('/pages/me/loan-application')">
<text class="i-carbon-money icon"></text>
<text class="label">我要借钱</text>
<text class="i-carbon-chevron-right arrow"></text>
</view>
<view class="cell" @click="navigateTo('/pages/me/loan-application-records')"> <view class="cell" @click="navigateTo('/pages/me/loan-application-records')">
<text class="i-carbon-document-attachment icon"></text> <text class="i-carbon-document-attachment icon"></text>
<text class="label">助贷申请进度</text> <text class="label">助贷申请进度</text>

175
src/pagesBank/api/index.ts Normal file
View File

@@ -0,0 +1,175 @@
import type {
BankStats,
AuditItem,
AuditStatus,
BankCustomer,
WithdrawAuditDetail
} from '@/typings/bank'
import {
mockBankStats,
mockAuditList,
getMockWithdrawDetail,
mockCustomerList
} from '../mock'
/** 获取银行端首页统计 */
export function getBankStats(): Promise<BankStats> {
return new Promise((resolve) => {
setTimeout(() => {
resolve(mockBankStats)
}, 500)
})
}
/** 获取审核列表 */
export function getAuditList(params: {
status?: AuditStatus
type?: string
pageNum: number
pageSize: number
keyword?: string
}): Promise<{ list: AuditItem[]; total: number }> {
return new Promise((resolve) => {
setTimeout(() => {
let list = [...mockAuditList]
// 状态筛选
if (params.status) {
list = list.filter(item => item.status === params.status)
}
// 关键词筛选
if (params.keyword) {
const keyword = params.keyword.toLowerCase()
list = list.filter(item =>
item.merchantName.toLowerCase().includes(keyword) ||
item.id.toLowerCase().includes(keyword)
)
}
resolve({ list, total: list.length })
}, 500)
})
}
/** 获取提现审核详情 */
export function getWithdrawAuditDetail(id: string): Promise<WithdrawAuditDetail> {
return new Promise((resolve) => {
setTimeout(() => {
resolve(getMockWithdrawDetail(id))
}, 500)
})
}
/** 提交审核结果 */
export function submitAudit(data: {
id: string
status: AuditStatus
rejectReason?: string
}): Promise<boolean> {
return new Promise((resolve) => {
setTimeout(() => {
// 模拟更新本地 mock 数据状态
const item = mockAuditList.find(i => i.id === data.id)
if (item) {
item.status = data.status
}
resolve(true)
}, 500)
})
}
/** 获取客户列表 */
export function getCustomerList(params: {
status?: string
pageNum: number
pageSize: number
keyword?: string
}): Promise<{ list: BankCustomer[]; total: number }> {
return new Promise((resolve) => {
setTimeout(() => {
let list = [...mockCustomerList]
if (params.status) {
list = list.filter(item => item.status === params.status)
}
if (params.keyword) {
const keyword = params.keyword.toLowerCase()
list = list.filter(item =>
item.merchantName.toLowerCase().includes(keyword) ||
item.contactName.toLowerCase().includes(keyword)
)
}
resolve({ list, total: list.length })
}, 500)
})
}
/** 获取客户详情 */
export function getCustomerDetail(id: string): Promise<BankCustomer | null> {
return new Promise((resolve) => {
setTimeout(() => {
const customer = mockCustomerList.find(item => item.id === id)
resolve(customer || null)
}, 500)
})
}
/** 更新客户授信额度 */
export function updateCustomerCredit(data: {
merchantId: string
creditLimit: number
}): Promise<boolean> {
return new Promise((resolve) => {
setTimeout(() => {
const customer = mockCustomerList.find(item => item.merchantId === data.merchantId)
if (customer) {
customer.creditLimit = data.creditLimit
}
resolve(true)
}, 500)
})
}
/** 冻结/解冻客户 */
export function freezeCustomer(id: string, status: 'normal' | 'frozen'): Promise<boolean> {
return new Promise((resolve) => {
setTimeout(() => {
const customer = mockCustomerList.find(item => item.id === id)
if (customer) {
customer.status = status === 'frozen' ? 'frozen' : 'normal'
}
resolve(true)
}, 500)
})
}
import { mockTransactions, mockWithdrawHistory } from '../mock'
/** 获取客户交易流水 */
export function getCustomerTransactions(params: {
merchantId: string
pageNum: number
pageSize: number
}): Promise<{ list: any[]; total: number }> {
return new Promise((resolve) => {
setTimeout(() => {
resolve({ list: mockTransactions, total: mockTransactions.length })
}, 500)
})
}
/** 获取客户提现记录 */
export function getCustomerWithdraws(params: {
merchantId: string
pageNum: number
pageSize: number
}): Promise<{ list: any[]; total: number }> {
return new Promise((resolve) => {
setTimeout(() => {
resolve({ list: mockWithdrawHistory, total: mockWithdrawHistory.length })
}, 500)
})
}

View File

@@ -0,0 +1,452 @@
<script lang="ts" setup>
import { getLoanApplicationDetail, operateLoanApplication } from '@/api/loan'
import { LoanStatus } from '@/typings/loan'
import type { LoanApplication, RelatedMerchant } from '@/typings/loan'
definePage({
style: {
navigationBarTitleText: '贷款审核详情',
},
})
const id = ref('')
const detail = ref<LoanApplication | null>(null)
const loading = ref(false)
// 流程步骤定义
const steps = [
{ key: LoanStatus.SUBMITTED, label: '申请' },
{ key: LoanStatus.ACCEPTED, label: '受理' },
{ key: LoanStatus.INVESTIGATING, label: '调查' },
{ key: LoanStatus.APPROVING, label: '审批' },
{ key: LoanStatus.SIGNING, label: '签约' },
{ key: LoanStatus.DISBURSED, label: '放款' }
]
// 获取当前步骤索引
const currentStepIndex = computed(() => {
if (!detail.value) return 0
const status = detail.value.status
const index = steps.findIndex(s => s.key === status)
// 特殊处理中间状态映射
if (status === LoanStatus.REPORTED) return 3 // 上报后进入审批阶段
if (status === LoanStatus.APPROVED) return 4 // 审批通过等待签约
if (status === LoanStatus.SIGNED) return 5 // 签约完成等待放款
return index > -1 ? index : 0
})
async function loadDetail() {
loading.value = true
try {
const res = await getLoanApplicationDetail(id.value)
detail.value = res
} finally {
loading.value = false
}
}
// 流程操作
async function handleAction(action: string) {
let data = null
if (action === 'investigate') {
// 模拟录入调查报告
const res = await uni.showModal({
title: '录入调查报告',
editable: true,
placeholderText: '请输入实地调查情况...'
})
if (!res.confirm) return
data = { report: res.content }
} else if (action === 'approve' || action === 'reject') {
const res = await uni.showModal({
title: action === 'approve' ? '确认通过' : '确认拒绝',
editable: true,
placeholderText: '请输入审批意见...'
})
if (!res.confirm) return
data = { opinion: res.content }
} else if (action === 'disburse') {
const res = await uni.showModal({
title: '确认放款',
content: `确认发放贷款 ${detail.value?.amount} 万元?`
})
if (!res.confirm) return
}
uni.showLoading({ title: '处理中...' })
try {
await operateLoanApplication(id.value, action, data)
uni.showToast({ title: '操作成功', icon: 'success' })
loadDetail() // 刷新详情
} finally {
uni.hideLoading()
}
}
function previewImage(url: string) {
uni.previewImage({ urls: [url] })
}
onLoad((options) => {
if (options?.id) {
id.value = options.id
loadDetail()
}
})
</script>
<template>
<view class="audit-detail-page">
<view v-if="loading" class="loading-state">加载中...</view>
<template v-else-if="detail">
<!-- 流程步骤条 -->
<view class="step-card">
<view class="steps">
<view
v-for="(step, index) in steps"
:key="step.key"
class="step-item"
:class="{ active: index <= currentStepIndex, current: index === currentStepIndex }"
>
<view class="step-icon">
<text class="num" v-if="index > currentStepIndex">{{ index + 1 }}</text>
<text class="i-carbon-checkmark" v-else></text>
</view>
<text class="step-label">{{ step.label }}</text>
<view class="step-line" v-if="index < steps.length - 1"></view>
</view>
</view>
</view>
<!-- 核心信息 -->
<view class="info-card">
<div class="header">
<div class="user">
<text class="name">{{ detail.personalInfo.name }}</text>
<text class="phone">{{ detail.personalInfo.phone }}</text>
</div>
<text class="status-tag">{{ detail.status }}</text>
</div>
<div class="amount-box">
<div class="item">
<text class="label">申请金额</text>
<text class="value">{{ detail.amount }}<text class="unit"></text></text>
</div>
<div class="item">
<text class="label">申请期限</text>
<text class="value">{{ detail.term }}<text class="unit"></text></text>
</div>
</div>
</view>
<!-- 关联商家及辅助材料 -->
<view class="section-card">
<view class="card-header">
<text class="title">关联商家 (辅助材料)</text>
</view>
<view class="merchant-list">
<view
v-for="merchant in detail.relatedMerchants"
:key="merchant.merchantId"
class="merchant-item"
>
<view class="m-header">
<text class="m-name">{{ merchant.merchantName }}</text>
<text
class="m-status"
:class="merchant.assistStatus"
>
{{ merchant.assistStatus === 'submitted' ? '已提交材料' : '未提交' }}
</text>
</view>
<!-- 材料展示 -->
<view class="materials" v-if="merchant.materials?.materials.length">
<view
v-for="(img, idx) in merchant.materials.materials"
:key="idx"
class="img-item"
@click="previewImage(img.url)"
>
<image :src="img.url" mode="aspectFill" />
<text class="type-tag">{{ img.type }}</text>
</view>
</view>
</view>
</view>
</view>
<!-- 经营信息 -->
<view class="section-card">
<view class="card-header">经营信息</view>
<view class="cell-group">
<view class="cell">
<text class="label">经营项目</text>
<text class="value">{{ detail.businessInfo.businessProject }}</text>
</view>
<view class="cell">
<text class="label">年收入</text>
<text class="value">{{ detail.businessInfo.annualIncome }}</text>
</view>
<view class="cell">
<text class="label">负债情况</text>
<text class="value">{{ detail.businessInfo.hasDebt === 'yes' ? '有负债' : '无负债' }}</text>
</view>
</view>
</view>
<!-- 底部操作栏 -->
<view class="action-bar safe-area-bottom">
<template v-if="detail.status === LoanStatus.SUBMITTED">
<button class="btn primary" @click="handleAction('accept')">受理申请</button>
</template>
<template v-else-if="detail.status === LoanStatus.ACCEPTED">
<button class="btn primary" @click="handleAction('investigate')">开始上门调查</button>
</template>
<template v-else-if="detail.status === LoanStatus.INVESTIGATING">
<button class="btn primary" @click="handleAction('report')">提交调查报告</button>
</template>
<template v-else-if="[LoanStatus.REPORTED, LoanStatus.APPROVING].includes(detail.status)">
<button class="btn danger" @click="handleAction('reject')">拒绝</button>
<button class="btn primary" @click="handleAction('approve')">通过审批</button>
</template>
<template v-else-if="detail.status === LoanStatus.APPROVED">
<button class="btn primary" @click="handleAction('sign')">完成签约</button>
</template>
<template v-else-if="detail.status === LoanStatus.SIGNED">
<button class="btn success" @click="handleAction('disburse')">确认放款</button>
</template>
</view>
</template>
</view>
</template>
<style lang="scss" scoped>
.audit-detail-page {
min-height: 100vh;
background: #f5f7fa;
padding: 20rpx;
padding-bottom: 120rpx;
}
.step-card {
background: #fff;
padding: 30rpx 20rpx;
border-radius: 16rpx;
margin-bottom: 20rpx;
.steps {
display: flex;
justify-content: space-between;
.step-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
.step-icon {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
background: #f0f0f0;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
color: #999;
margin-bottom: 10rpx;
z-index: 1;
}
.step-label {
font-size: 20rpx;
color: #999;
}
.step-line {
position: absolute;
top: 20rpx;
left: 50%;
width: 100%;
height: 2rpx;
background: #f0f0f0;
z-index: 0;
}
&.active {
.step-icon {
background: #e6f7eb;
color: #00c05a;
}
.step-label {
color: #333;
}
.step-line {
background: #00c05a;
}
}
&.current {
.step-icon {
background: #00c05a;
color: #fff;
}
.step-label {
font-weight: bold;
color: #00c05a;
}
}
}
}
}
.info-card {
background: linear-gradient(135deg, #00c05a 0%, #34d19d 100%);
border-radius: 16rpx;
padding: 30rpx;
color: #fff;
margin-bottom: 20rpx;
.header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30rpx;
.user {
.name { font-size: 32rpx; font-weight: bold; margin-right: 16rpx; }
.phone { font-size: 26rpx; opacity: 0.9; }
}
.status-tag {
background: rgba(255,255,255,0.2);
padding: 4rpx 16rpx;
border-radius: 8rpx;
font-size: 24rpx;
}
}
.amount-box {
display: flex;
.item {
flex: 1;
.label { display: block; font-size: 24rpx; opacity: 0.8; margin-bottom: 8rpx; }
.value { font-size: 40rpx; font-weight: bold;
.unit { font-size: 24rpx; font-weight: normal; margin-left: 4rpx; }
}
}
}
}
.section-card {
background: #fff;
border-radius: 16rpx;
padding: 0 30rpx;
margin-bottom: 20rpx;
.card-header {
padding: 30rpx 0;
border-bottom: 1rpx solid #f5f5f5;
font-size: 28rpx;
font-weight: bold;
color: #333;
}
.cell-group {
padding: 20rpx 0;
.cell {
display: flex;
justify-content: space-between;
padding: 16rpx 0;
font-size: 26rpx;
.label { color: #666; }
.value { color: #333; }
}
}
}
.merchant-list {
padding: 20rpx 0;
.merchant-item {
background: #f8f9fa;
border-radius: 12rpx;
padding: 20rpx;
margin-bottom: 20rpx;
.m-header {
display: flex;
justify-content: space-between;
margin-bottom: 16rpx;
.m-name { font-size: 28rpx; font-weight: bold; color: #333; }
.m-status { font-size: 24rpx; color: #999;
&.submitted { color: #00c05a; }
}
}
.materials {
display: flex;
gap: 16rpx;
flex-wrap: wrap;
.img-item {
position: relative;
width: 100rpx;
height: 100rpx;
image { width: 100%; height: 100%; border-radius: 8rpx; }
.type-tag {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.5);
color: #fff;
font-size: 18rpx;
text-align: center;
border-bottom-left-radius: 8rpx;
border-bottom-right-radius: 8rpx;
}
}
}
}
}
.action-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: #fff;
padding: 20rpx 30rpx;
box-shadow: 0 -2rpx 10rpx rgba(0,0,0,0.05);
display: flex;
gap: 20rpx;
z-index: 100;
.btn {
flex: 1;
font-size: 28rpx;
height: 80rpx;
line-height: 80rpx;
border-radius: 40rpx;
&.primary { background: #00c05a; color: #fff; }
&.danger { background: #fa4350; color: #fff; }
&.success { background: #00c05a; color: #fff; }
}
}
</style>

View File

@@ -1,49 +1,148 @@
<script lang="ts" setup> <script lang="ts" setup>
import { getLoanApplicationList } from '@/api/loan'
import { LoanStatus } from '@/typings/loan'
import type { LoanApplication } from '@/typings/loan'
definePage({ definePage({
style: { style: {
navigationBarTitleText: '审核列表', navigationBarTitleText: '审核列表',
enablePullDownRefresh: true
}, },
}) })
// 模拟审核数据 // 状态标签
const auditList = ref([ const tabs = [
{ id: '1', merchantName: '广州数字科技有限公司', amount: 50000.00, status: 'pending', time: '2小时前' }, { label: '全部', value: '' },
{ id: '2', merchantName: '深圳智慧商贸公司', amount: 128000.00, status: 'pending', time: '3小时前' }, { label: '待处理', value: LoanStatus.SUBMITTED }, // 包含提交/受理等
{ id: '3', merchantName: '佛山电子商务公司', amount: 35000.00, status: 'approved', time: '昨天' }, { label: '已通过', value: LoanStatus.APPROVED },
]) { label: '已拒绝', value: LoanStatus.REJECTED },
]
const statusMap: Record<string, { text: string; color: string }> = { const activeTab = ref('')
pending: { text: '待审核', color: '#ff8f0d' }, const keyword = ref('')
approved: { text: '已通过', color: '#00c05a' }, const list = ref<LoanApplication[]>([])
rejected: { text: '已拒绝', color: '#fa4350' }, const loading = ref(false)
const statusMap: Record<string, { text: string; color: string; bgColor: string }> = {
[LoanStatus.SUBMITTED]: { text: '新申请', color: '#ff8f0d', bgColor: 'rgba(255, 143, 13, 0.1)' },
[LoanStatus.ACCEPTED]: { text: '已受理', color: '#4d80f0', bgColor: 'rgba(77, 128, 240, 0.1)' },
[LoanStatus.INVESTIGATING]: { text: '调查中', color: '#4d80f0', bgColor: 'rgba(77, 128, 240, 0.1)' },
[LoanStatus.REPORTED]: { text: '待审批', color: '#ff8f0d', bgColor: 'rgba(255, 143, 13, 0.1)' },
[LoanStatus.APPROVED]: { text: '已通过', color: '#00c05a', bgColor: 'rgba(0, 192, 90, 0.1)' },
[LoanStatus.REJECTED]: { text: '已拒绝', color: '#fa4350', bgColor: 'rgba(250, 67, 80, 0.1)' },
[LoanStatus.SIGNED]: { text: '已签约', color: '#00c05a', bgColor: 'rgba(0, 192, 90, 0.1)' },
[LoanStatus.DISBURSED]: { text: '已放款', color: '#00c05a', bgColor: 'rgba(0, 192, 90, 0.1)' },
} }
function handleAudit(id: string) { async function loadData() {
loading.value = true
try {
const res = await getLoanApplicationList({
status: activeTab.value || undefined,
keyword: keyword.value
})
list.value = res.list
} finally {
loading.value = false
uni.stopPullDownRefresh()
}
}
function handleTabChange(value: string) {
activeTab.value = value
loadData()
}
function handleSearch() {
loadData()
}
function handleDetail(id: string) {
uni.navigateTo({ url: `/pagesBank/audit/detail?id=${id}` }) uni.navigateTo({ url: `/pagesBank/audit/detail?id=${id}` })
} }
onMounted(() => {
loadData()
})
onPullDownRefresh(() => {
loadData()
})
</script> </script>
<template> <template>
<view class="audit-list-page"> <view class="audit-list-page">
<view class="audit-list"> <!-- 顶部状态栏 -->
<view class="sticky-header">
<view class="search-bar">
<view class="search-input">
<text class="i-carbon-search"></text>
<input
v-model="keyword"
placeholder="搜索申请人/单号"
confirm-type="search"
@confirm="handleSearch"
/>
</view>
</view>
<view class="tabs">
<view
v-for="tab in tabs"
:key="tab.value"
class="tab-item"
:class="{ active: activeTab === tab.value }"
@click="handleTabChange(tab.value)"
>
{{ tab.label }}
<view class="line"></view>
</view>
</view>
</view>
<!-- 列表内容 -->
<view class="list-container">
<view v-if="loading && list.length === 0" class="loading-state">
<text>加载中...</text>
</view>
<view v-else-if="list.length === 0" class="empty-state">
<text class="i-carbon-document-blank"></text>
<text>暂无相关贷申请</text>
</view>
<view <view
v-for="item in auditList" v-for="item in list"
:key="item.id" :key="item.id"
class="audit-card" class="audit-card"
@click="handleAudit(item.id)" @click="handleDetail(item.id)"
> >
<view class="audit-header"> <view class="card-top">
<text class="merchant-name">{{ item.merchantName }}</text> <view class="merchant-info">
<text class="audit-status" :style="{ color: statusMap[item.status].color }"> <text class="merchant-name">{{ item.userName }}的贷款申请</text>
{{ statusMap[item.status].text }} <text class="time">{{ item.createTime }}</text>
</view>
<text
class="status-tag"
:style="{ color: statusMap[item.status]?.color, backgroundColor: statusMap[item.status]?.bgColor }"
>
{{ statusMap[item.status]?.text || item.status }}
</text> </text>
</view> </view>
<view class="audit-body">
<text class="amount">申请金额¥{{ item.amount.toFixed(2) }}</text> <view class="card-content">
</view> <view class="info-row">
<view class="audit-footer"> <text class="label">申请金额</text>
<text class="time">{{ item.time }}</text> <text class="amount">¥{{ item.amount }}<text class="unit"></text></text>
<text class="action" v-if="item.status === 'pending'">去审核 </text> </view>
<view class="info-row">
<text class="label">期限</text>
<text class="val">{{ item.term }}</text>
</view>
<view class="info-row" v-if="item.relatedMerchants.length">
<text class="label">关联商家</text>
<text class="val">{{ item.relatedMerchants.length }} </text>
</view>
</view> </view>
</view> </view>
</view> </view>
@@ -53,69 +152,158 @@ function handleAudit(id: string) {
<style lang="scss" scoped> <style lang="scss" scoped>
.audit-list-page { .audit-list-page {
min-height: 100vh; min-height: 100vh;
background: #f5f5f5; background: #f8f9fa;
padding: 20rpx; padding-bottom: 30rpx;
} }
.audit-list { .sticky-header {
position: sticky;
top: 0;
z-index: 100;
background: #fff;
padding: 20rpx 0 0;
}
.search-bar {
padding: 0 30rpx 20rpx;
.search-input {
height: 72rpx;
background: #f1f3f5;
border-radius: 36rpx;
display: flex;
align-items: center;
padding: 0 30rpx;
gap: 16rpx;
text {
font-size: 32rpx;
color: #adb5bd;
}
input {
flex: 1;
font-size: 26rpx;
}
}
}
.tabs {
display: flex; display: flex;
flex-direction: column; justify-content: space-around;
gap: 20rpx; border-bottom: 1rpx solid #f1f3f5;
.tab-item {
padding: 20rpx 0;
font-size: 28rpx;
color: #495057;
position: relative;
&.active {
color: #00c05a;
font-weight: 700;
.line {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 6rpx;
background: #00c05a;
border-radius: 3rpx;
}
}
}
}
.list-container {
padding: 24rpx 30rpx;
} }
.audit-card { .audit-card {
background: #fff; background: #fff;
border-radius: 16rpx; border-radius: 20rpx;
padding: 24rpx; padding: 24rpx;
margin-bottom: 24rpx;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02);
.audit-header { .card-top {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: flex-start;
margin-bottom: 16rpx; margin-bottom: 24rpx;
.merchant-name { .merchant-info {
font-size: 28rpx;
font-weight: 600;
color: #333;
flex: 1; flex: 1;
overflow: hidden; display: flex;
text-overflow: ellipsis; flex-direction: column;
white-space: nowrap; gap: 8rpx;
.merchant-name {
font-size: 30rpx;
font-weight: 700;
color: #333;
}
.time {
font-size: 24rpx;
color: #999;
}
} }
.audit-status { .status-tag {
font-size: 24rpx; font-size: 22rpx;
font-weight: 500; padding: 6rpx 16rpx;
margin-left: 16rpx; border-radius: 8rpx;
}
}
.audit-body {
margin-bottom: 12rpx;
.amount {
font-size: 30rpx;
font-weight: 600; font-weight: 600;
color: #00c05a;
} }
} }
.audit-footer { .card-content {
background: #f8f9fa;
border-radius: 12rpx;
padding: 20rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center;
.time { .info-row {
font-size: 24rpx; display: flex;
color: #999; flex-direction: column;
}
.label { font-size: 24rpx; color: #999; margin-bottom: 4rpx; }
.action { .amount { font-size: 32rpx; font-weight: 700; color: #333; .unit { font-size: 24rpx; font-weight: normal; margin-left: 2rpx; } }
font-size: 24rpx; .val { font-size: 28rpx; color: #333; font-weight: 500; }
color: #00c05a;
font-weight: 500;
} }
} }
} }
.empty-state {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 100rpx 0;
color: #adb5bd;
gap: 20rpx;
text:first-child {
font-size: 80rpx;
}
text:last-child {
font-size: 28rpx;
}
}
.loading-state {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 100rpx 0;
color: #adb5bd;
text {
font-size: 28rpx;
}
}
</style> </style>

View File

@@ -0,0 +1,439 @@
<script lang="ts" setup>
import { getCustomerDetail, updateCustomerCredit, freezeCustomer } from '@/pagesBank/api'
import type { BankCustomer } from '@/typings/bank'
definePage({
style: {
navigationBarTitleText: '客户详情',
},
})
const id = ref('')
const detail = ref<BankCustomer | null>(null)
const loading = ref(false)
async function loadDetail() {
loading.value = true
try {
const res = await getCustomerDetail(id.value)
detail.value = res
} finally {
loading.value = false
}
}
function handleUpdateCredit() {
uni.showModal({
title: '调整授信额度',
placeholderText: '请输入新的授信额度 (元)',
editable: true,
success: async (res) => {
if (res.confirm) {
const amount = parseFloat(res.content)
if (isNaN(amount) || amount <= 0) {
uni.showToast({ title: '请输入正确的金额', icon: 'none' })
return
}
uni.showLoading({ title: '提交中...' })
try {
await updateCustomerCredit({
merchantId: detail.value!.merchantId,
creditLimit: amount
})
uni.showToast({ title: '调整成功', icon: 'success' })
loadDetail()
} finally {
uni.hideLoading()
}
}
}
})
}
function handleCall() {
if (detail.value?.contactPhone) {
uni.makePhoneCall({
phoneNumber: detail.value.contactPhone
})
}
}
function handleTransactions() {
uni.navigateTo({
url: `/pagesBank/customer/transaction-list?id=${id.value}&merchantId=${detail.value?.merchantId}`
})
}
function handleWithdraws() {
uni.navigateTo({
url: `/pagesBank/customer/withdraw-list?id=${id.value}&merchantId=${detail.value?.merchantId}`
})
}
function handleFreeze() {
const isFrozen = detail.value?.status === 'frozen'
uni.showModal({
title: isFrozen ? '解冻账户' : '冻结账户',
content: isFrozen ? '确定要解除该账户的冻结状态吗?' : '冻结后该商户将无法进行交易和提现,确定执行?',
success: async (res) => {
if (res.confirm) {
uni.showLoading({ title: '提交中...' })
try {
await freezeCustomer(id.value, isFrozen ? 'normal' : 'frozen')
uni.showToast({ title: '操作成功', icon: 'success' })
loadDetail()
} finally {
uni.hideLoading()
}
}
}
})
}
onLoad((options) => {
if (options?.id) {
id.value = options.id
loadDetail()
}
})
</script>
<template>
<view class="customer-detail-page">
<view v-if="loading" class="loading-box">加载中...</view>
<template v-else-if="detail">
<!-- 头部商户概览 -->
<view class="header-card">
<view class="merchant-base">
<image :src="detail.logo || '/static/images/avatar.jpg'" class="logo" mode="aspectFill" />
<view class="info">
<text class="name">{{ detail.merchantName }}</text>
<view class="tags">
<text class="tag">{{ detail.status === 'normal' ? '优质客户' : '风险预警' }}</text>
<text class="tag gold">V3会员</text>
</view>
</view>
</view>
<view class="stats-row">
<view class="stat-item">
<text class="label">可用余额</text>
<text class="value">¥{{ detail.balance.toLocaleString() }}</text>
</view>
<view class="divider"></view>
<view class="stat-item">
<text class="label">已用额度</text>
<text class="value highlight">¥{{ detail.usedLimit.toLocaleString() }}</text>
</view>
</view>
</view>
<!-- 授信管理 -->
<view class="section">
<view class="section-header">
<view class="title">授信管理</view>
<view class="action-btn" @click="handleUpdateCredit">调整额度</view>
</view>
<view class="credit-box">
<view class="progress-container">
<view class="progress-labels">
<text>当前总额度</text>
<text>¥{{ detail.creditLimit.toLocaleString() }}</text>
</view>
<view class="progress-bar">
<view
class="inner"
:style="{ width: (detail.usedLimit / detail.creditLimit * 100) + '%' }"
></view>
</view>
<view class="progress-footer">
<text>已使用 {{ (detail.usedLimit / detail.creditLimit * 100).toFixed(1) }}%</text>
<text>剩余 ¥{{ (detail.creditLimit - detail.usedLimit).toLocaleString() }}</text>
</view>
</view>
</view>
</view>
<!-- 联系信息 -->
<view class="section">
<view class="section-title">联系信息</view>
<view class="info-list">
<view class="info-item">
<text class="label">联系人</text>
<text class="value">{{ detail.contactName }}</text>
</view>
<view class="info-item" @click="handleCall">
<text class="label">联系电话</text>
<view class="value phone">
{{ detail.contactPhone }}
<text class="i-carbon-phone-filled"></text>
</view>
</view>
<view class="info-item">
<text class="label">加入时间</text>
<text class="value">{{ detail.joinTime }}</text>
</view>
</view>
</view>
<!-- 快捷操作 -->
<view class="bottom-actions">
<view class="action-item" @click="handleTransactions">
<text class="i-carbon-list"></text>
交易流水
</view>
<view class="action-item" @click="handleWithdraws">
<text class="i-carbon-wallet"></text>
提现记录
</view>
<view class="action-item" :class="{ danger: detail.status !== 'frozen' }" @click="handleFreeze">
<text :class="detail.status === 'frozen' ? 'i-carbon-locked' : 'i-carbon-unlocked'"></text>
{{ detail.status === 'frozen' ? '解冻账户' : '冻结账户' }}
</view>
</view>
</template>
</view>
</template>
<style lang="scss" scoped>
.customer-detail-page {
min-height: 100vh;
background: #f8f9fa;
padding-bottom: calc(60rpx + env(safe-area-inset-bottom));
}
.header-card {
background: linear-gradient(135deg, #00c05a 0%, #34d19d 100%);
padding: 20rpx 40rpx 40rpx;
color: #fff;
border-bottom-left-radius: 40rpx;
border-bottom-right-radius: 40rpx;
.merchant-base {
display: flex;
gap: 24rpx;
align-items: center;
margin-bottom: 40rpx;
.logo {
width: 100rpx;
height: 100rpx;
border-radius: 50rpx;
border: 4rpx solid rgba(255, 255, 255, 0.5);
background: #fff;
}
.info {
.name {
font-size: 32rpx;
font-weight: 700;
display: block;
margin-bottom: 8rpx;
}
.tags {
display: flex;
gap: 12rpx;
.tag {
font-size: 20rpx;
background: rgba(255, 255, 255, 0.2);
padding: 4rpx 12rpx;
border-radius: 20rpx;
&.gold { background: #ffb347; color: #fff; }
}
}
}
}
.stats-row {
display: flex;
justify-content: space-around;
align-items: center;
background: rgba(255, 255, 255, 0.1);
border-radius: 20rpx;
padding: 24rpx 0;
.stat-item {
text-align: center;
.label {
font-size: 24rpx;
opacity: 0.8;
display: block;
margin-bottom: 8rpx;
}
.value {
font-size: 32rpx;
font-weight: 700;
}
}
.divider {
width: 1rpx;
height: 32rpx;
background: rgba(255, 255, 255, 0.2);
}
}
}
.section {
background: #fff;
margin: 0 30rpx 24rpx;
border-radius: 20rpx;
padding: 24rpx 30rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.02);
.section-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 24rpx;
.title {
font-size: 30rpx;
font-weight: 700;
color: #333;
padding-left: 20rpx;
position: relative;
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 6rpx;
height: 28rpx;
background: #00c05a;
border-radius: 3rpx;
}
}
.action-btn {
font-size: 24rpx;
color: #00c05a;
font-weight: 600;
padding: 8rpx 20rpx;
background: rgba(0, 192, 90, 0.1);
border-radius: 20rpx;
}
}
.section-title {
font-size: 30rpx;
font-weight: 700;
margin-bottom: 24rpx;
padding-left: 20rpx;
position: relative;
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 6rpx;
height: 28rpx;
background: #00c05a;
border-radius: 3rpx;
}
}
}
.credit-box {
.progress-container {
.progress-labels {
display: flex;
justify-content: space-between;
font-size: 26rpx;
color: #666;
margin-bottom: 16rpx;
text:last-child { font-weight: 700; color: #333; }
}
.progress-bar {
height: 16rpx;
background: #f1f3f5;
border-radius: 8rpx;
overflow: hidden;
margin-bottom: 12rpx;
.inner {
height: 100%;
background: linear-gradient(90deg, #34d19d 0%, #00c05a 100%);
border-radius: 8rpx;
}
}
.progress-footer {
display: flex;
justify-content: space-between;
font-size: 22rpx;
color: #999;
}
}
}
.info-list {
.info-item {
display: flex;
justify-content: space-between;
padding: 20rpx 0;
border-bottom: 1rpx solid #f8f9fa;
&:last-child { border-bottom: none; }
.label {
font-size: 26rpx;
color: #999;
}
.value {
font-size: 26rpx;
color: #333;
font-weight: 500;
&.phone {
color: #4d80f0;
display: flex;
align-items: center;
gap: 8rpx;
}
}
}
}
.bottom-actions {
margin: 40rpx 30rpx;
display: flex;
gap: 20rpx;
.action-item {
flex: 1;
height: 100rpx;
background: #fff;
border-radius: 20rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 22rpx;
color: #666;
gap: 8rpx;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02);
text { font-size: 40rpx; color: #00c05a; }
&.danger { text { color: #fa4350; } color: #fa4350; }
&:active { background: #f8f9fa; }
}
}
.loading-box {
padding: 100rpx;
text-align: center;
color: #999;
font-size: 28rpx;
}
</style>

View File

@@ -1,55 +1,177 @@
<script lang="ts" setup> <script lang="ts" setup>
import { getCustomerList } from '@/pagesBank/api'
import type { BankCustomer } from '@/typings/bank'
definePage({ definePage({
style: { style: {
navigationBarTitleText: '客户管理', navigationBarTitleText: '客户管理',
enablePullDownRefresh: true
}, },
}) })
// 模拟客户数据 const customers = ref<BankCustomer[]>([])
const customers = ref([ const loading = ref(false)
{ id: '1', name: '广州数字科技有限公司', creditLimit: 500000, usedLimit: 125000, status: 'normal' }, const keyword = ref('')
{ id: '2', name: '深圳智慧商贸公司', creditLimit: 300000, usedLimit: 280000, status: 'warning' }, const activeStatus = ref('')
{ id: '3', name: '佛山电子商务公司', creditLimit: 200000, usedLimit: 50000, status: 'normal' },
]) const statusTabs = [
{ label: '全部', value: '' },
{ label: '正常', value: 'normal' },
{ label: '预警', value: 'warning' },
{ label: '冻结', value: 'frozen' },
]
async function loadData() {
loading.value = true
try {
const res = await getCustomerList({
status: activeStatus.value || undefined,
pageNum: 1,
pageSize: 20,
keyword: keyword.value
})
customers.value = res.list
} finally {
loading.value = false
uni.stopPullDownRefresh()
}
}
function handleSearch() {
loadData()
}
function handleTabChange(value: string) {
activeStatus.value = value
loadData()
}
function handleDetail(id: string) { function handleDetail(id: string) {
uni.navigateTo({ url: `/pagesBank/customer/detail?id=${id}` }) uni.navigateTo({ url: `/pagesBank/customer/detail?id=${id}` })
} }
function getUsageRate(used: number, total: number) { function getUsageRate(used: number, total: number) {
return ((used / total) * 100).toFixed(1) return (used / total) * 100
} }
function getStatusInfo(status: string) {
const map: Record<string, { text: string; color: string; bgColor: string }> = {
normal: { text: '正常', color: '#00c05a', bgColor: 'rgba(0, 192, 90, 0.1)' },
warning: { text: '预警', color: '#ff8f0d', bgColor: 'rgba(255, 143, 13, 0.1)' },
frozen: { text: '冻结', color: '#fa4350', bgColor: 'rgba(250, 67, 80, 0.1)' },
}
return map[status] || { text: '未知', color: '#999', bgColor: '#f5f5f5' }
}
onMounted(() => {
loadData()
})
onPullDownRefresh(() => {
loadData()
})
</script> </script>
<template> <template>
<view class="customer-list-page"> <view class="customer-list-page">
<view class="customer-list"> <view class="sticky-header">
<view class="search-bar">
<view class="search-input">
<text class="i-carbon-search"></text>
<input
v-model="keyword"
placeholder="搜索商户名称/联系人"
confirm-type="search"
@confirm="handleSearch"
/>
</view>
</view>
<view class="tabs">
<view
v-for="tab in statusTabs"
:key="tab.value"
class="tab-item"
:class="{ active: activeStatus === tab.value }"
@click="handleTabChange(tab.value)"
>
{{ tab.label }}
<view class="line"></view>
</view>
</view>
</view>
<view class="list-container">
<view v-if="loading && customers.length === 0" class="loading-state">
<text>加载中...</text>
</view>
<view v-else-if="customers.length === 0" class="empty-state">
<text class="i-carbon-user-avatar-filled-blank"></text>
<text>暂无相关客户信息</text>
</view>
<view <view
v-for="item in customers" v-for="item in customers"
:key="item.id" :key="item.id"
class="customer-card" class="customer-card"
@click="handleDetail(item.id)" @click="handleDetail(item.id)"
> >
<view class="customer-header"> <view class="card-header">
<text class="customer-name">{{ item.name }}</text> <view class="customer-base">
<text class="customer-status" :class="item.status"> <image :src="item.logo || '/static/images/avatar.jpg'" class="logo" mode="aspectFill" />
{{ item.status === 'normal' ? '正常' : '预警' }} <view class="info">
<text class="name">{{ item.merchantName }}</text>
<text class="contact">{{ item.contactName }} {{ item.contactPhone }}</text>
</view>
</view>
<text
class="status-tag"
:style="{ color: getStatusInfo(item.status).color, backgroundColor: getStatusInfo(item.status).bgColor }"
>
{{ getStatusInfo(item.status).text }}
</text> </text>
</view> </view>
<view class="customer-body">
<view class="limit-info"> <view class="card-body">
<text class="label">授信额度</text> <view class="limit-stats">
<text class="value">¥{{ (item.creditLimit / 10000).toFixed(0) }}</text> <view class="stat-item">
<text class="label">授信总额</text>
<text class="value">¥{{ (item.creditLimit / 10000).toFixed(1) }}w</text>
</view>
<view class="stat-item">
<text class="label">已使用</text>
<text class="value highlight">¥{{ (item.usedLimit / 10000).toFixed(1) }}w</text>
</view>
<view class="stat-item">
<text class="label">可用余额</text>
<text class="value">¥{{ (item.balance / 10000).toFixed(1) }}w</text>
</view>
</view> </view>
<view class="limit-info">
<text class="label">已使用</text> <view class="usage-progress">
<text class="value used">¥{{ (item.usedLimit / 10000).toFixed(1) }}</text> <view class="progress-info">
<text>额度使用率</text>
<text :class="{ danger: getUsageRate(item.usedLimit, item.creditLimit) > 80 }">
{{ getUsageRate(item.usedLimit, item.creditLimit).toFixed(1) }}%
</text>
</view>
<view class="progress-bar">
<view
class="progress-inner"
:style="{
width: Math.min(getUsageRate(item.usedLimit, item.creditLimit), 100) + '%',
backgroundColor: getUsageRate(item.usedLimit, item.creditLimit) > 80 ? '#fa4350' : '#00c05a'
}"
></view>
</view>
</view> </view>
<view class="limit-info"> </view>
<text class="label">使用率</text>
<text class="value" :class="{ warning: item.status === 'warning' }"> <view class="card-footer">
{{ getUsageRate(item.usedLimit, item.creditLimit) }}% <text class="join-time">加入时间{{ item.joinTime }}</text>
</text> <view class="action">
管理客户 <text class="i-carbon-chevron-right"></text>
</view> </view>
</view> </view>
</view> </view>
@@ -60,82 +182,228 @@ function getUsageRate(used: number, total: number) {
<style lang="scss" scoped> <style lang="scss" scoped>
.customer-list-page { .customer-list-page {
min-height: 100vh; min-height: 100vh;
background: #f5f5f5; background: #f8f9fa;
padding: 20rpx; padding-bottom: 30rpx;
} }
.customer-list { .sticky-header {
position: sticky;
top: 0;
z-index: 100;
background: #fff;
padding: 20rpx 0 0;
}
.search-bar {
padding: 0 30rpx 20rpx;
.search-input {
height: 72rpx;
background: #f1f3f5;
border-radius: 36rpx;
display: flex;
align-items: center;
padding: 0 30rpx;
gap: 16rpx;
text {
font-size: 32rpx;
color: #adb5bd;
}
input {
flex: 1;
font-size: 26rpx;
}
}
}
.tabs {
display: flex; display: flex;
flex-direction: column; justify-content: space-around;
gap: 20rpx; border-bottom: 1rpx solid #f1f3f5;
.tab-item {
padding: 20rpx 0;
font-size: 28rpx;
color: #495057;
position: relative;
&.active {
color: #00c05a;
font-weight: 700;
.line {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 6rpx;
background: #00c05a;
border-radius: 3rpx;
}
}
}
}
.list-container {
padding: 24rpx 30rpx;
} }
.customer-card { .customer-card {
background: #fff; background: #fff;
border-radius: 16rpx; border-radius: 20rpx;
padding: 24rpx; padding: 24rpx;
margin-bottom: 24rpx;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02);
.customer-header { .card-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 24rpx;
.customer-base {
display: flex;
gap: 20rpx;
flex: 1;
.logo {
width: 80rpx;
height: 80rpx;
border-radius: 12rpx;
background: #f5f5f5;
}
.info {
.name {
font-size: 30rpx;
font-weight: 700;
color: #333;
display: block;
margin-bottom: 4rpx;
}
.contact {
font-size: 24rpx;
color: #999;
}
}
}
.status-tag {
font-size: 22rpx;
padding: 4rpx 16rpx;
border-radius: 8rpx;
font-weight: 600;
white-space: nowrap;
}
}
.card-body {
background: #f8f9fa;
border-radius: 16rpx;
padding: 24rpx;
margin-bottom: 24rpx;
.limit-stats {
display: flex;
justify-content: space-between;
margin-bottom: 24rpx;
.stat-item {
.label {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 8rpx;
}
.value {
font-size: 28rpx;
font-weight: 700;
color: #333;
&.highlight { color: #00c05a; }
}
}
}
.usage-progress {
.progress-info {
display: flex;
justify-content: space-between;
font-size: 22rpx;
color: #666;
margin-bottom: 12rpx;
.danger { color: #fa4350; font-weight: 700; }
}
.progress-bar {
height: 12rpx;
background: #e9ecef;
border-radius: 6rpx;
overflow: hidden;
.progress-inner {
height: 100%;
border-radius: 6rpx;
transition: width 0.3s;
}
}
}
}
.card-footer {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-bottom: 20rpx; border-top: 1rpx solid #f1f3f5;
padding-top: 20rpx;
.customer-name { .join-time {
font-size: 28rpx; font-size: 24rpx;
color: #adb5bd;
}
.action {
font-size: 26rpx;
color: #4d80f0;
font-weight: 600; font-weight: 600;
color: #333; display: flex;
flex: 1; align-items: center;
overflow: hidden; gap: 4rpx;
text-overflow: ellipsis;
white-space: nowrap;
}
.customer-status {
font-size: 22rpx;
padding: 4rpx 12rpx;
border-radius: 8rpx;
&.normal {
background: rgba(0, 192, 90, 0.1);
color: #00c05a;
}
&.warning {
background: rgba(255, 143, 13, 0.1);
color: #ff8f0d;
}
}
}
.customer-body {
display: flex;
justify-content: space-between;
.limit-info {
text-align: center;
.label {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 8rpx;
}
.value {
font-size: 28rpx;
font-weight: 600;
color: #333;
&.used {
color: #00c05a;
}
&.warning {
color: #ff8f0d;
}
}
} }
} }
} }
.empty-state {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 100rpx 0;
color: #adb5bd;
gap: 20rpx;
text:first-child {
font-size: 80rpx;
}
text:last-child {
font-size: 28rpx;
}
}
.loading-state {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 100rpx 0;
color: #adb5bd;
text {
font-size: 28rpx;
}
}
</style> </style>

View File

@@ -0,0 +1,107 @@
<script lang="ts" setup>
import { getCustomerTransactions } from '@/pagesBank/api'
import { onLoad } from '@dcloudio/uni-app'
const merchantId = ref('')
const list = ref<any[]>([])
const loading = ref(false)
const finished = ref(false)
async function loadData() {
if (loading.value || finished.value) return
loading.value = true
try {
const res = await getCustomerTransactions({
merchantId: merchantId.value,
pageNum: 1,
pageSize: 20
})
list.value = res.list
finished.value = true
} finally {
loading.value = false
}
}
onLoad((options) => {
if (options?.merchantId) {
merchantId.value = options.merchantId
loadData()
}
})
</script>
<template>
<view class="transaction-list-page">
<view class="list">
<view class="item" v-for="item in list" :key="item.id">
<view class="left">
<text class="title">{{ item.title }}</text>
<text class="time">{{ item.time }}</text>
</view>
<view class="right">
<text class="amount" :class="item.type">
{{ item.type === 'expend' || item.type === 'withdraw' ? '-' : '+' }}{{ item.amount.toFixed(2) }}
</text>
</view>
</view>
</view>
<view v-if="loading" class="loading">加载中...</view>
<view v-else-if="list.length === 0" class="empty">暂无记录</view>
</view>
</template>
<style lang="scss" scoped>
.transaction-list-page {
min-height: 100vh;
background: #f8f9fa;
padding: 20rpx;
}
.item {
background: #fff;
padding: 30rpx;
border-radius: 16rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.02);
.left {
display: flex;
flex-direction: column;
gap: 8rpx;
.title {
font-size: 28rpx;
color: #333;
font-weight: 500;
}
.time {
font-size: 24rpx;
color: #999;
}
}
.right {
.amount {
font-size: 32rpx;
font-weight: 700;
&.income { color: #fe5b02; }
&.expend { color: #333; }
&.withdraw { color: #333; }
}
}
}
.loading, .empty {
text-align: center;
padding: 40rpx;
color: #999;
font-size: 26rpx;
}
</style>

View File

@@ -0,0 +1,126 @@
<script lang="ts" setup>
import { getCustomerWithdraws } from '@/pagesBank/api'
import { AuditStatus } from '@/typings/bank'
import { onLoad } from '@dcloudio/uni-app'
const merchantId = ref('')
const list = ref<any[]>([])
const loading = ref(false)
const finished = ref(false)
const statusMap: Record<string, { text: string; color: string }> = {
[AuditStatus.PENDING]: { text: '待审核', color: '#ff8f0d' },
[AuditStatus.APPROVED]: { text: '已通过', color: '#00c05a' },
[AuditStatus.REJECTED]: { text: '已拒绝', color: '#fa4350' },
}
async function loadData() {
if (loading.value || finished.value) return
loading.value = true
try {
const res = await getCustomerWithdraws({
merchantId: merchantId.value,
pageNum: 1,
pageSize: 20
})
list.value = res.list
finished.value = true
} finally {
loading.value = false
}
}
onLoad((options) => {
if (options?.merchantId) {
merchantId.value = options.merchantId
loadData()
}
})
</script>
<template>
<view class="withdraw-list-page">
<view class="list">
<view class="item" v-for="item in list" :key="item.id">
<view class="header">
<text class="time">{{ item.time }}</text>
<text class="status" :style="{ color: statusMap[item.status]?.color }">
{{ statusMap[item.status]?.text }}
</text>
</view>
<view class="content">
<view class="amount">¥{{ item.amount.toFixed(2) }}</view>
<view class="bank">{{ item.bank }}</view>
</view>
<view class="footer" v-if="item.reason">
<text class="reason">拒绝原因: {{ item.reason }}</text>
</view>
</view>
</view>
<view v-if="loading" class="loading">加载中...</view>
<view v-else-if="list.length === 0" class="empty">暂无记录</view>
</view>
</template>
<style lang="scss" scoped>
.withdraw-list-page {
min-height: 100vh;
background: #f8f9fa;
padding: 20rpx;
}
.item {
background: #fff;
padding: 30rpx;
border-radius: 16rpx;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.02);
.header {
display: flex;
justify-content: space-between;
margin-bottom: 20rpx;
font-size: 24rpx;
.time { color: #999; }
.status { font-weight: 500; }
}
.content {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10rpx;
.amount {
font-size: 36rpx;
font-weight: 700;
color: #333;
}
.bank {
font-size: 26rpx;
color: #666;
}
}
.footer {
padding-top: 20rpx;
border-top: 1rpx solid #f8f9fa;
margin-top: 20rpx;
.reason {
font-size: 24rpx;
color: #fa4350;
}
}
}
.loading, .empty {
text-align: center;
padding: 40rpx;
color: #999;
font-size: 26rpx;
}
</style>

View File

@@ -1,5 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useUserStore } from '@/store/user' import { useUserStore } from '@/store/user'
import { useBankStore } from '@/store/bank'
definePage({ definePage({
style: { style: {
@@ -8,60 +9,96 @@ definePage({
}) })
const userStore = useUserStore() const userStore = useUserStore()
const bankStore = useBankStore()
// 模拟数据 // 快捷操作
const stats = ref({
pendingAudit: 45,
todayApproved: 28,
totalAmount: 2568000.00,
customers: 156,
})
const quickActions = [ const quickActions = [
{ icon: 'i-carbon-task-approved', label: '待审核', path: '/pagesBank/audit/list' }, { icon: 'i-carbon-task-approved', label: '待审核', path: '/pagesBank/audit/list' },
{ icon: 'i-carbon-group', label: '客户管理', path: '/pagesBank/customer/list' }, { icon: 'i-carbon-group', label: '客户管理', path: '/pagesBank/customer/list' },
{ icon: 'i-carbon-report', label: '数据报表', path: '/pagesBank/dashboard/index' }, { icon: 'i-carbon-report', label: '数据报表', path: '' }, // 暂未实现
{ icon: 'i-carbon-settings', label: '设置', path: '/pagesBank/me/index' }, { icon: 'i-carbon-settings', label: '设置', path: '/pagesBank/me/index' },
] ]
function handleAction(path: string) { function handleAction(path: string) {
if (!path) {
uni.showToast({ title: '功能开发中', icon: 'none' })
return
}
uni.navigateTo({ url: path }) uni.navigateTo({ url: path })
} }
onMounted(() => {
bankStore.fetchStats()
})
</script> </script>
<template> <template>
<view class="dashboard-page"> <view class="dashboard-page">
<view class="header-bg"></view>
<!-- 头部欢迎 --> <!-- 头部欢迎 -->
<view class="header"> <view class="header-content">
<view class="welcome"> <view class="welcome">
<text class="greeting">您好{{ userStore.userInfo?.nickname || '银行用户' }}</text> <text class="greeting">您好{{ userStore.userInfo?.nickname || '银行管理员' }}</text>
<text class="sub-text">金融服务数据总览</text> <text class="sub-text">欢迎回到银行端管理系统</text>
</view> </view>
</view> </view>
<!-- 数据卡片 --> <!-- 关键指标卡片 -->
<view class="stats-grid"> <view class="stats-overview">
<view class="stat-card warning"> <view class="total-amount-card">
<text class="stat-value">{{ stats.pendingAudit }}</text> <text class="label">累计放款金额 ()</text>
<text class="stat-label">待审核</text> <view class="amount-box">
<text class="unit">¥</text>
<text class="value">{{ (bankStore.stats?.totalLoanAmount || 0).toLocaleString() }}</text>
</view>
</view> </view>
<view class="stat-card success">
<text class="stat-value">{{ stats.todayApproved }}</text> <view class="stats-grid">
<text class="stat-label">今日已审</text> <view class="stat-card" @click="handleAction('/pagesBank/audit/list')">
</view> <view class="stat-info">
<view class="stat-card"> <text class="stat-value warning">{{ bankStore.stats?.pendingAuditWithdraw || 0 }}</text>
<text class="stat-value">{{ (stats.totalAmount / 10000).toFixed(0) }}</text> <text class="stat-label">待审提现</text>
<text class="stat-label">累计放款</text> </view>
</view> <view class="stat-icon warning">
<view class="stat-card"> <text class="i-carbon-wallet"></text>
<text class="stat-value">{{ stats.customers }}</text> </view>
<text class="stat-label">服务客户</text> </view>
<view class="stat-card">
<view class="stat-info">
<text class="stat-value success">{{ bankStore.stats?.todayApprovedCount || 0 }}</text>
<text class="stat-label">今日审批</text>
</view>
<view class="stat-icon success">
<text class="i-carbon-checkmark-outline"></text>
</view>
</view>
<view class="stat-card" @click="handleAction('/pagesBank/customer/list')">
<view class="stat-info">
<text class="stat-value">{{ bankStore.stats?.activeCustomerCount || 0 }}</text>
<text class="stat-label">活跃商户</text>
</view>
<view class="stat-icon">
<text class="i-carbon-user-activity"></text>
</view>
</view>
<view class="stat-card">
<view class="stat-info">
<text class="stat-value">{{ bankStore.stats?.pendingAuditStore || 0 }}</text>
<text class="stat-label">待审入驻</text>
</view>
<view class="stat-icon">
<text class="i-carbon-store"></text>
</view>
</view>
</view> </view>
</view> </view>
<!-- 快捷操作 --> <!-- 快捷操作 -->
<view class="section"> <view class="section">
<view class="section-title">快捷操作</view> <view class="section-header">
<text class="section-title">快捷操作</text>
</view>
<view class="quick-actions"> <view class="quick-actions">
<view <view
v-for="item in quickActions" v-for="item in quickActions"
@@ -76,27 +113,53 @@ function handleAction(path: string) {
</view> </view>
</view> </view>
</view> </view>
<!-- 最近动态 (Placeholder) -->
<view class="section">
<view class="section-header">
<text class="section-title">最近动态</text>
<text class="more">更多 ></text>
</view>
<view class="empty-dynamic">
<text class="i-carbon-reminder-attendance"></text>
<text>暂无新的审核动态</text>
</view>
</view>
</view> </view>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.dashboard-page { .dashboard-page {
min-height: 100vh; min-height: 100vh;
background: #f5f5f5; background: #f8f9fa;
padding-bottom: 40rpx;
} }
.header { .header-bg {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 480rpx; /* 稍微增高一点以容纳更多内容 */
background: linear-gradient(135deg, #00c05a 0%, #34d19d 100%); background: linear-gradient(135deg, #00c05a 0%, #34d19d 100%);
padding: 40rpx 30rpx 60rpx; border-bottom-left-radius: 40rpx;
border-bottom-right-radius: 40rpx;
z-index: 0;
}
.header-content {
position: relative;
padding: 60rpx 40rpx 20rpx;
z-index: 1;
.welcome { .welcome {
color: #fff; color: #fff;
.greeting { .greeting {
font-size: 36rpx; font-size: 40rpx;
font-weight: 600; font-weight: 700;
display: block; display: block;
margin-bottom: 8rpx; margin-bottom: 12rpx;
} }
.sub-text { .sub-text {
@@ -106,54 +169,127 @@ function handleAction(path: string) {
} }
} }
.stats-overview {
position: relative;
margin: 0 30rpx;
z-index: 1;
.total-amount-card {
background: #fff;
border-radius: 24rpx;
padding: 40rpx;
box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.05);
margin-bottom: 24rpx;
.label {
font-size: 26rpx;
color: #999;
display: block;
margin-bottom: 16rpx;
}
.amount-box {
display: flex;
align-items: baseline;
.unit {
font-size: 32rpx;
font-weight: 600;
color: #333;
margin-right: 8rpx;
}
.value {
font-size: 56rpx;
font-weight: 700;
color: #333;
}
}
}
}
.stats-grid { .stats-grid {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
gap: 20rpx; gap: 20rpx;
padding: 0 20rpx;
margin-top: -40rpx;
.stat-card { .stat-card {
background: #fff; background: #fff;
border-radius: 16rpx; border-radius: 20rpx;
padding: 30rpx; padding: 30rpx;
text-align: center; display: flex;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); justify-content: space-between;
align-items: center;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.03);
.stat-value { .stat-info {
font-size: 40rpx; .stat-value {
font-weight: 700; font-size: 36rpx;
color: #333; font-weight: 700;
display: block; color: #333;
margin-bottom: 8rpx; display: block;
margin-bottom: 4rpx;
&.warning { color: #ff8f0d; }
&.success { color: #00c05a; }
}
.stat-label {
font-size: 24rpx;
color: #999;
}
} }
.stat-label { .stat-icon {
font-size: 24rpx; width: 72rpx;
color: #999; height: 72rpx;
} border-radius: 16rpx;
background: #f5f5f5;
&.warning .stat-value { display: flex;
color: #ff8f0d; align-items: center;
} justify-content: center;
&.success .stat-value { text {
color: #00c05a; font-size: 36rpx;
color: #666;
}
&.warning {
background: rgba(255, 143, 13, 0.1);
text { color: #ff8f0d; }
}
&.success {
background: rgba(0, 192, 90, 0.1);
text { color: #00c05a; }
}
} }
} }
} }
.section { .section {
margin: 30rpx 20rpx; margin: 30rpx;
background: #fff; background: #fff;
border-radius: 16rpx; border-radius: 24rpx;
padding: 30rpx; padding: 30rpx;
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.02);
.section-title { .section-header {
font-size: 30rpx; display: flex;
font-weight: 600; justify-content: space-between;
color: #333; align-items: center;
margin-bottom: 24rpx; margin-bottom: 30rpx;
.section-title {
font-size: 32rpx;
font-weight: 700;
color: #333;
}
.more {
font-size: 24rpx;
color: #999;
}
} }
} }
@@ -166,27 +302,51 @@ function handleAction(path: string) {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
gap: 12rpx; gap: 16rpx;
.action-icon { .action-icon {
width: 80rpx; width: 96rpx;
height: 80rpx; height: 96rpx;
background: linear-gradient(135deg, #00c05a 0%, #34d19d 100%); background: #f8f9fa;
border-radius: 20rpx; border-radius: 24rpx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
transition: all 0.2s;
text { text {
font-size: 40rpx; font-size: 44rpx;
color: #fff; color: #00c05a;
}
&:active {
background: #e9ecef;
transform: scale(0.95);
} }
} }
.action-label { .action-label {
font-size: 24rpx; font-size: 24rpx;
color: #666; color: #495057;
} }
} }
} }
.empty-dynamic {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 40rpx 0;
color: #adb5bd;
gap: 16rpx;
text:first-child {
font-size: 64rpx;
}
text:last-child {
font-size: 26rpx;
}
}
</style> </style>

111
src/pagesBank/mock/index.ts Normal file
View File

@@ -0,0 +1,111 @@
import type {
BankStats,
AuditItem,
BankCustomer,
WithdrawAuditDetail
} from '@/typings/bank'
import { AuditStatus, AuditType } from '@/typings/bank'
// 统计数据 Mock
export const mockBankStats: BankStats = {
pendingAuditStore: 5,
pendingAuditWithdraw: 12,
todayApprovedCount: 8,
totalLoanAmount: 12850000.00,
activeCustomerCount: 156
}
// 审核记录 Mock
export const mockAuditList: AuditItem[] = [
{
id: 'W001',
merchantId: 'M1001',
merchantName: '广州酷玩玩具城',
type: AuditType.WITHDRAW,
amount: 5000.00,
status: AuditStatus.PENDING,
applyTime: '2024-12-19 10:30:00',
remark: '年终结算提现'
},
{
id: 'W002',
merchantId: 'M1002',
merchantName: '深圳特粉专卖店',
type: AuditType.WITHDRAW,
amount: 12800.00,
status: AuditStatus.PENDING,
applyTime: '2024-12-19 09:15:00'
},
{
id: 'C001',
merchantId: 'M1003',
merchantName: '珠海智悦贸易有限公司',
type: AuditType.CREDIT,
amount: 500000.00,
status: AuditStatus.PENDING,
applyTime: '2024-12-18 16:45:00',
remark: '扩大经营,申请提高授信额度'
}
]
// 客户列表 Mock
export const mockCustomerList: BankCustomer[] = [
{
id: 'C1001',
merchantId: 'M1001',
merchantName: '广州酷玩玩具城',
creditLimit: 500000.00,
usedLimit: 125000.00,
balance: 375000.00,
status: 'normal',
contactName: '张三',
contactPhone: '138****8888',
joinTime: '2024-05-20'
},
{
id: 'C1002',
merchantId: 'M1002',
merchantName: '深圳特粉专卖店',
creditLimit: 200000.00,
usedLimit: 180000.00,
balance: 20000.00,
status: 'warning',
contactName: '李四',
contactPhone: '139****9999',
joinTime: '2024-06-15'
}
]
// 审核详情 Mock
export function getMockWithdrawDetail(id: string): WithdrawAuditDetail {
return {
id,
merchantId: 'M1001',
merchantName: '广州酷玩玩具城',
type: AuditType.WITHDRAW,
amount: 5000.00,
status: AuditStatus.PENDING,
applyTime: '2024-12-19 10:30:00',
bankName: '中国工商银行',
bankAccount: '6222 **** **** 8888',
memberLevel: 'V3',
transactionCount: 156,
remark: '年终结算提现'
}
}
// 交易流水 Mock
export const mockTransactions = [
{ id: 'T001', type: 'income', amount: 500.00, time: '2024-12-19 14:30', title: '商品销售收入-订单#1001' },
{ id: 'T002', type: 'expend', amount: 200.00, time: '2024-12-19 12:00', title: '退款支出-订单#0998' },
{ id: 'T003', type: 'income', amount: 1200.00, time: '2024-12-18 18:20', title: '商品销售收入-订单#0999' },
{ id: 'T004', type: 'withdraw', amount: 5000.00, time: '2024-12-18 10:00', title: '提现申请' },
{ id: 'T005', type: 'income', amount: 350.50, time: '2024-12-17 15:45', title: '商品销售收入-订单#0997' },
]
// 提现记录 Mock (复用 AuditItem 结构部分字段或定义新结构,这里简化复用)
export const mockWithdrawHistory = [
{ id: 'W001', amount: 5000.00, status: AuditStatus.PENDING, time: '2024-12-19 10:30', bank: '工商银行(8888)' },
{ id: 'W005', amount: 10000.00, status: AuditStatus.APPROVED, time: '2024-12-01 09:00', bank: '工商银行(8888)' },
{ id: 'W008', amount: 2000.00, status: AuditStatus.REJECTED, time: '2024-11-20 16:20', bank: '工商银行(8888)', reason: '账户信息有误' },
]

View File

@@ -18,6 +18,7 @@ const todos = computed(() => {
{ icon: 'i-carbon-shopping-bag', label: '待发货订单', count: merchantStore.stats.pendingOrders, path: '/pagesMerchant/order/list' }, { icon: 'i-carbon-shopping-bag', label: '待发货订单', count: merchantStore.stats.pendingOrders, path: '/pagesMerchant/order/list' },
{ icon: 'i-carbon-warning', label: '库存预警', count: merchantStore.stats.lowStockGoods, path: '/pagesMerchant/goods/list' }, { icon: 'i-carbon-warning', label: '库存预警', count: merchantStore.stats.lowStockGoods, path: '/pagesMerchant/goods/list' },
{ icon: 'i-carbon-wallet', label: '待结算', count: `¥${(merchantStore.stats.pendingSettlement / 100).toFixed(0)}`, path: '/pagesMerchant/finance/index' }, { icon: 'i-carbon-wallet', label: '待结算', count: `¥${(merchantStore.stats.pendingSettlement / 100).toFixed(0)}`, path: '/pagesMerchant/finance/index' },
{ icon: 'i-carbon-document', label: '待提供材料', count: 1, path: '/pagesMerchant/loan/assist' }, // 模拟数据
].filter(item => item.count) ].filter(item => item.count)
}) })
@@ -27,6 +28,7 @@ const quickActions = [
{ icon: 'i-carbon-add-alt', label: '新增商品', path: '/pagesMerchant/goods/edit' }, { icon: 'i-carbon-add-alt', label: '新增商品', path: '/pagesMerchant/goods/edit' },
{ icon: 'i-carbon-wallet', label: '财务中心', path: '/pagesMerchant/finance/index' }, { icon: 'i-carbon-wallet', label: '财务中心', path: '/pagesMerchant/finance/index' },
{ icon: 'i-carbon-settings', label: '店铺设置', path: '/pagesMerchant/me/shop' }, { icon: 'i-carbon-settings', label: '店铺设置', path: '/pagesMerchant/me/shop' },
{ icon: 'i-carbon-document', label: '贷款辅助', path: '/pagesMerchant/loan/assist' },
] ]
// 加载数据 // 加载数据

View File

@@ -0,0 +1,302 @@
<script lang="ts" setup>
import { getMerchantPendingAssistList, submitAssistMaterial } from '@/api/loan'
definePage({
style: {
navigationBarTitleText: '贷款辅助材料',
},
})
interface LoanItem {
loanId: string
userName: string
amount: number
applyTime: string
isExpanded: boolean
materials: { type: string, url: string, name: string }[]
}
const list = ref<LoanItem[]>([])
const loading = ref(false)
async function loadData() {
loading.value = true
try {
const res = await getMerchantPendingAssistList()
list.value = res.list.map(item => ({
...item,
isExpanded: false,
materials: []
}))
} finally {
loading.value = false
}
}
function handleExpand(item: LoanItem) {
item.isExpanded = !item.isExpanded
}
function handleUpload(item: LoanItem, type: string, name: string) {
uni.chooseImage({
count: 1,
success: (res) => {
// 模拟上传
item.materials.push({
type,
name,
url: res.tempFilePaths[0]
})
}
})
}
function removeMaterial(item: LoanItem, index: number) {
item.materials.splice(index, 1)
}
async function handleSubmit(item: LoanItem) {
if (item.materials.length === 0) {
uni.showToast({ title: '请至少上传一项材料', icon: 'none' })
return
}
uni.showLoading({ title: '提交中...' })
try {
await submitAssistMaterial(item.loanId, item.materials)
uni.showToast({ title: '提交成功', icon: 'success' })
// 移除已处理项
const idx = list.value.indexOf(item)
if (idx > -1) list.value.splice(idx, 1)
} finally {
uni.hideLoading()
}
}
onMounted(() => {
loadData()
})
</script>
<template>
<view class="assist-page">
<view v-if="loading && list.length === 0" class="loading">加载中...</view>
<view v-else-if="list.length === 0" class="empty">
<text class="i-carbon-document-blank icon"></text>
<text>暂无需要提供材料的申请</text>
</view>
<view class="list">
<view v-for="item in list" :key="item.loanId" class="card">
<view class="card-header">
<view class="info">
<text class="user">{{ item.userName }}的贷款申请</text>
<text class="time">{{ item.applyTime }}</text>
</view>
<view class="amount">
<text class="val">{{ item.amount }}</text>
<text class="unit"></text>
</view>
</view>
<view class="action-area" v-if="!item.isExpanded">
<button class="btn primary" @click="handleExpand(item)">提供材料</button>
</view>
<!-- 上传区域 -->
<view class="upload-area" v-else>
<view class="upload-tip">请上传与该用户的真实交易凭证</view>
<view class="material-types">
<view class="type-btn" @click="handleUpload(item, 'order', '交易订单')">
<text class="i-carbon-upload"></text> 上传订单
</view>
<view class="type-btn" @click="handleUpload(item, 'flow', '银行流水')">
<text class="i-carbon-upload"></text> 上传流水
</view>
<view class="type-btn" @click="handleUpload(item, 'invoice', '发票')">
<text class="i-carbon-upload"></text> 上传发票
</view>
</view>
<!-- 已传列表 -->
<view class="preview-list" v-if="item.materials.length">
<view v-for="(mat, idx) in item.materials" :key="idx" class="preview-item">
<image :src="mat.url" mode="aspectFill" />
<view class="del-btn" @click="removeMaterial(item, idx)">
<text class="i-carbon-close"></text>
</view>
<text class="name">{{ mat.name }}</text>
</view>
</view>
<div class="submit-actions">
<button class="btn" @click="handleExpand(item)">取消</button>
<button class="btn primary" @click="handleSubmit(item)">确认提交</button>
</div>
</view>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
.assist-page {
min-height: 100vh;
background: #f5f7fa;
padding: 20rpx;
}
.empty {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 200rpx;
color: #999;
.icon { font-size: 80rpx; margin-bottom: 20rpx; }
}
.card {
background: #fff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 20rpx;
.card-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 20rpx;
.info {
display: flex;
flex-direction: column;
.user { font-size: 30rpx; font-weight: bold; color: #333; margin-bottom: 8rpx; }
.time { font-size: 24rpx; color: #999; }
}
.amount {
color: #ff8f0d;
font-weight: bold;
.val { font-size: 40rpx; }
.unit { font-size: 24rpx; margin-left: 4rpx; }
}
}
}
.action-area {
border-top: 1rpx solid #f5f5f5;
padding-top: 20rpx;
display: flex;
justify-content: flex-end;
.btn {
font-size: 26rpx;
height: 64rpx;
line-height: 64rpx;
padding: 0 40rpx;
border-radius: 32rpx;
background: #00c05a;
color: #fff;
}
}
.upload-area {
background: #f8f9fa;
border-radius: 12rpx;
padding: 20rpx;
margin-top: 20rpx;
.upload-tip { font-size: 24rpx; color: #666; margin-bottom: 20rpx; }
.material-types {
display: flex;
gap: 20rpx;
margin-bottom: 20rpx;
.type-btn {
flex: 1;
height: 72rpx;
background: #fff;
border: 1rpx dashed #ccc;
border-radius: 8rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 24rpx;
color: #666;
gap: 8rpx;
&:active { background: #e6f7eb; border-color: #00c05a; color: #00c05a; }
}
}
.preview-list {
display: flex;
flex-wrap: wrap;
gap: 20rpx;
margin-bottom: 20rpx;
.preview-item {
position: relative;
width: 120rpx;
height: 120rpx;
image { width: 100%; height: 100%; border-radius: 8rpx; }
.del-btn {
position: absolute;
top: -10rpx;
right: -10rpx;
background: rgba(0,0,0,0.5);
border-radius: 50%;
width: 36rpx;
height: 36rpx;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 20rpx;
}
.name {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: rgba(0,0,0,0.5);
color: #fff;
font-size: 18rpx;
text-align: center;
border-bottom-left-radius: 8rpx;
border-bottom-right-radius: 8rpx;
}
}
}
.submit-actions {
display: flex;
justify-content: flex-end;
gap: 20rpx;
.btn {
font-size: 26rpx;
height: 60rpx;
line-height: 60rpx;
padding: 0 30rpx;
border-radius: 30rpx;
background: #fff;
border: 1rpx solid #ddd;
color: #666;
&.primary {
background: #00c05a;
border-color: #00c05a;
color: #fff;
}
}
}
}
</style>

33
src/store/bank.ts Normal file
View File

@@ -0,0 +1,33 @@
import { defineStore } from 'pinia'
import { getBankStats } from '@/pagesBank/api'
import type { BankStats } from '@/typings/bank'
export const useBankStore = defineStore('bank', () => {
const stats = ref<BankStats | null>(null)
const loading = ref(false)
/** 获取银行统计数据 */
async function fetchStats() {
loading.value = true
try {
const res = await getBankStats()
stats.value = res
} catch (error) {
console.error('Fetch bank stats failed:', error)
} finally {
loading.value = false
}
}
/** 重置状态 */
function reset() {
stats.value = null
}
return {
stats,
loading,
fetchStats,
reset
}
})

View File

@@ -38,9 +38,8 @@ export const userTabbarList: CustomTabBarItem[] = [
{ {
text: '首页', text: '首页',
pagePath: 'pages/index/index', pagePath: 'pages/index/index',
iconType: 'image', iconType: 'unocss',
icon: '/static/logo2.png', icon: 'i-carbon-home',
iconActive: '/static/logo1.png',
}, },
{ {
pagePath: 'pages/sort/index', pagePath: 'pages/sort/index',

61
src/typings/bank.ts Normal file
View File

@@ -0,0 +1,61 @@
/**
* 银行端类型定义
*/
/** 审核状态 */
export enum AuditStatus {
PENDING = 'pending', // 待审核
APPROVED = 'approved', // 已通过
REJECTED = 'rejected', // 已拒绝
}
/** 审核类型 */
export enum AuditType {
WITHDRAW = 'withdraw', // 提现审核
CREDIT = 'credit', // 授信额度申请
MERCHANT = 'merchant', // 商户入驻审核
}
/** 审核申请列表项 */
export interface AuditItem {
id: string
merchantId: string
merchantName: string
type: AuditType
amount: number
status: AuditStatus
applyTime: string
remark?: string
}
/** 提现审核详情 */
export interface WithdrawAuditDetail extends AuditItem {
bankName: string
bankAccount: string
memberLevel?: string // 会员等级
transactionCount?: number // 近期交易频次
}
/** 银行客户信息 */
export interface BankCustomer {
id: string
merchantId: string
merchantName: string
logo?: string
creditLimit: number // 总授信额度
usedLimit: number // 已使用额度
balance: number // 当前余额
status: 'normal' | 'warning' | 'frozen'
contactName: string
contactPhone: string
joinTime: string
}
/** 银行统计指标 */
export interface BankStats {
pendingAuditStore: number // 待审核商户
pendingAuditWithdraw: number // 待审核提现
todayApprovedCount: number // 今日审批通过数
totalLoanAmount: number // 累计发放金额 (元)
activeCustomerCount: number // 活跃客户数
}

105
src/typings/loan.ts Normal file
View File

@@ -0,0 +1,105 @@
/**
* 贷款相关类型定义
*/
/** 贷款申请状态 */
export enum LoanStatus {
DRAFT = 'draft', // 草稿
SUBMITTED = 'submitted', // 已提交
ACCEPTED = 'accepted', // 已受理
INVESTIGATING = 'investigating', // 上门调查中
REPORTED = 'reported', // 已上报
APPROVING = 'approving', // 审批中
APPROVED = 'approved', // 审批通过
REJECTED = 'rejected', // 已拒绝
SIGNING = 'signing', // 待签约
SIGNED = 'signed', // 已签约
DISBURSED = 'disbursed', // 已放款
}
/** 辅助材料类型 */
export type MaterialType = 'order' | 'flow' | 'invoice' | 'other'
/** 商家辅助材料 */
export interface AssistMaterial {
merchantId: string
merchantName: string
loanApplicationId: string
materials: {
type: MaterialType // 订单/流水/发票/其他
url: string
name?: string
uploadTime: string
}[]
submitTime: string
status: 'pending' | 'submitted' | 'refused' // 待提交/已提交/拒绝提供
}
/** 贷款申请关联的商家 */
export interface RelatedMerchant {
merchantId: string
merchantName: string
logo?: string
lastTradeTime: string
selected: boolean
assistStatus: 'pending' | 'submitted' | 'refused' // 辅助材料状态
materials?: AssistMaterial
}
/** 银行流程节点记录 */
export interface BankProcessRecord {
step: 'accept' | 'investigate' | 'report' | 'approve' | 'sign' | 'disburse'
operator: string
operateTime: string
result?: 'pass' | 'reject'
opinion?: string
attachments?: string[] // 附件,如调查报告
}
/** 贷款申请详情 */
export interface LoanApplication {
id: string
userId: string
userName: string
userPhone: string
// 关联的商家列表
relatedMerchants: RelatedMerchant[]
// 申请信息
amount: number // 申请金额(万)
term: number // 期限(月/年)
status: LoanStatus
// 个人信息
personalInfo: {
name: string
phone: string
idCard: string
region: string[]
detailAddress: string
}
// 经营信息
businessInfo: {
businessProject: string
businessTime: string
annualIncome: number
hasDebt: 'yes' | 'no'
debtAmount?: number
loanDemand: number
assets: string[]
}
// 证件信息
documentInfo: {
businessLicense: string
otherMaterials: string[]
}
// 银行流程记录
processRecords: BankProcessRecord[]
createTime: string
updateTime: string
}