From 0e3689a2d1e730c89fc91e8b2c0c8ed68c346eda Mon Sep 17 00:00:00 2001
From: cebgcontract <99630598+cebgcontract@users.noreply.github.com>
Date: Tue, 15 Mar 2022 17:26:54 +0800
Subject: [PATCH] =?UTF-8?q?wallet=E9=A1=B5=E9=9D=A2=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?=E9=93=BE=E5=88=87=E6=8D=A2=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/market/TopMenu.vue            |  8 ++---
 src/components/market/wallet/WalletPanel.vue | 32 +++++++++++++++++++-
 2 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/src/components/market/TopMenu.vue b/src/components/market/TopMenu.vue
index 731e1b6..7731cf1 100644
--- a/src/components/market/TopMenu.vue
+++ b/src/components/market/TopMenu.vue
@@ -13,13 +13,13 @@
         <a class="menu-item" href="/">
           <div class="item" >Home</div>
         </a>
-        <a class="menu-item" href="javascript:void(0)" @click.stop="comingSoon">
+        <a class="menu-item" href="/official" >
           <div class="item" :class="{'active': currentTab==='official'}">
             Official Shop
             <div class="active-bottom" v-if="currentTab==='official'"></div>
           </div>
         </a>
-        <a class="menu-item" href="javascript:void(0)" @click.stop="comingSoon">
+        <a class="menu-item" href="/market" >
           <div class="item " :class="{'active': currentTab==='market'}">
             Marketplace
             <div class="active-bottom" v-if="currentTab==='market'"></div>
@@ -63,8 +63,8 @@
     </div>
     <div class="nav overflow" v-if="mobile" :class="{'show': menuShow}">
       <a class="navItem" href="/">Home</a>
-      <a class="navItem" href="javascript:void(0);" @click.stop="comingSoon">Official Shop</a>
-      <a class="navItem dash" href="javascript:void(0);" @click.stop="comingSoon">Marketplace</a>
+      <a class="navItem" href="/official" >Official Shop</a>
+      <a class="navItem dash" href="/market">Marketplace</a>
       <label v-if="!logined" class="navItem" @click="collectToWallet">Connect Wallet</label>
       <button v-if="!logined" class="general-btn connectButton mobile" @click="collectToWallet">
         <span>Connect Wallet</span>
diff --git a/src/components/market/wallet/WalletPanel.vue b/src/components/market/wallet/WalletPanel.vue
index f693703..57994d0 100644
--- a/src/components/market/wallet/WalletPanel.vue
+++ b/src/components/market/wallet/WalletPanel.vue
@@ -13,6 +13,10 @@
       alt="icCopy"
       src="data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e %3cpath d='M20 9H11C9.89543 9 9 9.89543 9 11V20C9 21.1046 9.89543 22 11 22H20C21.1046 22 22 21.1046 22 20V11C22 9.89543 21.1046 9 20 9Z' stroke='%23BCADF2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' /%3e %3cpath d='M5 15H4C3.46957 15 2.96086 14.7893 2.58579 14.4142C2.21071 14.0391 2 13.5304 2 13V4C2 3.46957 2.21071 2.96086 2.58579 2.58579C2.96086 2.21071 3.46957 2 4 2H13C13.5304 2 14.0391 2.21071 14.4142 2.58579C14.7893 2.96086 15 3.46957 15 4V5' stroke='%23BCADF2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' /%3e %3c/svg%3e">
     </div>
+    <div class="tab-bar-net">
+      <div class="tab-item active"><span>KCC</span></div>
+      <div class="tab-item"><span>BSC</span></div>
+    </div>
     <div class="wallet">
       <total-balance></total-balance>
       <coin-card v-for="d in coinList" :coin-data="d" :key="d.symbol"></coin-card>
@@ -115,7 +119,33 @@ export default class WalletPanel extends Vue {
   box-sizing: border-box;
   color: white;
   width: 1440px;
-
+  .tab-bar-net {
+    display: flex;
+    flex-direction: row;
+    margin-bottom: 5px;
+    .tab-item{
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      flex: none;
+      cursor: pointer;
+      font-weight: bold;
+      font-size: 1em;
+      line-height: 1.5em;
+      padding: 0.5em 2.125em;
+      height: 2em;
+      color: #bcadf2;
+      background: transparent;
+      clip-path: polygon(10% 0, 100% 0, 90% 100%, 0% 100%);
+      &:not(:first-child) {
+        margin-left: -0.5em;
+      }
+      &.active {
+        color: #ffffff;
+        background: #413482;
+      }
+    }
+  }
   .code {
     display: flex;
     align-self: flex-start;