From c0095b774da93f8202ee9ae32431f7d8e8b487e0 Mon Sep 17 00:00:00 2001
From: enzoggqs <eggqsaraiva@gmail.com>
Date: Mon, 26 Dec 2022 17:43:56 -0300
Subject: [PATCH] Create deposits history screen

---
 src/components/ListingComponent.vue | 10 ++++++-
 src/router/index.ts                 |  6 ++++
 src/views/DepositsHistoryView.vue   | 44 +++++++++++++++++++++++++++++
 3 files changed, 59 insertions(+), 1 deletion(-)
 create mode 100644 src/views/DepositsHistoryView.vue

diff --git a/src/components/ListingComponent.vue b/src/components/ListingComponent.vue
index 8be95e4..9b4aec6 100644
--- a/src/components/ListingComponent.vue
+++ b/src/components/ListingComponent.vue
@@ -92,7 +92,15 @@ const emit = defineEmits(["cancelDeposit", "withdrawDeposit"]);
         <img alt="Cancel image" src="@/assets/cancel.svg" />
       </div>
 
-      <span class="last-release-info" v-if="!props.isManageMode">
+      <span class="last-release-info" v-if="item.event == 'DepositAdded' && !props.isManageMode">
+        {{ "Oferta" }}
+      </span>
+
+      <span class="last-release-info" v-if="item.event == 'LockAdded' && !props.isManageMode">
+        {{ "Reserva" }}
+      </span>
+
+      <span class="last-release-info" v-if="item.event == 'LockReleased' && !props.isManageMode">
         {{ "Compra" }}
       </span>
 
diff --git a/src/router/index.ts b/src/router/index.ts
index 9684b60..a886d35 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -3,6 +3,7 @@ import HomeView from "../views/HomeView.vue";
 import MockView from "../views/MockView.vue";
 import BidHistoryView from "../views/BidHistoryView.vue";
 import ManageBidsView from "../views/ManageBidsView.vue";
+import DepositsHistoryView from "../views/DepositsHistoryView.vue";
 import SellerView from "@/views/SellerView.vue";
 
 const router = createRouter({
@@ -33,6 +34,11 @@ const router = createRouter({
       name: "manage bids",
       component: ManageBidsView,
     },
+    {
+      path: "/deposits_history",
+      name: "deposits history",
+      component: DepositsHistoryView,
+    },
   ],
 });
 
diff --git a/src/views/DepositsHistoryView.vue b/src/views/DepositsHistoryView.vue
new file mode 100644
index 0000000..3db8b02
--- /dev/null
+++ b/src/views/DepositsHistoryView.vue
@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import { useEtherStore } from "@/store/ether";
+import { storeToRefs } from "pinia";
+import { ref } from "vue";
+import ListingComponent from "@/components/ListingComponent.vue";
+import blockchain from "../utils/blockchain";
+
+const etherStore = useEtherStore();
+const { walletAddress } = storeToRefs(etherStore);
+const allUserTransactions = ref<any[]>([]);
+
+if (walletAddress.value != "") {
+  blockchain.listAllTransactionByWalletAddress(walletAddress.value).then((res) => {
+      allUserTransactions.value = res;
+    })
+}
+</script>
+
+<template>
+  <div class="page">
+    <div class="header">Histórico de Depósitos</div>
+    <ListingComponent
+      v-if="walletAddress != '' && allUserTransactions.length != 0"
+      :wallet-transactions="allUserTransactions"
+      :is-manage-mode="false"
+    ></ListingComponent>
+    <div v-if="walletAddress == ''">
+      Conecte sua carteira para ver o histórico
+    </div>
+    <div v-if="allUserTransactions.length == 0 && walletAddress != ''">
+      Carregando dados...
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.page {
+  @apply flex flex-col gap-10 mt-20 w-full;
+}
+
+.header {
+  @apply text-3xl text-gray-900 leading-9 font-bold justify-center flex;
+}
+</style>
\ No newline at end of file