feat(agent): 정산 월 라벨 추가 및 테이블 정렬/레이아웃 개선

- 상단 레이아웃을 6/6으로 분할하고 좌측에 현재 `<월> 정산 내역` 라벨 표시
- 총 에이전트 수 표시는 우측 정렬로 유지
- 금액/합계 열 정렬을 text-right → text-center로 통일하여 가독성 향상
- 전역 테이블 셀 가운데 정렬 CSS 추가(th/td)
- 클릭 가능한 금액 셀의 UX 유지(cursor: pointer)
This commit is contained in:
Yu Sung
2026-04-11 23:11:22 +09:00
parent d5a75cd29f
commit 0d494d3482

View File

@@ -11,7 +11,13 @@
<v-container>
<v-row>
<v-col
cols="12"
cols="6"
class="text-left"
>
<strong>{{ settlementMonthLabel }}</strong>
</v-col>
<v-col
cols="6"
class="text-right"
>
에이전트 : <strong>{{ totalCount | numberFormat }}</strong>
@@ -65,36 +71,36 @@
{{ item.assignedCreatorCount | numberFormat }}
</td>
<td
class="text-right clickable"
class="text-center clickable"
@click="goSettlement(item, 'live')"
>
{{ formatCurrency(item.liveAgentSettlementAmount) }}
</td>
<td
class="text-right clickable"
class="text-center clickable"
@click="goSettlement(item, 'content')"
>
{{ formatCurrency(item.contentAgentSettlementAmount) }}
</td>
<td
class="text-right clickable"
class="text-center clickable"
@click="goSettlement(item, 'community')"
>
{{ formatCurrency(item.communityAgentSettlementAmount) }}
</td>
<td
class="text-right clickable"
class="text-center clickable"
@click="goSettlement(item, 'content-donation')"
>
{{ formatCurrency(item.contentDonationAgentSettlementAmount) }}
</td>
<td
class="text-right clickable"
class="text-center clickable"
@click="goSettlement(item, 'channel-donation')"
>
{{ formatCurrency(item.channelDonationAgentSettlementAmount) }}
</td>
<td class="text-right">
<td class="text-center">
{{ formatCurrency(totalAmount(item)) }}
</td>
</tr>
@@ -146,6 +152,13 @@ export default {
is_loading: false,
}
},
computed: {
settlementMonthLabel() {
const now = new Date()
const month = now.getMonth() + 1 // 1~12
return `${month}월 정산 내역`
}
},
created() {
this.fetchList()
},
@@ -221,4 +234,9 @@ export default {
.clickable {
cursor: pointer;
}
/* 테이블 셀 가운데 정렬 */
table th,
table td {
text-align: center !important;
}
</style>