From 987027d23b3a1b5935d36de691a19749b4778432 Mon Sep 17 00:00:00 2001 From: xiangpei <xiangpei@timesnew.cn> Date: 星期一, 18 三月 2024 15:42:23 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/views/system/car/index.vue | 99 +++++++++++++++++++++++++++++++++++++------------ 1 files changed, 75 insertions(+), 24 deletions(-) diff --git a/src/views/system/car/index.vue b/src/views/system/car/index.vue index 64c4527..91b35be 100644 --- a/src/views/system/car/index.vue +++ b/src/views/system/car/index.vue @@ -1,5 +1,39 @@ <template> <div class="app-container"> + <el-card class="box-card" > + <el-row type="flex" align="middle" justify="space-between"> + <el-col :xl="8" :lg="8" :md="10" :sm="8" :xs="6"> + <div class="icon-container" style="background-color: #5599F7"> + <i class="el-icon-truck"></i> + </div> + </el-col> + <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16"> + <div class="dashboard"> + <div class="dashboard-item"> + <h3 style="color: #5C9BF8">{{ totalPosts }}</h3> + <p>璁惧鎬绘暟</p > + </div> + <div class="dashboard-item"> + <h3 style="color: #3eba45">{{ totalMembers }}</h3> + <p>姝e父鏁�</p > + </div> + <div class="dashboard-item"> + <h3 style="color: #fe640d">{{ postsPercentage }}</h3> + <p>寮傚父鏁�</p > + </div> + <div class="dashboard-item"> + <h3 style="color: #7868d9">{{ totalViews }}</h3> + <p>鐢熸垚寮傚父宸ュ崟鏁�</p > + </div> + <div class="dashboard-item"> + <h3>{{ viewsPercentage }}%</h3> + <p>璁惧杩愯鐜�</p > + </div> + </div> + </el-col> + </el-row> + </el-card> + <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form-item label="璁惧鍚嶇О" prop="name"> <el-input @@ -24,30 +58,7 @@ /> </el-select> </el-form-item> - <el-form-item label="鍦板潃" prop="address"> - <el-input - v-model="queryParams.address" - placeholder="璇疯緭鍏ヨ鏀垮尯鍩�" - clearable - @keyup.enter.native="handleQuery" - /> - </el-form-item> - <el-form-item label="瀹夎鏃堕棿" prop="installedTime"> - <el-date-picker clearable - v-model="queryParams.installedTime" - type="date" - value-format="yyyy-MM-dd" - placeholder="璇烽�夋嫨瀹夎鏃堕棿"> - </el-date-picker> - </el-form-item> - <el-form-item label="绠$悊鍗曚綅" prop="managementUnit"> - <el-input - v-model="queryParams.managementUnit" - placeholder="璇疯緭鍏ョ鐞嗗崟浣�" - clearable - @keyup.enter.native="handleQuery" - /> - </el-form-item> + <el-form-item label="鏄惁鐢熸垚寮傚父宸ュ崟" prop="defaultOrder" label-width="130px"> <el-select v-model="queryParams.defaultOrder" @@ -169,6 +180,12 @@ dicts: ['sys_normal_disable','platform_yes_no','camera_state'], data() { return { + totalPosts: 1156, + totalMembers: 1000, + postsPercentage: 156, + totalViews: 75, + viewsPercentage: 91.36, + totalErrors: 0, // 閬僵灞� loading: true, // 閫変腑鏁扮粍 @@ -327,3 +344,37 @@ } }; </script> + +<style lang="scss" scoped> + +.box-card { + background-color: #F5F9FE; + width: 100%; + margin-bottom: 20px; + height: 120px +} +.icon-container { + display: flex; + justify-content: center; + align-items: center; + border-radius: 20px; + width: 20%; + height: 80px; + margin-left: 5%; +} +.el-icon-truck { + font-size: 50px; + color: #FFFFFF; +} + +.dashboard { + display: flex; + gap: 10%; + align-items: center; + margin-left: -50%; +} + +.dashboard-item { + text-align: center; +} +</style> -- Gitblit v1.8.0