Libt
/
multiple-police-situations
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改 

修改
This commit is contained in:
TimSpan 2024-07-25 11:40:37 +08:00
parent 61ddfb56f4
commit 7038e38809
6 changed files with 1782 additions and 1736 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
analyze.html
View File

File diff suppressed because one or more lines are too long

5
components.d.ts vendored
View File

@ -11,12 +11,17 @@ declare module 'vue' {
500: typeof import('./src/components/errorMessage/500.vue')['default']
AButton: typeof import('ant-design-vue/es')['Button']
AConfigProvider: typeof import('ant-design-vue/es')['ConfigProvider']
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
AForm: typeof import('ant-design-vue/es')['Form']
AFormItem: typeof import('ant-design-vue/es')['FormItem']
AImage: typeof import('ant-design-vue/es')['Image']
AInput: typeof import('ant-design-vue/es')['Input']
AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
AMenu: typeof import('ant-design-vue/es')['Menu']
AMenuItem: typeof import('ant-design-vue/es')['MenuItem']
ASegmented: typeof import('ant-design-vue/es')['Segmented']
ASpin: typeof import('ant-design-vue/es')['Spin']
AStatistic: typeof import('ant-design-vue/es')['Statistic']
ATimeline: typeof import('ant-design-vue/es')['Timeline']
ATimelineItem: typeof import('ant-design-vue/es')['TimelineItem']
ATree: typeof import('ant-design-vue/es')['Tree']

6
index.html
View File

@ -1,5 +1,6 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> -->
@ -7,13 +8,16 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>多元警情</title>
</head>
<body>
<div id="app"></div>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=8910226d8d36a41d856262b1a588850c&plugin=AMap.MarkerClusterer"></script>
<script
src="https://webapi.amap.com/maps?v=1.4.15&key=8910226d8d36a41d856262b1a588850c&plugin=AMap.MarkerClusterer"></script>
<script src="./jquery-3.4.1.min.js"></script>
<script src="./h5player.min.js"></script>
<script type="module" src="/src/main.ts">
</script>
</body>
</html>

1
src/router/modules/staticRouters.ts
View File

@ -53,6 +53,7 @@ export const staticRouter : RouteRecordRaw[] = [
{
path: '/index/hkplay',
component: () => import('@/views/page/hkplay.vue'),
props: route => ({ pointId: route.query.pointId }) // 确保 pointId 参数被正确传递
},
{
path: '/index/system',

89
src/views/page/hkplay.vue
View File

@ -3,17 +3,28 @@
</template>
<script lang="ts" setup>
import api from '@/axios'
import { Ref, ref, watch, onMounted, onBeforeMount, reactive, getCurrentInstance } from 'vue'
import { Ref, ref, watch, onMounted, onBeforeMount, onBeforeUnmount, reactive, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const infoData = ref()
var curIndex = 0 // 当前窗口下标
let myPlugin: any
onMounted(() => {
var data = {
cameraIndexCode: router.currentRoute.value.query.pointId,
if (typeof window.JSPlugin === 'undefined') {
console.error('JSPlugin is not loaded')
return
} else {
console.log('JSPlugin加载成功')
}
console.log(data)
// ws://218.76.54.6:559/openUrl/aUPPuCy
api.post('/multialarm/video/preview', { pointId: data.cameraIndexCode }).then((res) => {
let date = {
pointId: router.currentRoute.value.query.pointId,
useTLS: 0,
}
if (process.env.NODE_ENV === 'production') {
date.useTLS = 1
}
api.post('/multialarm/video/preview', { ...date }).then((res) => {
console.log('router222', res)
console.log('播放地址', res.data.videoUrl)
var code = res['code']
@ -21,7 +32,7 @@ onMounted(() => {
var playURL = res.data.videoUrl
var IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
var MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
var player = new window.JSPlugin({
myPlugin = new window.JSPlugin({
// 当容器div#play_window有固定宽高时，可不传iWidth和iHeight，窗口大小将自适应容器宽高
// iWidth: 600,
// iHeight: 400,
@ -35,52 +46,72 @@ onMounted(() => {
},
bSupporDoubleClickFull: true, //是否支持双击全屏，默认true
})
myPlugin
.JS_SetWindowControlCallback({
pluginErrorHandler: function (index: any, iErrorCode: any, oError: any) {
console.error('__________pluginErrorHandler错误码________________', index, iErrorCode, oError)
var index = 2
playVideo()
//插件错误回调
// do you want...
// 取流失败，流中断等错误都会触发该回调函数，请自行对照错误码表进行判断。
// 业务上层可在此做一些个性化操作，如：个性化错误信息展示，重新取流等。
},
})
.then((res: any) => {
console.log('JS_SetWindowControlCallback________________', res)
})
var controlIndex = 2
function playVideo() {
console.log('____________playURL:', playURL)
console.log('____________curIndex:', curIndex)
// JS_Play 参数说明
// JS_Play(url, config, windowIndex, startTime, endTime)
player
myPlugin
.JS_Play(
playURL,
{
playURL: playURL, // 流媒体播放时必传
mode: 1, // 解码类型：0=普通模式; 1=高级模式 默认为0
},
0 //当前窗口下标
curIndex //当前窗口下标
)
.then(
() => {
console.info('JS_Play success')
// do you want...
},
(err: any) => {
console.info('JS_Play failed:', err)
playVideo()
// do you want...
(e: any) => {
console.log('网络流中断')
controlIndex--
if (controlIndex <= 0) {
return
}
console.info('JS_Play failed:', e)
playVideo()
}
// () => {
// console.log('realplay success')
// },
// (e) => {
// console.log('?')
// index--
// if (index <= 0) {
// return
// }
// var inUrl = '192.168.10.240:559'
// var outUrl = '218.76.54.20:559'
// playURL = playURL.replace(outUrl, inUrl)
// playVideo()
// }
)
}
playVideo()
} else {
alert('播放失败')
}
})
})
// 停止播放断开 ws 连接
onBeforeUnmount(() => {
myPlugin.JS_Stop(curIndex).then(
() => {
console.info('JS_Stop success')
// do you want...
},
(err: any) => {
console.info('JS_Stop failed:', err)
// do you want...
}
)
})
</script>
<style scoped lang="scss">

181
src/views/page/index.vue
View File

@ -1,10 +1,8 @@
<template>
<div class="indexx" :id="state.id">
<Transition name="slide-fade">
<div class="left-cont"
:style="{ width: show3 ? '412px' : '0px', padding: show3 ? '10px 15px 5px' : '0px', border: show3 ? '10px solid #f2f3f5' : '0px' }">
<el-button @click="show3 = !show3" style="position: absolute; top: 0px; right: -38px"
id="toggle-sidebar" type="info" circle>
<div class="left-cont" :style="{ width: show3 ? '412px' : '0px', padding: show3 ? '10px 15px 5px' : '0px', border: show3 ? '10px solid #f2f3f5' : '0px' }">
<el-button @click="show3 = !show3" style="position: absolute; top: 0px; right: -38px" id="toggle-sidebar" type="info" circle>
<el-icon v-if="show3">
<d-arrow-left />
</el-icon>
@ -29,9 +27,16 @@
<!-- <el-input v-model="0"></el-input> -->
</div>
<div style="padding: 0px 20px; height: 75%; overflow: auto" v-show="show3">
<a-tree v-loading="loading" :show-icon="true" :default-expand-all="true"
v-model:expandedKeys="expandedKeys" v-model:selectedKeys="selectedKeys"
v-model:checkedKeys="checkedKeys" :tree-data="treedataall" @select="selectA">
<a-tree
v-loading="loading"
:show-icon="true"
:default-expand-all="true"
v-model:expandedKeys="expandedKeys"
v-model:selectedKeys="selectedKeys"
v-model:checkedKeys="checkedKeys"
:tree-data="treedataall"
@select="selectA"
>
<template #title="{ title, level }">
{{ title }}
</template>
@ -55,10 +60,8 @@
</Transition>
<Transition name="slide-fade1">
<div class="right-cont"
:style="{ width: show4 ? '412px' : '0px', padding: show4 ? '10px 15px 5px' : '0px', border: show4 ? '10px solid #f2f3f5' : '0px' }">
<el-button @click="show4 = !show4" style="position: absolute; top: 0px; left: -38px"
id="toggle-sidebar1" type="info" circle>
<div class="right-cont" :style="{ width: show4 ? '412px' : '0px', padding: show4 ? '10px 15px 5px' : '0px', border: show4 ? '10px solid #f2f3f5' : '0px' }">
<el-button @click="show4 = !show4" style="position: absolute; top: 0px; left: -38px" id="toggle-sidebar1" type="info" circle>
<el-icon v-if="show4">
<d-arrow-right />
</el-icon>
@ -112,19 +115,13 @@
<ul class="dataList" v-show="isActive1 == '1'">
<li v-if="jinbao.length > 0" v-for="(item, index) in jinbao" :key="index" @click="toinfo(item, index)">
<p>
<el-icon>
<LocationFilled />
</el-icon>{{ item.address }}
<el-icon> <LocationFilled /> </el-icon>{{ item.address }}
</p>
<p>
<el-icon>
<Clock />
</el-icon>{{ item.timestamp }}
<el-icon> <Clock /> </el-icon>{{ item.timestamp }}
</p>
<p>
<el-icon>
<PhoneFilled />
</el-icon>{{ item.user1Phone }}
<el-icon> <PhoneFilled /> </el-icon>{{ item.user1Phone }}
</p>
<p>设备号：{{ item.deviceId }}</p>
<p>平台来源：{{ item.alarmSource }}</p>
@ -134,19 +131,13 @@
<ul class="dataList" v-show="isActive1 == '2'">
<li v-if="jinqing.length > 0" v-for="(item, index) in jinqing" :key="index" @click="toinfo(item, index)">
<p>
<el-icon>
<LocationFilled />
</el-icon>{{ item.address }}
<el-icon> <LocationFilled /> </el-icon>{{ item.address }}
</p>
<p>
<el-icon>
<Clock />
</el-icon>{{ item.timestamp }}
<el-icon> <Clock /> </el-icon>{{ item.timestamp }}
</p>
<p>
<el-icon>
<PhoneFilled />
</el-icon>{{ item.user1Phone }}
<el-icon> <PhoneFilled /> </el-icon>{{ item.user1Phone }}
</p>
<p>设备号：{{ item.alarmSource }}</p>
<p>平台来源：{{ item.station }}</p>
@ -156,19 +147,13 @@
<ul class="dataList" v-show="isActive1 == '3'">
<li v-if="AIyujing.length > 0" v-for="(item, index) in AIyujing" :key="index" @click="toinfo(item, index)">
<p>
<el-icon>
<LocationFilled />
</el-icon>{{ item.address }}
<el-icon> <LocationFilled /> </el-icon>{{ item.address }}
</p>
<p>
<el-icon>
<Clock />
</el-icon>{{ item.timestamp }}
<el-icon> <Clock /> </el-icon>{{ item.timestamp }}
</p>
<p>
<el-icon>
<PhoneFilled />
</el-icon>{{ item.user1Phone }}
<el-icon> <PhoneFilled /> </el-icon>{{ item.user1Phone }}
</p>
<p>设备号：{{ item.deviceId }}</p>
<p>平台来源：{{ item.alarmSource }}</p>
@ -179,10 +164,8 @@
</div>
</Transition>
<div v-show="dialogTableVisible"
style="position: fixed; top: 115px; right: 448px; background: rgb(21, 42, 95); z-index: 99; width: 349px; padding: 10px; border-radius: 5px; padding-top: 20px">
<el-popover :visible="visible" :show-arrow="false" placement="left" :width="400"
:popper-style="{ background: '#06325F', border: '1px solid #60626654' }">
<div v-show="dialogTableVisible" style="position: fixed; top: 115px; right: 448px; background: rgb(21, 42, 95); z-index: 99; width: 349px; padding: 10px; border-radius: 5px; padding-top: 20px">
<el-popover :visible="visible" :show-arrow="false" placement="left" :width="400" :popper-style="{ background: '#06325F', border: '1px solid #60626654' }">
<template #reference>
<el-icon @click="clickKz(infoData)" style="top: -6px" size="16px" color="#409EFC">
<DArrowLeft />
@ -194,30 +177,34 @@
<div>
<p style="color: rgb(179, 194, 208)">视频点位:</p>
<ul v-if="ingrssddata">
<li style="text-align: center;color: #fff;" v-if="ingrssddata.ipcList.length<1">暂无数据</li>
<li v-else style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)"
v-for="(item, index) in ingrssddata.ipcList">{{ item.title }}</li>
<li style="text-align: center; color: #fff" v-if="ingrssddata.ipcList.length < 1">暂无数据</li>
<li v-else style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)" v-for="(item, index) in ingrssddata.ipcList">{{ item.title }}</li>
</ul>
</div>
<div style="margin-top: 10px">
<p style="color: rgb(179, 194, 208)">安保点位:</p>
<ul v-if="ingrssddata">
<li style="text-align: center;color: #fff;" v-if="ingrssddata.mobileList.length<1">暂无数据</li>
<li style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)"
v-for="(item, index) in ingrssddata.mobileList">{{ item.title }}</li>
<li style="text-align: center; color: #fff" v-if="ingrssddata.mobileList.length < 1">暂无数据</li>
<li style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)" v-for="(item, index) in ingrssddata.mobileList">{{ item.title }}</li>
</ul>
</div>
<div style="margin-top: 10px">
<p style="color: rgb(179, 194, 208)">文件列表:</p>
<ul v-if="ingrssddata">
<li style="text-align: center;color: #fff;" v-if="ingrssddata.fileList.length<1">暂无数据</li>
<li style="display: inline-block; margin-right: 5px"
v-for="(item, index) in ingrssddata.fileList">
<el-image style="width: 150px; height: 150px" v-if="item.type == 'image'" :src="item.url"
:zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="[item.url]"
:initial-index="4" fit="cover" />
<video width="150" height="150" v-if="item.type == 'video'" :src="item.url"
autoplay="autoplay" controls></video>
<li style="text-align: center; color: #fff" v-if="ingrssddata.fileList.length < 1">暂无数据</li>
<li style="display: inline-block; margin-right: 5px" v-for="(item, index) in ingrssddata.fileList">
<el-image
style="width: 150px; height: 150px"
v-if="item.type == 'image'"
:src="item.url"
:zoom-rate="1.2"
:max-scale="7"
:min-scale="0.2"
:preview-src-list="[item.url]"
:initial-index="4"
fit="cover"
/>
<video width="150" height="150" v-if="item.type == 'video'" :src="item.url" autoplay="autoplay" controls></video>
</li>
</ul>
</div>
@ -358,9 +345,7 @@
</div>
<el-dialog title="视频" v-model="dialogVisible" width="30%">
<iframe style="width: 100%; height: 250px"
:src="'https://www.jy-sh.com/h5sVideo/index.html?token=' + pointCode + '&autoplay=true'"
frameborder="0"></iframe>
<iframe style="width: 100%; height: 250px" :src="'https://www.jy-sh.com/h5sVideo/index.html?token=' + pointCode + '&autoplay=true'" frameborder="0"></iframe>
</el-dialog>
</div>
</template>
@ -445,13 +430,13 @@
)
//
const closee = () => {
dialogTableVisible.value = false;
visible.value = false;
};
dialogTableVisible.value = false
visible.value = false
}
//解锁
const jiesuo = (data) => {
api.post('/multialarm/client/alarm_event/unlock', {
api
.post('/multialarm/client/alarm_event/unlock', {
eventId: data.multiAlarmId,
})
.then((res) => {
@ -462,7 +447,8 @@
})
getdayline()
let city = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['levelvalue']
api.post('multialarm/client/sensor/alarm_event/getlist/today', {
api
.post('multialarm/client/sensor/alarm_event/getlist/today', {
name: localStorage.getItem('loginname'),
city: city == '湖南省' ? null : city,
start: day().format('YYYY-MM-DD HH:mm:ss'),
@ -477,10 +463,11 @@
ElMessage.error('解锁失败')
}
})
};
}
//锁定
const lock = (data) => {
api.post('/multialarm/client/alarm_event/lock', {
api
.post('/multialarm/client/alarm_event/lock', {
eventId: data.multiAlarmId,
})
.then((res) => {
@ -492,7 +479,8 @@
// console.log('listindex',listindex.value,jinbao.value)
getdayline()
let city = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['levelvalue']
api.post('multialarm/client/sensor/alarm_event/getlist/today', {
api
.post('multialarm/client/sensor/alarm_event/getlist/today', {
name: localStorage.getItem('loginname'),
city: city == '湖南省' ? null : city,
start: day().format('YYYY-MM-DD HH:mm:ss'),
@ -503,13 +491,11 @@
infoData.value.lockState = res.data[listindex.value]['lockState']
}
})
} else {
ElMessage.error('锁定失败')
}
})
};
}
//
const printLeafs = (tree, jirearr) => {
if (!tree.children) {
@ -590,7 +576,7 @@
message: '关闭成功',
type: 'success',
})
getdayline();
getdayline()
dialogTableVisible.value = false
//删除此条数据
// listData
@ -768,8 +754,8 @@
renderClusterMarker: _renderClusterMarker,
})
state.map.plugin(['AMap.MarkerClusterer'], () => {
let zoom = state.map.getZoom();
console.log('当前地图的缩放级别是：' + zoom);
let zoom = state.map.getZoom()
console.log('当前地图的缩放级别是：' + zoom)
cluster
})
})
@ -779,7 +765,8 @@
const jinbao = ref([])
const getdayline = () => {
let city = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['levelvalue']
api.post('multialarm/client/sensor/alarm_event/getlist/today', {
api
.post('multialarm/client/sensor/alarm_event/getlist/today', {
name: localStorage.getItem('loginname'),
city: city == '湖南省' ? null : city,
start: day().format('YYYY-MM-DD HH:mm:ss'),
@ -855,7 +842,6 @@
})
.then((res) => {
if (res.code == 0) {
} else {
}
})
@ -1016,7 +1002,7 @@
}
const getSubstanceInfoWindowContent2 = (obj, type) => {
console.log("🚀 ~ getSubstanceInfoWindowContent2 ~ obj, type:", obj, type)
console.log('🚀 ~ getSubstanceInfoWindowContent2 ~ obj, type:', obj, type)
var station = obj['station']
var nickname = ''
if (obj.deviceType == '04' || obj.deviceType == '00') {
@ -1064,14 +1050,28 @@
}
const dialogVisible = ref(false)
const pointCode = ref()
;(window as any).addrt = (a) => {
// console.log('播放',a)
console.log('播放_______________', a)
// let routeData = router.resolve({ path: '/index/hkplay', query: { pointId: a.pointId } })
// window.open(routeData.href, '_blank')
if (a.deviceType == '00') {
if (a.alarmType == 'isc') {
let routeData = router.resolve({ path: '/index/hkplay', query: { pointId: a.pointId } })
window.open(routeData.href, '_blank')
try {
router.push({ path: '/index/hkplay', query: { pointId: a.pointId } })
// let routeData = router.resolve({ path: '/index/hkplay', query: { pointId: a.pointId } })
// console.log('🚀 ~ routeData:', JSON.stringify(routeData))
// window.location.href = routeData.href
// window.open(routeData.href, '_blank')
// window.open('http://172.10.10.161:9527/#/index/hkplay?pointId=43000000581314000013', '_blank') //直接跳要么白屏，要么说未找到token
// window.open('https://www.hndyjqrh.cn/#/index/hkplay?pointId=43000000581314000013', '_blank')
} catch (error) {
console.log('🚀 ~addrt error:', error)
}
window.open('https://www.jy-sh.com/h5sVideo/index.html?token=' + a.pointCode + '&autoplay=true')
}
// window.open('https://www.jy-sh.com/h5sVideo/index.html?token=' + a.pointCode + '&autoplay=true')
} else {
window.open('https://www.jy-sh.com/webRtcVideo/moveDeviceVideoOne.html?id=' + a.deviceId)
}
@ -1204,7 +1204,8 @@
infoData.value = item
if (item.state == 'new') {
//新事件转成处理中/firectrl/client/sensor/alarm_event/changestate
api.post('/multialarm/client/alarm_event/changestate', {
api
.post('/multialarm/client/alarm_event/changestate', {
eventId: item.multiAlarmId,
newState: 'processing',
device: 'web',
@ -1214,7 +1215,8 @@
})
.then((res) => {
getRealTimeAlarmSituation() //跟新实时警情列表
api.post('/multialarm/client/alarm_event/getlog', {
api
.post('/multialarm/client/alarm_event/getlog', {
eventId: item.multiAlarmId,
})
.then((res) => {
@ -1224,7 +1226,8 @@
})
})
} else {
api.post('/multialarm/client/alarm_event/getlog', {
api
.post('/multialarm/client/alarm_event/getlog', {
eventId: item.multiAlarmId,
})
.then((res) => {
@ -1254,8 +1257,8 @@
}
const initMap = () => {
let latitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['latitude'];
let longitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['longitude'];
let latitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['latitude']
let longitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['longitude']
// var cluster;
state.map = new AMap.Map(state.id, {
// center: [113.015117, 28.209425],
@ -1772,8 +1775,10 @@
background-color: transparent;
}
:deep( :where(.css-dev-only-do-not-override-1qb1s0s).ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected,
:where(.css-dev-only-do-not-override-1qb1s0s).ant-tree .ant-tree-checkbox + span.ant-tree-node-selected) {
:deep(
:where(.css-dev-only-do-not-override-1qb1s0s).ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected,
:where(.css-dev-only-do-not-override-1qb1s0s).ant-tree .ant-tree-checkbox + span.ant-tree-node-selected
) {
background-color: transparent;
}