update tokens + desktop version

This commit is contained in:
EmberSpirit
2023-09-21 19:08:03 +02:00
parent 9330168af2
commit 1b2ea9b2a2
21 changed files with 880 additions and 1172 deletions
+45 -16
View File
@@ -1,16 +1,31 @@
<template>
<stake-component>
<template v-slot:headline> Staked </template>
<template v-slot:subheadline> Stake for a 25% bonus on your sacrifice. Upper limit is your stake. </template>
<template v-slot:body>
<token-name-price
:name="tokenStore.getToken(walletStore.memeToken?.contractAddress)?.name"
:price="walletStore.memeToken?.staked"
></token-name-price>
<token-logo img="/assets/img/token/bloodline.png" :alt="'test'"></token-logo>
<token-name-price class="stake-reward" name="Extra Reward" price="+20%"></token-name-price>
</template>
<template v-slot:actions>
<div
class="connected-stake bloodline-border white card"
:class="{ 'card--dense': dense, 'connected-stake--variant1': variant === 1 }"
@click="
(e) => {
e.preventDefault();
e.stopPropagation();
}
"
>
<div class="connected-stake-headline mid-mid-text">
<slot name="headline">Staked</slot>
</div>
<div class="low-mid-text text-center">
<slot name="subheadline">Stake for a 25% bonus on your sacrifice. Upper limit is your stake.</slot>
</div>
<div class="connected-stake-body">
<slot name="body">
<token-name-price
:name="tokenStore.getToken(walletStore.memeToken?.contractAddress)?.name"
:price="walletStore.memeToken?.staked"
></token-name-price>
<token-logo img="/assets/img/token/bloodline.png" :alt="'^y '"></token-logo>
<token-name-price class="stake-reward" name="Extra Reward" price="+20%"></token-name-price>
</slot>
</div>
<slot name="actions">
<div class="connected-stake-buttons" v-if="!stakeMenu">
<div class="btn btn-immortal" disabled v-if="roundStore.currentRound === 1">Stake</div>
<div class="btn btn-immortal" v-else @click="openStake">Stake</div>
@@ -64,12 +79,21 @@
No $BLOOD on the market. Staking is activated after the first cycle is finished.
</div>
<div class="low-mid-text text-center">You can claim your stake next cycle.</div>
</template>
</stake-component>
</slot>
<slot></slot>
<!-- <div class="connected-stake-buttons" v-if="!stakeMenu">
<div class="btn btn-immortal" @click="openStake">Stake</div>
<div v-if="walletStore.memeToken?.staked === 0 && !stakeonly" class="btn btn-immortal btn--disabled">
Unstake
</div>
<div v-else-if="!stakeonly" class="btn btn-immortal" @click="openUnstake">Unstake</div>
</div> -->
</div>
</template>
<script setup>
import { ref } from "vue";
import { ref, useSlots } from "vue";
import StakeComponent from "@/components/StakeComponent.vue";
import StakeMenu from "@/components/StakeMenu.vue";
import TokenNamePrice from "@/components/TokenNamePrice.vue";
@@ -84,13 +108,18 @@ const walletStore = useWalletStoreV2();
const tokenStore = useTokenStore();
const rewardLockerStore = useRewardLockerStore();
const roundStore = useRoundsStore();
const slots = useSlots();
const props = defineProps({
stakeonly: {
type: Boolean,
required: false,
default: false,
},
variant: {
type: Number,
required: false,
default: null,
},
});
const stakeMenu = ref(false);