From 21197887cdfccfd82b37e4723c5f9fddbed42589 Mon Sep 17 00:00:00 2001
From: alivender <13898766233@163.com>
Date: Wed, 14 May 2025 19:44:39 +0800
Subject: [PATCH] add: AdminView and remote update view

---
 src/router/index.ts     |   2 +
 src/views/AdminView.vue | 130 ++++++++++++++++++++++++++++++++++++++++
 src/views/HomeView.vue  |  11 +++-
 3 files changed, 141 insertions(+), 2 deletions(-)
 create mode 100644 src/views/AdminView.vue

diff --git a/src/router/index.ts b/src/router/index.ts
index a415265..287b816 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -5,6 +5,7 @@ import TestView from "../views/TestView.vue";
 import JtagTest from "../views/JtagTest.vue";
 import ProjectView from "../views/ProjectView.vue";
 import HomeView from "@/views/HomeView.vue";
+import AdminView from "@/views/AdminView.vue";
 
 const routes = [
   { path: "/", name: "Home", component: HomeView },
@@ -13,6 +14,7 @@ const routes = [
   { path: "/test", name: "Test", component: TestView },
   { path: "/test/jtag", name: "JtagTest", component: JtagTest },
   { path: "/project", name: "Project", component: ProjectView },
+  { path: "/admin", name: "Admin", component: AdminView },
 ];
 
 const router = createRouter({
diff --git a/src/views/AdminView.vue b/src/views/AdminView.vue
new file mode 100644
index 0000000..5d62def
--- /dev/null
+++ b/src/views/AdminView.vue
@@ -0,0 +1,130 @@
+<template>
+  <div class="bg-base-200 min-h-screen p-6">
+    <h1 class="text-3xl font-bold mb-6">FPGA 设备管理</h1>
+    
+    <div class="card bg-base-100 shadow-xl">
+      <div class="card-body">
+        <h2 class="card-title mb-4">IP 地址列表</h2>
+        
+        <div class="overflow-x-auto">
+          <table class="table w-full">
+            <!-- 表头 -->
+            <thead>
+              <tr class="bg-base-300">
+                <th>IP 地址</th>
+                <th>版本号</th>
+                <th>默认启动位流</th>
+                <th>黄金位流</th>
+                <th>应用位流1</th>
+                <th>应用位流2</th>
+                <th>应用位流3</th>
+                <th>操作</th>
+              </tr>
+            </thead>
+            
+            <!-- 表格内容 -->
+            <tbody>
+              <tr class="hover">
+                <td class="font-medium">192.168.1.100</td>
+                <td>v1.2.3</td>
+                <td>
+                  <select class="select select-bordered w-full max-w-xs">
+                    <option selected>黄金位流</option>
+                    <option>应用位流1</option>
+                    <option>应用位流2</option>
+                    <option>应用位流3</option>
+                  </select>
+                </td>
+                  <!-- 黄金位流上传区 -->
+                <td>
+                  <div class="flex flex-col items-center gap-2">
+                    <label class="btn btn-outline btn-primary">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
+                      </svg>
+                      <input type="file" class="hidden" @change="handleFileChange($event, goldBitstreamFile)" />
+                    </label>
+                    <span class="text-xs text-primary truncate max-w-32" v-if="goldBitstreamFile">{{ goldBitstreamFile }}</span>
+                  </div>
+                </td>
+                  <!-- 应用位流1上传区 -->
+                <td>
+                  <div class="flex flex-col items-center gap-2">
+                    <label class="btn btn-outline btn-secondary">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
+                      </svg>
+                      <input type="file" class="hidden" @change="handleFileChange($event, appBitstream1File)" />
+                    </label>
+                    <span class="text-xs text-secondary truncate max-w-32" v-if="appBitstream1File">{{ appBitstream1File }}</span>
+                  </div>
+                </td>
+                  <!-- 应用位流2上传区 -->
+                <td>
+                  <div class="flex flex-col items-center gap-2">
+                    <label class="btn btn-outline btn-accent">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
+                      </svg>
+                      <input type="file" class="hidden" @change="handleFileChange($event, appBitstream2File)" />
+                    </label>
+                    <span class="text-xs text-accent truncate max-w-32" v-if="appBitstream2File">{{ appBitstream2File }}</span>
+                  </div>
+                </td>
+                  <!-- 应用位流3上传区 -->
+                <td>
+                  <div class="flex flex-col items-center gap-2">
+                    <label class="btn btn-outline btn-info">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
+                      </svg>
+                      <input type="file" class="hidden" @change="handleFileChange($event, appBitstream3File)" />
+                    </label>
+                    <span class="text-xs text-info truncate max-w-32" v-if="appBitstream3File">{{ appBitstream3File }}</span>
+                  </div>
+                </td>
+                
+                <!-- 操作按钮 -->
+                <td class="flex gap-2">
+                  <button class="btn btn-sm btn-warning">固化</button>
+                  <button class="btn btn-sm btn-success">切换并热启动</button>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+        
+        <div class="mt-6 bg-base-300 p-4 rounded-lg">
+          <p class="text-sm opacity-80">
+            <span class="font-semibold text-warning">提示：</span> 
+            请谨慎操作FPGA固化和热启动功能，确保上传的位流文件无误，以避免设备损坏。
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+// 存储上传文件的信息
+const goldBitstreamFile = ref<string>('');
+const appBitstream1File = ref<string>('');
+const appBitstream2File = ref<string>('');
+const appBitstream3File = ref<string>('');
+
+// 处理文件上传
+function handleFileChange(event: Event, fileRef: any) {
+  const target = event.target as HTMLInputElement;
+  const file = target.files?.[0];
+  
+  if (file) {
+    fileRef.value = file.name;
+  }
+}
+</script>
+
+<style scoped lang="postcss">
+@import "../assets/main.css";
+</style>
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index ba0d0ce..db36d82 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -52,8 +52,7 @@
               </svg>
               测试功能
             </router-link>
-            
-            <router-link to="/test/jtag" class="btn btn-warning text-base-100 shadow-lg transform transition-all duration-300 hover:scale-105 hover:shadow-xl hover:-translate-y-1">
+              <router-link to="/test/jtag" class="btn btn-warning text-base-100 shadow-lg transform transition-all duration-300 hover:scale-105 hover:shadow-xl hover:-translate-y-1">
               <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect>
                 <line x1="8" y1="21" x2="16" y2="21"></line>
@@ -61,6 +60,14 @@
               </svg>
               JTAG测试
             </router-link>
+            
+            <router-link to="/admin" class="btn btn-error text-base-100 shadow-lg transform transition-all duration-300 hover:scale-105 hover:shadow-xl hover:-translate-y-1">
+              <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-2" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                <path d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5z"></path>
+                <circle cx="12" cy="12" r="3"></circle>
+              </svg>
+              管理控制台
+            </router-link>
           </div>
             <div class="mt-8 p-4 bg-base-300 rounded-lg shadow-inner opacity-80 transition-all duration-300 hover:opacity-100 hover:shadow-md">
             <p class="text-sm">