地址簿添加删除功能

src/stores/modules/systemStore.js

@@ -9,7 +9,8 @@ export const useSystemStore = defineStore("useSystemStore", {
     ISCREATE: false,
     stsClientInfo: {},
     Administrator: {},
-    DAPP_CACHE_KEY:[]
+    DAPP_CACHE_KEY:[],
+    AddressList:[]
   }),
   persist: true,
   getters: {

src/views/me/addAddress/index.vue

@@ -55,9 +55,12 @@
 </template>
 
 <script setup>
-import { showToast } from 'vant';
+import { useRouter } from 'vue-router'
 import { useWalletStore } from "@/stores/modules/walletStore";
+import { useSystemStore } from "@/stores/modules/systemStore";
+const systemStore = useSystemStore();
 const walletStore = useWalletStore();
+const router = useRouter();
 
 let hotTokensList = walletStore.tokenList;
 let selectTokenInfo = ref(walletStore.tokenList[0]);
@@ -75,7 +78,13 @@ const changeList = (item) => {
 }
 // 确认
 const confirm = () => {
-   
+    let item = {
+        img:selectTokenInfo.value.logo,
+        addressName:addressName.value,
+        walletAddress:walletAddress.value
+    }
+    systemStore.AddressList.push(item);
+    router.push('addressManagement')
 }
 </script>
 

src/views/me/addressManagement/index.vue

@@ -2,23 +2,30 @@
     <div class="container">
         <div class="content">
             <div class="card-box">
-                <div class="box-item" v-for="item in 3">
-                    <van-image
-                        width="32px"
-                        height="32px"
-                        round
-                        src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
-                    />
-                    <div class="card-text">
-                        <div>升华</div>
-                        <div class="address">121332546</div>
+                <van-swipe-cell v-for="(item,i) in list" :key="i">
+                    <div class="box-item" @click.stop="gotoPage(item.walletAddress)">
+                        <div style="flex-shrink: 0;">
+                            <van-image
+                                width="32px"
+                                height="32px"
+                                round
+                                :src="item.img"
+                            />
+                        </div>
+                        <div class="card-text">
+                            <div>{{item.addressName}}</div>
+                            <div class="address">{{item.walletAddress}}</div>
+                        </div>
                     </div>
-                </div>
+                    <template #right>
+                        <div class="delete" @click.stop="changeDelete(i)">删除</div>
+                    </template>
+                </van-swipe-cell>
             </div>
-            <!-- <div class="no-more">
+            <div class="no-more" v-if="list.length == 0">
                 <svg-icon style="width: 302px; height: 222px;" name="no-address"/>
                 <div class="no-more-text">暂无新地址</div>
-            </div> -->
+            </div>
         </div>
         <van-button class="footer-btn" size="large" @click="goToAdd">添加新地址</van-button>
     </div>
@@ -26,10 +33,26 @@
 
 <script setup>
 import { useRouter } from 'vue-router'
+import { useSystemStore } from "@/stores/modules/systemStore";
+const systemStore = useSystemStore();
 const router = useRouter();
+
+let list = ref(systemStore.AddressList);
 const goToAdd = () => {
     router.push('addAddress')
 }
+const gotoPage = (val) => {
+    router.push({
+        path: 'transferDetail',
+        query:{
+            address:val
+        }
+    })
+}
+const changeDelete = (index) => {
+    list.value.splice(index,1);
+    systemStore.AddressList = list.value;
+}
 </script>
 
 <style lang="less" scoped>
@@ -65,12 +88,18 @@ const goToAdd = () => {
                     .address{
                         font-size: 12px;
                         color: #8D8D8D;
+                        word-break: break-word;
                     }
                 }
             }
             .box-item:last-child{
                 border-bottom: 0;
             }
+            .delete{
+                height: 100%;
+                color: red;
+                margin-left: 15px;
+            }
         }
         .card-box::-webkit-scrollbar{
             width: 0;
@@ -102,4 +131,7 @@ const goToAdd = () => {
         color: #000000;
     }
 }
+:deep(.van-swipe-cell__right){
+    top:40%;
+}
 </style>

src/views/wallet/transferDetail/index.vue

@@ -102,17 +102,18 @@
 </template>
 
 <script setup>
-import { useRouter } from 'vue-router'
+import { useRouter,useRoute } from 'vue-router'
 import { useWalletStore } from "@/stores/modules/walletStore";
 import Web3 from "web3";
 import pubData from "@/utils/pub.json";
 import { showToast } from 'vant';
 import { showNotify } from 'vant';
 const router = useRouter();
+const route = useRoute();
 const walletStore = useWalletStore();
 const web3 = new Web3(walletStore.rpcUrl);
 
-const walletAddress = ref('')
+const walletAddress = ref(route.query.address || '');
 const unitNum = ref('')
 const showWallet = ref(false)
 const showPassWord = ref(false)