From 0756bf12d10cf1b7f78c571de0a9ad69cbaeb7ca Mon Sep 17 00:00:00 2001
From: curtis <curtis@i-mps.com>
Date: 星期一, 30 三月 2026 14:24:17 +0800
Subject: [PATCH] fix: 更新內部引用方法參照
---
uiOutput/OldCaseInfo/OldCaseInfo.vue | 122 ++++++++++++++++++++++++++++++++++++++++
1 files changed, 122 insertions(+), 0 deletions(-)
diff --git a/uiOutput/OldCaseInfo/OldCaseInfo.vue b/uiOutput/OldCaseInfo/OldCaseInfo.vue
new file mode 100644
index 0000000..ed531db
--- /dev/null
+++ b/uiOutput/OldCaseInfo/OldCaseInfo.vue
@@ -0,0 +1,122 @@
+<template>
+ <div class="old-case-info-form flex flex-col bg-gray-100 font-sans w-[740px] h-[554px] border border-gray-400 relative overflow-hidden text-sm">
+
+ <!-- Page 1: CaseInfo -->
+ <div v-if="currentPage === 'CaseInfo'" class="flex-1 flex flex-col overflow-hidden">
+ <!-- Toolbar (Panel 1) -->
+ <div class="h-[41px] flex items-center px-4 space-x-4 bg-gray-50 border-b border-gray-300">
+ <button class="w-[75px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="LoadBtClick">
+ 載入影像
+ </button>
+ <button class="w-[75px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="OldExitBtClick">
+ 離開
+ </button>
+ </div>
+
+ <!-- Case List (OldCaseLV) -->
+ <div class="flex-1 bg-white overflow-auto">
+ <table class="w-full border-collapse">
+ <thead class="sticky top-0 bg-gray-100">
+ <tr class="text-left border-b border-gray-300">
+ <th class="p-2 border-r border-gray-200 w-[200px]">掛報書編號</th>
+ <th class="p-2 border-r border-gray-200 w-[120px]">年度</th>
+ <th class="p-2 border-r border-gray-200 w-[120px]">業務別</th>
+ <th class="p-2">是否舊案</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr v-for="(item, index) in oldCases"
+ :key="index"
+ :class="['hover:bg-blue-50 cursor-pointer border-b border-gray-100', selectedCaseIndex === index ? 'bg-blue-600 text-white hover:bg-blue-700' : '']"
+ @click="selectCase(index)"
+ @dblclick="LoadBtClick">
+ <td class="p-2 border-r border-gray-200">{{ item.id }}</td>
+ <td class="p-2 border-r border-gray-200">{{ item.year }}</td>
+ <td class="p-2 border-r border-gray-200">{{ item.type }}</td>
+ <td class="p-2">{{ item.isOld }}</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ <!-- Page 2: View -->
+ <div v-else class="flex-1 flex flex-col overflow-hidden">
+ <!-- Toolbar (Panel 3) -->
+ <div class="h-[49px] flex items-center px-4 space-x-4 bg-gray-50 border-b border-gray-300">
+ <button class="w-[75px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="ImportBtClick">
+ 引用
+ </button>
+ <button class="w-[75px] h-[25px] border border-gray-400 bg-gray-200 hover:bg-gray-300" @click="ExitBtClick">
+ 離開
+ </button>
+ <div class="flex-1"></div>
+ <span class="text-xs text-gray-500">案件編號: {{ oldCases[selectedCaseIndex].id }}</span>
+ </div>
+
+ <div class="flex-1 flex overflow-hidden">
+ <!-- Left Sidebar: Document Groups (Panel 4) -->
+ <div class="w-[249px] flex-none border-r border-gray-400 p-1 flex flex-col bg-gray-50">
+ <fieldset class="flex-1 border border-gray-400 p-0 flex flex-col">
+ <legend class="px-1 ml-2 text-sm">案件編號</legend>
+ <div class="flex-1 overflow-y-auto bg-white m-1 border border-gray-300">
+ <div v-for="(group, index) in docGroups"
+ :key="index"
+ :class="['flex items-center px-2 py-1 space-x-2 cursor-pointer hover:bg-blue-50', selectedGroupIndex === index ? 'bg-blue-100' : '']"
+ @click="CheckListBox1Click(index)">
+ <input type="checkbox" v-model="group.checked" @click.stop />
+ <span class="text-sm truncate">{{ group.text }}</span>
+ </div>
+ </div>
+ </fieldset>
+ </div>
+
+ <!-- Main Preview Area (Panel 5) -->
+ <div class="flex-1 flex overflow-hidden">
+ <!-- Thumbnails (Panel 6) -->
+ <div class="w-[183px] flex-none border-r border-gray-400 overflow-y-auto bg-gray-300 p-1 space-y-2">
+ <div v-for="(page, pIdx) in (selectedGroupIndex !== -1 ? docGroups[selectedGroupIndex].pages : [])"
+ :key="pIdx"
+ class="w-[150px] mx-auto border-2 border-transparent hover:border-blue-500 cursor-pointer bg-white shadow-sm"
+ @click="setThumbnailAsPreview(page)">
+ <img :src="page" class="w-full" />
+ <div class="text-[10px] text-center bg-gray-100 py-1">第 {{ pIdx + 1 }} 頁</div>
+ </div>
+ </div>
+ <!-- Large Preview (Panel 7) -->
+ <div class="flex-1 bg-gray-800 flex items-center justify-center p-2 overflow-auto">
+ <img v-if="previewImage" :src="previewImage" class="max-w-none shadow-2xl border-4 border-white" />
+ <div v-else class="text-white text-lg opacity-30">請選擇影像進行預覽</div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!-- Visual Reference Overlay -->
+ <div class="old-case-layout opacity-20 pointer-events-none absolute left-0 top-0">
+ <img src="assets/OldCaseInfo.png" class="w-[740px] h-[554px]" />
+ </div>
+ </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { useOldCaseInfoLogic } from './OldCaseInfo.ts';
+
+export default defineComponent({
+ name: 'OldCaseInfoForm',
+ setup() {
+ const logic = useOldCaseInfoLogic();
+ return { ...logic };
+ }
+});
+</script>
+
+<style scoped>
+.old-case-info-form {
+ user-select: none;
+}
+.old-case-layout {
+ z-index: 1000;
+}
+</style>
--
Gitblit v1.8.0