update 修改主页样式

view/src/page/main.vue

@@ -1,22 +1,67 @@
-<script setup>
-
-import {Close, Position, Star} from "@element-plus/icons-vue";
-</script>
-
 <template>
-  <el-row :gutter="12">
-    <el-col :span="8">
-      <el-card shadow="hover"> <el-icon><Star /></el-icon> 订阅 </el-card>
+  <el-card class="box-card">
+    <template #header>
+      <div class="card-header">
+        <span>控制台</span>
+      </div>
+    </template>
+    <el-row>
+      <el-col :span="6">
+        <el-statistic title="订阅" :value="268500" />
       </el-col>
-    <el-col :span="8">
-      <el-card shadow="hover"> <el-icon><Position /></el-icon> 发布 </el-card>
+      <el-col :span="6">
+        <el-statistic :value="138">
+          <template #title>
+            <div style="display: inline-flex; align-items: center">
+              成功
+            </div>
+          </template>
+          <template #suffix>/100</template>
+        </el-statistic>
       </el-col>
-    <el-col :span="8">
-      <el-card shadow="hover"> <el-icon><Close /></el-icon> 失败 </el-card>
+      <el-col :span="6">
+        <el-statistic title="失败" :value="172000" />
+      </el-col>
+      <el-col :span="6">
+        <el-statistic title="重试" :value="562">
+          <template #suffix>
+            <el-icon style="vertical-align: -0.125em">
+              <ChatLineRound />
+            </el-icon>
+          </template>
+        </el-statistic>
       </el-col>
     </el-row>
+  </el-card>
+  <div  style="padding-top: 20px"></div>
+  <el-card  class="box-card">
+    <el-timeline>
+      <el-timeline-item center timestamp="2018/4/12" placement="top">
+        <el-card>
+          <h4>Update Github template</h4>
+          <p>Tom committed 2018/4/12 20:46</p>
+        </el-card>
+      </el-timeline-item>
+      <el-timeline-item timestamp="2018/4/3" placement="top">
+        <el-card>
+          <h4>Update Github template</h4>
+          <p>Tom committed 2018/4/3 20:46</p>
+        </el-card>
+      </el-timeline-item>
+      <el-timeline-item center timestamp="2018/4/2" placement="top">
+        Event start
+      </el-timeline-item>
+      <el-timeline-item timestamp="2018/4/2" placement="top">
+        Event end
+      </el-timeline-item>
+    </el-timeline>
+  </el-card>
 </template>
 
-<style scoped lang="scss">
 
+<script lang="ts" setup>
+import { ChatLineRound, Male } from '@element-plus/icons-vue'
+</script>
+
+<style scoped>
 </style>

view/src/page/settings.vue

@@ -3,9 +3,14 @@
 </script>
 
 <template>
-<h1>设置</h1>
+  <el-row :gutter="20">
+    <h1 style="padding: 20px">设置页面</h1>
+    <el-divider />
+  </el-row>
+
+
 </template>
 
-<style scoped lang="scss">
+<style>
 
 </style>