online applications page done
This commit is contained in:
parent
76540995c8
commit
b44a1c2d14
|
|
@ -1,19 +1,272 @@
|
|||
<template>
|
||||
<div class="intro-y grid grid-cols-1 lg:grid-cols-2 gap-6 mt-5">
|
||||
<PreviewComponent class="box ">
|
||||
Hello 1
|
||||
<!-- BEGIN: Legalization -->
|
||||
<PreviewComponent class="intro-y box flex flex-col">
|
||||
<div class="flex flex-col sm:flex-row items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400">
|
||||
<h2 class="font-medium text-base mr-auto">{{ $t('LEGALIZATION') }}</h2>
|
||||
<div class="form-check form-switch w-full sm:w-auto sm:ml-auto mt-3 sm:mt-0 text-center">
|
||||
<a href="javascript:;" @click.prevent="onLegalBtnTapped" class="btn btn-primary">
|
||||
<EditIcon class="w-4 h-4 mr-3" /> {{ $t(legalBtnTitle) }}
|
||||
<LoadingIcon icon="oval" color="white" class="w-4 h-4 ml-2" v-if="isLegalBtnLoading" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-5 border-b border-slate-200/60 dark:border-darkmode-400">
|
||||
<div class="flex flex-col md:flex-row min-h-max">
|
||||
<div class="flex-1">
|
||||
<!-- Begin column -->
|
||||
<div class="sm:flex m-2 items-center">
|
||||
<div class="sm:w-1/4 font-medium">{{ $t('LEG_NUM') }}:</div>
|
||||
<div class="sm:w-3/4 sm:pl-3">{{ legal.number }}</div>
|
||||
</div>
|
||||
<div class="sm:flex m-2 items-center">
|
||||
<div class="sm:w-1/4 font-medium">{{ $t('EXP_DATE') }}:</div>
|
||||
<div class="sm:w-3/4 sm:pl-3">{{ legal.expires_at }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End column -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-if="!legalNumber" class="flex flex-row items-center p-5">
|
||||
<InfoIcon class="w-6 h-6 w-14 text-danger mr-4" />
|
||||
<span class="font-medium text-danger">{{ $t('LEG_WARN_INFO') }}</span>
|
||||
</div> -->
|
||||
</PreviewComponent>
|
||||
<PreviewComponent class="box ">
|
||||
Hello 2
|
||||
<!-- END: Legalization -->
|
||||
|
||||
|
||||
<!-- BEGIN: Broker -->
|
||||
<PreviewComponent class="intro-y box flex flex-col">
|
||||
<div class="flex flex-col sm:flex-row items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400">
|
||||
<h2 class="font-medium text-base mr-auto">{{ $t('BROKER') }}</h2>
|
||||
<div class="form-check form-switch w-full sm:w-auto sm:ml-auto mt-3 sm:mt-0 text-center">
|
||||
<a href="javascript:;" @click.prevent="onBrokerBtnTapped" class="btn btn-primary">
|
||||
<EditIcon class="w-4 h-4 mr-3" /> {{ $t(brokerBtnTitle) }}
|
||||
<LoadingIcon icon="oval" color="white" class="w-4 h-4 ml-2" v-if="isBrokerBtnLoading" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-5 border-b border-slate-200/60 dark:border-darkmode-400">
|
||||
<div class="flex flex-col md:flex-row min-h-max">
|
||||
<div class="flex-1">
|
||||
<!-- Begin column -->
|
||||
<div class="sm:flex m-2 items-center">
|
||||
<div class="sm:w-1/4 font-medium">{{ $t('LEG_NUM') }}:</div>
|
||||
<div class="sm:w-3/4 sm:pl-3">{{ broker.number }}</div>
|
||||
</div>
|
||||
<div class="sm:flex m-2 items-center">
|
||||
<div class="sm:w-1/4 font-medium">{{ $t('EXP_DATE') }}:</div>
|
||||
<div class="sm:w-3/4 sm:pl-3">{{ broker.expires_at }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End column -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-if="!legalNumber" class="flex flex-row items-center p-5">
|
||||
<InfoIcon class="w-6 h-6 w-14 text-danger mr-4" />
|
||||
<span class="font-medium text-danger">{{ $t('LEG_WARN_INFO') }}</span>
|
||||
</div> -->
|
||||
</PreviewComponent>
|
||||
<PreviewComponent class="box ">
|
||||
<!-- END: Broker -->
|
||||
|
||||
<!-- <PreviewComponent class="box ">
|
||||
Hello 3
|
||||
</PreviewComponent>
|
||||
<PreviewComponent class="box ">
|
||||
Hello 4
|
||||
</PreviewComponent>
|
||||
</PreviewComponent> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { fetchWrapper } from "@/api";
|
||||
import { helper as $h } from "@/utils/helper";
|
||||
import { useAuthStore } from "@/stores";
|
||||
import router from "@/router";
|
||||
|
||||
const baseUrl = `${import.meta.env.VITE_API_URL}/api`;
|
||||
|
||||
const isLoading = ref(false);
|
||||
|
||||
const broker = reactive({});
|
||||
const brokerBtnTitle = ref("");
|
||||
const isBrokerBtnLoading = ref(false);
|
||||
|
||||
// legalization
|
||||
const legal = reactive({});
|
||||
const legalBtnTitle = ref("");
|
||||
const isLegalBtnLoading = ref(false);
|
||||
|
||||
|
||||
const createLegalApplication = async () => {
|
||||
isLegalBtnLoading.value = true;
|
||||
try {
|
||||
const response = await fetchWrapper.get(`${baseUrl}/application/new`);
|
||||
const data = response.data;
|
||||
|
||||
isLegalBtnLoading.value = false;
|
||||
return true;
|
||||
} catch (error) {
|
||||
isLegalBtnLoading.value = false;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
const createBrokerApplication = async () => {
|
||||
isBrokerBtnLoading.value = true;
|
||||
try {
|
||||
const response = await fetchWrapper.get(`${baseUrl}/broker-application/new`);
|
||||
const data = response.data;
|
||||
|
||||
console.log('DDDDDDD: ' + data);
|
||||
isBrokerBtnLoading.value = false;
|
||||
return true;
|
||||
} catch (error) {
|
||||
isBrokerBtnLoading.value = false;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
const onLegalBtnTapped = async () => {
|
||||
console.log("onLegalBtnTapped: ", legal.can_extend, legal.can_apply);
|
||||
|
||||
if (legal.can_apply || legal.can_extend) {
|
||||
const response = await createLegalApplication();
|
||||
if (response) router.push({ name: "documents" });
|
||||
} else router.push({ name: "documents" });
|
||||
};
|
||||
|
||||
const onBrokerBtnTapped = async () => {
|
||||
console.log("onBrokerBtnTapped: ", broker.can_extend, broker.can_apply);
|
||||
|
||||
if (broker.can_apply || broker.can_extend) {
|
||||
const response = await createBrokerApplication();
|
||||
if (response) router.push({ name: "broker-applications" });
|
||||
} else router.push({ name: "broker-applications" });
|
||||
};
|
||||
|
||||
const prepareLegalBtnTitle = () => {
|
||||
|
||||
// statuses
|
||||
|
||||
// draft
|
||||
// new
|
||||
// accepted
|
||||
// acceptedBy
|
||||
// refine
|
||||
// approved
|
||||
// approvedBy
|
||||
|
||||
|
||||
if (legal.can_extend) {
|
||||
legalBtnTitle.value = "LEG_BTN_NULL";
|
||||
return;
|
||||
}
|
||||
|
||||
if (legal == null || legal.app_status == "" || legal.app_status == null) {
|
||||
legalBtnTitle.value = "LEG_BTN_NULL";
|
||||
}
|
||||
else if (legal.app_status == "draft") {
|
||||
legalBtnTitle.value = "LEG_BTN_DRAFT";
|
||||
}
|
||||
else if (legal.app_status == "new") {
|
||||
legalBtnTitle.value = "LEG_BTN_NEW";
|
||||
}
|
||||
else if (legal.app_status == "refine") {
|
||||
legalBtnTitle.value = "LEG_BTN_REFINE";
|
||||
}
|
||||
else if (legal.app_status == "accepted") {
|
||||
// set accepted by, accepted date
|
||||
legalBtnTitle.value = "LEG_BTN_ACCEPTED";
|
||||
}
|
||||
else if (legal.app_status == "approved") {
|
||||
// set approved by. approved date
|
||||
legalBtnTitle.value = "LEG_BTN_APPROVED";
|
||||
}
|
||||
};
|
||||
|
||||
const prepareBrokerBtnTitle = () => {
|
||||
|
||||
// statuses
|
||||
|
||||
// draft
|
||||
// new
|
||||
// accepted
|
||||
// acceptedBy
|
||||
// refine
|
||||
// approved
|
||||
// approvedBy
|
||||
|
||||
|
||||
if (broker.can_extend) {
|
||||
brokerBtnTitle.value = "BRK_BTN_NULL";
|
||||
return;
|
||||
}
|
||||
|
||||
if (broker == null || broker.app_status == "" || broker.app_status == null) {
|
||||
brokerBtnTitle.value = "BRK_BTN_NULL";
|
||||
}
|
||||
else if (broker.app_status == "draft") {
|
||||
brokerBtnTitle.value = "BRK_BTN_DRAFT";
|
||||
}
|
||||
else if (broker.app_status == "new") {
|
||||
brokerBtnTitle.value = "BRK_BTN_NEW";
|
||||
}
|
||||
else if (broker.app_status == "refine") {
|
||||
brokerBtnTitle.value = "BRK_BTN_REFINE";
|
||||
}
|
||||
else if (broker.app_status == "accepted") {
|
||||
// set accepted by, accepted date
|
||||
brokerBtnTitle.value = "BRK_BTN_ACCEPTED";
|
||||
}
|
||||
else if (broker.app_status == "approved") {
|
||||
// set approved by. approved date
|
||||
brokerBtnTitle.value = "BRK_BTN_APPROVED";
|
||||
}
|
||||
};
|
||||
|
||||
const fetchStatus = async () => {
|
||||
console.log("fetchBroker");
|
||||
try {
|
||||
isLoading.value = true;
|
||||
|
||||
const response = await fetchWrapper.get(`${baseUrl}/account/legalization-broker-status`);
|
||||
const data = response.data;
|
||||
|
||||
console.info("fetchBroker data: ", data);
|
||||
|
||||
if (data.broker) {
|
||||
Object.assign(broker, data.broker);
|
||||
if (broker.expires_at) {
|
||||
// convert date format
|
||||
broker.expires_at = $h.formatDate(broker.expires_at, "DD.MM.YYYY");
|
||||
}
|
||||
}
|
||||
|
||||
if (data.legal) {
|
||||
Object.assign(legal, data.legal);
|
||||
|
||||
if (legal.expires_at) {
|
||||
// convert date format
|
||||
legal.expires_at = $h.formatDate(legal.expires_at, "DD.MM.YYYY");
|
||||
}
|
||||
}
|
||||
|
||||
prepareLegalBtnTitle();
|
||||
prepareBrokerBtnTitle();
|
||||
|
||||
isLoading.value = false;
|
||||
} catch (error) {
|
||||
isLoading.value = false;
|
||||
|
||||
// logout on error
|
||||
const authStore = useAuthStore();
|
||||
await authStore.logout();
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchStatus();
|
||||
});
|
||||
</script>
|
||||
|
|
@ -249,8 +249,6 @@ const fetchAccount = async () => {
|
|||
const response = await fetchWrapper.get(`${baseUrl}/account`);
|
||||
const data = response.data;
|
||||
|
||||
console.warn("profile fetchAccount data: ", data);
|
||||
|
||||
legalAppStatus.value = data.legal_app_status;
|
||||
legalExpiresAt.value = data.legal_expires_at;
|
||||
legalNumber.value = data.legal_number;
|
||||
|
|
@ -288,6 +286,8 @@ const fetchAccount = async () => {
|
|||
isLoading.value = false;
|
||||
} catch (error) {
|
||||
isLoading.value = false;
|
||||
|
||||
// logout on error
|
||||
const authStore = useAuthStore();
|
||||
await authStore.logout();
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue