fave3722
/
metaforce-scan
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

footer修改

master
fave3722 3 years ago
parent
31e344c73d
commit
4d115f199f
13 changed files with 83 additions and 44 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      components.d.ts
  2. BIN
      dist.zip
  3. 11
      src/App.vue
  4. 48
      src/components/footer.vue
  5. 14
      src/components/table/desktop/tokensDetails.vue
  6. 20
      src/pages/BitcNFt/cards.vue
  7. 7
      src/pages/BitcNFt/centerContent.vue
  8. 3
      src/pages/BitcNFt/index.vue
  9. 5
      src/pages/HomePage/index.vue
  10. 3
      src/pages/TableBlock/index.vue
  11. 1
      src/pages/VNFT/centerContent.vue
  12. 3
      src/pages/VNFT/index.vue
  13. 6
      src/style.scss

6
components.d.ts
View File

@ -10,8 +10,6 @@ declare module '@vue/runtime-core' {
BkRow: typeof import('./src/components/table/dBase/bkRow.vue')['default']
BkTable: typeof import('./src/components/table/desktop/bkTable.vue')['default']
BkTableDetails: typeof import('./src/components/table/desktop/bkTableDetails.vue')['default']
Card: typeof import('./src/components/table/base/card.vue')['default']
ColRow: typeof import('./src/components/table/mBase/colRow.vue')['default']
DetailsRow: typeof import('./src/components/table/dBase/detailsRow.vue')['default']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput']
@ -19,8 +17,6 @@ declare module '@vue/runtime-core' {
ElPagination: typeof import('element-plus/es')['ElPagination']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSelectV2: typeof import('element-plus/es')['ElSelectV2']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTabPane: typeof import('element-plus/es')['ElTabPane']
ElTabs: typeof import('element-plus/es')['ElTabs']
Footer: typeof import('./src/components/footer.vue')['default']
@ -32,7 +28,6 @@ declare module '@vue/runtime-core' {
NowrapRow: typeof import('./src/components/table/mBase/nowrapRow.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
Row: typeof import('./src/components/table/row.vue')['default']
THeader: typeof import('./src/components/table/dBase/tHeader.vue')['default']
TokensDetails: typeof import('./src/components/table/desktop/tokensDetails.vue')['default']
TokensDetailsRow: typeof import('./src/components/table/dBase/tokensDetailsRow.vue')['default']
@ -41,7 +36,6 @@ declare module '@vue/runtime-core' {
TransactDetails: typeof import('./src/components/table/desktop/transactDetails.vue')['default']
TransactDetailsRow: typeof import('./src/components/table/dBase/transactDetailsRow.vue')['default']
TransactTable: typeof import('./src/components/table/desktop/transactTable.vue')['default']
TRow: typeof import('./src/components/table/base/tRow.vue')['default']
UpperLowerSwitch: typeof import('./src/components/base/UpperLowerSwitch.vue')['default']
}
}

BIN
dist.zip
View File

Binary file not shown.

11
src/App.vue
View File

@ -1,10 +1,17 @@
<template>
<div>
<div class="bg-black w-full max-w-[1440px]">
<!-- <router-link to="/">首页</router-link>&nbsp;
<router-link to="/TableBlock">block</router-link>&nbsp;
<hr /> -->
<router-view></router-view>
</div>
<div
class="w-full flex items-center justify-center bg-black-19191A desktop:mt-[108px] mobile:mt-[48px]"
>
<Footer />
</div>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import Footer from '@src/components/footer.vue'
</script>
<style scoped></style>

48
src/components/footer.vue
View File

@ -1,21 +1,44 @@
<template>
<div
class="bg-black-19191A desktop:mt-[108px] desktop:pt-[42px] desktop:px-[120px] mobile:mt-[48px] mobile:px-[20px] mobile:pt-[28px] pb-[26px]"
class="bg-black-19191A desktop:w-[1440px] desktop:pt-[42px] desktop:px-[120px] mobile:px-[20px] mobile:pt-[28px] pb-[26px]"
>
<div class="flex flex-1 desktop:flex-row mobile:flex-col justify-between">
<!-- 左侧 -->
<div class="flex flex-row">
<div class="flex flex-row text-[15px] text-gray-BBB">
<div class="w-[134px]">
<p class="pb-[22px] text-[15px] text-white">Tokens</p>
<p class="pb-[22px] text-[15px] text-gray-BBB">NFT</p>
<p class="pb-[22px] text-[15px] text-gray-BBB">VNFT</p>
<p class="pb-[22px] text-[15px] text-gray-BBB">KNFT</p>
<p class="pb-[22px] text-[15px] text-green-1DE9B6">More</p>
<p
class="pb-[22px] cursor-pointer text-white"
@click="jumpRoute('BitcNFT')"
>
Tokens
</p>
<p class="pb-[22px] cursor-pointer" @click="jumpRoute('VNFT')">NFT</p>
<p class="pb-[22px] cursor-pointer" @click="jumpRoute('VNFT')">
VNFT
</p>
<p class="pb-[22px] cursor-pointer" @click="jumpRoute('VNFT')">
KNFT
</p>
<p
class="pb-[22px] cursor-pointer text-green-1DE9B6"
@click="jumpRoute('VNFT')"
>
More
</p>
</div>
<div class="w-[134px]">
<p class="pb-[22px] text-[15px] text-white">Blockchain</p>
<p class="pb-[22px] text-[15px] text-gray-BBB">View Blocks</p>
<p class="pb-[22px] text-[15px] text-gray-BBB">View Txs</p>
<p
class="pb-[22px] cursor-pointer text-white"
@click="jumpRoute('VNFT')"
>
Blockchain
</p>
<p class="pb-[22px] cursor-pointer" @click="jumpRoute('VNFT')">
View Blocks
</p>
<p class="pb-[22px] cursor-pointer" @click="jumpRoute('VNFT')">
View Txs
</p>
</div>
</div>
<!-- 右侧 -->
@ -43,6 +66,11 @@
<script setup lang="ts">
import * as iconList from '@src/assets/Icons/index'
import router from '@src/routes'
const jumpRoute = (route: string) => {
router.push(route)
}
</script>
<style lang="scss" scoped></style>

14
src/components/table/desktop/tokensDetails.vue
View File

@ -39,7 +39,7 @@ onMounted(() => {
setTimeout(() => {
data.value = {
balance: '123321',
tokens: [1, 2, 3, 4],
tokens: '0x5c63abfad4563327a24741ec85aa0701530444c9',
transactions: '123321',
transfers: '123321',
gasUsed: '123321',
@ -49,7 +49,7 @@ onMounted(() => {
})
const data = ref<any>({
balance: '123321',
tokens: [1, 2],
tokens: '0x5c63abfad4563327a24741ec85aa0701530444c9',
transactions: '123321',
transfers: '123321',
gasUsed: '123321',
@ -59,14 +59,10 @@ const invariable = {
...tokensDetailsCollocate,
}
const qrURL = ref('https://example.com')
onMounted(async () => {
qrURL.value = await Qrcode.toDataURL('https://baidu.com')
})
let open = () => {
let open = async () => {
const res = await Qrcode.toDataURL('https://baidu.com' as string)
// 二维码生成之后
ElMessageBox.alert(`<img src="${qrURL.value}" class="w-[318px]" />`, {
ElMessageBox.alert(`<img src="${res}" class="w-[318px]" />`, {
showClose: false,
closeOnClickModal: true,
dangerouslyUseHTMLString: true,

20
src/pages/BitcNFt/cards.vue
View File

@ -10,7 +10,7 @@
<p class="text-white">{{ value }}</p>
<div class="flex flex-row">
<Icons :url="'copyAddress'" :size="32" />
<div>
<div @click="open">
<Icons :url="'qrCode'" :size="32" class="ml-[16px]" />
</div>
</div>
@ -53,12 +53,28 @@
<script setup lang="ts">
import Icons from '@src/components/icons/index.vue'
defineProps({
import { ElMessageBox } from 'element-plus'
import Qrcode from 'qrcode'
const props = defineProps({
title: String,
value: String,
options: Array as any,
url: String,
qrcodeurl: String,
})
let open = async () => {
const res = await Qrcode.toDataURL(props?.qrcodeurl as string)
// 二维码生成之后
ElMessageBox.alert(`<img src="${res}" class="w-[318px]" />`, {
showClose: false,
closeOnClickModal: true,
dangerouslyUseHTMLString: true,
confirmButtonText: 'close',
confirmButtonClass: 'text-white btn_modal',
customClass: 'bg-modal-wrap',
})
}
</script>
<style lang="scss" scoped>

7
src/pages/BitcNFt/centerContent.vue
View File

@ -2,7 +2,12 @@
<div
class="tableBlock-tabs desktop:mt-[-435.5px] mobile:mt-[-51px] desktop:px-[120px] mobile:px-[20px]"
>
<Cards :title="'BitcNFt'" :value="value" :options="options" />
<Cards
:title="'BitcNFt'"
:value="value"
:options="options"
:qrcodeurl="'https://baidu.com'"
/>
<div
class="flex flex-1 w-full bg-black-19191A mt-[56px] rounded-[10px] overflow-hidden"
>

3
src/pages/BitcNFt/index.vue
View File

@ -60,15 +60,14 @@
</div>
</div>
<center-content />
<Footer />
</div>
</template>
<script setup lang="ts">
import { Search } from '@element-plus/icons-vue'
import Footer from '@src/components/footer.vue'
import { ref } from 'vue'
import * as iconList from '../../assets/Icons/index'
import router from '@src/routes'
import centerContent from './centerContent.vue'

5
src/pages/HomePage/index.vue
View File

@ -7,11 +7,9 @@
<img
:src="iconList.label"
class="desktop:w-[70px] desktop:h-[40px] mobile:w-[40px] mobile:h-[24px]"
@click="jumpRoute('BitcNFT')"
/>
<span
class="desktop:text-[50px] mobile:text-[24px] font-semibold text-white ml-[16px]"
@click="jumpRoute('VNFT')"
>MetaForce Scan</span
>
</div>
@ -94,8 +92,6 @@
</div>
</div>
</div>
<!-- footer -->
<Footer />
</div>
</template>
@ -105,7 +101,6 @@ import hpCard from '@src/components/base/hp_card.vue'
import * as iconList from '../../assets/Icons/index'
import router from '@src/routes'
import HpTable from '@src/components/table/desktop/hpTable.vue'
import Footer from '../../components/footer.vue'
import { ref } from 'vue'
// 中间顶部渲染的数据

3
src/pages/TableBlock/index.vue
View File

@ -50,7 +50,6 @@
</div>
</div>
<router-view></router-view>
<Footer />
</div>
</template>
@ -58,7 +57,6 @@
import { defineComponent } from '@vue/runtime-core'
import { Search } from '@element-plus/icons-vue'
import Block from './Block/index.vue'
import Footer from '@src/components/footer.vue'
import Transactions from './Transactions/index.vue'
import Tokens from './Tokens/index.vue'
import type { TabsPaneContext } from 'element-plus'
@ -70,7 +68,6 @@ export default defineComponent({
Block,
Transactions,
Tokens,
Footer,
},
setup() {
return {

1
src/pages/VNFT/centerContent.vue
View File

@ -7,6 +7,7 @@
:value="'Token ID:' + value"
:options="options"
:url="'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fphoto%2F2012-3-2%2Fenterdesk.com-B526ECADD33DBD367676A93E051BA1EC.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1664699626&t=88f6e0508707a9ea0bec9c5a9f7c9d67'"
:qrcodeurl="'https://www.4399.com'"
/>
<div
class="flex flex-1 w-full bg-black-19191A mt-[56px] pb-[28px] rounded-[10px] overflow-hidden"

3
src/pages/VNFT/index.vue
View File

@ -60,14 +60,11 @@
</div>
</div>
<center-content />
<Footer />
</div>
</template>
<script setup lang="ts">
import { Search } from '@element-plus/icons-vue'
import Footer from '@src/components/footer.vue'
import router from '@src/routes'
import { ref } from 'vue'
import * as iconList from '../../assets/Icons/index'

6
src/style.scss
View File

@ -30,6 +30,7 @@ body {
// place-items: center;
// min-width: 320px;
// min-height: 100vh;
background: #000000;
}
h1 {
@ -61,8 +62,11 @@ button:focus-visible {
}
#app {
max-width: 1440px;
// max-width: 1440px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
padding: 0;
}

Write Preview
Loading…
Cancel
Save