imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply repository-wide ESLint auto-fix formatting pass

Browse Source 
Co-Authored-By: Codex <codex@openai.com>
This commit is contained in:
依瑪貓
2026-03-08 12:11:57 +08:00
parent 7c48faaa3d
commit 847904c49b
172 changed files with 13629 additions and 9154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

425
src/module/alertModal.js
View File

@@ -6,24 +6,27 @@
// cindy.chang@dsp.im (Cindy Chang), 2024/5/30
/** @module alertModal SweetAlert2 modal dialogs for user interactions. */
import Swal from 'sweetalert2';
import { useAllMapDataStore } from '@/stores/allMapData';
import { useConformanceStore } from '@/stores/conformance';
import { useFilesStore } from '@/stores/files';
import { usePageAdminStore } from '@/stores/pageAdmin';
import { useModalStore } from '@/stores/modal';
import { escapeHtml } from '@/utils/escapeHtml.js';
import Swal from "sweetalert2";
import { useAllMapDataStore } from "@/stores/allMapData";
import { useConformanceStore } from "@/stores/conformance";
import { useFilesStore } from "@/stores/files";
import { usePageAdminStore } from "@/stores/pageAdmin";
import { useModalStore } from "@/stores/modal";
import { escapeHtml } from "@/utils/escapeHtml.js";
const customClass = {
container: '!z-[99999]',
popup: '!w-[564px]',
title: '!text-xl !font-semibold !mb-2',
htmlContainer: '!text-sm !font-normal !h-full !mb-4 !leading-5',
inputLabel: '!text-sm !font-normal',
input: '!h-8 !text-sm !font-normal !shadow-inner !shadow-black !border-neutral-200',
validationMessage: '!bg-neutral-10 !text-danger',
confirmButton: '!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px]',
cancelButton: '!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px] ',
container: "!z-[99999]",
popup: "!w-[564px]",
title: "!text-xl !font-semibold !mb-2",
htmlContainer: "!text-sm !font-normal !h-full !mb-4 !leading-5",
inputLabel: "!text-sm !font-normal",
input:
"!h-8 !text-sm !font-normal !shadow-inner !shadow-black !border-neutral-200",
validationMessage: "!bg-neutral-10 !text-danger",
confirmButton:
"!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px]",
cancelButton:
"!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px] ",
};
/**
* Shows a modal dialog to save a new filter with a user-provided name.
@@ -33,47 +36,51 @@ const customClass = {
* @returns {Promise<boolean>} True if the filter was saved, false otherwise.
*/
export async function saveFilter(addFilterId, next = null) {
let fileName = '';
let fileName = "";
const pageAdminStore = usePageAdminStore();
const { value, isConfirmed } = await Swal.fire({
title: 'SAVE NEW FILTER',
input: 'text',
inputPlaceholder: 'Enter Filter Name.',
title: "SAVE NEW FILTER",
input: "text",
inputPlaceholder: "Enter Filter Name.",
inputValue: fileName,
inputAttributes: {
'maxlength': 200,
maxlength: 200,
},
inputValidator: (value) => {
if (!value) return 'You need to write something!';
if (!value) return "You need to write something!";
fileName = value;
},
icon: 'info',
iconHtml: '<span class="material-symbols-outlined !text-[58px]">cloud_upload</span>',
iconColor: '#0099FF',
reverseButtons:true,
confirmButtonColor: '#0099FF',
icon: "info",
iconHtml:
'<span class="material-symbols-outlined !text-[58px]">cloud_upload</span>',
iconColor: "#0099FF",
reverseButtons: true,
confirmButtonColor: "#0099FF",
showCancelButton: true,
cancelButtonColor: '#94a3b8',
cancelButtonColor: "#94a3b8",
customClass: customClass,
});
// Determine whether to redirect based on the return value
if(isConfirmed) { // Save succeeded
if (isConfirmed) {
// Save succeeded
await addFilterId(fileName);
// Show save complete notification
if (value) { // Example of value: yes
if (value) {
// Example of value: yes
savedSuccessfully(value);
}
// Clear the input field
fileName = '';
fileName = "";
return true;
} else { // Clicked cancel or outside the dialog; save failed.
} else {
// Clicked cancel or outside the dialog; save failed.
pageAdminStore.keepPreviousPage();
// Not every time we have nontrivial next value
if (next !== null) {
next(false);
}
}
return false;
}
}
@@ -84,17 +91,17 @@ export async function saveFilter(addFilterId, next = null) {
* @returns {Promise<void>}
*/
export async function savedSuccessfully(value) {
value = value || '';
value = value || "";
await Swal.fire({
title: 'SAVE COMPLETE',
title: "SAVE COMPLETE",
html: `<span class="text-primary">${escapeHtml(value)}</span> has been saved in Lucia.`,
timer: 3000, // Auto-close after 3 seconds
showConfirmButton: false,
icon: 'success',
iconColor: '#0099FF',
customClass: customClass
})
};
icon: "success",
iconColor: "#0099FF",
customClass: customClass,
});
}
/**
* Prompts the user to save unsaved filter changes before leaving the
* Map page. Handles confirm (save), cancel (discard), and backdrop
@@ -112,23 +119,23 @@ export async function leaveFilter(next, addFilterId, toPath, logOut) {
const pageAdminStore = usePageAdminStore();
const result = await Swal.fire({
title: 'SAVE YOUR FILTER?',
html: 'If you want to continue using this filter in any other page, please select [Yes].',
icon: 'warning',
iconColor: '#FF3366',
reverseButtons:true,
confirmButtonText: 'Yes',
confirmButtonColor: '#FF3366',
title: "SAVE YOUR FILTER?",
html: "If you want to continue using this filter in any other page, please select [Yes].",
icon: "warning",
iconColor: "#FF3366",
reverseButtons: true,
confirmButtonText: "Yes",
confirmButtonColor: "#FF3366",
showCancelButton: true,
cancelButtonText: 'No',
cancelButtonColor: '#94a3b8',
cancelButtonText: "No",
cancelButtonColor: "#94a3b8",
customClass: customClass,
});
if(result.isConfirmed) {
if(allMapDataStore.createFilterId) {
if (result.isConfirmed) {
if (allMapDataStore.createFilterId) {
await allMapDataStore.updateFilter();
if(allMapDataStore.isUpdateFilter) {
if (allMapDataStore.isUpdateFilter) {
await savedSuccessfully(allMapDataStore.filterName);
}
} else {
@@ -137,7 +144,7 @@ export async function leaveFilter(next, addFilterId, toPath, logOut) {
}
logOut ? logOut() : next(toPath);
} else if(result.dismiss === 'cancel') {
} else if (result.dismiss === "cancel") {
// console.log('popup cancel case', );
// Handle page admin issue
// console.log("usePageAdminStore.activePage", usePageAdminStore.activePage);
@@ -145,18 +152,17 @@ export async function leaveFilter(next, addFilterId, toPath, logOut) {
allMapDataStore.tempFilterId = null;
logOut ? logOut() : next(toPath);
} else if(result.dismiss === 'backdrop') {
} else if (result.dismiss === "backdrop") {
// console.log('popup backdrop case', );
// Handle page admin issue
// console.log("usePageAdminStore.activePage", usePageAdminStore.activePage);
pageAdminStore.keepPreviousPage();
if(!logOut){
if (!logOut) {
next(false);
};
}
}
};
}
/**
* Shows a modal dialog to save a new conformance rule with a
* user-provided name.
@@ -166,37 +172,40 @@ export async function leaveFilter(next, addFilterId, toPath, logOut) {
* @returns {Promise<boolean>} True if the rule was saved, false otherwise.
*/
export async function saveConformance(addConformanceCreateCheckId) {
let fileName = '';
let fileName = "";
const { value, isConfirmed } = await Swal.fire({
title: 'SAVE NEW RULE',
input: 'text',
inputPlaceholder: 'Enter Rule Name.',
title: "SAVE NEW RULE",
input: "text",
inputPlaceholder: "Enter Rule Name.",
inputValue: fileName,
inputAttributes: {
'maxlength': 200,
maxlength: 200,
},
inputValidator: (value) => {
if (!value) return 'You need to write something!';
if (!value) return "You need to write something!";
fileName = value;
},
icon: 'info',
iconHtml: '<span class="material-symbols-outlined !text-[58px]">cloud_upload</span>',
iconColor: '#0099FF',
reverseButtons:true,
confirmButtonColor: '#0099FF',
icon: "info",
iconHtml:
'<span class="material-symbols-outlined !text-[58px]">cloud_upload</span>',
iconColor: "#0099FF",
reverseButtons: true,
confirmButtonColor: "#0099FF",
showCancelButton: true,
cancelButtonColor: '#94a3b8',
cancelButtonColor: "#94a3b8",
customClass: customClass,
});
// Determine whether to redirect based on the return value
if(isConfirmed) { // Save succeeded
if (isConfirmed) {
// Save succeeded
await addConformanceCreateCheckId(fileName);
// Show save complete notification
if (value) savedSuccessfully(value);
// Clear the input field
fileName = '';
fileName = "";
return true;
} else { // Clicked cancel or outside the dialog; save failed.
} else {
// Clicked cancel or outside the dialog; save failed.
return false;
}
}
@@ -212,10 +221,15 @@ export async function saveConformance(addConformanceCreateCheckId) {
* @param {Function} [logOut] - Optional logout function.
* @returns {Promise<void>}
*/
export async function leaveConformance(next, addConformanceCreateCheckId, toPath, logOut) {
export async function leaveConformance(
next,
addConformanceCreateCheckId,
toPath,
logOut,
) {
const conformanceStore = useConformanceStore();
const result = await showConfirmationDialog();
if (result.isConfirmed) {
await handleConfirmed(conformanceStore, addConformanceCreateCheckId);
} else {
@@ -228,16 +242,16 @@ export async function leaveConformance(next, addConformanceCreateCheckId, toPath
*/
async function showConfirmationDialog() {
return Swal.fire({
title: 'SAVE YOUR RULE?',
icon: 'warning',
iconColor: '#FF3366',
title: "SAVE YOUR RULE?",
icon: "warning",
iconColor: "#FF3366",
reverseButtons: true,
confirmButtonText: 'Yes',
confirmButtonColor: '#FF3366',
confirmButtonText: "Yes",
confirmButtonColor: "#FF3366",
showCancelButton: true,
cancelButtonText: 'No',
cancelButtonColor: '#94a3b8',
customClass: customClass
cancelButtonText: "No",
cancelButtonColor: "#94a3b8",
customClass: customClass,
});
}
@@ -248,7 +262,10 @@ async function showConfirmationDialog() {
* @returns {Promise<void>}
*/
async function handleConfirmed(conformanceStore, addConformanceCreateCheckId) {
if (conformanceStore.conformanceFilterCreateCheckId || conformanceStore.conformanceLogCreateCheckId) {
if (
conformanceStore.conformanceFilterCreateCheckId ||
conformanceStore.conformanceLogCreateCheckId
) {
await conformanceStore.updateConformance();
if (conformanceStore.isUpdateConformance) {
await savedSuccessfully(conformanceStore.conformanceFileName);
@@ -267,13 +284,19 @@ async function handleConfirmed(conformanceStore, addConformanceCreateCheckId) {
* @param {Function} [logOut] - Optional logout function.
* @returns {Promise<void>}
*/
async function handleDismiss(dismissType, conformanceStore, next, toPath, logOut) {
async function handleDismiss(
dismissType,
conformanceStore,
next,
toPath,
logOut,
) {
switch (dismissType) {
case 'cancel':
case "cancel":
resetTempCheckId(conformanceStore);
logOut ? logOut() : next(toPath);
break;
case 'backdrop':
case "backdrop":
if (!logOut) {
next(false);
}
@@ -304,38 +327,38 @@ function resetTempCheckId(conformanceStore) {
export async function uploadFailedFirst(failureType, failureMsg, failureLoc) {
// msg: 'not in UTF-8' | 'insufficient columns' | 'the csv file is empty' | 'the filename does not ends with .csv' | 'not a CSV file'
// type: 'encoding' | 'insufficient_columns' | 'empty' | 'name_suffix' | mime_type
let value = '';
let value = "";
switch (failureType) {
case 'size':
value = 'File size exceeds 90MB.';
case "size":
value = "File size exceeds 90MB.";
break;
case 'encoding':
case "encoding":
value = `Please use UTF-8 for character encoding: (Row #${failureLoc})`;
break;
case 'insufficient_columns':
value = 'Need at least five columns of data.';
case "insufficient_columns":
value = "Need at least five columns of data.";
break;
case 'empty':
value = 'Need at least one record of data.';
case "empty":
value = "Need at least one record of data.";
break;
case 'name_suffix':
case 'mime_type':
value = 'File is not in csv format.';
case "name_suffix":
case "mime_type":
value = "File is not in csv format.";
break;
default:
value = escapeHtml(failureMsg);
break;
}
await Swal.fire({
title: 'IMPORT FAILED',
title: "IMPORT FAILED",
html: value,
timer: 3000, // Auto-close after 3 seconds
showConfirmButton: false,
icon: 'error',
iconColor: '#FF3366',
customClass: customClass
})
};
icon: "error",
iconColor: "#FF3366",
customClass: customClass,
});
}
/**
* Shows an error modal for the second stage of upload validation failure,
* listing individual row-level errors.
@@ -345,73 +368,73 @@ export async function uploadFailedFirst(failureType, failureMsg, failureLoc) {
* @returns {Promise<void>}
*/
export async function uploadFailedSecond(detail) {
let srt = '';
let manySrt = '';
let srt = "";
let manySrt = "";
detail.forEach(i => {
let content = '';
let key = '';
detail.forEach((i) => {
let content = "";
let key = "";
switch (i.type) {
case 'too_many':
manySrt = 'There are more errors.';
case "too_many":
manySrt = "There are more errors.";
break;
case 'unrecognized':
case "unrecognized":
content = `<li>Data unrecognizable in Status Column: (Row #${i.loc[1]}, "${escapeHtml(i.input)}")</li>`;
break;
case 'malformed':
case "malformed":
content = `<li>Data malformed in Timestamp Column: (Row #${i.loc[1]}, "${escapeHtml(i.input)}")</li>`;
break;
case 'missing':
case "missing":
switch (i.loc[2]) {
case 'case id':
key = 'Case ID';
case "case id":
key = "Case ID";
break;
case 'timestamp':
key = 'Timestamp';
case "timestamp":
key = "Timestamp";
break;
case 'name':
key = 'Activity';
case "name":
key = "Activity";
break;
case 'instance':
key = 'Activity Instance ID';
case "instance":
key = "Activity Instance ID";
break;
case 'status':
key = 'Status';
case "status":
key = "Status";
break;
default:
key = i.loc[2];
break;
}
content = `<li>Data missing in ${key} Column: (Row #${i.loc[1]})</li>`;
break;
break;
}
srt += content;
});
await Swal.fire({
title: 'IMPORT FAILED',
title: "IMPORT FAILED",
html: `<div class="text-left mx-3 space-y-1"><p>Error(s) detected:</p><ul class="list-disc ml-6">${srt}</ul><p>${manySrt} Please check.</p></div>`,
timer: 3000, // Auto-close after 3 seconds
showConfirmButton: false,
icon: 'error',
iconColor: '#FF3366',
customClass: customClass
icon: "error",
iconColor: "#FF3366",
customClass: customClass,
});
srt = '';
};
srt = "";
}
/**
* Shows a timed success notification after a file upload completes.
* @returns {Promise<void>}
*/
export async function uploadSuccess() {
await Swal.fire({
title: 'IMPORT COMPLETED',
title: "IMPORT COMPLETED",
timer: 3000, // Auto-close after 3 seconds
showConfirmButton: false,
icon: 'success',
iconColor: '#0099FF',
customClass: customClass
})
};
icon: "success",
iconColor: "#0099FF",
customClass: customClass,
});
}
/**
* Shows a confirmation dialog before uploading a file. Proceeds with
* the upload only if the user confirms.
@@ -422,23 +445,23 @@ export async function uploadSuccess() {
export async function uploadConfirm(fetchData) {
const filesStore = useFilesStore();
const result = await Swal.fire({
title: 'ARE YOU SURE?',
html: 'After importing, you won’t be able to modify labels.',
icon: 'warning',
iconColor: '#FF3366',
reverseButtons:true,
confirmButtonText: 'Yes',
confirmButtonColor: '#FF3366',
title: "ARE YOU SURE?",
html: "After importing, you won’t be able to modify labels.",
icon: "warning",
iconColor: "#FF3366",
reverseButtons: true,
confirmButtonText: "Yes",
confirmButtonColor: "#FF3366",
showCancelButton: true,
cancelButtonText: 'No',
cancelButtonColor: '#94a3b8',
cancelButtonText: "No",
cancelButtonColor: "#94a3b8",
customClass: customClass,
});
if(result.isConfirmed) {
if (result.isConfirmed) {
filesStore.uploadLog(fetchData);
}
};
}
/**
* Shows a non-dismissable loading spinner during file upload.
* @returns {Promise<void>}
@@ -449,8 +472,8 @@ export async function uploadloader() {
showConfirmButton: false,
allowOutsideClick: false,
customClass: customClass,
})
};
});
}
/**
* Shows a modal dialog for renaming a file.
*
@@ -463,39 +486,40 @@ export async function uploadloader() {
export async function renameModal(rename, type, id, baseName) {
const fileName = baseName;
const { value, isConfirmed } = await Swal.fire({
title: 'RENAME',
input: 'text',
inputPlaceholder: 'Enter File Name.',
title: "RENAME",
input: "text",
inputPlaceholder: "Enter File Name.",
inputValue: fileName,
inputAttributes: {
'maxlength': 200,
maxlength: 200,
},
icon: 'info',
iconHtml: '<span class="material-symbols-outlined !text-[58px]">edit_square</span>',
iconColor: '#0099FF',
icon: "info",
iconHtml:
'<span class="material-symbols-outlined !text-[58px]">edit_square</span>',
iconColor: "#0099FF",
reverseButtons: true,
confirmButtonColor: '#0099FF',
confirmButtonColor: "#0099FF",
showCancelButton: true,
cancelButtonColor: '#94a3b8',
cancelButtonColor: "#94a3b8",
customClass: customClass,
didOpen: () => {
const confirmButton = Swal.getConfirmButton();
const inputField = Swal.getInput();
inputField.addEventListener('input', function() {
inputField.addEventListener("input", function () {
if (!inputField.value.trim()) {
confirmButton.classList.add('disable-hover');
confirmButton.classList.add("disable-hover");
confirmButton.disabled = true;
} else {
confirmButton.classList.remove('disable-hover');
confirmButton.classList.remove("disable-hover");
confirmButton.disabled = false;
}
});
}
},
});
// Rename succeeded
if(isConfirmed) await rename(type, id, value);
if (isConfirmed) await rename(type, id, value);
// Clear the field: fileName = ''
}
/**
@@ -511,46 +535,50 @@ export async function deleteFileModal(files, type, id, name) {
const filesStore = useFilesStore();
const safeName = escapeHtml(name);
const htmlText = files.length === 0 ? `Do you really want to delete <span class="text-primary">${safeName}</span>?` : `<div class="text-left mx-4 space-y-1"><p class="mb-2">Do you really want to delete <span class="text-primary">${safeName}</span>?</p><p>The following dependent file(s) will also be deleted:</p><ul class="list-disc ml-6">${files}</ul></div>`;
const htmlText =
files.length === 0
? `Do you really want to delete <span class="text-primary">${safeName}</span>?`
: `<div class="text-left mx-4 space-y-1"><p class="mb-2">Do you really want to delete <span class="text-primary">${safeName}</span>?</p><p>The following dependent file(s) will also be deleted:</p><ul class="list-disc ml-6">${files}</ul></div>`;
const deleteCustomClass = { ...customClass };
deleteCustomClass.confirmButton = '!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px] !text-danger !bg-neutral-10 !border !border-danger';
deleteCustomClass.confirmButton =
"!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px] !text-danger !bg-neutral-10 !border !border-danger";
const result = await Swal.fire({
title: 'CONFIRM DELETION',
title: "CONFIRM DELETION",
html: htmlText,
icon: 'warning',
iconColor: '#FF3366',
reverseButtons:true,
confirmButtonColor: '#ffffff',
icon: "warning",
iconColor: "#FF3366",
reverseButtons: true,
confirmButtonColor: "#ffffff",
showCancelButton: true,
cancelButtonColor: '#FF3366',
cancelButtonColor: "#FF3366",
customClass: deleteCustomClass,
didOpen: () => {
const confirmButton = Swal.getConfirmButton();
confirmButton.style.border = '1px solid #FF3366';
}
confirmButton.style.border = "1px solid #FF3366";
},
});
if(result.isConfirmed) {
if (result.isConfirmed) {
filesStore.deleteFile(type, id);
}
};
}
/**
* Shows a timed success notification after file deletion.
* @returns {Promise<void>}
*/
export async function deleteSuccess() {
await Swal.fire({
title: 'FILE(S) DELETED',
title: "FILE(S) DELETED",
timer: 3000, // Auto-close after 3 seconds
showConfirmButton: false,
icon: 'success',
iconColor: '#0099FF',
customClass: customClass
})
};
icon: "success",
iconColor: "#0099FF",
customClass: customClass,
});
}
/**
* Shows an informational modal about files deleted by other users,
* then records the deletions and refreshes the file list.
@@ -565,22 +593,25 @@ export async function reallyDeleteInformation(files, reallyDeleteData) {
const deleteCustomClass = { ...customClass };
const htmlText = `<div class="text-left mx-4 space-y-1"><p>The following file(s) have been deleted by other user(s):</p><ul class="list-disc ml-6">${files}</ul></div>`;
deleteCustomClass.confirmButton = '!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px] !text-primary !bg-neutral-10 !border !border-primary';
deleteCustomClass.confirmButton =
"!inline-block !rounded-full !text-sm !font-medium !text-center !align-middle !transition-colors !duration-300 !px-5 !py-2 !w-[100px] !h-[40px] !text-primary !bg-neutral-10 !border !border-primary";
deleteCustomClass.cancelButton = null;
await Swal.fire({
title: 'FILE(S) DELETED BY OTHER USER(S)',
title: "FILE(S) DELETED BY OTHER USER(S)",
html: htmlText,
icon: 'info',
iconColor: '#0099FF',
icon: "info",
iconColor: "#0099FF",
customClass: deleteCustomClass,
confirmButtonColor: '#ffffff',
confirmButtonColor: "#ffffff",
didOpen: () => {
const confirmButton = Swal.getConfirmButton();
confirmButton.style.border = '1px solid #0099FF';
}
confirmButton.style.border = "1px solid #0099FF";
},
});
await Promise.all(reallyDeleteData.map(file => filesStore.deletionRecord(file.id)));
await Promise.all(
reallyDeleteData.map((file) => filesStore.deletionRecord(file.id)),
);
await filesStore.fetchAllFiles();
}
@@ -589,21 +620,21 @@ export async function reallyDeleteInformation(files, reallyDeleteData) {
* page with unsaved edits.
* @returns {Promise<void>}
*/
export async function leaveAccountManagementToRemind(){
export async function leaveAccountManagementToRemind() {
const modalStore = useModalStore();
const result = await Swal.fire({
title: 'SAVE YOUR EDIT?',
icon: 'info',
title: "SAVE YOUR EDIT?",
icon: "info",
showCancelButton: true,
didOpen: () => {
const confirmButton = Swal.getConfirmButton();
confirmButton.style.border = '1px solid #0099FF';
}
confirmButton.style.border = "1px solid #0099FF";
},
});
if(result.isConfirmed) {
if (result.isConfirmed) {
return;
} else {
modalStore.openModal();
}
};
}