feat: add date range selection to credit note, debit note, and receipt management

src/pages/11_credit-note/MainPage.vue

@@ -24,6 +24,7 @@ import { pageTabs, columns, hslaColors } from './constants';
 import { CreditNoteStatus, useCreditNote } from 'src/stores/credit-note';
 import TableCreditNote from './TableCreditNote.vue';
 import { dialogWarningClose } from 'src/stores/utils';
+import AdvanceSearch from 'src/components/shared/AdvanceSearch.vue';
 
 const $q = useQuasar();
 const { t } = useI18n();
@@ -46,6 +47,7 @@ const pageState = reactive({
   total: 0,
 
   creditDialog: false,
+  searchDate: [],
 });
 
 const fieldSelectedOption = computed(() => {
@@ -64,6 +66,8 @@ async function getList(opts?: { page?: number; pageSize?: number }) {
     pageSize: opts?.pageSize || pageSize.value,
     query: pageState.inputSearch === '' ? undefined : pageState.inputSearch,
     creditNoteStatus: pageState.currentTab as CreditNoteStatus | undefined,
+    startDate: pageState.searchDate[0],
+    endDate: pageState.searchDate[1],
   });
 
   if (res) {
@@ -133,6 +137,7 @@ watch(
     () => pageState.inputSearch,
     () => pageSize.value,
     () => pageState.statusFilter,
+    () => pageState.searchDate,
   ],
   () => {
     getList();
@@ -228,6 +233,10 @@ watch(
               <template #prepend>
                 <q-icon name="mdi-magnify" />
               </template>
+              <template v-slot:append>
+                <q-separator vertical inset class="q-mr-xs" />
+                <AdvanceSearch v-model="pageState.searchDate" />
+              </template>
             </q-input>
 
             <div class="row col-md-5 justify-end" style="white-space: nowrap">