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,
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 class="middle-bottom-right">
<div class="btn-action">
<span :class="action == 1 ? 'action' : ''" @click="actionBtn(1)"
>电子地图</span
>
<span :class="action == 2 ? 'action' : ''" @click="actionBtn(2)"
>卫星地图</span
>
<span :class="action == 1 ? 'action' : ''" @click="actionBtn(1)">电子地图</span>
<span :class="action == 2 ? 'action' : ''" @click="actionBtn(2)">卫星地图</span>
</div>
</div>
<personage-track ref="personageTrack"></personage-track>
@ -97,9 +93,10 @@ export default {
generalEvent: false, // 普通事件
emphasisEvent: false, // 重点事件
lawCar: false, // 执法车辆
surveillanceVideo: false, // 监控视频
surveillanceVideo: false, // 监控视频
input: "", // 输入框的值
actionMap: 1, // 默认选中执法人员地图
};
},
methods: {
@ -114,9 +111,9 @@ export default {
}
},
// 输入框的搜索框点击事件
search() {},
search() { },
// 创建任务的点击事件
createdTask() {},
createdTask() { },
// 地图扎点的点击事件
positioning() {
this.$refs.videoWall.open();
@ -133,13 +130,17 @@ export default {
this.actionMap = id;
this.$emit("actionMap", this.actionMap);
},
},
mounted() {
}
};
</script>
<style lang="scss" scoped>
::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 100px !important;
}
.map-middle {
width: 100%;
height: 100%;
@ -147,6 +148,7 @@ export default {
display: flex;
justify-content: flex-end;
align-items: flex-end;
.middle-middle {
position: absolute;
bottom: 50%;
@ -154,22 +156,26 @@ export default {
display: flex;
align-items: center;
justify-content: space-between;
img {
width: 40px;
cursor: pointer;
}
}
.middle-top-left {
position: absolute;
left: 0;
top: 0;
display: flex;
.input-keyword {
::v-deep .el-input {
background: rgba(0, 60, 116, 0.2);
box-shadow: inset 0px 0px 6px 0px #00c2ff;
border-radius: 2px;
border: 1px solid rgba(181, 207, 255, 0.5);
.el-input__inner {
background-color: transparent;
width: 222px;
@ -177,6 +183,7 @@ export default {
color: #fff;
border: none;
}
.el-input__inner::placeholder {
/* 在这里添加你想要修改的 placeholder 样式 */
font-size: 14px;
@ -186,17 +193,20 @@ export default {
line-height: 20px;
}
}
::v-deep .el-input__suffix {
line-height: 44px;
color: #d3eef2;
right: 10px;
cursor: pointer;
.el-icon-search:before {
font-size: 24px;
color: #d3eef2;
}
}
}
.laser-positioning,
.creation-task {
// height: 38px;
@ -210,6 +220,7 @@ export default {
justify-content: center;
padding: 9px 13px;
cursor: pointer;
span {
font-size: 14px;
font-family: "Source Han Sans CN-Regular";
@ -218,11 +229,13 @@ export default {
line-height: 20px;
margin-right: 12px;
}
img {
width: 20px;
}
}
}
.middle-bottom-left {
position: absolute;
left: 0;
@ -231,10 +244,12 @@ export default {
padding: 5px 10px;
display: flex;
flex-direction: column;
.list {
margin-top: 10px;
display: flex;
align-items: center;
.leftbg {
display: flex;
align-items: center;
@ -244,13 +259,16 @@ export default {
width: 36px;
height: 36px;
cursor: pointer;
img {
width: 20px;
}
}
.action-map {
background-image: url("../../../assets/images/iconbg1.png");
}
.rightbg {
padding-left: 6px;
margin-left: 2px;
@ -259,6 +277,7 @@ export default {
height: 36px;
display: flex;
align-items: center;
span {
font-size: 16px;
font-family: "Source Han Sans CN-Bold";
@ -270,9 +289,11 @@ export default {
}
}
}
.middle-bottom-right {
.btn-action {
display: flex;
span {
flex: 1;
display: inline-block;
@ -288,10 +309,12 @@ export default {
border-radius: 2px 2px 2px 2px;
opacity: 1;
border: 1px solid rgba(181, 207, 255, 0.5);
&:nth-child(1) {
margin-right: 10px;
}
}
.action {
color: #fff;
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-bottom">
<img src="@/assets/images/incident.png" alt="">
<div class="list-num">200</div>
<div class="list-num">{{ MYsummarystatdata.total || "" }}</div>
</div>
</div>
<div class="lists">
@ -24,7 +24,7 @@
<div class="list-text"> · 已受理事件</div>
<div class="list-bottom">
<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 class="lists">
@ -32,7 +32,7 @@
<div class="list-text"> · 未受理事件</div>
<div class="list-bottom">
<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>
@ -45,7 +45,7 @@
<div class="list-text"> · 派发任务总数</div>
<div class="list-bottom">
<img src="@/assets/images/task.png" alt="">
<div class="list-num">200</div>
<div class="list-num">{{tasksummarystatdata.total || '0'}}</div>
</div>
</div>
<div class="lists">
@ -53,7 +53,7 @@
<div class="list-text"> · 已处理任务数量</div>
<div class="list-bottom">
<img src="@/assets/images/task.png" alt="">
<div class="list-num">180</div>
<div class="list-num">{{tasksummarystatdata.solved || '0'}}</div>
</div>
</div>
<div class="lists">
@ -61,91 +61,93 @@
<div class="list-text"> · 未处理任务数量</div>
<div class="list-bottom">
<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 class="item lfet-list-one" id="parent-getHeight" :style="itemOne">
<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 class="item lfet-list-two" :style="itemOne">
<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>
</template>
<script>
import titleBox from '../../components/title/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 {
name:'mapLeftContent',
components:{titleBox,mapNumber},
name: 'mapLeftContent',
components: { titleBox, mapNumber },
data() {
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:{
height:'',
itemOne: {
height: '',
},
itemTwo:{
height:'',
itemTwo: {
height: '',
},
oneHeight:0,
screenHeight:'',
$listeners:false,
eventList:{
viewCode:"event-all-list",
pageNo:"1",
pageSize:"10"
oneHeight: 0,
screenHeight: '',
$listeners: false,
eventList: {
viewCode: "event-all-list",
pageNo: "1",
pageSize: "10"
},
eventData:{
eventData: {
"queryValue": [
// {
// "colCode": "name",
@ -153,29 +155,33 @@ export default {
// },
],
"myInstanceClassify": "all"
}
},
MYsummarystatdata: {
records: []
},//事件统计概况数据
tasksummarystatdata:{} // 任务概况分类统计
}
},
props:['personLine','carLine'],
watch:{
personLine:{
handler(newPerson){
props: ['personLine', 'carLine'],
watch: {
personLine: {
handler(newPerson) {
// console.log(newPerson,'在线人员情况');
this.peopleArray = newPerson
},
immediate:true,
immediate: true,
},
carLine:{
handler(newPerson){
carLine: {
handler(newPerson) {
// console.log(newPerson,'在线人员情况');
this.vehicleArray = newPerson
},
immediate:true,
immediate: true,
}
},
methods:{
getDomHeight(){
this.$nextTick(()=>{
methods: {
getDomHeight() {
this.$nextTick(() => {
let dom = document.getElementsByClassName('lfet-list-one');
let dom2 = document.getElementsByClassName('left-list-title');
let height2 = dom2[0].getBoundingClientRect();
@ -191,23 +197,45 @@ export default {
this.oneHeight = Number(relativeHeight);
})
},
getEvent(){
getQueryViewListPage(this.eventList,this.eventData).then(res=>{
console.log(res,'resres');
getEvent() {
getQueryViewListPage(this.eventList, this.eventData).then(res => {
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", () => {
this.screenHeight = document.body.clientHeight;
this.getDomHeight();
});
this.getDomHeight();
this.getEvent();
getTrend({type:1}).then(res=>{
console.log(res,'事件来源');
getTrend({ type: 1 }).then(res => {
console.log(res, '事件来源');
})
},
created() {
this.MYsummarystat()
}
}
</script>
<style lang="scss" scoped>
@ -216,13 +244,16 @@ export default {
grid-column: 1fr;
grid-row-gap: 24px;
height: 100%;
.item {
// background: rgba(222, 225, 230, 0.6);
.item-main {
margin-top: 5px;
display: flex;
justify-content: space-between;
padding-left: 17px;
.lists {
// padding: 5px;
width: 141px;
@ -230,7 +261,7 @@ export default {
flex-direction: column;
// justify-content: space-between;
position: relative;
.bgc {
position: absolute;
left: 0;
@ -238,9 +269,10 @@ export default {
right: 0;
bottom: 0;
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;
}
.list-text {
font-size: 15px;
height: 38px;
@ -252,15 +284,18 @@ export default {
background-size: 100% 100%;
padding: 16px 0 0 8px;
}
.list-bottom {
display: flex;
padding-left: 24px;
margin-top: 11px;
img {
width: 37px;
height: 40px;
margin-right: 14px;
}
.list-num {
font-size: 32px;
font-family: 'D-DIN';
@ -273,9 +308,11 @@ export default {
}
}
}
.lfet-list-one {
height: 100%;
}
.left-list-title {
height: 100%;
}

Write Preview
Loading…
Cancel
Save