拆分订单详情结账逻辑
This commit is contained in:
yml
@@ -5,7 +5,6 @@ import (
|
||||
|
||||
"hfb_sys/backend/internal/model"
|
||||
"hfb_sys/backend/internal/modules/notification"
|
||||
"hfb_sys/backend/internal/modules/wallet"
|
||||
|
||||
"gorm.io/gorm"
|
||||
"gorm.io/gorm/clause"
|
||||
@@ -228,108 +227,3 @@ func (r *Repository) AcceptCheckout(userID uint64, orderID uint64) error {
|
||||
r.startRefundBestEffort(refund)
|
||||
return nil
|
||||
}
|
||||
|
||||
func (r *Repository) finalizeCheckout(tx *gorm.DB, order *model.RentalOrder, checkout *model.OrderCheckout, renterContent string) (*refundAction, error) {
|
||||
listing, account, err := r.lockListingAccountForOrder(tx, order)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
now := time.Now()
|
||||
order.Status = orderStatusCompleted
|
||||
order.HandoffStatus = handoffStatusReturned
|
||||
order.SettlementStatus = settlementStatusSettled
|
||||
order.SettledAt = &now
|
||||
order.OwnerSettledAt = &now
|
||||
archiveAssets(listing, account)
|
||||
orderID := order.ID
|
||||
settlement := buildCheckoutSettlement(*order, checkout)
|
||||
|
||||
// 卖家收入进入站内钱包；租客资金不进入站内钱包。
|
||||
var ownerEntries []wallet.Entry
|
||||
if settlement.OwnerRentIncomeCent > 0 {
|
||||
ownerEntries = append(ownerEntries, wallet.Entry{
|
||||
UserID: order.OwnerID,
|
||||
OrderID: &orderID,
|
||||
Direction: "in",
|
||||
AmountCent: settlement.OwnerRentIncomeCent,
|
||||
BalanceType: "available",
|
||||
BizType: walletBizOwnerIncome,
|
||||
BizNo: order.OrderNo,
|
||||
Remark: "订单结账租金收入",
|
||||
})
|
||||
}
|
||||
if settlement.DepositCompensationCent > 0 {
|
||||
ownerEntries = append(ownerEntries, wallet.Entry{
|
||||
UserID: order.OwnerID,
|
||||
OrderID: &orderID,
|
||||
Direction: "in",
|
||||
AmountCent: settlement.DepositCompensationCent,
|
||||
BalanceType: "available",
|
||||
BizType: walletBizDepositCompensation,
|
||||
BizNo: order.OrderNo,
|
||||
Remark: "订单结账押金赔付",
|
||||
})
|
||||
}
|
||||
if len(ownerEntries) > 0 {
|
||||
if err := wallet.AppendEntries(tx, ownerEntries...); err != nil {
|
||||
return nil, err
|
||||
}
|
||||
}
|
||||
|
||||
var refund *refundAction
|
||||
renterRefundTotalCent := settlement.RentRefundCent + settlement.DepositRefundCent
|
||||
if renterRefundTotalCent > 0 {
|
||||
action, err := r.prepareRefund(order, renterRefundTotalCent, refundBizCheckout, "结账退款原路退还")
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
refund = action
|
||||
}
|
||||
|
||||
checkout.RentAmountCent = settlement.ActualRentAmountCent
|
||||
checkout.OwnerRentAmountCent = settlement.OwnerRentIncomeCent
|
||||
checkout.PlatformFeeCent = settlement.PlatformFeeCent
|
||||
checkout.RenterRefundAmountCent = settlement.RenterRefundCent
|
||||
checkout.OwnerIncomeAmountCent = settlement.OwnerIncomeCent
|
||||
if err := notification.Append(tx,
|
||||
notification.Entry{
|
||||
UserID: order.RenterID,
|
||||
Type: "settlement",
|
||||
Title: "订单已完成",
|
||||
Content: renterContent,
|
||||
BizType: "order",
|
||||
BizID: &orderID,
|
||||
},
|
||||
notification.Entry{
|
||||
UserID: order.OwnerID,
|
||||
Type: "settlement",
|
||||
Title: "订单已完成",
|
||||
Content: "订单已完成，结账金额已入账。",
|
||||
BizType: "order",
|
||||
BizID: &orderID,
|
||||
},
|
||||
); err != nil {
|
||||
return nil, err
|
||||
}
|
||||
if err := tx.Save(order).Error; err != nil {
|
||||
return nil, err
|
||||
}
|
||||
if err := tx.Save(checkout).Error; err != nil {
|
||||
return nil, err
|
||||
}
|
||||
if err := tx.Save(listing).Error; err != nil {
|
||||
return nil, err
|
||||
}
|
||||
if err := tx.Save(account).Error; err != nil {
|
||||
return nil, err
|
||||
}
|
||||
return refund, nil
|
||||
}
|
||||
|
||||
func hasOpenCheckout(tx *gorm.DB, orderID uint64) (bool, error) {
|
||||
var count int64
|
||||
err := tx.Model(&model.OrderCheckout{}).
|
||||
Where("order_id = ? AND status IN ?", orderID, []string{checkoutStatusSubmitted, checkoutStatusCountered, checkoutStatusAccepted, checkoutStatusDisputed}).
|
||||
Count(&count).Error
|
||||
return count > 0, err
|
||||
}
|
||||
|
||||
@@ -0,0 +1,134 @@
|
||||
package order
|
||||
|
||||
import (
|
||||
"time"
|
||||
|
||||
"hfb_sys/backend/internal/model"
|
||||
"hfb_sys/backend/internal/modules/notification"
|
||||
"hfb_sys/backend/internal/modules/wallet"
|
||||
|
||||
"gorm.io/gorm"
|
||||
)
|
||||
|
||||
func (r *Repository) finalizeCheckout(tx *gorm.DB, order *model.RentalOrder, checkout *model.OrderCheckout, renterContent string) (*refundAction, error) {
|
||||
listing, account, err := r.lockListingAccountForOrder(tx, order)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
now := time.Now()
|
||||
order.Status = orderStatusCompleted
|
||||
order.HandoffStatus = handoffStatusReturned
|
||||
order.SettlementStatus = settlementStatusSettled
|
||||
order.SettledAt = &now
|
||||
order.OwnerSettledAt = &now
|
||||
archiveAssets(listing, account)
|
||||
|
||||
settlement := buildCheckoutSettlement(*order, checkout)
|
||||
if err := appendCheckoutOwnerIncome(tx, order, settlement); err != nil {
|
||||
return nil, err
|
||||
}
|
||||
refund, err := r.prepareCheckoutRefund(order, settlement)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
applyCheckoutSettlement(checkout, settlement)
|
||||
if err := appendCheckoutCompletedNotifications(tx, order, renterContent); err != nil {
|
||||
return nil, err
|
||||
}
|
||||
if err := saveFinalizedCheckout(tx, order, checkout, listing, account); err != nil {
|
||||
return nil, err
|
||||
}
|
||||
return refund, nil
|
||||
}
|
||||
|
||||
func appendCheckoutOwnerIncome(tx *gorm.DB, order *model.RentalOrder, settlement checkoutSettlement) error {
|
||||
orderID := order.ID
|
||||
var ownerEntries []wallet.Entry
|
||||
if settlement.OwnerRentIncomeCent > 0 {
|
||||
ownerEntries = append(ownerEntries, wallet.Entry{
|
||||
UserID: order.OwnerID,
|
||||
OrderID: &orderID,
|
||||
Direction: "in",
|
||||
AmountCent: settlement.OwnerRentIncomeCent,
|
||||
BalanceType: "available",
|
||||
BizType: walletBizOwnerIncome,
|
||||
BizNo: order.OrderNo,
|
||||
Remark: "订单结账租金收入",
|
||||
})
|
||||
}
|
||||
if settlement.DepositCompensationCent > 0 {
|
||||
ownerEntries = append(ownerEntries, wallet.Entry{
|
||||
UserID: order.OwnerID,
|
||||
OrderID: &orderID,
|
||||
Direction: "in",
|
||||
AmountCent: settlement.DepositCompensationCent,
|
||||
BalanceType: "available",
|
||||
BizType: walletBizDepositCompensation,
|
||||
BizNo: order.OrderNo,
|
||||
Remark: "订单结账押金赔付",
|
||||
})
|
||||
}
|
||||
if len(ownerEntries) == 0 {
|
||||
return nil
|
||||
}
|
||||
return wallet.AppendEntries(tx, ownerEntries...)
|
||||
}
|
||||
|
||||
func (r *Repository) prepareCheckoutRefund(order *model.RentalOrder, settlement checkoutSettlement) (*refundAction, error) {
|
||||
renterRefundTotalCent := settlement.RentRefundCent + settlement.DepositRefundCent
|
||||
if renterRefundTotalCent <= 0 {
|
||||
return nil, nil
|
||||
}
|
||||
return r.prepareRefund(order, renterRefundTotalCent, refundBizCheckout, "结账退款原路退还")
|
||||
}
|
||||
|
||||
func applyCheckoutSettlement(checkout *model.OrderCheckout, settlement checkoutSettlement) {
|
||||
checkout.RentAmountCent = settlement.ActualRentAmountCent
|
||||
checkout.OwnerRentAmountCent = settlement.OwnerRentIncomeCent
|
||||
checkout.PlatformFeeCent = settlement.PlatformFeeCent
|
||||
checkout.RenterRefundAmountCent = settlement.RenterRefundCent
|
||||
checkout.OwnerIncomeAmountCent = settlement.OwnerIncomeCent
|
||||
}
|
||||
|
||||
func appendCheckoutCompletedNotifications(tx *gorm.DB, order *model.RentalOrder, renterContent string) error {
|
||||
orderID := order.ID
|
||||
return notification.Append(tx,
|
||||
notification.Entry{
|
||||
UserID: order.RenterID,
|
||||
Type: "settlement",
|
||||
Title: "订单已完成",
|
||||
Content: renterContent,
|
||||
BizType: "order",
|
||||
BizID: &orderID,
|
||||
},
|
||||
notification.Entry{
|
||||
UserID: order.OwnerID,
|
||||
Type: "settlement",
|
||||
Title: "订单已完成",
|
||||
Content: "订单已完成，结账金额已入账。",
|
||||
BizType: "order",
|
||||
BizID: &orderID,
|
||||
},
|
||||
)
|
||||
}
|
||||
|
||||
func saveFinalizedCheckout(tx *gorm.DB, order *model.RentalOrder, checkout *model.OrderCheckout, listing *model.RentalListing, account *model.GameAccount) error {
|
||||
if err := tx.Save(order).Error; err != nil {
|
||||
return err
|
||||
}
|
||||
if err := tx.Save(checkout).Error; err != nil {
|
||||
return err
|
||||
}
|
||||
if err := tx.Save(listing).Error; err != nil {
|
||||
return err
|
||||
}
|
||||
return tx.Save(account).Error
|
||||
}
|
||||
|
||||
func hasOpenCheckout(tx *gorm.DB, orderID uint64) (bool, error) {
|
||||
var count int64
|
||||
err := tx.Model(&model.OrderCheckout{}).
|
||||
Where("order_id = ? AND status IN ?", orderID, []string{checkoutStatusSubmitted, checkoutStatusCountered, checkoutStatusAccepted, checkoutStatusDisputed}).
|
||||
Count(&count).Error
|
||||
return count > 0, err
|
||||
}
|
||||
@@ -0,0 +1,240 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
|
||||
import type { Order } from '@/features/orders/api/orders'
|
||||
import { amountYuan, money } from '@/features/orders/composables/useOrderSnapshot'
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
variant?: 'desktop' | 'mobile'
|
||||
order: Order
|
||||
isOwner: boolean
|
||||
isRenter: boolean
|
||||
}>(),
|
||||
{ variant: 'desktop' }
|
||||
)
|
||||
|
||||
const checkout = computed(() => props.order.checkout)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section v-if="checkout && props.variant === 'mobile'" class="card-section">
|
||||
<h3 class="section-title">结账结算账单</h3>
|
||||
<van-cell-group inset :border="false">
|
||||
<van-cell
|
||||
title="实际结算租金"
|
||||
:value="`¥${money(amountYuan(checkout.display_amount_cent))}`"
|
||||
/>
|
||||
<van-cell
|
||||
title="押金总额"
|
||||
:label="
|
||||
amountYuan(props.order.deposit_waived_amount_cent) > 0
|
||||
? `已免押 ¥${money(amountYuan(props.order.deposit_waived_amount_cent))}`
|
||||
: ''
|
||||
"
|
||||
:value="`¥${money(amountYuan(checkout.deposit_amount_cent))}`"
|
||||
/>
|
||||
<van-cell
|
||||
title="额外消耗品已用"
|
||||
:value="`¥${money(amountYuan(checkout.consumable_amount_cent))}`"
|
||||
/>
|
||||
<van-cell
|
||||
title="押金赔付扣除"
|
||||
:value="`¥${money(amountYuan(checkout.deposit_deduct_amount_cent))}`"
|
||||
value-class="red-text"
|
||||
/>
|
||||
<van-cell
|
||||
v-if="props.isRenter"
|
||||
title="退还租客"
|
||||
:value="`¥${money(amountYuan(checkout.renter_refund_amount_cent))}`"
|
||||
value-class="green-text"
|
||||
/>
|
||||
<van-cell
|
||||
v-if="props.isOwner"
|
||||
title="号主最终收入"
|
||||
:value="`¥${money(amountYuan(checkout.owner_income_amount_cent))}`"
|
||||
value-class="green-text"
|
||||
/>
|
||||
<van-cell v-if="checkout.content" title="结账备注" :label="checkout.content" />
|
||||
<van-cell
|
||||
v-if="checkout.owner_adjustment_reason"
|
||||
title="号主修正原因"
|
||||
:label="checkout.owner_adjustment_reason"
|
||||
/>
|
||||
</van-cell-group>
|
||||
</section>
|
||||
|
||||
<div v-else-if="checkout" class="info-section">
|
||||
<div class="section-header">
|
||||
<h2>结账明细</h2>
|
||||
</div>
|
||||
<div class="checkout-summary-card">
|
||||
<div class="summary-row">
|
||||
<span>实际结算租金</span>
|
||||
<strong>¥{{ money(amountYuan(checkout.display_amount_cent)) }}</strong>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span>预收押金</span>
|
||||
<strong>
|
||||
¥{{ money(amountYuan(checkout.deposit_amount_cent)) }}
|
||||
<em v-if="amountYuan(props.order.deposit_waived_amount_cent) > 0">
|
||||
已免押 ¥{{ money(amountYuan(props.order.deposit_waived_amount_cent)) }}
|
||||
</em>
|
||||
</strong>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span>额外消耗品已用</span>
|
||||
<strong class="warning">¥{{ money(amountYuan(checkout.consumable_amount_cent)) }}</strong>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span>押金赔付扣除</span>
|
||||
<strong class="warning">
|
||||
¥{{ money(amountYuan(checkout.deposit_deduct_amount_cent)) }}
|
||||
</strong>
|
||||
</div>
|
||||
<div v-if="props.isRenter" class="summary-row highlight">
|
||||
<span>退还租客（未使用租金 + 剩余押金）</span>
|
||||
<strong class="amount">¥{{ money(amountYuan(checkout.renter_refund_amount_cent)) }}</strong>
|
||||
</div>
|
||||
<div v-if="props.isOwner" class="summary-row highlight">
|
||||
<span>号主最终收入（租金 + 押金赔付）</span>
|
||||
<strong class="amount">¥{{ money(amountYuan(checkout.owner_income_amount_cent)) }}</strong>
|
||||
</div>
|
||||
<div v-if="checkout.content" class="summary-note">
|
||||
<label>说明：</label>
|
||||
<p>{{ checkout.content }}</p>
|
||||
</div>
|
||||
<div v-if="checkout.owner_adjustment_reason" class="summary-note warning">
|
||||
<label>修正原因：</label>
|
||||
<p>{{ checkout.owner_adjustment_reason }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.info-section {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.section-header h2 {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #1f2937;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.checkout-summary-card {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
padding: 24px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.summary-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 12px 0;
|
||||
border-bottom: 1px solid #f3f4f6;
|
||||
}
|
||||
|
||||
.summary-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.summary-row.highlight {
|
||||
padding: 16px;
|
||||
background: #f0fdf4;
|
||||
border: 1px solid #bbf7d0;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.summary-row span {
|
||||
font-size: 14px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
.summary-row strong {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #1f2937;
|
||||
}
|
||||
|
||||
.summary-row strong em {
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
.summary-row strong.amount {
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
.summary-row strong.warning {
|
||||
color: #dc2626;
|
||||
}
|
||||
|
||||
.summary-note {
|
||||
padding: 16px;
|
||||
background: #f8fafc;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.summary-note.warning {
|
||||
background: #fff7ed;
|
||||
}
|
||||
|
||||
.summary-note label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
color: #64748b;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.summary-note p {
|
||||
margin: 0;
|
||||
color: #1f2937;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.card-section {
|
||||
margin: 12px 12px 0;
|
||||
padding: 14px;
|
||||
background: #ffffff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 15px;
|
||||
font-weight: 800;
|
||||
color: #182232;
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
|
||||
:deep(.red-text) {
|
||||
color: #ef4444;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
:deep(.green-text) {
|
||||
color: #16a34a;
|
||||
font-weight: 700;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,170 @@
|
||||
<script setup lang="ts">
|
||||
import type { HandoffRecord } from '@/features/orders/api/orders'
|
||||
import { formatHandoffRecordType } from '@/features/orders/composables/useOrderSnapshot'
|
||||
import { formatDateTime } from '@/shared/utils/time'
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
variant?: 'desktop' | 'mobile'
|
||||
records: HandoffRecord[]
|
||||
listingCode: string
|
||||
}>(),
|
||||
{ variant: 'desktop' }
|
||||
)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section v-if="props.variant === 'mobile'" class="card-section">
|
||||
<h3 class="section-title">交接日志 · 商品编号 {{ props.listingCode }}</h3>
|
||||
<van-empty v-if="props.records.length === 0" image="search" description="暂无交接日志记录" />
|
||||
<div v-else class="log-timeline">
|
||||
<div v-for="record in props.records" :key="record.id" class="log-item">
|
||||
<div class="log-dot"></div>
|
||||
<div class="log-content-wrap">
|
||||
<strong class="log-type">{{ formatHandoffRecordType(record.type) }}</strong>
|
||||
<p class="log-desc">{{ record.content }}</p>
|
||||
<span class="log-time">{{ formatDateTime(record.created_at) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div v-else class="timeline-section">
|
||||
<div class="section-header">
|
||||
<h2>交接记录</h2>
|
||||
<span>商品编号 {{ props.listingCode }}</span>
|
||||
</div>
|
||||
<el-empty v-if="props.records.length === 0" description="暂无交接记录" />
|
||||
<el-timeline v-else>
|
||||
<el-timeline-item
|
||||
v-for="record in props.records"
|
||||
:key="record.id"
|
||||
:timestamp="formatDateTime(record.created_at)"
|
||||
placement="top"
|
||||
>
|
||||
<div class="timeline-content">
|
||||
<div class="timeline-title">{{ formatHandoffRecordType(record.type) }}</div>
|
||||
<div class="timeline-body">{{ record.content }}</div>
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.timeline-section {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.section-header h2 {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #1f2937;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.timeline-section :deep(.el-timeline) {
|
||||
padding: 24px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.timeline-content {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.timeline-title {
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
}
|
||||
|
||||
.timeline-body {
|
||||
font-size: 14px;
|
||||
color: #64748b;
|
||||
line-height: 1.6;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.card-section {
|
||||
margin: 12px 12px 0;
|
||||
padding: 14px;
|
||||
background: #ffffff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 15px;
|
||||
font-weight: 800;
|
||||
color: #182232;
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
|
||||
.log-timeline {
|
||||
position: relative;
|
||||
padding-left: 18px;
|
||||
}
|
||||
|
||||
.log-timeline::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
top: 4px;
|
||||
bottom: 4px;
|
||||
width: 1px;
|
||||
background: #e2e8f0;
|
||||
}
|
||||
|
||||
.log-item {
|
||||
position: relative;
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
.log-item:last-child {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.log-dot {
|
||||
position: absolute;
|
||||
left: -18px;
|
||||
top: 4px;
|
||||
z-index: 1;
|
||||
width: 11px;
|
||||
height: 11px;
|
||||
border: 2px solid #ffffff;
|
||||
border-radius: 50%;
|
||||
background: #ff6a00;
|
||||
}
|
||||
|
||||
.log-content-wrap {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.log-type {
|
||||
color: #182232;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.log-desc {
|
||||
margin: 0;
|
||||
color: #5f6f86;
|
||||
font-size: 13px;
|
||||
line-height: 1.55;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.log-time {
|
||||
color: #a0aec0;
|
||||
font-size: 11px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,547 @@
|
||||
<script setup lang="ts">
|
||||
import type { CheckoutResource } from '@/features/orders/composables/useOrderSnapshot'
|
||||
import { money, quantity } from '@/features/orders/composables/useOrderSnapshot'
|
||||
|
||||
type CheckoutFormModel = {
|
||||
content: string
|
||||
coin_consumed_m: number
|
||||
otherAmountYuan: number
|
||||
evidenceText: string
|
||||
}
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
variant?: 'desktop' | 'mobile'
|
||||
checkoutForm: CheckoutFormModel
|
||||
resources: CheckoutResource[]
|
||||
resourceUsage: Record<string, number>
|
||||
resourceChargeAmount: number
|
||||
snapshotHafCoinM: number
|
||||
remainingHafCoinM: number
|
||||
returning: boolean
|
||||
resourceLineAmount: (item: CheckoutResource) => number
|
||||
}>(),
|
||||
{ variant: 'desktop' }
|
||||
)
|
||||
|
||||
const emit = defineEmits<{
|
||||
'update:checkoutForm': [value: CheckoutFormModel]
|
||||
'update:resourceUsage': [value: Record<string, number>]
|
||||
submit: []
|
||||
}>()
|
||||
|
||||
function updateCheckoutForm(patch: Partial<CheckoutFormModel>) {
|
||||
emit('update:checkoutForm', { ...props.checkoutForm, ...patch })
|
||||
}
|
||||
|
||||
function updateResourceUsage(key: string, value: number | string | null) {
|
||||
emit('update:resourceUsage', {
|
||||
...props.resourceUsage,
|
||||
[key]: Number(value) || 0,
|
||||
})
|
||||
}
|
||||
|
||||
function updateNumberField(field: 'coin_consumed_m' | 'otherAmountYuan', event: Event) {
|
||||
updateCheckoutForm({ [field]: Number((event.target as HTMLInputElement).value) || 0 })
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section v-if="props.variant === 'mobile'" class="card-section action-card">
|
||||
<h3 class="section-title">退号发起结账</h3>
|
||||
<p class="action-hint">使用完毕，请输入在此期间消耗的物资与哈夫币进行结账申请。</p>
|
||||
|
||||
<van-field
|
||||
:model-value="props.checkoutForm.content"
|
||||
rows="3"
|
||||
autosize
|
||||
label="结账备注"
|
||||
type="textarea"
|
||||
placeholder="可在此说明物品消耗情况或归还留言"
|
||||
class="action-field"
|
||||
@update:model-value="updateCheckoutForm({ content: String($event) })"
|
||||
/>
|
||||
|
||||
<div v-if="props.resources.length" class="resource-usage-panel">
|
||||
<strong class="resource-panel-title">额外物资消耗登记</strong>
|
||||
<div v-for="item in props.resources" :key="item.key" class="resource-row">
|
||||
<div class="resource-meta">
|
||||
<span class="resource-name">{{ item.label }}</span>
|
||||
<span class="resource-price-text">
|
||||
上限 {{ item.quantity }} · {{ item.mode }} · {{ item.price }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="stepper-wrap">
|
||||
<van-stepper
|
||||
:model-value="props.resourceUsage[item.key]"
|
||||
integer
|
||||
min="0"
|
||||
:max="item.quantity"
|
||||
@update:model-value="updateResourceUsage(item.key, $event)"
|
||||
/>
|
||||
<span class="resource-line-amount">¥{{ money(props.resourceLineAmount(item)) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="resource-panel-footer">
|
||||
<span>物资金额合计：</span>
|
||||
<strong>¥{{ money(props.resourceChargeAmount) }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-cell-group inset :border="false" class="action-field">
|
||||
<van-field label="消耗哈夫币" label-width="100px">
|
||||
<template #input>
|
||||
<div class="coin-input-wrap">
|
||||
<input
|
||||
:value="props.checkoutForm.coin_consumed_m"
|
||||
type="number"
|
||||
placeholder="消耗数量"
|
||||
class="custom-inline-input"
|
||||
@input="updateNumberField('coin_consumed_m', $event)"
|
||||
/>
|
||||
<span class="input-unit">M</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-field>
|
||||
<div class="coin-hint">
|
||||
订单快照 {{ quantity(props.snapshotHafCoinM) }}M，预计剩余
|
||||
{{ quantity(props.remainingHafCoinM) }}M
|
||||
</div>
|
||||
<van-field label="其他押金赔付" label-width="100px">
|
||||
<template #input>
|
||||
<div class="coin-input-wrap">
|
||||
<input
|
||||
:value="props.checkoutForm.otherAmountYuan"
|
||||
type="number"
|
||||
placeholder="不含上方额外物资"
|
||||
class="custom-inline-input"
|
||||
@input="updateNumberField('otherAmountYuan', $event)"
|
||||
/>
|
||||
<span class="input-unit">元</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-field>
|
||||
<div class="deposit-deduct-hint">仅填写封禁、违规、资产损坏等需要从押金赔付的费用。</div>
|
||||
</van-cell-group>
|
||||
|
||||
<div class="checkout-fee-preview">
|
||||
<div>
|
||||
<span>额外消耗品已用</span>
|
||||
<strong>¥{{ money(props.resourceChargeAmount) }}</strong>
|
||||
<em>计入实际结算租金</em>
|
||||
</div>
|
||||
<div>
|
||||
<span>其他押金赔付</span>
|
||||
<strong>¥{{ money(props.checkoutForm.otherAmountYuan) }}</strong>
|
||||
<em>从押金赔付扣除</em>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-field
|
||||
:model-value="props.checkoutForm.evidenceText"
|
||||
rows="2"
|
||||
autosize
|
||||
label="结账证据"
|
||||
type="textarea"
|
||||
placeholder="结账截图链接（每行一个）"
|
||||
class="action-field"
|
||||
@update:model-value="updateCheckoutForm({ evidenceText: String($event) })"
|
||||
/>
|
||||
|
||||
<van-button
|
||||
type="primary"
|
||||
block
|
||||
round
|
||||
:loading="props.returning"
|
||||
loading-text="正在提交结账..."
|
||||
@click="emit('submit')"
|
||||
>
|
||||
提交结账归还
|
||||
</van-button>
|
||||
</section>
|
||||
|
||||
<div v-else class="form-section checkout-form-section">
|
||||
<div class="section-header">
|
||||
<h2>发起结账</h2>
|
||||
</div>
|
||||
<div class="form-card">
|
||||
<el-input
|
||||
:model-value="props.checkoutForm.content"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
placeholder="填写结账说明、租后资产状态或注意事项"
|
||||
@update:model-value="updateCheckoutForm({ content: String($event) })"
|
||||
/>
|
||||
<div class="checkout-resource-panel">
|
||||
<div class="checkout-resource-head">
|
||||
<strong>额外消耗品</strong>
|
||||
<span class="amount-highlight">已用金额：¥{{ money(props.resourceChargeAmount) }}</span>
|
||||
</div>
|
||||
<el-empty v-if="props.resources.length === 0" description="订单快照中暂无额外消耗品" />
|
||||
<div v-for="item in props.resources" v-else :key="item.key" class="checkout-resource-row">
|
||||
<div class="checkout-resource-meta">
|
||||
<strong>{{ item.label }}</strong>
|
||||
<span>库存 {{ item.quantity }}，{{ item.mode }}，{{ item.price || '未设置单价' }}</span>
|
||||
</div>
|
||||
<el-input-number
|
||||
:model-value="props.resourceUsage[item.key]"
|
||||
:min="0"
|
||||
:max="item.quantity"
|
||||
:precision="0"
|
||||
controls-position="right"
|
||||
@update:model-value="updateResourceUsage(item.key, $event)"
|
||||
/>
|
||||
<span class="checkout-resource-amount">¥{{ money(props.resourceLineAmount(item)) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<el-form class="form-grid" label-position="top">
|
||||
<el-form-item label="消耗哈夫币（M）">
|
||||
<el-input-number
|
||||
:model-value="props.checkoutForm.coin_consumed_m"
|
||||
class="full-control"
|
||||
:min="0"
|
||||
:max="props.snapshotHafCoinM"
|
||||
:precision="2"
|
||||
controls-position="right"
|
||||
@update:model-value="updateCheckoutForm({ coin_consumed_m: Number($event) || 0 })"
|
||||
/>
|
||||
<span class="field-hint">
|
||||
订单快照 {{ quantity(props.snapshotHafCoinM) }}M，预计剩余
|
||||
{{ quantity(props.remainingHafCoinM) }}M
|
||||
</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="其他押金赔付（元）">
|
||||
<el-input-number
|
||||
:model-value="props.checkoutForm.otherAmountYuan"
|
||||
class="full-control"
|
||||
:min="0"
|
||||
:precision="0"
|
||||
controls-position="right"
|
||||
@update:model-value="updateCheckoutForm({ otherAmountYuan: Number($event) || 0 })"
|
||||
/>
|
||||
<span class="field-hint">
|
||||
不含上方额外消耗品；仅填写封禁、违规、资产损坏等需要从押金赔付的费用。
|
||||
</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="checkout-deduct-preview">
|
||||
<div>
|
||||
<span>额外消耗品已用</span>
|
||||
<strong>¥{{ money(props.resourceChargeAmount) }}</strong>
|
||||
<em>按上方物资数量自动计算，计入实际结算租金</em>
|
||||
</div>
|
||||
<div>
|
||||
<span>其他押金赔付</span>
|
||||
<strong>¥{{ money(props.checkoutForm.otherAmountYuan) }}</strong>
|
||||
<em>作为押金赔付扣除，和额外消耗品分开展示</em>
|
||||
</div>
|
||||
</div>
|
||||
<el-input
|
||||
:model-value="props.checkoutForm.evidenceText"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="结账证据链接，一行一个。可填写截图地址或备注链接"
|
||||
@update:model-value="updateCheckoutForm({ evidenceText: String($event) })"
|
||||
/>
|
||||
<el-button type="primary" size="large" :loading="props.returning" @click="emit('submit')">
|
||||
发起结账
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.form-section {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.section-header h2 {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #1f2937;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.form-card {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
padding: 24px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.checkout-resource-panel {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
padding: 16px;
|
||||
background: #f9fafb;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.checkout-resource-head {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
padding-bottom: 12px;
|
||||
border-bottom: 2px solid #e5e7eb;
|
||||
}
|
||||
|
||||
.checkout-resource-head strong {
|
||||
color: #1f2937;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.amount-highlight {
|
||||
color: #ff6a00;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.checkout-resource-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto auto;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
padding: 12px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.checkout-resource-meta {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.checkout-resource-meta strong {
|
||||
color: #1f2937;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.checkout-resource-meta span {
|
||||
color: #6b7785;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.checkout-resource-amount {
|
||||
min-width: 80px;
|
||||
text-align: right;
|
||||
color: #ff6a00;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.field-hint {
|
||||
display: block;
|
||||
margin-top: 6px;
|
||||
color: #6b7280;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview,
|
||||
.checkout-fee-preview {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.checkout-deduct-preview div,
|
||||
.checkout-fee-preview div {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
padding: 12px;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
background: #f9fafb;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview span,
|
||||
.checkout-fee-preview span {
|
||||
color: #4b5563;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview strong,
|
||||
.checkout-fee-preview strong {
|
||||
color: #ff6a00;
|
||||
font-size: 18px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview em,
|
||||
.checkout-fee-preview em {
|
||||
color: #6b7280;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.card-section {
|
||||
margin: 12px 12px 0;
|
||||
padding: 14px;
|
||||
background: #ffffff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.action-card {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 15px;
|
||||
font-weight: 800;
|
||||
color: #182232;
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
|
||||
.action-hint {
|
||||
margin: 0 0 12px;
|
||||
color: #5f6f86;
|
||||
font-size: 13px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.action-field {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.resource-usage-panel {
|
||||
margin: 0 16px 12px;
|
||||
padding: 12px;
|
||||
border: 1px solid #edf2f7;
|
||||
border-radius: 8px;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.resource-panel-title {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 10px;
|
||||
color: #2d3748;
|
||||
}
|
||||
|
||||
.resource-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px dashed #e2e8f0;
|
||||
}
|
||||
|
||||
.resource-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.resource-meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.resource-name {
|
||||
font-size: 13px;
|
||||
color: #2d3748;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.resource-price-text {
|
||||
font-size: 11px;
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
.stepper-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.resource-line-amount {
|
||||
min-width: 50px;
|
||||
text-align: right;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #ff5f00;
|
||||
}
|
||||
|
||||
.resource-panel-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: baseline;
|
||||
margin-top: 10px;
|
||||
font-size: 12px;
|
||||
color: #4a5568;
|
||||
}
|
||||
|
||||
.resource-panel-footer strong {
|
||||
font-size: 15px;
|
||||
color: #ff5f00;
|
||||
}
|
||||
|
||||
.coin-input-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.custom-inline-input {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
border: none;
|
||||
outline: none;
|
||||
background: transparent;
|
||||
font-size: 14px;
|
||||
color: #182232;
|
||||
}
|
||||
|
||||
.input-unit {
|
||||
color: #8a94a6;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.coin-hint,
|
||||
.deposit-deduct-hint {
|
||||
padding: 0 16px 10px;
|
||||
color: #8a94a6;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.checkout-fee-preview {
|
||||
margin: 0 16px 12px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.checkout-resource-row {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.checkout-resource-amount {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,80 +1,194 @@
|
||||
import type { Order } from '../api/orders'
|
||||
import { computed, type Ref } from 'vue'
|
||||
|
||||
export interface SnapshotResource {
|
||||
key: string
|
||||
label: string
|
||||
quantity: number
|
||||
unitPrice: number
|
||||
chargeMode: '赠送' | '收费'
|
||||
import { centToYuan, formatMoney } from '@/shared/utils/money'
|
||||
import type { Checkout, Order } from '../api/orders'
|
||||
|
||||
export interface CheckoutFormSnapshot {
|
||||
content: string
|
||||
coin_consumed_m: number
|
||||
}
|
||||
|
||||
export function readSnapshot(order: Order | null) {
|
||||
if (!order?.listing_snapshot) return null
|
||||
try {
|
||||
return JSON.parse(order.listing_snapshot) as Record<string, any>
|
||||
} catch {
|
||||
return null
|
||||
export interface CounterFormSnapshot {
|
||||
consumableAmountYuan: number
|
||||
coin_consumed_m: number
|
||||
otherAmountYuan: number
|
||||
depositDeductAmountYuan: number
|
||||
reason: string
|
||||
evidenceText: string
|
||||
}
|
||||
|
||||
export interface CheckoutResource {
|
||||
key: string
|
||||
label: string
|
||||
price: string
|
||||
mode: string
|
||||
quantity: number
|
||||
unitPrice: number
|
||||
}
|
||||
|
||||
export function useOrderCheckoutSnapshot(options: {
|
||||
order: Ref<Order | null>
|
||||
checkoutForm: Ref<CheckoutFormSnapshot>
|
||||
resourceUsage: Ref<Record<string, number>>
|
||||
}) {
|
||||
const checkoutResources = computed(() => readSnapshotResources(options.order.value))
|
||||
const resourceChargeAmount = computed(() =>
|
||||
calculateResourceChargeAmount(checkoutResources.value, options.resourceUsage.value)
|
||||
)
|
||||
const snapshotHafCoinM = computed(() => getSnapshotHafCoinM(options.order.value))
|
||||
const remainingHafCoinM = computed(() =>
|
||||
roundQuantity(
|
||||
Math.max(snapshotHafCoinM.value - Number(options.checkoutForm.value.coin_consumed_m || 0), 0)
|
||||
)
|
||||
)
|
||||
|
||||
function hydrateResourceUsage() {
|
||||
options.resourceUsage.value = normalizeResourceUsage(
|
||||
checkoutResources.value,
|
||||
options.resourceUsage.value
|
||||
)
|
||||
}
|
||||
|
||||
function readResourceUsage(key: string) {
|
||||
return readResourceUsageAmount(options.resourceUsage.value, key)
|
||||
}
|
||||
|
||||
function resourceLineAmount(item: CheckoutResource) {
|
||||
return roundMoney(readResourceUsage(item.key) * item.unitPrice)
|
||||
}
|
||||
|
||||
function checkoutContentWithSummary() {
|
||||
return buildCheckoutContentWithSummary({
|
||||
content: options.checkoutForm.value.content,
|
||||
coinConsumedM: options.checkoutForm.value.coin_consumed_m,
|
||||
checkoutResources: checkoutResources.value,
|
||||
resourceUsage: options.resourceUsage.value,
|
||||
remainingHafCoinM: remainingHafCoinM.value,
|
||||
})
|
||||
}
|
||||
|
||||
return {
|
||||
checkoutResources,
|
||||
resourceChargeAmount,
|
||||
snapshotHafCoinM,
|
||||
remainingHafCoinM,
|
||||
hydrateResourceUsage,
|
||||
readResourceUsage,
|
||||
isChargedResource,
|
||||
resourceLineAmount,
|
||||
checkoutContentWithSummary,
|
||||
}
|
||||
}
|
||||
|
||||
export function readNumber(value: unknown): number {
|
||||
const parsed = Number(value)
|
||||
return Number.isFinite(parsed) ? parsed : 0
|
||||
export function readSnapshot(order: Order | null) {
|
||||
const snapshot = order?.account_snapshot
|
||||
return isRecord(snapshot) ? snapshot : null
|
||||
}
|
||||
|
||||
export function roundQuantity(value: number): number {
|
||||
return Math.round(value * 10) / 10
|
||||
export function readAssetSummary(order: Order | null) {
|
||||
const summary = readSnapshot(order)?.asset_summary
|
||||
return isRecord(summary) ? summary : null
|
||||
}
|
||||
|
||||
export function roundMoney(value: number): number {
|
||||
return Math.round(value * 100) / 100
|
||||
export function readSnapshotResources(order: Order | null): CheckoutResource[] {
|
||||
const resources = readAssetSummary(order)?.resources
|
||||
if (!Array.isArray(resources)) return []
|
||||
return resources
|
||||
.filter(isRecord)
|
||||
.map(item => {
|
||||
const key = String(item.key || item.label || '')
|
||||
const label = String(item.label || key || '额外消耗品')
|
||||
const price = String(item.price || '')
|
||||
return {
|
||||
key,
|
||||
label,
|
||||
price,
|
||||
mode: String(item.mode || '收费'),
|
||||
quantity: readNumber(item.quantity),
|
||||
unitPrice: readUnitPrice(price),
|
||||
}
|
||||
})
|
||||
.filter(item => item.key && item.quantity > 0)
|
||||
}
|
||||
|
||||
export function readSnapshotResources(order: Order | null): SnapshotResource[] {
|
||||
const snapshot = readSnapshot(order)
|
||||
if (!snapshot?.quantities) return []
|
||||
|
||||
const quantities = snapshot.quantities as Record<string, any>[]
|
||||
return quantities
|
||||
.map(item => ({
|
||||
key: String(item.key || ''),
|
||||
label: String(item.label || ''),
|
||||
quantity: readNumber(item.quantity),
|
||||
unitPrice: readNumber(item.price),
|
||||
chargeMode: (item.charge_mode === '收费' ? '收费' : '赠送') as SnapshotResource['chargeMode'],
|
||||
}))
|
||||
.filter(item => item.key && item.label)
|
||||
export function normalizeResourceUsage(
|
||||
resources: CheckoutResource[],
|
||||
current: Record<string, number>
|
||||
) {
|
||||
const next: Record<string, number> = {}
|
||||
for (const item of resources) {
|
||||
next[item.key] = Math.min(Math.max(Number(current[item.key] || 0), 0), item.quantity)
|
||||
}
|
||||
return next
|
||||
}
|
||||
|
||||
export function isChargedResource(resource: SnapshotResource): boolean {
|
||||
return resource.chargeMode === '收费'
|
||||
export function readResourceUsageAmount(resourceUsage: Record<string, number>, key: string) {
|
||||
return Math.max(Number(resourceUsage[key] || 0), 0)
|
||||
}
|
||||
|
||||
export function getSnapshotHafCoinM(order: Order | null): number {
|
||||
const snapshot = readSnapshot(order)
|
||||
return roundQuantity(readNumber(snapshot?.haf_coin_amount) / 1000000)
|
||||
export function isChargedResource(item: CheckoutResource) {
|
||||
return item.mode !== '赠送'
|
||||
}
|
||||
|
||||
export function calculateResourceChargeAmount(
|
||||
resources: SnapshotResource[],
|
||||
resources: CheckoutResource[],
|
||||
resourceUsage: Record<string, number>
|
||||
): number {
|
||||
) {
|
||||
return roundMoney(
|
||||
resources.reduce((sum, item) => {
|
||||
if (!isChargedResource(item)) return sum
|
||||
const used = resourceUsage[item.key] || 0
|
||||
const used = readResourceUsageAmount(resourceUsage, item.key)
|
||||
return sum + used * item.unitPrice
|
||||
}, 0)
|
||||
)
|
||||
}
|
||||
|
||||
export function calculateCheckoutTotal(
|
||||
resourceCharge: number,
|
||||
consumableAmount: number,
|
||||
coinConsumed: number,
|
||||
otherAmount: number
|
||||
): number {
|
||||
return roundMoney(resourceCharge + consumableAmount + coinConsumed + otherAmount)
|
||||
export function buildCheckoutContentWithSummary(options: {
|
||||
content: string
|
||||
coinConsumedM: number
|
||||
checkoutResources: CheckoutResource[]
|
||||
resourceUsage: Record<string, number>
|
||||
remainingHafCoinM: number
|
||||
}) {
|
||||
const lines = [options.content.trim()].filter(Boolean)
|
||||
const usedResources = options.checkoutResources.filter(
|
||||
item => readResourceUsageAmount(options.resourceUsage, item.key) > 0
|
||||
)
|
||||
if (usedResources.length) {
|
||||
lines.push(
|
||||
`额外消耗品：${usedResources
|
||||
.map(item => {
|
||||
const used = readResourceUsageAmount(options.resourceUsage, item.key)
|
||||
const amount = roundMoney(used * item.unitPrice)
|
||||
return `${item.label} ${used}/${item.quantity}${
|
||||
isChargedResource(item) ? `，金额¥${money(amount)}` : '，赠送不扣款'
|
||||
}`
|
||||
})
|
||||
.join('；')}`
|
||||
)
|
||||
}
|
||||
if (Number(options.coinConsumedM || 0) > 0) {
|
||||
lines.push(
|
||||
`哈夫币消耗：${quantity(options.coinConsumedM)}M，预计剩余${quantity(
|
||||
options.remainingHafCoinM
|
||||
)}M`
|
||||
)
|
||||
}
|
||||
if (lines.length === 0) {
|
||||
lines.push('租客发起结账。')
|
||||
}
|
||||
return lines.join('\n')
|
||||
}
|
||||
|
||||
export function hydrateCounterFormFromCheckout(checkout: Checkout): CounterFormSnapshot {
|
||||
return {
|
||||
consumableAmountYuan: amountYuan(checkout.consumable_amount_cent),
|
||||
coin_consumed_m: checkout.coin_consumed_m,
|
||||
otherAmountYuan: amountYuan(checkout.other_amount_cent),
|
||||
depositDeductAmountYuan: amountYuan(checkout.deposit_deduct_amount_cent),
|
||||
reason: '',
|
||||
evidenceText: '',
|
||||
}
|
||||
}
|
||||
|
||||
export function calculateCounterTotal(counterForm: {
|
||||
@@ -82,7 +196,7 @@ export function calculateCounterTotal(counterForm: {
|
||||
coin_consumed_m: number
|
||||
otherAmountYuan: number
|
||||
depositDeductAmountYuan: number
|
||||
}): number {
|
||||
}) {
|
||||
return roundMoney(
|
||||
counterForm.consumableAmountYuan +
|
||||
counterForm.coin_consumed_m +
|
||||
@@ -91,57 +205,90 @@ export function calculateCounterTotal(counterForm: {
|
||||
)
|
||||
}
|
||||
|
||||
export function hydrateResourceUsageFromOrder(
|
||||
order: Order | null,
|
||||
resources: SnapshotResource[]
|
||||
): Record<string, number> {
|
||||
const usage: Record<string, number> = {}
|
||||
|
||||
if (!order?.checkout_info) {
|
||||
return usage
|
||||
}
|
||||
|
||||
try {
|
||||
const info = JSON.parse(order.checkout_info) as Record<string, any>
|
||||
const consumedResources = info.consumed_resources as Record<string, number> | undefined
|
||||
|
||||
if (consumedResources) {
|
||||
resources.forEach(res => {
|
||||
if (res.key in consumedResources) {
|
||||
usage[res.key] = consumedResources[res.key] ?? 0
|
||||
}
|
||||
})
|
||||
}
|
||||
} catch {
|
||||
// ignore
|
||||
}
|
||||
|
||||
return usage
|
||||
export function getSnapshotHafCoinM(order: Order | null) {
|
||||
const snapshot = readSnapshot(order)
|
||||
return roundQuantity(readNumber(snapshot?.haf_coin_amount) / 1000000)
|
||||
}
|
||||
|
||||
export function hydrateCounterFormFromOrder(order: Order | null) {
|
||||
if (!order?.counter_info) {
|
||||
return null
|
||||
}
|
||||
|
||||
try {
|
||||
const info = JSON.parse(order.counter_info) as Record<string, any>
|
||||
return {
|
||||
consumableAmountYuan: readNumber(info.consumableAmountYuan),
|
||||
coin_consumed_m: readNumber(info.coin_consumed_m),
|
||||
otherAmountYuan: readNumber(info.otherAmountYuan),
|
||||
depositDeductAmountYuan: readNumber(info.depositDeductAmountYuan),
|
||||
reason: String(info.reason || ''),
|
||||
evidenceText: String(info.evidence || ''),
|
||||
}
|
||||
} catch {
|
||||
return null
|
||||
}
|
||||
export function orderEstimatedEndAt(order: Order | null) {
|
||||
const rentedAt = order?.rented_at
|
||||
const durationHours = Number(order?.estimated_duration_hours || 0)
|
||||
if (!rentedAt || durationHours <= 0) return undefined
|
||||
return new Date(new Date(rentedAt).getTime() + durationHours * 60 * 60 * 1000).toISOString()
|
||||
}
|
||||
|
||||
export function readError(error: unknown, fallback: string): string {
|
||||
if (error && typeof error === 'object' && 'message' in error) {
|
||||
return String(error.message)
|
||||
export function orderRentAmount(item: Order, userID: number | undefined | null) {
|
||||
if (item.owner_id === userID) return amountYuan(item.owner_rent_amount_cent)
|
||||
if (item.renter_id === userID) return amountYuan(item.rent_amount_cent)
|
||||
return amountYuan(item.display_amount_cent)
|
||||
}
|
||||
|
||||
export function ownerActualIncome(item: Order, userID: number | undefined | null) {
|
||||
if (item.owner_id !== userID) return null
|
||||
const value = item.checkout?.owner_income_amount_cent
|
||||
return typeof value === 'number' ? centToYuan(value) : null
|
||||
}
|
||||
|
||||
export function formatHandoffRecordType(type: string) {
|
||||
const typeMap: Record<string, string> = {
|
||||
owner_handoff: '卖家交接',
|
||||
renter_checkout: '买家结账',
|
||||
owner_counter_checkout: '卖家反驳结账',
|
||||
renter_confirm_checkout: '买家确认结账',
|
||||
owner_accept_checkout: '卖家接受结账',
|
||||
admin_arbitration: '客服仲裁',
|
||||
}
|
||||
return fallback
|
||||
return typeMap[type] || type
|
||||
}
|
||||
|
||||
export function linesToList(value: string) {
|
||||
return value
|
||||
.split('\n')
|
||||
.map(item => item.trim())
|
||||
.filter(Boolean)
|
||||
}
|
||||
|
||||
export function money(value: unknown) {
|
||||
return formatMoney(readNumber(value))
|
||||
}
|
||||
|
||||
export function amountYuan(cent: unknown) {
|
||||
if (cent !== undefined && cent !== null) return centToYuan(readNumber(cent))
|
||||
return 0
|
||||
}
|
||||
|
||||
export function quantity(value: unknown) {
|
||||
const rounded = roundQuantity(readNumber(value))
|
||||
return Number.isInteger(rounded) ? `${rounded}` : rounded.toFixed(2)
|
||||
}
|
||||
|
||||
export function readUnitPrice(priceText: string) {
|
||||
const normalized = priceText.replace(/，/g, ',').trim()
|
||||
const fractionMatch = normalized.match(/(\d+(?:\.\d+)?)\s*元\s*\/\s*(\d+(?:\.\d+)?)/)
|
||||
if (fractionMatch) {
|
||||
const amount = Number(fractionMatch[1])
|
||||
const count = Number(fractionMatch[2])
|
||||
return count > 0 ? roundMoney(amount / count) : 0
|
||||
}
|
||||
const singleMatch = normalized.match(/(\d+(?:\.\d+)?)\s*元/)
|
||||
if (singleMatch) return Number(singleMatch[1])
|
||||
const fallback = normalized.match(/(\d+(?:\.\d+)?)/)
|
||||
return fallback ? Number(fallback[1]) : 0
|
||||
}
|
||||
|
||||
export function roundMoney(value: number) {
|
||||
return Math.round(Number(value || 0) * 10) / 10
|
||||
}
|
||||
|
||||
export function roundQuantity(value: number) {
|
||||
return Math.round(value * 100) / 100
|
||||
}
|
||||
|
||||
export function readNumber(value: unknown) {
|
||||
const number = Number(value || 0)
|
||||
return Number.isFinite(number) ? number : 0
|
||||
}
|
||||
|
||||
function isRecord(value: unknown): value is Record<string, unknown> {
|
||||
return typeof value === 'object' && value !== null
|
||||
}
|
||||
|
||||
@@ -4,3 +4,6 @@ export * from './composables/useOrderDetail'
|
||||
export * from './composables/useOrderSnapshot'
|
||||
export * from './composables/usePaymentPolling'
|
||||
export * from './composables/useSettlement'
|
||||
export { default as OrderCheckoutSummary } from './components/OrderCheckoutSummary.vue'
|
||||
export { default as OrderHandoffTimeline } from './components/OrderHandoffTimeline.vue'
|
||||
export { default as OrderResourceUsageEditor } from './components/OrderResourceUsageEditor.vue'
|
||||
|
||||
@@ -6,7 +6,7 @@ import { showToast, showDialog } from 'vant'
|
||||
import { fetchOrderChat } from '@/features/chats/api/chats'
|
||||
import { createDispute } from '@/features/disputes/api/disputes'
|
||||
import { uploadFile } from '@/shared/api/files'
|
||||
import { centToYuan, formatMoney } from '@/shared/utils/money'
|
||||
import { readError } from '@/shared/utils/error'
|
||||
import {
|
||||
acceptCheckout,
|
||||
cancelOrder,
|
||||
@@ -18,10 +18,25 @@ import {
|
||||
startOrderPayment,
|
||||
submitCheckout,
|
||||
submitHandoff,
|
||||
OrderCheckoutSummary,
|
||||
OrderHandoffTimeline,
|
||||
OrderResourceUsageEditor,
|
||||
type HandoffRecord,
|
||||
type Order,
|
||||
type PaymentOrder,
|
||||
} from '@/features/orders/api/orders'
|
||||
} from '@/features/orders'
|
||||
import {
|
||||
amountYuan,
|
||||
hydrateCounterFormFromCheckout,
|
||||
linesToList,
|
||||
money,
|
||||
orderEstimatedEndAt as readOrderEstimatedEndAt,
|
||||
orderRentAmount,
|
||||
ownerActualIncome,
|
||||
readAssetSummary as readOrderAssetSummary,
|
||||
readSnapshot as readOrderSnapshot,
|
||||
useOrderCheckoutSnapshot,
|
||||
} from '@/features/orders/composables/useOrderSnapshot'
|
||||
import { useSessionStore } from '@/stores/session'
|
||||
import { handoffStatusLabel, orderStatusLabel } from '@/shared/utils/statusLabels'
|
||||
import { formatDateTime } from '@/shared/utils/time'
|
||||
@@ -79,9 +94,11 @@ const showRejectPopup = ref(false)
|
||||
const isOwner = computed(() => order.value?.owner_id === session.userId)
|
||||
const isRenter = computed(() => order.value?.renter_id === session.userId)
|
||||
const orderAmountLabel = computed(() => (isOwner.value ? '预计租金' : '支付租金'))
|
||||
const orderRentDisplayAmount = computed(() => (order.value ? orderRentAmount(order.value) : 0))
|
||||
const orderRentDisplayAmount = computed(() =>
|
||||
order.value ? orderRentAmount(order.value, session.userId) : 0
|
||||
)
|
||||
const ownerIncomeDisplayAmount = computed(() =>
|
||||
order.value ? ownerActualIncome(order.value) : null
|
||||
order.value ? ownerActualIncome(order.value, session.userId) : null
|
||||
)
|
||||
const ownerIncomeLabel = computed(() =>
|
||||
order.value?.status === 'completed' ? '实际到手' : '结账预计到手'
|
||||
@@ -103,28 +120,15 @@ const isCheckoutDisputeStage = computed(() => {
|
||||
['pending_checkout_confirm', 'pending_checkout_accept'].includes(order.value.status)
|
||||
)
|
||||
})
|
||||
const checkoutResources = computed(() => {
|
||||
const resources = readSnapshotResources()
|
||||
return resources.filter(item => item.quantity > 0)
|
||||
})
|
||||
const resourceChargeAmount = computed(() => {
|
||||
return roundMoney(
|
||||
checkoutResources.value.reduce((sum, item) => {
|
||||
if (!isChargedResource(item)) return sum
|
||||
const used = readResourceUsage(item.key)
|
||||
return sum + used * item.unitPrice
|
||||
}, 0)
|
||||
)
|
||||
})
|
||||
const snapshotHafCoinM = computed(() => {
|
||||
const snapshot = readSnapshot()
|
||||
return roundQuantity(readNumber(snapshot?.haf_coin_amount) / 1000000)
|
||||
})
|
||||
const remainingHafCoinM = computed(() => {
|
||||
return roundQuantity(
|
||||
Math.max(snapshotHafCoinM.value - Number(checkoutForm.value.coin_consumed_m || 0), 0)
|
||||
)
|
||||
})
|
||||
const {
|
||||
checkoutResources,
|
||||
resourceChargeAmount,
|
||||
snapshotHafCoinM,
|
||||
remainingHafCoinM,
|
||||
hydrateResourceUsage,
|
||||
resourceLineAmount,
|
||||
checkoutContentWithSummary,
|
||||
} = useOrderCheckoutSnapshot({ order, checkoutForm, resourceUsage })
|
||||
|
||||
onMounted(loadOrder)
|
||||
|
||||
@@ -406,203 +410,25 @@ async function handleCounterEvidenceUpload(event: Event) {
|
||||
}
|
||||
}
|
||||
|
||||
function readError(error: unknown, fallback: string) {
|
||||
if (typeof error === 'object' && error && 'response' in error) {
|
||||
const response = (error as { response?: { data?: { message?: string } } }).response
|
||||
return response?.data?.message || fallback
|
||||
}
|
||||
return fallback
|
||||
function orderEstimatedEndAt() {
|
||||
return readOrderEstimatedEndAt(order.value)
|
||||
}
|
||||
|
||||
function orderRentedAt() {
|
||||
return order.value?.rented_at
|
||||
}
|
||||
|
||||
function orderEstimatedEndAt() {
|
||||
if (!order.value) return undefined
|
||||
const rentedAt = orderRentedAt()
|
||||
const durationHours = Number(order.value.estimated_duration_hours || 0)
|
||||
if (!rentedAt || durationHours <= 0) return undefined
|
||||
return new Date(new Date(rentedAt).getTime() + durationHours * 60 * 60 * 1000).toISOString()
|
||||
function readSnapshot() {
|
||||
return readOrderSnapshot(order.value) as Record<string, any> | null
|
||||
}
|
||||
|
||||
interface CheckoutResource {
|
||||
key: string
|
||||
label: string
|
||||
price: string
|
||||
mode: string
|
||||
quantity: number
|
||||
unitPrice: number
|
||||
}
|
||||
|
||||
function readSnapshot(): any {
|
||||
const snapshot = order.value?.account_snapshot
|
||||
if (isRecord(snapshot)) return snapshot
|
||||
return null
|
||||
}
|
||||
|
||||
function readAssetSummary(): any {
|
||||
const summary = readSnapshot()?.asset_summary
|
||||
if (isRecord(summary)) return summary
|
||||
return null
|
||||
}
|
||||
|
||||
function readSnapshotResources(): CheckoutResource[] {
|
||||
const resources = readAssetSummary()?.resources
|
||||
if (!Array.isArray(resources)) return []
|
||||
return resources
|
||||
.filter(isRecord)
|
||||
.map(item => {
|
||||
const key = String(item.key || item.label || '')
|
||||
const label = String(item.label || key || '额外消耗品')
|
||||
const price = String(item.price || '')
|
||||
return {
|
||||
key,
|
||||
label,
|
||||
price,
|
||||
mode: String(item.mode || '收费'),
|
||||
quantity: readNumber(item.quantity),
|
||||
unitPrice: readUnitPrice(price),
|
||||
}
|
||||
})
|
||||
.filter(item => item.key && item.quantity > 0)
|
||||
}
|
||||
|
||||
function hydrateResourceUsage() {
|
||||
const next: Record<string, number> = {}
|
||||
for (const item of checkoutResources.value) {
|
||||
next[item.key] = Math.min(
|
||||
Math.max(Number(resourceUsage.value[item.key] || 0), 0),
|
||||
item.quantity
|
||||
)
|
||||
}
|
||||
resourceUsage.value = next
|
||||
}
|
||||
|
||||
function readResourceUsage(key: string) {
|
||||
return Math.max(Number(resourceUsage.value[key] || 0), 0)
|
||||
}
|
||||
|
||||
function isChargedResource(item: CheckoutResource) {
|
||||
return item.mode !== '赠送'
|
||||
}
|
||||
|
||||
function resourceLineAmount(item: CheckoutResource) {
|
||||
return roundMoney(readResourceUsage(item.key) * item.unitPrice)
|
||||
}
|
||||
|
||||
function checkoutContentWithSummary() {
|
||||
const lines = [checkoutForm.value.content.trim()].filter(Boolean)
|
||||
const usedResources = checkoutResources.value.filter(item => readResourceUsage(item.key) > 0)
|
||||
if (usedResources.length) {
|
||||
lines.push(
|
||||
`额外消耗品：${usedResources
|
||||
.map(
|
||||
item =>
|
||||
`${item.label} ${readResourceUsage(item.key)}/${item.quantity}${
|
||||
isChargedResource(item) ? `，金额¥${money(resourceLineAmount(item))}` : '，赠送不扣款'
|
||||
}`
|
||||
)
|
||||
.join('；')}`
|
||||
)
|
||||
}
|
||||
if (Number(checkoutForm.value.coin_consumed_m || 0) > 0) {
|
||||
lines.push(
|
||||
`哈夫币消耗：${quantity(Number(checkoutForm.value.coin_consumed_m))}M，预计剩余${quantity(
|
||||
remainingHafCoinM.value
|
||||
)}M`
|
||||
)
|
||||
}
|
||||
if (lines.length === 0) {
|
||||
lines.push('租客发起结账。')
|
||||
}
|
||||
return lines.join('\n')
|
||||
}
|
||||
|
||||
function readUnitPrice(priceText: string) {
|
||||
const normalized = priceText.replace(/，/g, ',').trim()
|
||||
const fractionMatch = normalized.match(/(\d+(?:\.\d+)?)\s*元\s*\/\s*(\d+(?:\.\d+)?)/)
|
||||
if (fractionMatch) {
|
||||
const amount = Number(fractionMatch[1])
|
||||
const count = Number(fractionMatch[2])
|
||||
return count > 0 ? roundMoney(amount / count) : 0
|
||||
}
|
||||
const singleMatch = normalized.match(/(\d+(?:\.\d+)?)\s*元/)
|
||||
if (singleMatch) return Number(singleMatch[1])
|
||||
const fallback = normalized.match(/(\d+(?:\.\d+)?)/)
|
||||
return fallback ? Number(fallback[1]) : 0
|
||||
}
|
||||
|
||||
function roundMoney(value: number) {
|
||||
return Math.round(Number(value || 0) * 10) / 10
|
||||
}
|
||||
|
||||
function roundQuantity(value: number) {
|
||||
return Math.round(value * 100) / 100
|
||||
}
|
||||
|
||||
function money(value: unknown) {
|
||||
return formatMoney(readNumber(value))
|
||||
}
|
||||
|
||||
function formatHandoffRecordType(type: string) {
|
||||
const typeMap: Record<string, string> = {
|
||||
owner_handoff: '卖家交接',
|
||||
renter_checkout: '买家结账',
|
||||
owner_counter_checkout: '卖家反驳结账',
|
||||
renter_confirm_checkout: '买家确认结账',
|
||||
owner_accept_checkout: '卖家接受结账',
|
||||
admin_arbitration: '客服仲裁',
|
||||
}
|
||||
return typeMap[type] || type
|
||||
}
|
||||
|
||||
function amountYuan(cent: unknown) {
|
||||
if (cent !== undefined && cent !== null) return centToYuan(readNumber(cent))
|
||||
return 0
|
||||
}
|
||||
|
||||
function orderRentAmount(item: Order) {
|
||||
if (item.owner_id === session.userId) return amountYuan(item.owner_rent_amount_cent)
|
||||
if (item.renter_id === session.userId) return amountYuan(item.rent_amount_cent)
|
||||
return amountYuan(item.display_amount_cent)
|
||||
}
|
||||
|
||||
function ownerActualIncome(item: Order) {
|
||||
if (item.owner_id !== session.userId) return null
|
||||
const value = item.checkout?.owner_income_amount_cent
|
||||
if (typeof value === 'number') return centToYuan(value)
|
||||
return null
|
||||
}
|
||||
|
||||
function quantity(value: unknown) {
|
||||
const rounded = roundQuantity(readNumber(value))
|
||||
return Number.isInteger(rounded) ? `${rounded}` : rounded.toFixed(2)
|
||||
}
|
||||
|
||||
function readNumber(value: unknown) {
|
||||
const number = Number(value || 0)
|
||||
return Number.isFinite(number) ? number : 0
|
||||
}
|
||||
|
||||
function isRecord(value: unknown): value is Record<string, unknown> {
|
||||
return typeof value === 'object' && value !== null
|
||||
function readAssetSummary() {
|
||||
return readOrderAssetSummary(order.value) as Record<string, any> | null
|
||||
}
|
||||
|
||||
function hydrateCounterForm() {
|
||||
if (!order.value?.checkout) return
|
||||
const checkout = order.value.checkout
|
||||
counterForm.value.consumableAmountYuan = amountYuan(checkout.consumable_amount_cent)
|
||||
counterForm.value.coin_consumed_m = checkout.coin_consumed_m
|
||||
counterForm.value.otherAmountYuan = amountYuan(checkout.other_amount_cent)
|
||||
counterForm.value.depositDeductAmountYuan = amountYuan(checkout.deposit_deduct_amount_cent)
|
||||
}
|
||||
|
||||
function linesToList(value: string) {
|
||||
return value
|
||||
.split('\n')
|
||||
.map(item => item.trim())
|
||||
.filter(Boolean)
|
||||
counterForm.value = hydrateCounterFormFromCheckout(order.value.checkout)
|
||||
}
|
||||
|
||||
async function openOrderChat() {
|
||||
@@ -803,187 +629,38 @@ async function copyListingCode() {
|
||||
</section>
|
||||
|
||||
<!-- Handoff Records list -->
|
||||
<section class="card-section">
|
||||
<h3 class="section-title">交接日志 · 商品编号 {{ listingCode }}</h3>
|
||||
<van-empty
|
||||
v-if="handoffRecords.length === 0"
|
||||
image="search"
|
||||
description="暂无交接日志记录"
|
||||
/>
|
||||
<div v-else class="log-timeline">
|
||||
<div v-for="record in handoffRecords" :key="record.id" class="log-item">
|
||||
<div class="log-dot"></div>
|
||||
<div class="log-content-wrap">
|
||||
<strong class="log-type">{{ formatHandoffRecordType(record.type) }}</strong>
|
||||
<p class="log-desc">{{ record.content }}</p>
|
||||
<span class="log-time">{{ formatDateTime(record.created_at) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<OrderHandoffTimeline
|
||||
variant="mobile"
|
||||
:records="handoffRecords"
|
||||
:listing-code="listingCode"
|
||||
/>
|
||||
|
||||
<!-- Renter Action: Return Account & Initiate Checkout -->
|
||||
<section
|
||||
<OrderResourceUsageEditor
|
||||
v-if="isRenter && ['renting', 'overdue'].includes(order.status)"
|
||||
class="card-section action-card"
|
||||
>
|
||||
<h3 class="section-title">退号发起结账</h3>
|
||||
<p class="action-hint">使用完毕，请输入在此期间消耗的物资与哈夫币进行结账申请。</p>
|
||||
|
||||
<van-field
|
||||
v-model="checkoutForm.content"
|
||||
rows="3"
|
||||
autosize
|
||||
label="结账备注"
|
||||
type="textarea"
|
||||
placeholder="可在此说明物品消耗情况或归还留言"
|
||||
class="action-field"
|
||||
/>
|
||||
|
||||
<!-- Checkout resource usage selection -->
|
||||
<div v-if="checkoutResources.length" class="resource-usage-panel">
|
||||
<strong class="resource-panel-title">额外物资消耗登记</strong>
|
||||
<div v-for="item in checkoutResources" :key="item.key" class="resource-row">
|
||||
<div class="resource-meta">
|
||||
<span class="resource-name">{{ item.label }}</span>
|
||||
<span class="resource-price-text"
|
||||
>上限 {{ item.quantity }} · {{ item.mode }} · {{ item.price }}</span
|
||||
>
|
||||
</div>
|
||||
<div class="stepper-wrap">
|
||||
<van-stepper v-model="resourceUsage[item.key]" integer min="0" :max="item.quantity" />
|
||||
<span class="resource-line-amount">¥{{ money(resourceLineAmount(item)) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="resource-panel-footer">
|
||||
<span>物资金额合计：</span>
|
||||
<strong>¥{{ money(resourceChargeAmount) }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-cell-group inset :border="false" class="action-field">
|
||||
<van-field label="消耗哈夫币" label-width="100px">
|
||||
<template #input>
|
||||
<div class="coin-input-wrap">
|
||||
<input
|
||||
v-model.number="checkoutForm.coin_consumed_m"
|
||||
type="number"
|
||||
placeholder="消耗数量"
|
||||
class="custom-inline-input"
|
||||
/>
|
||||
<span class="input-unit">M</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-field>
|
||||
<div class="coin-hint">
|
||||
订单快照 {{ quantity(snapshotHafCoinM) }}M，预计剩余 {{ quantity(remainingHafCoinM) }}M
|
||||
</div>
|
||||
<van-field label="其他押金赔付" label-width="100px">
|
||||
<template #input>
|
||||
<div class="coin-input-wrap">
|
||||
<input
|
||||
v-model.number="checkoutForm.otherAmountYuan"
|
||||
type="number"
|
||||
placeholder="不含上方额外物资"
|
||||
class="custom-inline-input"
|
||||
/>
|
||||
<span class="input-unit">元</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-field>
|
||||
<div class="deposit-deduct-hint">仅填写封禁、违规、资产损坏等需要从押金赔付的费用。</div>
|
||||
</van-cell-group>
|
||||
<div class="checkout-fee-preview">
|
||||
<div>
|
||||
<span>额外消耗品已用</span>
|
||||
<strong>¥{{ money(resourceChargeAmount) }}</strong>
|
||||
<em>计入实际结算租金</em>
|
||||
</div>
|
||||
<div>
|
||||
<span>其他押金赔付</span>
|
||||
<strong>¥{{ money(checkoutForm.otherAmountYuan) }}</strong>
|
||||
<em>从押金赔付扣除</em>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-field
|
||||
v-model="checkoutForm.evidenceText"
|
||||
rows="2"
|
||||
autosize
|
||||
label="结账证据"
|
||||
type="textarea"
|
||||
placeholder="结账截图链接（每行一个）"
|
||||
class="action-field"
|
||||
/>
|
||||
|
||||
<van-button
|
||||
type="primary"
|
||||
block
|
||||
round
|
||||
:loading="returning"
|
||||
loading-text="正在提交结账..."
|
||||
@click="handleSubmitCheckout"
|
||||
>
|
||||
提交结账归还
|
||||
</van-button>
|
||||
</section>
|
||||
v-model:checkout-form="checkoutForm"
|
||||
v-model:resource-usage="resourceUsage"
|
||||
variant="mobile"
|
||||
:resources="checkoutResources"
|
||||
:resource-charge-amount="resourceChargeAmount"
|
||||
:snapshot-haf-coin-m="snapshotHafCoinM"
|
||||
:remaining-haf-coin-m="remainingHafCoinM"
|
||||
:returning="returning"
|
||||
:resource-line-amount="resourceLineAmount"
|
||||
@submit="handleSubmitCheckout"
|
||||
/>
|
||||
|
||||
<!-- Checkout Details Display -->
|
||||
<section
|
||||
<OrderCheckoutSummary
|
||||
v-if="
|
||||
order.checkout &&
|
||||
['pending_checkout_confirm', 'pending_checkout_accept'].includes(order.status)
|
||||
"
|
||||
class="card-section"
|
||||
>
|
||||
<h3 class="section-title">结账结算账单</h3>
|
||||
<van-cell-group inset :border="false">
|
||||
<van-cell
|
||||
title="实际结算租金"
|
||||
:value="`¥${money(amountYuan(order.checkout.display_amount_cent))}`"
|
||||
/>
|
||||
<van-cell
|
||||
title="押金总额"
|
||||
:label="
|
||||
amountYuan(order.deposit_waived_amount_cent) > 0
|
||||
? `已免押 ¥${money(amountYuan(order.deposit_waived_amount_cent))}`
|
||||
: ''
|
||||
"
|
||||
:value="`¥${money(amountYuan(order.checkout.deposit_amount_cent))}`"
|
||||
/>
|
||||
<van-cell
|
||||
title="额外消耗品已用"
|
||||
:value="`¥${money(amountYuan(order.checkout.consumable_amount_cent))}`"
|
||||
/>
|
||||
<van-cell
|
||||
title="押金赔付扣除"
|
||||
:value="`¥${money(amountYuan(order.checkout.deposit_deduct_amount_cent))}`"
|
||||
value-class="red-text"
|
||||
/>
|
||||
<van-cell
|
||||
v-if="isRenter"
|
||||
title="退还租客"
|
||||
:value="`¥${money(amountYuan(order.checkout.renter_refund_amount_cent))}`"
|
||||
value-class="green-text"
|
||||
/>
|
||||
<van-cell
|
||||
v-if="isOwner"
|
||||
title="号主最终收入"
|
||||
:value="`¥${money(amountYuan(order.checkout.owner_income_amount_cent))}`"
|
||||
value-class="green-text"
|
||||
/>
|
||||
<van-cell
|
||||
v-if="order.checkout.content"
|
||||
title="结账备注"
|
||||
:label="order.checkout.content"
|
||||
/>
|
||||
<van-cell
|
||||
v-if="order.checkout.owner_adjustment_reason"
|
||||
title="号主修正原因"
|
||||
:label="order.checkout.owner_adjustment_reason"
|
||||
/>
|
||||
</van-cell-group>
|
||||
</section>
|
||||
variant="mobile"
|
||||
:order="order"
|
||||
:is-owner="isOwner"
|
||||
:is-renter="isRenter"
|
||||
/>
|
||||
|
||||
<!-- Owner Action: Confirm Checkout / Make Counter Adjustment Proposal -->
|
||||
<section
|
||||
@@ -1424,186 +1101,6 @@ async function copyListingCode() {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* ========== Log Timeline ========== */
|
||||
.log-timeline {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
padding-left: 16px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.log-timeline::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
bottom: 6px;
|
||||
left: 4px;
|
||||
width: 1px;
|
||||
background: #e2e8f0;
|
||||
}
|
||||
|
||||
.log-item {
|
||||
position: relative;
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
.log-item:last-child {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.log-dot {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: -15px;
|
||||
z-index: 2;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
background: #1477ff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.log-content-wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.log-type {
|
||||
font-size: 13px;
|
||||
color: #2d3748;
|
||||
}
|
||||
|
||||
.log-desc {
|
||||
font-size: 12px;
|
||||
color: #718096;
|
||||
margin: 0;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.log-time {
|
||||
font-size: 11px;
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
/* ========== Resource Panel ========== */
|
||||
.resource-usage-panel {
|
||||
background: #f8fafc;
|
||||
border-radius: 8px;
|
||||
padding: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.resource-panel-title {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 10px;
|
||||
color: #2d3748;
|
||||
}
|
||||
|
||||
.resource-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px dashed #e2e8f0;
|
||||
}
|
||||
|
||||
.resource-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.resource-meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.resource-name {
|
||||
font-size: 13px;
|
||||
color: #2d3748;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.resource-price-text {
|
||||
font-size: 11px;
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
.stepper-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.resource-line-amount {
|
||||
min-width: 50px;
|
||||
text-align: right;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #ff5f00;
|
||||
}
|
||||
|
||||
.resource-panel-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: baseline;
|
||||
margin-top: 10px;
|
||||
font-size: 12px;
|
||||
color: #4a5568;
|
||||
}
|
||||
|
||||
.resource-panel-footer strong {
|
||||
font-size: 15px;
|
||||
color: #ff5f00;
|
||||
}
|
||||
|
||||
.deposit-deduct-hint {
|
||||
padding: 0 16px 10px;
|
||||
color: #8a94a6;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.checkout-fee-preview {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
margin: 0 16px 12px;
|
||||
}
|
||||
|
||||
.checkout-fee-preview div {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
padding: 10px 12px;
|
||||
border-radius: 8px;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.checkout-fee-preview span {
|
||||
color: #4a5568;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.checkout-fee-preview strong {
|
||||
color: #ff5f00;
|
||||
font-size: 16px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.checkout-fee-preview em {
|
||||
color: #8a94a6;
|
||||
font-size: 11px;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.coin-input-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.custom-inline-input {
|
||||
border: none;
|
||||
background: transparent;
|
||||
@@ -1612,19 +1109,6 @@ async function copyListingCode() {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.input-unit {
|
||||
font-size: 14px;
|
||||
color: #718096;
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.coin-hint {
|
||||
font-size: 11px;
|
||||
color: #a0aec0;
|
||||
padding: 0 16px 8px 16px;
|
||||
margin-top: -6px;
|
||||
}
|
||||
|
||||
.no-snapshot-hint {
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
@@ -1700,15 +1184,6 @@ async function copyListingCode() {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
/* Utilities */
|
||||
.red-text {
|
||||
color: #ef4444;
|
||||
}
|
||||
|
||||
.green-text {
|
||||
color: #10b981;
|
||||
}
|
||||
|
||||
.empty-wrap {
|
||||
padding: 60px 0;
|
||||
}
|
||||
|
||||
@@ -8,15 +8,26 @@ import QRCode from 'qrcode'
|
||||
import { fetchOrderChat } from '@/features/chats/api/chats'
|
||||
import { createDispute } from '@/features/disputes'
|
||||
import { uploadFile } from '@/shared/api/files'
|
||||
import { centToYuan, formatCent, formatMoney } from '@/shared/utils/money'
|
||||
import { readError } from '@/shared/utils/error'
|
||||
import { formatCent } from '@/shared/utils/money'
|
||||
import {
|
||||
acceptCheckout,
|
||||
amountYuan,
|
||||
cancelOrder,
|
||||
confirmCheckout,
|
||||
confirmReceive,
|
||||
counterCheckout,
|
||||
fetchHandoffRecords,
|
||||
fetchOrder,
|
||||
hydrateCounterFormFromCheckout,
|
||||
linesToList,
|
||||
money,
|
||||
OrderCheckoutSummary,
|
||||
OrderHandoffTimeline,
|
||||
OrderResourceUsageEditor,
|
||||
orderEstimatedEndAt as readOrderEstimatedEndAt,
|
||||
orderRentAmount,
|
||||
ownerActualIncome,
|
||||
queryOrderPayment,
|
||||
startOrderPayment,
|
||||
submitCheckout,
|
||||
@@ -24,6 +35,7 @@ import {
|
||||
type HandoffRecord,
|
||||
type Order,
|
||||
type PaymentOrder,
|
||||
useOrderCheckoutSnapshot,
|
||||
} from '@/features/orders'
|
||||
import { useSessionStore } from '@/stores/session'
|
||||
import { handoffStatusLabel, orderStatusLabel } from '@/shared/utils/statusLabels'
|
||||
@@ -84,9 +96,11 @@ let autoPayHandled = false
|
||||
const isOwner = computed(() => order.value?.owner_id === session.userId)
|
||||
const isRenter = computed(() => order.value?.renter_id === session.userId)
|
||||
const orderAmountLabel = computed(() => (isOwner.value ? '预计租金' : '支付租金'))
|
||||
const orderRentDisplayAmount = computed(() => (order.value ? orderRentAmount(order.value) : 0))
|
||||
const orderRentDisplayAmount = computed(() =>
|
||||
order.value ? orderRentAmount(order.value, session.userId) : 0
|
||||
)
|
||||
const ownerIncomeDisplayAmount = computed(() =>
|
||||
order.value ? ownerActualIncome(order.value) : null
|
||||
order.value ? ownerActualIncome(order.value, session.userId) : null
|
||||
)
|
||||
const ownerIncomeLabel = computed(() =>
|
||||
order.value?.status === 'completed' ? '实际到手' : '结账预计到手'
|
||||
@@ -108,28 +122,15 @@ const isCheckoutDisputeStage = computed(() => {
|
||||
['pending_checkout_confirm', 'pending_checkout_accept'].includes(order.value.status)
|
||||
)
|
||||
})
|
||||
const checkoutResources = computed(() => {
|
||||
const resources = readSnapshotResources()
|
||||
return resources.filter(item => item.quantity > 0)
|
||||
})
|
||||
const resourceChargeAmount = computed(() => {
|
||||
return roundMoney(
|
||||
checkoutResources.value.reduce((sum, item) => {
|
||||
if (!isChargedResource(item)) return sum
|
||||
const used = readResourceUsage(item.key)
|
||||
return sum + used * item.unitPrice
|
||||
}, 0)
|
||||
)
|
||||
})
|
||||
const snapshotHafCoinM = computed(() => {
|
||||
const snapshot = readSnapshot()
|
||||
return roundQuantity(readNumber(snapshot?.haf_coin_amount) / 1000000)
|
||||
})
|
||||
const remainingHafCoinM = computed(() => {
|
||||
return roundQuantity(
|
||||
Math.max(snapshotHafCoinM.value - Number(checkoutForm.value.coin_consumed_m || 0), 0)
|
||||
)
|
||||
})
|
||||
const {
|
||||
checkoutResources,
|
||||
resourceChargeAmount,
|
||||
snapshotHafCoinM,
|
||||
remainingHafCoinM,
|
||||
hydrateResourceUsage,
|
||||
resourceLineAmount,
|
||||
checkoutContentWithSummary,
|
||||
} = useOrderCheckoutSnapshot({ order, checkoutForm, resourceUsage })
|
||||
|
||||
function getOrderStep(status: string) {
|
||||
const stepMap: Record<string, number> = {
|
||||
@@ -467,191 +468,17 @@ async function openOrderChat() {
|
||||
}
|
||||
}
|
||||
|
||||
function readError(error: unknown, fallback: string) {
|
||||
if (typeof error === 'object' && error && 'response' in error) {
|
||||
const response = (error as { response?: { data?: { message?: string } } }).response
|
||||
return response?.data?.message || fallback
|
||||
}
|
||||
return fallback
|
||||
function orderEstimatedEndAt() {
|
||||
return readOrderEstimatedEndAt(order.value)
|
||||
}
|
||||
|
||||
function orderRentedAt() {
|
||||
return order.value?.rented_at
|
||||
}
|
||||
|
||||
function orderEstimatedEndAt() {
|
||||
if (!order.value) return undefined
|
||||
const rentedAt = orderRentedAt()
|
||||
const durationHours = Number(order.value.estimated_duration_hours || 0)
|
||||
if (!rentedAt || durationHours <= 0) return undefined
|
||||
return new Date(new Date(rentedAt).getTime() + durationHours * 60 * 60 * 1000).toISOString()
|
||||
}
|
||||
|
||||
interface CheckoutResource {
|
||||
key: string
|
||||
label: string
|
||||
price: string
|
||||
mode: string
|
||||
quantity: number
|
||||
unitPrice: number
|
||||
}
|
||||
|
||||
function readSnapshot() {
|
||||
const snapshot = order.value?.account_snapshot
|
||||
if (isRecord(snapshot)) return snapshot
|
||||
return null
|
||||
}
|
||||
|
||||
function readAssetSummary() {
|
||||
const summary = readSnapshot()?.asset_summary
|
||||
if (isRecord(summary)) return summary
|
||||
return null
|
||||
}
|
||||
|
||||
function readSnapshotResources(): CheckoutResource[] {
|
||||
const resources = readAssetSummary()?.resources
|
||||
if (!Array.isArray(resources)) return []
|
||||
return resources
|
||||
.filter(isRecord)
|
||||
.map(item => {
|
||||
const key = String(item.key || item.label || '')
|
||||
const label = String(item.label || key || '额外消耗品')
|
||||
const price = String(item.price || '')
|
||||
return {
|
||||
key,
|
||||
label,
|
||||
price,
|
||||
mode: String(item.mode || '收费'),
|
||||
quantity: readNumber(item.quantity),
|
||||
unitPrice: readUnitPrice(price),
|
||||
}
|
||||
})
|
||||
.filter(item => item.key && item.quantity > 0)
|
||||
}
|
||||
|
||||
function hydrateResourceUsage() {
|
||||
const next: Record<string, number> = {}
|
||||
for (const item of checkoutResources.value) {
|
||||
next[item.key] = Math.min(
|
||||
Math.max(Number(resourceUsage.value[item.key] || 0), 0),
|
||||
item.quantity
|
||||
)
|
||||
}
|
||||
resourceUsage.value = next
|
||||
}
|
||||
|
||||
function readResourceUsage(key: string) {
|
||||
return Math.max(Number(resourceUsage.value[key] || 0), 0)
|
||||
}
|
||||
|
||||
function isChargedResource(item: CheckoutResource) {
|
||||
return item.mode !== '赠送'
|
||||
}
|
||||
|
||||
function resourceLineAmount(item: CheckoutResource) {
|
||||
return roundMoney(readResourceUsage(item.key) * item.unitPrice)
|
||||
}
|
||||
|
||||
function checkoutContentWithSummary() {
|
||||
const lines = [checkoutForm.value.content.trim()].filter(Boolean)
|
||||
const usedResources = checkoutResources.value.filter(item => readResourceUsage(item.key) > 0)
|
||||
if (usedResources.length) {
|
||||
lines.push(
|
||||
`额外消耗品：${usedResources
|
||||
.map(
|
||||
item =>
|
||||
`${item.label} ${readResourceUsage(item.key)}/${item.quantity}${
|
||||
isChargedResource(item) ? `，金额¥${money(resourceLineAmount(item))}` : '，赠送不扣款'
|
||||
}`
|
||||
)
|
||||
.join('；')}`
|
||||
)
|
||||
}
|
||||
if (Number(checkoutForm.value.coin_consumed_m || 0) > 0) {
|
||||
lines.push(
|
||||
`哈夫币消耗：${quantity(Number(checkoutForm.value.coin_consumed_m))}M，预计剩余${quantity(
|
||||
remainingHafCoinM.value
|
||||
)}M`
|
||||
)
|
||||
}
|
||||
if (lines.length === 0) {
|
||||
lines.push('租客发起结账。')
|
||||
}
|
||||
return lines.join('\n')
|
||||
}
|
||||
|
||||
function readUnitPrice(priceText: string) {
|
||||
const normalized = priceText.replace(/，/g, ',').trim()
|
||||
const fractionMatch = normalized.match(/(\d+(?:\.\d+)?)\s*元\s*\/\s*(\d+(?:\.\d+)?)/)
|
||||
if (fractionMatch) {
|
||||
const amount = Number(fractionMatch[1])
|
||||
const count = Number(fractionMatch[2])
|
||||
return count > 0 ? roundMoney(amount / count) : 0
|
||||
}
|
||||
const singleMatch = normalized.match(/(\d+(?:\.\d+)?)\s*元/)
|
||||
if (singleMatch) return Number(singleMatch[1])
|
||||
const fallback = normalized.match(/(\d+(?:\.\d+)?)/)
|
||||
return fallback ? Number(fallback[1]) : 0
|
||||
}
|
||||
|
||||
function roundMoney(value: number) {
|
||||
return Math.round(Number(value || 0) * 10) / 10
|
||||
}
|
||||
|
||||
function roundQuantity(value: number) {
|
||||
return Math.round(value * 100) / 100
|
||||
}
|
||||
|
||||
function money(value: unknown) {
|
||||
return formatMoney(readNumber(value))
|
||||
}
|
||||
|
||||
function amountYuan(cent: unknown) {
|
||||
if (cent !== undefined && cent !== null) return centToYuan(readNumber(cent))
|
||||
return 0
|
||||
}
|
||||
|
||||
function orderRentAmount(item: Order) {
|
||||
if (item.owner_id === session.userId) return amountYuan(item.owner_rent_amount_cent)
|
||||
if (item.renter_id === session.userId) return amountYuan(item.rent_amount_cent)
|
||||
return amountYuan(item.display_amount_cent)
|
||||
}
|
||||
|
||||
function ownerActualIncome(item: Order) {
|
||||
if (item.owner_id !== session.userId) return null
|
||||
const value = item.checkout?.owner_income_amount_cent
|
||||
if (typeof value === 'number') return centToYuan(value)
|
||||
return null
|
||||
}
|
||||
|
||||
function quantity(value: unknown) {
|
||||
const rounded = roundQuantity(readNumber(value))
|
||||
return Number.isInteger(rounded) ? `${rounded}` : rounded.toFixed(2)
|
||||
}
|
||||
|
||||
function readNumber(value: unknown) {
|
||||
const number = Number(value || 0)
|
||||
return Number.isFinite(number) ? number : 0
|
||||
}
|
||||
|
||||
function isRecord(value: unknown): value is Record<string, unknown> {
|
||||
return typeof value === 'object' && value !== null
|
||||
}
|
||||
|
||||
function hydrateCounterForm() {
|
||||
if (!order.value?.checkout) return
|
||||
const checkout = order.value.checkout
|
||||
counterForm.value.consumableAmountYuan = amountYuan(checkout.consumable_amount_cent)
|
||||
counterForm.value.coin_consumed_m = checkout.coin_consumed_m
|
||||
counterForm.value.otherAmountYuan = amountYuan(checkout.other_amount_cent)
|
||||
counterForm.value.depositDeductAmountYuan = amountYuan(checkout.deposit_deduct_amount_cent)
|
||||
}
|
||||
|
||||
function linesToList(value: string) {
|
||||
return value
|
||||
.split('\n')
|
||||
.map(item => item.trim())
|
||||
.filter(Boolean)
|
||||
counterForm.value = hydrateCounterFormFromCheckout(order.value.checkout)
|
||||
}
|
||||
|
||||
function scrollToDispute() {
|
||||
@@ -682,18 +509,6 @@ function scrollToRejectCheckout() {
|
||||
}
|
||||
}
|
||||
|
||||
function formatHandoffRecordType(type: string) {
|
||||
const typeMap: Record<string, string> = {
|
||||
owner_handoff: '卖家交接',
|
||||
renter_checkout: '买家结账',
|
||||
owner_counter_checkout: '卖家反驳结账',
|
||||
renter_confirm_checkout: '买家确认结账',
|
||||
owner_accept_checkout: '卖家接受结账',
|
||||
admin_arbitration: '客服仲裁',
|
||||
}
|
||||
return typeMap[type] || type
|
||||
}
|
||||
|
||||
async function copyListingCode() {
|
||||
if (!order.value) return
|
||||
try {
|
||||
@@ -826,189 +641,31 @@ async function copyListingCode() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="order" class="timeline-section">
|
||||
<div class="section-header">
|
||||
<h2>交接记录</h2>
|
||||
<span>商品编号 {{ listingCode }}</span>
|
||||
</div>
|
||||
<el-empty v-if="handoffRecords.length === 0" description="暂无交接记录" />
|
||||
<el-timeline v-else>
|
||||
<el-timeline-item
|
||||
v-for="record in handoffRecords"
|
||||
:key="record.id"
|
||||
:timestamp="formatDateTime(record.created_at)"
|
||||
placement="top"
|
||||
>
|
||||
<div class="timeline-content">
|
||||
<div class="timeline-title">{{ formatHandoffRecordType(record.type) }}</div>
|
||||
<div class="timeline-body">{{ record.content }}</div>
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
<OrderHandoffTimeline v-if="order" :records="handoffRecords" :listing-code="listingCode" />
|
||||
|
||||
<div
|
||||
<OrderResourceUsageEditor
|
||||
v-if="order && isRenter && ['renting', 'overdue'].includes(order.status)"
|
||||
class="form-section checkout-form-section"
|
||||
>
|
||||
<div class="section-header">
|
||||
<h2>发起结账</h2>
|
||||
</div>
|
||||
<div class="form-card">
|
||||
<el-input
|
||||
v-model="checkoutForm.content"
|
||||
type="textarea"
|
||||
:rows="4"
|
||||
placeholder="填写结账说明、租后资产状态或注意事项"
|
||||
/>
|
||||
<div class="checkout-resource-panel">
|
||||
<div class="checkout-resource-head">
|
||||
<strong>额外消耗品</strong>
|
||||
<span class="amount-highlight">已用金额：¥{{ money(resourceChargeAmount) }}</span>
|
||||
</div>
|
||||
<el-empty
|
||||
v-if="checkoutResources.length === 0"
|
||||
description="订单快照中暂无额外消耗品"
|
||||
/>
|
||||
<div
|
||||
v-for="item in checkoutResources"
|
||||
v-else
|
||||
:key="item.key"
|
||||
class="checkout-resource-row"
|
||||
>
|
||||
<div class="checkout-resource-meta">
|
||||
<strong>{{ item.label }}</strong>
|
||||
<span
|
||||
>库存 {{ item.quantity }}，{{ item.mode }}，{{
|
||||
item.price || '未设置单价'
|
||||
}}</span
|
||||
>
|
||||
</div>
|
||||
<el-input-number
|
||||
v-model="resourceUsage[item.key]"
|
||||
:min="0"
|
||||
:max="item.quantity"
|
||||
:precision="0"
|
||||
controls-position="right"
|
||||
/>
|
||||
<span class="checkout-resource-amount">¥{{ money(resourceLineAmount(item)) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<el-form class="form-grid" label-position="top">
|
||||
<el-form-item label="消耗哈夫币（M）">
|
||||
<el-input-number
|
||||
v-model="checkoutForm.coin_consumed_m"
|
||||
class="full-control"
|
||||
:min="0"
|
||||
:max="snapshotHafCoinM"
|
||||
:precision="2"
|
||||
controls-position="right"
|
||||
/>
|
||||
<span class="field-hint"
|
||||
>订单快照 {{ quantity(snapshotHafCoinM) }}M，预计剩余
|
||||
{{ quantity(remainingHafCoinM) }}M</span
|
||||
>
|
||||
</el-form-item>
|
||||
<el-form-item label="其他押金赔付（元）">
|
||||
<el-input-number
|
||||
v-model="checkoutForm.otherAmountYuan"
|
||||
class="full-control"
|
||||
:min="0"
|
||||
:precision="0"
|
||||
controls-position="right"
|
||||
/>
|
||||
<span class="field-hint"
|
||||
>不含上方额外消耗品；仅填写封禁、违规、资产损坏等需要从押金赔付的费用。</span
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="checkout-deduct-preview">
|
||||
<div>
|
||||
<span>额外消耗品已用</span>
|
||||
<strong>¥{{ money(resourceChargeAmount) }}</strong>
|
||||
<em>按上方物资数量自动计算，计入实际结算租金</em>
|
||||
</div>
|
||||
<div>
|
||||
<span>其他押金赔付</span>
|
||||
<strong>¥{{ money(checkoutForm.otherAmountYuan) }}</strong>
|
||||
<em>作为押金赔付扣除，和额外消耗品分开展示</em>
|
||||
</div>
|
||||
</div>
|
||||
<el-input
|
||||
v-model="checkoutForm.evidenceText"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="结账证据链接，一行一个。可填写截图地址或备注链接"
|
||||
/>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="large"
|
||||
:loading="returning"
|
||||
@click="handleSubmitCheckout"
|
||||
>发起结账</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
v-model:checkout-form="checkoutForm"
|
||||
v-model:resource-usage="resourceUsage"
|
||||
:resources="checkoutResources"
|
||||
:resource-charge-amount="resourceChargeAmount"
|
||||
:snapshot-haf-coin-m="snapshotHafCoinM"
|
||||
:remaining-haf-coin-m="remainingHafCoinM"
|
||||
:returning="returning"
|
||||
:resource-line-amount="resourceLineAmount"
|
||||
@submit="handleSubmitCheckout"
|
||||
/>
|
||||
|
||||
<div
|
||||
<OrderCheckoutSummary
|
||||
v-if="
|
||||
order &&
|
||||
order.checkout &&
|
||||
['pending_checkout_confirm', 'pending_checkout_accept'].includes(order.status)
|
||||
"
|
||||
class="info-section"
|
||||
>
|
||||
<div class="section-header">
|
||||
<h2>结账明细</h2>
|
||||
</div>
|
||||
<div class="checkout-summary-card">
|
||||
<div class="summary-row">
|
||||
<span>实际结算租金</span>
|
||||
<strong>¥{{ money(amountYuan(order.checkout.display_amount_cent)) }}</strong>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span>预收押金</span>
|
||||
<strong>
|
||||
¥{{ money(amountYuan(order.checkout.deposit_amount_cent)) }}
|
||||
<em v-if="amountYuan(order.deposit_waived_amount_cent) > 0"
|
||||
>已免押 ¥{{ money(amountYuan(order.deposit_waived_amount_cent)) }}</em
|
||||
>
|
||||
</strong>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span>额外消耗品已用</span>
|
||||
<strong class="warning"
|
||||
>¥{{ money(amountYuan(order.checkout.consumable_amount_cent)) }}</strong
|
||||
>
|
||||
</div>
|
||||
<div class="summary-row">
|
||||
<span>押金赔付扣除</span>
|
||||
<strong class="warning"
|
||||
>¥{{ money(amountYuan(order.checkout.deposit_deduct_amount_cent)) }}</strong
|
||||
>
|
||||
</div>
|
||||
<div v-if="isRenter" class="summary-row highlight">
|
||||
<span>退还租客（未使用租金 + 剩余押金）</span>
|
||||
<strong class="amount"
|
||||
>¥{{ money(amountYuan(order.checkout.renter_refund_amount_cent)) }}</strong
|
||||
>
|
||||
</div>
|
||||
<div v-if="isOwner" class="summary-row highlight">
|
||||
<span>号主最终收入（租金 + 押金赔付）</span>
|
||||
<strong class="amount"
|
||||
>¥{{ money(amountYuan(order.checkout.owner_income_amount_cent)) }}</strong
|
||||
>
|
||||
</div>
|
||||
<div v-if="order.checkout.content" class="summary-note">
|
||||
<label>说明：</label>
|
||||
<p>{{ order.checkout.content }}</p>
|
||||
</div>
|
||||
<div v-if="order.checkout.owner_adjustment_reason" class="summary-note warning">
|
||||
<label>修正原因：</label>
|
||||
<p>{{ order.checkout.owner_adjustment_reason }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
:order="order"
|
||||
:is-owner="isOwner"
|
||||
:is-renter="isRenter"
|
||||
/>
|
||||
|
||||
<div
|
||||
v-if="order && isOwner && order.status === 'pending_checkout_confirm'"
|
||||
@@ -1558,35 +1215,6 @@ async function copyListingCode() {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.timeline-section {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.timeline-section :deep(.el-timeline) {
|
||||
padding: 24px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.timeline-content {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.timeline-title {
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #1f2937;
|
||||
}
|
||||
|
||||
.timeline-body {
|
||||
font-size: 14px;
|
||||
color: #64748b;
|
||||
line-height: 1.6;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
@@ -1664,69 +1292,6 @@ async function copyListingCode() {
|
||||
margin: 0 0 16px 0;
|
||||
}
|
||||
|
||||
.checkout-resource-panel {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
padding: 16px;
|
||||
background: #f9fafb;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.checkout-resource-head {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
padding-bottom: 12px;
|
||||
border-bottom: 2px solid #e5e7eb;
|
||||
}
|
||||
|
||||
.checkout-resource-head strong {
|
||||
color: #1f2937;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.amount-highlight {
|
||||
color: #ff6a00;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.checkout-resource-row {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto auto;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
padding: 12px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.checkout-resource-meta {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.checkout-resource-meta strong {
|
||||
color: #1f2937;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.checkout-resource-meta span {
|
||||
color: #6b7785;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.checkout-resource-amount {
|
||||
min-width: 80px;
|
||||
text-align: right;
|
||||
color: #ff6a00;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
@@ -1740,126 +1305,6 @@ async function copyListingCode() {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview div {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
padding: 12px;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 8px;
|
||||
background: #f9fafb;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview span {
|
||||
color: #4b5563;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview strong {
|
||||
color: #ff6a00;
|
||||
font-size: 18px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview em {
|
||||
color: #6b7280;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
.checkout-summary-card {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
padding: 24px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.summary-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 12px 0;
|
||||
border-bottom: 1px solid #f3f4f6;
|
||||
}
|
||||
|
||||
.summary-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.summary-row.highlight {
|
||||
padding: 16px;
|
||||
background: #f0fdf4;
|
||||
border: 1px solid #bbf7d0;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.summary-row span {
|
||||
font-size: 14px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
.summary-row strong {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #1f2937;
|
||||
}
|
||||
|
||||
.summary-row strong em {
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
.summary-row strong.amount {
|
||||
color: #10b981;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.summary-row strong.warning {
|
||||
color: #f59e0b;
|
||||
}
|
||||
|
||||
.summary-note {
|
||||
padding: 16px;
|
||||
background: #f8fafc;
|
||||
border-left: 3px solid #94a3b8;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.summary-note.warning {
|
||||
background: #fef3c7;
|
||||
border-left-color: #f59e0b;
|
||||
}
|
||||
|
||||
.summary-note label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
color: #475569;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.summary-note p {
|
||||
margin: 0;
|
||||
color: #1f2937;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.dispute-section .form-card {
|
||||
background: #fef2f2;
|
||||
border-color: #fecaca;
|
||||
@@ -2006,18 +1451,6 @@ async function copyListingCode() {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.checkout-resource-row {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.checkout-resource-amount {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.checkout-deduct-preview {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user