suzhou-jichuang-lanhai
/
JiangningUrbanManagePc
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'lijinlong' of http://39.101.188.84:8000/suzhou-jichuang-lanhai/JiangningUrbanManagePc into Lvtianfang

Browse Source
lijinlong
吕天方 1 year ago
parent b933a2915f b0647ef389
commit f5fc054cde
3 changed files with 170 additions and 92 deletions
Show Stats Download Patch File Download Diff File

18
src/api/bigScreenApi/eventApi.js
Unescape View File

@ -28,4 +28,22 @@ export function eventSaveData(params,data) {
params, params,
data data
}) })
}
// 事件概况统计
export function summarystat() {
return request({
baseURL: process.env.VUE_APP_BASE_API2,
url: "/event/summary/stat",
method:'get',
})
}
// 任务概况分类统计
export function tasksummarystat() {
return request({
baseURL: process.env.VUE_APP_BASE_API2,
url: "/task/summary/stat",
method:'get',
})
} }

41
src/views/bigScreen/components/mapCentre.vue
Unescape View File

@ -71,12 +71,8 @@
</div> </div>
<div class="middle-bottom-right"> <div class="middle-bottom-right">
<div class="btn-action"> <div class="btn-action">
<span :class="action == 1 ? 'action' : ''" @click="actionBtn(1)" <span :class="action == 1 ? 'action' : ''" @click="actionBtn(1)">电子地图</span>
>电子地图</span <span :class="action == 2 ? 'action' : ''" @click="actionBtn(2)">卫星地图</span>
>
<span :class="action == 2 ? 'action' : ''" @click="actionBtn(2)"
>卫星地图</span
>
</div> </div>
</div> </div>
<personage-track ref="personageTrack"></personage-track> <personage-track ref="personageTrack"></personage-track>
@ -97,9 +93,10 @@ export default {
generalEvent: false, // 普通事件 generalEvent: false, // 普通事件
emphasisEvent: false, // 重点事件 emphasisEvent: false, // 重点事件
lawCar: false, // 执法车辆 lawCar: false, // 执法车辆
surveillanceVideo: false, // 监控视频 surveillanceVideo: false, // 监控视频
input: "", // 输入框的值 input: "", // 输入框的值
actionMap: 1, // 默认选中执法人员地图 actionMap: 1, // 默认选中执法人员地图
}; };
}, },
methods: { methods: {
@ -114,9 +111,9 @@ export default {
} }
}, },
// 输入框的搜索框点击事件 // 输入框的搜索框点击事件
search() {}, search() { },
// 创建任务的点击事件 // 创建任务的点击事件
createdTask() {}, createdTask() { },
// 地图扎点的点击事件 // 地图扎点的点击事件
positioning() { positioning() {
this.$refs.videoWall.open(); this.$refs.videoWall.open();
@ -133,13 +130,17 @@ export default {
this.actionMap = id; this.actionMap = id;
this.$emit("actionMap", this.actionMap); this.$emit("actionMap", this.actionMap);
}, },
}, },
mounted() {
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .el-dialog:not(.is-fullscreen) { ::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 100px !important; margin-top: 100px !important;
} }
.map-middle { .map-middle {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -147,6 +148,7 @@ export default {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
align-items: flex-end; align-items: flex-end;
.middle-middle { .middle-middle {
position: absolute; position: absolute;
bottom: 50%; bottom: 50%;
@ -154,22 +156,26 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
img { img {
width: 40px; width: 40px;
cursor: pointer; cursor: pointer;
} }
} }
.middle-top-left { .middle-top-left {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
display: flex; display: flex;
.input-keyword { .input-keyword {
::v-deep .el-input { ::v-deep .el-input {
background: rgba(0, 60, 116, 0.2); background: rgba(0, 60, 116, 0.2);
box-shadow: inset 0px 0px 6px 0px #00c2ff; box-shadow: inset 0px 0px 6px 0px #00c2ff;
border-radius: 2px; border-radius: 2px;
border: 1px solid rgba(181, 207, 255, 0.5); border: 1px solid rgba(181, 207, 255, 0.5);
.el-input__inner { .el-input__inner {
background-color: transparent; background-color: transparent;
width: 222px; width: 222px;
@ -177,6 +183,7 @@ export default {
color: #fff; color: #fff;
border: none; border: none;
} }
.el-input__inner::placeholder { .el-input__inner::placeholder {
/* 在这里添加你想要修改的 placeholder 样式 */ /* 在这里添加你想要修改的 placeholder 样式 */
font-size: 14px; font-size: 14px;
@ -186,17 +193,20 @@ export default {
line-height: 20px; line-height: 20px;
} }
} }
::v-deep .el-input__suffix { ::v-deep .el-input__suffix {
line-height: 44px; line-height: 44px;
color: #d3eef2; color: #d3eef2;
right: 10px; right: 10px;
cursor: pointer; cursor: pointer;
.el-icon-search:before { .el-icon-search:before {
font-size: 24px; font-size: 24px;
color: #d3eef2; color: #d3eef2;
} }
} }
} }
.laser-positioning, .laser-positioning,
.creation-task { .creation-task {
// height: 38px; // height: 38px;
@ -210,6 +220,7 @@ export default {
justify-content: center; justify-content: center;
padding: 9px 13px; padding: 9px 13px;
cursor: pointer; cursor: pointer;
span { span {
font-size: 14px; font-size: 14px;
font-family: "Source Han Sans CN-Regular"; font-family: "Source Han Sans CN-Regular";
@ -218,11 +229,13 @@ export default {
line-height: 20px; line-height: 20px;
margin-right: 12px; margin-right: 12px;
} }
img { img {
width: 20px; width: 20px;
} }
} }
} }
.middle-bottom-left { .middle-bottom-left {
position: absolute; position: absolute;
left: 0; left: 0;
@ -231,10 +244,12 @@ export default {
padding: 5px 10px; padding: 5px 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.list { .list {
margin-top: 10px; margin-top: 10px;
display: flex; display: flex;
align-items: center; align-items: center;
.leftbg { .leftbg {
display: flex; display: flex;
align-items: center; align-items: center;
@ -244,13 +259,16 @@ export default {
width: 36px; width: 36px;
height: 36px; height: 36px;
cursor: pointer; cursor: pointer;
img { img {
width: 20px; width: 20px;
} }
} }
.action-map { .action-map {
background-image: url("../../../assets/images/iconbg1.png"); background-image: url("../../../assets/images/iconbg1.png");
} }
.rightbg { .rightbg {
padding-left: 6px; padding-left: 6px;
margin-left: 2px; margin-left: 2px;
@ -259,6 +277,7 @@ export default {
height: 36px; height: 36px;
display: flex; display: flex;
align-items: center; align-items: center;
span { span {
font-size: 16px; font-size: 16px;
font-family: "Source Han Sans CN-Bold"; font-family: "Source Han Sans CN-Bold";
@ -270,9 +289,11 @@ export default {
} }
} }
} }
.middle-bottom-right { .middle-bottom-right {
.btn-action { .btn-action {
display: flex; display: flex;
span { span {
flex: 1; flex: 1;
display: inline-block; display: inline-block;
@ -288,10 +309,12 @@ export default {
border-radius: 2px 2px 2px 2px; border-radius: 2px 2px 2px 2px;
opacity: 1; opacity: 1;
border: 1px solid rgba(181, 207, 255, 0.5); border: 1px solid rgba(181, 207, 255, 0.5);
&:nth-child(1) { &:nth-child(1) {
margin-right: 10px; margin-right: 10px;
} }
} }
.action { .action {
color: #fff; color: #fff;
background-color: rgba(255, 125, 64, 0.8); background-color: rgba(255, 125, 64, 0.8);

203
src/views/bigScreen/components/mapLeftContent.vue
Unescape View File

@ -16,7 +16,7 @@
<div class="list-text"> · 上报事件总数</div> <div class="list-text"> · 上报事件总数</div>
<div class="list-bottom"> <div class="list-bottom">
<img src="@/assets/images/incident.png" alt=""> <img src="@/assets/images/incident.png" alt="">
<div class="list-num">200</div> <div class="list-num">{{ MYsummarystatdata.total || "" }}</div>
</div> </div>
</div> </div>
<div class="lists"> <div class="lists">
@ -24,7 +24,7 @@
<div class="list-text"> · 已受理事件</div> <div class="list-text"> · 已受理事件</div>
<div class="list-bottom"> <div class="list-bottom">
<img src="@/assets/images/incident.png" alt=""> <img src="@/assets/images/incident.png" alt="">
<div class="list-num">180</div> <div class="list-num">{{ Fnsummarystat(MYsummarystatdata.records.filter(item => item.status == 1)) }}</div>
</div> </div>
</div> </div>
<div class="lists"> <div class="lists">
@ -32,7 +32,7 @@
<div class="list-text"> · 未受理事件</div> <div class="list-text"> · 未受理事件</div>
<div class="list-bottom"> <div class="list-bottom">
<img src="@/assets/images/incident.png" alt=""> <img src="@/assets/images/incident.png" alt="">
<div class="list-num">20</div> <div class="list-num">{{ Fnsummarystat(MYsummarystatdata.records.filter(item => item.status == 0)) }}</div>
</div> </div>
</div> </div>
</div> </div>
@ -45,7 +45,7 @@
<div class="list-text"> · 派发任务总数</div> <div class="list-text"> · 派发任务总数</div>
<div class="list-bottom"> <div class="list-bottom">
<img src="@/assets/images/task.png" alt=""> <img src="@/assets/images/task.png" alt="">
<div class="list-num">200</div> <div class="list-num">{{tasksummarystatdata.total || '0'}}</div>
</div> </div>
</div> </div>
<div class="lists"> <div class="lists">
@ -53,7 +53,7 @@
<div class="list-text"> · 已处理任务数量</div> <div class="list-text"> · 已处理任务数量</div>
<div class="list-bottom"> <div class="list-bottom">
<img src="@/assets/images/task.png" alt=""> <img src="@/assets/images/task.png" alt="">
<div class="list-num">180</div> <div class="list-num">{{tasksummarystatdata.solved || '0'}}</div>
</div> </div>
</div> </div>
<div class="lists"> <div class="lists">
@ -61,91 +61,93 @@
<div class="list-text"> · 未处理任务数量</div> <div class="list-text"> · 未处理任务数量</div>
<div class="list-bottom"> <div class="list-bottom">
<img src="@/assets/images/task.png" alt=""> <img src="@/assets/images/task.png" alt="">
<div class="list-num">20</div> <div class="list-num">{{tasksummarystatdata.inProgress || 0}}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="item lfet-list-one" id="parent-getHeight" :style="itemOne"> <div class="item lfet-list-one" id="parent-getHeight" :style="itemOne">
<title-box title="人员在线情况"></title-box> <title-box title="人员在线情况"></title-box>
<map-number title="在线人员总数" :onLine="100" :sum="150" type="人" :numberArray="peopleArray" :height="oneHeight" :id="1" v-on="$listeners"></map-number> <map-number title="在线人员总数" :onLine="100" :sum="150" type="人" :numberArray="peopleArray" :height="oneHeight" :id="1"
v-on="$listeners"></map-number>
</div> </div>
<div class="item lfet-list-two" :style="itemOne"> <div class="item lfet-list-two" :style="itemOne">
<title-box title="车辆在线情况"></title-box> <title-box title="车辆在线情况"></title-box>
<map-number title="在线车辆总数" :onLine="10" :sum="18" type="辆" :numberArray="vehicleArray" :height="oneHeight" :id="2"></map-number> <map-number title="在线车辆总数" :onLine="10" :sum="18" type="辆" :numberArray="vehicleArray" :height="oneHeight"
:id="2"></map-number>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import titleBox from '../../components/title/index.vue' import titleBox from '../../components/title/index.vue'
import mapNumber from '../../components/mapLeftNumber/index.vue' import mapNumber from '../../components/mapLeftNumber/index.vue'
import { getQueryViewListPage,getTrend } from '@/api/bigScreenApi/eventApi.js' import { getQueryViewListPage, getTrend, summarystat, tasksummarystat } from '@/api/bigScreenApi/eventApi.js'
export default { export default {
name:'mapLeftContent', name: 'mapLeftContent',
components:{titleBox,mapNumber}, components: { titleBox, mapNumber },
data() { data() {
return { return {
peopleArray:[ peopleArray: [
{ {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
},{ }, {
title:'李飞' title: '李飞'
}, },
], ],
vehicleArray:[ vehicleArray: [
{ {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
},{ }, {
userName:'苏A123456' userName: '苏A123456'
}, },
], ],
itemOne:{ itemOne: {
height:'', height: '',
}, },
itemTwo:{ itemTwo: {
height:'', height: '',
}, },
oneHeight:0, oneHeight: 0,
screenHeight:'', screenHeight: '',
$listeners:false, $listeners: false,
eventList:{ eventList: {
viewCode:"event-all-list", viewCode: "event-all-list",
pageNo:"1", pageNo: "1",
pageSize:"10" pageSize: "10"
}, },
eventData:{ eventData: {
"queryValue": [ "queryValue": [
// { // {
// "colCode": "name", // "colCode": "name",
@ -153,29 +155,33 @@ export default {
// }, // },
], ],
"myInstanceClassify": "all" "myInstanceClassify": "all"
} },
MYsummarystatdata: {
records: []
},//事件统计概况数据
tasksummarystatdata:{} // 任务概况分类统计
} }
}, },
props:['personLine','carLine'], props: ['personLine', 'carLine'],
watch:{ watch: {
personLine:{ personLine: {
handler(newPerson){ handler(newPerson) {
// console.log(newPerson,'在线人员情况'); // console.log(newPerson,'在线人员情况');
this.peopleArray = newPerson this.peopleArray = newPerson
}, },
immediate:true, immediate: true,
}, },
carLine:{ carLine: {
handler(newPerson){ handler(newPerson) {
// console.log(newPerson,'在线人员情况'); // console.log(newPerson,'在线人员情况');
this.vehicleArray = newPerson this.vehicleArray = newPerson
}, },
immediate:true, immediate: true,
} }
}, },
methods:{ methods: {
getDomHeight(){ getDomHeight() {
this.$nextTick(()=>{ this.$nextTick(() => {
let dom = document.getElementsByClassName('lfet-list-one'); let dom = document.getElementsByClassName('lfet-list-one');
let dom2 = document.getElementsByClassName('left-list-title'); let dom2 = document.getElementsByClassName('left-list-title');
let height2 = dom2[0].getBoundingClientRect(); let height2 = dom2[0].getBoundingClientRect();
@ -191,23 +197,45 @@ export default {
this.oneHeight = Number(relativeHeight); this.oneHeight = Number(relativeHeight);
}) })
}, },
getEvent(){ getEvent() {
getQueryViewListPage(this.eventList,this.eventData).then(res=>{ getQueryViewListPage(this.eventList, this.eventData).then(res => {
console.log(res,'resres'); console.log(res, 'resres');
}) })
}, },
MYsummarystat() {
//获取事件统计概况
summarystat().then(res => {
if (res.code == 200) this.MYsummarystatdata = res.data
})
// 任务概况分类统计
tasksummarystat().then(res => {
if (res.code == 200) this.tasksummarystatdata = res.data
})
},
// 获取事件统计概况事件处理
Fnsummarystat(data) {
let mydata = data.length != 0 ? data[0].count : '0'
return mydata
}
}, },
mounted(){ mounted() {
window.addEventListener("resize", () => { window.addEventListener("resize", () => {
this.screenHeight = document.body.clientHeight; this.screenHeight = document.body.clientHeight;
this.getDomHeight(); this.getDomHeight();
}); });
this.getDomHeight(); this.getDomHeight();
this.getEvent(); this.getEvent();
getTrend({type:1}).then(res=>{ getTrend({ type: 1 }).then(res => {
console.log(res,'事件来源'); console.log(res, '事件来源');
}) })
}, },
created() {
this.MYsummarystat()
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -216,13 +244,16 @@ export default {
grid-column: 1fr; grid-column: 1fr;
grid-row-gap: 24px; grid-row-gap: 24px;
height: 100%; height: 100%;
.item { .item {
// background: rgba(222, 225, 230, 0.6); // background: rgba(222, 225, 230, 0.6);
.item-main { .item-main {
margin-top: 5px; margin-top: 5px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding-left: 17px; padding-left: 17px;
.lists { .lists {
// padding: 5px; // padding: 5px;
width: 141px; width: 141px;
@ -230,7 +261,7 @@ export default {
flex-direction: column; flex-direction: column;
// justify-content: space-between; // justify-content: space-between;
position: relative; position: relative;
.bgc { .bgc {
position: absolute; position: absolute;
left: 0; left: 0;
@ -238,9 +269,10 @@ export default {
right: 0; right: 0;
bottom: 0; bottom: 0;
width: 141px; width: 141px;
background: linear-gradient(180deg, #0073FF 0%, rgba(0,71,129,0) 100%); background: linear-gradient(180deg, #0073FF 0%, rgba(0, 71, 129, 0) 100%);
opacity: 0.5; opacity: 0.5;
} }
.list-text { .list-text {
font-size: 15px; font-size: 15px;
height: 38px; height: 38px;
@ -252,15 +284,18 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
padding: 16px 0 0 8px; padding: 16px 0 0 8px;
} }
.list-bottom { .list-bottom {
display: flex; display: flex;
padding-left: 24px; padding-left: 24px;
margin-top: 11px; margin-top: 11px;
img { img {
width: 37px; width: 37px;
height: 40px; height: 40px;
margin-right: 14px; margin-right: 14px;
} }
.list-num { .list-num {
font-size: 32px; font-size: 32px;
font-family: 'D-DIN'; font-family: 'D-DIN';
@ -273,9 +308,11 @@ export default {
} }
} }
} }
.lfet-list-one { .lfet-list-one {
height: 100%; height: 100%;
} }
.left-list-title { .left-list-title {
height: 100%; height: 100%;
} }

Write Preview
Loading…
Cancel
Save