120 lines
3.7 KiB
Vue
120 lines
3.7 KiB
Vue
<template>
|
|
<div class="stake-menu">
|
|
<token-input :modelValue="props.modelValue" @input="emit('update:modelValue', Number($event.target.value))">
|
|
<template v-slot:message>
|
|
<div class="stake-adder-step bloodline-badge grey" @click="addTokensPercent(25)">25%</div>
|
|
<div class="stake-adder-step bloodline-badge grey" @click="addTokensPercent(50)">50%</div>
|
|
<div class="stake-adder-step bloodline-badge grey" @click="addTokensPercent(75)">75%</div>
|
|
<div class="stake-adder-step bloodline-badge grey" @click="addTokensPercent(100)">100%</div>
|
|
</template>
|
|
</token-input>
|
|
<div class="stake-menu-actions">
|
|
<slot name="body">
|
|
<div class="input-balance">Balance: {{ walletStore.memeToken.balanceOf }}</div>
|
|
<div class="btn btn-immortal stake-button" @click="stakeBloodline" v-if="props.stake">Stake</div>
|
|
<div class="btn btn-immortal stake-button" @click="unstakeBloodline" v-else>Unstake for Next Cycle</div>
|
|
<div class="btn btn-immortal black" @click="emit('close')">Cancel</div>
|
|
</slot>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue";
|
|
|
|
import TokenInput from "./TokenInput.vue";
|
|
import { useWalletStoreV2 } from "@/stores/walletV2";
|
|
import { useRewardLockerStore } from "@/stores/rewardlocker";
|
|
import { useTokenStore } from "@/stores/tokens";
|
|
import { createPermitObject, getSignatureRSV } from "@/helper/blockchain.js";
|
|
|
|
import { signTypedData } from "@wagmi/core";
|
|
|
|
const walletStore = useWalletStoreV2();
|
|
const rewardLockerStore = useRewardLockerStore();
|
|
const tokenStore = useTokenStore();
|
|
|
|
const props = defineProps({
|
|
stake: Boolean,
|
|
modelValue: Number,
|
|
amount: Number,
|
|
});
|
|
|
|
const emit = defineEmits(["close", "update:modelValue"]);
|
|
|
|
async function addTokensPercent(value) {
|
|
console.log("value", value);
|
|
console.log(walletStore.memeToken.balanceOf);
|
|
let amount;
|
|
if (props.amount !== undefined || props.amount !== null) {
|
|
amount = (props.amount * value) / 100;
|
|
} else if (props.stake) {
|
|
amount = (walletStore.memeToken.balanceOf * value) / 100;
|
|
} else {
|
|
amount = (walletStore.memeToken.staked * value) / 100;
|
|
}
|
|
emit("update:modelValue", Number(amount));
|
|
}
|
|
|
|
async function unstakeBloodline() {
|
|
const fromAddress = walletStore.address;
|
|
|
|
var test1 = await rewardLockerStore.contract.read.unstakeOrdered([4, fromAddress]);
|
|
console.log("test1", test1);
|
|
var test = true;
|
|
if (test) {
|
|
return;
|
|
}
|
|
var hash = await rewardLockerStore.contract.write.orderUnstake();
|
|
console.log("hash", hash);
|
|
const data = await waitForTransaction({
|
|
hash: hash,
|
|
});
|
|
console.log("data", data);
|
|
}
|
|
|
|
async function stakeBloodline() {
|
|
const fromAddress = walletStore.address;
|
|
const spender = rewardLockerStore.config.contractAddress;
|
|
const deadline = Date.now() + 20 * 60;
|
|
const decimals = tokenStore.getToken(walletStore.memeToken.contractAddress).decimals;
|
|
const value = (tokenNumber.value * Math.pow(10, decimals)).toString();
|
|
const nonce = await tokenStore.memeToken.contract.read.nonces([fromAddress]);
|
|
console.log("nonce", nonce);
|
|
const { types, message, domain, primaryType } = createPermitObject(fromAddress, spender, nonce, deadline, value);
|
|
|
|
const signature = await signTypedData({
|
|
domain: domain,
|
|
message: message,
|
|
primaryType: primaryType,
|
|
types: types,
|
|
});
|
|
|
|
const { r, s, v } = getSignatureRSV(signature);
|
|
|
|
var resultStake = await rewardLockerStore.contract.write.stakeToBeSecured([value, deadline, v, r, s]);
|
|
|
|
console.log("resultStake", resultStake);
|
|
}
|
|
</script>
|
|
|
|
<style lang="sass">
|
|
.btn
|
|
&.btn-immortal
|
|
&.stake-button
|
|
font-size: 18px
|
|
text-align: center
|
|
.input-balance
|
|
margin: 8px 0
|
|
color: var(--grey, #858585)
|
|
|
|
.stake-menu
|
|
display: flex
|
|
flex-direction: column
|
|
gap: 32px
|
|
.stake-menu-actions
|
|
display: flex
|
|
flex-direction: column
|
|
gap: 8px
|
|
</style>
|