From ddaa870224aa1c12b05ff2ac242c2283d3e54241 Mon Sep 17 00:00:00 2001 From: 龚焕茏 <2842157468@qq.com> Date: 星期四, 15 八月 2024 17:06:47 +0800 Subject: [PATCH] feat:首页数据调整 --- src/views/system/monitor/video/index.vue | 56 +++++++++++++++----------------------------------------- 1 files changed, 15 insertions(+), 41 deletions(-) diff --git a/src/views/system/monitor/video/index.vue b/src/views/system/monitor/video/index.vue index 09020f8..87296d4 100644 --- a/src/views/system/monitor/video/index.vue +++ b/src/views/system/monitor/video/index.vue @@ -3,13 +3,13 @@ <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"> + <el-row type="flex" align="middle" justify="space-between" style="width: 100%;"> + <el-col :span="4"> + <div class="icon-container" style="background-color: #1890FF"> <i class="el-icon-video-camera"></i> </div> </el-col> - <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16"> + <el-col :span="20"> <div class="dashboard"> <div class="dashboard-item"> <h3 style="color: #5C9BF8">{{ count.totalPosts }}</h3> @@ -22,18 +22,6 @@ <div class="dashboard-item"> <h3 style="color: #fe640d">{{ count.postsPercentage }}</h3> <p>寮傚父鏁�</p > - </div> - <div class="dashboard-item"> - <h3>{{ count.totalViews }}</h3> - <p>鐢熸垚寮傚父宸ュ崟鏁�</p > - </div> - <div class="dashboard-item"> - <h3>{{ count.noStore }}</h3> - <p>鏃犲瓨鍌�</p > - </div> - <div class="dashboard-item"> - <h3>{{ count.partStore }}</h3> - <p>閮ㄥ垎瀛樺偍</p > </div> <div class="dashboard-item"> <h3>{{ count.viewsPercentage }}%</h3> @@ -84,25 +72,10 @@ /> </el-select> </el-form-item> - <el-form-item label="鏄惁鐢熸垚寮傚父宸ュ崟" prop="defaultOrder" label-width="130px"> - <el-select - v-model="queryParams.defaultOrder" - placeholder="鏄惁鐢熸垚寮傚父宸ュ崟" - clearable - style="width: 170px" - > - <el-option - v-for="dict in dict.type.platform_yes_no" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> - </el-select> - </el-form-item> <el-form-item> - <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button> - <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button> + <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">鎼滅储</el-button> + <el-button icon="el-icon-refresh" size="small" @click="resetQuery">閲嶇疆</el-button> </el-form-item> </el-form> @@ -122,8 +95,8 @@ <el-table v-loading="loading" :data="monitorList" @selection-change="handleSelectionChange"> <el-table-column type="selection" align="center" /> - <el-table-column label="璁惧鍚嶇О" align="center" prop="name" width="280" fixed/> - <el-table-column label="璁惧缂栫爜" align="center" prop="serialNumber" width="180"/> + <el-table-column label="璁惧鍚嶇О" align="center" prop="name" width="280" fixed show-overflow-tooltip/> + <el-table-column label="璁惧缂栫爜" align="center" prop="serialNumber" width="180" show-overflow-tooltip/> <el-table-column label="鏍囩" align="center" prop="publicSecurity" width="180" v-if="columns[0].visible"> <template slot-scope="scope"> <div>{{"鐪佸巺"}}</div> @@ -434,17 +407,17 @@ <style lang="scss" scoped> .box-card { - background-color: #F5F9FE; + background-color: hsl(0, 0%, 100%); width: 100%; margin-bottom: 20px; - height: 120px + height: 120px; } .icon-container { display: flex; justify-content: center; align-items: center; - border-radius: 20px; - width: 20%; + border-radius: 10px; + width: 130px; height: 80px; margin-left: 5%; } @@ -455,9 +428,10 @@ .dashboard { display: flex; - gap: 10%; + gap: 5%; align-items: center; - margin-left: -50%; + justify-content: space-between; + margin-right: 20px; } .dashboard-item { -- Gitblit v1.8.0