diff --git a/src/components/setVideoDialog.vue b/src/components/setVideoDialog.vue index b900e40..dae6261 100644 --- a/src/components/setVideoDialog.vue +++ b/src/components/setVideoDialog.vue @@ -46,13 +46,13 @@ import { onMounted, reactive, ref } from "vue"; import { UploadFilled } from "@element-plus/icons-vue"; import { ElMessage } from "element-plus"; import type { UploadInstance } from "element-plus"; -import { configWeekVideoSaveApi,configWeekVideoListApi } from "@/api/modules/agjtCommandApi"; +import { configWeekVideoSaveApi, configWeekVideoListApi } from "@/api/modules/agjtCommandApi"; import { GlobalStore } from "@/stores"; import moment from "moment"; import { COMPANY } from "@/config/config"; const store = GlobalStore(); const BASEURL = import.meta.env.VITE_API_URL; -const emits = defineEmits(["updateConfig"]) +const emits = defineEmits(["updateConfig"]); const videoConfigData = ref(); const dialogInfo = reactive({ showDialog: false, @@ -89,7 +89,7 @@ const dialogInfo = reactive({ ] }); // 获取一周的配置视频数据 -const configWeekVideoListFn = async (showLoading:boolean) => { +const configWeekVideoListFn = async (showLoading: boolean) => { const res: any = await configWeekVideoListApi( { projectSn: store.sn @@ -97,35 +97,32 @@ const configWeekVideoListFn = async (showLoading:boolean) => { showLoading ); if (res.result) { - videoConfigData.value = res.result + videoConfigData.value = res.result; } -} +}; // 修改一周内某一天的视频 -const configWeekVideoEditFn = async (showLoading:boolean,url:any,weekIndex:number) => { - console.log(url) - let requestData:any = { +const configWeekVideoEditFn = async (showLoading: boolean, url: any, weekIndex: number) => { + console.log(url); + let requestData: any = { projectSn: store.sn - } + }; // 星期参数 - const today = weekIndex == 6?0:weekIndex + 1 - const weekParamsKey = ["sun","mon","tues","wed","thur","fri","sat"] + const today = weekIndex == 6 ? 0 : weekIndex + 1; + const weekParamsKey = ["sun", "mon", "tues", "wed", "thur", "fri", "sat"]; requestData[weekParamsKey[+today]] = url; // type参数 - if(COMPANY == "agjtProjectKanban"){ + if (COMPANY == "agjtProjectKanban") { requestData.type = 1; - } else if(COMPANY == "agjtOverviewScreen"){ + } else if (COMPANY == "agjtOverviewScreen") { requestData.type = 2; - } else if(COMPANY == "agjtLive"){ + } else if (COMPANY == "agjtLive") { requestData.type = 3; } // id参数 - if(videoConfigData.value && videoConfigData.value.length){ - requestData.id = videoConfigData.value[0].id + if (videoConfigData.value && videoConfigData.value.length) { + requestData.id = videoConfigData.value[0].id; } - const res: any = await configWeekVideoSaveApi( - requestData, - showLoading - ); + const res: any = await configWeekVideoSaveApi(requestData, showLoading); if (res.success) { console.log("修改成功", res); ElMessage({ @@ -134,9 +131,9 @@ const configWeekVideoEditFn = async (showLoading:boolean,url:any,weekIndex:numbe type: "success" }); configWeekVideoListFn(true); - emits("updateConfig") + emits("updateConfig"); } -} +}; // 视频文件上传 之前 function handleBeforeUploadVideo(file: any) { console.log(file, "上传之前"); @@ -158,7 +155,7 @@ function handleSuccess(file: any, index: number) { console.log(file, "上传成功"); let url = file.data[0].imageUrl; // this.imgUrl = url; - configWeekVideoEditFn(true,url,index); + configWeekVideoEditFn(true, url, index); } } const closeDialog = () => { diff --git a/src/config/config.ts b/src/config/config.ts index 335f949..c1a2a08 100644 --- a/src/config/config.ts +++ b/src/config/config.ts @@ -30,8 +30,8 @@ export const BASE_IMAGE_URL = import.meta.env.VITE_BASE_IMAGE_URL; // export const COMPANY: string = "agjt"; //鞍钢集团 // export const COMPANY: string = "agjtLive"; //鞍钢集团现场大屏 // export const COMPANY: string = "agjtCommand"; //鞍钢集团指挥部大屏 -export const COMPANY: string = "agjtProjectKanban"; //鞍钢集团项目看板大屏 -// export const COMPANY: string = "agjtOverviewScreen"; //鞍钢集团项目总览 +// export const COMPANY: string = "agjtProjectKanban"; //鞍钢集团项目看板大屏 +export const COMPANY: string = "agjtOverviewScreen"; //鞍钢集团项目总览 // export const COMPANY: string = "slx"; //苏立信项目 // export const COMPANY: string = "hfqc"; //合肥启程项目 // export const COMPANY: string = "jsyc"; // 江苏盐城项目 diff --git a/src/routers/modules/staticRouter.ts b/src/routers/modules/staticRouter.ts index 053cd1d..083d2fd 100644 --- a/src/routers/modules/staticRouter.ts +++ b/src/routers/modules/staticRouter.ts @@ -27,8 +27,8 @@ export const staticRouter: RouteRecordRaw[] = [ // // component: () => import("@/views/sevenLargeScreen/indexL.vue"), //七参数标准版 // component: () => import("@/views/commandScreen/indexCommand.vue"), //指挥部大屏 // component: () => import("@/views/agjtLiveScreen/indexLive.vue"), //鞍钢现场大屏 - // component: () => import("@/views/overviewScreen/indexCommand.vue"), //总览大屏 - component: () => import("@/views/agjtProjectKanban/indexL.vue"), //鞍钢集团项目看板大屏 + component: () => import("@/views/overviewScreen/indexCommand.vue"), //总览大屏 + // component: () => import("@/views/agjtProjectKanban/indexL.vue"), //鞍钢集团项目看板大屏 // component: () => import("@/views/sevenLargeScreen/indexL_syhy.vue"), // 只有一级路由(盘锦、嘉兴、鄱湖美湾医疗项目需切换至该首页) children: [ { diff --git a/src/views/agjtProjectKanban/comprehensiveManage/projectOverview/centerTop.vue b/src/views/agjtProjectKanban/comprehensiveManage/projectOverview/centerTop.vue index 27ba00c..407ac48 100644 --- a/src/views/agjtProjectKanban/comprehensiveManage/projectOverview/centerTop.vue +++ b/src/views/agjtProjectKanban/comprehensiveManage/projectOverview/centerTop.vue @@ -5,15 +5,15 @@
- + + :name="index" + :poster="''" + :deviceIp="`http://${item.account}:${item.password}`" + :videoUrls="item.serialNumber" + :autoPlay="true" + >
@@ -73,35 +73,36 @@ const showVideo = ref(1 as any); const showChangeVideo = ref(false as any); // 修改了视频配置 const updateConfig = () => { - configWeekVideoListFn(true) -} + configWeekVideoListFn(true); +}; // 获取一周的配置视频数据 -const configWeekVideoListFn = async (showLoading:boolean) => { +const configWeekVideoListFn = async (showLoading: boolean) => { const res: any = await configWeekVideoListApi( { - projectSn: store.sn + projectSn: store.sn, + type: 1 }, showLoading ); if (res.result) { // 星期参数 - const today = moment().format('d'); - const weekParamsKey = ["sun","mon","tues","wed","thur","fri","sat"] - projectData.value.videoUrl = res.result[0][weekParamsKey[+today]] + const today = moment().format("d"); + const weekParamsKey = ["sun", "mon", "tues", "wed", "thur", "fri", "sat"]; + projectData.value.videoUrl = res.result[0][weekParamsKey[+today]]; } -} +}; const getVideoList = async () => { let res: any = await selectLiveVideoListApi({ projectSn: store.sn }); - console.log(res,'445566') - if(res.result && res.result.extend1){ + console.log(res, "445566"); + if (res.result && res.result.extend1) { videoList.value = JSON.parse(res.result.extend1).result.videoList; - console.log(videoList.value,'112233') + console.log(videoList.value, "112233"); // 为了解决视频播放器渲染,第二个总是会默认显示一半,我动态设置样式让视图刷新,只要设置百分百就有问题,所以只能使用此方法 setTimeout(() => { // 获取所有的 video 元素 - var videos = document.querySelectorAll(".href-content video") + var videos = document.querySelectorAll(".href-content video"); // var videos = document.getElementsByTagName("video"); // 遍历所有的 video 元素 for (var i = 0; i < videos.length; i++) { @@ -113,7 +114,7 @@ const getVideoList = async () => { } }; onMounted(async () => { - if(COMPANY !== 'agjt') showVideo.value = 2 + if (COMPANY !== "agjt") showVideo.value = 2; await getVideoList(); await configWeekVideoListFn(true); }); @@ -124,11 +125,11 @@ onMounted(async () => { width: 100%; height: 100%; position: relative; - .video-config{ + .video-config { position: absolute; top: 1.5%; right: 1%; - .config-icon{ + .config-icon { cursor: pointer; } } diff --git a/src/views/overviewScreen/commandCenter/centerTop.vue b/src/views/overviewScreen/commandCenter/centerTop.vue index 9f2e974..71808fe 100644 --- a/src/views/overviewScreen/commandCenter/centerTop.vue +++ b/src/views/overviewScreen/commandCenter/centerTop.vue @@ -9,16 +9,11 @@ 更换视频 --> - + + - + @@ -28,11 +23,11 @@ import setVideoDialog from "@/components/setVideoDialog.vue"; import { ref, onMounted, watch } from "vue"; import { GlobalStore } from "@/stores"; import { ElMessage } from "element-plus"; - +import { configWeekVideoListApi } from "@/api/modules/agjtCommandApi"; import { editProjectInfo, eidtProjectShowConfig, queryBySnData } from "@/api/modules/projectOverview"; import { selectLiveVideoListApi } from "@/api/modules/video"; import { COMPANY } from "@/config/config"; - +import moment from "moment"; const store = GlobalStore(); const videoList = ref([] as any); // ts @@ -53,6 +48,26 @@ const openPeopleCountDialog = () => { title: "配置视频" }); }; +// 修改了视频配置 +const updateConfig = () => { + configWeekVideoListFn(false); +}; +// 获取一周的配置视频数据 +const configWeekVideoListFn = async (showLoading: boolean) => { + const res: any = await configWeekVideoListApi( + { + projectSn: store.sn, + type: 2 + }, + showLoading + ); + if (res.result) { + // 星期参数 + const today = moment().format("d"); + const weekParamsKey = ["sun", "mon", "tues", "wed", "thur", "fri", "sat"]; + projectData.value.videoUrl = res.result[0][weekParamsKey[+today]]; + } +}; watch( () => props.projectData, @@ -68,6 +83,7 @@ watch( const picUrl = ref("" as any); const BASEURL = import.meta.env.VITE_API_URL; + // 显示视频 const showVideo = ref(1 as any); @@ -252,6 +268,7 @@ onMounted(async () => { if (COMPANY !== "agjt") showVideo.value = 2; await getVideoList(); getQueryBySnData(); + configWeekVideoListFn(false); if (COMPANY != "agjt") { showVideo.value = 2; } diff --git a/src/views/overviewScreen/commandCenter/index.vue b/src/views/overviewScreen/commandCenter/index.vue index 8c19700..508b100 100644 --- a/src/views/overviewScreen/commandCenter/index.vue +++ b/src/views/overviewScreen/commandCenter/index.vue @@ -1,3 +1,4 @@ + @@ -29,7 +30,7 @@ import centerBottom from "@/views/overviewScreen/commandCenter/centerBottom.vue" import rightAll from "@/views/overviewScreen/commandCenter/rightAll.vue"; import { GlobalStore } from "@/stores"; import { getCountTaskProgressApi } from "@/api/modules/agjtCommandApi"; -// import dataDialog from "../dialogCompnnents/data-dialog.vue"; +import dataDialog from "@/views/commandScreen/dialogCompnnents/data-dialog.vue"; // import * as mqtt from "mqtt/dist/mqtt.min"; // import { getWorkerStatisticsCountApi, getProjectDetail } from "@/api/modules/projectOverview"; @@ -39,12 +40,12 @@ const store = GlobalStore(); // const projectData = ref(null as any); // 弹窗 -// const partyBuildRef = ref(); -// const openPeopleCountDialog = (index: any) => { -// console.log("~~~~~~~~~~~~~~", index); -// partyBuildRef.value.openDialog(index); -// // console.log(partyBuildRef.value); -// }; +const partyBuildRef = ref(); +const openPeopleCountDialog = (index: any) => { + console.log("~~~~~~~~~~~~~~", index); + partyBuildRef.value.openDialog(index); + // console.log(partyBuildRef.value); +}; // const options = { // connectTimeout: 40000, // clientId: "mqttjs_" + Math.random().toString(16).substr(2, 8), diff --git a/src/views/overviewScreen/indexCommand.vue b/src/views/overviewScreen/indexCommand.vue index 07c2484..c88172e 100644 --- a/src/views/overviewScreen/indexCommand.vue +++ b/src/views/overviewScreen/indexCommand.vue @@ -4,7 +4,7 @@
-

总览大屏

+

总览大屏

数字化项目监管平台