yml/hfb_sys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

第 4 阶段：订单、交接与账务--ok

Browse Source
This commit is contained in:
yml
2026-05-22 16:14:23 +08:00
parent edda1fbc7b
commit 9ebdfab078
17 changed files with 719 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/api/orders.ts
+10
View File
@@ -79,3 +79,13 @@ export async function confirmReceive(id: number) {
const { data } = await apiClient.post<ApiResponse<{ received: boolean }>>(`/orders/${id}/confirm-receive`)
return data.data
}
export async function submitReturn(id: number, content: string) {
const { data } = await apiClient.post<ApiResponse<HandoffRecord>>(`/orders/${id}/return`, { content })
return data.data
}
export async function confirmReturn(id: number) {
const { data } = await apiClient.post<ApiResponse<{ completed: boolean }>>(`/orders/${id}/confirm-return`)
return data.data
}
frontend/src/api/wallet.ts
+39
View File
@@ -0,0 +1,39 @@
import { apiClient } from './client'
export interface WalletAccount {
user_id: number
available_balance: number
frozen_balance: number
status: string
}
export interface WalletLedger {
id: number
ledger_no: string
user_id: number
order_id?: number
direction: string
amount: number
balance_after: number
balance_type: string
biz_type: string
biz_no: string
remark: string
created_at: string
}
interface ApiResponse<T> {
code: string
message: string
data: T
}
export async function fetchWalletBalance() {
const { data } = await apiClient.get<ApiResponse<WalletAccount>>('/wallet/balance')
return data.data
}
export async function fetchWalletLedger() {
const { data } = await apiClient.get<ApiResponse<{ items: WalletLedger[] }>>('/wallet/ledger')
return data.data.items
}
frontend/src/views/account/OrderDetailView.vue
+46
View File
@@ -6,9 +6,11 @@ import { useRoute, useRouter } from 'vue-router'
import {
cancelOrder,
confirmReceive,
confirmReturn,
fetchHandoffRecords,
fetchOrder,
submitHandoff,
submitReturn,
type HandoffRecord,
type Order,
} from '@/api/orders'
@@ -21,9 +23,12 @@ const loading = ref(false)
const cancelling = ref(false)
const handoffing = ref(false)
const confirming = ref(false)
const returning = ref(false)
const completing = ref(false)
const order = ref<Order | null>(null)
const handoffRecords = ref<HandoffRecord[]>([])
const handoffContent = ref('')
const returnContent = ref('')
const isOwner = computed(() => order.value?.owner_id === session.userId)
const isRenter = computed(() => order.value?.renter_id === session.userId)
@@ -83,6 +88,35 @@ async function handleConfirmReceive() {
}
}
async function handleSubmitReturn() {
if (!order.value) return
returning.value = true
try {
await submitReturn(order.value.id, returnContent.value)
returnContent.value = ''
ElMessage.success('归还申请已提交，等待号主确认')
await loadOrder()
} catch (error) {
ElMessage.error(readError(error, '提交归还失败'))
} finally {
returning.value = false
}
}
async function handleConfirmReturn() {
if (!order.value) return
completing.value = true
try {
await confirmReturn(order.value.id)
ElMessage.success('归还已确认，订单完成')
await loadOrder()
} catch (error) {
ElMessage.error(readError(error, '确认归还失败'))
} finally {
completing.value = false
}
}
function readError(error: unknown, fallback: string) {
if (typeof error === 'object' && error && 'response' in error) {
const response = (error as { response?: { data?: { message?: string } } }).response
@@ -152,5 +186,17 @@ function readError(error: unknown, fallback: string) {
<p>确认账号可以正常登录后，订单会进入租赁中并重新计算租期结束时间。</p>
<el-button type="primary" :loading="confirming" @click="handleConfirmReceive">确认已收到账号</el-button>
</div>
<div v-if="order && isRenter && order.status === 'renting'" class="order-panel">
<h2>提交归还</h2>
<el-input v-model="returnContent" type="textarea" :rows="4" placeholder="填写归还说明、租后资产状态或注意事项" />
<el-button class="panel-action" type="primary" :loading="returning" @click="handleSubmitReturn">提交归还</el-button>
</div>
<div v-if="order && isOwner && order.status === 'pending_return_confirm'" class="order-panel">
<h2>确认归还</h2>
<p>确认账号状态无误后，订单会完成，账号重新上架。</p>
<el-button type="primary" :loading="completing" @click="handleConfirmReturn">确认归还并完成订单</el-button>
</div>
</section>
</template>
frontend/src/views/account/WalletView.vue
+51 -2
View File
@@ -1,9 +1,58 @@
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { fetchWalletBalance, fetchWalletLedger, type WalletAccount, type WalletLedger } from '@/api/wallet'
const loading = ref(false)
const account = ref<WalletAccount | null>(null)
const ledger = ref<WalletLedger[]>([])
onMounted(loadWallet)
async function loadWallet() {
loading.value = true
try {
const [balance, rows] = await Promise.all([fetchWalletBalance(), fetchWalletLedger()])
account.value = balance
ledger.value = rows
} finally {
loading.value = false
}
}
</script>
<template>
<section class="page">
<section class="page" v-loading="loading">
<div class="page-header">
<p class="eyebrow">Wallet</p>
<h1>钱包</h1>
<p>查看可用余额、冻结余额和不可变资金流水。</p>
<p>查看可用余额、冻结余额和不可变资金流水。当前是开发态模拟账务，不代表真实支付余额。</p>
</div>
<div v-if="account" class="metric-grid">
<div class="metric-card">
<span>可用余额</span>
<strong>¥{{ account.available_balance }}</strong>
</div>
<div class="metric-card">
<span>冻结余额</span>
<strong>¥{{ account.frozen_balance }}</strong>
</div>
<div class="metric-card">
<span>状态</span>
<strong>{{ account.status }}</strong>
</div>
</div>
<el-table class="table-panel" :data="ledger">
<el-table-column prop="ledger_no" label="流水号" min-width="220" />
<el-table-column prop="biz_type" label="业务" width="140" />
<el-table-column prop="direction" label="方向" width="80" />
<el-table-column prop="amount" label="金额" width="100" />
<el-table-column prop="balance_type" label="余额类型" width="110" />
<el-table-column prop="balance_after" label="变化后余额" width="130" />
<el-table-column prop="remark" label="备注" min-width="220" />
<el-table-column prop="created_at" label="时间" width="180" />
</el-table>
</section>
</template>