src/pages/InvoiceOut/InvoiceOutGlobalForm.vue

@@ -115,6 +115,9 @@ onMounted(async () => {
             <VnSelect
                 :label="t('invoiceOutSerialType')"
                 v-model="formData.serialType"
+                @update:model-value="
+                    invoiceOutGlobalStore.fetchInvoiceOutConfig(formData)
+                "
                 :options="serialTypesOptions"
                 option-value="type"
                 option-label="type"

src/pages/Monitor/Ticket/MonitorTickets.vue

@@ -26,6 +26,7 @@ const provinceOpts = ref([]);
 const stateOpts = ref([]);
 const zoneOpts = ref([]);
 const DepartmentOpts = ref([]);
+const PayMethodOpts = ref([]);
 const ItemPackingTypeOpts = ref([]);
 const stateStore = useStateStore();
 const { viewSummary } = useSummaryDialog();
@@ -223,7 +224,16 @@ const columns = computed(() => [
         label: t('salesTicketsTable.payMethod'),
         name: 'payMethod',
         align: 'left',
-        columnFilter: false,
+        columnFilter: {
+            component: 'select',
+            url: 'PayMethods',
+            attrs: {
+                options: PayMethodOpts.value,
+                optionValue: 'id',
+                optionLabel: 'name',
+                dense: true,
+            },
+        },
     },
     {
         label: t('salesTicketsTable.total'),
@@ -244,11 +254,8 @@ const columns = computed(() => [
         align: 'left',
         columnFilter: {
             component: 'select',
-            url: 'Departments',
             attrs: {
                 options: DepartmentOpts.value,
-                optionValue: 'name',
-                optionLabel: 'name',
                 dense: true,
             },
         },
@@ -364,6 +371,15 @@ const openTab = (id) =>
         auto-load
         @on-fetch="(data) => (DepartmentOpts = data)"
     />
+    <FetchData
+        url="PayMethods"
+        :filter="{
+            fields: ['id', 'name'],
+            order: 'id ASC',
+        }"
+        auto-load
+        @on-fetch="(data) => (PayMethodOpts = data)"
+    />
     <MonitorTicketSearchbar />
     <RightMenu>
         <template #right-panel>
@@ -383,7 +399,7 @@ const openTab = (id) =>
         auto-load
         :row-click="({ id }) => openTab(id)"
         :disable-option="{ card: true }"
-        :user-params="{ from, to, scopeDays: 0, packing }"
+        :user-params="{ from, to, scopeDays: 0 }"
     >
         <template #top-left>
             <QBtn

src/stores/invoiceOutGlobal.js

@@ -19,7 +19,7 @@ export const useInvoiceOutGlobalStore = defineStore({
             maxShipped: null,
             clientId: null,
             printer: null,
-            serialType: null,
+            serialType: 'global',
         },
         addresses: [],
         minInvoicingDate: null,
@@ -41,7 +41,6 @@ export const useInvoiceOutGlobalStore = defineStore({
 
         async fetchAllData() {
             try {
-                const userInfo = await useUserConfig().fetch();
                 const date = Date.vnNew();
                 this.formInitialData.maxShipped = new Date(
                     date.getFullYear(),
@@ -53,7 +52,7 @@ export const useInvoiceOutGlobalStore = defineStore({
 
                 await Promise.all([
                     this.fetchParallelism(),
-                    this.fetchInvoiceOutConfig(userInfo.companyFk),
+                    this.fetchInvoiceOutConfig(),
                 ]);
 
                 this.initialDataLoading = false;
@@ -62,21 +61,23 @@ export const useInvoiceOutGlobalStore = defineStore({
             }
         },
 
-        async fetchInvoiceOutConfig(companyFk) {
+        async fetchInvoiceOutConfig(formData = this.formInitialData) {
             try {
-                this.formInitialData.companyFk = companyFk;
-                const params = { companyFk: companyFk };
+                const userInfo = await useUserConfig().fetch();
+                const params = {
+                    companyFk: userInfo.companyFk,
+                    serialType: formData.serialType,
+                };
 
                 const { data } = await axios.get('InvoiceOuts/getInvoiceDate', {
                     params,
                 });
 
-                const stringDate = data.issued.substring(0, 10);
-                this.minInvoicingDate = stringDate;
-                this.formInitialData.invoiceDate = stringDate;
-
-                this.minInvoicingDate = new Date(data.issued);
+                this.minInvoicingDate = data?.issued
+                    ? new Date(data.issued)
+                    : Date.vnNew();
                 this.formInitialData.invoiceDate = this.minInvoicingDate;
+                formData.invoiceDate = this.minInvoicingDate;
             } catch (err) {
                 console.error('Error fetching invoice out global initial data');
                 throw new Error();