hueso/P2Pix-Front-End
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix custom modal css to align it at center independent of device

Browse Source 
Co-authored-by: enzoggqs <eggqsaraiva@gmail.com>
This commit is contained in:
RcleydsonR 2023-02-10 16:59:28 -03:00
parent 2ea9f18cc1
commit 03c7d14b4b
5 changed files with 29 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/blockchain/wallet.ts
View File

@ -105,9 +105,7 @@ const listLockTransactionByWalletAddress = async (
const p2pContract = getContract(true); const p2pContract = getContract(true);
const filterAddedLocks = p2pContract.filters.LockAdded([walletAddress]); const filterAddedLocks = p2pContract.filters.LockAdded([walletAddress]);
const eventsReleasedLocks = await p2pContract.queryFilter( const eventsReleasedLocks = await p2pContract.queryFilter(filterAddedLocks);
filterAddedLocks
);
return eventsReleasedLocks.sort((a, b) => { return eventsReleasedLocks.sort((a, b) => {
return b.blockNumber - a.blockNumber; return b.blockNumber - a.blockNumber;
@ -123,10 +121,12 @@ const checkUnreleasedLocks = async (
}; };
const addedLocks = await listLockTransactionByWalletAddress(walletAddress); const addedLocks = await listLockTransactionByWalletAddress(walletAddress);
const lockStatus = await p2pContract.getLocksStatus(addedLocks.map((lock) => lock.args?.lockID)) const lockStatus = await p2pContract.getLocksStatus(
const unreleasedLockId = lockStatus.find((lock: any) => lock.status) addedLocks.map((lock) => lock.args?.lockID)
);
const unreleasedLockId = lockStatus.find((lock: any) => lock.status);
if (unreleasedLockId){ if (unreleasedLockId) {
const lock = await p2pContract.mapLocks(unreleasedLockId); const lock = await p2pContract.mapLocks(unreleasedLockId);
const pixTarget = lock.pixTarget; const pixTarget = lock.pixTarget;
@ -148,5 +148,5 @@ export {
listValidDepositTransactionsByWalletAddress, listValidDepositTransactionsByWalletAddress,
listAllTransactionByWalletAddress, listAllTransactionByWalletAddress,
listReleaseTransactionByWalletAddress, listReleaseTransactionByWalletAddress,
checkUnreleasedLocks checkUnreleasedLocks,
}; };

7
src/components/CustomModal.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'; import { ref } from "vue";
const props = defineProps({ const props = defineProps({
isRedirectModal: Boolean, isRedirectModal: Boolean,
@ -69,13 +69,16 @@ if (props.isRedirectModal) {
<style scoped> <style scoped>
.modal-overlay { .modal-overlay {
display: flex !important; display: flex !important;
justify-content: center;
align-items: center;
height: 100vh;
width: 100vw;
} }
.modal { .modal {
background-color: v-bind(modalColor); background-color: v-bind(modalColor);
height: v-bind(modalHeight); height: v-bind(modalHeight);
width: 300px; width: 300px;
margin-top: 50%;
border-radius: 10px; border-radius: 10px;
} }
.close { .close {

5
src/components/QrCodeComponent.vue
View File

@ -154,6 +154,11 @@ const validatePix = async (): Promise<void> => {
@button-clicked="emit('pixValidated', e2eId)" @button-clicked="emit('pixValidated', e2eId)"
/> />
</div> </div>
<CustomModal
v-if="showModal"
@close-modal="showModal = false"
:isRedirectModal="false"
/>
</div> </div>
</template> </template>

22
src/views/HomeView.vue
View File

@ -27,7 +27,7 @@ const etherStore = useEtherStore();
etherStore.setSellerView(false); etherStore.setSellerView(false);
// States // States
const { loadingLock, walletAddress, networkName} = storeToRefs(etherStore); const { loadingLock, walletAddress, networkName } = storeToRefs(etherStore);
const flowStep = ref<Step>(Step.Search); const flowStep = ref<Step>(Step.Search);
const pixTarget = ref<number>(); const pixTarget = ref<number>();
const tokenAmount = ref<number>(); const tokenAmount = ref<number>();
@ -98,19 +98,19 @@ const checkForUnreleasedLocks = async () => {
flowStep.value = Step.Search; flowStep.value = Step.Search;
showModal.value = false; showModal.value = false;
} }
} };
if (walletAddress){ // if (walletAddress) {
await checkForUnreleasedLocks(); // await checkForUnreleasedLocks();
} // }
watch(walletAddress, async () => { // watch(walletAddress, async () => {
await checkForUnreleasedLocks(); // await checkForUnreleasedLocks();
}); // });
watch(networkName, async () => { // watch(networkName, async () => {
await checkForUnreleasedLocks(); // await checkForUnreleasedLocks();
}); // });
onMounted(async () => { onMounted(async () => {
await getNetworksLiquidity(); await getNetworksLiquidity();