diff --git a/src/App.vue b/src/App.vue
index 55df315..c44068f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,28 +1,109 @@
 <template>
   <div id="app">
-    <img alt="Vue logo" src="./assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
+    <h2 class="title">设备基本信息</h2>
+    <table class="swt-table">
+      <tbody>
+        <tr>
+          <td>电池类型</td>
+          <td>锂电池</td>
+          <td>电芯封装</td>
+          <td>placeholder</td>
+          <td>电池串数</td>
+          <td>placeholder</td>
+          <td>电池并数</td>
+          <td>placeholder</td>
+        </tr>
+        <tr>
+          <td>电池类型</td>
+          <td>placeholder</td>
+          <td>电芯封装</td>
+          <td>placeholder</td>
+          <td>电池串数</td>
+          <td>placeholder</td>
+          <td>电池并数</td>
+          <td>placeholder</td>
+        </tr>
+        <tr>
+          <td>单体额定电压</td>
+          <td>placeholder</td>
+          <td>网络连接状态</td>
+          <td>placeholder</td>
+          <td>系统故障状态</td>
+          <td>placeholder</td>
+          <td>额定电流</td>
+          <td>placeholder</td>
+        </tr>
+      </tbody>
+    </table>
+    <h2 class="title">设备运行状态</h2>
+    <table class="swt-table">
+      <tbody>
+        <tr>
+          <td>系统工作模式</td>
+          <td>放电</td>
+          <td>网络连接状态</td>
+          <td>在线</td>
+          <td>系统故障状态</td>
+          <td>placeholder</td>
+          <td>4G模块状态</td>
+          <td>placeholder</td>
+        </tr>
+        <tr>
+          <td>电池类型</td>
+          <td>placeholder</td>
+          <td>电芯封装</td>
+          <td>placeholder</td>
+          <td>电池串数</td>
+          <td>placeholder</td>
+          <td>电池并数</td>
+          <td>placeholder</td>
+        </tr>
+        <tr>
+          <td>电池类型</td>
+          <td>placeholder</td>
+          <td>电芯封装</td>
+          <td>placeholder</td>
+          <td>电池串数</td>
+          <td>placeholder</td>
+          <td>电池并数</td>
+          <td>placeholder</td>
+        </tr>
+      </tbody>
+    </table>
   </div>
 </template>
 
 <script>
-import HelloWorld from './components/HelloWorld.vue'
-
-export default {
-  name: 'App',
-  components: {
-    HelloWorld
-  }
-}
 </script>
 
 <style>
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
+body {
+  background-color: rgb(240, 240, 240);
+}
+
+.title {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+.swt-table {
+  width: 100%;
+  border: 1px solid rgb(200, 200, 200);
+  table-layout: fixed;
+  border-collapse: collapse;
+}
+
+.swt-table tbody tr td {
   text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
+  border: 1px solid rgb(200, 200, 200);
+  height: 40px;
+}
+
+.swt-table tbody tr td:nth-child(odd) {
+  background-color: rgb(240, 240, 240);
+}
+
+.swt-table tbody tr td:nth-child(even) {
+  background-color: white;
 }
 </style>