feat: add date range selection to task order filtering

src/pages/09_task-order/MainPage.vue

@@ -27,6 +27,7 @@ import useFlowStore from 'src/stores/flow';
 import { pageTabs, column, pageTabsReceive } from './constants';
 import { dialogWarningClose, isRoleInclude } from 'src/stores/utils';
 import { PaginationResult } from 'src/types';
+import AdvanceSearch from 'src/components/shared/AdvanceSearch.vue';
 
 const { t } = useI18n();
 const $q = useQuasar();
@@ -48,6 +49,7 @@ const pageState = reactive({
   isMessenger: isRoleInclude(['messenger']),
   receiveDialog: false,
   isReceiveScan: false,
+  searchDate: [],
 });
 
 const taskOrderList = ref<TaskOrder[]>([]);
@@ -69,6 +71,8 @@ async function fetchTaskOrderList(opts?: { page?: number; pageSize?: number }) {
       pageSize: opts?.pageSize || pageSize.value,
       query: pageState.inputSearch === '' ? undefined : pageState.inputSearch,
       userTaskStatus: pageState.currentTab as UserTaskStatus,
+      startDate: pageState.searchDate[0],
+      endDate: pageState.searchDate[1],
     });
   } else {
     res = await taskOrderStore.getTaskOrderList({
@@ -76,6 +80,8 @@ async function fetchTaskOrderList(opts?: { page?: number; pageSize?: number }) {
       pageSize: opts?.pageSize || pageSize.value,
       query: pageState.inputSearch === '' ? undefined : pageState.inputSearch,
       taskOrderStatus: pageState.currentTab as TaskOrderStatus | undefined,
+      startDate: pageState.searchDate[0],
+      endDate: pageState.searchDate[1],
     });
   }
   if (res) {
@@ -157,6 +163,7 @@ watch(
     () => pageState.inputSearch,
     () => pageSize.value,
     () => pageState.statusFilter,
+    () => pageState.searchDate,
   ],
   () => {
     fetchTaskOrderList();
@@ -299,6 +306,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">

src/stores/task-order/index.ts

@@ -48,6 +48,8 @@ export const useTaskOrderStore = defineStore('taskorder-store', () => {
     query?: string;
     taskOrderStatus?: TaskOrderStatus;
     assignedUserId?: boolean;
+    startDate?: string;
+    endDate?: string;
   }) {
     const res = await api.get<PaginationResult<TaskOrder>>('/task-order', {
       params,
@@ -161,6 +163,8 @@ export const useTaskOrderStore = defineStore('taskorder-store', () => {
     pageSize?: number;
     query?: string;
     userTaskStatus?: UserTaskStatus;
+    startDate?: string;
+    endDate?: string;
   }) {
     const res = await api.get<PaginationResult<TaskOrder>>('/user-task-order', {
       params,