refactor: stats missing and new tab

This commit is contained in:
Thanaphon Frappet 2025-02-19 17:03:15 +07:00
parent 453252c4be
commit 448d9156f9
6 changed files with 55 additions and 54 deletions

View file

@ -1306,11 +1306,11 @@ export default {
}, },
stats: { stats: {
Pending: 'Debit Note', Issued: 'Debit Note',
Expire: 'Expired', Expired: 'Expired',
Payment: 'Payment', PaymentPending: 'Payment',
Receipt: 'Receipt', PaymentSuccess: 'Receipt',
Succeed: 'Completed', ProcessComplete: 'Completed',
}, },
viewMode: { viewMode: {

View file

@ -1288,11 +1288,11 @@ export default {
}, },
stats: { stats: {
Pending: 'ใบเพิ่มหนี้', Issued: 'ใบเพิ่มหนี้',
Expire: 'พ้นกำหนด', Expired: 'พ้นกำหนด',
Payment: 'ชำระเงิน', PaymentPending: 'ชำระเงิน',
Receipt: 'ใบเสร็จรับเงิน', PaymentSuccess: 'ใบเสร็จรับเงิน',
Succeed: 'เสร็จสิ้น', ProcessComplete: 'เสร็จสิ้น',
}, },
viewMode: { viewMode: {

View file

@ -35,7 +35,7 @@ const { stats, pageMax, page, data, pageSize } = storeToRefs(debitNote);
// NOTE: Variable // NOTE: Variable
const pageState = reactive({ const pageState = reactive({
quotationId: '', quotationId: '',
currentTab: DebitNoteStatus.Pending, currentTab: DebitNoteStatus.Issued,
hideStat: false, hideStat: false,
statusFilter: 'None', statusFilter: 'None',
inputSearch: '', inputSearch: '',
@ -64,7 +64,9 @@ async function getList(opts?: { page?: number; pageSize?: number }) {
page: opts?.page || page.value, page: opts?.page || page.value,
pageSize: opts?.pageSize || pageSize.value, pageSize: opts?.pageSize || pageSize.value,
query: pageState.inputSearch === '' ? undefined : pageState.inputSearch, query: pageState.inputSearch === '' ? undefined : pageState.inputSearch,
deebitNoteStatus: pageState.currentTab as DebitNoteStatus | undefined, status: (pageState.currentTab === DebitNoteStatus.Issued
? undefined
: pageState.currentTab) as DebitNoteStatus,
includeRegisteredBranch: true, includeRegisteredBranch: true,
}); });
@ -126,7 +128,17 @@ onMounted(async () => {
navigator.current.title = 'debitNote.title'; navigator.current.title = 'debitNote.title';
navigator.current.path = [{ text: 'debitNote.caption', i18n: true }]; navigator.current.path = [{ text: 'debitNote.caption', i18n: true }];
debitNote.getDebitNoteStats().then((res) => res && (stats.value = res)); await debitNote.getDebitNoteStats().then((res) => {
if (res) {
stats.value = res;
stats.value['issued'] = Object.values(res).reduce(
(sum, value) => sum + value,
0,
);
}
});
getList(); getList();
}); });
@ -184,33 +196,28 @@ watch(
:branch="[ :branch="[
{ {
icon: 'material-symbols-light:receipt-long', icon: 'material-symbols-light:receipt-long',
count: stats[DebitNoteStatus.Pending] || 0, count: stats['issued'] || 0,
label: `debitNote.stats.${DebitNoteStatus.Pending}`, label: `debitNote.stats.${DebitNoteStatus.Issued}`,
color: 'orange', color: 'orange',
}, },
{
icon: 'mdi-clock-alert-outline',
count: stats[DebitNoteStatus.Expire] || 0,
label: `debitNote.stats.${DebitNoteStatus.Expire}`,
color: 'cyan',
},
{ {
icon: 'tabler:cash-register', icon: 'tabler:cash-register',
count: stats[DebitNoteStatus.Payment] || 0, count: stats['paymentPending'] || 0,
label: `debitNote.stats.${DebitNoteStatus.Payment}`, label: `debitNote.stats.${DebitNoteStatus.PaymentPending}`,
color: 'dark-orange', color: 'dark-orange',
}, },
{ {
icon: 'fluent:receipt-money-16-regular', icon: 'fluent:receipt-money-16-regular',
count: stats[DebitNoteStatus.Receipt] || 0, count: stats['paymentSuccess'] || 0,
label: `debitNote.stats.${DebitNoteStatus.Receipt}`, label: `debitNote.stats.${DebitNoteStatus.PaymentSuccess}`,
color: 'green', color: 'green',
}, },
{ {
icon: 'mdi-check-decagram-outline', icon: 'mdi-check-decagram-outline',
count: stats[DebitNoteStatus.Succeed] || 0, count: stats['processComplete'] || 0,
label: `debitNote.stats.${DebitNoteStatus.Succeed}`, label: `debitNote.stats.${DebitNoteStatus.ProcessComplete}`,
color: 'blue', color: 'blue',
}, },
]" ]"

View file

@ -4,29 +4,24 @@ import { formatNumberDecimal } from 'src/stores/utils';
export const taskStatusOpts = [ export const taskStatusOpts = [
{ {
status: DebitNoteStatus.Expire, status: DebitNoteStatus.PaymentPending,
name: `debitNote.status.${DebitNoteStatus.Expire}`, name: `debitNote.status.${DebitNoteStatus.PaymentPending}`,
}, },
{ {
status: DebitNoteStatus.Payment, status: DebitNoteStatus.PaymentSuccess,
name: `debitNote.status.${DebitNoteStatus.Payment}`, name: `debitNote.status.${DebitNoteStatus.PaymentSuccess}`,
}, },
{ {
status: DebitNoteStatus.Receipt, status: DebitNoteStatus.PaymentSuccess,
name: `debitNote.status.${DebitNoteStatus.Receipt}`, name: `debitNote.status.${DebitNoteStatus.ProcessComplete}`,
},
{
status: DebitNoteStatus.Succeed,
name: `debitNote.status.${DebitNoteStatus.Succeed}`,
}, },
]; ];
export const pageTabs = [ export const pageTabs = [
{ label: 'Pending', value: DebitNoteStatus.Pending }, { label: 'Pending', value: DebitNoteStatus.Issued },
{ label: 'Expire', value: DebitNoteStatus.Expire }, { label: 'Payment', value: DebitNoteStatus.PaymentPending },
{ label: 'Payment', value: DebitNoteStatus.Payment }, { label: 'Receipt', value: DebitNoteStatus.PaymentSuccess },
{ label: 'Receipt', value: DebitNoteStatus.Receipt }, { label: 'Succeed', value: DebitNoteStatus.ProcessComplete },
{ label: 'Succeed', value: DebitNoteStatus.Succeed },
]; ];
export enum Status { export enum Status {

View file

@ -26,7 +26,7 @@ export async function getDebitNoteList(params?: {
page?: number; page?: number;
pageSize?: number; pageSize?: number;
query?: string; query?: string;
deebitNoteStatus?: Status; status?: Status;
includeRegisteredBranch?: boolean; includeRegisteredBranch?: boolean;
}) { }) {
const res = await api.get<PaginationResult<Data>>(`/${ENDPOINT}`, { const res = await api.get<PaginationResult<Data>>(`/${ENDPOINT}`, {
@ -66,12 +66,11 @@ export const useDebitNote = defineStore('debit-note-store', () => {
const page = ref<number>(1); const page = ref<number>(1);
const pageMax = ref<number>(1); const pageMax = ref<number>(1);
const pageSize = ref<number>(30); const pageSize = ref<number>(30);
const stats = ref<Record<Status, number>>({ const stats = ref<Record<string, number>>({
[Status.Pending]: 0, ['issued']: 0,
[Status.Expire]: 0, ['paymentPending']: 0,
[Status.Payment]: 0, ['paymentSuccess']: 0,
[Status.Receipt]: 0, ['processComplete']: 0,
[Status.Succeed]: 0,
}); });
return { return {

View file

@ -86,9 +86,9 @@ export type DebitNote = {
}; };
export enum DebitNoteStatus { export enum DebitNoteStatus {
Pending = 'Pending', Issued = 'Issued',
Expire = 'Expire', Expired = 'Expired',
Payment = 'Payment', PaymentPending = 'PaymentPending',
Receipt = 'Receipt', PaymentSuccess = 'PaymentSuccess',
Succeed = 'Succeed', ProcessComplete = 'ProcessComplete',
} }