refactor: api select value (#69)
* feat: add file * fix: wrong type * feat: select customer component * fixup! feat: select customer component * fix: char case * refactor: fn alias * chore: add space * feat: accept fetch parameter * refactor: naming * feat: add emit event create * fix: add suffix to add text * feat: add before options slot for select input comp * fix: error when label not found * fix: value type * feat: add required param * fix: wording * refactor: fix customer * feat: use new select component * chore: add note * feat: add decoration for select with creatable * feat: emit event * feat: close popup on click * feat: adjust alignment * feat: add readonly params * feat: add select branch option * feat: use new select component * feat: add disabled params * feat: adjust internal search and select * refactor: props type * feat: use new select component * feat: add lib for select component * refactor: use factory function instead * refactor: merge two lines of code * refactor: move watch inside * refactor: fix value not in list check * chore: cleanup * fix: remove test page size * chore: remove unused * feat: use new select component * fix: typo * fix: error * refactor: extract type * refactor: change ref var to normal var * refactor: force overwrite params to prevent error on render * feat: add clearable parameter * feat: make clearable
This commit is contained in:
parent
a227744131
commit
d414685fe7
13 changed files with 500 additions and 319 deletions
|
|
@ -2,7 +2,6 @@
|
|||
import { ref, watch, reactive } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { onMounted } from 'vue';
|
||||
import { getUserId, getRole } from 'src/services/keycloak';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useQuasar, type QTableProps } from 'quasar';
|
||||
|
||||
|
|
@ -38,15 +37,10 @@ import {
|
|||
} from 'components/button';
|
||||
|
||||
import useFlowStore from 'stores/flow';
|
||||
import useMyBranchStore from 'stores/my-branch';
|
||||
|
||||
import { dateFormat } from 'src/utils/datetime';
|
||||
import { formatNumberDecimal, isRoleInclude } from 'stores/utils';
|
||||
|
||||
const userBranchStore = useMyBranchStore();
|
||||
|
||||
const { currentMyBranch } = storeToRefs(userBranchStore);
|
||||
|
||||
import { Status } from 'stores/types';
|
||||
|
||||
import { dialog, dialogWarningClose } from 'stores/utils';
|
||||
|
|
@ -98,7 +92,6 @@ const {
|
|||
} = productServiceStore;
|
||||
|
||||
const { workNameItems, splitPay } = storeToRefs(productServiceStore);
|
||||
const readOnlybranchOption = ref<boolean>(false);
|
||||
const allStat = ref<{ mode: string; count: number }[]>([]);
|
||||
const stat = ref<
|
||||
{
|
||||
|
|
@ -500,13 +493,11 @@ const currentIdGroup = ref<string>('');
|
|||
const currentIdType = ref<string>('');
|
||||
const currentIdService = ref<string>('');
|
||||
const currentIdProduct = ref<string>('');
|
||||
const currentIdGropTree = ref<string>('');
|
||||
const currentIdGroupTree = ref<string>('');
|
||||
|
||||
const currentStatusGroupType = ref<Status>('CREATED');
|
||||
const currentIdGroupType = ref('');
|
||||
|
||||
const branchOption = ref<{ id: string; name: string }[]>([]);
|
||||
|
||||
const currentStatus = ref<Status | 'All'>('All');
|
||||
|
||||
// img
|
||||
|
|
@ -559,23 +550,6 @@ function selectAllProduct(list: Product[]) {
|
|||
});
|
||||
}
|
||||
|
||||
async function fetchListOfOptionBranch() {
|
||||
const uid = getUserId();
|
||||
const role = getRole();
|
||||
|
||||
if (!uid) return;
|
||||
|
||||
if (role?.includes('system')) {
|
||||
const result = await userBranchStore.fetchListOptionBranch();
|
||||
if (result && result.total > 0) branchOption.value = result.result;
|
||||
} else {
|
||||
const result = await userBranchStore.fetchListMyBranch(uid);
|
||||
if (result && result.total > 0) branchOption.value = result.result;
|
||||
}
|
||||
|
||||
formDataGroup.value.registeredBranchId = currentMyBranch.value?.id || '';
|
||||
}
|
||||
|
||||
async function fetchListGroups() {
|
||||
const res = await fetchProductGroup({
|
||||
page: currentPageGroup.value,
|
||||
|
|
@ -863,7 +837,6 @@ function undoProductGroup() {
|
|||
registeredBranchId: previousValue.value.registeredBranchId,
|
||||
};
|
||||
isEdit.value = false;
|
||||
readOnlybranchOption.value = false;
|
||||
flowStore.rotate();
|
||||
}
|
||||
|
||||
|
|
@ -871,7 +844,6 @@ async function assignFormDataGroup(data: ProductGroup) {
|
|||
previousValue.value = data;
|
||||
currentStatusGroupType.value = data.status;
|
||||
currentIdGroupType.value = data.id;
|
||||
await fetchListOfOptionBranch();
|
||||
|
||||
formDataGroup.value = {
|
||||
remark: data.remark,
|
||||
|
|
@ -881,22 +853,6 @@ async function assignFormDataGroup(data: ProductGroup) {
|
|||
shared: data.shared,
|
||||
registeredBranchId: data.registeredBranchId,
|
||||
};
|
||||
|
||||
const tempValue = branchOption.value.find(
|
||||
(v) => v.id === data.registeredBranchId,
|
||||
);
|
||||
|
||||
if (tempValue !== undefined) {
|
||||
readOnlybranchOption.value = false;
|
||||
} else {
|
||||
readOnlybranchOption.value = true;
|
||||
branchOption.value = [
|
||||
{
|
||||
id: data.registeredBranch.id,
|
||||
name: data.registeredBranch.name,
|
||||
},
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
const prevService = ref<ServiceCreate>({
|
||||
|
|
@ -1195,8 +1151,8 @@ async function submitProduct(notClose = false) {
|
|||
|
||||
async function submitGroup() {
|
||||
if (drawerInfo.value) {
|
||||
if (currentIdGropTree.value)
|
||||
await editProductGroup(currentIdGropTree.value, formDataGroup.value);
|
||||
if (currentIdGroupTree.value)
|
||||
await editProductGroup(currentIdGroupTree.value, formDataGroup.value);
|
||||
else await editProductGroup(currentIdGroup.value, formDataGroup.value);
|
||||
} else {
|
||||
const res = await createProductGroup(formDataGroup.value);
|
||||
|
|
@ -1207,7 +1163,7 @@ async function submitGroup() {
|
|||
}
|
||||
}
|
||||
|
||||
currentIdGropTree.value = '';
|
||||
currentIdGroupTree.value = '';
|
||||
drawerInfo.value = false;
|
||||
await fetchListGroups();
|
||||
clearFormGroup();
|
||||
|
|
@ -1619,20 +1575,17 @@ watch(
|
|||
async () => {
|
||||
if (productMode === 'group') {
|
||||
clearFormGroup();
|
||||
await fetchListOfOptionBranch();
|
||||
dialogInputForm = true;
|
||||
}
|
||||
if (productMode === 'product') {
|
||||
productTab = 1;
|
||||
clearFormProduct();
|
||||
await fetchListOfOptionBranch();
|
||||
dialogProduct = true;
|
||||
}
|
||||
if (productMode === 'service') {
|
||||
serviceTab = 1;
|
||||
clearFormGroup();
|
||||
clearFormService();
|
||||
await fetchListOfOptionBranch();
|
||||
serviceTab = 1;
|
||||
dialogService = true;
|
||||
}
|
||||
|
|
@ -1780,7 +1733,7 @@ watch(
|
|||
clearFormGroup();
|
||||
await assignFormDataGroup(v);
|
||||
isEdit = false;
|
||||
currentIdGropTree = v.id;
|
||||
currentIdGroupTree = v.id;
|
||||
drawerInfo = true;
|
||||
}
|
||||
}
|
||||
|
|
@ -1792,7 +1745,7 @@ watch(
|
|||
clearFormGroup();
|
||||
await assignFormDataGroup(v);
|
||||
isEdit = true;
|
||||
currentIdGropTree = v.id;
|
||||
currentIdGroupTree = v.id;
|
||||
drawerInfo = true;
|
||||
}
|
||||
}
|
||||
|
|
@ -2803,7 +2756,6 @@ watch(
|
|||
flat
|
||||
@click.stop="
|
||||
async () => {
|
||||
await fetchListOfOptionBranch();
|
||||
if (props.row.type === 'product') {
|
||||
currentIdProduct = props.row.id;
|
||||
assignFormDataProduct(props.row);
|
||||
|
|
@ -2823,7 +2775,6 @@ watch(
|
|||
:id-name="props.row.name"
|
||||
@view="
|
||||
async () => {
|
||||
await fetchListOfOptionBranch();
|
||||
if (props.row.type === 'product') {
|
||||
currentIdProduct = props.row.id;
|
||||
assignFormDataProduct(props.row);
|
||||
|
|
@ -2839,7 +2790,6 @@ watch(
|
|||
"
|
||||
@edit="
|
||||
async () => {
|
||||
await fetchListOfOptionBranch();
|
||||
if (props.row.type === 'product') {
|
||||
currentIdProduct = props.row.id;
|
||||
infoProductEdit = true;
|
||||
|
|
@ -2896,7 +2846,6 @@ watch(
|
|||
"
|
||||
@menu-view-detail="
|
||||
async () => {
|
||||
await fetchListOfOptionBranch();
|
||||
if (row.type === 'product') {
|
||||
currentIdProduct = row.id;
|
||||
assignFormDataProduct(row);
|
||||
|
|
@ -2912,7 +2861,6 @@ watch(
|
|||
"
|
||||
@menu-edit="
|
||||
async () => {
|
||||
await fetchListOfOptionBranch();
|
||||
if (row.type === 'product') {
|
||||
currentIdProduct = row.id;
|
||||
infoProductEdit = true;
|
||||
|
|
@ -3125,7 +3073,6 @@ watch(
|
|||
<BasicInformation
|
||||
ide="form-group"
|
||||
dense
|
||||
v-model:options-branch="branchOption"
|
||||
v-model:remark="formDataGroup.remark"
|
||||
v-model:name="formDataGroup.name"
|
||||
v-model:detail="formDataGroup.detail"
|
||||
|
|
@ -3305,8 +3252,7 @@ watch(
|
|||
id="info-group"
|
||||
dense
|
||||
:readonly="!isEdit"
|
||||
:read-onlybranch-option="!readOnlybranchOption"
|
||||
v-model:options-branch="branchOption"
|
||||
branch-readonly
|
||||
v-model:registered-branch-id="formDataGroup.registeredBranchId"
|
||||
v-model:remark="formDataGroup.remark"
|
||||
v-model:name="formDataGroup.name"
|
||||
|
|
@ -4432,6 +4378,7 @@ watch(
|
|||
'q-py-sm q-px-lg': !$q.screen.gt.sm,
|
||||
}"
|
||||
style="height: 100%; max-height: 100%; overflow-y: auto"
|
||||
v-if="dialogServiceEdit"
|
||||
>
|
||||
<BasicInformation
|
||||
v-if="serviceTab === 1"
|
||||
|
|
|
|||
|
|
@ -837,7 +837,7 @@ watch(
|
|||
</q-item>
|
||||
</template>
|
||||
|
||||
<template #selectedItem="{ scope }">
|
||||
<template #selected-item="{ scope }">
|
||||
<q-item-section v-if="scope.opt">
|
||||
{{ scope.opt.name }}
|
||||
<span class="app-text-muted text-caption">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue