|
|
|
|
@ -2,16 +2,22 @@ |
|
|
|
|
<!-- 概况模式 --> |
|
|
|
|
<div class="bimModel"> |
|
|
|
|
<!-- 顶部右侧 --> |
|
|
|
|
<div class="right_top_data flex-center"> |
|
|
|
|
<div class="dateType">{{ isHolidays ? '节假日' : '工作日' }}</div> |
|
|
|
|
<div class="weather flex-center" style="margin-left: 0.29rem"> |
|
|
|
|
<div class="right_top_data flex-center" |
|
|
|
|
:style="{ top: '0.15rem'}"> |
|
|
|
|
<div class="weather flex-center"> |
|
|
|
|
<img src="../../../public/img/home/right_top_tianqi.png" style="width: 0.26rem;margin-right: 0.1rem;" /> |
|
|
|
|
<span style="max-width: 1rem">{{ weatherData.weather }}</span> |
|
|
|
|
<span>{{ weatherData.weather ? |
|
|
|
|
weatherData.weather.substring(0, weatherData.weather.lastIndexOf('，')) : '' |
|
|
|
|
}}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="weather flex-center" style="margin-left: 0.29rem"> |
|
|
|
|
<img src="../../../public/img/home/right_top_wendu.png" style="width: 0.26rem;margin-right: 0.1rem;" /> |
|
|
|
|
<span>温度：{{ weatherData.temperature }}</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="right_top_data flex-center" |
|
|
|
|
:style="{ top: '0.47rem' }"> |
|
|
|
|
<div class="dateType">{{ isHolidays ? '节假日' : '工作日' }}</div> |
|
|
|
|
<div class="weather flex-center" style="margin-left: 0.29rem"> |
|
|
|
|
运行状态：<span style="color: #07E6ED;">{{ (reportFangyi.status == 2 ? '分区域运行' : reportFangyi.status == 2 ? '封闭运行' : |
|
|
|
|
'正常') |
|
|
|
|
@ -25,36 +31,42 @@ |
|
|
|
|
<div class="box1"> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">在青/外地：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">530</span>/<span class="big_txt">12</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ isLeaveInfo.inQing }}</span>/<span |
|
|
|
|
class="big_txt">{{ isLeaveInfo.notInQing }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">胶州园区(封闭运行/机关行政)：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">83</span>/<span class="big_txt">122</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ allJzAdminInfo }}</span>/<span |
|
|
|
|
class="big_txt">{{ allJzInfo }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">流亭/台站：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">89</span>/<span class="big_txt">8</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ allLtInfo }}</span>/<span class="big_txt">{{ allLtTzInfo }}</span>人 |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">集中备勤/居家纯净：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">83</span>/<span class="big_txt">122</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ allBqInfo.JZBQ }}</span>/<span |
|
|
|
|
class="big_txt">{{ allBqInfo.JJCJ }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">休假/外出：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">2</span>/<span class="big_txt">10</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ leaveInfo.XJWC }}</span>/<span |
|
|
|
|
class="big_txt">{{ leaveInfo.CC }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">居家：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">147</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ allJJInfo }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">集中隔离/居家隔离/小区封控：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">0</span>/<span class="big_txt">0</span>/<span |
|
|
|
|
class="big_txt">75</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ codeInfo.jzgl }}</span>/<span |
|
|
|
|
class="big_txt">{{ codeInfo.jjgl }}</span>/<span class="big_txt">{{ codeInfo.fxts }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="box_item flex-center"> |
|
|
|
|
<div class="item_label">健康码/行程码：</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">0</span>/<span class="big_txt">0</span>人</div> |
|
|
|
|
<div class="item_txt"><span class="big_txt">{{ codeInfo.healthRedCode }}</span>/<span |
|
|
|
|
class="big_txt">{{ codeInfo.strokeRedCode }}</span>人</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 公寓使用情况 --> |
|
|
|
|
@ -79,21 +91,31 @@ |
|
|
|
|
<div class="flex-center-between"> |
|
|
|
|
<div class="flex-center">昨日本场<span class="big_txt blue" style="margin:0 0.03rem;">{{ planeInfo.placeNum |
|
|
|
|
}}</span>次</div> |
|
|
|
|
<div v-if="((((planeInfo.placeNum - prePlaneInfo.placeNum) / prePlaneInfo.placeNum) * 100) >= 0)" class="yellow"> |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/up.png" /> {{(((planeInfo.placeNum - prePlaneInfo.placeNum) / prePlaneInfo.placeNum) * 100).toFixed(1)}}% |
|
|
|
|
<div v-if="((((planeInfo.placeNum - prePlaneInfo.placeNum) / prePlaneInfo.placeNum) * 100) >= 0)" |
|
|
|
|
class="yellow"> |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/up.png" /> {{ (((planeInfo.placeNum - |
|
|
|
|
prePlaneInfo.placeNum) / prePlaneInfo.placeNum) * 100).toFixed(1) |
|
|
|
|
}}% |
|
|
|
|
</div> |
|
|
|
|
<div v-else class="green"> |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/down.png" /> {{(((planeInfo.placeNum - prePlaneInfo.placeNum) / prePlaneInfo.placeNum) * 100).toFixed(1)}}% |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/down.png" /> {{ (((planeInfo.placeNum - |
|
|
|
|
prePlaneInfo.placeNum) / prePlaneInfo.placeNum) * 100).toFixed(1) |
|
|
|
|
}}% |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="flex-center-between"> |
|
|
|
|
<div class="flex-center">昨日区域<span class="big_txt blue" style="margin:0 0.03rem;">{{ planeInfo.areaNum |
|
|
|
|
}}</span>次</div> |
|
|
|
|
<div v-if="((((planeInfo.areaNum - prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100) > 0)" class="yellow"> |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/up.png" /> {{(((planeInfo.areaNum - prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100).toFixed(1)}}% |
|
|
|
|
<div v-if="((((planeInfo.areaNum - prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100) > 0)" |
|
|
|
|
class="yellow"> |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/up.png" /> {{ (((planeInfo.areaNum - |
|
|
|
|
prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100).toFixed(1) |
|
|
|
|
}}% |
|
|
|
|
</div> |
|
|
|
|
<div v-else class="green"> |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/down.png" /> {{(((planeInfo.areaNum - prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100).toFixed(1)}}% |
|
|
|
|
<img src="../../../public/img/monitoring/electricity/down.png" /> {{ (((planeInfo.areaNum - |
|
|
|
|
prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100).toFixed(1) |
|
|
|
|
}}% |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
@ -241,17 +263,17 @@ |
|
|
|
|
<div class="car_box"> |
|
|
|
|
<div class="flex-center-around"> |
|
|
|
|
<div>胶<br />州</div> |
|
|
|
|
<div :key="('carinfo'+i)" v-for="(value,key,i) in cardInfo['胶州']"> |
|
|
|
|
<div :class="(i==0?'blue' : i == 1 ? 'green' : 'yellow')"><span class="big_txt">{{value}}</span>辆</div> |
|
|
|
|
<div>{{key}}</div> |
|
|
|
|
<div :key="('carinfo' + i)" v-for="(value, key, i) in cardInfo['胶州']"> |
|
|
|
|
<div :class="(i == 0 ? 'blue' : i == 1 ? 'green' : 'yellow')"><span class="big_txt">{{ value }}</span>辆</div> |
|
|
|
|
<div>{{ key }}</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div style="height:1px;background: #2A3C5F;margin:0.08rem;"></div> |
|
|
|
|
<div class="flex-center-around"> |
|
|
|
|
<div>流<br />亭</div> |
|
|
|
|
<div :key="('carinfo_lt'+i)" v-for="(value,key,i) in cardInfo['流亭']"> |
|
|
|
|
<div :class="(i==0?'blue' : i == 1 ? 'green' : 'yellow')"><span class="big_txt">{{value}}</span>辆</div> |
|
|
|
|
<div>{{key}}</div> |
|
|
|
|
<div :key="('carinfo_lt' + i)" v-for="(value, key, i) in cardInfo['流亭']"> |
|
|
|
|
<div :class="(i == 0 ? 'blue' : i == 1 ? 'green' : 'yellow')"><span class="big_txt">{{ value }}</span>辆</div> |
|
|
|
|
<div>{{ key }}</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
@ -280,9 +302,11 @@ |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import { |
|
|
|
|
getIsLeaveByDate, |
|
|
|
|
getPeople, |
|
|
|
|
getWeather, |
|
|
|
|
getCar, |
|
|
|
|
getLeaveByDate, |
|
|
|
|
getAllJZByDate, |
|
|
|
|
getAllBQByDate, |
|
|
|
|
getAllLTByDate, |
|
|
|
|
@ -304,6 +328,8 @@ import { |
|
|
|
|
getGardenEat, |
|
|
|
|
getReportByDate, |
|
|
|
|
isHolidays, |
|
|
|
|
getJZAdminByDate, |
|
|
|
|
getAllJJByDate, |
|
|
|
|
} from "@/api/source/total"; |
|
|
|
|
import { dateFormat } from "@/util/date"; |
|
|
|
|
import { Message } from 'element-ui'; |
|
|
|
|
@ -333,10 +359,10 @@ export default { |
|
|
|
|
weatherData: {}, //天气 |
|
|
|
|
echartsColors: ["#4A92FF", "#48CB96", "#08B6F3", "#FFC976", "#7D55FF", "#BFBFBF"],//图表色值 |
|
|
|
|
currentDate: dateFormat(new Date(), 'yyyy-MM-dd'), |
|
|
|
|
prePlaneInfo:{},//前一天 |
|
|
|
|
prePlaneInfo: {},//前一天 |
|
|
|
|
planeInfo: {},//航班 |
|
|
|
|
gardenAndApprove: {},//访客 |
|
|
|
|
cardInfo:{},//车辆资源 |
|
|
|
|
cardInfo: {},//车辆资源 |
|
|
|
|
ywDevice: { |
|
|
|
|
电: { |
|
|
|
|
code: "0100", |
|
|
|
|
@ -379,21 +405,27 @@ export default { |
|
|
|
|
icon: require("../../../public/img/monitoring/nav_11-1.png"), |
|
|
|
|
}, |
|
|
|
|
}, //业务模型设备类型 |
|
|
|
|
isLeaveInfo: {},//在青、外地 |
|
|
|
|
allJzAdminInfo: {},//业务区及塔台总人数 - 业务区（封闭运行） |
|
|
|
|
allJzInfo: {},//获取胶州机关行政人员总人数 |
|
|
|
|
allBqInfo: {},//备勤、居家总人数 |
|
|
|
|
allLtInfo: {},//流亭总人数 |
|
|
|
|
allLtTzInfo: {},//流亭台站总人数 |
|
|
|
|
codeInfo: {},//集中隔离 |
|
|
|
|
leaveInfo: {},//休假、外出 |
|
|
|
|
allJJInfo: {},//居家总人数 |
|
|
|
|
setInterval: null, |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
this.getCar();//车辆出入 |
|
|
|
|
this.getYqPeople();//园区总人数 |
|
|
|
|
this.getDorInfo();//公寓使用情况 |
|
|
|
|
this.getRunSafe();//运行保障 |
|
|
|
|
this.getLtOrBeiqin();//流亭备勤 |
|
|
|
|
this.getXz();//行政办公人员 |
|
|
|
|
this.getWeekPeople();//一周趋势 |
|
|
|
|
this.getSankey();//桑基图 |
|
|
|
|
this.getBx();//报修情况 |
|
|
|
|
this.getJiuCan();//就餐 |
|
|
|
|
this.getDoor();//门禁 |
|
|
|
|
|
|
|
|
|
this.getBaseData();//基础数据查询 |
|
|
|
|
this.getEchartData(); |
|
|
|
|
this.setInterval = setInterval(() => { |
|
|
|
|
this.getBaseData(); |
|
|
|
|
}, 60 * 60 * 1000);//1小时循环1次 |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
//基础数据查询 |
|
|
|
|
@ -402,26 +434,42 @@ export default { |
|
|
|
|
getWeather().then((res) => { |
|
|
|
|
this.weatherData = res.data.data; |
|
|
|
|
}); |
|
|
|
|
// //业务区及塔台总人数 |
|
|
|
|
// getAllJZByDate(this.currentDate).then((res) => { |
|
|
|
|
|
|
|
|
|
// }) |
|
|
|
|
// //备勤、居家总人数 |
|
|
|
|
// getAllBQByDate(this.currentDate).then((res) => { |
|
|
|
|
|
|
|
|
|
// }) |
|
|
|
|
// //流亭总人数 |
|
|
|
|
// getAllLTByDate(this.currentDate).then((res) => { |
|
|
|
|
|
|
|
|
|
// }) |
|
|
|
|
// //流亭台站总人数 |
|
|
|
|
// getAllLTTZByDate(this.currentDate).then((res) => { |
|
|
|
|
|
|
|
|
|
// }) |
|
|
|
|
// //集中隔离 |
|
|
|
|
// getCodeByDate(this.currentDate).then((res) => { |
|
|
|
|
|
|
|
|
|
// }) |
|
|
|
|
//在青、外地总人数 |
|
|
|
|
getIsLeaveByDate(this.currentDate).then((res) => { |
|
|
|
|
this.isLeaveInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//居家总人数 |
|
|
|
|
getAllJJByDate(this.currentDate).then((res) => { |
|
|
|
|
this.allJJInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//休假外出 |
|
|
|
|
getLeaveByDate(this.currentDate).then((res) => { |
|
|
|
|
this.leaveInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//业务区及塔台总人数业务区（封闭运行） |
|
|
|
|
getJZAdminByDate(this.currentDate).then((res) => { |
|
|
|
|
this.allJzAdminInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//获取胶州机关行政人员总人数 |
|
|
|
|
getAllJZByDate(this.currentDate).then((res) => { |
|
|
|
|
this.allJzInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//备勤、居家总人数 |
|
|
|
|
getAllBQByDate(this.currentDate).then((res) => { |
|
|
|
|
this.allBqInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//流亭总人数 |
|
|
|
|
getAllLTByDate(this.currentDate).then((res) => { |
|
|
|
|
this.allLtInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//流亭台站总人数 |
|
|
|
|
getAllLTTZByDate(this.currentDate).then((res) => { |
|
|
|
|
this.allLtTzInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//集中隔离 |
|
|
|
|
getCodeByDate(this.currentDate).then((res) => { |
|
|
|
|
this.codeInfo = res.result; |
|
|
|
|
}) |
|
|
|
|
//航班 - 前一天和今天 |
|
|
|
|
let dd = new Date(this.currentDate); |
|
|
|
|
dd.setDate(dd.getDate() - 1); |
|
|
|
|
@ -455,6 +503,18 @@ export default { |
|
|
|
|
this.isHolidays = res.result; |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
//图表数据查询 |
|
|
|
|
getEchartData() { |
|
|
|
|
this.getDorInfo();//公寓使用情况 |
|
|
|
|
this.getRunSafe();//运行保障 |
|
|
|
|
this.getLtOrBeiqin();//流亭备勤 |
|
|
|
|
this.getXz();//行政办公人员 |
|
|
|
|
this.getWeekPeople();//一周趋势 |
|
|
|
|
this.getSankey();//桑基图 |
|
|
|
|
this.getBx();//报修情况 |
|
|
|
|
this.getJiuCan();//就餐 |
|
|
|
|
this.getDoor();//门禁 |
|
|
|
|
}, |
|
|
|
|
//共享资源 |
|
|
|
|
getGxzy() { |
|
|
|
|
//共享资源 |
|
|
|
|
@ -1633,7 +1693,7 @@ export default { |
|
|
|
|
//右上角 |
|
|
|
|
.right_top_data { |
|
|
|
|
position: absolute; |
|
|
|
|
top: 0.27rem; |
|
|
|
|
top: 0.1rem; |
|
|
|
|
right: 0.2rem; |
|
|
|
|
|
|
|
|
|
.dateType { |
|
|
|
|
|
zhangqun
3 years ago