三页面重设计与移动端适配;接入 PWA 与构建分包

2026-07-21 19:26:22 +08:00
parent ac457282ce
commit 6129173fe6
64 changed files with 6243 additions and 549 deletions
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { NPopover } from 'naive-ui'
+import { useRouter } from 'vue-router'
+
+import { useRegionAlias } from '@/composables/useRegionAlias'
+
+/** 租户悬停卡(AI 网关渠道 / 回传日志共用):别名、租户名称、主区域三行
+ *  加「前往租户」入口;触发文本本身不承载跳转,避免误触。 */
+const props = defineProps<{
+  cfgId: number
+  /** 触发文本(渠道名 / 租户别名) */
+  label: string
+  alias?: string
+  tenancyName?: string
+  region?: string
+  /** 触发文本附加类(截断约束等) */
+  labelClass?: string
+}>()
+
+const router = useRouter()
+const { alias: regionAlias } = useRegionAlias()
+
+function go(e: MouseEvent) {
+  // 表格行自身可能有点击行为(如回传日志展开详情),跳转不冒泡
+  e.stopPropagation()
+  void router.push({ name: 'tenant-detail', params: { id: props.cfgId } })
+}
+</script>
+
+<template>
+  <NPopover trigger="hover" placement="top-start" :style="{ maxWidth: '320px' }">
+    <template #trigger>
+      <span
+        class="cursor-help border-b border-dashed border-ink-3/50 text-[13px]"
+        :class="labelClass"
+      >
+        {{ label }}
+      </span>
+    </template>
+    <div class="flex min-w-40 flex-col text-xs">
+      <div class="pb-1.5 text-[13px] font-semibold break-all">{{ alias ?? label }}</div>
+      <div v-if="tenancyName" class="mono border-t border-line-soft py-1.5 break-all text-ink-2">
+        {{ tenancyName }}
+      </div>
+      <div v-if="region" class="border-t border-line-soft py-1.5 text-ink-2">
+        {{ regionAlias(region) }}
+      </div>
+      <button
+        type="button"
+        class="cursor-pointer border-t border-line-soft pt-1.5 text-left font-medium text-accent"
+        @click="go"
+      >
+        前往租户
+      </button>
+    </div>
+  </NPopover>
+</template>