|
|
@@ -47,19 +47,37 @@
|
|
|
highlight-current-row
|
|
|
>
|
|
|
<el-table-column prop="id" label="ID" width="80" align="center" />
|
|
|
- <el-table-column prop="out_separate_no" label="商户分账指令流水号" min-width="220" />
|
|
|
+ <el-table-column label="分账指令流水号" min-width="240">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div class="order-numbers">
|
|
|
+ <div class="order-number-item">
|
|
|
+ <span class="label">商户:</span>
|
|
|
+ <span class="value">{{ row.out_separate_no }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="order-number-item">
|
|
|
+ <span class="label">平台:</span>
|
|
|
+ <span class="value">{{ row.separate_no || '--'}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column prop="user_id" label="用户ID" width="100" align="center" />
|
|
|
<el-table-column prop="merchant_no" label="分账商户号" width="160" />
|
|
|
<el-table-column prop="total_amt" label="分账总金额(元)" width="140" align="center">
|
|
|
<template #default="{ row }">
|
|
|
- <span style="font-weight: 600; color: #e6a23c; font-size: 15px">{{ formatAmountToYuan(row.total_amt) }}</span>
|
|
|
+ <span style="font-weight: 600; color: #e6a23c; font-size: 15px">¥{{ formatAmountToYuan(row.total_amt) }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="接收方商户信息" width="180">
|
|
|
+ <el-table-column label="接收方商户信息" width="200">
|
|
|
<template #default="{ row }">
|
|
|
<div class="merchant-info">
|
|
|
- <div class="merchant-no">商户号: {{ row.recv_merchant_no }}</div>
|
|
|
- <div class="share-amount">分账金额: ¥{{ formatAmountToYuan(row.total_amt - row.separate_value) }}</div>
|
|
|
+ <div class="merchant-no" :title="row.recv_merchant_no">商户号: {{ row.recv_merchant_no }}</div>
|
|
|
+ <div class="amount-details">
|
|
|
+ <div class="amount-row">
|
|
|
+ <span class="label">分账金额:</span>
|
|
|
+ <span class="value">¥{{ formatAmountToYuan(row.total_amt - row.separate_value) }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -130,6 +148,9 @@
|
|
|
<el-form-item label="商户分账指令流水号:">
|
|
|
<span>{{ detailData.out_separate_no }}</span>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="分账指令流水号:">
|
|
|
+ <span>{{ detailData.separate_no }}</span>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="用户ID:">
|
|
|
<span>{{ detailData.user_id }}</span>
|
|
|
</el-form-item>
|
|
|
@@ -384,6 +405,31 @@ export default {
|
|
|
text-align: right;
|
|
|
}
|
|
|
|
|
|
+.order-numbers {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ gap: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+.order-number-item {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.order-number-item .label {
|
|
|
+ width: 40px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #606266;
|
|
|
+ text-align: right;
|
|
|
+ margin-right: 8px;
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.order-number-item .value {
|
|
|
+ flex: 1;
|
|
|
+ color: #303133;
|
|
|
+ word-break: break-all;
|
|
|
+}
|
|
|
+
|
|
|
.amount-calculation {
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
@@ -422,20 +468,16 @@ export default {
|
|
|
}
|
|
|
|
|
|
.merchant-info {
|
|
|
- font-size: 12px;
|
|
|
padding: 8px;
|
|
|
- background-color: #f5f7fa;
|
|
|
+ background: linear-gradient(135deg, #e8f4ff 0%, #d0e6ff 100%);
|
|
|
border-radius: 4px;
|
|
|
+ font-size: 12px;
|
|
|
}
|
|
|
|
|
|
.merchant-info .merchant-no {
|
|
|
- margin-bottom: 4px;
|
|
|
+ margin-bottom: 5px;
|
|
|
color: #606266;
|
|
|
-}
|
|
|
-
|
|
|
-.merchant-info .share-amount {
|
|
|
- color: #303133;
|
|
|
- font-weight: 600;
|
|
|
+ font-weight: 500;
|
|
|
}
|
|
|
|
|
|
.receiver-info {
|