fix: change status dialog

This commit is contained in:
puriphatt 2024-07-25 10:49:43 +00:00
parent 305d1f2e2b
commit f9eeb7f529
4 changed files with 152 additions and 84 deletions

View file

@ -419,8 +419,8 @@ async function triggerChangeStatus(
): Promise<Branch & { qrCodeImageUploadUrl: string; imageUploadUrl: string }> {
return await new Promise((resolve) => {
dialog({
color: 'warning',
icon: 'mdi-alert',
color: status !== 'INACTIVE' ? 'warning' : 'info',
icon: status !== 'INACTIVE' ? 'mdi-alert' : 'mdi-comment-alert',
title: t('confirmChangeStatusTitle'),
actionText:
status !== 'INACTIVE' ? t('switchOffLabel') : t('switchOnLabel'),

View file

@ -493,6 +493,26 @@ async function toggleStatus(id: string) {
if (res) record.status = res.status;
}
async function triggerChangeStatus(id: string, status: string) {
return await new Promise((resolve, reject) => {
dialog({
color: status !== 'INACTIVE' ? 'warning' : 'info',
icon: status !== 'INACTIVE' ? 'mdi-alert' : 'mdi-comment-alert',
title: t('confirmChangeStatusTitle'),
actionText:
status !== 'INACTIVE' ? t('switchOffLabel') : t('switchOnLabel'),
message:
status !== 'INACTIVE'
? t('confirmChangeStatusOffMessage')
: t('confirmChangeStatusOnMessage'),
action: async () => {
await toggleStatus(id).then(resolve).catch(reject);
},
cancel: () => {},
});
});
}
async function assignFormData(idEdit: string) {
if (!userData.value) return;
const foundUser = userData.value.result.find((user) => user.id === idEdit);
@ -1248,7 +1268,10 @@ watch(
"
@click="
async () => {
toggleStatus(props.row.id);
triggerChangeStatus(
props.row.id,
props.row.status,
);
}
"
:model-value="props.row.status !== 'INACTIVE'"
@ -1305,7 +1328,9 @@ watch(
@update-card="(a, b) => openDialog(a, props.row.id, b)"
@delete-card="onDelete(props.row.id)"
@enter-card="(a) => openDialog(a, props.row.id)"
@toggle-status="toggleStatus(props.row.id)"
@toggle-status="
triggerChangeStatus(props.row.id, props.row.status)
"
/>
</div>
</template>

View file

@ -755,6 +755,7 @@ function clearFormEmployee() {
infoDrawerEmployeeEdit.value = false;
formDataEmployeeSameAddr.value = true;
currentEmployeeCode.value = '';
formDataEmployeeTab.value = 'personalInfo';
currentEmployee.value = undefined;
formDataEmployeeOwner.value = undefined;
@ -990,6 +991,35 @@ async function fetchListEmployee() {
}
}
async function triggerChangeStatus(id: string, status: string) {
console.log('asd');
return await new Promise((resolve, reject) => {
dialog({
color: status !== 'INACTIVE' ? 'warning' : 'info',
icon: status !== 'INACTIVE' ? 'mdi-alert' : 'mdi-comment-alert',
title: t('confirmChangeStatusTitle'),
actionText:
status !== 'INACTIVE' ? t('switchOffLabel') : t('switchOnLabel'),
message:
status !== 'INACTIVE'
? t('confirmChangeStatusOffMessage')
: t('confirmChangeStatusOnMessage'),
action: async () => {
if (currentTab.value === 'employee') {
await toggleStatusEmployee(id, status === 'ACTIVE' ? true : false)
.then(resolve)
.catch(reject);
} else {
await toggleStatusCustomer(id, status === 'ACTIVE' ? true : false)
.then(resolve)
.catch(reject);
}
},
cancel: () => {},
});
});
}
async function toggleStatusEmployee(id: string, status: boolean) {
await employeeStore.editById(id, { status: !status ? 'ACTIVE' : 'INACTIVE' });
@ -2219,11 +2249,9 @@ watch(isMainPage, () => {
"
@click="
async () => {
toggleStatusCustomer(
triggerChangeStatus(
props.row.id,
props.row.status === 'ACTIVE'
? true
: false,
props.row.status,
);
}
"
@ -2313,10 +2341,7 @@ watch(isMainPage, () => {
"
@delete-card="deleteCustomerById(props.row.id)"
@toggle-status="
toggleStatusCustomer(
props.row.id,
props.row.status === 'ACTIVE' ? true : false,
)
triggerChangeStatus(props.row.id, props.row.status)
"
/>
</div>
@ -2685,11 +2710,9 @@ watch(isMainPage, () => {
"
@click="
async () => {
toggleStatusEmployee(
triggerChangeStatus(
props.row.id,
props.row.status === 'ACTIVE'
? true
: false,
props.row.status,
);
}
"
@ -2754,10 +2777,7 @@ watch(isMainPage, () => {
"
@delete-card="onDelete(props.row.id)"
@toggle-status="
toggleStatusEmployee(
props.row.id,
props.row.status === 'ACTIVE' ? true : false,
)
triggerChangeStatus(props.row.id, props.row.status)
"
/>
</div>
@ -4019,30 +4039,28 @@ watch(isMainPage, () => {
employee
>
<template #person-card>
<div class="q-ma-md">
<AppBox class="surface-1" style="padding: 0">
<PersonCard
:can-edit-profile="infoDrawerEmployeeEdit"
no-hover
no-action
no-detail
:data="{
name:
formDataEmployee.firstName + ' ' + formDataEmployee.lastName,
code: formDataEmployee.code,
male: formDataEmployee.gender === 'male',
female: formDataEmployee.gender === 'female',
img: profileUrl || undefined,
}"
:list="infoEmployeePersonCard ? infoEmployeePersonCard : []"
:gridColumns="1"
@edit-profile="
() => {
inputFile.click();
}
"
/>
</AppBox>
<div class="q-pa-md full-height" style="overflow: hidden">
<PersonCard
:can-edit-profile="infoDrawerEmployeeEdit"
no-hover
no-action
no-detail
:data="{
name:
formDataEmployee.firstName + ' ' + formDataEmployee.lastName,
code: formDataEmployee.code,
male: formDataEmployee.gender === 'male',
female: formDataEmployee.gender === 'female',
img: profileUrl || undefined,
}"
:list="infoEmployeePersonCard ? infoEmployeePersonCard : []"
:gridColumns="1"
@edit-profile="
() => {
inputFile.click();
}
"
/>
</div>
</template>
<template #information>

View file

@ -695,6 +695,46 @@ async function toggleStatusGroup(id: string, status: Status) {
flowStore.rotate();
}
async function triggerChangeStatus(
id: string,
status: string,
type?: 'type' | 'group' | 'service' | 'product',
) {
return await new Promise((resolve, reject) => {
dialog({
color: status !== 'INACTIVE' ? 'warning' : 'info',
icon: status !== 'INACTIVE' ? 'mdi-alert' : 'mdi-comment-alert',
title: t('confirmChangeStatusTitle'),
actionText:
status !== 'INACTIVE' ? t('switchOffLabel') : t('switchOnLabel'),
message:
status !== 'INACTIVE'
? t('confirmChangeStatusOffMessage')
: t('confirmChangeStatusOnMessage'),
action: async () => {
if (type === 'group' || productMode.value === 'group') {
await toggleStatusGroup(id, status as Status)
.then(resolve)
.catch(reject);
} else if (type === 'type' || productMode.value === 'type') {
await toggleStatusType(id, status as Status)
.then(resolve)
.catch(reject);
} else if (type === 'service' || productMode.value === 'service') {
await toggleStatusService(id, status as Status)
.then(resolve)
.catch(reject);
} else if (type === 'product' || productMode.value === 'product') {
await toggleStatusProduct(id, status as Status)
.then(resolve)
.catch(reject);
}
},
cancel: () => {},
});
});
}
async function deleteServiceById(serviceId?: string) {
dialog({
color: 'negative',
@ -1712,15 +1752,17 @@ watch(
@click.stop="
async () => {
if (node.type === 'type') {
toggleStatusType(
triggerChangeStatus(
node.id,
node.status,
node.type,
);
}
if (node.type === 'group') {
toggleStatusGroup(
triggerChangeStatus(
node.id,
node.status,
node.type,
);
}
}
@ -2175,18 +2217,10 @@ watch(
"
@click="
async () => {
if (productMode === 'type') {
toggleStatusType(
props.row.id,
props.row.status,
);
}
if (productMode === 'group') {
toggleStatusGroup(
props.row.id,
props.row.status,
);
}
triggerChangeStatus(
props.row.id,
props.row.status,
);
}
"
:model-value="
@ -2225,12 +2259,7 @@ watch(
}[productMode] || 'var(--pink-6-hsl)'
"
@toggleStatus="
if (productMode === 'type') {
toggleStatusType(props.row.id, props.row.status);
}
if (productMode === 'group') {
toggleStatusGroup(props.row.id, props.row.status);
}
triggerChangeStatus(props.row.id, props.row.status)
"
@viewCard="
() => {
@ -3000,18 +3029,11 @@ watch(
"
@click="
() => {
if (props.row.type === 'product') {
toggleStatusProduct(
props.row.id,
props.row.status,
);
}
if (props.row.type === 'service') {
toggleStatusService(
props.row.id,
props.row.status,
);
}
triggerChangeStatus(
props.row.id,
props.row.status,
props.row.type,
);
}
"
:model-value="
@ -3038,12 +3060,7 @@ watch(
:isDisabled="row.status === 'INACTIVE' ? true : false"
@toggleStatus="
() => {
if (row.type === 'product') {
toggleStatusProduct(row.id, row.status);
}
if (row.type === 'service') {
toggleStatusService(row.id, row.status);
}
triggerChangeStatus(row.id, row.status, row.type);
}
"
@menuViewDetail="
@ -3890,13 +3907,21 @@ watch(
async () => {
if (!currentNode) return;
if (currentNode.type === 'type') {
toggleStatusType(currentNode.id, currentNode.status);
triggerChangeStatus(
currentNode.id,
currentNode.status,
currentNode.type,
);
currentNode.status === 'ACTIVE'
? (currentNode.status = 'INACTIVE')
: (currentNode.status = 'ACTIVE');
}
if (currentNode.type === 'group') {
toggleStatusGroup(currentNode.id, currentNode.status);
triggerChangeStatus(
currentNode.id,
currentNode.status,
currentNode.type,
);
currentNode.status === 'ACTIVE'
? (currentNode.status = 'INACTIVE')
: (currentNode.status = 'ACTIVE');