aegon-gen 1.0.0

package/src/views/gen-ai/gen-entry/mockData.ts

@@ -0,0 +1,160 @@
+import type { RecentReport } from '@/types/gen-ai/gen-entry/index'
+
+export const MOCK_RECENT_REPORTS: RecentReport[] = [
+  {
+    id: '1',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2025',
+    status: '草稿',
+    initiator: '陳大文 (單位 xxxx)',
+    editor: '陳1文 (單位 xxxx) , 陳2文 (單位 xxxx) , 陳3文 (單位 xxxx) ...',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '2',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2024',
+    status: '已產生',
+    initiator: '陳中文 (單位 yyyy)',
+    editor: '陳4文 (單位 yyyy) , 陳5文 (單位 yyyy) ...',
+    permission: '無權限',
+    updatedAt: '3天前',
+    canOpen: false,
+  },
+  {
+    id: '3',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '4',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '5',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '6',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '7',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '8',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '9',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '10',
+    name: '深圳房地產風控年報 - 2024',
+    industry: '房地產',
+    year: '2023',
+    status: '已導出',
+    initiator: '陳小文 (單位 zzzz)',
+    editor: '陳6文 (單位 zzzz)',
+    permission: '可編輯',
+    updatedAt: '3天前',
+    canOpen: true,
+  },
+  {
+    id: '11',
+    name: '上海商業地產風控季報 - 2024',
+    industry: '商業地產',
+    year: '2024',
+    status: '草稿',
+    initiator: '王小明 (單位 aaaa)',
+    editor: '王2文 (單位 aaaa)',
+    permission: '可編輯',
+    updatedAt: '5天前',
+    canOpen: true,
+  },
+  {
+    id: '12',
+    name: '廣州基建項目風控月報 - 2024',
+    industry: '基建',
+    year: '2024',
+    status: '已產生',
+    initiator: '李雷 (單位 bbbb)',
+    editor: '李3文 (單位 bbbb)',
+    permission: '可編輯',
+    updatedAt: '1周前',
+    canOpen: true,
+  },
+  {
+    id: '13',
+    name: '北京科技園區風控年報 - 2023',
+    industry: '科技園區',
+    year: '2023',
+    status: '已導出',
+    initiator: '韓梅梅 (單位 cccc)',
+    editor: '韓4文 (單位 cccc)',
+    permission: '無權限',
+    updatedAt: '2周前',
+    canOpen: false,
+  },
+]

package/src/views/gen-ai/management-center/index.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="management-center-page">
+    <PageHeader title="IR-DEMO" />
+
+    <main class="management-center-page__body">
+      <section class="management-center-hero">
+        <h2 class="management-center-hero__title">管理中心</h2>
+        <p class="management-center-hero__desc">系統配置、權限與運營管理入口</p>
+      </section>
+    </main>
+  </div>
+</template>
+
+<script setup lang="ts">
+import PageHeader from '@/components/PageHeader.vue'
+</script>
+
+<style scoped>
+.management-center-page {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  overflow: hidden;
+  background: #fff;
+}
+
+.management-center-page__body {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  width: 100%;
+  padding: 48px 24px 40px;
+  box-sizing: border-box;
+}
+
+.management-center-hero {
+  text-align: center;
+}
+
+.management-center-hero__title {
+  margin: 0 0 12px;
+  font-size: 28px;
+  font-weight: 700;
+  color: #1a1a1a;
+}
+
+.management-center-hero__desc {
+  margin: 0;
+  font-size: 14px;
+  line-height: 1.7;
+  color: #666;
+}
+</style>

package/src/views/gen-ai/model-manager/ChapterTitleScroll.vue

@@ -0,0 +1,275 @@
+<template>
+  <li
+    class="chapter-title-scroll"
+    :class="{
+      'is-truncatable': isTruncatable,
+      'is-animating': isAnimating,
+      'is-dragging': isDragging,
+    }"
+    @click="handleClick"
+    @wheel.prevent="handleWheel"
+  >
+    <div
+      ref="viewportRef"
+      class="chapter-title-scroll__viewport"
+      @pointerdown="handlePointerDown"
+    >
+      <span
+        ref="textRef"
+        class="chapter-title-scroll__text"
+        :style="{ transform: `translateX(${-offset}px)` }"
+      >
+        <template v-if="!showFull && isTruncatable">{{ truncatedPrefix }}</template>
+        <template v-else>{{ title }}</template>
+      </span>
+      <span
+        v-if="!showFull && isTruncatable"
+        class="chapter-title-scroll__ellipsis"
+        aria-hidden="true"
+      >...</span>
+    </div>
+  </li>
+</template>
+
+<script setup lang="ts">
+import { computed, nextTick, onBeforeUnmount, ref } from 'vue'
+
+const TITLE_MAX = 19
+/** 自動滾動速度（px/s），較慢 */
+const SCROLL_SPEED_PX_PER_SEC = 22
+const END_PAUSE_MS = 280
+const DRAG_CLICK_THRESHOLD_PX = 4
+
+const props = defineProps<{
+  title: string
+}>()
+
+const viewportRef = ref<HTMLElement | null>(null)
+const textRef = ref<HTMLElement | null>(null)
+const offset = ref(0)
+const showFull = ref(false)
+const isAnimating = ref(false)
+const isDragging = ref(false)
+
+let animFrameId = 0
+let endPauseTimer = 0
+let dragStartX = 0
+let dragStartOffset = 0
+let pointerMoved = false
+let activePointerMove: ((event: PointerEvent) => void) | null = null
+let activePointerUp: ((event: PointerEvent) => void) | null = null
+
+const isTruncatable = computed(() => props.title.length > TITLE_MAX)
+const truncatedPrefix = computed(() =>
+  isTruncatable.value ? props.title.slice(0, TITLE_MAX) : props.title,
+)
+
+function getMaxOffset() {
+  const viewport = viewportRef.value
+  const text = textRef.value
+  if (!viewport || !text) return 0
+  return Math.max(0, text.scrollWidth - viewport.clientWidth)
+}
+
+function clampOffset(value: number) {
+  return Math.min(getMaxOffset(), Math.max(0, value))
+}
+
+function cancelAnimation() {
+  if (animFrameId) {
+    cancelAnimationFrame(animFrameId)
+    animFrameId = 0
+  }
+  if (endPauseTimer) {
+    clearTimeout(endPauseTimer)
+    endPauseTimer = 0
+  }
+  isAnimating.value = false
+}
+
+function removePointerListeners() {
+  if (activePointerMove) {
+    window.removeEventListener('pointermove', activePointerMove)
+    activePointerMove = null
+  }
+  if (activePointerUp) {
+    window.removeEventListener('pointerup', activePointerUp)
+    window.removeEventListener('pointercancel', activePointerUp)
+    activePointerUp = null
+  }
+}
+
+function resetToInitial() {
+  cancelAnimation()
+  removePointerListeners()
+  isDragging.value = false
+  offset.value = 0
+  showFull.value = false
+}
+
+async function ensureFullMode() {
+  if (!showFull.value) {
+    showFull.value = true
+    offset.value = 0
+    await nextTick()
+  }
+}
+
+async function startAutoScroll() {
+  if (!isTruncatable.value || isAnimating.value) return
+
+  cancelAnimation()
+  showFull.value = true
+  offset.value = 0
+  await nextTick()
+
+  const maxOffset = getMaxOffset()
+  if (maxOffset <= 0) {
+    resetToInitial()
+    return
+  }
+
+  isAnimating.value = true
+  const startTime = performance.now()
+
+  const tick = (now: number) => {
+    const elapsedSec = (now - startTime) / 1000
+    const nextOffset = Math.min(maxOffset, elapsedSec * SCROLL_SPEED_PX_PER_SEC)
+    offset.value = nextOffset
+
+    if (nextOffset >= maxOffset) {
+      endPauseTimer = window.setTimeout(() => {
+        resetToInitial()
+      }, END_PAUSE_MS)
+      return
+    }
+
+    animFrameId = requestAnimationFrame(tick)
+  }
+
+  animFrameId = requestAnimationFrame(tick)
+}
+
+function handleClick() {
+  if (!isTruncatable.value || isAnimating.value || pointerMoved) {
+    pointerMoved = false
+    return
+  }
+  resetToInitial()
+  void nextTick(() => {
+    void startAutoScroll()
+  })
+}
+
+function handleWheel(event: WheelEvent) {
+  if (!isTruncatable.value) return
+
+  cancelAnimation()
+
+  void ensureFullMode().then(() => {
+    const delta = (event.deltaY !== 0 ? event.deltaY : event.deltaX) * 0.6
+    offset.value = clampOffset(offset.value + delta)
+  })
+}
+
+function handlePointerDown(event: PointerEvent) {
+  if (!isTruncatable.value || event.button !== 0) return
+
+  event.preventDefault()
+  cancelAnimation()
+
+  void ensureFullMode().then(() => {
+    isDragging.value = true
+    pointerMoved = false
+    dragStartX = event.clientX
+    dragStartOffset = offset.value
+
+    activePointerMove = (moveEvent: PointerEvent) => {
+      const delta = dragStartX - moveEvent.clientX
+      if (Math.abs(delta) > DRAG_CLICK_THRESHOLD_PX) {
+        pointerMoved = true
+      }
+      offset.value = clampOffset(dragStartOffset + delta)
+    }
+
+    activePointerUp = () => {
+      isDragging.value = false
+      removePointerListeners()
+      if (pointerMoved) {
+        window.setTimeout(() => {
+          pointerMoved = false
+        }, 0)
+      }
+    }
+
+    window.addEventListener('pointermove', activePointerMove)
+    window.addEventListener('pointerup', activePointerUp)
+    window.addEventListener('pointercancel', activePointerUp)
+  })
+}
+
+onBeforeUnmount(() => {
+  resetToInitial()
+})
+</script>
+
+<style scoped>
+.chapter-title-scroll {
+  height: 19.5px;
+  line-height: 19.5px;
+  list-style: none;
+  font-size: 13px;
+  color: #606266;
+  cursor: default;
+  user-select: none;
+}
+
+.chapter-title-scroll.is-truncatable {
+  cursor: grab;
+}
+
+.chapter-title-scroll.is-dragging {
+  cursor: grabbing;
+}
+
+.chapter-title-scroll__viewport {
+  position: relative;
+  overflow: hidden;
+  height: 19.5px;
+  line-height: 19.5px;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  touch-action: none;
+}
+
+.chapter-title-scroll__viewport::-webkit-scrollbar {
+  display: none;
+  width: 0;
+  height: 0;
+}
+
+.chapter-title-scroll__text {
+  display: inline-block;
+  white-space: nowrap;
+  will-change: transform;
+  color: #606266;
+}
+
+.chapter-title-scroll.is-dragging .chapter-title-scroll__text {
+  transition: none;
+}
+
+.chapter-title-scroll__ellipsis {
+  position: absolute;
+  right: 0;
+  top: 0;
+  padding-left: 8px;
+  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 45%);
+  color: #c53355;
+  font-weight: 900;
+  font-size: 16px;
+  line-height: 19.5px;
+  letter-spacing: 0.05em;
+  pointer-events: none;
+}
+</style>