code-image-backup-public/fastbee
1
0
Fork 0
mirror of https://gitee.com/beecue/fastbee.git synced 2025-12-18 00:45:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

首页调整

Browse Source
This commit is contained in:
kerwincui
2022-07-29 00:31:55 +08:00
parent 844ebaa295
commit d9da66db28
1 changed files with 51 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
vue/src/views/index.vue
View File

@@ -1,15 +1,15 @@
<template> <template>
<div class="app-container home"> <div style="padding:10px;">
<el-row :gutter="40" style="margin-bottom:100px;"> <el-row :gutter="20" style="background-color:#fafafa;margin:10px 10px 50px 10px;">
<el-col :xs="24" :sm="24" :md="24" :lg="14" :xl="14"> <el-col :xs="24" :sm="24" :md="24" :lg="14" :xl="14">
<el-card style="margin:-10px;" shadow="hover" body-style="background-color:#eee;"> <div style="overflow:hidden;">
<div ref="map" style="height:651px;margin:-17px;margin-top:-12px;"></div> <div ref="map" style="height:650px;"></div>
</el-card> </div>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10"> <el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10">
<el-card style="margin:-10px;background-color:#fafafa;" shadow="never"> <div style="padding:20px;">
<h3 style="font-weight:bold">设备统计</h3> <h3 style="font-weight:bold"><i class="el-icon-s-data"></i> 设备统计</h3>
<el-row :gutter="40" class="panel-group"> <el-row :gutter="40" class="panel-group">
<el-col :span="12" class="card-panel-col"> <el-col :span="12" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
@@ -90,10 +90,9 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</el-card> </div>
<div style="padding:20px;">
<el-card style="margin:-10px;margin-top:40px;height:300px;background-color:#fafafa;" shadow="hover"> <h3 style="font-weight:bold;margin-bottom:10px;"><i class="el-icon-s-order"></i> 信息栏</h3>
<h3 style="font-weight:bold;margin-bottom:10px;">信息栏</h3>
<div style="cursor:pointer;display:table;width:100%;line-height:36px;" @click="openDetail(item.noticeId)" v-for="item in noticeList" :key="item.noticeId"> <div style="cursor:pointer;display:table;width:100%;line-height:36px;" @click="openDetail(item.noticeId)" v-for="item in noticeList" :key="item.noticeId">
<div style="display:table-cell;padding-right:10px;"> <div style="display:table-cell;padding-right:10px;">
<el-tag size="mini" effect="dark" type="warning" v-if="item.noticeType==2">公告</el-tag> <el-tag size="mini" effect="dark" type="warning" v-if="item.noticeType==2">公告</el-tag>
@@ -102,17 +101,17 @@
</div> </div>
<div style="display:table-cell;width:90px;font-size:14px;"><i class="el-icon-time"></i> {{ parseTime(item.createTime, '{y}-{m}-{d}') }}</div> <div style="display:table-cell;width:90px;font-size:14px;"><i class="el-icon-time"></i> {{ parseTime(item.createTime, '{y}-{m}-{d}') }}</div>
</div> </div>
</el-card> </div>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="40" v-if="isAdmin" style="margin-bottom:50px;"> <el-row :gutter="40" v-if="isAdmin" style="background-color:#fafafa;margin:10px 10px 50px 10px;">
<el-col :xs="24" :sm="24" :md="24" :lg="14" :xl="14"> <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
<el-card style="margin:-10px;background-color:#fafafa;height:320px;" shadow="never"> <div style="padding:20px;height:300px;">
<h3 style="font-weight:bold">Mqtt 统计指标</h3> <h3 style="font-weight:bold">Mqtt 统计指标</h3>
<el-row :gutter="20" class="panel-group"> <el-row :gutter="20" class="panel-group">
<el-col :span="12" class="card-panel-col"> <el-col :span="24" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-orange"> <div class="card-panel-icon-wrapper icon-orange">
<svg-icon icon-class="guide" class-name="card-panel-icon" /> <svg-icon icon-class="guide" class-name="card-panel-icon" />
@@ -125,7 +124,7 @@
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12" class="card-panel-col"> <el-col :span="24" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-green"> <div class="card-panel-icon-wrapper icon-green">
<svg-icon icon-class="receiver" class-name="card-panel-icon" /> <svg-icon icon-class="receiver" class-name="card-panel-icon" />
@@ -138,7 +137,7 @@
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12" class="card-panel-col"> <el-col :span="24" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-orange"> <div class="card-panel-icon-wrapper icon-orange">
<svg-icon icon-class="authenticate" class-name="card-panel-icon" /> <svg-icon icon-class="authenticate" class-name="card-panel-icon" />
@@ -151,7 +150,7 @@
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12" class="card-panel-col"> <el-col :span="24" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-green"> <div class="card-panel-icon-wrapper icon-green">
<svg-icon icon-class="connect" class-name="card-panel-icon" /> <svg-icon icon-class="connect" class-name="card-panel-icon" />
@@ -164,7 +163,7 @@
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12" class="card-panel-col"> <el-col :span="24" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-orange"> <div class="card-panel-icon-wrapper icon-orange">
<svg-icon icon-class="subscribe1" class-name="card-panel-icon" /> <svg-icon icon-class="subscribe1" class-name="card-panel-icon" />
@@ -177,7 +176,7 @@
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12" class="card-panel-col"> <el-col :span="24" class="card-panel-col">
<div class="card-panel"> <div class="card-panel">
<div class="card-panel-icon-wrapper icon-green"> <div class="card-panel-icon-wrapper icon-green">
<svg-icon icon-class="message" class-name="card-panel-icon" /> <svg-icon icon-class="message" class-name="card-panel-icon" />
@@ -191,18 +190,33 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</el-card> </div>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10"> <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
<el-card style="margin:-10px;background-color:#fafafa;" shadow="hover"> <div style="padding:20px;margin-top:30px;">
<div ref="statsChart" style="height:283px;"></div> <div ref="statsChart" style="height:280px;"></div>
</el-card> </div>
<el-row>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
<div style="padding:20px;margin-top:30px;">
<div ref="pieCpu" style="height:150px;margin-bottom:-20px;"></div>
</div>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
<div style="padding:20px;margin-top:30px;">
<div ref="pieMemery" style="height:150px;margin-bottom:-20px;"></div>
</div>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="8">
<div style="padding:20px;margin-top:30px;">
<div ref="pieDisk" style="height:150px;margin-bottom:-20px;"></div>
</div>
</el-col> </el-col>
</el-row> </el-row>
</el-col>
<el-row :gutter="40" v-if="isAdmin"> <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="6">
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6"> <div style="padding:20px;margin-top:30px;">
<el-card style="margin:-10px;height:218px;margin-bottom:30px;background-color:#fafafa;" shadow="hover"> <h3 style="font-weight:bold">服务器信息</h3>
<table class="description"> <table class="description">
<tr> <tr>
<td><strong>服务器名称： </strong></td> <td><strong>服务器名称： </strong></td>
@@ -229,25 +243,7 @@
<td>{{server.mem.total}}</td> <td>{{server.mem.total}}</td>
</tr> </tr>
</table> </table>
</el-card> <h3 style="font-weight:bold">Java虚拟机</h3>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4">
<el-card style="margin:-10px;height:218px;margin-bottom:30px;background-color:#fafafa;" shadow="hover">
<div ref="pieCpu" style="height:200px;margin-bottom:-20px;"></div>
</el-card>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4">
<el-card style="margin:-10px;height:218px;margin-bottom:30px;background-color:#fafafa;" shadow="hover">
<div ref="pieMemery" style="height:200px;margin-bottom:-20px;"></div>
</el-card>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4">
<el-card style="margin:-10px;height:218px;margin-bottom:30px;background-color:#fafafa;" shadow="hover">
<div ref="pieDisk" style="height:200px;margin-bottom:-20px;"></div>
</el-card>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6">
<el-card style="margin:-10px;height:218px;margin-bottom:30px;background-color:#fafafa;" shadow="hover">
<table class="description"> <table class="description">
<tr> <tr>
<td><strong>Java名称： </strong></td> <td><strong>Java名称： </strong></td>
@@ -274,8 +270,10 @@
<td>{{server.jvm.total}}</td> <td>{{server.jvm.total}}</td>
</tr> </tr>
</table> </table>
</el-card> </div>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="40" style="background-color:#fafafa;padding:60px 0;margin:-10px;margin-top:50px;"> <el-row :gutter="40" style="background-color:#fafafa;padding:60px 0;margin:-10px;margin-top:50px;">
@@ -1010,7 +1008,7 @@ export default {
position: relative; position: relative;
top: 46px; top: 46px;
left: 12px; left: 12px;
background-color:#fff; background-color: #fff;
} }
.content { .content {