From 164d68a484216cfdea380daefecda680dbdd216a Mon Sep 17 00:00:00 2001
From: CounterFire2023 <136581895+CounterFire2023@users.noreply.github.com>
Date: Wed, 17 Jul 2024 13:35:12 +0800
Subject: [PATCH] =?UTF-8?q?navbar=20=E5=A2=9E=E5=8A=A0=E5=A4=8D=E5=88=B6?=
 =?UTF-8?q?=E9=92=B1=E5=8C=85=E5=9C=B0=E5=9D=80=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/layout/NavBar.vue | 33 ++++++++++++++++++++++----------
 1 file changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/components/layout/NavBar.vue b/src/components/layout/NavBar.vue
index 7321e29..08043d6 100644
--- a/src/components/layout/NavBar.vue
+++ b/src/components/layout/NavBar.vue
@@ -47,8 +47,11 @@
         </div>
         <div class="metaMask-login" v-if="!localWalletStore.address" @click="immuTableLogin">Login</div>
         <div class="metaMask-login-active" v-else @click="showMenu = !showMenu">
-          <div class="matamask">
+          <div class="metamask">
             <div class="title">{{ localWalletStore.showAddress }}</div>
+            <svg @click="handleCopy" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M11.35 3.836c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75 2.25 2.25 0 0 0-.1-.664m-5.8 0A2.251 2.251 0 0 1 13.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m8.9-4.414c.376.023.75.05 1.124.08 1.131.094 1.976 1.057 1.976 2.192V16.5A2.25 2.25 0 0 1 18 18.75h-2.25m-7.5-10.5H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V18.75m-7.5-10.5h6.375c.621 0 1.125.504 1.125 1.125v9.375m-8.25-3 1.5 1.5 3-3.75" />
+            </svg>
           </div>
           <div class="menu" v-show="showMenu">
             <div class="menu-item" @click="immuTableLogout">Logout</div>
@@ -62,7 +65,8 @@
 </template>
 
 <script setup>
-import { ref, reactive, onMounted, computed, watchEffect, getCurrentInstance, watch } from "vue";
+import { ref, reactive, onMounted, computed, watchEffect, getCurrentInstance, watch, inject } from "vue";
+const message = inject('$message')
 const { proxy } = getCurrentInstance();
 import { useAppStore } from "@/store/app";
 import { hasMetamask } from "@/utils/chain.util";
@@ -155,9 +159,9 @@ function click(event) {
 //const { copied, copyToClipboard } = useCopyToClipboard(AppModule.accountId);
 const { copied, error, reset, copyToClipboard } = useCopyToClipboard();
 
-const message = copied.value
-  ? "Text copied!"
-  : "Click the button to copy text.";
+// const message = copied.value
+//   ? "Text copied!"
+//   : "Click the button to copy text.";
 
 
 
@@ -190,13 +194,14 @@ function handNavCurent(nav) {
 function openThirdPartyLink(url) {
   window.open(url, "_blank");
 }
-const handleCopy = () => {
-  const accountId = AppModule.accountId;
+const handleCopy = (e) => {
+  e.stopPropagation();
+  const accountId = localWalletStore.address;
   reset();
   copyToClipboard(accountId).then(() => {
-    // if (copied.value) {
-    //   message.success("Copy successful!");
-    // }
+    if (copied.value) {
+      message.success("address copied");
+    }
   });
 };
 watchEffect(() => {
@@ -594,6 +599,14 @@ onMounted( async () => {
     a:hover {
       background-color: #f5f5f5;
     }
+    .metamask{
+      display: flex;
+      svg {
+        width: 24px;
+        height: 24px;
+        margin-left: 6px;
+      }
+    }
   }
   .immutable-cart {
     color: #fff;