首次提交

2026-07-18 20:09:26 +08:00
commit 521ad3b635
48 changed files with 7199 additions and 0 deletions
@@ -0,0 +1,70 @@
+<template>
+  <div>
+    <div class="flex justify-between items-center mb-6">
+      <h2 class="text-2xl font-bold">部署日志</h2>
+      <select v-model="statusFilter" @change="load"
+        class="px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none text-sm">
+        <option value="">全部状态</option>
+        <option value="success">成功</option>
+        <option value="failed">失败</option>
+        <option value="skipped">跳过</option>
+      </select>
+    </div>
+
+    <div class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
+      <table class="w-full text-sm">
+        <thead class="bg-gray-50">
+          <tr>
+            <th class="px-6 py-3 text-left text-gray-500 font-medium">时间</th>
+            <th class="px-6 py-3 text-left text-gray-500 font-medium">服务器</th>
+            <th class="px-6 py-3 text-left text-gray-500 font-medium">域名</th>
+            <th class="px-6 py-3 text-left text-gray-500 font-medium">状态</th>
+            <th class="px-6 py-3 text-left text-gray-500 font-medium">消息</th>
+          </tr>
+        </thead>
+        <tbody class="divide-y divide-gray-50">
+          <tr v-for="log in logs" :key="log.id">
+            <td class="px-6 py-3 text-gray-500">{{ formatTime(log.created_at) }}</td>
+            <td class="px-6 py-3">{{ log.server }}</td>
+            <td class="px-6 py-3">{{ log.domain }}</td>
+            <td class="px-6 py-3">
+              <span :class="statusClass(log.status)" class="px-2 py-0.5 rounded-full text-xs">
+                {{ log.status }}
+              </span>
+            </td>
+            <td class="px-6 py-3 text-gray-500">{{ log.message }}</td>
+          </tr>
+          <tr v-if="!logs.length">
+            <td colspan="5" class="px-6 py-8 text-center text-gray-400">暂无日志</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { getLogs } from '../api'
+
+const logs = ref([])
+const statusFilter = ref('')
+
+const formatTime = (iso) => {
+  if (!iso) return '-'
+  return new Date(iso).toLocaleString('zh-CN')
+}
+
+const statusClass = (status) => ({
+  'bg-green-100 text-green-700': status === 'success',
+  'bg-red-100 text-red-700': status === 'failed',
+  'bg-gray-100 text-gray-700': status === 'skipped',
+})
+
+const load = async () => {
+  const { data } = await getLogs(statusFilter.value || undefined)
+  logs.value = data
+}
+
+onMounted(load)
+</script>