vue3 infinite scroll

This commit is contained in:
Cindy Chang
2024-06-24 09:07:11 +08:00
parent 9b0d54bf5e
commit b55cc0a6d6
4 changed files with 90 additions and 46 deletions

View File

@@ -119,6 +119,8 @@ import { defineComponent, computed, ref, watch, } from 'vue';
import i18next from "@/i18n/i18n.js";
import { mapActions, } from 'pinia';
import { useModalStore } from '@/stores/modal.js';
import { useRouter } from 'vue-router';
import { useToast } from 'vue-toast-notification';
import useAcctMgmtStore from '@/stores/acctMgmt.js';
import ModalHeader from "./ModalHeader.vue";
import IconChecked from "@/components/icons/IconChecked.vue";
@@ -129,6 +131,9 @@ export default defineComponent({
const acctMgmtStore = useAcctMgmtStore();
const modalStore = useModalStore();
const router = useRouter();
const toast = useToast();
const currentViewingUser = computed(() => acctMgmtStore.currentViewingUser);
const isPwdEyeOn = ref(false);
const isPwdConfirmEyeOn = ref(false);
@@ -184,27 +189,37 @@ export default defineComponent({
return validateResult && isPwdMatched.value;
}
const onConfirmBtnClick = () => {
const validateResult = validateConfirmPwd();
if(!validateResult){
return;
const onConfirmBtnClick = async () => {
switch(whichCurrentModal.value) {
case MODAL_CREATE_NEW:
const validateResult = validateConfirmPwd();
if(!validateResult){
return;
}
//TODO: 這邊要記得回來加一個判斷帳號是否已經存在的邏輯
checkAccountIsUnique();
console.log('input content to feed in',
inputUserAccount.value,
inputPwd.value,
inputName.value,
isSetAsAdminChecked.value,
isSetActivedChecked.value,
);
await acctMgmtStore.createNewAccount({
username: inputUserAccount.value,
password: inputPwd.value,
name: inputName.value,
is_admin: isSetAsAdminChecked.value,
is_active: isSetActivedChecked.value,
});
await toast.success(i18next.t("AcctMgmt.MsgAccountAdded"));
await modalStore.closeModal();
await router.push('/account/account-admin');
break;
default:
break;
}
//TODO: 這邊要記得回來加一個判斷帳號是否已經存在的邏輯
checkAccountIsUnique();
console.log('input content to feed in',
inputUserAccount.value,
inputPwd.value,
inputName.value,
isSetAsAdminChecked.value,
isSetActivedChecked.value,
);
acctMgmtStore.createNewAccount({
username: inputUserAccount.value,
password: inputPwd.value,
name: inputName.value,
is_admin: isSetAsAdminChecked.value,
is_active: isSetActivedChecked.value,
});
}