独树的风
1 year ago
@ -1,18 +1,28 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<script type="text/javascript" src="<%= BASE_URL %>js/liveplayer-lib.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title>
|
||||
<%= htmlWebpackPlugin.options.title %>
|
||||
</title>
|
||||
<script type="text/javascript" src="<%= BASE_URL %>js/liveplayer-lib.min.js"></script>
|
||||
<!-- 引入MineMap API插件 -->
|
||||
<link rel="stylesheet" href="http://50.144.11.244:21009/support/static/api/demo/js-api/zh/css/demo.css">
|
||||
<link rel="stylesheet" href="http://50.144.11.244:21009/minemapapi/v2.1.0/minemap.css">
|
||||
<script src="http://50.144.11.244:21009/minemapapi/v2.1.0/minemap.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
|
||||
Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -0,0 +1,36 @@
|
||||
import http from '@/utils/http'
|
||||
|
||||
// * 获取实有地址
|
||||
/**
|
||||
*
|
||||
* @param {*} params 实有地址分页参数
|
||||
* @returns 服务器响应数据
|
||||
*/
|
||||
export const getRealAddressAPI = (params) => {
|
||||
return http.get('/sheyang/page', { params })
|
||||
}
|
||||
|
||||
// * 获取人口
|
||||
export const getPeopleAPI = (params) => {
|
||||
return http.get(`/sheyang/rkdz`, { params })
|
||||
}
|
||||
|
||||
// * 获取单位
|
||||
export const getUnitsAPI = (params) => {
|
||||
return http.get(`/sheyang/dwdz`, { params })
|
||||
}
|
||||
|
||||
// * 获取接警地信息
|
||||
export const getAlarmAddressAPI = (params) => {
|
||||
return http.get('JJxx/page', { params })
|
||||
}
|
||||
|
||||
// * 根据接警编号获取接警信息
|
||||
export const getAlarmInfoAPI = (params) => {
|
||||
return http.get('JJxx/jjdbh', { params })
|
||||
}
|
||||
|
||||
// * 获取感知设备
|
||||
export const getPerceptionDeviceAPI = (params) => {
|
||||
return http.get('sheBei/page', { params })
|
||||
}
|
||||
@ -0,0 +1,6 @@
|
||||
import server from '@/utils/server'
|
||||
|
||||
// * 点聚合数据懒加载
|
||||
export const postResources = (params) => {
|
||||
return server.post('/bigscreen/overviewResources', params)
|
||||
}
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
Before Width: | Height: | Size: 6.7 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 131 KiB |
|
After Width: | Height: | Size: 536 KiB |
|
After Width: | Height: | Size: 7.3 KiB |
|
After Width: | Height: | Size: 218 KiB |
|
After Width: | Height: | Size: 5.4 KiB |
|
After Width: | Height: | Size: 176 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 6.4 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 6.0 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 6.1 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 312 KiB |
|
After Width: | Height: | Size: 6.5 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 37 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 7.5 KiB |
|
After Width: | Height: | Size: 26 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 6.9 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 922 B |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 7.0 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 9.1 KiB |
|
After Width: | Height: | Size: 6.0 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 9.0 KiB |
|
After Width: | Height: | Size: 5.8 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 9.9 KiB |
|
After Width: | Height: | Size: 6.5 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 53 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 7.0 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 758 B |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 926 B |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 8.9 KiB |
|
After Width: | Height: | Size: 20 KiB |
@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<div class="popup">
|
||||
<el-dialog
|
||||
title="提示"
|
||||
width="30%"
|
||||
:visible="visible"
|
||||
modal
|
||||
:close-on-click-modal="true"
|
||||
lock-scroll
|
||||
:before-close="(visible = false)"
|
||||
>
|
||||
<span>内容展位</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'PopupContainer',
|
||||
props: {
|
||||
dialog: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: this.dialog
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.popup {
|
||||
width: 10vw;
|
||||
height: 10vh;
|
||||
|
||||
.el-dialog {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,12 +1,11 @@
|
||||
import Vue from "vue";
|
||||
import Vuex from "vuex";
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import device from './modules/device'
|
||||
|
||||
Vue.use(Vuex);
|
||||
Vue.use(Vuex)
|
||||
|
||||
export default new Vuex.Store({
|
||||
state: {},
|
||||
getters: {},
|
||||
mutations: {},
|
||||
actions: {},
|
||||
modules: {},
|
||||
});
|
||||
modules: {
|
||||
device
|
||||
}
|
||||
})
|
||||
|
||||
@ -0,0 +1,37 @@
|
||||
//
|
||||
import { getDeviceListAPI } from '@/api/facility'
|
||||
import { setDeviceLatlng } from '@/utils/latlng'
|
||||
export default {
|
||||
namespaced: true,
|
||||
state() {
|
||||
return {
|
||||
// * 监控视频数据
|
||||
channelData: [],
|
||||
// * 监控视频数量
|
||||
channelCount: 0
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
// * 存储地址经纬度信息
|
||||
setVideoData(state, newValue) {
|
||||
state.channelData = newValue.channelData
|
||||
state.channelCount = newValue.channelCount
|
||||
console.log(newValue, 'store 中的监控数据')
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
// * 获取设备列表
|
||||
async getVideoData(context, params) {
|
||||
const res = await getDeviceListAPI(params)
|
||||
const channels = res.ChannelList.filter((item) => item.Latitude !== 0)
|
||||
const channel = {
|
||||
channelData: channels,
|
||||
channelCount: res.ChannelCount
|
||||
}
|
||||
// * 存储监控设备列表
|
||||
setDeviceLatlng(channel)
|
||||
context.commit('setVideoData', channel)
|
||||
}
|
||||
},
|
||||
getters: {}
|
||||
}
|
||||
@ -0,0 +1,4 @@
|
||||
// * 事件总线
|
||||
import Vue from 'vue'
|
||||
const bus = new Vue()
|
||||
export default bus
|
||||
@ -0,0 +1,61 @@
|
||||
// TODO 封装控制图层的方法
|
||||
export const onShowLayer = (minemap, value, label) => {
|
||||
console.log(minemap, value, label)
|
||||
if (minemap && value) {
|
||||
// * 监控设备图层显示
|
||||
if (minemap.getLayer('device-points') && label === '监控') {
|
||||
minemap.setLayoutProperty('device-points', 'visibility', 'visible')
|
||||
}
|
||||
// * 地址相关图层显示
|
||||
if (minemap.getLayer('address-points') && label === '房屋') {
|
||||
minemap.setLayoutProperty('address-points', 'visibility', 'visible')
|
||||
}
|
||||
// * 接警相关图层显示
|
||||
if (minemap.getLayer('alarm-points') && label === '接警') {
|
||||
minemap.setLayoutProperty('alarm-points', 'visibility', 'visible')
|
||||
}
|
||||
// * 感知设备图层显示
|
||||
if (minemap.getLayer('perception-points') && label === '感知') {
|
||||
minemap.setLayoutProperty('perception-points', 'visibility', 'visible')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const onHideLayer = (minemap, value, label) => {
|
||||
if (minemap && !value) {
|
||||
// * 监控设备图层隐藏
|
||||
if (minemap.getLayer('device-points') && label === '监控') {
|
||||
minemap.setLayoutProperty('device-points', 'visibility', 'none')
|
||||
}
|
||||
// * 地址相关图层隐藏
|
||||
if (minemap.getLayer('address-points') && label === '房屋') {
|
||||
minemap.setLayoutProperty('address-points', 'visibility', 'none')
|
||||
}
|
||||
// * 接警相关图层隐藏
|
||||
if (minemap.getLayer('alarm-points') && label === '接警') {
|
||||
minemap.setLayoutProperty('alarm-points', 'visibility', 'none')
|
||||
}
|
||||
// * 感知设备图层隐藏
|
||||
if (minemap.getLayer('perception-points') && label === '感知') {
|
||||
minemap.setLayoutProperty('perception-points', 'visibility', 'none')
|
||||
}
|
||||
}
|
||||
}
|
||||
// * 地图加载时将 其余图层隐藏
|
||||
export const onLoadHideLayer = (minemap) => {
|
||||
if (minemap) {
|
||||
console.log(minemap.getLayer('address-points'), '图层')
|
||||
// * 地址相关图层隐藏
|
||||
if (minemap.getLayer('address-points')) {
|
||||
minemap.setLayoutProperty('address-points', 'visibility', 'none')
|
||||
}
|
||||
// * 接警相关图层隐藏
|
||||
if (minemap.getLayer('alarm-points')) {
|
||||
minemap.setLayoutProperty('alarm-points', 'visibility', 'none')
|
||||
}
|
||||
// * 感知设备图层隐藏
|
||||
if (minemap.getLayer('perception-points')) {
|
||||
minemap.setLayoutProperty('perception-points', 'visibility', 'none')
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,92 @@
|
||||
// * 封装时间函数
|
||||
export const dateFormat = (date) => {
|
||||
let year = date.getFullYear()
|
||||
let month = date.getMonth() + 1
|
||||
let day = date.getDate()
|
||||
let hours = date.getHours()
|
||||
let min = date.getMinutes()
|
||||
let seconds = date.getSeconds()
|
||||
// * 数字补 0
|
||||
function check(num) {
|
||||
if (num < 10) {
|
||||
return '0' + num
|
||||
} else {
|
||||
return num
|
||||
}
|
||||
}
|
||||
// * 创建时间集合
|
||||
let timeArr = {}
|
||||
let timeText = `${check(year)}年${check(month)}月${check(day)}日 ${check(
|
||||
hours
|
||||
)}:${check(min)}:${check(seconds)}`
|
||||
let nowDate = date.getDay()
|
||||
let weeks = new Array(
|
||||
'星期日',
|
||||
'星期一',
|
||||
'星期二',
|
||||
'星期三',
|
||||
'星期四',
|
||||
'星期五',
|
||||
'星期六'
|
||||
)
|
||||
let week = weeks[nowDate]
|
||||
// * 判断时间段
|
||||
class TimePeriod {
|
||||
constructor(hours) {
|
||||
this.hours = hours
|
||||
}
|
||||
getState() {
|
||||
return this.strategy.getState()
|
||||
}
|
||||
setStrategy(strategy) {
|
||||
this.strategy = strategy
|
||||
}
|
||||
}
|
||||
// * 定义策略对象
|
||||
const strategies = {
|
||||
morning: {
|
||||
getState() {
|
||||
return '早上'
|
||||
}
|
||||
},
|
||||
midday: {
|
||||
getState() {
|
||||
return '中午'
|
||||
}
|
||||
},
|
||||
afternoon: {
|
||||
getState() {
|
||||
return '下午'
|
||||
}
|
||||
},
|
||||
evening: {
|
||||
getState() {
|
||||
return '晚上'
|
||||
}
|
||||
}
|
||||
}
|
||||
// * 定义时间分区
|
||||
const timeIntervals = {
|
||||
morning: [0, 10],
|
||||
midday: [11, 14],
|
||||
afternoon: [15, 18],
|
||||
evening: [19, 24]
|
||||
}
|
||||
// * 获取当前策略
|
||||
const getStrategy = (hours) => {
|
||||
for (let key in timeIntervals) {
|
||||
if (hours >= timeIntervals[key][0] && hours <= timeIntervals[key][1]) {
|
||||
return strategies[key]
|
||||
}
|
||||
}
|
||||
}
|
||||
// * 实例化
|
||||
const timePeriod = new TimePeriod(hours)
|
||||
// * 设置策略
|
||||
timePeriod.setStrategy(getStrategy(hours))
|
||||
const state = timePeriod.getState()
|
||||
timeArr.timeText = timeText
|
||||
timeArr.week = week
|
||||
timeArr.state = state
|
||||
return timeArr
|
||||
}
|
||||