diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/Card1/index.vue b/ruoyi-ui/src/views/JiHeExpressway/components/Card1/index.vue index 617de73a..ca3101e7 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/components/Card1/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/components/Card1/index.vue @@ -15,9 +15,6 @@
@@ -148,6 +145,7 @@ export default { .bottom { display: flex; justify-content: end; + gap: 9px; } .status { diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue b/ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue index ceb69809..b1584042 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue @@ -9,7 +9,7 @@
{{ title }} - +
diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/Video/index.vue b/ruoyi-ui/src/views/JiHeExpressway/components/Video/index.vue index 06a95af3..1d4648b5 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/components/Video/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/components/Video/index.vue @@ -1,9 +1,10 @@ diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/Video/videoStream.js b/ruoyi-ui/src/views/JiHeExpressway/components/Video/videoStream.js index be75edd2..fdbe8bae 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/components/Video/videoStream.js +++ b/ruoyi-ui/src/views/JiHeExpressway/components/Video/videoStream.js @@ -1,4 +1,4 @@ -import mpegts from "mpegts.js"; +import flvJs from "flv.js"; import { getCameraStream } from "@screen/pages/Home/components/RoadAndEvents/utils/httpList.js"; /** @@ -18,9 +18,9 @@ export async function openVideoStream(container, { camId, url } = {}) { if (!url) return; - console.log(mpegts.getFeatureList().mseLivePlayback); + // console.log(flvJs.getFeatureList().mseLivePlayback); - const player = mpegts.createPlayer({ + const player = flvJs.createPlayer({ type: "flv", url: url, isLive: true, @@ -33,5 +33,102 @@ export async function openVideoStream(container, { camId, url } = {}) { player.load(); player.play(); + player.on(flvJs.Events.ERROR, (e) => {}); + return player; } + +export class HttpLivePlayer { + /** + * @type { flvJs.Player } + */ + player; + + /** + * @type { HTMLVideoElement } + */ + container; + + url; + + // 解码 帧 + lastDecodedFrames; + + constructor(container, options) { + this.container = container; + + this.getUrl(options).then(() => { + this.initLiveVideo(); + }); + } + + async getUrl({ camId, url } = {}) { + if (camId) { + const { code, data } = await getCameraStream(camId).catch(() => ({})); + + if (code != 200) return; + + url = data.liveUrl; + } + + if (!url) return Promise.reject("获取 url 失败!"); + + return (this.url = url); + } + + destroy() { + if (!this.player) return; + + this.player.pause(); + this.player.unload(); + this.player.detachMediaElement(); + this.player.destroy(); + this.player = null; + } + + initLiveVideo() { + this.destroy(); + + this.lastDecodedFrames = null; + + this.player = flvJs.createPlayer( + { + type: "flv", + url: this.url, + isLive: true, + // hasVideo: true, + hasAudio: false, + }, + { + autoCleanupSourceBuffer: true, + enableWorker: false, //不启用分离线程 + enableStashBuffer: true, //关闭IO隐藏缓冲区 + isLive: true, + lazyLoad: false, + } + ); + + this.player.on(flvJs.Events.ERROR, (errorType, errorDetail, errorInfo) => { + console.log("errorType", errorType); + console.log("errorDetail", errorDetail); + console.log("errorInfo", errorInfo); + + // 视频出错后销毁重建 + this.destroy(); + this.init(); + }); + + // 视频断流 + this.player.on(flvJs.Events.STATISTICS_INFO, function (res) { + if (this.lastDecodedFrames != res.decodedFrames) { + this.lastDecodedFrames = res.decodedFrames; + } else { + this.lastDecodedFrames = 0; + this.destroy(); + this.init(); + } + }); + + this.player.attachMediaElement(this.container); + } +} diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/DrivingGuidance/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/DrivingGuidance/index.vue index 6c014a17..b5c5f4ef 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/DrivingGuidance/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/DrivingGuidance/index.vue @@ -42,7 +42,7 @@ export default { data() { return { activeName: 'first', - deviceControlVisible: true, + deviceControlVisible: false, data: { deviceType: "行车诱导", deviceStation: "k094+079", diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/components/EditEventInformationDialog/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/components/EditEventInformationDialog/data.js new file mode 100644 index 00000000..c7075cba --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/components/EditEventInformationDialog/data.js @@ -0,0 +1,39 @@ +import * as PresetFormItems from "@screen/pages/control/event/event/FormEvent/PresetFormItems.js"; + +export const formConfigList = [ + { + label: "事故类型:", + key: "key13", + type: "select", + }, + PresetFormItems.trafficAccidentType, + PresetFormItems.callPolicePersonName, + PresetFormItems.callPolicePersonPhone, + PresetFormItems.route, + PresetFormItems.direction, + PresetFormItems.eventLevel, + PresetFormItems.station, + PresetFormItems.locationMode, + PresetFormItems.pressure, + PresetFormItems.eventHappenTime, + PresetFormItems.aEstimatedReleaseTime, + PresetFormItems.weatherConditions, + PresetFormItems.effect, + PresetFormItems.isMaintenanceAccident, + PresetFormItems.isCongestionAhead, + PresetFormItems.isCurveRoad, + PresetFormItems.isInTunnel, + PresetFormItems.isArrives, + PresetFormItems.isForkRoad, + PresetFormItems.emptyLine, + PresetFormItems.trafficPolicePhone, + { + ...PresetFormItems.emptyLine, + key: "096993", + }, + PresetFormItems.wreckerCalls, + PresetFormItems.spillName, + PresetFormItems.ownerPhone, + PresetFormItems.laneOccupancy, + PresetFormItems.vehicleCondition, +]; diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/components/EditEventInformationDialog/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/components/EditEventInformationDialog/index.vue new file mode 100644 index 00000000..93583e0a --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/components/EditEventInformationDialog/index.vue @@ -0,0 +1,72 @@ + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/index.vue index 190b3565..20720dc2 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/businessDataManagement/views/emergencyAgencies/index.vue @@ -26,7 +26,16 @@
- + + +
@@ -35,13 +44,15 @@ import Card from "@screen/components/Card1/index.vue" import InputSearch from '@screen/components/InputSearch/index.vue'; import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue'; +import Button from '@screen/components/Buttons/Button.vue'; export default { name: 'EmergencyAgencies', components: { Card, ButtonGradient, - InputSearch + InputSearch, + Button }, data() { return { diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js index d71bdd63..5a778466 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/PresetFormItems.js @@ -341,13 +341,13 @@ export const isInTunnel = { export const freeway = { label: "高速公路:", required: true, - key: "key213", + key: "roadId", type: "select", }; export const weatherConditions = { label: "天气情况:", - key: "key01236", + key: "isCongestionAhead", type: "RadioGroup", isAlone: true, required: true, @@ -355,29 +355,73 @@ export const weatherConditions = { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { - key: "雨雾", + key: "1-1", label: "雨雾", }, { - key: "雨雪", + key: "1-2", label: "雨雪", }, { - key: "中雨", + key: "1-3", label: "中雨", }, { - key: "小雨", + key: "1-4", label: "小雨", }, { - key: "大雨", + key: "1-5", label: "大雨", }, { - key: "暴雨", + key: "1-6", label: "暴雨", }, + { + key: "2-1", + label: "小雪", + }, + { + key: "2-2", + label: "中雪", + }, + { + key: "2-3", + label: "大雪", + }, + { + key: "2-4", + label: "暴雪", + }, + { + key: "2-5", + label: "大暴雪", + }, + { + key: "2-6", + label: "特大暴雪", + }, + { + key: "3-1", + label: "轻雾", + }, + { + key: "3-2", + label: "大雾", + }, + { + key: "3-3", + label: "浓雾", + }, + { + key: "3-4", + label: "强浓雾", + }, + { + key: "3-5", + label: "团雾", + }, ], }, }; @@ -397,15 +441,16 @@ export const additionalNotes = { export const callPolicePersonName = { label: "报警人姓名:", - key: "key1", + key: "reporterName", options: { placeholder: "请输入报警人姓名", }, required: true, }; + export const callPolicePersonPhone = { label: "报警人电话:", - key: "key2", + key: "reporterPhoneNumber", options: { placeholder: "请输入报警人电话(区号+号码)", }, @@ -414,30 +459,34 @@ export const callPolicePersonPhone = { export const trafficAccidentType = { label: "交通事故类型:", - key: "key3", + key: "accidentType", type: "select", required: true, options: { options: [ { - value: "选项1", - label: "黄金糕", + value: "1", + label: "侧翻", + }, + { + value: "2", + label: "撞障碍物", }, { - value: "选项2", - label: "双皮奶", + value: "3", + label: "货物洒落", }, { - value: "选项3", - label: "蚵仔煎", + value: "4", + label: "撞护栏", }, { - value: "选项4", - label: "龙须面", + value: "5", + label: "自燃", }, { - value: "选项5", - label: "北京烤鸭", + value: "6", + label: "追尾", }, ], }, @@ -445,9 +494,17 @@ export const trafficAccidentType = { export const locationMode = { label: "地点方式:", - key: "key5", + key: "locationType", required: true, type: "select", + options: { + options: [ + { key: "1", label: "高速主线" }, + { key: "2", label: "服务区" }, + { key: "3", label: "立交桥" }, + { key: "4", label: "收费站" }, + ], + }, }; export const route = { @@ -477,17 +534,17 @@ export const pressure = { export const isCongestionAhead = { label: "前方是否拥堵:", - key: "key18", + key: "congestionAhead", type: "RadioGroup", options: { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { - key: "是", + key: "0", label: "是", }, { - key: "否", + key: "1", label: "否", }, ], @@ -496,35 +553,36 @@ export const isCongestionAhead = { export const isForkRoad = { label: "是否分岔口:", - key: "key19", + key: "atIntersection", type: "RadioGroup", options: { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { - key: "是", + key: "0", label: "是", }, { - key: "否", + key: "1", label: "否", }, ], }, }; + export const isCurveRoad = { label: "是否处在弯道:", - key: "key20", + key: "minorInjuries", type: "RadioGroup", options: { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { - key: "是", + key: "1", label: "是", }, { - key: "否", + key: "0", label: "否", }, ], @@ -533,23 +591,32 @@ export const isCurveRoad = { export const effect = { label: "影响:", - key: "key13599", + key: "impactLevel", type: "select", + options: { + options: [ + { key: "1", label: "无" }, + { key: "2", label: "危化品泄漏" }, + { key: "3", label: "整车自燃" }, + { key: "4", label: "车辆复燃" }, + { key: "5", label: "散装人工倒货" }, + ], + }, }; export const isArrives = { label: "是否到货:", - key: "key14", + key: "isReverseCargo", type: "RadioGroup", options: { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { - key: "是", + key: "1", label: "是", }, { - key: "否", + key: "0", label: "否", }, ], @@ -558,17 +625,17 @@ export const isArrives = { export const isMaintenanceAccident = { label: "是否养护事故:", - key: "key15", + key: "isMaintenance", type: "RadioGroup", options: { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { - key: "是", + key: "1", label: "是", }, { - key: "否", + key: "0", label: "否", }, ], @@ -577,7 +644,7 @@ export const isMaintenanceAccident = { export const trafficPolicePhone = { label: "交警电话:", - key: "key16", + key: "policeContact", }; export const wreckerCalls = { @@ -623,3 +690,173 @@ export const eventType = { key: "事件类型", type: "input", }; + +export const constructionMeasurement = { + label: "施工措施:", + key: "constructionMeasurement", + type: "RadioGroup", + isAlone: true, + required: true, + options: { + activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", + options: [ + { + key: "0", + label: "无", + }, + { + key: "1", + label: "并道行驶", + }, + { + key: "2", + label: "临时保通", + }, + { + key: "3", + label: "借路侧服务区通行", + }, + ], + }, +}; + +export const locationType = { + label: "地点类型:", + key: "locationType", + type: "RadioGroup", + isAlone: true, + required: true, + options: { + activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", + options: [ + { + key: "1", + label: "单点", + }, + { + key: "2", + label: "多点", + }, + ], + }, +}; + +export const specialConstruction = { + label: "专项施工:", + key: "specialConstruction", + type: "RadioGroup", + isAlone: true, + required: true, + options: { + activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", + options: [ + { + key: "1", + label: "专项工程施工", + }, + { + key: "2", + label: "改扩建专项工程施工", + }, + { + key: "3", + label: "桥梁专项工程施工", + }, + { + key: "4", + label: "其他专项工程施工", + }, + ], + }, +}; + +export const trafficCondition = { + label: "通行情况:", + key: "trafficCondition", + type: "RadioGroup", + isAlone: true, + required: true, + options: { + activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", + options: [ + { + key: "1", + label: "通行正常", + }, + { + key: "2", + label: "通行受阻", + }, + ], + }, +}; + +export const disableFacility = { + label: "停用设施:", + key: "disableFacility", + type: "RadioGroup", + isAlone: true, + required: true, + options: { + activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", + options: [ + { + key: "1", + label: "卫生间", + }, + { + key: "2", + label: "餐厅", + }, + { + key: "3", + label: "停车场", + }, + { + key: "4", + label: "加油站", + }, + { + key: "5", + label: "充电桩", + }, + ], + }, +}; + +export const congestionCause = { + label: "拥堵原因:", + key: "congestionCause", + type: "RadioGroup", + isAlone: true, + required: true, + options: { + activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", + options: [ + { + key: "1", + label: "车流量大", + }, + { + key: "2", + label: "交通事故", + }, + { + key: "3", + label: "交通管制", + }, + { + key: "4", + label: "恶劣天气", + }, + { + key: "5", + label: "集团所辖路段施工", + }, + { + key: "6", + label: "其他", + }, + ], + }, +}; diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js index 0515ba1b..0fb7c066 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/data.js @@ -103,42 +103,7 @@ export const tabConfigList = [ ], }, }, - { - label: "拥堵原因:", - key: "key012036", - type: "RadioGroup", - isAlone: true, - required: true, - options: { - activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", - options: [ - { - key: "车流量大", - label: "车流量大", - }, - { - key: "交通事故", - label: "交通事故", - }, - { - key: "交通管制", - label: "交通管制", - }, - { - key: "恶劣天气", - label: "恶劣天气", - }, - { - key: "集团所辖路段施工", - label: "集团所辖路段施工", - }, - { - key: "其他可选", - label: "其他可选", - }, - ], - }, - }, + PresetFormItems.congestionCause, PresetFormItems.isInTunnel, { label: "拥堵里程:", @@ -641,26 +606,7 @@ export const tabConfigList = [ }, }, PresetFormItems.isInTunnel, - { - label: "地点类型:", - key: "key0138", - type: "RadioGroup", - isAlone: true, - required: true, - options: { - activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", - options: [ - { - key: "单点", - label: "单点", - }, - { - key: "多点", - label: "多点", - }, - ], - }, - }, + PresetFormItems.locationType, PresetFormItems.freeway, PresetFormItems.direction, PresetFormItems.station, @@ -677,62 +623,8 @@ export const tabConfigList = [ showWordLimit: true, }, }, - { - label: "专项施工:", - key: "key01380", - type: "RadioGroup", - isAlone: true, - required: true, - options: { - activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", - options: [ - { - key: "专项工程施工", - label: "专项工程施工", - }, - { - key: "改扩建专项工程施工", - label: "改扩建专项工程施工", - }, - { - key: "桥梁专项工程施工", - label: "桥梁专项工程施工", - }, - { - key: "其他专项工程施工", - label: "其他专项工程施工", - }, - ], - }, - }, - { - label: "施工措施:", - key: "key013800", - type: "RadioGroup", - isAlone: true, - required: true, - options: { - activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", - options: [ - { - key: "无", - label: "无", - }, - { - key: "并道行驶", - label: "并道行驶", - }, - { - key: "临时保通", - label: "临时保通", - }, - { - key: "借路侧服务区通行", - label: "借路侧服务区通行", - }, - ], - }, - }, + PresetFormItems.specialConstruction, + PresetFormItems.constructionMeasurement, PresetFormItems.startTime, PresetFormItems.expectedEndTime, PresetFormItems.remark,