From 6b29d3b01723a3be7df04266cd9563937c67f584 Mon Sep 17 00:00:00 2001 From: Methapon Metanipat Date: Wed, 30 Oct 2024 11:55:43 +0700 Subject: [PATCH] refactor: extract navigator into store instead --- src/layouts/MainLayout.vue | 24 +++++++---------- src/pages/01_branch-management/MainPage.vue | 13 +++++----- .../02_personnel-management/MainPage.vue | 9 ++++--- src/pages/03_customer-management/MainPage.vue | 11 ++++---- src/pages/04_product-service/MainPage.vue | 17 ++++++------ src/pages/05_quotation/MainPage.vue | 9 ++++--- src/pages/06_edm/MainPage.vue | 8 +++--- src/pages/MainPage.vue | 8 +++--- src/stores/navigator/index.ts | 19 ++++++++++++++ src/stores/utils/index.ts | 26 ------------------- 10 files changed, 68 insertions(+), 76 deletions(-) create mode 100644 src/stores/navigator/index.ts diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue index ea219696..95d53dac 100644 --- a/src/layouts/MainLayout.vue +++ b/src/layouts/MainLayout.vue @@ -14,9 +14,9 @@ import { CanvasComponent, DialogForm } from 'components/index'; import useOptionStore from 'stores/options'; import { dialog } from 'stores/utils'; import { setLocale } from 'src/utils/datetime'; -import useUtilsStore from 'stores/utils'; import useMyBranchStore from 'stores/my-branch'; import { useConfigStore } from 'src/stores/config'; +import { useNavigator } from 'src/stores/navigator'; const useMyBranch = useMyBranchStore(); const { fetchListMyBranch } = useMyBranch; @@ -37,7 +37,7 @@ interface Notification { const $q = useQuasar(); const loaderStore = useLoader(); -const utilsStore = useUtilsStore(); +const navigatorStore = useNavigator(); const optionStore = useOptionStore(); const configStore = useConfigStore(); @@ -88,12 +88,6 @@ const notification = ref([ content: 'Unread', read: false, }, - { - id: '2', - title: 'test', - content: 'test', - read: false, - }, { id: '3', title: 'Read', @@ -268,8 +262,8 @@ onMounted(async () => { }" > {{ - utilsStore.currentTitle?.title - ? $t(utilsStore.currentTitle?.title) + navigatorStore.current?.title + ? $t(navigatorStore.current?.title) : $q.screen.gt.xs ? 'Welcome to Jobs Worker Service' : 'Jobs Worker Service' @@ -277,15 +271,15 @@ onMounted(async () => {
diff --git a/src/pages/01_branch-management/MainPage.vue b/src/pages/01_branch-management/MainPage.vue index bf1e1ebe..ace18366 100644 --- a/src/pages/01_branch-management/MainPage.vue +++ b/src/pages/01_branch-management/MainPage.vue @@ -20,7 +20,7 @@ import { import NoData from 'src/components/NoData.vue'; import QrCodeUploadDialog from 'src/components/QrCodeUploadDialog.vue'; import ItemCard from 'src/components/ItemCard.vue'; -import useUtilsStore, { dialog, baseUrl } from 'stores/utils'; +import { dialog, baseUrl } from 'stores/utils'; import EmptyAddButton from 'components/AddButton.vue'; import TooltipComponent from 'components/TooltipComponent.vue'; import StatCard from 'components/StatCardComponent.vue'; @@ -49,10 +49,11 @@ import { SaveButton, UndoButton, } from 'components/button'; +import { useNavigator } from 'src/stores/navigator'; const $q = useQuasar(); const { t } = useI18n(); -const utilsStore = useUtilsStore(); +const navigatorStore = useNavigator(); const modelCreateTypeBranch = ref(false); const typeBranchItem = [ { @@ -230,8 +231,8 @@ async function calculateStats(headOfficeId?: string) { } onMounted(async () => { - utilsStore.currentTitle.title = 'menu.branch'; - utilsStore.currentTitle.path = [ + navigatorStore.current.title = 'menu.branch'; + navigatorStore.current.path = [ { text: 'branch.page.captionManage', i18n: true, @@ -914,7 +915,7 @@ watch( ); watch(currentHq, () => { - const tmp: typeof utilsStore.currentTitle.path = [ + const tmp: typeof navigatorStore.current.path = [ { text: 'branch.page.captionManage', i18n: true, @@ -940,7 +941,7 @@ watch(currentHq, () => { selectedSubBranche(currentHq.value.id); - utilsStore.currentTitle.path = tmp; + navigatorStore.current.path = tmp; }); diff --git a/src/pages/02_personnel-management/MainPage.vue b/src/pages/02_personnel-management/MainPage.vue index 500960b4..ed128345 100644 --- a/src/pages/02_personnel-management/MainPage.vue +++ b/src/pages/02_personnel-management/MainPage.vue @@ -11,7 +11,8 @@ import useAddressStore from 'stores/address'; import useMyBranch from 'src/stores/my-branch'; import { calculateAge } from 'src/utils/datetime'; import { useQuasar, type QTableProps } from 'quasar'; -import useUtilsStore, { dialog, baseUrl } from 'stores/utils'; +import { dialog, baseUrl } from 'stores/utils'; +import { useNavigator } from 'src/stores/navigator'; import { isRoleInclude, resetScrollBar } from 'src/stores/utils'; import { BranchUserStats } from 'stores/branch/types'; @@ -53,7 +54,7 @@ const $q = useQuasar(); const userStore = useUserStore(); const flowStore = useFlowStore(); -const utilsStore = useUtilsStore(); +const navigatorStore = useNavigator(); const optionStore = useOptionStore(); const branchStore = useBranchStore(); const adrressStore = useAddressStore(); @@ -662,8 +663,8 @@ async function fetchUserList() { } onMounted(async () => { - utilsStore.currentTitle.title = 'personnel.title'; - utilsStore.currentTitle.path = [{ text: 'personnel.caption', i18n: true }]; + navigatorStore.current.title = 'personnel.title'; + navigatorStore.current.path = [{ text: 'personnel.caption', i18n: true }]; modeView.value = $q.screen.lt.md ? true : false; await fetchUserList(); diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue index 0633c86a..4ef31b78 100644 --- a/src/pages/03_customer-management/MainPage.vue +++ b/src/pages/03_customer-management/MainPage.vue @@ -12,7 +12,8 @@ import useOcrStore from 'stores/ocr'; import useCustomerStore from 'stores/customer'; import useEmployeeStore from 'stores/employee'; import useMyBranchStore from 'stores/my-branch'; -import useUtilsStore, { dialog, notify, resetScrollBar } from 'stores/utils'; +import { dialog, notify, resetScrollBar } from 'stores/utils'; +import { useNavigator } from 'src/stores/navigator'; import useFlowStore from 'stores/flow'; import { Status } from 'stores/types'; import { @@ -81,7 +82,7 @@ const $q = useQuasar(); const route = useRoute(); const router = useRouter(); const flowStore = useFlowStore(); -const utilsStore = useUtilsStore(); +const navigatorStore = useNavigator(); const customerStore = useCustomerStore(); const userBranchStore = useMyBranchStore(); const employeeStore = useEmployeeStore(); @@ -112,8 +113,8 @@ const { state: employeeFormState, currentFromDataEmployee } = storeToRefs(employeeFormStore); async function init() { - utilsStore.currentTitle.title = 'menu.customer'; - utilsStore.currentTitle.path = [ + navigatorStore.current.title = 'menu.customer'; + navigatorStore.current.path = [ { text: 'menu.customerCaption', i18n: true, @@ -133,7 +134,7 @@ async function init() { if (_data) { currentCustomer.value = _data; - utilsStore.currentTitle.path.push({ + navigatorStore.current.path.push({ text: `${ _data.customerType === 'CORP' ? _data.branch[0].registerName diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue index 212f91c9..4726a859 100644 --- a/src/pages/04_product-service/MainPage.vue +++ b/src/pages/04_product-service/MainPage.vue @@ -48,7 +48,8 @@ const { currentMyBranch } = storeToRefs(userBranchStore); import { Status } from 'stores/types'; -import useUtilsStore, { dialog, dialogWarningClose } from 'stores/utils'; +import { dialog, dialogWarningClose } from 'stores/utils'; +import { useNavigator } from 'src/stores/navigator'; import useProductServiceStore from 'stores/product-service'; import { @@ -66,7 +67,7 @@ import { computed } from 'vue'; import { WorkflowTemplate } from 'src/stores/workflow-template/types'; const flowStore = useFlowStore(); -const utilsStore = useUtilsStore(); +const navigatorStore = useNavigator(); const productServiceStore = useProductServiceStore(); const optionStore = useOptionStore(); @@ -1463,8 +1464,8 @@ async function fetchImageList( } onMounted(async () => { - utilsStore.currentTitle.title = 'productService.title'; - utilsStore.currentTitle.path = [ + navigatorStore.current.title = 'productService.title'; + navigatorStore.current.path = [ { text: 'productService.caption', i18n: true, @@ -1489,7 +1490,7 @@ watch( inputSearch.value = ''; currentStatus.value = 'All'; - let tmp: typeof utilsStore.currentTitle.path = [ + let tmp: typeof navigatorStore.current.path = [ { text: 'productService.caption', i18n: true, @@ -1521,12 +1522,12 @@ watch( filterStat.value = []; productMode.value = 'group'; expandedTree.value.pop(); - utilsStore.currentTitle.path.pop(); + navigatorStore.current.path.pop(); } }, }); if (expandedTree.value.length === 0) { - utilsStore.currentTitle.path = [ + navigatorStore.current.path = [ { text: 'productService.caption', i18n: true }, ]; return; @@ -1546,7 +1547,7 @@ watch( }); } - utilsStore.currentTitle.path = tmp; + navigatorStore.current.path = tmp; }, { deep: true }, ); diff --git a/src/pages/05_quotation/MainPage.vue b/src/pages/05_quotation/MainPage.vue index 9c1f690b..4e7af0f3 100644 --- a/src/pages/05_quotation/MainPage.vue +++ b/src/pages/05_quotation/MainPage.vue @@ -6,7 +6,8 @@ import { storeToRefs } from 'pinia'; // NOTE: Import stores import { useQuotationStore } from 'src/stores/quotations'; -import useUtilsStore, { isRoleInclude } from 'stores/utils'; +import { isRoleInclude } from 'stores/utils'; +import { useNavigator } from 'src/stores/navigator'; import useFlowStore from 'src/stores/flow'; import useMyBranch from 'stores/my-branch'; import { useQuotationForm } from './form'; @@ -44,7 +45,7 @@ const quotationFormStore = useQuotationForm(); const customerFormStore = useCustomerForm(); const flowStore = useFlowStore(); const userBranch = useMyBranch(); -const utilsStore = useUtilsStore(); +const navigatorStore = useNavigator(); const { currentFormData: quotationFormData, @@ -220,8 +221,8 @@ const { } = storeToRefs(quotationStore); onMounted(async () => { - utilsStore.currentTitle.title = 'quotation.title'; - utilsStore.currentTitle.path = [ + navigatorStore.current.title = 'quotation.title'; + navigatorStore.current.path = [ { text: 'quotation.caption', i18n: true, diff --git a/src/pages/06_edm/MainPage.vue b/src/pages/06_edm/MainPage.vue index f2d9e16a..4caace5c 100644 --- a/src/pages/06_edm/MainPage.vue +++ b/src/pages/06_edm/MainPage.vue @@ -1,13 +1,13 @@