首页编码

components.d.ts

@@ -11,6 +11,7 @@ declare module 'vue' {
     ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
     ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
     ElContainer: typeof import('element-plus/es')['ElContainer']
     ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
     ElHeade: typeof import('element-plus/es')['ElHeade']

src/router/index.ts

@@ -14,7 +14,7 @@ const router = createRouter({
       children: [
 		
         {
-          path: "/home",
+          path: "/",
           component: () => import("../views/home/index.vue"),
           meta: { title: "用户信息",parent:'wdxx' },
         },

src/views/home/index.vue

@@ -1,3 +1,62 @@
 <template>
-    <div>22222222222222222222222</div>
-</template>
+    <div>
+        <div class="title">
+            欢迎使用车辆调度管理系统
+        </div>
+        <div class="sub-title">
+            请从左侧菜单选择要管理的功能模块
+        </div>
+        <div class="card-wrap">
+            <div class="card-item">
+                <el-card style="width: 94%">
+                    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+                </el-card>
+            </div>
+            <div class="card-item">
+                <el-card style="width: 94%">
+                    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+                </el-card>
+            </div>
+            <div class="card-item">
+                <el-card style="width: 94%">
+                    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+                </el-card>
+            </div>
+            <div class="card-item">
+                <el-card style="width: 94%">
+                    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+                </el-card>
+            </div>
+        </div>
+
+        <div class="chart-wrap">
+            <div class="chart-item">
+                <el-card style="width: 97%">
+                    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+                </el-card>
+            </div>
+            <div class="chart-item">
+                <el-card style="width: 97%">
+                    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+                </el-card>
+            </div>
+           
+        </div>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+    .card-wrap{
+        display:flex;
+        .card-item{
+            width:25%;
+        }
+    }
+    .chart-wrap{
+        margin-top:32px;
+        display:flex;
+        .chart-item{
+            width:50%;
+        }
+    }
+</style>