parent
61ddfb56f4
commit
7038e38809
File diff suppressed because one or more lines are too long
|
@ -11,12 +11,17 @@ declare module 'vue' {
|
||||||
500: typeof import('./src/components/errorMessage/500.vue')['default']
|
500: typeof import('./src/components/errorMessage/500.vue')['default']
|
||||||
AButton: typeof import('ant-design-vue/es')['Button']
|
AButton: typeof import('ant-design-vue/es')['Button']
|
||||||
AConfigProvider: typeof import('ant-design-vue/es')['ConfigProvider']
|
AConfigProvider: typeof import('ant-design-vue/es')['ConfigProvider']
|
||||||
|
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
|
||||||
AForm: typeof import('ant-design-vue/es')['Form']
|
AForm: typeof import('ant-design-vue/es')['Form']
|
||||||
AFormItem: typeof import('ant-design-vue/es')['FormItem']
|
AFormItem: typeof import('ant-design-vue/es')['FormItem']
|
||||||
AImage: typeof import('ant-design-vue/es')['Image']
|
AImage: typeof import('ant-design-vue/es')['Image']
|
||||||
AInput: typeof import('ant-design-vue/es')['Input']
|
AInput: typeof import('ant-design-vue/es')['Input']
|
||||||
AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
|
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']
|
ASpin: typeof import('ant-design-vue/es')['Spin']
|
||||||
|
AStatistic: typeof import('ant-design-vue/es')['Statistic']
|
||||||
ATimeline: typeof import('ant-design-vue/es')['Timeline']
|
ATimeline: typeof import('ant-design-vue/es')['Timeline']
|
||||||
ATimelineItem: typeof import('ant-design-vue/es')['TimelineItem']
|
ATimelineItem: typeof import('ant-design-vue/es')['TimelineItem']
|
||||||
ATree: typeof import('ant-design-vue/es')['Tree']
|
ATree: typeof import('ant-design-vue/es')['Tree']
|
||||||
|
|
14
index.html
14
index.html
|
@ -1,19 +1,23 @@
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
|
||||||
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> -->
|
<!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> -->
|
||||||
<link rel="icon" type="image/svg+xml" href="/gw.png" style="width:40px;height:40px;" />
|
<link rel="icon" type="image/svg+xml" href="/gw.png" style="width:40px;height:40px;" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>多元警情</title>
|
<title>多元警情</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
|
||||||
|
<body>
|
||||||
<div id="app"></div>
|
<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="./jquery-3.4.1.min.js"></script>
|
||||||
<script src="./h5player.min.js"></script>
|
<script src="./h5player.min.js"></script>
|
||||||
<script type="module" src="/src/main.ts">
|
<script type="module" src="/src/main.ts">
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
|
@ -4,7 +4,7 @@ import { INDEX_ROUTER, LOGIN_ROUTER } from "@/configs";
|
||||||
/**
|
/**
|
||||||
* staticRouter (静态路由)
|
* staticRouter (静态路由)
|
||||||
*/
|
*/
|
||||||
export const staticRouter : RouteRecordRaw[] = [
|
export const staticRouter: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
path: "/",
|
path: "/",
|
||||||
redirect: INDEX_ROUTER.path,
|
redirect: INDEX_ROUTER.path,
|
||||||
|
@ -14,7 +14,7 @@ export const staticRouter : RouteRecordRaw[] = [
|
||||||
component: () => import("@/views/login.vue"),
|
component: () => import("@/views/login.vue"),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path:'/index',
|
path: '/index',
|
||||||
component: () => import('@/views/index.vue'),
|
component: () => import('@/views/index.vue'),
|
||||||
redirect: '/index/video',
|
redirect: '/index/video',
|
||||||
children: [
|
children: [
|
||||||
|
@ -53,6 +53,7 @@ export const staticRouter : RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
path: '/index/hkplay',
|
path: '/index/hkplay',
|
||||||
component: () => import('@/views/page/hkplay.vue'),
|
component: () => import('@/views/page/hkplay.vue'),
|
||||||
|
props: route => ({ pointId: route.query.pointId }) // 确保 pointId 参数被正确传递
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/index/system',
|
path: '/index/system',
|
||||||
|
|
|
@ -3,17 +3,28 @@
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import api from '@/axios'
|
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'
|
import { useRouter } from 'vue-router'
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const infoData = ref()
|
const infoData = ref()
|
||||||
|
var curIndex = 0 // 当前窗口下标
|
||||||
|
let myPlugin: any
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
var data = {
|
if (typeof window.JSPlugin === 'undefined') {
|
||||||
cameraIndexCode: router.currentRoute.value.query.pointId,
|
console.error('JSPlugin is not loaded')
|
||||||
|
return
|
||||||
|
} else {
|
||||||
|
console.log('JSPlugin加载成功')
|
||||||
}
|
}
|
||||||
console.log(data)
|
let date = {
|
||||||
// ws://218.76.54.6:559/openUrl/aUPPuCy
|
pointId: router.currentRoute.value.query.pointId,
|
||||||
api.post('/multialarm/video/preview', { pointId: data.cameraIndexCode }).then((res) => {
|
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('router222', res)
|
||||||
console.log('播放地址', res.data.videoUrl)
|
console.log('播放地址', res.data.videoUrl)
|
||||||
var code = res['code']
|
var code = res['code']
|
||||||
|
@ -21,7 +32,7 @@ onMounted(() => {
|
||||||
var playURL = res.data.videoUrl
|
var playURL = res.data.videoUrl
|
||||||
var IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
|
var IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
|
||||||
var MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
|
var MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
|
||||||
var player = new window.JSPlugin({
|
myPlugin = new window.JSPlugin({
|
||||||
// 当容器div#play_window有固定宽高时,可不传iWidth和iHeight,窗口大小将自适应容器宽高
|
// 当容器div#play_window有固定宽高时,可不传iWidth和iHeight,窗口大小将自适应容器宽高
|
||||||
// iWidth: 600,
|
// iWidth: 600,
|
||||||
// iHeight: 400,
|
// iHeight: 400,
|
||||||
|
@ -35,52 +46,72 @@ onMounted(() => {
|
||||||
},
|
},
|
||||||
bSupporDoubleClickFull: true, //是否支持双击全屏,默认true
|
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() {
|
function playVideo() {
|
||||||
|
console.log('____________playURL:', playURL)
|
||||||
|
console.log('____________curIndex:', curIndex)
|
||||||
// JS_Play 参数说明
|
// JS_Play 参数说明
|
||||||
// JS_Play(url, config, windowIndex, startTime, endTime)
|
// JS_Play(url, config, windowIndex, startTime, endTime)
|
||||||
player
|
myPlugin
|
||||||
.JS_Play(
|
.JS_Play(
|
||||||
playURL,
|
playURL,
|
||||||
{
|
{
|
||||||
playURL: playURL, // 流媒体播放时必传
|
playURL: playURL, // 流媒体播放时必传
|
||||||
mode: 1, // 解码类型:0=普通模式; 1=高级模式 默认为0
|
mode: 1, // 解码类型:0=普通模式; 1=高级模式 默认为0
|
||||||
},
|
},
|
||||||
0 //当前窗口下标
|
curIndex //当前窗口下标
|
||||||
)
|
)
|
||||||
.then(
|
.then(
|
||||||
() => {
|
() => {
|
||||||
console.info('JS_Play success')
|
console.info('JS_Play success')
|
||||||
// do you want...
|
// do you want...
|
||||||
},
|
},
|
||||||
(err: any) => {
|
(e: any) => {
|
||||||
console.info('JS_Play failed:', err)
|
console.log('网络流中断')
|
||||||
playVideo()
|
controlIndex--
|
||||||
// do you want...
|
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 {
|
} else {
|
||||||
alert('播放失败')
|
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>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue