64 lines
2.7 KiB
Vue
64 lines
2.7 KiB
Vue
<template>
|
|
<div id="modal_delete_acct_alert" class="flex shadow-lg rounded-lg w-[564px] flex-col bg-[#ffffff]">
|
|
<div class="flex decoration-bar bg-[#FF3366] h-2 rounded-t"></div>
|
|
<main id="delete_acct_modal_main" class="flex flex-col items-center justify-center">
|
|
<img src="@/assets/icon-large-exclamation.svg" alt="!" class="flex mt-[36px]">
|
|
<h1 class="flex mt-4 text-xl font-medium">{{ i18next.t("AcctMgmt.DelteQuestion").toUpperCase() }}</h1>
|
|
<div class="clauses flex flex-col mt-4 mb-8 px-8">
|
|
<h2 class="flex leading-[21px]">{{ i18next.t("The") }} <span class="text-[#FF3366]">
|
|
{{ i18next.t("AcctMgmt.DeleteFirstClause").toUpperCase() }}
|
|
</span>
|
|
</h2>
|
|
<h2 class="flex leading-[21px]">{{ i18next.t("AcctMgmt.DeleteSecondClause") }}</h2>
|
|
</div>
|
|
</main>
|
|
<footer class="flex justify-center py-3 border-t-2 border-t-gray-50 gap-4">
|
|
<button id="calcel_delete_acct_btn" class="flex justify-center items-center rounded-full cursor-pointer w-[100px] h-[40px]
|
|
bg-[#FF3366] text-[#ffffff]" @click="onNoBtnClick">
|
|
{{ i18next.t("No") }}
|
|
</button>
|
|
<button id="sure_to_delete_acct_btn" class="flex justify-center items-center rounded-full cursor-pointer w-[100px] h-[40px]
|
|
border-2 border-[#FF3366] text-[#FF3366]"
|
|
@click="onDeleteConfirmBtnClick"
|
|
>
|
|
{{ i18next.t("Yes") }}
|
|
</button>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { defineComponent, ref, computed, onBeforeMount, watch, } from 'vue';
|
|
import { useModalStore } from '@/stores/modal.js';
|
|
import { useRouter } from 'vue-router';
|
|
import useAcctMgmtStore from '@/stores/acctMgmt.js';
|
|
import i18next from '@/i18n/i18n.js';
|
|
import { useToast } from 'vue-toast-notification';
|
|
|
|
export default defineComponent({
|
|
setup() {
|
|
const acctMgmtStore = useAcctMgmtStore();
|
|
const modalStore = useModalStore();
|
|
const toast = useToast();
|
|
const router = useRouter();
|
|
|
|
const onDeleteConfirmBtnClick = async() => {
|
|
if(acctMgmtStore.deleteAccount(acctMgmtStore.currentViewingUser.username)){
|
|
toast.success(i18next.t("AcctMgmt.MsgAccountDeleteSuccess"));
|
|
modalStore.closeModal();
|
|
router.push("/account/account-admin");
|
|
}
|
|
}
|
|
|
|
const onNoBtnClick = () => {
|
|
modalStore.closeModal();
|
|
}
|
|
|
|
return {
|
|
i18next,
|
|
onDeleteConfirmBtnClick,
|
|
onNoBtnClick,
|
|
};
|
|
},
|
|
});
|
|
</script> |