Skip to content

L
lanzhou-transportation
提交 edfeb388 作者: tangwang
操作

3-31

上级 60428317
流水线 #2021 已通过 于阶段
in 1 分 20 秒
正在显示 包含 507 行增加 和 185 行删除
src/views/bottom-component.vue
...@@ -59,6 +59,11 @@ export default { ...@@ -59,6 +59,11 @@ export default {
.bottom-components { .bottom-components {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
background-image: url('./../assets/images/bot-bg.png');
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
padding: 30px 100px;
.bottom-item { .bottom-item {
margin: 0; margin: 0;
padding: 0; padding: 0;
......
src/views/left1/left-component1.vue
<template> <template>
<div class="left-component1"> <div class="left-component1">
<TianQi></TianQi> <TianQi></TianQi>
<h3 class="list-title">全市交通运行情况</h3> <h3 class="list-title" style="margin-top:32px;">全市交通运行情况(万辆)</h3>
<div class="total-list"> <div class="total-list">
<div class="list-item"> <div class="list-item">
<div> <div>
...@@ -19,9 +19,9 @@ ...@@ -19,9 +19,9 @@
<Left1Echart1></Left1Echart1> <Left1Echart1></Left1Echart1>
</div> </div>
<div class="total-static-box"> <div class="total-static-box">
<span>总数 <em>348</em></span> <span>总数 <em>38.12</em></span>
<span>在线 <em>266</em></span> <span>在线 <em>26.11</em></span>
<span>离线 <em>10</em></span> <span>离线 <em>12.01</em></span>
</div> </div>
</div> </div>
<div class="list-item"> <div class="list-item">
...@@ -40,9 +40,9 @@ ...@@ -40,9 +40,9 @@
<Left1Echart2></Left1Echart2> <Left1Echart2></Left1Echart2>
</div> </div>
<div class="total-static-box"> <div class="total-static-box">
<span>总数 <em>348</em></span> <span>总数 <em>20.1</em></span>
<span>在线 <em>266</em></span> <span>在线 <em>16.5</em></span>
<span>离线 <em>10</em></span> <span>离线 <em>3.6</em></span>
</div> </div>
</div> </div>
</div> </div>
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
<div> <div>
<p class="item-p">当前交通拥堵指数</p> <p class="item-p">当前交通拥堵指数</p>
<div class="list-item-box"> <div class="list-item-box">
<div class="box-num">2</div> <div class="box-num">1</div>
<div class="box-num">0</div> <div class="box-num">0</div>
<div class="box-num">.</div> <div class="box-num">.</div>
<div class="box-num">5</div> <div class="box-num">5</div>
...@@ -64,9 +64,9 @@ ...@@ -64,9 +64,9 @@
<Left1Echart3></Left1Echart3> <Left1Echart3></Left1Echart3>
</div> </div>
<div class="total-static-box"> <div class="total-static-box">
<span>总数 <em>348</em></span> <span>总数 <em>31.5</em></span>
<span>在线 <em>266</em></span> <span>在线 <em>26.6</em></span>
<span>离线 <em>10</em></span> <span>离线 <em>3.9</em></span>
</div> </div>
</div> </div>
<div class="list-item"> <div class="list-item">
...@@ -85,9 +85,9 @@ ...@@ -85,9 +85,9 @@
<Left1Echart4></Left1Echart4> <Left1Echart4></Left1Echart4>
</div> </div>
<div class="total-static-box"> <div class="total-static-box">
<span>总数 <em>348</em></span> <span>总数 <em>28.01</em></span>
<span>在线 <em>266</em></span> <span>在线 <em>18.11</em></span>
<span>离线 <em>10</em></span> <span>离线 <em>9.90</em></span>
</div> </div>
</div> </div>
</div> </div>
...@@ -118,7 +118,7 @@ export default { ...@@ -118,7 +118,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
} }
.total-list { .total-list {
...@@ -129,6 +129,7 @@ export default { ...@@ -129,6 +129,7 @@ export default {
.item-p { .item-p {
color: #47f1f0; color: #47f1f0;
margin: 16px 0; margin: 16px 0;
font-size: 20px;
.item-bg1 { .item-bg1 {
width: 16px; width: 16px;
height: 16px; height: 16px;
...@@ -181,7 +182,7 @@ export default { ...@@ -181,7 +182,7 @@ export default {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
em { em {
font-size: 18px; font-size: 20px;
} }
span:nth-child(1) { span:nth-child(1) {
color: #0fdb0f; color: #0fdb0f;
......
src/views/left2/left-component2.vue
<template> <template>
<div class="left-component2"> <div class="left-component2">
<TianQi></TianQi> <TianQi></TianQi>
<h3 class="list-title">出租车在线情况</h3> <h3 class="list-title">出租车在线情况(万辆)</h3>
<div class="box-list"> <div class="box-list">
<div class="box-item" v-for="(item, index) in 6" :key="index"> <div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" /> <img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州交通出租汽车有限公司</div> <div class="compony">兰州交通出租汽车有限公司</div>
<div class="bl"> <div class="bl">
<p>94.5%</p> <p>26.5%</p>
<p>在线占比</p> <p>在线占比</p>
</div> </div>
<div class="total"> <div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" /> <img src="./../../assets/images/left2-icon2.png" alt="" />
<div> <div>
<p>873</p> <p>83.46</p>
<p>总车数</p> <p>总车数</p>
</div> </div>
</div> </div>
<div class="total"> <div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" /> <img src="./../../assets/images/left2-icon1.png" alt="" />
<div> <div>
<p>873</p> <p>26.11</p>
<p>离线数</p>
</div>
</div>
</div>
<div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州奔马汽车出租有限公司</div>
<div class="bl">
<p>16.5%</p>
<p>在线占比</p>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" />
<div>
<p>53.46</p>
<p>总车数</p>
</div>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" />
<div>
<p>16.21</p>
<p>离线数</p>
</div>
</div>
</div>
<div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州金田汽车出租有限公司</div>
<div class="bl">
<p>10.5%</p>
<p>在线占比</p>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" />
<div>
<p>33.26</p>
<p>总车数</p>
</div>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" />
<div>
<p>14.21</p>
<p>离线数</p>
</div>
</div>
</div>
<div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州南巡汽车出租有限公司</div>
<div class="bl">
<p>9.1%</p>
<p>在线占比</p>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" />
<div>
<p>29.26</p>
<p>总车数</p>
</div>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" />
<div>
<p>11.31</p>
<p>离线数</p>
</div>
</div>
</div>
<div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州青年汽车出租有限公司</div>
<div class="bl">
<p>8.5%</p>
<p>在线占比</p>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" />
<div>
<p>21.26</p>
<p>总车数</p>
</div>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" />
<div>
<p>10.21</p>
<p>离线数</p>
</div>
</div>
</div>
<div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州天元汽车出租有限公司</div>
<div class="bl">
<p>6.5%</p>
<p>在线占比</p>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" />
<div>
<p>13.26</p>
<p>总车数</p>
</div>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" />
<div>
<p>5.21</p>
<p>离线数</p>
</div>
</div>
</div>
<div class="box-item">
<img src="./../../assets/images/兰州_21.png" class="img" alt="" />
<div class="compony">兰州汇力汽车出租有限公司</div>
<div class="bl">
<p>4.5%</p>
<p>在线占比</p>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon2.png" alt="" />
<div>
<p>10.26</p>
<p>总车数</p>
</div>
</div>
<div class="total">
<img src="./../../assets/images/left2-icon1.png" alt="" />
<div>
<p>4.01</p>
<p>离线数</p> <p>离线数</p>
</div> </div>
</div> </div>
...@@ -90,14 +222,14 @@ export default { ...@@ -90,14 +222,14 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
} }
.box-list { .box-list {
.box-item { .box-item {
display: flex; display: flex;
align-items: center; align-items: center;
margin: 10px 0; margin: 20px 0;
.img { .img {
width: 50px; width: 50px;
} }
......
src/views/left3/left-component3.vue
...@@ -78,7 +78,7 @@ export default { ...@@ -78,7 +78,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
} }
.box-list { .box-list {
......
src/views/left4/left-component4.vue
...@@ -15,54 +15,69 @@ ...@@ -15,54 +15,69 @@
<div class="list-table"> <div class="list-table">
<div class="table-content"> <div class="table-content">
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>43.12</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>10.01/</em><em style="color: #f2c232">13.43</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>42.12</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>16.13/</em><em style="color: #f2c232">16.40</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>39.13</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>10.01/</em><em style="color: #f2c232">14.31</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>44.46</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>11.65/</em><em style="color: #f2c232">15.69</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>38.36</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>12.63/</em><em style="color: #f2c232">18.4</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>43.35</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>11.56/</em><em style="color: #f2c232">13.4</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>44.47</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>10.63/</em><em style="color: #f2c232">16.94</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>41.56</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>10.36/</em><em style="color: #f2c232">13.4</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>44.65</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>10.56/</em><em style="color: #f2c232">16.53</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span><em>44</em>辆</span> <span><em>44.45</em>辆</span>
<span>当日</span> <span>当日</span>
<span><em>10/</em><em style="color: #f2c232">134</em>辆</span> <span><em>10/</em><em style="color: #f2c232">13.4</em>辆</span>
</div>
<div class="table-line">
<span><em>43.45</em>辆</span>
<span>当日</span>
<span><em>10.56/</em><em style="color: #f2c232">13.4</em>辆</span>
</div>
<div class="table-line">
<span><em>45.45</em>辆</span>
<span>当日</span>
<span><em>11.56/</em><em style="color: #f2c232">13.4</em>辆</span>
</div>
<div class="table-line">
<span><em>42.45</em>辆</span>
<span>当日</span>
<span><em>13.56/</em><em style="color: #f2c232">13.4</em>辆</span>
</div> </div>
</div> </div>
</div> </div>
...@@ -90,7 +105,7 @@ export default { ...@@ -90,7 +105,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
......
src/views/left5/left-component5.vue
...@@ -2,13 +2,13 @@ ...@@ -2,13 +2,13 @@
<div class="left-component5"> <div class="left-component5">
<TianQi></TianQi> <TianQi></TianQi>
<div class="right-box"> <div class="right-box">
<h3 class="list-title">日里程统计</h3> <h3 class="list-title">日里程统计(万)</h3>
<div class="echarts1"> <div class="echarts1">
<Left5Echart1></Left5Echart1> <Left5Echart1></Left5Echart1>
</div> </div>
</div> </div>
<div class="right-box"> <div class="right-box">
<h3 class="list-title">月里程数</h3> <h3 class="list-title">月里程数(万)</h3>
<div class="echarts2"> <div class="echarts2">
<Left5Echart2></Left5Echart2> <Left5Echart2></Left5Echart2>
</div> </div>
...@@ -33,7 +33,7 @@ export default { ...@@ -33,7 +33,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
margin-bottom: 16px; margin-bottom: 16px;
.short-title { .short-title {
......
src/views/right1/right-component1.vue
...@@ -14,10 +14,10 @@ ...@@ -14,10 +14,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-box2"> <div class="right-box2" style="margin-top:32px;">
<div class="box2-l"> <div class="box2-l">
<h3 class="list-title title-box2" style="width: 100%"> <h3 class="list-title title-box2" style="width: 100%">
<span>当前拥堵地段</span> <span>拥堵地段</span>
<span class="short-title"> <span class="short-title">
<span> <span>
<i <i
...@@ -43,98 +43,98 @@ ...@@ -43,98 +43,98 @@
<li> <li>
<span class="li-num" style="background: #8f131b">1</span> <span class="li-num" style="background: #8f131b">1</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>南滨河东路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >31.66KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-top" style="color: #19ea28; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #764922">2</span> <span class="li-num" style="background: #764922">2</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>南滨河路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >36.18KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-top" style="color: #19ea28; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #846f2c">3</span> <span class="li-num" style="background: #846f2c">3</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>天水北路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >28.33KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-top" style="color: #19ea28; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #55662b">4</span> <span class="li-num" style="background: #55662b">4</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>雁园路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >32.64KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-bottom" style="color: #ff2f2f; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #364555">5</span> <span class="li-num" style="background: #364555">5</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>雁滩路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >36.56KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-top" style="color: #19ea28; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #364555">6</span> <span class="li-num" style="background: #364555">6</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>嘉峪关北路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >35.23KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-bottom" style="color: #ff2f2f; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #364555">7</span> <span class="li-num" style="background: #364555">7</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>东岗东路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
</div> </div>
<span class="li-type" <span class="li-type"
>31.58KM/H >35.36KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="m-stop" style="color: #19ea28; margin: 0"></i>
</span> </span>
</li> </li>
<li> <li>
<span class="li-num" style="background: #364555">8</span> <span class="li-num" style="background: #364555">8</span>
<div class="li-line"> <div class="li-line">
<p>北京西路</p> <p>南河路</p>
<div> <div>
<el-progress :percentage="50" :show-text="false"></el-progress> <el-progress :percentage="50" :show-text="false"></el-progress>
</div> </div>
...@@ -144,6 +144,19 @@ ...@@ -144,6 +144,19 @@
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i> <i class="el-icon-top" style="color: #19ea28; margin: 0"></i>
</span> </span>
</li> </li>
<li>
<span class="li-num" style="background: #364555">9</span>
<div class="li-line">
<p>广场北路</p>
<div>
<el-progress :percentage="50" :show-text="false"></el-progress>
</div>
</div>
<span class="li-type"
>32.33KM/H
<i class="el-icon-top" style="color: #19ea28; margin: 0"></i>
</span>
</li>
</ul> </ul>
</div> </div>
<div class="box2-r"> <div class="box2-r">
...@@ -192,7 +205,7 @@ ...@@ -192,7 +205,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-box3"> <div class="right-box3" style="margin-top:32px;">
<h3 class="list-title">平均车速</h3> <h3 class="list-title">平均车速</h3>
<div class="box3-list"> <div class="box3-list">
<div class="box3-item"> <div class="box3-item">
...@@ -203,7 +216,7 @@ ...@@ -203,7 +216,7 @@
/> />
<div class="box3-item-list"> <div class="box3-item-list">
<p>公交车</p> <p>公交车</p>
<p>30KM/L</p> <p>32.56KM/L</p>
</div> </div>
</div> </div>
<div class="box3-item"> <div class="box3-item">
...@@ -213,8 +226,8 @@ ...@@ -213,8 +226,8 @@
alt="" alt=""
/> />
<div class="box3-item-list"> <div class="box3-item-list">
<p>公交车</p> <p>出租车</p>
<p>30KM/L</p> <p>38.89KM/L</p>
</div> </div>
</div> </div>
<div class="box3-item"> <div class="box3-item">
...@@ -224,8 +237,8 @@ ...@@ -224,8 +237,8 @@
alt="" alt=""
/> />
<div class="box3-item-list"> <div class="box3-item-list">
<p>公交车</p> <p>水上巴士</p>
<p>30KM/L</p> <p>28.69KM/L</p>
</div> </div>
</div> </div>
</div> </div>
...@@ -268,7 +281,7 @@ export default { ...@@ -268,7 +281,7 @@ export default {
justify-content: space-between; justify-content: space-between;
} }
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
margin-bottom: 16px; margin-bottom: 16px;
.short-title { .short-title {
......
src/views/right1/right1-echarts1.vue
...@@ -60,17 +60,17 @@ export default { ...@@ -60,17 +60,17 @@ export default {
}, },
series: [ series: [
{ {
data: [82, 92, 1, 94, 29], data: [820, 912, 103, 402, 209],
type: "line", type: "line",
name: "今日", name: "今日",
}, },
{ {
data: [82, 32, 11, 4, 12], data: [802, 312, 131, 465, 122],
type: "line", type: "line",
name: "昨日", name: "昨日",
}, },
{ {
data: [12, 52, 31, 24, 32], data: [1651, 2659, 3261, 5624,3232],
type: "line", type: "line",
name: "上周", name: "上周",
}, },
......
src/views/right1/right1-echarts2.vue
...@@ -60,17 +60,17 @@ export default { ...@@ -60,17 +60,17 @@ export default {
}, },
series: [ series: [
{ {
data: [82, 92, 1, 94, 29], data: [82, 92, 145, 94, 29],
type: "line", type: "line",
name: "今日", name: "今日",
}, },
{ {
data: [82, 32, 11, 4, 12], data: [82, 32, 151, 4, 12],
type: "line", type: "line",
name: "昨日", name: "昨日",
}, },
{ {
data: [12, 52, 31, 24, 32], data: [12, 52, 316, 24, 32],
type: "line", type: "line",
name: "上周", name: "上周",
}, },
......
src/views/right2/right-component2.vue
...@@ -14,10 +14,62 @@ ...@@ -14,10 +14,62 @@
</div> </div>
<div class="right-box2"> <div class="right-box2">
<h3 class="list-title">监控情况</h3> <h3 class="list-title">监控情况</h3>
<div class="monitor"> <el-carousel height="200px" indicator-position="none">
<div class="monitor-bg"></div> <el-carousel-item>
<div class="monitor-bg"></div> <div class="monitor">
</div> <div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="monitor">
<div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="monitor">
<div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
</el-carousel>
</div> </div>
</div> </div>
</template> </template>
...@@ -42,7 +94,7 @@ export default { ...@@ -42,7 +94,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
margin-bottom: 16px; margin-bottom: 16px;
.short-title { .short-title {
......
src/views/right2/right2-echarts1.vue
...@@ -75,7 +75,7 @@ export default { ...@@ -75,7 +75,7 @@ export default {
}, },
series: [ series: [
{ {
data: [82, 92, 62, 94, 29, 62, 94, 29, 29, 62, 94, 29], data: [82, 92, 62, 94, 91, 82, 94, 69, 79, 80, 94, 76],
type: "bar", type: "bar",
label: { label: {
show: true, show: true,
......
src/views/right2/right2-echarts2.vue
...@@ -75,7 +75,7 @@ export default { ...@@ -75,7 +75,7 @@ export default {
}, },
series: [ series: [
{ {
data: [82, 92, 62, 94, 29, 62, 94, 29, 29, 62, 94, 29], data: [42, 52, 51, 34, 38, 52, 24, 29, 29, 52, 54, 29],
type: "bar", type: "bar",
label: { label: {
show: true, show: true,
......
src/views/right3/right-component3.vue
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-box"> <div class="right-box" style="margin-top:32px;">
<h3 class="list-title">线路</h3> <h3 class="list-title">线路</h3>
<div class="list-table"> <div class="list-table">
<div class="table-title"> <div class="table-title">
...@@ -44,68 +44,144 @@ ...@@ -44,68 +44,144 @@
</div> </div>
<div class="table-content"> <div class="table-content">
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[122路]</span>
<span><em>44</em>辆</span> <span><em>54</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1112</em>公里</span>
<span><em>12144</em>人次</span> <span><em>11214</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[212路]</span>
<span><em>44</em>辆</span> <span><em>64</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1262</em>公里</span>
<span><em>12144</em>人次</span> <span><em>12144</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[361路]</span>
<span><em>44</em>辆</span> <span><em>56</em>辆</span>
<span><em>1162</em>公里</span> <span><em>2162</em>公里</span>
<span><em>12144</em>人次</span> <span><em>15144</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[962路]</span>
<span><em>44</em>辆</span> <span><em>34</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1852</em>公里</span>
<span><em>12144</em>人次</span> <span><em>16534</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[983路]</span>
<span><em>44</em>辆</span> <span><em>32</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1152</em>公里</span>
<span><em>12144</em>人次</span> <span><em>15134</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[216路]</span>
<span><em>44</em>辆</span> <span><em>41</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1262</em>公里</span>
<span><em>12144</em>人次</span> <span><em>12164</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[311路]</span>
<span><em>44</em>辆</span> <span><em>54</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1662</em>公里</span>
<span><em>12144</em>人次</span> <span><em>15144</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[313路]</span>
<span><em>64</em>辆</span>
<span><em>1662</em>公里</span>
<span><em>15244</em>人次</span>
</div>
<div class="table-line">
<span>[315路]</span>
<span><em>45</em>辆</span>
<span><em>1182</em>公里</span>
<span><em>15324</em>人次</span>
</div>
<div class="table-line">
<span>[902路]</span>
<span><em>45</em>辆</span>
<span><em>1282</em>公里</span>
<span><em>15924</em>人次</span>
</div>
<div class="table-line">
<span>[903路]</span>
<span><em>44</em>辆</span> <span><em>44</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1642</em>公里</span>
<span><em>12144</em>人次</span> <span><em>13924</em>人次</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[2路]</span> <span>[318路]</span>
<span><em>44</em>辆</span> <span><em>44</em>辆</span>
<span><em>1162</em>公里</span> <span><em>1962</em>公里</span>
<span><em>12144</em>人次</span> <span><em>19324</em>人次</span>
</div>
<div class="table-line">
<span>[317路]</span>
<span><em>34</em>辆</span>
<span><em>1482</em>公里</span>
<span><em>13814</em>人次</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="right-box2"> <div class="right-box2" style="margin-top:32px;">
<h3 class="list-title">监控情况</h3> <h3 class="list-title">监控情况</h3>
<div class="monitor"> <el-carousel height="200px" indicator-position="none">
<div class="monitor-bg"></div> <el-carousel-item>
<div class="monitor-bg"></div> <div class="monitor">
</div> <div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="monitor">
<div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="monitor">
<div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
</el-carousel>
</div> </div>
</div> </div>
</template> </template>
...@@ -125,7 +201,7 @@ export default { ...@@ -125,7 +201,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
margin-bottom: 16px; margin-bottom: 16px;
.short-title { .short-title {
......
src/views/right4/right-component4.vue
...@@ -33,8 +33,8 @@ ...@@ -33,8 +33,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-box"> <div class="right-box" style="margin-top:32px">
<h3 class="list-title">当前车辆使用情况</h3> <h3 class="list-title">当前车辆使用情况(万)</h3>
<div class="list-table"> <div class="list-table">
<div class="table-title"> <div class="table-title">
<span>低点</span> <span>低点</span>
...@@ -44,63 +44,39 @@ ...@@ -44,63 +44,39 @@
</div> </div>
<div class="table-content"> <div class="table-content">
<div class="table-line"> <div class="table-line">
<span>[江宁区]</span> <span>[七里河区]</span>
<span><em>10%</em></span> <span><em>31.5%</em></span>
<span><em>1162</em>辆</span> <span><em>16.2</em>辆</span>
<span><em>121</em>辆</span> <span><em>12.11</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[江宁区]</span> <span>[城关区]</span>
<span><em>10%</em></span> <span><em>26.1%</em></span>
<span><em>1162</em>辆</span> <span><em>13.62</em>辆</span>
<span><em>121</em>辆</span> <span><em>12.1</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[江宁区]</span> <span>[西固区]</span>
<span><em>10%</em></span> <span><em>16.65%</em></span>
<span><em>1162</em>辆</span> <span><em>11.2</em>辆</span>
<span><em>121</em>辆</span> <span><em>9.1</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[江宁区]</span> <span>[安宁区]</span>
<span><em>10%</em></span> <span><em>14.3%</em></span>
<span><em>1162</em>辆</span> <span><em>9.6</em>辆</span>
<span><em>121</em>辆</span> <span><em>121</em>辆</span>
</div> </div>
<div class="table-line"> <div class="table-line">
<span>[江宁区]</span> <span>[红古区]</span>
<span><em>10%</em></span> <span><em>9.56%</em></span>
<span><em>1162</em>辆</span> <span><em>8.62</em>辆</span>
<span><em>121</em>辆</span> <span><em>7.21</em>辆</span>
</div>
<div class="table-line">
<span>[江宁区]</span>
<span><em>10%</em></span>
<span><em>1162</em>辆</span>
<span><em>121</em>辆</span>
</div>
<div class="table-line">
<span>[江宁区]</span>
<span><em>10%</em></span>
<span><em>1162</em>辆</span>
<span><em>121</em>辆</span>
</div>
<div class="table-line">
<span>[江宁区]</span>
<span><em>10%</em></span>
<span><em>1162</em>辆</span>
<span><em>121</em>辆</span>
</div>
<div class="table-line">
<span>[江宁区]</span>
<span><em>10%</em></span>
<span><em>1162</em>辆</span>
<span><em>121</em>辆</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="right-box2"> <div class="right-box2" style="margin-top:32px;">
<h3 class="list-title">借还柱状图</h3> <h3 class="list-title">借还柱状图</h3>
<div class="monitor"> <div class="monitor">
<Right4Echarts1></Right4Echarts1> <Right4Echarts1></Right4Echarts1>
...@@ -127,7 +103,7 @@ export default { ...@@ -127,7 +103,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
margin-bottom: 16px; margin-bottom: 16px;
.short-title { .short-title {
...@@ -176,8 +152,8 @@ export default { ...@@ -176,8 +152,8 @@ export default {
rgba(16, 55, 98, 0.8), rgba(16, 55, 98, 0.8),
rgba(69, 97, 128, 0.8) rgba(69, 97, 128, 0.8)
); );
padding: 2px 0; padding: 8px 0;
margin: 8px 0; margin: 16px 0;
span { span {
display: inline-block; display: inline-block;
width: 25%; width: 25%;
......
src/views/right4/right4-echarts1.vue
...@@ -53,7 +53,7 @@ export default { ...@@ -53,7 +53,7 @@ export default {
}, },
series: [ series: [
{ {
data: [82, 92, 62, 94, 29, 62, 94, 29, 29, 62, 94, 29], data: [81, 52, 82, 34, 69, 42, 34, 59, 99, 32, 84, 49],
type: "bar", type: "bar",
name:'借', name:'借',
label: { label: {
......
src/views/right5/right-component5.vue
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-box"> <div class="right-box" style="margin-top:32px;">
<h3 class="list-title">告警信息</h3> <h3 class="list-title">告警信息</h3>
<div class="list-table"> <div class="list-table">
<div class="table-title"> <div class="table-title">
...@@ -113,12 +113,64 @@ ...@@ -113,12 +113,64 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-box2"> <div class="right-box2" style="margin-top:32px;">
<h3 class="list-title">监控情况</h3> <h3 class="list-title">监控情况</h3>
<div class="monitor"> <el-carousel height="200px" indicator-position="none">
<div class="monitor-bg"></div> <el-carousel-item>
<div class="monitor-bg"></div> <div class="monitor">
</div> <div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="monitor">
<div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
<el-carousel-item>
<div class="monitor">
<div class="monitor-bg">
<img
src="./../../assets/images/jk1.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
<div class="monitor-bg">
<img
src="./../../assets/images/jk2.jpg"
style="width: 100%; height: 100%"
alt=""
/>
</div>
</div>
</el-carousel-item>
</el-carousel>
</div> </div>
</div> </div>
</template> </template>
...@@ -138,7 +190,7 @@ export default { ...@@ -138,7 +190,7 @@ export default {
color: #fff; color: #fff;
padding: 16px; padding: 16px;
.list-title { .list-title {
font-size: 18px; font-size: 24px;
color: #47f1f0; color: #47f1f0;
margin-bottom: 16px; margin-bottom: 16px;
.short-title { .short-title {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论