|
@@ -2,7 +2,7 @@
|
|
|
<div class="out">
|
|
|
<div class="title">
|
|
|
<div class="title-left" @click="titlefun">
|
|
|
- <img src="../../assets/images/返回icon.png" alt="">
|
|
|
+ <img src="../../assets/images/返回icon.png" alt />
|
|
|
<span>主控台</span>
|
|
|
</div>
|
|
|
<div class="title-right">
|
|
@@ -12,10 +12,10 @@
|
|
|
<div class="main">
|
|
|
<div class="left">
|
|
|
<div class="left1">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left1-head">
|
|
|
<span>今日值班</span>
|
|
|
</div>
|
|
@@ -28,10 +28,10 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="left2">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left2-1">
|
|
|
<div class="left1-head">
|
|
|
<span>装备值班情况</span>
|
|
@@ -134,10 +134,10 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="left3">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left1-head">
|
|
|
<span>车辆在位情况</span>
|
|
|
</div>
|
|
@@ -224,10 +224,10 @@
|
|
|
</div>
|
|
|
<div class="center">
|
|
|
<div class="center1">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left1-head">
|
|
|
<span>大队人员在位情况</span>
|
|
|
</div>
|
|
@@ -352,20 +352,20 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="center-a">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left1-head">
|
|
|
<span>检查督导统计</span>
|
|
|
</div>
|
|
|
<div id="center-a-main"></div>
|
|
|
</div>
|
|
|
<div class="center-b">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="center-b-l">
|
|
|
<div class="left1-head">
|
|
|
<span>营房统计</span>
|
|
@@ -379,7 +379,9 @@
|
|
|
<td style="color: #30fdff;font-family: 'IMPACT';font-size: 28px;"></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
- <td style="font-family: 'IMPACT';font-size: 2rem;color: #30FDFF ;display:block;">56</td>
|
|
|
+ <td
|
|
|
+ style="font-family: 'IMPACT';font-size: 2rem;color: #30FDFF ;display:block;"
|
|
|
+ >56</td>
|
|
|
<td style="font-size: 20px;color: white;display:block;">营房统计</td>
|
|
|
</tr>
|
|
|
</table>
|
|
@@ -411,7 +413,9 @@
|
|
|
<td style="color: #e6923e;font-family: 'IMPACT';font-size: 22px;"></td>
|
|
|
</tr>
|
|
|
<tr>
|
|
|
- <td style="font-family: 'IMPACT';font-size: 2rem;color: #30FDFF ;display:block;">56</td>
|
|
|
+ <td
|
|
|
+ style="font-family: 'IMPACT';font-size: 2rem;color: #30FDFF ;display:block;"
|
|
|
+ >56</td>
|
|
|
<td style="font-size: 20px;color: white;display:block;">营具统计</td>
|
|
|
</tr>
|
|
|
</table>
|
|
@@ -434,10 +438,10 @@
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
<div class="right1">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left1-head">
|
|
|
<span>登记落实</span>
|
|
|
</div>
|
|
@@ -617,10 +621,10 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="right2">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="left1-head">
|
|
|
<span>防疫物资储备情况</span>
|
|
|
</div>
|
|
@@ -633,10 +637,10 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="right3">
|
|
|
- <img src="../../assets/images/右上角.png" alt="" class="left1-jrt">
|
|
|
- <img src="../../assets/images/右下角.png" alt="" class="left1-jrb">
|
|
|
- <img src="../../assets/images/左上角.png" alt="" class="left1-jlt">
|
|
|
- <img src="../../assets/images/左下角.png" alt="" class="left1-jlb">
|
|
|
+ <img src="../../assets/images/右上角.png" alt class="left1-jrt" />
|
|
|
+ <img src="../../assets/images/右下角.png" alt class="left1-jrb" />
|
|
|
+ <img src="../../assets/images/左上角.png" alt class="left1-jlt" />
|
|
|
+ <img src="../../assets/images/左下角.png" alt class="left1-jlb" />
|
|
|
<div class="right3-l">
|
|
|
<div class="left1-head2">
|
|
|
<span>集中文印</span>
|
|
@@ -649,7 +653,7 @@
|
|
|
<div class="right3-r-main-item-r">
|
|
|
<div class="s1">总打印数量</div>
|
|
|
<div class="s2">
|
|
|
- <b style="color:#30FDFF">{{this.wylist.mouthprints}}</b>台
|
|
|
+ <b style="color:#30FDFF">{{this.wylist.mouthprints}}</b>份
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -660,7 +664,7 @@
|
|
|
<div class="right3-r-main-item-r">
|
|
|
<div class="s1">归还数量</div>
|
|
|
<div class="s2">
|
|
|
- <b style="color:#2BF1B2">{{this.wylist[1]}}</b>台
|
|
|
+ <b style="color:#2BF1B2">{{this.wylist[1]}}</b>份
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -671,7 +675,7 @@
|
|
|
<div class="right3-r-main-item-r">
|
|
|
<div class="s1">未归还数量</div>
|
|
|
<div class="s2">
|
|
|
- <b style="color:#FF5A5A ">{{this.wylist[0]}}</b>台
|
|
|
+ <b style="color:#FF5A5A ">{{this.wylist[0]}}</b>份
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -682,7 +686,7 @@
|
|
|
<div class="right3-r-main-item-r">
|
|
|
<div class="s1">无需归还数量</div>
|
|
|
<div class="s2">
|
|
|
- <b style="color:#738C97">{{this.wylist.notreturns}}</b>台
|
|
|
+ <b style="color:#738C97">{{this.wylist.notreturns}}</b>份
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -770,12 +774,12 @@ export default {
|
|
|
jrzblist: [],
|
|
|
//登记落实
|
|
|
djlslist: [],
|
|
|
- jclist:[],
|
|
|
+ jclist: [],
|
|
|
//定时器
|
|
|
timer: null,
|
|
|
//外出人员占比
|
|
|
wclist: [],
|
|
|
- wylist:[],
|
|
|
+ wylist: [],
|
|
|
config: {
|
|
|
header: ["单位", "防疫名称", "现有数量"],
|
|
|
data: [
|
|
@@ -828,7 +832,17 @@ export default {
|
|
|
{ name: "发射四营", a: 0, b: 1, c: 1, d: 0 }
|
|
|
],
|
|
|
timer2: null,
|
|
|
- times: null
|
|
|
+ times: null,
|
|
|
+ jrzblist: [
|
|
|
+ { name: "值班首长", value: "" },
|
|
|
+ { name: "作战值班员", value: "" },
|
|
|
+ { name: "通信值班员", value: "" },
|
|
|
+ { name: "机要值班员", value: "" },
|
|
|
+ { name: "政治工作部值班员", value: "" },
|
|
|
+ { name: "政治工作部值班员", value: "" },
|
|
|
+ { name: "政治工作部值班员", value: "" },
|
|
|
+ { name: "政治工作部值班员", value: "" }
|
|
|
+ ]
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
@@ -844,23 +858,35 @@ export default {
|
|
|
});
|
|
|
//今日值班
|
|
|
jinrizhiban().then(res => {
|
|
|
- for (var i in res.data) {
|
|
|
- if (i == "chiefDutyName") {
|
|
|
- this.jrzblist.push({ name: "值班首长", value: res.data[i] });
|
|
|
- } else if (i == "combatDutyName") {
|
|
|
- this.jrzblist.push({ name: "作战值班员", value: res.data[i] });
|
|
|
- } else if (i == "dutyOffierName") {
|
|
|
- this.jrzblist.push({ name: "通信值班员", value: res.data[i] });
|
|
|
- } else if (i == "confidentialName") {
|
|
|
- this.jrzblist.push({ name: "机要值班员", value: res.data[i] });
|
|
|
- } else if (i == "politicalName") {
|
|
|
- this.jrzblist.push({ name: "政治工作部值班员", value: res.data[i] });
|
|
|
- } else if (i == "guaranteeName") {
|
|
|
- this.jrzblist.push({ name: "保障部值班员", value: res.data[i] });
|
|
|
- } else if (i == "messengerName") {
|
|
|
- this.jrzblist.push({ name: "值班通信员", value: res.data[i] });
|
|
|
- } else if (i == "detachmentName") {
|
|
|
- this.jrzblist.push({ name: "值班分队", value: res.data[i] });
|
|
|
+ if (res.data.length > 0) {
|
|
|
+ this.jrzblist = [];
|
|
|
+ for (var i in res.data) {
|
|
|
+ if (i == "chiefDutyName") {
|
|
|
+ this.jrzblist.push({ name: "值班首长", value: res.data[i] });
|
|
|
+ } else if (i == "combatDutyName") {
|
|
|
+ this.jrzblist.push({ name: "作战值班员", value: res.data[i] });
|
|
|
+ } else if (i == "dutyOffierName") {
|
|
|
+ this.jrzblist.push({ name: "通信值班员", value: res.data[i] });
|
|
|
+ } else if (i == "confidentialName") {
|
|
|
+ this.jrzblist.push({ name: "机要值班员", value: res.data[i] });
|
|
|
+ } else if (i == "politicalName") {
|
|
|
+ this.jrzblist.push({
|
|
|
+ name: "政治工作部值班员",
|
|
|
+ value: res.data[i]
|
|
|
+ });
|
|
|
+ } else if (i == "guaranteeName") {
|
|
|
+ this.jrzblist.push({
|
|
|
+ name: "政治工作部值班员",
|
|
|
+ value: res.data[i]
|
|
|
+ });
|
|
|
+ } else if (i == "messengerName") {
|
|
|
+ this.jrzblist.push({
|
|
|
+ name: "政治工作部值班员",
|
|
|
+ value: res.data[i]
|
|
|
+ });
|
|
|
+ } else if (i == "detachmentName") {
|
|
|
+ this.jrzblist.push({ name: "值班分队", value: res.data[i] });
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
});
|
|
@@ -869,19 +895,19 @@ export default {
|
|
|
this.djlslist = res.data;
|
|
|
});
|
|
|
//集中文印
|
|
|
- rizongwenyin().then(res=>{
|
|
|
- // console.log(res.data[0])
|
|
|
- this.wylist=res.data;
|
|
|
- })
|
|
|
+ rizongwenyin().then(res => {
|
|
|
+ // console.log(res.data[0])
|
|
|
+ this.wylist = res.data;
|
|
|
+ });
|
|
|
//军车
|
|
|
- juncheguanli().then(res=>{
|
|
|
- // console.log(res)
|
|
|
- this.jclist=res.data;
|
|
|
- })
|
|
|
+ juncheguanli().then(res => {
|
|
|
+ // console.log(res)
|
|
|
+ this.jclist = res.data;
|
|
|
+ });
|
|
|
//涉密移动载体
|
|
|
- getNumber().then(res=>{
|
|
|
+ getNumber().then(res => {
|
|
|
// cconsole.log(res)
|
|
|
- })
|
|
|
+ });
|
|
|
this.startTime();
|
|
|
},
|
|
|
mounted() {
|
|
@@ -1098,86 +1124,354 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- const myColor = ["#0496FF", "#EF4E4E", "#00E4FF", "#36E2B3", "#E89831"];
|
|
|
+ const path = "path://M1390,595h79l-39,22Z";
|
|
|
+ const myColor = ["#fff", "#fff", "#fff", "#fff", "#fff"];
|
|
|
const option12 = {
|
|
|
- tooltip: {
|
|
|
- color: "#00CCFF"
|
|
|
- },
|
|
|
grid: {
|
|
|
- containLabel: true,
|
|
|
- left: "2%",
|
|
|
- top: 20,
|
|
|
- right: "3%",
|
|
|
- bottom: "1%"
|
|
|
+ left: 70,
|
|
|
+ bottom: "25%",
|
|
|
+ top: "15%"
|
|
|
},
|
|
|
- xAxis: [
|
|
|
- {
|
|
|
- type: "category",
|
|
|
- data: data,
|
|
|
- axisTick: {
|
|
|
- alignWithLabel: true,
|
|
|
- show: false
|
|
|
+ xAxis: {
|
|
|
+ axisLabel: {
|
|
|
+ padding: 15,
|
|
|
+ interval: 0,
|
|
|
+ textStyle: {
|
|
|
+ color: function(param, index) {
|
|
|
+ return myColor[index];
|
|
|
+ },
|
|
|
+ fontSize: 12,
|
|
|
+ fontWeight: 100
|
|
|
},
|
|
|
- nameTextStyle: {
|
|
|
+ margin: 10
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ axisLine: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ splitArea: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ axisTick: {
|
|
|
+ show: false
|
|
|
+ },
|
|
|
+ data: ["休假", "请假", "学习", "出差", "特殊类型"]
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ axisLine: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#6e6e6e",
|
|
|
+ width: 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ axisLabel: {
|
|
|
+ interval: 0,
|
|
|
+ formatter: "{value}%",
|
|
|
+ textStyle: {
|
|
|
+ fontSize: 12,
|
|
|
color: "#fff"
|
|
|
},
|
|
|
- axisLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#5c6c81"
|
|
|
- }
|
|
|
- },
|
|
|
- axisLabel: {
|
|
|
- textStyle: {
|
|
|
- color: "#fff"
|
|
|
- }
|
|
|
+ margin: 20
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: true
|
|
|
+ },
|
|
|
+ axisTick: {
|
|
|
+ lineStyle: {
|
|
|
+ color: "#fff",
|
|
|
+ width: 1,
|
|
|
+ height: 5
|
|
|
}
|
|
|
}
|
|
|
- ],
|
|
|
- yAxis: [
|
|
|
+ },
|
|
|
+ series: [
|
|
|
{
|
|
|
- type: "value",
|
|
|
- axisLabel: {
|
|
|
- textStyle: {
|
|
|
- color: "#fff"
|
|
|
- },
|
|
|
- formatter: "{value}",
|
|
|
- color: "#00e4ff"
|
|
|
+ type: "bar",
|
|
|
+ barWidth: 60,
|
|
|
+ barGap: "-100%",
|
|
|
+ stack: "广告",
|
|
|
+ itemStyle: {
|
|
|
+ color: function(params) {
|
|
|
+ const colorList = [
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ])
|
|
|
+ ];
|
|
|
+ return colorList[params.dataIndex];
|
|
|
+ }
|
|
|
},
|
|
|
- splitLine: {
|
|
|
- lineStyle: {
|
|
|
- color: "#fff",
|
|
|
- opacity: 0.3
|
|
|
+ data: data1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "",
|
|
|
+ type: "pictorialBar",
|
|
|
+ symbol: path,
|
|
|
+ symbolSize: [60, 20],
|
|
|
+ symbolOffset: [0, 0],
|
|
|
+ z: 12,
|
|
|
+ symbolPosition: "end",
|
|
|
+ itemStyle: {
|
|
|
+ color: "#e2e2e2",
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ data: data2
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "",
|
|
|
+ type: "pictorialBar",
|
|
|
+ symbol: path,
|
|
|
+ symbolSize: [60, 20],
|
|
|
+ symbolOffset: [0, 20],
|
|
|
+ z: 12,
|
|
|
+ itemStyle: {
|
|
|
+ opacity: 1,
|
|
|
+ color: function(params) {
|
|
|
+ const colorList = [
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ]),
|
|
|
+ new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
|
+ {
|
|
|
+ offset: 0,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 0.5,
|
|
|
+ color: "#39b3ff"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1,
|
|
|
+ color: "#39b3ff"
|
|
|
+ }
|
|
|
+ ])
|
|
|
+ ];
|
|
|
+ return colorList[params.dataIndex];
|
|
|
}
|
|
|
},
|
|
|
- axisLine: {
|
|
|
- show: false
|
|
|
- }
|
|
|
- }
|
|
|
- ],
|
|
|
- series: [
|
|
|
+ data: [1, 1, 1, 1, 1]
|
|
|
+ },
|
|
|
{
|
|
|
- data: data1,
|
|
|
- type: "bar",
|
|
|
- barWidth: 18,
|
|
|
+ name: "",
|
|
|
+ type: "pictorialBar",
|
|
|
+ symbol: path,
|
|
|
+ symbolSize: [60, 20],
|
|
|
+ symbolOffset: [0, 0],
|
|
|
+ z: 12,
|
|
|
label: {
|
|
|
- normal: {
|
|
|
- show: true,
|
|
|
- position: "top",
|
|
|
- formatter: "{c}",
|
|
|
- color: "#fff"
|
|
|
+ show: true,
|
|
|
+ formatter: "{c}人",
|
|
|
+ position: "top",
|
|
|
+ distance: 5,
|
|
|
+ color: "#fff",
|
|
|
+ fontWeight: 100,
|
|
|
+ textShadowColor: "rgba(255, 255, 255, .6)",
|
|
|
+ fontSize: 16,
|
|
|
+ textShadowBlur: "0",
|
|
|
+ textShadowOffsetX: 1,
|
|
|
+ textShadowOffsetY: 1
|
|
|
+ },
|
|
|
+ itemStyle: {
|
|
|
+ opacity: 1,
|
|
|
+ color: function(params) {
|
|
|
+ const colorList = [
|
|
|
+ "#39b3ff",
|
|
|
+ "#39b3ff",
|
|
|
+ "#39b3ff",
|
|
|
+ "#39b3ff",
|
|
|
+ "#39b3ff"
|
|
|
+ ];
|
|
|
+ return colorList[params.dataIndex];
|
|
|
}
|
|
|
},
|
|
|
+ symbolPosition: "end",
|
|
|
+ data: data1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "",
|
|
|
+ type: "effectScatter",
|
|
|
+ rippleEffect: {
|
|
|
+ period: 1,
|
|
|
+ scale: 5,
|
|
|
+ brushType: "fill"
|
|
|
+ },
|
|
|
+ z: 20,
|
|
|
+ symbolPosition: "end",
|
|
|
+ symbol: path,
|
|
|
+ symbolSize: [15, 5],
|
|
|
+ symbolOffset: [0, 9],
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
- barBorderRadius: 0,
|
|
|
- color: params => {
|
|
|
- return myColor[params.dataIndex];
|
|
|
- }
|
|
|
+ color: "#fff"
|
|
|
}
|
|
|
- }
|
|
|
+ },
|
|
|
+ data: data1
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
+ const backImg = "/asset/get/s/data-1622796959507-HTopachtJ.png";
|
|
|
+ myChartss._dom.style.backgroundImage = "url('" + backImg + "')";
|
|
|
myChartss.setOption(option12);
|
|
|
window.addEventListener("resize", function() {
|
|
|
myChartss.resize();
|
|
@@ -1262,7 +1556,7 @@ export default {
|
|
|
show: true,
|
|
|
position: "top",
|
|
|
formatter: "{c}",
|
|
|
- color: "#00e4ff"
|
|
|
+ color: "#ff9000"
|
|
|
}
|
|
|
},
|
|
|
data: [500, 700, 900, 800, 700, 600, 800]
|
|
@@ -1394,7 +1688,7 @@ export default {
|
|
|
.title-left {
|
|
|
position: absolute;
|
|
|
left: 115px;
|
|
|
- top: 40px;
|
|
|
+ top: 12px;
|
|
|
width: 179px;
|
|
|
height: 51px;
|
|
|
background-image: url("../../assets/images/主控台按钮底.png");
|
|
@@ -1403,22 +1697,23 @@ export default {
|
|
|
text-align: center;
|
|
|
line-height: 51px;
|
|
|
color: #fff;
|
|
|
- font-size:1.2vw;
|
|
|
+ font-size: 1.2vw;
|
|
|
font-weight: bold;
|
|
|
cursor: pointer;
|
|
|
+ opacity: 0.8;
|
|
|
}
|
|
|
-.title-left img{
|
|
|
+.title-left img {
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
.title-right {
|
|
|
position: absolute;
|
|
|
- color: #00F6FF;
|
|
|
- font-size:1.2vw;
|
|
|
+ color: #00f6ff;
|
|
|
+ font-size: 1.2vw;
|
|
|
right: 100px;
|
|
|
top: 36px;
|
|
|
}
|
|
|
.main {
|
|
|
- flex:1;
|
|
|
+ flex: 1;
|
|
|
width: 100%;
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
@@ -1452,25 +1747,25 @@ export default {
|
|
|
margin-top: 10px;
|
|
|
position: relative;
|
|
|
}
|
|
|
-.left1-jrt{
|
|
|
+.left1-jrt {
|
|
|
position: absolute;
|
|
|
- right:0;
|
|
|
- top:0;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
}
|
|
|
-.left1-jlt{
|
|
|
+.left1-jlt {
|
|
|
position: absolute;
|
|
|
- left:0;
|
|
|
- top:0;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
}
|
|
|
-.left1-jrb{
|
|
|
+.left1-jrb {
|
|
|
position: absolute;
|
|
|
- right:0;
|
|
|
- bottom:0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
}
|
|
|
-.left1-jlb{
|
|
|
+.left1-jlb {
|
|
|
position: absolute;
|
|
|
- left:0;
|
|
|
- bottom:0;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
}
|
|
|
.left1-head {
|
|
|
width: 20vw;
|
|
@@ -1787,14 +2082,14 @@ export default {
|
|
|
|
|
|
.center4 {
|
|
|
width: 100%;
|
|
|
- height:20%;
|
|
|
- display:flex;
|
|
|
+ height: 20%;
|
|
|
+ display: flex;
|
|
|
flex-direction: column;
|
|
|
}
|
|
|
|
|
|
#center4_d {
|
|
|
width: 100%;
|
|
|
- flex:1;
|
|
|
+ flex: 1;
|
|
|
}
|
|
|
|
|
|
.center4_d-1 {
|
|
@@ -1869,7 +2164,7 @@ export default {
|
|
|
align-items: center; */
|
|
|
display: inline-block;
|
|
|
line-height: 40px;
|
|
|
- margin-top:0.5%;
|
|
|
+ margin-top: 0.5%;
|
|
|
}
|
|
|
|
|
|
.right2_d span {
|
|
@@ -1891,7 +2186,7 @@ export default {
|
|
|
margin-left: 1%;
|
|
|
display: inline-block;
|
|
|
line-height: 40px;
|
|
|
- margin-top:0.5%;
|
|
|
+ margin-top: 0.5%;
|
|
|
}
|
|
|
|
|
|
.right2_b span {
|