增加监控预览功能

yanzhu-modules/yanzhu-gen/src/main/resources/vm/vue/v3/readme.txt

@@ -1 +1 @@
-如果使用的是RuoYi-Cloud-Vue3前端，那么需要覆盖一下此目录的模板index.vue.vm、index-tree.vue.vm文件到上级vue目录。
+如果使用的是RuoYi-Cloud-Vue3前端，那么需要覆盖一下此目录的模板index.vue.vm、index-tree.vue.vm文件到上级vue目录。

yanzhu-modules/yanzhu-manage/pom.xml

@@ -123,7 +123,7 @@
             <artifactId>iTextAsian</artifactId>
             <version>1.0.0</version>
             <scope>system</scope>
-            <systemPath>${pom.basedir}\libs\iTextAsian-1.0.0.jar</systemPath>
+            <systemPath>${pom.basedir}/libs/iTextAsian-1.0.0.jar</systemPath>
         </dependency>
 
         <dependency>
@@ -143,7 +143,7 @@
             <artifactId>aspose-words</artifactId>
             <version>15.8.0</version>
             <scope>system</scope>
-            <systemPath>${pom.basedir}\libs\aspose-words-15.8.0-jdk16.jar</systemPath>
+            <systemPath>${pom.basedir}/libs/aspose-words-15.8.0-jdk16.jar</systemPath>
         </dependency>
         <!--word文件转化为PDF文件 结束-->
 
@@ -166,7 +166,7 @@
             <artifactId>aspose-tasks</artifactId>
             <version>24.10</version>
             <scope>system</scope>
-            <systemPath>${pom.basedir}\libs\aspose-tasks-24.10-jdk17.jar</systemPath>
+            <systemPath>${pom.basedir}/libs/aspose-tasks-24.10-jdk17.jar</systemPath>
         </dependency>
         <dependency>
             <groupId>net.sf.mpxj</groupId>

yanzhu-modules/yanzhu-manage/src/main/java/com/yanzhu/manage/controller/ProVideoMonitorController.java

@@ -1,13 +1,18 @@
 package com.yanzhu.manage.controller;
 
 import java.util.List;
+import java.util.concurrent.TimeUnit;
 import javax.servlet.http.HttpServletResponse;
+
+import com.alibaba.fastjson2.JSONObject;
+import com.yanzhu.common.core.utils.http.HttpUtils;
 import com.yanzhu.common.core.utils.poi.ExcelUtil;
 import com.yanzhu.common.core.web.controller.BaseController;
 import com.yanzhu.common.core.web.domain.AjaxResult;
 import com.yanzhu.common.core.web.page.TableDataInfo;
 import com.yanzhu.common.log.annotation.Log;
 import com.yanzhu.common.log.enums.BusinessType;
+import com.yanzhu.common.redis.service.RedisService;
 import com.yanzhu.common.security.annotation.RequiresPermissions;
 import com.yanzhu.manage.domain.ProVideoMonitor;
 import com.yanzhu.manage.service.IProVideoMonitorService;
@@ -100,4 +105,40 @@ public class ProVideoMonitorController extends BaseController
     {
         return toAjax(proVideoMonitorService.deleteProVideoMonitorByIds(ids));
     }
+
+
+    @Autowired
+    private RedisService redisService;
+
+    @RequiresPermissions("manage:videoMonitor:list")
+    @GetMapping("/getYsToken/{id}")
+    public AjaxResult getYsToken(@PathVariable Long id){
+        ProVideoMonitor proVideoMonitor = proVideoMonitorService.selectProVideoMonitorById(id);
+        if(proVideoMonitor == null){
+            return  AjaxResult.error("无效ID");
+        }
+        String key="YS_Token__"+ proVideoMonitor.getAppkey()+"_"+proVideoMonitor.getSecret();
+        JSONObject jo=redisService.getCacheObject(key);
+        String token="";
+        if(jo!=null){
+          long expireTime=  jo.getLong("expireTime");
+          if(expireTime> System.currentTimeMillis()+1000*60){
+              token=jo.getString("accessToken");
+              return AjaxResult.success(token);
+          }
+        }
+        String postData="appKey="+proVideoMonitor.getAppkey()+"&appSecret="+proVideoMonitor.getSecret();
+        String url="https://open.ys7.com/api/lapp/token/get";
+        String data= HttpUtils.sendPost(url,postData);
+        jo=JSONObject.parseObject(data);
+        if("200".equals(jo.getString("code"))){
+            JSONObject jobj=jo.getJSONObject("data");
+            token=jobj.getString("accessToken");
+            long expireTime=  jobj.getLong("expireTime");
+            redisService.setCacheObject(key,jobj,expireTime-System.currentTimeMillis(), TimeUnit.MICROSECONDS);
+        }
+        return AjaxResult.success(token);
+    }
+
+
 }

yanzhu-ui-vue3/src/App.vue

@@ -69,4 +69,7 @@ onMounted(() => {
 :focus-visible {
   outline:  none !important;
 } 
+.command{
+  cursor: pointer;
+}
 </style>

yanzhu-ui-vue3/src/api/manage/videoMonitor.js

@@ -42,3 +42,10 @@ export function delVideoMonitor(id) {
     method: 'delete'
   })
 }
+
+export function getYsToken(id){
+  return request({
+    url: '/manage/videoMonitor/getYsToken/' + id,
+    method: 'get'
+  })
+}

yanzhu-ui-vue3/src/assets/icons/svg/4screen.svg

@@ -0,0 +1 @@
+<svg class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4306"><path d="M159.762 160.278h321.02v321.019h-321.02z m383.457 0h321.018v321.019H543.22z m0 382.425h321.018v321.019H543.22z m-383.457 0h321.02v321.019h-321.02z" p-id="4307"></path></svg>

yanzhu-ui-vue3/src/assets/icons/svg/9screen.svg

@@ -0,0 +1 @@
+<svg class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5237"><path d="M136.061875 132.541875h197.83v197.83H136.061875zM380.51187501 132.541875h197.83v197.83H380.51187501zM624.951875 132.541875h197.83v197.83H624.951875zM136.061875 380.51187501h197.83v197.83H136.061875zM380.51187501 380.51187501h197.83v197.83H380.51187501zM624.951875 380.51187501h197.83v197.83H624.951875zM136.061875 628.471875h197.83v197.83H136.061875zM380.51187501 628.471875h197.83v197.83H380.51187501zM624.951875 628.471875h197.83v197.83H624.951875z" 1 p-id="5238"></path></svg>

yanzhu-ui-vue3/src/assets/icons/svg/video.svg

@@ -0,0 +1 @@
+<svg class="icon" style="width: 1em;height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3408"><path d="M912 302.3L784 376V224c0-35.3-28.7-64-64-64H128c-35.3 0-64 28.7-64 64v576c0 35.3 28.7 64 64 64h592c35.3 0 64-28.7 64-64V648l128 73.7c21.3 12.3 48-3.1 48-27.6V330c0-24.6-26.7-40-48-27.7zM712 792H136V232h576v560z m176-167l-104-59.8V458.9L888 399v226zM208 360h112c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H208c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" p-id="3409"></path></svg>

yanzhu-ui-vue3/src/components/CurrentProject/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-button type="primary" plain :icon="OfficeBuilding" @click="showProList">{{userStore.currentProId?userStore.currentProName:'所有项目'}}</el-button>
+    <el-button type="primary" plain :icon="OfficeBuilding" @click="showProList">{{userStore.currentPrjId?userStore.currentProName:'所有项目'}}</el-button>
     
     <!--选择项目-->
     <el-dialog v-model="dialogVisible" title="选择切换项目" width="800" modal-class="CurrentProjectDlg">
@@ -16,7 +16,7 @@
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-        <el-button v-if="userStore.currentProId && isAdmin" type="danger" icon="CircleClose" @click="circleClose">取消选择项目</el-button>
+        <el-button v-if="userStore.currentPrjId && isAdmin" type="danger" icon="CircleClose" @click="circleClose">取消选择项目</el-button>
       </el-form-item>
       </el-form>
       
@@ -36,8 +36,8 @@
         </el-table-column>
         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template #default="scope">
-          <el-button v-if="scope.row.id == userStore.currentProId" disabled link type="primary">已 选 中</el-button>
+          <el-button v-if="scope.row.id == userStore.currentPrjId" disabled link type="primary">已 选 中</el-button>
-          <el-button v-if="scope.row.id != userStore.currentProId" link type="primary" icon="Switch" @click="changeDefault(scope.row.id)">切换项目</el-button>
+          <el-button v-if="scope.row.id != userStore.currentPrjId" link type="primary" icon="Switch" @click="changeDefault(scope.row.id)">切换项目</el-button>
         </template>
       </el-table-column>
       </el-table>

yanzhu-ui-vue3/src/components/flow/Role/index.vue

@@ -151,7 +151,7 @@ watch(roleList, newValue => {
 /** 查询角色列表 */
 function getList() {
   loading.value = true;
-  queryParams.value.projectId = userStore.currentProId;
+  queryParams.value.projectId = userStore.currentPrjId;
   listRole(queryParams.value).then(response => {
     roleList.value = response.rows;
     total.value = response.total;

yanzhu-ui-vue3/src/store/modules/user.js

@@ -17,7 +17,7 @@ const useUserStore = defineStore(
       permissions: [],
       currentComId: null,
       currentComName: null,
-      currentProId: null,
+      currentPrjId: null,
       currentProName: null,
     }),
     actions: {
@@ -58,7 +58,7 @@ const useUserStore = defineStore(
             this.avatar = avatar;
             this.currentComId = user.activeComId;
             this.currentComName = user.activeComName;
-            this.currentProId = user.activeProjectId;
+            this.currentPrjId = user.activeProjectId;
             this.currentProName = user.activeProjectName;
             resolve(res)
           }).catch(error => {

yanzhu-ui-vue3/src/views/flowable/definition/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="proName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="proName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.proName"
           placeholder="请输入项目名称"
@@ -284,7 +284,7 @@ function handleSelectionChange(selection) {
 
 /** 跳转到流程设计页面 */
 function handleLoadXml(row){
-  if(!userStore.currentProId){
+  if(!userStore.currentPrjId){
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }

yanzhu-ui-vue3/src/views/flowable/task/finished/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="startProName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="startProName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.startProName"
           placeholder="请输入项目名称"

yanzhu-ui-vue3/src/views/flowable/task/myProcess/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="startProName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="startProName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.startProName"
           placeholder="请输入项目名称"

yanzhu-ui-vue3/src/views/flowable/task/todo/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="startProName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="startProName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.startProName"
           placeholder="请输入项目名称"

yanzhu-ui-vue3/src/views/manage/attendanceUbiData/index.vue

@@ -3,7 +3,7 @@
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
      
       <el-form-item label="项目" prop="projectId">
-        <el-select :disabled="data.currentProId != ''" style="width:150px;" v-model="queryParams.projectId" placeholder="请选择项目" clearable
+        <el-select :disabled="data.currentPrjId != ''" style="width:150px;" v-model="queryParams.projectId" placeholder="请选择项目" clearable
           @change="()=>{handleQuery();projectChange();}">
           <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
           </el-option>
@@ -199,7 +199,7 @@ const data = reactive({
   },
   projects:[],
   subdepts:[],
-  currentProId: '',
+  currentPrjId: '',
 });
 
 const { queryParams, form, rules } = toRefs(data);
@@ -218,9 +218,9 @@ function projectChange(){
 function getProjectList() {
   findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
     data.projects = response.rows;
-    if (userStore.currentProId) {
+    if (userStore.currentPrjId) {
-      queryParams.value.projectId = userStore.currentProId
+      queryParams.value.projectId = userStore.currentPrjId
-      data.currentProId = userStore.currentProId;
+      data.currentPrjId = userStore.currentPrjId;
       projectChange();
     }
   });

yanzhu-ui-vue3/src/views/manage/attendanceUbiData/statistics.vue

@@ -2,7 +2,7 @@
     <div class="app-container attendance-ubi-data-statistics">
         <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="90px">
             <el-form-item label="项目" prop="projectId">
-                <el-select :disabled="data.currentProId != ''" style="width:150px;" v-model="queryParams.projectId"
+                <el-select :disabled="data.currentPrjId != ''" style="width:150px;" v-model="queryParams.projectId"
                     placeholder="请选择项目" clearable @change="() => { handleQuery(); projectChange(); }">
                     <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
                     </el-option>
@@ -88,7 +88,7 @@ const data = reactive({
     },
     projects: [],
     subdepts: [],
-    currentProId: '',
+    currentPrjId: '',
     attendanceUbiDataList: [],
     loading: false,
     total: 0,
@@ -107,9 +107,9 @@ function projectChange() {
 function getProjectList() {
     findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
         data.projects = response.rows;
-        if (userStore.currentProId) {
+        if (userStore.currentPrjId) {
-            queryParams.value.projectId = userStore.currentProId
+            queryParams.value.projectId = userStore.currentPrjId
-            data.currentProId = userStore.currentProId;
+            data.currentPrjId = userStore.currentPrjId;
             projectChange();
         }
     });

yanzhu-ui-vue3/src/views/manage/attendance_cfg/index.vue

@@ -5,7 +5,7 @@
         <el-input v-model="queryParams.comId" placeholder="请输入公司主键" clearable @keyup.enter="handleQuery"/>
       </el-form-item>
       <el-form-item label="项目" prop="projectId">
-        <el-select :disabled="data.currentProId != ''" v-model="queryParams.projectId" placeholder="请选择项目" clearable style="width:150px;"
+        <el-select :disabled="data.currentPrjId != ''" v-model="queryParams.projectId" placeholder="请选择项目" clearable style="width:150px;"
           @change="handleQuery">
           <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
           </el-option>
@@ -94,7 +94,7 @@
       :close-on-press-escape="false">
       <el-form ref="attendance_cfgRef" :model="form" :rules="rules" label-width="100px">
         <el-form-item label="所属项目" prop="projectId">
-          <el-select :disabled="data.currentProId != ''||data.mode=='edit'" v-model="form.projectId" placeholder="请选择项目">
+          <el-select :disabled="data.currentPrjId != ''||data.mode=='edit'" v-model="form.projectId" placeholder="请选择项目">
             <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
             </el-option>
           </el-select>
@@ -173,7 +173,7 @@ const data = reactive({
     projectGuid: [{ required: true, trigger: ['blur', 'change'], message: "请输入项目Guid" }],
   },
   projects: [],
-  currentProId: '',
+  currentPrjId: '',
   mode:'',
 });
 
@@ -193,9 +193,9 @@ function handleDeviceList(row){
 function getProjectList() {
   findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
     data.projects = response.rows;
-    if (userStore.currentProId) {
+    if (userStore.currentPrjId) {
-      queryParams.value.projectId = userStore.currentProId
+      queryParams.value.projectId = userStore.currentPrjId
-      data.currentProId = userStore.currentProId;
+      data.currentPrjId = userStore.currentPrjId;
     }
   });
 }
@@ -224,7 +224,7 @@ function reset() {
   form.value = {
     id: null,
     comId: null,
-    projectId: data.currentProId,
+    projectId: data.currentPrjId,
     vendorsCode: 'uni',
     AppKey: '',
     AppSecret: '',

yanzhu-ui-vue3/src/views/manage/attendance_ubi_device/index.vue

@@ -3,7 +3,7 @@
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="90px">
      
       <el-form-item label="项目" prop="projectId">
-        <el-select :disabled="data.currentProId != ''" v-model="queryParams.projectId" placeholder="请选择项目" clearable
+        <el-select :disabled="data.currentPrjId != ''" v-model="queryParams.projectId" placeholder="请选择项目" clearable
           @change="handleQuery">
           <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
           </el-option>
@@ -187,7 +187,7 @@ const data = reactive({
     deviceNo: [{ required: true, trigger: ['blur', 'change'], message: "请输入设备序列号" }],
   },
   projects: [],
-  currentProId: '',
+  currentPrjId: '',
   mode:'',
 });
 
@@ -208,9 +208,9 @@ function handleAuth(row){
 function getProjectList() {
   findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
     data.projects = response.rows;
-    if (userStore.currentProId) {
+    if (userStore.currentPrjId) {
-      queryParams.value.projectId = userStore.currentProId
+      queryParams.value.projectId = userStore.currentPrjId
-      data.currentProId = userStore.currentProId;
+      data.currentPrjId = userStore.currentPrjId;
     }
   });
 }
@@ -285,12 +285,12 @@ function handleSelectionChange(selection) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
   reset();  
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   form.value.source=ubi_device_source.value[0].value;
   open.value = true;
@@ -299,7 +299,7 @@ function handleAdd() {
 
 /** 修改按钮操作 */
 function handleUpdate(row) {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }

yanzhu-ui-vue3/src/views/manage/attendance_ubi_device/ubiDeviceDrawer.vue

@@ -150,7 +150,7 @@ const data = reactive({
         deviceNo: [{ required: true, trigger: ['blur', 'change'], message: "请输入设备序列号" }],
     },
     projects: [],
-    currentProId: '',
+    currentPrjId: '',
     mode: '',
     show: false,
     row: null

yanzhu-ui-vue3/src/views/manage/basSignet/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"

yanzhu-ui-vue3/src/views/manage/basTemplate/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"
@@ -266,14 +266,14 @@ function handleSelectionChange(selection) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if(!userStore.currentProId){
+  if(!userStore.currentPrjId){
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
   reset();
   form.value.comId = userStore.currentComId;
   form.value.comName = userStore.currentComName;
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   open.value = true;
   title.value = "添加业务模板";

yanzhu-ui-vue3/src/views/manage/busExamInfo/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"
@@ -358,12 +358,12 @@ function handleSelectionChange(selection) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if(!userStore.currentProId){
+  if(!userStore.currentPrjId){
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
   reset();
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   open.value = true;
   title.value = "添加基础试卷";

yanzhu-ui-vue3/src/views/manage/busExamQuestion/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"
@@ -424,7 +424,7 @@ function handleAdd() {
 
 /** 新增按钮操作 */
 function handleAddCom() {
-  if(!userStore.currentProId){
+  if(!userStore.currentPrjId){
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
@@ -438,7 +438,7 @@ function handleAddCom() {
 
 /** 新增按钮操作 */
 function handleAddProject() {
-  if(!userStore.currentProId){
+  if(!userStore.currentPrjId){
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
@@ -446,7 +446,7 @@ function handleAddProject() {
   initPost();
   form.value.comId = userStore.currentComId;
   form.value.comName = userStore.currentComName;
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   open.value = true;
   title.value = "添加试题及答案";

yanzhu-ui-vue3/src/views/manage/busExamUser/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"

yanzhu-ui-vue3/src/views/manage/busTrainingVideo/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container bus-training-video-index">
       <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-        <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+        <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"
@@ -378,12 +378,12 @@ function handleUpdate(row) {
 function trainLevelChange(){
   if(form.value.trainLevel){
     if(form.value.trainLevel=='3' || form.value.trainLevel=='4'){
-      if(!userStore.currentProId){
+      if(!userStore.currentPrjId){
         proxy.$modal.msgWarning("请切换到项目数据！！！");
         open.value = false;
         return false;
       }else{
-        form.value.projectId = userStore.currentProId;
+        form.value.projectId = userStore.currentPrjId;
         form.value.projectName = userStore.currentProName;
       }
     }else{

yanzhu-ui-vue3/src/views/manage/busTrainingVideoUser/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input
           v-model="queryParams.projectName"
           placeholder="请输入项目名称"

yanzhu-ui-vue3/src/views/manage/greenCarbonData/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container green-carbon-data">
-    <template v-if="data.currentProId">
+    <template v-if="data.currentPrjId">
     <el-tabs v-model="data.selTab" type="card" class="main-tab" @click="doTabClick">
       <el-tab-pane v-for="(it, idx) in data.types" :key="idx" :name="it.value"
         :label="it.text + '(' + it.count + ')'"></el-tab-pane>
@@ -167,7 +167,7 @@ const data = reactive({
       { required: true, message: '请输入实际使用量', trigger: 'blur' },
     ],
   },
-  currentProId: '',
+  currentPrjId: '',
   types: greenCarbonData.types.map(it => {
     it.count = 0;
     return it;
@@ -278,7 +278,7 @@ function calcDataValue() {
 }
 /** 新增按钮操作 */
 function handleAdd() {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
@@ -286,13 +286,13 @@ function handleAdd() {
   listGreenCarbonItem({
     pageNum: 1,
     pageSize: 100,
-    projectId: userStore.currentProId,
+    projectId: userStore.currentPrjId,
     comId: userStore.currentComId,
     carbonFactorType: data.selTab
   }).then(d => {
     data.itemList = d.rows || [];
   });
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   open.value = true;
   title.value = "建碳管理 - " + getGreenCarbon(data.selTab).text + ' - 新增';
@@ -305,7 +305,7 @@ function handleUpdate(row) {
   listGreenCarbonItem({
     pageNum: 1,
     pageSize: 100,
-    projectId: userStore.currentProId,
+    projectId: userStore.currentPrjId,
     comId: userStore.currentComId,
     carbonFactorType: data.selTab
   }).then(d => {
@@ -361,9 +361,9 @@ function handleExport() {
 }
 
 onMounted(() => {
-  queryParams.value.projectId = userStore.currentProId;
+  queryParams.value.projectId = userStore.currentPrjId;
   queryParams.value.comId = userStore.currentComId;
-  data.currentProId = userStore.currentProId;
+  data.currentPrjId = userStore.currentPrjId;
   getList();
   getCounts();
 })

yanzhu-ui-vue3/src/views/manage/greenCarbonItem/index.vue

@@ -3,7 +3,7 @@
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px">    
       
       <el-form-item label="项目" prop="projectId">
-        <el-select :disabled="data.currentProId != ''" v-model="queryParams.projectId" placeholder="请选择项目" clearable style="width:150px;"
+        <el-select :disabled="data.currentPrjId != ''" v-model="queryParams.projectId" placeholder="请选择项目" clearable style="width:150px;"
           @change="handleQuery">
           <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
           </el-option>
@@ -52,8 +52,8 @@
 
     <el-table v-loading="loading" :data="greenCarbonItemList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="公司" align="center" prop="compName" v-if="!data.currentProId"/>
+      <el-table-column label="公司" align="center" prop="compName" v-if="!data.currentPrjId"/>
-      <el-table-column label="分包单位" align="center" prop="projectName"  v-if="!data.currentProId"/>
+      <el-table-column label="分包单位" align="center" prop="projectName"  v-if="!data.currentPrjId"/>
       <el-table-column label="碳因子类型" align="center" prop="carbonFactorType">
         <template #default="scope">{{getGreenCarbon(scope.row.carbonFactorType).text }}</template>
       </el-table-column>
@@ -114,8 +114,8 @@
 
     <el-dialog title="导入结果" v-model="data.openImport" width="800px"  append-to-body class="green-import-result-dialog">
       <el-table  :data="data.importData" height="50vh">
-      <el-table-column label="公司" align="center" prop="compName" v-if="!data.currentProId"/>
+      <el-table-column label="公司" align="center" prop="compName" v-if="!data.currentPrjId"/>
-      <el-table-column label="分包单位" align="center" prop="projectName"  v-if="!data.currentProId"/>
+      <el-table-column label="分包单位" align="center" prop="projectName"  v-if="!data.currentPrjId"/>
       <el-table-column label="碳因子类型" align="center" prop="carbonFactorType">
         <template #default="scope">{{getGreenCarbon(scope.row.carbonFactorType).text }}</template>
       </el-table-column>
@@ -201,7 +201,7 @@ const data = reactive({
     ],
   },
   projects:[],
-  currentProId:'',
+  currentPrjId:'',
   types:greenCarbonData.types,
   delDatas:[],
   importData:[],
@@ -213,9 +213,9 @@ const { queryParams, form, rules } = toRefs(data);
 function getProjectList() {
   findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
     data.projects = response.rows;
-    if (userStore.currentProId) {
+    if (userStore.currentPrjId) {
-      queryParams.value.projectId = userStore.currentProId
+      queryParams.value.projectId = userStore.currentPrjId
-      data.currentProId = userStore.currentProId;
+      data.currentPrjId = userStore.currentPrjId;
     }
   });
 }
@@ -278,12 +278,12 @@ function handleSelectionChange(selection) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
   reset();
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   open.value = true;
   title.value = "碳因子管理-增加";

yanzhu-ui-vue3/src/views/manage/milestone/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container project-milestone">
 
-    <template v-if="data.currentProId">
+    <template v-if="data.currentPrjId">
       <el-row :gutter="10" class="mb8">
         <el-col :span="1.5">
           <el-button type="primary" plain icon="Plus" @click="handleAdd"
@@ -99,7 +99,7 @@ const data = reactive({
   },
   rules: {
   },
-  currentProId: '',
+  currentPrjId: '',
   milestoneList: []
 });
 
@@ -135,7 +135,7 @@ function handleUpdate(row) {
   let objs = data.milestoneList.filter(d => d.nodeName).filter(d => d.nodeName.trim());
   objs.forEach(it => {
     it.comId = userStore.currentComId;
-    it.projectId = userStore.currentProId;
+    it.projectId = userStore.currentPrjId;
   })
   if (objs.length == 0) {
     proxy.$modal.msgError("请输入节点名称!");
@@ -171,9 +171,9 @@ function handleDelete(row) {
 }
 
 onMounted(() => {
-  queryParams.value.projectId = userStore.currentProId;
+  queryParams.value.projectId = userStore.currentPrjId;
   queryParams.value.comId = userStore.currentComId;
-  data.currentProId = userStore.currentProId;
+  data.currentPrjId = userStore.currentPrjId;
   getList();
 });
 </script>

yanzhu-ui-vue3/src/views/manage/plan/index.vue

@@ -306,7 +306,7 @@ function handleExport() {
     ...queryParams.value
   }, `${name}计划_${new Date().getTime()}.mpp`)
 }
-data.projectId=userStore.currentProId;
+data.projectId=userStore.currentPrjId;
 data.compId=userStore.currentComId;
 queryParams.value.projectId=data.projectId;
 getList();

yanzhu-ui-vue3/src/views/manage/proProjectInfoSubdepts/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input v-model="queryParams.projectName" placeholder="请输入项目名称" clearable @keyup.enter="handleQuery" />
       </el-form-item>
       <el-form-item label="单位类型" prop="subDeptType">
@@ -331,12 +331,12 @@ function handleSelectionChange(selection) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
   reset();
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   activeTabs.value = "base";
   open.value = true;

yanzhu-ui-vue3/src/views/manage/proProjectInfoSubdeptsGroup/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentProId">
+      <el-form-item label="项目名称" prop="projectName" v-if="!userStore.currentPrjId">
         <el-input v-model="queryParams.projectName" placeholder="请输入项目名称" clearable @keyup.enter="handleQuery" />
       </el-form-item>
       <el-form-item label="单位名称" prop="subDeptName">
@@ -273,14 +273,14 @@ function handleSelectionChange(selection) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
   reset();
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
-  initSubDeptOptions(userStore.currentProId);
+  initSubDeptOptions(userStore.currentPrjId);
   activeTabs.value = "base";
   open.value = true;
   title.value = "添加单位班组";

yanzhu-ui-vue3/src/views/manage/proProjectInfoSubdeptsUsers/index.vue

@@ -552,7 +552,7 @@ function handleSelectionChange(selection) {
 }
 
 function loadSubDepts(cb) {
-  listProProjectInfoSubdepts({ projectId: userStore.currentProId, pageNum: 1, pageSize: 100 }).then(d => {
+  listProProjectInfoSubdepts({ projectId: userStore.currentPrjId, pageNum: 1, pageSize: 100 }).then(d => {
     data.subdepts = d.rows || [];
     if (data.subdepts.length > 0) {
       let sd = data.subdepts[0];
@@ -565,7 +565,7 @@ function loadSubDepts(cb) {
 
 /** 新增按钮操作 */
 function handleAdd() {
-  if (!userStore.currentProId) {
+  if (!userStore.currentPrjId) {
     proxy.$modal.msgWarning("请切换到项目数据！！！");
     return false;
   }
@@ -573,7 +573,7 @@ function handleAdd() {
   data.editData=null;
   data.mode = 'add';
   form.value.certificateType = "";
-  form.value.projectId = userStore.currentProId;
+  form.value.projectId = userStore.currentPrjId;
   form.value.projectName = userStore.currentProName;
   form.value.nation = data.nationOpts[0];
   form.value.sex = data.sexOpts[0];

yanzhu-ui-vue3/src/views/manage/videoMonitor/index.vue

@@ -62,26 +62,16 @@
     </el-row>
 
     <el-table v-loading="loading" :data="videoMonitorList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="${comment}" align="center" prop="id" />
-      <el-table-column label="${comment}" align="center" prop="comId" />
-      <el-table-column label="${comment}" align="center" prop="projectId" />
       <el-table-column label="监控名称" align="center" prop="monitorName" />
-      <el-table-column label="监控类型" align="center" prop="monitorType" />
+      <el-table-column label="项目名称" align="center" prop="projectName" />      
-      <el-table-column label="监控连接" align="center" prop="url" />
+      <el-table-column label="链接" align="center" prop="url" />
-      <el-table-column label="AppKey" align="center" prop="appkey" />
+      <el-table-column label="萤石云AppKey" align="center" prop="appkey" />
-      <el-table-column label="Secret" align="center" prop="secret" />
+      <el-table-column label="萤石云Secret" align="center" prop="secret" />
       <el-table-column label="设备厂商" align="center" prop="manufacturer" />
-      <el-table-column label="是否关键点" align="center" prop="keyPoint" />
+      <el-table-column label="是否重点" align="center" prop="keyPoint">
-      <el-table-column label="${comment}" align="center" prop="remark" />
+        <template #default="scope">{{scope.row.keyPoint==1?'是':'否' }}</template>
-      <el-table-column label="${comment}" align="center" prop="state" />
-      <el-table-column label="${comment}" align="center" prop="isDel" />
-      <el-table-column label="${comment}" align="center" prop="upadteTime" width="180">
-        <template #default="scope">
-          <span>{{ parseTime(scope.row.upadteTime, '{y}-{m}-{d}') }}</span>
-        </template>
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160px">
         <template #default="scope">
           <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
             v-hasPermi="['manage:videoMonitor:edit']">修改</el-button>
@@ -143,12 +133,18 @@
         </div>
       </template>
     </el-dialog>
-    <videoMonitorDrawer ref="videoDrawer"/>
+    <videoMonitorDrawer ref="videoDrawer"  @success="doSuccess"/>
   </div>
 </template>
 
 <script setup name="VideoMonitor">
-import { listVideoMonitor, getVideoMonitor, delVideoMonitor, addVideoMonitor, updateVideoMonitor } from "@/api/manage/videoMonitor";
+import {
+  listVideoMonitor,
+  getVideoMonitor,
+  delVideoMonitor,
+  addVideoMonitor,
+  updateVideoMonitor,
+} from "@/api/manage/videoMonitor";
 import videoMonitorDrawer from "./videoMonitorDrawer.vue";
 const { proxy } = getCurrentInstance();
 
@@ -161,7 +157,7 @@ const single = ref(true);
 const multiple = ref(true);
 const total = ref(0);
 const title = ref("");
-const videoDrawer=ref()
+const videoDrawer = ref();
 
 const data = reactive({
   form: {},
@@ -179,10 +175,9 @@ const data = reactive({
     keyPoint: null,
     state: null,
     isDel: null,
-    upadteTime: null
+    upadteTime: null,
   },
-  rules: {
+  rules: {},
-  }
 });
 
 const { queryParams, form, rules } = toRefs(data);
@@ -190,7 +185,7 @@ const { queryParams, form, rules } = toRefs(data);
 /** 查询延迟摄影管理列表 */
 function getList() {
   loading.value = true;
-  listVideoMonitor(queryParams.value).then(response => {
+  listVideoMonitor(queryParams.value).then((response) => {
     videoMonitorList.value = response.rows;
     total.value = response.total;
     loading.value = false;
@@ -222,7 +217,7 @@ function reset() {
     createBy: null,
     createTime: null,
     updateBy: null,
-    upadteTime: null
+    upadteTime: null,
   };
   proxy.resetForm("videoMonitorRef");
 }
@@ -239,9 +234,12 @@ function resetQuery() {
   handleQuery();
 }
 
+function doSuccess(){
+  handleQuery();
+}
 // 多选框选中数据
 function handleSelectionChange(selection) {
-  ids.value = selection.map(item => item.id);
+  ids.value = selection.map((item) => item.id);
   single.value = selection.length != 1;
   multiple.value = !selection.length;
 }
@@ -252,33 +250,37 @@ function handleAdd() {
   //open.value = true;
   //title.value = "添加延迟摄影管理";
   videoDrawer.value.showDrawer({
-    type:'add'
+    type: "add",
   });
 }
 
 /** 修改按钮操作 */
 function handleUpdate(row) {
   reset();
-  const _id = row.id || ids.value
+  const _id = row.id || ids.value;
-  getVideoMonitor(_id).then(response => {
+  getVideoMonitor(_id).then((response) => {
-    form.value = response.data;
+    //form.value = response.data;
-    open.value = true;
+    //open.value = true;
-    title.value = "修改延迟摄影管理";
+    //title.value = "修改延迟摄影管理";
+    videoDrawer.value.showDrawer({
+      row: response.data,
+      type: "edit",
+    });
   });
 }
 
 /** 提交按钮 */
 function submitForm() {
-  proxy.$refs["videoMonitorRef"].validate(valid => {
+  proxy.$refs["videoMonitorRef"].validate((valid) => {
     if (valid) {
       if (form.value.id != null) {
-        updateVideoMonitor(form.value).then(response => {
+        updateVideoMonitor(form.value).then((response) => {
           proxy.$modal.msgSuccess("修改成功");
           open.value = false;
           getList();
         });
       } else {
-        addVideoMonitor(form.value).then(response => {
+        addVideoMonitor(form.value).then((response) => {
           proxy.$modal.msgSuccess("新增成功");
           open.value = false;
           getList();
@@ -291,19 +293,27 @@ function submitForm() {
 /** 删除按钮操作 */
 function handleDelete(row) {
   const _ids = row.id || ids.value;
-  proxy.$modal.confirm('是否确认删除延迟摄影管理编号为"' + _ids + '"的数据项？').then(function () {
+  proxy.$modal
-    return delVideoMonitor(_ids);
+    .confirm('是否确认删除延迟摄影名称为【' + row.monitorName + '】的数据项？')
-  }).then(() => {
+    .then(function () {
-    getList();
+      return delVideoMonitor(_ids);
-    proxy.$modal.msgSuccess("删除成功");
+    })
-  }).catch(() => { });
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => { });
 }
 
 /** 导出按钮操作 */
 function handleExport() {
-  proxy.download('manage/videoMonitor/export', {
+  proxy.download(
-    ...queryParams.value
+    "manage/videoMonitor/export",
-  }, `videoMonitor_${new Date().getTime()}.xlsx`)
+    {
+      ...queryParams.value,
+    },
+    `videoMonitor_${new Date().getTime()}.xlsx`
+  );
 }
 
 getList();

yanzhu-ui-vue3/src/views/manage/videoMonitor/list.vue

@@ -0,0 +1,249 @@
+<template>
+    <div class="video-monitor-list">
+        <el-form ref="videoMonitorRef" label-width="120px" v-if="!data.currentPrjId">
+            <el-form-item label="项目名称">
+                <el-select :disabled="data.currentPrjId != '' || data.type == 'edit'" v-model="data.selPrjId"
+                    placeholder="请选择项目" clearable style="width:150px;" @change="loadData()">
+                    <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
+                    </el-option>
+                </el-select>
+            </el-form-item>
+        </el-form>
+        <el-row v-if="data.selPrjId" style="height: 100%;">
+            <el-col :span="4" class="video-name-list">
+                <div class="video-title command" @click="showAllVideo">设备列表</div>
+                <div class="video-list">
+                    <div v-for="it in data.videoMonitors" :key="it.id" class="video-item command"
+                        :class="it.active ? 'is-active' : ''" @click="doSelectItem(it)">
+                        <svg-icon class-name="video-icon" icon-class="video" /> {{ it.monitorName }}
+                    </div>
+                </div>
+            </el-col>
+            <el-col :span="20" :key="data.elKey" style="height: 100%;">
+                <template v-if="data.showMode == 'sigle'">
+                    <iframe v-if="data.selVideo" frameborder="0" :src="data.selVideo.iframeSrc"
+                        style="width:100%;height:100%;" id="ysOpenDevice" allowfullscreen>
+                    </iframe>
+                </template>
+                <div v-if="data.showMode == 'all'" style="height: 100%;" class="all-mode">
+                    <div class="all-header">
+                        <svg-icon class-name="icon-screen command" @click="changeSize(2)"
+                            :class="data.showSize == 2 ? 'is-active' : ''" icon-class="4screen" />
+                        <svg-icon class-name="icon-screen command" @click="changeSize(4)"
+                            :class="data.showSize != 2 ? 'is-active' : ''" icon-class="9screen" />
+                    </div>
+                    <div class="all-list" :class="data.showSize == 2 ? 'mode1' : 'mode2'">
+                        <div class="all-item" v-for="it in data.showList" :key="it.id">
+                            <iframe frameborder="0" :src="it.iframeSrc" style="width:100%;height:100%;"
+                                id="ysOpenDevice" allowfullscreen>
+                            </iframe>
+                        </div>
+                    </div>
+                    <div class="all-pager">
+                        <el-pagination background :page-size="data.showSize" :current-page="data.showIndex"
+                            @current-change="handleCurrentChange" layout="prev, pager, next" :total="data.total" />
+                    </div>
+                </div>
+            </el-col>
+        </el-row>
+    </div>
+</template>
+
+<script setup name="VideoMonitorList">
+import { findMyProjectList } from "@/api/publics";
+import {
+    listVideoMonitor,
+    getYsToken
+} from "@/api/manage/videoMonitor";
+import useUserStore from '@/store/modules/user'
+const userStore = useUserStore()
+const { proxy } = getCurrentInstance();
+const data = reactive({
+    prjInfo: null,
+    projects: [],
+    selPrjId: '',
+    currentPrjId: '',
+    comId: '',
+    videoMonitors: [],
+    selVideo: null,
+    elKey: 0,
+    showMode: 'sigle',
+    total: 0,
+    showSize: 2,
+    showIndex: 1,
+    showList: [],
+})
+function loadVideo(it) {
+    getYsToken(it.id).then(d => {
+        it.accessToken = d.msg;
+        it.iframeSrc = 'https://open.ys7.com/ezopen/h5/iframe?url=' + it.url + '&autoplay=1&accessToken=' + d.msg + '&t=' + (+new Date());
+
+    })
+}
+function changeSize(n) {
+    data.showSize = n;
+    data.showIndex = 1;
+    showAllData();
+}
+function doSelectItem(it) {
+    if (it.active) {
+        return;
+    }
+    data.showMode = "sigle";
+    if(data.selVideo){
+        data.selVideo.active = false;
+    }
+    data.selVideo = it;
+    data.selVideo.active = true;
+    loadVideo(data.selVideo);
+}
+function showAllVideo() {
+    data.selVideo.active = false;
+    data.selVideo = null;
+    data.showMode = "all";
+    data.showSize = 2;
+    data.showIndex = 1;
+    showAllData();
+}
+function handleCurrentChange(n) {
+    data.showIndex = n;
+    showAllData();
+}
+function showAllData() {
+    var start = (data.showIndex - 1) * data.showSize;
+    var end = start + data.showSize;
+    data.showList = [];
+    for (var i = start; i < end && i < data.videoMonitors.length; i++) {
+        data.showList.push(data.videoMonitors[i]);
+        loadVideo(data.videoMonitors[i])
+    }
+    data.elKey++;
+}
+function loadData() {
+    let objs = data.projects.filter(d => d.id == data.selPrjId);
+    if (objs.length == 0) {
+        data.videoMonitors = [];
+        return;
+    }
+    listVideoMonitor({
+        pageNum: 1, pageSize: 100,
+        projectId: objs[0].id,
+        comId: objs[0].comId
+    }).then(d => {
+        data.total = d.total;
+        data.videoMonitors = (d.rows || []).map(it => {
+            it.active = false;
+            return it;
+        });
+        data.selVideo = data.videoMonitors.length > 0 ? data.videoMonitors[0] : null;
+        if (data.selVideo) {
+            data.selVideo.active = true;
+            loadVideo(data.selVideo);
+        }
+    });
+}
+/** 查询项目列表 */
+function getProjectList() {
+    findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
+        data.projects = response.rows;
+        if (userStore.currentPrjId) {
+            data.currentPrjId = userStore.currentPrjId;
+            data.selPrjId = userStore.currentPrjId;
+            data.comId = userStore.currentComId
+            loadData();
+        }
+    });
+}
+getProjectList();
+</script>
+
+<style lang="scss">
+.video-monitor-list {
+    height: 100%;
+    position: absolute;
+    width: 100%;
+    padding: 12px;
+
+    .video-name-list {
+        height: 100%;
+        background: #fff;
+        box-shadow: 2px 2px 10px #ddd;
+        margin-bottom: 30px;
+        word-wrap: break-word;
+        border-radius: 10px;
+        border: 1px solid #ddd;
+
+        .video-icon {
+            fill: #ccc;
+        }
+
+        .video-title {
+            line-height: 40px;
+            background: #e0d5d588;
+            border-radius: 10px 10px 0px 0px;
+            text-align: center;
+        }
+
+        .video-list {
+            line-height: 30px;
+
+            .video-item {
+                padding: 0px 10px;
+
+                &.is-active {
+                    background: #87cefa88;
+                }
+            }
+        }
+
+    }
+
+    .all-mode {
+        .all-header {
+            text-align: right;
+
+            .icon-screen {
+                height: 40px;
+                width: 40px;
+                background: #BFC3C5;
+                fill: #fff;
+                margin-left: 10px;
+
+                &.is-active {
+                    background: #445A65;
+                    fill: #4D91FE;
+                }
+            }
+        }
+
+        .all-list {
+            display:grid;
+            grid-gap: 10px;
+            height: calc(100% - 80px);
+            &.mode1{
+                grid-template-columns: 50% 50%;    
+                grid-template-rows: 50% 50%; 
+                .all-item{
+                   
+                }          
+            }
+            &.mode2{
+                grid-template-columns: 33% 33% 33%; 
+                grid-template-rows: 33% 33% 33%; 
+                .all-item{
+                   
+                }                  
+            }
+
+           
+        }
+
+        .all-pager {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+    }
+
+}
+</style>

yanzhu-ui-vue3/src/views/manage/videoMonitor/videoMonitorDrawer.vue

@@ -3,7 +3,7 @@
         style="padding-left: 20px" :title="data.title">
         <el-form ref="videoMonitorRef" :model="form" :rules="rules" label-width="120px">
             <el-form-item label="项目名称" prop="projectId">
-                <el-select :disabled="data.currentProId != ''" v-model="form.projectId" placeholder="请选择项目" clearable
+                <el-select :disabled="data.currentPrjId != ''||data.type=='edit'" v-model="form.projectId" placeholder="请选择项目" clearable
                     style="width:150px;">
                     <el-option v-for="prj in data.projects" :key="prj.id" :label="prj.projectName" :value="prj.id">
                     </el-option>
@@ -47,9 +47,10 @@
 import { listVideoMonitor, getVideoMonitor, delVideoMonitor, addVideoMonitor, updateVideoMonitor } from "@/api/manage/videoMonitor";
 import { findMyProjectList } from "@/api/publics";
 import useUserStore from '@/store/modules/user'
+const $emit=defineEmits("success")
 const userStore = useUserStore()
 const { proxy } = getCurrentInstance();
-const form = reactive({})
+const form = ref({})
 const rules = reactive({
     projectId: [{ required: true, trigger: ['blur', 'change'], message: "请选择所属项目" }],
     monitorName: [{ required: true, trigger: ['blur', 'change'], message: "请输入监控名称" }],
@@ -63,50 +64,58 @@ const data = reactive({
     prjInfo: null,
     type: '',
     projects: [],
-    currentProId: '',
+    currentPrjId: '',
+    editRow:null,
     comId: '',
 })
 
 function showDrawer(opt) {
     data.type = opt.type;
     data.title = opt.type == 'add' ? '视频监控 - 增加' : '视频监控 - 修改'
-    form.monitorType = "萤石云";
+    if(opt.type=='edit'){
-    form.keyPoint = '0';
+        data.editRow=opt.row;
+        form.value=opt.row;
+    }else{
+        data.editRow=null;
+        form.value={}
+    }
+    form.value.monitorType = "萤石云";
+    form.value.keyPoint = '0';
     data.isOpen = true;
 }
 /** 查询项目列表 */
 function getProjectList() {
     findMyProjectList({ pageNum: 1, pageSize: 100 }).then(response => {
         data.projects = response.rows;
-        if (userStore.currentProId) {
+        if (userStore.currentPrjId) {
-            data.currentProId = userStore.currentProId;
+            data.currentPrjId = userStore.currentPrjId;
             data.comId = userStore.currentComId
-            form.projectId = data.currentProId;
+            form.value.projectId = data.currentPrjId;
         }
     });
 }
 function getSelectProject(){
-    let objs=data.projects.filter(d=>d.id==form.projectId);
+    let objs=data.projects.filter(d=>d.id==form.value.projectId);
-    return objs.length>0?objs[0]:{id:data.currentProId,comId:userStore.currentComId};
+    return objs.length>0?objs[0]:{id:data.currentPrjId,comId:userStore.currentComId};
 }
 
 function doSave() {
     proxy.$refs["videoMonitorRef"].validate(valid => {
         if (valid) {
             let prj=getSelectProject();
-            form.projectId=prj.id;
+            form.value.projectId=prj.id;
-            form.comId=prj.comId;
+            form.value.comId=prj.comId;
-            if (form.id != null) {
+            if (form.value.id != null) {
-                updateVideoMonitor(form).then(response => {
+                updateVideoMonitor(form.value).then(response => {
                     proxy.$modal.msgSuccess("修改成功");
-                    open.value = false;
+                    data.isOpen=false
-                    getList();
+                    $emit("success")
                 });
             } else {
-                addVideoMonitor(form).then(response => {
+                addVideoMonitor(form.value).then(response => {
                     proxy.$modal.msgSuccess("新增成功");
-                    open.value = false;
+                    data.isOpen=false
-                    getList();
+                    $emit("success")
                 });
             }
         }