101 lines
2.7 KiB
Vue
101 lines
2.7 KiB
Vue
<template>
|
|
<div class="approve-card">
|
|
<div class="left-side low-mid-text">
|
|
Transaction<br />
|
|
Successful
|
|
</div>
|
|
<div class="right-side">
|
|
<div class="btn btn-immortal tiny-text" v-if="stateComputed === 1" @click="sacrificeClick">
|
|
Sacrifice 🩸
|
|
</div>
|
|
<div class="btn btn-immortal tiny-text" disabled v-if="stateComputed === 2">Sign Transaction</div>
|
|
<div class="btn btn-immortal tiny-text" disabled v-if="stateComputed === 3">
|
|
<loading-component></loading-component>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import LoadingComponent from "@/components/LoadingComponent.vue";
|
|
import { getCurrentInstance, computed, watch, inject } from "vue";
|
|
import { useTokenStore } from "@/stores/tokens";
|
|
import { useSacrificeStore } from "@/stores/sacrifice";
|
|
|
|
import CardComponent from "@/components/CardComponent.vue";
|
|
import { useToast } from "vue-toastification";
|
|
|
|
const emit = defineEmits(["sacrificed"]);
|
|
|
|
const props = defineProps({
|
|
value: String,
|
|
header: String,
|
|
subheader: String,
|
|
info: String,
|
|
});
|
|
|
|
const toast = useToast();
|
|
const tokenStore = useTokenStore();
|
|
const sacrificeStore = useSacrificeStore();
|
|
|
|
const instance = getCurrentInstance();
|
|
const id = instance.attrs["toast-id"];
|
|
const splashBlood = inject("splashBlood");
|
|
|
|
function closeToast() {
|
|
toast.dismiss(id);
|
|
}
|
|
|
|
const stateComputed = computed(() => {
|
|
let returnState = 0;
|
|
if (
|
|
sacrificeStore.sacrificeNumber === null ||
|
|
sacrificeStore.sacrificeNumber === "" ||
|
|
sacrificeStore.sacrificeNumber === 0
|
|
) {
|
|
returnState = 0;
|
|
} else if (sacrificeStore.sacrificeState === 2) {
|
|
returnState = 2;
|
|
} else if (sacrificeStore.sacrificeState === 3) {
|
|
returnState = 3;
|
|
} else if (
|
|
sacrificeStore.sacrificeNumber !== null ||
|
|
sacrificeStore.sacrificeNumber !== "" ||
|
|
sacrificeStore.sacrificeNumber > 0
|
|
) {
|
|
returnState = 1;
|
|
}
|
|
return returnState;
|
|
});
|
|
|
|
async function sacrificeClick() {
|
|
try {
|
|
var result = await sacrificeStore.sacrificeToken(sacrificeStore.sacrificeNumber, tokenStore.activeToken);
|
|
if (result) {
|
|
emit("sacrificed");
|
|
}
|
|
} catch (error) {
|
|
console.error("error", error);
|
|
} finally {
|
|
closeToast();
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="sass">
|
|
.Vue-Toastification__container
|
|
.Vue-Toastification__toast--default
|
|
&.approve-toast
|
|
background: transparent
|
|
&.toast-card
|
|
padding: 24px 16px
|
|
border-radius: 10px
|
|
border: 2px solid var(--dark-purple, #4B0082)
|
|
background: var(--midnight-black, #0F0F0F)
|
|
.Vue-Toastification__toast-component-body
|
|
.approve-card
|
|
display: flex
|
|
flex-direction: row
|
|
display: flex
|
|
align-items: center
|
|
gap: 29px
|
|
</style>
|