zramsay/cosmos-explorer
1
0
Fork 0
forked from cerc-io/cosmos-explorer
Code Pull Requests Actions Activity

feat: nav bar wallet address

Browse Source
This commit is contained in:
Alisa | Side.one 2023-05-14 23:24:20 +08:00
parent e5ad564826
commit 1e1472e0d5
2 changed files with 38 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/layouts/components/DefaultLayout.vue
View File

@ -11,7 +11,6 @@ import UserProfile from '@/layouts/components/ChainProfile.vue';
import { useDashboard } from '@/stores/useDashboard'; import { useDashboard } from '@/stores/useDashboard';
import NavBarI18n from './NavBarI18n.vue'; import NavBarI18n from './NavBarI18n.vue';
import NavBarNotifications from './NavBarNotifications.vue';
import NavBarWallet from './NavBarWallet.vue'; import NavBarWallet from './NavBarWallet.vue';
import { useBlockchain } from '@/stores'; import { useBlockchain } from '@/stores';
@ -64,7 +63,11 @@ const changeOpen = (index: Number) => {
'collapse-close': index === 0 && !sidebarOpen, 'collapse-close': index === 0 && !sidebarOpen,
}" }"
> >
<input type="checkbox" class="cursor-pointer" @click="changeOpen(index)" /> <input
type="checkbox"
class="cursor-pointer"
@click="changeOpen(index)"
/>
<div <div
class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]" class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]"
> >
@ -190,6 +193,8 @@ const changeOpen = (index: Number) => {
<NavBarWallet <NavBarWallet
class="block truncate md:inline-block text-xs md:text-sm" class="block truncate md:inline-block text-xs md:text-sm"
/> />
</div> </div>
<!-- 👉 Pages --> <!-- 👉 Pages -->

43
src/layouts/components/NavBarWallet.vue
View File

@ -8,30 +8,37 @@ walletStore.$subscribe((m, s) => {
</script> </script>
<template> <template>
<div> <div
<div v-if="walletStore.currentAddress" v-show="walletStore.currentAddress"
class="dropdown dropdown-hover ping-connect-dropdown" class="dropdown dropdown-hover dropdown-end"
> >
<label tabindex="3" class="btn m-1" >{{ walletStore.shortAddress }}</label> <label tabindex="0" class="btn btn-sm m-1 lowercase">{{ walletStore.shortAddress }}</label>
<ul <div
tabindex="3" tabindex="0"
class="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-52" class="dropdown-content menu shadow p-2 bg-base-100 rounded w-64 overflow-auto"
> >
<li> <div class="px-2 mb-1 text-gray-500 dark:text-gray-400 font-semibold">
<a>{{ walletStore.connectedWallet }}</a> {{ walletStore.connectedWallet?.wallet }}
</li> </div>
<li> <div class="">
<a>{{ walletStore.currentAddress }}</a> <a
</li> class="block py-2 px-2 hover:bg-gray-100 dark:hover:bg-[#353f5a] rounded cursor-pointer"
<div class="divider"></div> style="overflow-wrap: anywhere"
<li><a @click="walletStore.disconnect()">Disconnected</a></li> >
</ul> {{ walletStore.currentAddress }}
</a>
<a
class="block py-2 px-2 hover:bg-gray-100 dark:hover:bg-[#353f5a] rounded cursor-pointer"
@click="walletStore.disconnect()"
>Disconnected</a
>
</div>
</div>
</div> </div>
<label <label
v-else v-if="!walletStore?.currentAddress"
for="PingConnectWallet" for="PingConnectWallet"
class="btn btn-sm ml-4 ping-connect-btn" class="btn btn-sm ml-4 ping-connect-btn"
>Connect Wallet</label >Connect Wallet</label
> >
</div>
</template> </template>