suojin
/
smartpark-front
15
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

mock真是数据渲染

Browse Source
dev
zhangqun 3 years ago
parent 98404adf37
commit 9201d5e6b5
2 changed files with 394 additions and 300 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 103
      src/api/source/total.js
  2. 131
      src/views/garden/generalizePatternNew.vue

103
src/api/source/total.js
Unescape View File

@ -474,11 +474,27 @@ export const getPlaneInfo = (date) => {
};
//访客
export const getGardenAndApprove = (date) => {
if (isMock) {
return new Promise((reslove) => {
reslove({
"success": true,
"message": "获取入园、申请人数成功",
"code": 200,
"result": {
"Garden": 128,
"Approve": 88
},
"timestamp": 1670575547152
})
})
}
else {
return request({
url: "/epiHome/epidemicback/getGardenAndApprove",
url: "/epiHome/getGardenAndApprove",
method: "get",
params: { date },
});
}
};
/**
* 运行保障
@ -2162,35 +2178,112 @@ export const getPersonByJ = (date) => {
};
//当日报修情况
export const getRepair = (date) => {
if (isMock) {
return new Promise((reslove) => {
reslove({
"success": true,
"message": "获取当日保修情况成功",
"code": 200,
"result": {
"legacy": 15,
"escalation": 61,
"complete": 53
},
"timestamp": 1670575462396
})
})
}
else {
return request({
url: "/epiHome/epidemicback/getRepair",
url: "/epiHome/getRepair",
method: "get",
params: { date },
});
}
};
//共享资源
export const getShare = (date) => {
if (isMock) {
return new Promise((reslove) => {
reslove({
"success": true,
"message": "获取共享资源成功",
"code": 200,
"result": {
"underCar": 4,
"car": 5,
"washCar": 2,
"pile": 5,
"exercise": 5,
"meeting": 7
},
"timestamp": 1670575582418
})
})
}
else {
return request({
url: "/epiHome/epidemicback/getShare",
url: "/epiHome/getShare",
method: "get",
params: { date },
});
}
};
//车辆资源
export const getCarInfo = (date) => {
if (isMock) {
return new Promise((reslove) => {
reslove({
"success": true,
"message": "获取车辆情况总人数成功",
"code": 200,
"result": {
"胶州": {
"7座及以下": 10,
"17-20座": 3,
"52座": 1
},
"流亭": {
"7座及以下": 1
}
},
"timestamp": 1669703427438
})
})
}
else {
return request({
url: "/epiHome/epidemicback/getCarInfo",
url: "/epiHome/getCarInfo",
method: "get",
params: { date },
});
}
};
//今日就餐情况
export const getGardenEat = (date) => {
if (isMock) {
return new Promise((reslove) => {
reslove({
"success": true,
"message": "获取今日园区就餐成功",
"code": 200,
"result": {
"TT": 19,
"Garden": 57,
"XZ": 57,
"YW": 51
},
"timestamp": 1670575594189
})
})
}
else {
return request({
url: "/epiHome/epidemicback/getGardenEat",
url: "/epiHome/getGardenEat",
method: "get",
params: { date },
});
}
};
//防疫要求-每日情况//0 正常 1 封闭运行 2 分区域运行
export const getReportByDate = (date) => {

131
src/views/garden/generalizePatternNew.vue
Unescape View File

@ -79,14 +79,22 @@
<div class="flex-center-between">
<div class="flex-center">昨日本场<span class="big_txt blue" style="margin:0 0.03rem;">{{ planeInfo.placeNum
}}</span>次</div>
<div class="yellow">
<img src="../../../public/img/monitoring/electricity/up.png" /> 11%
<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)}}%
</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 class="green"><img src="../../../public/img/monitoring/electricity/down.png" /> 20%</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>
<div v-else class="green">
<img src="../../../public/img/monitoring/electricity/down.png" /> {{(((planeInfo.areaNum - prePlaneInfo.areaNum) / prePlaneInfo.areaNum) * 100).toFixed(1)}}%
</div>
</div>
</div>
</div>
@ -119,7 +127,7 @@
<div style="width:1.1rem;">
<div class="flex-center green">
<img src="../../../public/img/home/h_m_icon2.png" />
<div class="big_txt">1060</div>
<div class="big_txt">{{ gardenAndApprove.Garden }}</div>
</div>
<div>已入园</div>
</div>
@ -127,7 +135,7 @@
<div style="width:1.1rem;">
<div class="flex-center blue">
<img src="../../../public/img/home/h_m_icon3.png" />
<div class="big_txt">205</div>
<div class="big_txt">{{ gardenAndApprove.Approve }}</div>
</div>
<div>申请次数</div>
</div>
@ -231,35 +239,19 @@
<div class="right">
<div class="right_title flex-center" style="margin-top:0.13rem;"><i></i>车辆资源</div>
<div class="car_box">
<div class="flex-center-between">
<div class="flex-center-around">
<div>胶<br />州</div>
<div>
<div class="blue"><span class="big_txt">4</span>辆</div>
<div>7座及以下</div>
</div>
<div>
<div class="green"><span class="big_txt">3</span>辆</div>
<div>7座及以下</div>
</div>
<div>
<div class="yellow"><span class="big_txt">2</span>辆</div>
<div>7座及以下</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-between">
<div class="flex-center-around">
<div>流<br />亭</div>
<div>
<div class="blue"><span class="big_txt">4</span>辆</div>
<div>7座及以下</div>
</div>
<div>
<div class="green"><span class="big_txt">3</span>辆</div>
<div>7座及以下</div>
</div>
<div>
<div class="yellow"><span class="big_txt">2</span>辆</div>
<div>7座及以下</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,7 +272,7 @@
<div class="title flex-center" style="margin-top:0.09rem;margin-left:0.32rem;"><img
src="../../../public/img/home/h_r_icon5.png" style="width: 0.17rem" />防疫要求</div>
<div class="fy_box" :title="reportFangyi.content">
{{reportFangyi.content}}
{{ reportFangyi.content }}
</div>
</div>
</div>
@ -341,7 +333,10 @@ export default {
weatherData: {}, //天气
echartsColors: ["#4A92FF", "#48CB96", "#08B6F3", "#FFC976", "#7D55FF", "#BFBFBF"],//图表色值
currentDate: dateFormat(new Date(), 'yyyy-MM-dd'),
prePlaneInfo:{},//前一天
planeInfo: {},//航班
gardenAndApprove: {},//访客
cardInfo:{},//车辆资源
ywDevice: {
电: {
code: "0100",
@ -427,18 +422,25 @@ export default {
// getCodeByDate(this.currentDate).then((res) => {
// })
//航班
//航班 - 前一天和今天
let dd = new Date(this.currentDate);
dd.setDate(dd.getDate() - 1);
getPlaneInfo(dateFormat(new Date(dd), 'yyyy-MM-dd')).then((res) => {
res.result.placeNum = 170;
res.result.areaNum = 600;
this.prePlaneInfo = res.result;
})
getPlaneInfo(this.currentDate).then((res) => {
this.planeInfo = res.result;
})
//访客
getGardenAndApprove(this.currentDate).then((res) => {
this.gardenAndApprove = res.result;
})
this.getGxzy();//共享资源
//车辆资源
getCarInfo(this.currentDate).then((res) => {
this.cardInfo = res.result;
})
//今日就餐
getGardenEat(this.currentDate).then((res) => {
@ -457,25 +459,21 @@ export default {
getGxzy() {
//共享资源
getShare(this.currentDate).then((res) => {
})
let objData = res.result;
var myChart = this.$echarts.init(document.getElementById("radar1"));
myChart.setOption({
color: ['#2BF7AC', '#07A6FF'],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
trigger: 'item'
},
radar: {
indicator: [
{ name: '车位', max: 6500 },
{ name: '地下车位', max: 16000 },
{ name: '会议情况', max: 30000 },
{ name: '洗车机', max: 38000 },
{ name: '充电桩', max: 52000 },
{ name: '健身器材', max: 25000 }
{ name: '车位', max: 257 },
{ name: '地下车位', max: 67 },
{ name: '会议情况', max: 50 },
{ name: '洗车机', max: 50 },
{ name: '充电桩', max: 50 },
{ name: '健身器材', max: 50 }
],
center: ['50%', '56%'],
radius: 50,
@ -493,13 +491,15 @@ export default {
},
data: [
{
value: [4200, 3000, 20000, 35000, 50000, 18000],
value: [objData.car, objData.underCar, objData.meeting, objData.washCar, objData.pile, objData.exercise],
name: '共享资源'
},
]
},
]
})
})
},
//门禁
getDoor() {
@ -602,8 +602,7 @@ export default {
//园区就餐
getJiuCan() {
getGardenEat(this.currentDate).then((res) => {
})
let objData = res.result;
var myChart = this.$echarts.init(document.getElementById("rightBar3"));
myChart.setOption({
tooltip: {
@ -658,7 +657,7 @@ export default {
],
series: [
{
name: '今日园区就餐',
name: '就餐人员',
type: 'bar',
barWidth: 18,
emphasis: {
@ -675,25 +674,25 @@ export default {
symbol: 'triangle',
symbolRotate: 180,
symbolSize: 6,
symbolOffset: [0, -15],
symbolOffset: [0, -12],
data: [
{
xAxis: 61, yAxis: '流亭园区', itemStyle: {
xAxis: objData.Garden, yAxis: '流亭园区', itemStyle: {
color: '#48CB96'
}
},
{
xAxis: 53, yAxis: '行政', itemStyle: {
xAxis: objData.XZ, yAxis: '行政', itemStyle: {
color: '#4A92FF'
}
},
{
xAxis: 15, yAxis: '塔台', itemStyle: {
xAxis: objData.TT, yAxis: '塔台', itemStyle: {
color: '#7D55FF'
}
},
{
xAxis: 15, yAxis: '业务区运行', itemStyle: {
xAxis: objData.YW, yAxis: '业务区运行', itemStyle: {
color: '#FFC976'
}
}
@ -701,22 +700,22 @@ export default {
},
data: [
{
name: '流亭园区', value: '61', itemStyle: {
name: '流亭园区', value: objData.Garden, itemStyle: {
color: '#48CB96'
}
},
{
name: '行政', value: '53', itemStyle: {
name: '行政', value: objData.XZ, itemStyle: {
color: '#4A92FF'
}
},
{
name: '塔台', value: '15', itemStyle: {
name: '塔台', value: objData.TT, itemStyle: {
color: '#7D55FF'
}
},
{
name: '业务区运行', value: '15', itemStyle: {
name: '业务区运行', value: objData.YW, itemStyle: {
color: '#FFC976'
}
},
@ -724,12 +723,13 @@ export default {
},
]
})
})
},
//报修
getBx() {
getRepair(this.currentDate).then((res) => {
})
let objData = res.result;
var myChart = this.$echarts.init(document.getElementById("rightBar1"));
myChart.setOption({
color: ['#EB6877', '#4A92FF', '#48CB96'],
@ -802,20 +802,20 @@ export default {
symbol: 'triangle',
symbolRotate: 180,
symbolSize: 6,
symbolOffset: [0, -15],
symbolOffset: [0, -12],
data: [
{
xAxis: 61, yAxis: '上报', itemStyle: {
xAxis: objData.escalation, yAxis: '上报', itemStyle: {
color: '#4A92FF'
}
},
{
xAxis: 53, yAxis: '完成', itemStyle: {
xAxis: objData.complete, yAxis: '完成', itemStyle: {
color: '#48CB96'
}
},
{
xAxis: 15, yAxis: '遗留', itemStyle: {
xAxis: objData.legacy, yAxis: '遗留', itemStyle: {
color: '#EB6877'
}
}
@ -841,6 +841,7 @@ export default {
},
]
})
})
},
// 运行保障人员
async getRunSafe() {
@ -1819,7 +1820,7 @@ export default {
.car_box {
width: 2.28rem;
height: 0.79rem;
// height: 0.79rem;
text-align: center;
background: rgba(0, 0, 0, 0.1);
border-radius: 0.05rem;

Write Preview
Loading…
Cancel
Save