@peng_kai/kit 0.0.14 → 0.0.15

package/admin/components/scroll-nav/src/ScrollNav.vue

@@ -1,59 +1,59 @@
-<script setup lang="ts">
-import { computed } from "vue";
-import { useElementSize } from '@vueuse/core'
-
-const props = defineProps<{
-  selector: string
-}>()
-
-const $content = document.querySelector(props.selector) as HTMLElement
-const $contentParent = $content.parentElement
-const { height: contentParentH } = useElementSize($contentParent)
-const { height: contentH } = useElementSize($content)
-const visible = computed(() => contentParentH.value * 2 < contentH.value)
-
-function scrollTo(top: number) {
-  $contentParent?.scrollTo({ top })
-}
-</script>
-
-<template>
-  <div v-if="visible" class="wrapper">
-    <div class="btn" @click="scrollTo(0)">
-      <i class="i-fluent:arrow-previous-24-filled rotate-90" />
-    </div>
-    <div class="btn" @click="scrollTo($contentParent?.scrollHeight ?? Infinity)">
-      <i class="i-fluent:arrow-previous-24-filled rotate-270" />
-    </div>
-    <!-- <div v-if="showReturn" class="btn" @click="toLastY()">
-      <i class="i-fluent:arrow-hook-down-left-24-filled rotate-270" />
-    </div> -->
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.wrapper {
-  font-size: 18px;
-}
-
-.btn {
-  display: flex;
-  width: 2em;
-  height: 2em;
-  align-items: center;
-  justify-content: center;
-  border-radius: 2px;
-  background: #bcbcbc;
-  color: #000;
-  cursor: pointer;
-  opacity: 0.7;
-
-  &:active {
-    transform: scale(0.9);
-  }
-
-  & + & {
-    margin-top: 1px;
-  }
-}
-</style>
+<script setup lang="ts">
+import { computed } from "vue";
+import { useElementSize } from '@vueuse/core'
+
+const props = defineProps<{
+  selector: string
+}>()
+
+const $content = document.querySelector(props.selector) as HTMLElement
+const $contentParent = $content.parentElement
+const { height: contentParentH } = useElementSize($contentParent)
+const { height: contentH } = useElementSize($content)
+const visible = computed(() => contentParentH.value * 2 < contentH.value)
+
+function scrollTo(top: number) {
+  $contentParent?.scrollTo({ top })
+}
+</script>
+
+<template>
+  <div v-if="visible" class="wrapper">
+    <div class="btn" @click="scrollTo(0)">
+      <i class="i-fluent:arrow-previous-24-filled rotate-90" />
+    </div>
+    <div class="btn" @click="scrollTo($contentParent?.scrollHeight ?? Infinity)">
+      <i class="i-fluent:arrow-previous-24-filled rotate-270" />
+    </div>
+    <!-- <div v-if="showReturn" class="btn" @click="toLastY()">
+      <i class="i-fluent:arrow-hook-down-left-24-filled rotate-270" />
+    </div> -->
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.wrapper {
+  font-size: 18px;
+}
+
+.btn {
+  display: flex;
+  width: 2em;
+  height: 2em;
+  align-items: center;
+  justify-content: center;
+  border-radius: 2px;
+  background: #bcbcbc;
+  color: #000;
+  cursor: pointer;
+  opacity: 0.7;
+
+  &:active {
+    transform: scale(0.9);
+  }
+
+  & + & {
+    margin-top: 1px;
+  }
+}
+</style>

package/admin/components/text/index.ts

@@ -1,13 +1,13 @@
-import Hash from './src/Hash.vue'
-import Amount from './src/Amount.vue'
-import Datetime from './src/Datetime.vue'
-import Duration from './src/Duration.vue'
-
-export { createTagGetter } from './src/createTagGetter'
-
-export const Text = {
-  Hash,
-  Amount,
-  Datetime,
-  Duration,
-}
+import Hash from './src/Hash.vue'
+import Amount from './src/Amount.vue'
+import Datetime from './src/Datetime.vue'
+import Duration from './src/Duration.vue'
+
+export { createTagGetter } from './src/createTagGetter'
+
+export const Text = {
+  Hash,
+  Amount,
+  Datetime,
+  Duration,
+}

package/admin/components/text/src/Amount.vue

@@ -1,114 +1,114 @@
-<script lang="ts">
-import { computed } from "vue";
-import bigNumber from 'bignumber.js'
-import isNil from 'lodash-es/isNil'
-
-/**
- * 当 symbol 为以下值时，使用预设的 Logo
- */
-const presetSymbols: Record<string, string> = {
-  USDT: 'https://api.iconify.design/cryptocurrency-color:usdt.svg',
-  TRX: 'https://api.iconify.design/cryptocurrency-color:trx.svg',
-  USDC: 'https://api.iconify.design/cryptocurrency-color:usdc.svg',
-  ETH: 'https://api.iconify.design/cryptocurrency-color:eth.svg',
-  BNB: 'https://api.iconify.design/cryptocurrency-color:bnb.svg',
-  BUSD: 'https://assets.coingecko.com/coins/images/9576/large/BUSD.png',
-  MATIC: 'https://api.iconify.design/cryptocurrency-color:matic.svg',
-  SOL: 'https://api.iconify.design/cryptocurrency-color:sol.svg',
-}
-</script>
-
-<script setup lang="ts">
-const props = withDefaults(
-  defineProps<{
-    /** 金额 */
-    amount?: string | number
-    /** 符号Logo, 可以是币种Logo的URL、法定货币符号($) */
-    symbol?: string
-    /** 精度 */
-    precision?: number
-    /** 单位，如币种名称 */
-    unit?: string
-    /** 保留小数的位数 */
-    fractionDigits?: number
-    /** 是否填充 0 */
-    padZero?: boolean
-    /** 金额是否红/绿显示 */
-    colorful?: boolean
-    /** 是否是大约数 */
-    approx?: boolean
-  }>(),
-  {
-    padZero: false,
-    fractionDigits: 18,
-    colorful: false,
-  },
-)
-
-const amountText = computed(() => {
-  const _amount = props.amount
-
-  if (isNil(_amount))
-    return '-'
-
-  let bn = bigNumber(_amount)
-  bn = !isNil(props.precision) ? bn.dividedBy(10 ** props.precision) : bn
-  let bnt = bn.toFormat(props.fractionDigits)
-  bnt = props.padZero ? bnt : bnt.replace(/\.?0+$/, '')
-
-  return bnt
-})
-const amountColor = computed(() => {
-  const num = Number.parseFloat(props.amount as string)
-
-  if (!props.colorful || (Number.isNaN(num) ? true : num === 0))
-    return ''
-
-  return num > 0 ? '#52c41a' : (num < 0 ? '#ff4d4f' : '#000')
-})
-const symbol = computed(() => presetSymbols[props.symbol!] ?? props.symbol ?? '')
-</script>
-
-<template>
-  <div class="amount-wrapper" :style="{ '--amount-color': amountColor }">
-    <!-- 约等于 -->
-    <span v-if="props.approx" class="color-$amount-color">≈</span>
-
-    <!-- 符号 -->
-    <img v-if="symbol.startsWith('http')" class="symbol-logo" :src="symbol" :alt="props.unit"> <!-- 图片Logo -->
-    <span v-else class="color-$amount-color">{{ symbol }}</span> <!-- 文本Logo，如法定币种符号(￥、$) -->
-
-    <!-- 金额 -->
-    <span class="color-$amount-color  amount">{{ amountText }}</span>
-
-    <!-- 单位 -->
-    <span v-if="props.unit" class="unit">{{ props.unit }}</span>
-  </div>
-</template>
-
-<style lang="scss">
-.amount-wrapper {
-  display: flex;
-  align-items: center;
-
-  .symbol-logo {
-    display: block;
-    width: 1.1em;
-    height: 1.1em;
-    margin-right: 0.2em;
-  }
-
-  .amount {
-    font-family: 'dinm';
-  }
-
-  .currency-name {
-    margin-left: 0.2em;
-  }
-
-  .unit {
-    display: inline-block;
-    margin-left: 0.2em;
-  }
-}
-</style>
+<script lang="ts">
+import { computed } from "vue";
+import bigNumber from 'bignumber.js'
+import isNil from 'lodash-es/isNil'
+
+/**
+ * 当 symbol 为以下值时，使用预设的 Logo
+ */
+const presetSymbols: Record<string, string> = {
+  USDT: 'https://api.iconify.design/cryptocurrency-color:usdt.svg',
+  TRX: 'https://api.iconify.design/cryptocurrency-color:trx.svg',
+  USDC: 'https://api.iconify.design/cryptocurrency-color:usdc.svg',
+  ETH: 'https://api.iconify.design/cryptocurrency-color:eth.svg',
+  BNB: 'https://api.iconify.design/cryptocurrency-color:bnb.svg',
+  BUSD: 'https://assets.coingecko.com/coins/images/9576/large/BUSD.png',
+  MATIC: 'https://api.iconify.design/cryptocurrency-color:matic.svg',
+  SOL: 'https://api.iconify.design/cryptocurrency-color:sol.svg',
+}
+</script>
+
+<script setup lang="ts">
+const props = withDefaults(
+  defineProps<{
+    /** 金额 */
+    amount?: string | number
+    /** 符号Logo, 可以是币种Logo的URL、法定货币符号($) */
+    symbol?: string
+    /** 精度 */
+    precision?: number
+    /** 单位，如币种名称 */
+    unit?: string
+    /** 保留小数的位数 */
+    fractionDigits?: number
+    /** 是否填充 0 */
+    padZero?: boolean
+    /** 金额是否红/绿显示 */
+    colorful?: boolean
+    /** 是否是大约数 */
+    approx?: boolean
+  }>(),
+  {
+    padZero: false,
+    fractionDigits: 18,
+    colorful: false,
+  },
+)
+
+const amountText = computed(() => {
+  const _amount = props.amount
+
+  if (isNil(_amount))
+    return '-'
+
+  let bn = bigNumber(_amount)
+  bn = !isNil(props.precision) ? bn.dividedBy(10 ** props.precision) : bn
+  let bnt = bn.toFormat(props.fractionDigits)
+  bnt = props.padZero ? bnt : bnt.replace(/\.?0+$/, '')
+
+  return bnt
+})
+const amountColor = computed(() => {
+  const num = Number.parseFloat(props.amount as string)
+
+  if (!props.colorful || (Number.isNaN(num) ? true : num === 0))
+    return ''
+
+  return num > 0 ? '#52c41a' : (num < 0 ? '#ff4d4f' : '#000')
+})
+const symbol = computed(() => presetSymbols[props.symbol!] ?? props.symbol ?? '')
+</script>
+
+<template>
+  <div class="amount-wrapper" :style="{ '--amount-color': amountColor }">
+    <!-- 约等于 -->
+    <span v-if="props.approx" class="color-$amount-color">≈</span>
+
+    <!-- 符号 -->
+    <img v-if="symbol.startsWith('http')" class="symbol-logo" :src="symbol" :alt="props.unit"> <!-- 图片Logo -->
+    <span v-else class="color-$amount-color">{{ symbol }}</span> <!-- 文本Logo，如法定币种符号(￥、$) -->
+
+    <!-- 金额 -->
+    <span class="color-$amount-color  amount">{{ amountText }}</span>
+
+    <!-- 单位 -->
+    <span v-if="props.unit" class="unit">{{ props.unit }}</span>
+  </div>
+</template>
+
+<style lang="scss">
+.amount-wrapper {
+  display: flex;
+  align-items: center;
+
+  .symbol-logo {
+    display: block;
+    width: 1.1em;
+    height: 1.1em;
+    margin-right: 0.2em;
+  }
+
+  .amount {
+    font-family: 'dinm';
+  }
+
+  .currency-name {
+    margin-left: 0.2em;
+  }
+
+  .unit {
+    display: inline-block;
+    margin-left: 0.2em;
+  }
+}
+</style>

package/admin/components/text/src/Datetime.vue

@@ -1,44 +1,44 @@
-<script setup lang="ts">
-import { Tooltip as ATooltip } from "ant-design-vue";
-import { computed } from "vue";
-import { getDependencies } from "../../../../kitDependencies";
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(
-  defineProps<{
-    timestamp?: number | string
-    template?: string
-  }>(),
-  {
-    template: 'MM-DD HH:mm:ss',
-  },
-)
-const {dayjs} = getDependencies()!
-const timestamp = computed(() => {
-  let tsStr = String(props.timestamp)
-
-  if (tsStr.length === 10)
-    tsStr += '000'
-  if (tsStr.length !== 13)
-    return
-
-  const tsNum = Number.parseInt(tsStr)
-
-  return Number.isNaN(tsNum) ? undefined : tsNum
-})
-</script>
-
-<template>
-  <ATooltip destroyTooltipOnHide>
-    <template v-if="timestamp" #title>
-      <div>{{ dayjs(timestamp).fromNow?.() }}</div>
-      <div>{{ dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss') }}</div>
-    </template>
-    <span v-bind="$attrs">{{ timestamp ? dayjs(timestamp).format(props.template) : '-' }}</span>
-  </ATooltip>
-</template>
-
-<style scoped lang="scss"></style>
+<script setup lang="ts">
+import { Tooltip as ATooltip } from "ant-design-vue";
+import { computed } from "vue";
+import { getDependencies } from "../../../../kitDependencies";
+
+defineOptions({
+  inheritAttrs: false,
+})
+
+const props = withDefaults(
+  defineProps<{
+    timestamp?: number | string
+    template?: string
+  }>(),
+  {
+    template: 'MM-DD HH:mm:ss',
+  },
+)
+const {dayjs} = getDependencies()!
+const timestamp = computed(() => {
+  let tsStr = String(props.timestamp)
+
+  if (tsStr.length === 10)
+    tsStr += '000'
+  if (tsStr.length !== 13)
+    return
+
+  const tsNum = Number.parseInt(tsStr)
+
+  return Number.isNaN(tsNum) ? undefined : tsNum
+})
+</script>
+
+<template>
+  <ATooltip destroyTooltipOnHide>
+    <template v-if="timestamp" #title>
+      <div>{{ dayjs(timestamp).fromNow?.() }}</div>
+      <div>{{ dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss') }}</div>
+    </template>
+    <span v-bind="$attrs">{{ timestamp ? dayjs(timestamp).format(props.template) : '-' }}</span>
+  </ATooltip>
+</template>
+
+<style scoped lang="scss"></style>

package/admin/components/text/src/Duration.vue

@@ -1,26 +1,26 @@
-<script setup lang="ts">
-import { computed } from "vue";
-
-const props = defineProps<{
-  seconds: number
-}>()
-
-const formattedDuration = computed(() => {
-  const days = Math.floor(props.seconds / (3600 * 24))
-  const hours = Math.floor((props.seconds % (3600 * 24)) / 3600)
-  const minutes = Math.floor((props.seconds % 3600) / 60)
-  const seconds = props.seconds % 60
-  let formattedDuration = ''
-
-  days >= 1 && (formattedDuration += `${Math.floor(days)}天 `)
-  hours >= 1 && (formattedDuration += `${Math.floor(hours)}小时 `)
-  minutes >= 1 && (formattedDuration += `${Math.floor(minutes)}分钟 `)
-  seconds >= 1 && (formattedDuration += `${Math.floor(seconds)}秒`)
-
-  return formattedDuration
-})
-</script>
-
-<template>
-  <span>{{ formattedDuration }}</span>
-</template>
+<script setup lang="ts">
+import { computed } from "vue";
+
+const props = defineProps<{
+  seconds: number
+}>()
+
+const formattedDuration = computed(() => {
+  const days = Math.floor(props.seconds / (3600 * 24))
+  const hours = Math.floor((props.seconds % (3600 * 24)) / 3600)
+  const minutes = Math.floor((props.seconds % 3600) / 60)
+  const seconds = props.seconds % 60
+  let formattedDuration = ''
+
+  days >= 1 && (formattedDuration += `${Math.floor(days)}天 `)
+  hours >= 1 && (formattedDuration += `${Math.floor(hours)}小时 `)
+  minutes >= 1 && (formattedDuration += `${Math.floor(minutes)}分钟 `)
+  seconds >= 1 && (formattedDuration += `${Math.floor(seconds)}秒`)
+
+  return formattedDuration
+})
+</script>
+
+<template>
+  <span>{{ formattedDuration }}</span>
+</template>

package/admin/components/text/src/Hash.vue

@@ -1,40 +1,40 @@
-<script setup lang="ts">
-import { Tooltip as ATooltip, TypographyLink as ATypographyLink } from "ant-design-vue";
-import { computed } from "vue";
-import { desensitize, getScanBrowser } from '../../../../utils'
-
-type HashType = Parameters<typeof getScanBrowser>[2]
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(
-  defineProps<{
-    hash: string
-    hide?: boolean
-    chain?: string
-    type?: HashType
-  }>(),
-  {
-    hide: true,
-  },
-)
-
-const href = computed(() => {
-  const { hash, chain, type } = props
-
-  if (!hash || !chain || !type)
-    return
-  return getScanBrowser(chain, hash, type)
-})
-</script>
-
-<template>
-  <ATypographyLink :href="href" :copyable="{ text: props.hash, tooltip: false }" target="_blank">
-    <ATooltip>
-      <template v-if="props.hide" #title>{{ props.hash }}</template>
-      <span v-bind="$attrs">{{ props.hide ? desensitize(props.hash) : props.hash }}</span>
-    </ATooltip>
-  </ATypographyLink>
-</template>
+<script setup lang="ts">
+import { Tooltip as ATooltip, TypographyLink as ATypographyLink } from "ant-design-vue";
+import { computed } from "vue";
+import { desensitize, getScanBrowser } from '../../../../utils'
+
+type HashType = Parameters<typeof getScanBrowser>[2]
+
+defineOptions({
+  inheritAttrs: false,
+})
+
+const props = withDefaults(
+  defineProps<{
+    hash: string
+    hide?: boolean
+    chain?: string
+    type?: HashType
+  }>(),
+  {
+    hide: true,
+  },
+)
+
+const href = computed(() => {
+  const { hash, chain, type } = props
+
+  if (!hash || !chain || !type)
+    return
+  return getScanBrowser(chain, hash, type)
+})
+</script>
+
+<template>
+  <ATypographyLink :href="href" :copyable="{ text: props.hash, tooltip: false }" target="_blank">
+    <ATooltip>
+      <template v-if="props.hide" #title>{{ props.hash }}</template>
+      <span v-bind="$attrs">{{ props.hide ? desensitize(props.hash) : props.hash }}</span>
+    </ATooltip>
+  </ATypographyLink>
+</template>

package/admin/components/text/src/createTagGetter.ts

@@ -1,13 +1,13 @@
-import { computed, h } from "vue";
-import { Tag as ATag } from 'ant-design-vue'
-import type { TagProps } from 'ant-design-vue'
-
-export function createTagGetter(typeMapFn: () => { [code: number | string]: [ text: string, color: TagProps['color'] ] }) {
-  const typeMap = computed(typeMapFn)
-
-  return (type: number) => {
-    const [text, color] = typeMap.value[type] ?? []
-
-    return text ? h(ATag, { color }, () => text) : h('span', null, '-')
-  }
-}
+import { computed, h } from "vue";
+import { Tag as ATag } from 'ant-design-vue'
+import type { TagProps } from 'ant-design-vue'
+
+export function createTagGetter(typeMapFn: () => { [code: number | string]: [ text: string, color: TagProps['color'] ] }) {
+  const typeMap = computed(typeMapFn)
+
+  return (type: number) => {
+    const [text, color] = typeMap.value[type] ?? []
+
+    return text ? h(ATag, { color }, () => text) : h('span', null, '-')
+  }
+}

package/admin/defines/defineRoute.helpers.ts

@@ -9,8 +9,7 @@ export function getTitle(route?: Pick<RouteLocationNormalizedLoaded, 'meta'>) {
 export function getMenusByRouter(router: Router) {
   const menuOrderRE = /^(?<key>\w*)@(?<order>\d+)$/
   const routes = router.getRoutes()
-
-  return routes
+  const menus =  routes
     .filter(route => menuOrderRE.test((route.meta.menuOrder ?? '')))
     .map((route) => {
       const res = route.meta!.menuOrder!.match(menuOrderRE)
@@ -21,10 +20,18 @@ export function getMenusByRouter(router: Router) {
         key: name,
         label: route.meta.title ?? name,
         icon: route.meta.icon,
-        trigger: parentKey ? () => router.push({ name }) : () => {},
+        trigger: () => router.push({ name }),
         order,
       }
 
       return { parentKey, menu }
     })
+
+  // 将含有子菜单的菜单的 trigger 设置为空函数
+  const hasSubMenus = menus.filter(menu => menus.some(m => m.parentKey === menu.menu.key))
+  hasSubMenus.forEach((menu) => {
+    menu.menu.trigger = (() => {}) as any
+  })
+  
+  return menus
 }