原型设计系统

src/views/data-dashboard/index.vue

@@ -0,0 +1,78 @@
+<template>
+  <div>
+    <h1>数据工作台</h1>
+    <el-row :gutter="20">
+      <el-col :span="6" v-for="item in stats" :key="item.label">
+        <el-card shadow="hover">
+          <template #header>
+            <div class="card-header">
+              <span>{{ item.label }}</span>
+            </div>
+          </template>
+          <div class="card-value">{{ item.value }}</div>
+        </el-card>
+      </el-col>
+    </el-row>
+
+    <el-row :gutter="20" style="margin-top: 20px;">
+      <el-col :span="12">
+        <el-card header="Recent Activity">
+           <el-timeline>
+            <el-timeline-item timestamp="2024/04/12" placement="top">
+              <el-card>
+                <h4>Update Design System</h4>
+                <p>Tom committed 2024/04/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2024/04/03" placement="top">
+              <el-card>
+                <h4>New Component Added</h4>
+                <p>Tom committed 2024/04/03 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </el-card>
+      </el-col>
+      <el-col :span="12">
+        <el-card header="Quick Actions">
+          <el-button type="primary">Create New Project</el-button>
+          <el-button>Import Assets</el-button>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import axios from 'axios'
+
+interface StatItem {
+  label: string
+  value: string
+}
+
+const stats = ref<StatItem[]>([])
+
+onMounted(async () => {
+  try {
+    const res = await axios.get('/api/stats')
+    if (res.data.code === 0) {
+      stats.value = res.data.data
+    }
+  } catch (error) {
+    console.error('Failed to fetch stats:', error)
+  }
+})
+</script>
+
+<style scoped>
+.card-value {
+  font-size: 24px;
+  font-weight: bold;
+  color: #409eff;
+}
+.card-header {
+  font-weight: bold;
+}
+</style>