diff --git a/Dockerfile b/Dockerfile index 1b6602f8..ce3ea8dc 100644 --- a/Dockerfile +++ b/Dockerfile @@ -3,6 +3,7 @@ FROM node:20-slim AS build-stage ENV PNPM_HOME="/pnpm" ENV PATH="$PNPM_HOME:$PATH" +RUN npm i -g corepack@latest RUN corepack enable WORKDIR /app diff --git a/src/components/01_branch-management/FormBank.vue b/src/components/01_branch-management/FormBank.vue index eef5f3a1..e9cc4483 100644 --- a/src/components/01_branch-management/FormBank.vue +++ b/src/components/01_branch-management/FormBank.vue @@ -44,7 +44,7 @@ defineEmits<{ }>(); const bankBookOptions = ref[]>([]); -let bankBoookFilter: ( +let bankBookFilter: ( value: string, update: (callbackFn: () => void, afterFn?: (ref: QSelect) => void) => void, ) => void; @@ -77,7 +77,7 @@ function change(e: Event) { onMounted(() => { if (optionStore.globalOption) { - bankBoookFilter = selectFilterOptionRefMod( + bankBookFilter = selectFilterOptionRefMod( ref(optionStore.globalOption.bankBook), bankBookOptions, 'label', @@ -94,7 +94,7 @@ onMounted(() => { watch( () => optionStore.globalOption, () => { - bankBoookFilter = selectFilterOptionRefMod( + bankBookFilter = selectFilterOptionRefMod( ref(optionStore.globalOption.bankBook), bankBookOptions, 'label', @@ -131,8 +131,8 @@ watch(
- + diff --git a/src/components/04_product-service/FormDocument.vue b/src/components/04_product-service/FormDocument.vue index f7aa3ab1..f875122c 100644 --- a/src/components/04_product-service/FormDocument.vue +++ b/src/components/04_product-service/FormDocument.vue @@ -106,6 +106,7 @@ function optionSearch(val: string | null) {
import { ref, watch } from 'vue'; import { formatNumberDecimal, commaInput } from 'stores/utils'; -import { QTableProps } from 'quasar'; +import { QTableProps, QTableSlots } from 'quasar'; import { calculatePrice } from 'src/utils/arithmetic'; const serviceCharge = defineModel('serviceCharge'); @@ -9,24 +9,48 @@ const agentPrice = defineModel('agentPrice'); const price = defineModel('price'); const vatIncluded = defineModel('vatIncluded'); const calcVat = defineModel('calcVat'); +const agentPriceVatIncluded = defineModel('agentPriceVatIncluded'); +const agentPriceCalcVat = defineModel('agentPriceCalcVat'); +const serviceChargeVatIncluded = defineModel( + 'serviceChargeVatIncluded', +); +const serviceChargeCalcVat = defineModel('serviceChargeCalcVat'); -const price4Show = ref(commaInput(price.value?.toString() || '0')); -const agentPrice4Show = ref( +const formattedPrice = ref(commaInput(price.value?.toString() || '0')); +const formattedAgentPrice = ref( commaInput(agentPrice.value?.toString() || '0'), ); -const serviceCharge4Show = ref( +const formattedServiceCharge = ref( commaInput(serviceCharge.value?.toString() || '0'), ); -const column = [ +type RowData = { + pricePerUnit: number; + calcVat: boolean; + vatIncluded: boolean; +}; + +const columns = [ { name: 'label', - align: 'center', + align: 'left', label: 'productService.product.priceInformation', field: 'label', }, { - name: 'pricePerUnit', + name: '#calcVat', + align: 'center', + label: 'general.calculateVat', + field: '#calcVat', + }, + { + name: '#vatIncluded', + align: 'center', + label: 'productService.product.vatIncluded', + field: '#vatIncluded', + }, + { + name: '#pricePerUnit', align: 'center', label: 'quotation.pricePerUnit', field: 'pricePerUnit', @@ -35,54 +59,77 @@ const column = [ name: 'beforeVat', align: 'right', label: 'quotation.priceBeforeVat', - field: 'beforeVat', + field: (data: RowData) => + formatNumberDecimal( + calculatePrice({ + output: 'beforeVat', + vatIncluded: data.vatIncluded, + price: data.pricePerUnit || 0, + }), + 2, + ), }, { name: 'vat', align: 'right', label: 'general.vat', - field: 'vat', + field: (data: RowData) => + formatNumberDecimal( + calculatePrice({ + output: 'vat', + calcVat: data.calcVat, + price: Number( + formatNumberDecimal( + calculatePrice({ + output: 'beforeVat', + vatIncluded: data.vatIncluded, + price: data.pricePerUnit, + }), + 2, + ).replaceAll(',', ''), + ), + }), + 2, + ), }, { name: 'total', align: 'right', label: 'quotation.sumPrice', - field: 'total', + field: (data: RowData) => + formatNumberDecimal( + calculatePrice({ + output: 'total', + vat: 0.07, + price: data.pricePerUnit, + }) + + (!data.vatIncluded + ? calculatePrice({ + output: 'vat', + calcVat: data.calcVat, + price: data.pricePerUnit, + }) + : 0), + 2, + ), }, -] as const satisfies QTableProps['columns']; +] as QTableProps['columns']; -const row = [ - { - label: 'productService.product.salePrice', - beforeVat: 0, - vat: 0, - total: 0, - }, - { - label: 'productService.product.agentPrice', - beforeVat: 0, - vat: 0, - total: 0, - }, - { - label: 'productService.product.processingPrice', - beforeVat: 0, - vat: 0, - total: 0, - }, -] as const satisfies QTableProps['rows']; - -watch(calcVat, () => { - if (calcVat.value === false) vatIncluded.value = false; +watch([calcVat, agentPriceCalcVat, serviceChargeCalcVat], () => { + if (calcVat.value === false) { + vatIncluded.value = false; + } + if (agentPriceCalcVat.value === false) { + agentPriceVatIncluded.value = false; + } + if (serviceChargeCalcVat.value === false) { + serviceChargeVatIncluded.value = false; + } }); withDefaults( defineProps<{ - dense?: boolean; - outlined?: boolean; readonly?: boolean; - separator?: boolean; - isType?: boolean; priceDisplay?: { price: boolean; agentPrice: boolean; @@ -115,255 +162,239 @@ withDefaults( {{ $t('productService.product.priceInformation') }}
-
- - -
-
- - {{ $t('productService.product.vatIncluded') }} - - - {{ $t('productService.product.vatExcluded') }} - -
-
+
- @@ -373,16 +404,6 @@ withDefaults( diff --git a/src/components/05_quotation/ProductItem.vue b/src/components/05_quotation/ProductItem.vue index 65abb484..b1996d03 100644 --- a/src/components/05_quotation/ProductItem.vue +++ b/src/components/05_quotation/ProductItem.vue @@ -64,7 +64,7 @@ function calcPrice(c: (typeof rows.value)[number]) { const finalPriceNoVat = finalPriceWithVat / (1 + (config.value?.vat || 0.07)); const price = finalPriceNoVat * c.amount - c.discount; - const vat = c.product.calcVat + const vat = c.product[props.agentPrice ? 'agentPriceCalcVat' : 'calcVat'] ? (finalPriceNoVat * c.amount - c.discount) * (config.value?.vat || 0.07) : 0; return precisionRound(price + vat); @@ -234,7 +234,6 @@ watch( const incoming = current.filter( (lhs) => !before.find((rhs) => { - console.log(lhs, rhs); return JSON.stringify(lhs) === JSON.stringify(rhs); }), ); @@ -387,7 +386,9 @@ watch( {{ formatNumberDecimal( props.row.pricePerUnit + - (props.row.product.calcVat + (props.row.product[ + agentPrice ? 'agentPriceCalcVat' : 'calcVat' + ] ? props.row.pricePerUnit * (config?.vat || 0.07) : 0), 2, @@ -443,7 +444,9 @@ watch( {{ formatNumberDecimal( - props.row.product.calcVat + props.row.product[ + agentPrice ? 'agentPriceCalcVat' : 'calcVat' + ] ? precisionRound( (props.row.pricePerUnit * props.row.amount - props.row.discount) * diff --git a/src/components/05_quotation/QuotationCard.vue b/src/components/05_quotation/QuotationCard.vue index 1cce142d..3f6768c2 100644 --- a/src/components/05_quotation/QuotationCard.vue +++ b/src/components/05_quotation/QuotationCard.vue @@ -1,9 +1,7 @@
-
-
+ +
{ :class="{ dark: $q.dark.isActive }" :style="`background-color: ${bgColor}`" > -
{{ $t(text) }}
+
+ {{ $t(text) }} +
diff --git a/src/components/ProfileBanner.vue b/src/components/ProfileBanner.vue index 6ba83734..9c72041c 100644 --- a/src/components/ProfileBanner.vue +++ b/src/components/ProfileBanner.vue @@ -154,15 +154,15 @@ const smallBanner = ref(false); class="absolute-bottom-right" style=" border-radius: 50%; - width: 20px; - height: 20px; + width: 1.25vw; + height: 1.25vw; z-index: 2; background: var(--surface-1); " > @@ -193,7 +193,7 @@ const smallBanner = ref(false); >
@@ -302,7 +303,11 @@ const smallBanner = ref(false); > -
+
@@ -378,6 +385,7 @@ const smallBanner = ref(false);
@@ -425,7 +433,7 @@ const smallBanner = ref(false); inline-label mobile-arrows v-model="currentTab" - active-class="active-tab text-weight-bold" + :active-class="`active-tab text-weight-bold ${$q.dark.isActive && 'dark'}`" class="app-text-muted full-width" align="left" v-if="typeof tabsList === 'object'" @@ -435,6 +443,7 @@ const smallBanner = ref(false); :id="`${prefix}-tab-${tab.label}`" v-bind:key="tab.name" class="content-tab text-capitalize" + :class="{ 'tab-label': currentTab !== tab.name }" :name="tab.name" :label="tab.label" /> @@ -526,5 +535,13 @@ const smallBanner = ref(false); .active-tab { color: var(--brand-1); + &.dark { + filter: brightness(1.3); + } +} + +.tab-label { + color: var(--foreground); + opacity: 75%; } diff --git a/src/components/dialog/DialogViewFile.vue b/src/components/dialog/DialogViewFile.vue index db574376..871842bf 100644 --- a/src/components/dialog/DialogViewFile.vue +++ b/src/components/dialog/DialogViewFile.vue @@ -57,13 +57,13 @@ async function downloadImage(url: string | null) {
{ import { watch } from 'vue'; +import TableProductAndService from './table/TableProductAndService.vue'; +import ToggleView from './ToggleView.vue'; +import { ref } from 'vue'; + +const viewMode = ref(false); const search = defineModel('search'); const selectedItem = defineModel('selectedItem', { default: [] }); const props = withDefaults( defineProps<{ - // eslint-disable-next-line @typescript-eslint/no-explicit-any items: any; newItems?: any; color?: string; @@ -15,6 +19,7 @@ const props = withDefaults( noPadding?: boolean; noItemsIcon?: string; noItemsLabel?: string; + type: 'service' | 'product'; }>(), { items: () => [], @@ -35,24 +40,24 @@ watch(search, () => { emit('search', search.value || ''); }); -function select(item?: unknown, all?: boolean) { +function select(item?: any, all?: boolean) { if (all) { - if (props.items.every((item) => selectedItem.value.includes(item))) { - selectedItem.value = selectedItem.value.filter( - (item) => !props.items.includes(item), - ); + if (selectedItem.value.length !== 0) { + selectedItem.value = []; } else { - props.items.forEach((i) => { - const productExists = selectedItem.value.some((item) => item === i); + props.items.forEach((i: any) => { + const productExists = selectedItem.value.find( + (item: any) => item.id === i.id, + ); if (!productExists) { selectedItem.value.push(i); } }); } } else { - if (selectedItem.value.includes(item)) { - const index = selectedItem.value.indexOf(item); - selectedItem.value.splice(index, 1); + const findIdex = selectedItem.value.findIndex((v: any) => v.id === item.id); + if (findIdex !== -1) { + selectedItem.value.splice(findIdex, 1); } else selectedItem.value.push(item); } } @@ -74,78 +79,76 @@ function assignSelect(to: unknown[], from: unknown[]) { @@ -676,10 +698,15 @@ watch(
{{ - $t('general.recordsPage', { - resultcurrentPage: branch?.length, - total: totalBranch, - }) + $q.screen.gt.sm + ? $t('general.recordsPage', { + resultcurrentPage: branch?.length, + total: totalBranch, + }) + : $t('general.ofPage', { + current: branch?.length, + total: totalBranch, + }) }}
@@ -868,7 +895,11 @@ watch( v-model:wage-rate="customerBranchFormData.wageRate" v-model:wage-rate-text="customerBranchFormData.wageRateText" /> -
+
import { ref, watch, onMounted, computed } from 'vue'; import { useI18n } from 'vue-i18n'; -import { useQuasar } from 'quasar'; +import { QSelect, useQuasar } from 'quasar'; import { useRoute, useRouter } from 'vue-router'; import { getUserId, getRole } from 'src/services/keycloak'; import { baseUrl, waitAll } from 'src/stores/utils'; @@ -84,8 +84,8 @@ import { DialogContainer, DialogHeader } from 'components/dialog'; import KebabAction from 'src/components/shared/KebabAction.vue'; import { nextTick } from 'vue'; import FormEmployeeVisa from 'components/03_customer-management/FormEmployeeVisa.vue'; -import { group } from 'node:console'; import PaginationPageSize from 'src/components/PaginationPageSize.vue'; +import { AddButton } from 'components/button'; const { t, locale } = useI18n(); const $q = useQuasar(); @@ -101,6 +101,7 @@ const employeeFormStore = useEmployeeForm(); const optionStore = useOptionStore(); const ocrStore = useOcrStore(); +const refFilter = ref>(); const statusEmployeeCreate = ref(false); const mrz = ref>>(); const tabFieldRequired = ref<{ [key: string]: (keyof CustomerBranchCreate)[] }>( @@ -197,7 +198,7 @@ const customerNameInfo = computed(() => { const currentBtnOpen = ref([]); const employeeStats = ref(0); const gridView = ref(false); -const splitPercent = ref(15); // Customer only +const splitPercent = computed(() => ($q.screen.lt.md ? 0 : 15)); const currentPageCustomer = ref(1); const maxPageCustomer = ref(1); @@ -222,10 +223,12 @@ watch( if (tabName === 'employer') { currentPageCustomer.value = 1; currentBtnOpen.value = []; + listCustomer.value = []; await fetchListCustomer(true); } if (tabName === 'employee') { currentPageEmployee.value = 1; + listEmployee.value = []; await fetchListEmployee({ fetchStats: true }); } @@ -317,7 +320,7 @@ function deleteCustomerById(id: string) { action: async () => { await customerStore.deleteById(id); - await fetchListCustomer(true); + await fetchListCustomer(true, $q.screen.xs); customerFormState.value.dialogModal = false; flowStore.rotate(); }, @@ -366,11 +369,16 @@ async function fetchListOfOptionBranch() { // TODO: Assign (first) branch of the user as register branch of the data } -async function fetchListCustomer(fetchStats = false) { +async function fetchListCustomer(fetchStats = false, mobileFetch?: boolean) { + const total = statsCustomerType.value.PERS + statsCustomerType.value.CORP; + const resultList = await customerStore.fetchList({ includeBranch: true, - page: currentPageCustomer.value, - pageSize: pageSize.value, + page: mobileFetch ? 1 : currentPageCustomer.value, + pageSize: mobileFetch + ? listCustomer.value.length + + (total === listCustomer.value.length ? 1 : 0) + : pageSize.value, status: currentStatus.value === 'All' ? undefined @@ -381,16 +389,18 @@ async function fetchListCustomer(fetchStats = false) { customerType: ( { all: undefined, - customerLegalEntity: 'CORP', - customerNaturalPerson: 'PERS', + customerLegalEntity: CustomerType.Corporate, + customerNaturalPerson: CustomerType.Person, } as const )[customerTypeSelected.value.value], }); if (resultList) { - currentPageCustomer.value = resultList.page; + // currentPageCustomer.value = resultList.page; maxPageCustomer.value = Math.ceil(resultList.total / pageSize.value); - listCustomer.value = resultList.result; + $q.screen.xs && !mobileFetch + ? listCustomer.value.push(...resultList.result) + : (listCustomer.value = resultList.result); } if (fetchStats) { @@ -405,11 +415,21 @@ async function fetchListEmployee(opt?: { page?: number; pageSize?: number; customerId?: string; + mobileFetch?: boolean; }) { const resultListEmployee = await employeeStore.fetchList({ customerId: opt?.customerId, - page: opt && opt.page ? opt.page : currentPageEmployee.value, - pageSize: opt && opt.pageSize ? opt.pageSize : pageSize.value, + page: opt + ? opt.mobileFetch + ? 1 + : opt.page || currentPageEmployee.value + : currentPageEmployee.value, + pageSize: opt + ? opt.mobileFetch + ? listEmployee.value.length + + (employeeStats.value === listEmployee.value.length ? 1 : 0) + : opt.pageSize || pageSize.value + : pageSize.value, status: currentStatus.value === 'All' ? undefined @@ -424,7 +444,9 @@ async function fetchListEmployee(opt?: { maxPageEmployee.value = Math.ceil( resultListEmployee.total / pageSize.value, ); - listEmployee.value = resultListEmployee.result; + $q.screen.xs && !(opt && opt.mobileFetch) + ? listEmployee.value.push(...resultListEmployee.result) + : (listEmployee.value = resultListEmployee.result); } if (opt && opt.fetchStats) @@ -467,7 +489,7 @@ async function toggleStatusEmployee(id: string, status: boolean) { if (res && employeeFormState.value.drawerModal) currentFromDataEmployee.value.status = res.status; - await fetchListEmployee(); + await fetchListEmployee({ mobileFetch: $q.screen.xs }); flowStore.rotate(); } @@ -478,7 +500,7 @@ async function toggleStatusCustomer(id: string, status: boolean) { if (res && customerFormState.value.drawerModal) customerFormData.value.status = res.status; - await fetchListCustomer(); + await fetchListCustomer(false, $q.screen.xs); flowStore.rotate(); } @@ -528,7 +550,7 @@ async function deleteEmployeeById(opts: { pageSize: 999, customerId: customerFormState.value.currentCustomerId, } - : { fetchStats: true }, + : { fetchStats: true, mobileFetch: $q.screen.xs }, ); flowStore.rotate(); @@ -832,8 +854,8 @@ const emptyCreateDialog = ref(false); > {{ currentTab === 'employer' - ? listCustomer?.length - : listEmployee.length + ? statsCustomerType.PERS + statsCustomerType.CORP + : employeeStats }} + -
- +
+ +
+ +
@@ -1087,6 +1149,7 @@ const emptyCreateDialog = ref(false); class="col full-width" before-class="overflow-hidden" after-class="overflow-hidden" + :disable="$q.screen.lt.sm" > @@ -1742,49 +1851,77 @@ const emptyCreateDialog = ref(false);
-
- -
-
+ + + + +
@@ -1801,10 +1938,15 @@ const emptyCreateDialog = ref(false);
{{ - $t('general.recordsPage', { - resultcurrentPage: listEmployee.length, - total: employeeStats, - }) + $q.screen.gt.sm + ? $t('general.recordsPage', { + resultcurrentPage: listEmployee.length, + total: employeeStats, + }) + : $t('general.ofPage', { + current: listEmployee.length, + total: employeeStats, + }) }}
@@ -1820,7 +1962,7 @@ const emptyCreateDialog = ref(false); " />
-
+ -
+
- - -
+
state.search, getWorkerList);
+ + state.search, getWorkerList); >
-
- -
+ +
@@ -399,7 +408,10 @@ watch(() => state.search, getWorkerList);
-
+
state.search, getWorkerList); expand-icon="mdi-chevron-down-circle" header-class="q-py-sm text-medium text-body items-center surface-1" v-for="{ id, amount, worker, product } in productServiceList" + :key="id" >
- - - - - + />
diff --git a/src/pages/05_quotation/QuotationFormWorkerSelect.vue b/src/pages/05_quotation/QuotationFormWorkerSelect.vue index 59904c0f..e03a02f4 100644 --- a/src/pages/05_quotation/QuotationFormWorkerSelect.vue +++ b/src/pages/05_quotation/QuotationFormWorkerSelect.vue @@ -46,6 +46,8 @@ import { columnsAttachment, } from 'src/pages/03_customer-management/constant'; import { storeToRefs } from 'pinia'; +import ToggleView from 'src/components/shared/ToggleView.vue'; +import TableWorker from 'src/components/shared/table/TableWorker.vue'; const API_BASE_URL = import.meta.env.VITE_API_BASE_URL; @@ -55,6 +57,8 @@ const quotationForm = useQuotationForm(); const { locale } = useI18n(); const ocrStore = useOcrStore(); +const viewMode = ref(false); + const { state: employeeFormState, currentFromDataEmployee } = storeToRefs(employeeFormStore); @@ -207,7 +211,7 @@ function getEmployeeImageUrl(item: Employee) { return `${API_BASE_URL}/employee/${item.id}/image/${item.selectedImage}`; } // NOTE: static image - return '/images/employee-avatar.png'; + return `/images/employee-avatar-${item.gender}.png`; } function init() { @@ -329,14 +333,15 @@ watch(() => state.search, getWorkerList);
+ + state.search, getWorkerList); : `${emp.firstName} ${emp.lastName}`, female: emp.gender === 'female', male: emp.gender === 'male', - img: '/images/employee-avatar.png', + img: `/images/employee-avatar-${emp.gender}.png`, index: index, detail: [ { @@ -447,7 +452,7 @@ watch(() => state.search, getWorkerList);
state.search, getWorkerList); >
-
- -
+ +
@@ -567,7 +579,10 @@ watch(() => state.search, getWorkerList); v-model:current-tab="employeeFormState.currentTab" v-model:toggle-status="currentFromDataEmployee.status" fallbackCover="/images/employee-banner.png" - :img="employeeFormState.profileUrl || `/images/employee-avatar.png`" + :img=" + employeeFormState.profileUrl || + `/images/employee-avatar-${currentFromDataEmployee.gender}.png` + " :toggleTitle="$t('status.title')" hideFade @view=" diff --git a/src/pages/05_quotation/TableRequest.vue b/src/pages/05_quotation/TableRequest.vue index 73d25d46..bd15da5b 100644 --- a/src/pages/05_quotation/TableRequest.vue +++ b/src/pages/05_quotation/TableRequest.vue @@ -1,7 +1,5 @@ + + - - + + + + - +
@@ -732,42 +764,32 @@ watch( {{ $t('general.recordPerPage') }}
- - - - - {{ v }} - - - - +
{{ - $t('general.recordsPage', { - resultcurrentPage: data.length, - total: pageState.inputSearch ? data.length : pageState.total, - }) + $q.screen.gt.sm + ? $t('general.recordsPage', { + resultcurrentPage: data.length, + total: pageState.inputSearch + ? data.length + : pageState.total, + }) + : $t('general.ofPage', { + current: data.length, + total: pageState.inputSearch + ? data.length + : pageState.total, + }) }}
@@ -778,7 +800,6 @@ watch( // NOTE: Library -import { computed, onMounted, reactive, watch } from 'vue'; +import { computed, onMounted, reactive, ref, watch } from 'vue'; import { storeToRefs } from 'pinia'; import { useI18n } from 'vue-i18n'; +import { QSelect, useQuasar } from 'quasar'; // NOTE: Components import StatCardComponent from 'src/components/StatCardComponent.vue'; @@ -19,12 +20,15 @@ import { useRequestList } from 'src/stores/request-list'; import { RequestData, RequestDataStatus } from 'src/stores/request-list/types'; import { dialogWarningClose } from 'src/stores/utils'; +const $q = useQuasar(); const navigatorStore = useNavigator(); const flowStore = useFlowStore(); const requestListStore = useRequestList(); const { t } = useI18n(); const { data, stats, page, pageMax, pageSize } = storeToRefs(requestListStore); +const refFilter = ref>(); + // NOTE: Variable const pageState = reactive({ hideStat: false, @@ -54,7 +58,8 @@ async function fetchList(opts?: { rotateFlowId?: boolean }) { }); if (ret) { - data.value = ret.result; + $q.screen.xs ? data.value.push(...ret.result) : (data.value = ret.result); + pageState.total = ret.total; pageMax.value = Math.ceil(ret.total / pageSize.value); } @@ -89,6 +94,7 @@ function triggerView(opts: { requestData: RequestData }) { } onMounted(async () => { + pageState.gridView = $q.screen.lt.md ? true : false; navigatorStore.current.title = 'requestList.title'; navigatorStore.current.path = [{ text: 'requestList.caption', i18n: true }]; @@ -96,9 +102,11 @@ onMounted(async () => { await fetchList({ rotateFlowId: true }); }); -watch([() => pageState.inputSearch, () => pageState.statusFilter], () => - fetchList({ rotateFlowId: true }), -); +watch([() => pageState.inputSearch, () => pageState.statusFilter], () => { + page.value = 1; + data.value = []; + fetchList({ rotateFlowId: true }); +}); -
+