update style
This commit is contained in:
@@ -41,7 +41,7 @@
|
|||||||
<t-dropdown-item
|
<t-dropdown-item
|
||||||
v-if="!isSelfReceiveOnly"
|
v-if="!isSelfReceiveOnly"
|
||||||
v-model="operationType"
|
v-model="operationType"
|
||||||
label="操作类型"
|
:label="operationFilterLabel"
|
||||||
:options="operationOptions"
|
:options="operationOptions"
|
||||||
@change="selectOperation"
|
@change="selectOperation"
|
||||||
/>
|
/>
|
||||||
@@ -89,9 +89,8 @@
|
|||||||
</template>
|
</template>
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<span class="customer" v-text="getCustomerText(item)" />
|
<span class="customer clip-text" v-text="getCustomerText(item)" />
|
||||||
<div class="operation">
|
<span class="type" :class="getOperationClass(item.operationType)" v-text="getFundOperationText(item.operationType)" />
|
||||||
<span v-text="getFundOperationText(item.operationType)" />
|
|
||||||
<t-tag
|
<t-tag
|
||||||
size="small"
|
size="small"
|
||||||
:content="getRecordStatusText(item)"
|
:content="getRecordStatusText(item)"
|
||||||
@@ -99,7 +98,6 @@
|
|||||||
:theme="getRecordStatusTheme(item)"
|
:theme="getRecordStatusTheme(item)"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<template #description>
|
<template #description>
|
||||||
<div class="description">
|
<div class="description">
|
||||||
@@ -217,7 +215,7 @@ const dateOptions: Array<{ label: string; value: DateFilterType }> = [
|
|||||||
{ label: "全部", value: "all" },
|
{ label: "全部", value: "all" },
|
||||||
{ label: "自定义范围", value: "custom" }
|
{ label: "自定义范围", value: "custom" }
|
||||||
];
|
];
|
||||||
const dateFilterType = ref<DateFilterType>(parseDateFilterType(getQueryText(route.query.dateType), dateOptions, "thisWeek"));
|
const dateFilterType = ref<DateFilterType>(parseDateFilterType(getQueryText(route.query.dateType), dateOptions, "all"));
|
||||||
const dateRange = ref<[string, string]>(parseDateRange(dateFilterType.value));
|
const dateRange = ref<[string, string]>(parseDateRange(dateFilterType.value));
|
||||||
const startDraft = ref("");
|
const startDraft = ref("");
|
||||||
const endDraft = ref("");
|
const endDraft = ref("");
|
||||||
@@ -233,6 +231,7 @@ const operationOptions = [
|
|||||||
{ label: "确认无需退款", value: "CONFIRM_NO_REFUND" },
|
{ label: "确认无需退款", value: "CONFIRM_NO_REFUND" },
|
||||||
{ label: "资金冲正", value: "REVOKE" }
|
{ label: "资金冲正", value: "REVOKE" }
|
||||||
];
|
];
|
||||||
|
const operationFilterLabel = computed(() => operationOptions.find(item => item.value === operationType.value)?.label || "操作类型");
|
||||||
const statusOptions = [
|
const statusOptions = [
|
||||||
{ label: "全部状态", value: "ALL" },
|
{ label: "全部状态", value: "ALL" },
|
||||||
{ label: "待核销", value: "PENDING" },
|
{ label: "待核销", value: "PENDING" },
|
||||||
@@ -462,6 +461,15 @@ function getCustomerText(item: FundRecord): string {
|
|||||||
return item.customer?.name || item.customer?.code || item.customerId || "未知客户";
|
return item.customer?.name || item.customer?.code || item.customerId || "未知客户";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getOperationClass(type?: FundOperationType): string {
|
||||||
|
return ({
|
||||||
|
RECEIVE: "receive",
|
||||||
|
REFUND: "refund",
|
||||||
|
CONFIRM_NO_REFUND: "confirm-no-refund",
|
||||||
|
REVOKE: "revoke"
|
||||||
|
} as Record<string, string>)[type || ""] || "unknown";
|
||||||
|
}
|
||||||
|
|
||||||
function getStatusTheme(statusValue?: FundRecordStatus): "success" | "warning" | "danger" | "default" {
|
function getStatusTheme(statusValue?: FundRecordStatus): "success" | "warning" | "danger" | "default" {
|
||||||
return statusValue === "VERIFIED" ? "success" : statusValue === "PENDING" ? "warning" : statusValue === "REJECTED" ? "danger" : "default";
|
return statusValue === "VERIFIED" ? "success" : statusValue === "PENDING" ? "warning" : statusValue === "REJECTED" ? "danger" : "default";
|
||||||
}
|
}
|
||||||
@@ -561,25 +569,34 @@ onUnmounted(() => navBarStore.clearRight());
|
|||||||
}
|
}
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
gap: .5rem;
|
gap: .25rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
font-size: .75rem;
|
font-size: .75rem;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
.customer {
|
.customer {
|
||||||
min-width: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
white-space: nowrap;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.operation {
|
.type {
|
||||||
gap: .5rem;
|
font-weight: 700;
|
||||||
display: flex;
|
|
||||||
flex-shrink: 0;
|
&.receive {
|
||||||
align-items: center;
|
color: #15803d;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.refund {
|
||||||
|
color: #dc2626;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.confirm-no-refund {
|
||||||
|
color: #2563eb;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.revoke {
|
||||||
|
color: #7c3aed;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -647,5 +664,23 @@ onUnmounted(() => navBarStore.clearRight());
|
|||||||
.fallback {
|
.fallback {
|
||||||
background: #115e59;
|
background: #115e59;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.operation-type {
|
||||||
|
&.receive {
|
||||||
|
color: #86efac;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.refund {
|
||||||
|
color: #fca5a5;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.confirm-no-refund {
|
||||||
|
color: #93c5fd;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.revoke {
|
||||||
|
color: #c4b5fd;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user