feat: client log

src/components/ClientNav.vue

@@ -14,6 +14,7 @@ export default {
         pay: 'panel-block',
         credit: 'panel-block',
         info: 'panel-block',
+        log: 'panel-block'
       }
     }
   }
@@ -59,15 +60,26 @@ export default {
         <p>掃描支付</p>
       </template>
     </RouterLink>
+    <RouterLink to="/client/log" :class="this.navCSS['log']">
+      <span class="panel-icon">
+        <i class="fas fa-book" aria-hidden="true"></i>
+      </span>
+      <template v-if="this.path == 'log'">
+        <strong>借款紀錄</strong>
+      </template>
+      <template v-else>
+        <p>借款紀錄</p>
+      </template>
+    </RouterLink>
     <RouterLink to="/client/credit" :class="this.navCSS['credit']">
       <span class="panel-icon">
         <i class="fas fa-book" aria-hidden="true"></i>
       </span>
       <template v-if="this.path == 'credit'">
-        <strong>信用紀錄</strong>
+        <strong>SBT信用紀錄</strong>
       </template>
       <template v-else>
-        <p>信用紀錄</p>
+        <p>SBT信用紀錄</p>
       </template>
     </RouterLink>
   </nav>

src/router/index.js

@@ -12,6 +12,7 @@ import ShopPayView from '../views/ShopPayView.vue'
 import ShopPayQRcodeView from '../views/ShopPayQRcodeView.vue'
 import ShopLogView from '../views/ShopLogView.vue'
 import OrderView from '../views/OrderView.vue'
+import ClientLogView from '../views/ClientLogView.vue'
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
@@ -81,6 +82,11 @@ const router = createRouter({
       name: 'order',
       component: OrderView
     },
+    {
+      path: '/client/log',
+      name: 'log',
+      component: ClientLogView
+    },
   ]
 })
 

src/views/ClientLogView.vue

@@ -0,0 +1,93 @@
+<script>
+import Web3 from 'web3';
+import SBT from '@/assets/SBT.json'
+import PageTitle from '../components/PageTitle.vue'
+import ClientNav from '../components/ClientNav.vue'
+import ShopNav from '../components/ShopNav.vue'
+
+export default {
+  components: { PageTitle, ClientNav, ShopNav },
+  data() {
+    return {
+      SBTAddress: import.meta.env.VITE_SBT_ADDR,
+      BankAddress: import.meta.env.VITE_BANK_ADDR,
+      clientAddr: '',
+      web3: null,
+      token: null,
+      log: [],
+    }
+  },
+  async mounted() {
+    this.web3 = new Web3(window.ethereum)
+    this.clientAddr = this.$cookies.get('address')
+    this.web3.eth.defaultAccount = this.clientAddr
+    this.token = new this.web3.eth.Contract(SBT, this.SBTAddress)
+
+    var borrow = await this.token.getPastEvents("Borrow", { fromBlock: 0, toBlock: 'latest', filter: { client: this.clientAddr, bank: this.BankAddress } })
+    console.log(borrow)
+    for (let i of borrow) {
+      let result = i.returnValues
+      let obj = {
+        bank: result['bank'],
+        shop: result['shop'],
+        client: result['client'],
+        id: result['id'],
+        amount: this.web3.utils.fromWei(result['amount'], 'ether'),
+      }
+      this.log.push(obj)
+    }
+  },
+  methods: {
+  }
+}
+</script>
+
+<template>
+  <section class="blog-posts">
+    <div class="container">
+      <div class="columns">
+        <div class="column is-2">
+          <ClientNav path="shoplog"></ClientNav>
+          <template v-if="this.$cookies.get('isShop') == 'true'">
+            <ShopNav path="shoplog"></ShopNav>
+          </template>
+
+        </div>
+        <div class="column">
+          <div class="container">
+            <div class="block">
+              <PageTitle title="借款紀錄" subtitle="查詢透過本銀行進行支付的所有紀錄"></PageTitle>
+            </div>
+            <div class="block">
+              <h1 class="title is-4">收款紀錄</h1>
+              <table class="table is-fullwidth is-striped is-hoverable">
+                <thead>
+                  <tr>
+                    <th>#</th>
+                    <th>店家</th>
+                    <th>銀行</th>
+                    <th>帳款編號</th>
+                    <th>金額</th>
+                    <th>詳細訂單狀況</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <template v-for="(value, index) of log">
+                    <tr>
+                      <th>{{ index }}</th>
+                      <td>{{ value.shop }}</td>
+                      <td>{{ value.bank }}</td>
+                      <td>#{{ value.id }}</td>
+                      <td>{{ value.amount }} ETH</td>
+                      <td><RouterLink :to="'/order/'+value.id" class="button is-info is-outlined">查詢</RouterLink></td>
+                    </tr>
+                  </template>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</template>

src/views/ClientMainView.vue

@@ -92,9 +92,15 @@ export default {
                           <!-- <p class="subtitle">Top tile</p> -->
                         </article>
                       </RouterLink>
+                      <RouterLink to="/client/log" class="tile is-child notification is-info">
+                        <article>
+                          <p class="title"><i class="fas fa-history"></i> 借款紀錄</p>
+                          <!-- <p class="subtitle">Top tile</p> -->
+                        </article>
+                      </RouterLink>
                       <RouterLink to="/client/credit" class="tile is-child notification is-info">
                         <article>
-                          <p class="title"><i class="fas fa-history"></i> 信用紀錄</p>
+                          <p class="title"><i class="fas fa-cubes"></i> SBT信用紀錄</p>
                           <!-- <p class="subtitle">Top tile</p> -->
                         </article>
                       </RouterLink>
@@ -102,19 +108,19 @@ export default {
                       <template v-if="this.isShop">
                         <RouterLink to="/shop/pay" class="tile is-child notification is-info">
                           <article>
-                            <p class="title"><i class="fas fa-history"></i> 店家結帳</p>
+                            <p class="title"><i class="fas fa-cash-register"></i> 店家結帳</p>
                             <!-- <p class="subtitle">Top tile</p> -->
                           </article>
                         </RouterLink>
                         <RouterLink to="/shop/log" class="tile is-child notification is-info">
                           <article>
-                            <p class="title"><i class="fas fa-history"></i> 店家收款紀錄</p>
+                            <p class="title"><i class="fas fa-receipt"></i> 店家收款紀錄</p>
                             <!-- <p class="subtitle">Top tile</p> -->
                           </article>
                         </RouterLink>
                         <RouterLink to="/shop/products" class="tile is-child notification is-info">
                           <article>
-                            <p class="title"><i class="fas fa-history"></i> 店家商品管理</p>
+                            <p class="title"><i class="fas fa-box-open"></i> 店家商品管理</p>
                             <!-- <p class="subtitle">Top tile</p> -->
                           </article>
                         </RouterLink>

src/views/ShopLogView.vue

@@ -10,6 +10,7 @@ export default {
   data() {
     return {
       SBTAddress: import.meta.env.VITE_SBT_ADDR,
+      BankAddress: import.meta.env.VITE_BANK_ADDR,
       clientAddr: '',
       web3: null,
       token: null,
@@ -22,7 +23,7 @@ export default {
     this.web3.eth.defaultAccount = this.clientAddr
     this.token = new this.web3.eth.Contract(SBT, this.SBTAddress)
 
-    var borrow = await this.token.getPastEvents("Borrow", { fromBlock: 0, toBlock: 'latest', filter: { shop: this.clientAddr } })
+    var borrow = await this.token.getPastEvents("Borrow", { fromBlock: 0, toBlock: 'latest', filter: { shop: this.clientAddr, bank: this.BankAddress } })
     console.log(borrow)
     for (let i of borrow) {
       let result = i.returnValues