Fix single root element vue standards

This commit is contained in:
Vagner 2024-10-12 23:51:13 -03:00
parent 6e59f77153
commit e6117d77d7
4 changed files with 131 additions and 123 deletions

View File

@ -17,50 +17,52 @@ if (props.isRedirectModal) {
</script>
<template>
<div
class="modal-overlay inset-0 fixed justify-center backdrop-blur-sm sm:backdrop-blur-none"
v-if="!isRedirectModal"
>
<div class="modal px-5 text-center">
<p
class="text-black tracking-tighter leading-tight my-6 mx-2 text-justify"
>
<strong>ATENÇÃO!</strong>
A transação será processada após inserir o código de autenticação.
Caso contrário não conseguiremos comprovar o seu depósito e não será
possível transferir os tokens para sua carteira.
</p>
<button
@click="$emit('close-modal')"
class="border-2 border-solid border-amber-400 mt-2"
>
Entendi
</button>
</div>
</div>
<div
class="modal-overlay inset-0 fixed justify-center backdrop-blur-sm"
v-if="isRedirectModal"
>
<div class="modal px-5 text-center">
<p
class="text-black text-lg tracking-tighter leading-tight my-6 mx-2 text-justify font-semibold"
>
Retomar a última compra?
</p>
<div class="flex justify-around items-center px-2">
<div>
<div
class="modal-overlay inset-0 fixed justify-center backdrop-blur-sm sm:backdrop-blur-none"
v-if="!isRedirectModal"
>
<div class="modal px-5 text-center">
<p
class="text-black tracking-tighter leading-tight my-6 mx-2 text-justify"
>
<strong>ATENÇÃO!</strong>
A transação será processada após inserir o código de autenticação.
Caso contrário não conseguiremos comprovar o seu depósito e não será
possível transferir os tokens para sua carteira.
</p>
<button
@click="$emit('close-modal')"
class="border-2 border-solid border-white-400 mt-2 font-semibold"
class="border-2 border-solid border-amber-400 mt-2"
>
Não
Entendi
</button>
<button
@click="$emit('go-to-lock')"
class="border-2 border-solid border-white-400 mt-2 font-semibold"
</div>
</div>
<div
class="modal-overlay inset-0 fixed justify-center backdrop-blur-sm"
v-if="isRedirectModal"
>
<div class="modal px-5 text-center">
<p
class="text-black text-lg tracking-tighter leading-tight my-6 mx-2 text-justify font-semibold"
>
Sim
</button>
Retomar a última compra?
</p>
<div class="flex justify-around items-center px-2">
<button
@click="$emit('close-modal')"
class="border-2 border-solid border-white-400 mt-2 font-semibold"
>
Não
</button>
<button
@click="$emit('go-to-lock')"
class="border-2 border-solid border-white-400 mt-2 font-semibold"
>
Sim
</button>
</div>
</div>
</div>
</div>

View File

@ -119,46 +119,48 @@ onMounted(async () => {
</script>
<template>
<SearchComponent
v-if="flowStep == Step.Search"
@token-buy="confirmBuyClick"
/>
<CustomAlert
v-if="flowStep == Step.Search && showModal"
:type="'redirect'"
@close-alert="showModal = false"
@go-to-lock="flowStep = Step.Buy"
/>
<CustomAlert
v-if="
flowStep == Step.List && showBuyAlert && !loadingLock && !loadingRelease
"
:type="'buy'"
@close-alert="showBuyAlert = false"
/>
<div v-if="flowStep == Step.Buy">
<QrCodeComponent
:pixTarget="String(pixTarget)"
:tokenValue="tokenAmount"
@pix-validated="releaseTransaction"
v-if="!loadingLock"
<div>
<SearchComponent
v-if="flowStep == Step.Search"
@token-buy="confirmBuyClick"
/>
<LoadingComponent
v-if="loadingLock"
:message="'A transação está sendo enviada para a rede'"
<CustomAlert
v-if="flowStep == Step.Search && showModal"
:type="'redirect'"
@close-alert="showModal = false"
@go-to-lock="flowStep = Step.Buy"
/>
</div>
<div v-if="flowStep == Step.List">
<div class="flex flex-col gap-10" v-if="!loadingRelease">
<BuyConfirmedComponent
:tokenAmount="tokenAmount"
:is-current-step="flowStep == Step.List"
@make-another-transaction="flowStep = Step.Search"
<CustomAlert
v-if="
flowStep == Step.List && showBuyAlert && !loadingLock && !loadingRelease
"
:type="'buy'"
@close-alert="showBuyAlert = false"
/>
<div v-if="flowStep == Step.Buy">
<QrCodeComponent
:pixTarget="String(pixTarget)"
:tokenValue="tokenAmount"
@pix-validated="releaseTransaction"
v-if="!loadingLock"
/>
<LoadingComponent
v-if="loadingLock"
:message="'A transação está sendo enviada para a rede'"
/>
</div>
<div v-if="flowStep == Step.List">
<div class="flex flex-col gap-10" v-if="!loadingRelease">
<BuyConfirmedComponent
:tokenAmount="tokenAmount"
:is-current-step="flowStep == Step.List"
@make-another-transaction="flowStep = Step.Search"
/>
</div>
<LoadingComponent
v-if="loadingRelease"
:message="'A transação está sendo enviada para a rede. Em breve os tokens serão depositados em sua carteira.'"
/>
</div>
<LoadingComponent
v-if="loadingRelease"
:message="'A transação está sendo enviada para a rede. Em breve os tokens serão depositados em sua carteira.'"
/>
</div>
</template>

View File

@ -86,30 +86,32 @@ watch(networkName, async () => {
</script>
<template>
<CustomAlert
v-if="showAlert"
:type="'withdraw'"
@close-alert="showAlert = false"
/>
<div class="page">
<div class="header" v-if="!loadingWithdraw && !walletAddress">
Por Favor Conecte Sua Carteira
</div>
<div class="header" v-if="!loadingWithdraw && walletAddress">
Gerenciar Ofertas
</div>
<div class="w-full max-w-4xl">
<ListingComponent
v-if="!loadingWithdraw && walletAddress"
:valid-deposits="depositList"
:wallet-transactions="transactionsList"
:active-lock-amount="activeLockAmount"
@deposit-withdrawn="callWithdraw"
></ListingComponent>
<LoadingComponent
v-if="loadingWithdraw"
:message="'A transação está sendo enviada para a rede. Em breve os tokens serão depositados em sua carteira.'"
/>
<div>
<CustomAlert
v-if="showAlert"
:type="'withdraw'"
@close-alert="showAlert = false"
/>
<div class="page">
<div class="header" v-if="!loadingWithdraw && !walletAddress">
Por Favor Conecte Sua Carteira
</div>
<div class="header" v-if="!loadingWithdraw && walletAddress">
Gerenciar Ofertas
</div>
<div class="w-full max-w-4xl">
<ListingComponent
v-if="!loadingWithdraw && walletAddress"
:valid-deposits="depositList"
:wallet-transactions="transactionsList"
:active-lock-amount="activeLockAmount"
@deposit-withdrawn="callWithdraw"
></ListingComponent>
<LoadingComponent
v-if="loadingWithdraw"
:message="'A transação está sendo enviada para a rede. Em breve os tokens serão depositados em sua carteira.'"
/>
</div>
</div>
</div>
</template>

View File

@ -61,29 +61,31 @@ const sendNetwork = async () => {
</script>
<template>
<div v-if="flowStep == Step.Sell">
<WantSellComponent v-if="!loading" @approve-tokens="approveOffer" />
<LoadingComponent
v-if="loading"
:message="'A transação está sendo enviada para a rede.'"
/>
</div>
<CustomAlert
v-if="flowStep == Step.Sell && showAlert"
:type="'sell'"
@close-alert="showAlert = false"
/>
<div v-if="flowStep == Step.Network">
<SendNetwork
:pixKey="pixKeyBuyer"
:offer="Number(offerValue)"
:selected-token="etherStore.selectedToken"
v-if="!loading"
@send-network="sendNetwork"
/>
<LoadingComponent
v-if="loading"
:message="'A transação está sendo enviada para a rede.'"
<div>
<div v-if="flowStep == Step.Sell">
<WantSellComponent v-if="!loading" @approve-tokens="approveOffer" />
<LoadingComponent
v-if="loading"
:message="'A transação está sendo enviada para a rede.'"
/>
</div>
<CustomAlert
v-if="flowStep == Step.Sell && showAlert"
:type="'sell'"
@close-alert="showAlert = false"
/>
<div v-if="flowStep == Step.Network">
<SendNetwork
:pixKey="pixKeyBuyer"
:offer="Number(offerValue)"
:selected-token="etherStore.selectedToken"
v-if="!loading"
@send-network="sendNetwork"
/>
<LoadingComponent
v-if="loading"
:message="'A transação está sendo enviada para a rede.'"
/>
</div>
</div>
</template>