fix: NavBarWallet Warning
This commit is contained in:
parent
6a9823893c
commit
9e738d3277
@ -20,10 +20,10 @@ const dashboard = useDashboard();
|
|||||||
dashboard.initial();
|
dashboard.initial();
|
||||||
const blockchain = useBlockchain();
|
const blockchain = useBlockchain();
|
||||||
|
|
||||||
const current = ref("")
|
const current = ref('');
|
||||||
blockchain.$subscribe((m, s) => {
|
blockchain.$subscribe((m, s) => {
|
||||||
if(current.value != s.chainName) {
|
if (current.value != s.chainName) {
|
||||||
current.value = s.chainName
|
current.value = s.chainName;
|
||||||
blockchain.initial();
|
blockchain.initial();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@ -36,7 +36,7 @@ const changeOpen = (index: Number) => {
|
|||||||
sidebarOpen.value = !sidebarOpen.value;
|
sidebarOpen.value = !sidebarOpen.value;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const showDiscord = window.location.host.search("ping.pub") > -1
|
const showDiscord = window.location.host.search('ping.pub') > -1;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -51,7 +51,10 @@ const showDiscord = window.location.host.search("ping.pub") > -1
|
|||||||
<h1 class="flex-1 ml-3 text-2xl font-semibold dark:text-white">
|
<h1 class="flex-1 ml-3 text-2xl font-semibold dark:text-white">
|
||||||
Ping.pub
|
Ping.pub
|
||||||
</h1>
|
</h1>
|
||||||
<div class="pr-4 cursor-pointer xl:!hidden" @click="sidebarShow = false">
|
<div
|
||||||
|
class="pr-4 cursor-pointer xl:!hidden"
|
||||||
|
@click="sidebarShow = false"
|
||||||
|
>
|
||||||
<Icon icon="mdi-close" class="text-3xl" />
|
<Icon icon="mdi-close" class="text-3xl" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -95,7 +98,8 @@ const showDiscord = window.location.host.search("ping.pub") > -1
|
|||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-if="item?.badgeContent"
|
v-if="item?.badgeContent"
|
||||||
class="mr-6 badge badge-sm" :class="item?.badgeClass"
|
class="mr-6 badge badge-sm"
|
||||||
|
:class="item?.badgeClass"
|
||||||
>
|
>
|
||||||
{{ item?.badgeContent }}
|
{{ item?.badgeContent }}
|
||||||
</div>
|
</div>
|
||||||
@ -165,7 +169,8 @@ const showDiscord = window.location.host.search("ping.pub") > -1
|
|||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
v-if="item?.badgeContent"
|
v-if="item?.badgeContent"
|
||||||
class="mr-6 badge badge-sm" :class="item?.badgeClass"
|
class="mr-6 badge badge-sm"
|
||||||
|
:class="item?.badgeClass"
|
||||||
>
|
>
|
||||||
{{ item?.badgeContent }}
|
{{ item?.badgeContent }}
|
||||||
</div>
|
</div>
|
||||||
@ -181,37 +186,67 @@ const showDiscord = window.location.host.search("ping.pub") > -1
|
|||||||
<div class="px-4 text-sm pt-4 text-gray-400 pb-2 uppercase">
|
<div class="px-4 text-sm pt-4 text-gray-400 pb-2 uppercase">
|
||||||
Sponsors
|
Sponsors
|
||||||
</div>
|
</div>
|
||||||
<a href="https://osmosis.zone" class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]">
|
<a
|
||||||
<img src="https://ping.pub/logos/osmosis.jpg" class="w-6 h-6 rounded-full mr-3"/>
|
href="https://osmosis.zone"
|
||||||
<div class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200">
|
class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src="https://ping.pub/logos/osmosis.jpg"
|
||||||
|
class="w-6 h-6 rounded-full mr-3"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200"
|
||||||
|
>
|
||||||
Osmosis
|
Osmosis
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<a href="https://becole.com" class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]">
|
<a
|
||||||
<img src="https://becole.com/static/logo/logo_becole.png" class="w-6 h-6 rounded-full mr-3"/>
|
href="https://becole.com"
|
||||||
<div class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200">
|
class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src="https://becole.com/static/logo/logo_becole.png"
|
||||||
|
class="w-6 h-6 rounded-full mr-3"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200"
|
||||||
|
>
|
||||||
Becole
|
Becole
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<div class="px-4 text-sm pt-4 text-gray-400 pb-2 uppercase">
|
<div class="px-4 text-sm pt-4 text-gray-400 pb-2 uppercase">Links</div>
|
||||||
Links
|
<a
|
||||||
</div>
|
href="https://twitter.com/ping_pub"
|
||||||
<a href="https://twitter.com/ping_pub" 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]"
|
||||||
<Icon icon="mdi:twitter" class="text-xl mr-2"/>
|
>
|
||||||
<div class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200">
|
<Icon icon="mdi:twitter" class="text-xl mr-2" />
|
||||||
|
<div
|
||||||
|
class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200"
|
||||||
|
>
|
||||||
Twitter
|
Twitter
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<a v-if="showDiscord" href="https://discord.com/invite/CmjYVSr6GW" class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]">
|
<a
|
||||||
<Icon icon="mdi:discord" class="text-xl mr-2"/>
|
v-if="showDiscord"
|
||||||
<div class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200">
|
href="https://discord.com/invite/CmjYVSr6GW"
|
||||||
|
class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]"
|
||||||
|
>
|
||||||
|
<Icon icon="mdi:discord" class="text-xl mr-2" />
|
||||||
|
<div
|
||||||
|
class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200"
|
||||||
|
>
|
||||||
Discord
|
Discord
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<a href="https://github.com/ping-pub/explorer/discussions" class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]">
|
<a
|
||||||
<Icon icon="mdi:frequently-asked-questions" class="text-xl mr-2"/>
|
href="https://github.com/ping-pub/explorer/discussions"
|
||||||
<div class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200">
|
class="collapse-title px-4 flex items-center py-2 hover:bg-gray-100 dark:hover:bg-[#373f59]"
|
||||||
|
>
|
||||||
|
<Icon icon="mdi:frequently-asked-questions" class="text-xl mr-2" />
|
||||||
|
<div
|
||||||
|
class="text-base capitalize flex-1 text-gray-700 dark:text-gray-200"
|
||||||
|
>
|
||||||
FAQ
|
FAQ
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
@ -237,9 +272,7 @@ const showDiscord = window.location.host.search("ping.pub") > -1
|
|||||||
<NavBarI18n class="hidden md:!inline-block" />
|
<NavBarI18n class="hidden md:!inline-block" />
|
||||||
<NavbarThemeSwitcher class="!inline-block" />
|
<NavbarThemeSwitcher class="!inline-block" />
|
||||||
|
|
||||||
<NavBarWallet
|
<NavBarWallet />
|
||||||
class="hidden truncate md:!inline-block text-xs md:!text-sm"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 👉 Pages -->
|
<!-- 👉 Pages -->
|
||||||
|
@ -4,7 +4,7 @@ import { Icon } from '@iconify/vue';
|
|||||||
import { ref, computed } from 'vue';
|
import { ref, computed } from 'vue';
|
||||||
const walletStore = useWalletStore();
|
const walletStore = useWalletStore();
|
||||||
const chainStore = useBlockchain();
|
const chainStore = useBlockchain();
|
||||||
const baseStore = useBaseStore()
|
const baseStore = useBaseStore();
|
||||||
// walletStore.$subscribe((m, s) => {
|
// walletStore.$subscribe((m, s) => {
|
||||||
// console.log(m, s);
|
// console.log(m, s);
|
||||||
// });
|
// });
|
||||||
@ -31,18 +31,18 @@ const tipMsg = computed(() => {
|
|||||||
? { class: 'error', msg: 'Copy Error!' }
|
? { class: 'error', msg: 'Copy Error!' }
|
||||||
: { class: 'success', msg: 'Copy Success!' };
|
: { class: 'success', msg: 'Copy Success!' };
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div class="dropdown dropdown-hover dropdown-end">
|
||||||
class="dropdown dropdown-hover dropdown-end"
|
<label
|
||||||
|
tabindex="0"
|
||||||
|
class="btn btn-sm m-1 lowercase hidden truncate md:!inline-flex text-xs md:!text-sm"
|
||||||
>
|
>
|
||||||
<label tabindex="0" class="btn btn-sm m-1 lowercase">
|
<Icon icon="mdi:wallet" />
|
||||||
<Icon icon="mdi:wallet"/>
|
|
||||||
<span class="ml-1 hidden md:block">
|
<span class="ml-1 hidden md:block">
|
||||||
{{ walletStore.shortAddress || "Wallet" }}</span>
|
{{ walletStore.shortAddress || 'Wallet' }}</span
|
||||||
|
>
|
||||||
</label>
|
</label>
|
||||||
<div
|
<div
|
||||||
tabindex="0"
|
tabindex="0"
|
||||||
@ -52,7 +52,9 @@ const tipMsg = computed(() => {
|
|||||||
v-if="!walletStore?.currentAddress"
|
v-if="!walletStore?.currentAddress"
|
||||||
for="PingConnectWallet"
|
for="PingConnectWallet"
|
||||||
class="btn btn-sm"
|
class="btn btn-sm"
|
||||||
><Icon icon="mdi:wallet"/><span class="ml-1 hidden md:block">Connect Wallet</span></label
|
><Icon icon="mdi:wallet" /><span class="ml-1 hidden md:block"
|
||||||
|
>Connect Wallet</span
|
||||||
|
></label
|
||||||
>
|
>
|
||||||
<div class="px-2 mb-1 text-gray-500 dark:text-gray-400 font-semibold">
|
<div class="px-2 mb-1 text-gray-500 dark:text-gray-400 font-semibold">
|
||||||
{{ walletStore.connectedWallet?.wallet }}
|
{{ walletStore.connectedWallet?.wallet }}
|
||||||
@ -100,9 +102,7 @@ const tipMsg = computed(() => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="footer-modal">
|
|
||||||
<Teleport to="body">
|
<Teleport to="body">
|
||||||
<ping-connect-wallet
|
<ping-connect-wallet
|
||||||
:chain-id="baseStore.currentChainId"
|
:chain-id="baseStore.currentChainId"
|
||||||
@ -110,7 +110,6 @@ const tipMsg = computed(() => {
|
|||||||
@connect="walletStateChange"
|
@connect="walletStateChange"
|
||||||
/>
|
/>
|
||||||
</Teleport>
|
</Teleport>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
@ -15,7 +15,18 @@ import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite';
|
|||||||
// https://vitejs.dev/config/
|
// https://vitejs.dev/config/
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [
|
plugins: [
|
||||||
vue(),
|
vue({
|
||||||
|
template: {
|
||||||
|
compilerOptions: {
|
||||||
|
isCustomElement: (tag) =>
|
||||||
|
[
|
||||||
|
'ping-connect-wallet',
|
||||||
|
'ping-token-convert',
|
||||||
|
'ping-tx-dialog',
|
||||||
|
].includes(tag),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}),
|
||||||
vueJsx(),
|
vueJsx(),
|
||||||
vuetify({
|
vuetify({
|
||||||
styles: {
|
styles: {
|
||||||
|
Loading…
Reference in New Issue
Block a user