From 8c5596f5e81f7580750e8767dd724d2c3a22ba6f Mon Sep 17 00:00:00 2001 From: Net <93821485+somnetsak123@users.noreply.github.com> Date: Mon, 1 Jul 2024 14:20:24 +0700 Subject: [PATCH] =?UTF-8?q?fix:=20=E0=B9=81=E0=B8=81=E0=B9=89=20layout=20?= =?UTF-8?q?=20=E0=B9=81=E0=B8=9A=E0=B9=88=E0=B8=87=20=20=E0=B8=AB=E0=B8=99?= =?UTF-8?q?=E0=B9=89=E0=B8=B2=20=E0=B8=82=E0=B8=AD=E0=B8=87=20=E0=B8=AA?= =?UTF-8?q?=E0=B8=B4=E0=B8=99=E0=B8=84=E0=B9=89=E0=B8=B2=20=E0=B9=81?= =?UTF-8?q?=E0=B8=A5=E0=B8=B0=20=E0=B8=9A=E0=B8=A3=E0=B8=B4=E0=B8=81?= =?UTF-8?q?=E0=B8=B2=E0=B8=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/04_product-service/MainPage.vue | 148 +++++++++------------- 1 file changed, 63 insertions(+), 85 deletions(-) diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue index 310dffd3..7c018d0e 100644 --- a/src/pages/04_product-service/MainPage.vue +++ b/src/pages/04_product-service/MainPage.vue @@ -202,17 +202,12 @@ const pageSizeGroup = ref(30); const currentPageType = ref(1); const maxPageType = ref(1); const pageSizeType = ref(30); -const currentPageServiceAndProduct = ref(1); const maxPageServiceAndProduct = ref(1); -const pageSizeServiceAndProduct = ref(30); -const currentPageProduct = ref(1); -const maxPageProduct = ref(1); -const pageSizeProduct = ref(30); -const currentPageService = ref(1); -const maxPageService = ref(1); -const pageSizeService = ref(30); +const pageSizeServiceAndProduct = ref(1); +const currentPageServiceAndProduct = ref(1); const totalType = ref(0); const totalGroup = ref(0); +const total = ref(0); // เก็บ id ที่เข้ามา const currentId = ref(''); @@ -346,8 +341,8 @@ async function fetchListOfProductIsAdd(productTypeId: string) { async function fetchListOfProduct() { const res = await fetchListProduct({ - page: currentPageProduct.value, - pageSize: pageSizeProduct.value, + page: currentPageServiceAndProduct.value, + pageSize: pageSizeServiceAndProduct.value, query: !!inputSearchProductAndService.value ? inputSearchProductAndService.value : undefined, @@ -361,9 +356,12 @@ async function fetchListOfProduct() { }); if (res) { + total.value = res.total; totalProduct.value = res.total; - currentPageProduct.value = res.page; - maxPageProduct.value = Math.ceil(res.total / pageSizeProduct.value); + currentPageServiceAndProduct.value = res.page; + maxPageServiceAndProduct.value = Math.ceil( + res.total / pageSizeServiceAndProduct.value, + ); product.value = res.result.map((v) => { return { @@ -376,11 +374,11 @@ async function fetchListOfProduct() { async function fetchListOfService() { const res = await fetchListService({ - page: currentPageService.value, + page: currentPageServiceAndProduct.value, query: !!inputSearchProductAndService.value ? inputSearchProductAndService.value : undefined, - pageSize: pageSizeService.value, + pageSize: pageSizeServiceAndProduct.value, status: currentStatus.value === 'INACTIVE' ? 'INACTIVE' @@ -392,8 +390,11 @@ async function fetchListOfService() { if (res) { totalService.value = res.total; - currentPageService.value = res.page; - maxPageService.value = Math.ceil(res.total / pageSizeService.value); + total.value = res.total; + currentPageServiceAndProduct.value = res.page; + maxPageServiceAndProduct.value = Math.ceil( + res.total / pageSizeServiceAndProduct.value, + ); service.value = res.result.map((v) => { return { ...v, @@ -494,6 +495,7 @@ async function fetchListOfProductAndService() { totalProductAndService.value = res.total; } + total.value = res.total; currentPageServiceAndProduct.value = res.page; maxPageServiceAndProduct.value = Math.ceil( res.total / pageSizeServiceAndProduct.value, @@ -922,6 +924,22 @@ async function fetchStatus() { } } +async function alternativeFetch() { + if (productAndServiceTab.value === 'all') { + await fetchListOfProductAndService(); + flowStore.rotate(); + } + if (productAndServiceTab.value === 'product') { + await fetchListOfProduct(); + + flowStore.rotate(); + } + if (productAndServiceTab.value === 'service') { + await fetchListOfService(); + flowStore.rotate(); + } +} + function cloneData() { if (!currentService.value) return; formDataProductService.value = { @@ -964,21 +982,6 @@ watch(currentStatus, async () => { flowStore.rotate(); }); -watch(currentPageServiceAndProduct, async () => { - await fetchListOfProductAndService(); - flowStore.rotate(); -}); - -watch(currentPageProduct, async () => { - await fetchListOfProduct(); - flowStore.rotate(); -}); - -watch(currentPageService, async () => { - await fetchListOfService(); - flowStore.rotate(); -}); - watch(inputSearch, async () => { if (productMode.value === 'group') { await fetchListGroups(); @@ -992,19 +995,7 @@ watch(inputSearch, async () => { }); watch(inputSearchProductAndService, async () => { - if (productAndServiceTab.value === 'all') { - await fetchListOfProductAndService(); - flowStore.rotate(); - } - if (productAndServiceTab.value === 'product') { - await fetchListOfProduct(); - - flowStore.rotate(); - } - if (productAndServiceTab.value === 'service') { - await fetchListOfService(); - flowStore.rotate(); - } + await alternativeFetch(); }); @@ -1287,7 +1278,6 @@ watch(inputSearchProductAndService, async () => { " @on-click=" async () => { - inputSearch = undefined; pathTypeName = v.name; currentIdType = v.id; productMode = 'service'; @@ -1402,7 +1392,7 @@ watch(inputSearchProductAndService, async () => { v-model:max-page="maxPageType" :fetch-data=" async () => { - await fetchListTypes(); + await fetchListType(); flowStore.rotate(); } " @@ -1417,8 +1407,10 @@ watch(inputSearchProductAndService, async () => { name="all" @click=" async () => { + currentPageServiceAndProduct = 1; inputSearchProductAndService = ''; currentStatus = 'All'; + pageSizeServiceAndProduct; await fetchListOfProductAndService(); flowStore.rotate(); } @@ -1449,6 +1441,7 @@ watch(inputSearchProductAndService, async () => { name="product" @click=" async () => { + currentPageServiceAndProduct = 1; inputSearchProductAndService = ''; currentStatus = 'All'; await fetchListOfProduct(); @@ -1481,6 +1474,7 @@ watch(inputSearchProductAndService, async () => { name="service" @click=" async () => { + currentPageServiceAndProduct = 1; inputSearchProductAndService = ''; currentStatus = 'All'; await fetchListOfService(); @@ -1655,45 +1649,29 @@ watch(inputSearchProductAndService, async () => { /> -
- -
- -
- -
- -
- +
+ {{ + $t('recordsPage', { + resultcurrentPage: + productAndServiceTab === 'all' + ? productAndService.length + : productAndServiceTab === 'product' + ? product?.length + : service?.length, + total: total, + }) + }} +
+