From e438e52d71f081c8bc8d8914174d635bfc2cec88 Mon Sep 17 00:00:00 2001
From: guanqb <18720758508@163.com>
Date: Sat, 12 Nov 2022 14:19:16 +0800
Subject: [PATCH] 1
---
src/views/home/components/rightContainer.vue | 55 +++++++++++++++++++++------
src/views/home/components/leftContainer.vue | 50 ++++++++++++++++++++++---
2 files changed, 86 insertions(+), 19 deletions(-)
diff --git a/src/views/home/components/leftContainer.vue b/src/views/home/components/leftContainer.vue
index 4c425f1..3d1639a 100644
--- a/src/views/home/components/leftContainer.vue
+++ b/src/views/home/components/leftContainer.vue
@@ -3,9 +3,16 @@
<div class="person-box">
<div class="title">
<div>
- <span class="peopleTap" :class="{ choosed: peopletype == 0 }"
- @click="peopleTabClick(0)">现有人员</span>/
- <span class="peopleTap" :class="{ choosed: peopletype == 1 }" @click="peopleTabClick(1)">重点人员</span>
+ <span
+ class="peopleTap"
+ :class="{ choosed: peopletype == 0 }"
+ @click="peopleTabClick(0)"
+ >现有人员</span>/
+ <span
+ class="peopleTap"
+ :class="{ choosed: peopletype == 1 }"
+ @click="peopleTabClick(1)"
+ >重点人员</span>
</div>
<div>
共
@@ -28,7 +35,12 @@
</div>
</div>
<div id="PersonEcharts" class="echarts-box"></div>
- <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin"></div>
+ <div
+ class="back"
+ title="返回上一级"
+ v-show="dataDeep == 2 && peopletype == 0"
+ @click="backBegin"
+ ></div>
</div>
<div class="house-box">
<div class="title">现有房屋</div>
@@ -247,6 +259,32 @@
{
data: yDate,
type: 'bar',
+ barWidth: '40%',
+ itemStyle: {
+ normal: {
+ color: function (params) {
+
+ return new global.echarts.graphic.LinearGradient(
+ 0, 0, 0, 1,
+ [
+ { offset: 0, color: '#06B5D7' },
+ { offset: 0.5, color: '#44C0C1' },
+ { offset: 1, color: '#71C8B1' },
+ ]
+ )
+ }
+ },
+ emphasis: {
+ color: new global.echarts.graphic.LinearGradient(
+ 0, 0, 0, 1,
+ [
+ { offset: 0, color: '#71C8B1' },
+ { offset: 0.7, color: '#44C0C1' },
+ { offset: 1, color: '#06B5D7' }
+ ]
+ )
+ }
+ },
}
],
grid: {
@@ -857,7 +895,7 @@
color: #fff;
}
- &>div:nth-of-type(2) {
+ & > div:nth-of-type(2) {
font-size: 14px;
}
}
@@ -879,7 +917,7 @@
border: 1px solid rgba(20, 50, 123, 1);
cursor: pointer;
- &>div {
+ & > div {
height: 26px;
line-height: 26px;
}
diff --git a/src/views/home/components/rightContainer.vue b/src/views/home/components/rightContainer.vue
index 94c1632..2861f84 100644
--- a/src/views/home/components/rightContainer.vue
+++ b/src/views/home/components/rightContainer.vue
@@ -4,9 +4,16 @@
<div class="title">
案件统计
<div class="timer">
- <el-date-picker v-model="eventTime" type="daterange" align="right" unlink-panels range-separator="至"
- start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
- </el-date-picker>
+ <el-date-picker
+ v-model="eventTime"
+ type="daterange"
+ align="right"
+ unlink-panels
+ range-separator="至"
+ start-placeholder="开始日期"
+ end-placeholder="结束日期"
+ :picker-options="pickerOptions"
+ ></el-date-picker>
</div>
</div>
<div id="EventChangeEcharts" class="echarts-box"></div>
@@ -14,15 +21,28 @@
<div class="alert-box">
<div class="title">
<span style="margin-right:130px">安保活动</span>
- <span class="activity" :class="{ choosed: acttype == 0 }" @click="actTabClick(0)">正在进行</span>
+ <span
+ class="activity"
+ :class="{ choosed: acttype == 0 }"
+ @click="actTabClick(0)"
+ >正在进行</span>
<span>/</span>
- <span class="activity" :class="{ choosed: acttype == 1 }" @click="actTabClick(1)">历史活动</span>
+ <span
+ class="activity"
+ :class="{ choosed: acttype == 1 }"
+ @click="actTabClick(1)"
+ >历史活动</span>
</div>
<div id="peopleList" class="echarts-box">
- <el-table :data="acttype == 0 ? underwayArr : historyArr" style="width: 100%"
+ <el-table
+ :data="acttype == 0 ? underwayArr : historyArr"
+ style="width: 100%"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
:cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
- :row-class-name="tableRowClassName" ref="activityTable" @row-click="activityRowClick">
+ :row-class-name="tableRowClassName"
+ ref="activityTable"
+ @row-click="activityRowClick"
+ >
<el-table-column prop="activityName" label="活动名称"></el-table-column>
<el-table-column prop="startTime" label="开始时间"></el-table-column>
<el-table-column prop="endTime" label="结束时间"></el-table-column>
@@ -33,9 +53,17 @@
<div class="crowd-box">
<div class="title">
<span style="margin-right:130px">现有设备</span>
- <span class="equiment" :class="{ choosed: linetype == 0 }" @click="lineTabClick(0)">在线设备</span>
+ <span
+ class="equiment"
+ :class="{ choosed: linetype == 0 }"
+ @click="lineTabClick(0)"
+ >在线设备</span>
<span>/</span>
- <span class="activity" :class="{ choosed: linetype == 1 }" @click="lineTabClick(1)">离线设备</span>
+ <span
+ class="activity"
+ :class="{ choosed: linetype == 1 }"
+ @click="lineTabClick(1)"
+ >离线设备</span>
</div>
<div style="overflow: hidden;" id="EquipmentEcharts" class="echarts-box"></div>
</div>
@@ -137,7 +165,7 @@
tooltip: {
trigger: 'item',
confine: true,
- formatter: ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px">{c0}人</strong>'
+ formatter: ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px">{c0}台</strong><strong style="margin-left:10px;color:#5c7bd9">{d}%</strong>'
},
legend: {
left: '60%',
@@ -154,7 +182,7 @@
}
}
let v = tarValue
- return `${name} ${v} 个 `
+ return `${name} ${v} 台 `
},
},
graphic: {
@@ -269,7 +297,8 @@
initEventChangeOption (seriesData) {
return {
tooltip: {
- trigger: 'item'
+ trigger: 'item',
+ formatter: ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px;color:#5c7bd9">{c0}起</strong>'
},
xAxis: {
type: 'category',
@@ -558,7 +587,7 @@
border: 1px solid rgba(20, 50, 123, 1);
cursor: pointer;
- &>div {
+ & > div {
height: 26px;
line-height: 26px;
}
--
Gitblit v1.9.3