refactor: stats missing and new tab
This commit is contained in:
parent
453252c4be
commit
448d9156f9
6 changed files with 55 additions and 54 deletions
|
|
@ -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: {
|
||||||
|
|
|
||||||
|
|
@ -1288,11 +1288,11 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
stats: {
|
stats: {
|
||||||
Pending: 'ใบเพิ่มหนี้',
|
Issued: 'ใบเพิ่มหนี้',
|
||||||
Expire: 'พ้นกำหนด',
|
Expired: 'พ้นกำหนด',
|
||||||
Payment: 'ชำระเงิน',
|
PaymentPending: 'ชำระเงิน',
|
||||||
Receipt: 'ใบเสร็จรับเงิน',
|
PaymentSuccess: 'ใบเสร็จรับเงิน',
|
||||||
Succeed: 'เสร็จสิ้น',
|
ProcessComplete: 'เสร็จสิ้น',
|
||||||
},
|
},
|
||||||
|
|
||||||
viewMode: {
|
viewMode: {
|
||||||
|
|
|
||||||
|
|
@ -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',
|
||||||
},
|
},
|
||||||
]"
|
]"
|
||||||
|
|
|
||||||
|
|
@ -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 {
|
||||||
|
|
|
||||||
|
|
@ -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 {
|
||||||
|
|
|
||||||
|
|
@ -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',
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue