模型调优基础页面新增。 实时监控样式调整 右侧增加文字； 摄像机配置-修改任务描述 图标未变更 bug修复。

sd

2025-08-01 f67b4a3c9bc79146f08d734d284e1fd00b1f6c03

 src/pages/cameraVideo/components/VideoTask.vue

@@ -1,6 +1,7 @@
<template>
  <div class="monitoring-task-box">
    <el-carousel
    <!-- <el-carousel

      class="topCarousel"
      type="card"
      height="50px"
@@ -12,21 +13,20 @@
      <el-carousel-item v-for="(item, index) in VideoTaskData.tasks" :key="index">
        <b class="medium">{{ item.name }}</b>
      </el-carousel-item>
    </el-carousel>
    </el-carousel> -->
    
      
    <div  class="example-container">
      <h2 style="float:left; font-size:15px;margin-bottom: 5px;">实时布控</h2>
      <SelectAllDropdown  @change="selectChange" @input ="selectInput" v-model="selectedRoles" :options="VideoTaskData.tasks" placeholder="请选择任务" />
    </div>
    <transition name="fade"></transition>
    <div class="monitoring-task-ul" ref="mid">
      <li
        v-for="(item, index) in VideoTaskData.taskCard"
        :key="index"
        :style="!TreeDataPool.showTreeBox ? 'float: left; width: 50%' : ''"
      >
        <Card
          :data="item"
          :class="item.activeObject.id === VideoPhotoData.activeCard ? 'my-active-card' : ''"
          :showType="item.list[0].baseInfo && item.list[0].baseInfo !== null && item.list[0].baseInfo.length > 0?'compare':''"
          @detailsClick="getDetails($event, index)"
          @addToBase="toAdd"
        ></Card>
      <li v-for="(item, index) in VideoTaskData.taskCard" :key="index"
        :style="!TreeDataPool.showTreeBox ? 'float: left; width: 50%' : ''">
        <Card :data="item" :class="item.activeObject.id === VideoPhotoData.activeCard ? 'my-active-card' : ''"
          :showType="item.list[0].baseInfo && item.list[0].baseInfo !== null && item.list[0].baseInfo.length > 0 ? 'compare' : ''"
          @detailsClick="getDetails($event, index)" @addToBase="toAdd"></Card>
      </li>
    </div>
    <!-- <div class="lookMore">
@@ -39,12 +39,15 @@

<script>
import Card from "@/components/subComponents/Card";
import SelectAllDropdown from './selectAllDropdown';
export default {
  components: {
    Card
    Card,
    SelectAllDropdown
  },
  data() {
    return {
      selectedRoles: [],
      taskUid: 0,
      liIndex: 0,
      autoplay: false
@@ -76,9 +79,19 @@
      let scrollContain = this.$refs.mid
      this.VideoPhotoData.scrollContainDom = scrollContain
    });

    this.VideoTaskData.fetchTasks();
  },
  methods: {
    selectInput(cleanValue){
      // console.info("selectInput:"+cleanValue)
    },
    selectChange(cleanValue){
      //根据任务名称获取抓拍数据
      // console.info(this.VideoTaskData.taskNameList)
      this.VideoTaskData.taskNameList = cleanValue
      // console.info(this.VideoTaskData.taskNameList)
      this.initTaskMonitorTwo();
    },
    showTasks(nodes) {
      if (nodes.length < 1) {
        this.taskUid = 0;
@@ -90,8 +103,9 @@
      this.VideoTaskData.cameras = nodes;
      //fix bug 2072
      // this.VideoTaskData.activeIndex = 0;
      this.VideoTaskData.fetchTasks();
      this.initTaskMonitor();

      // this.VideoTaskData.fetchTasks(); //2025.07.30 右侧预警数据不再与播放的实时监控绑定
      // this.initTaskMonitor();
    },
    changeCarousel(index) {
      this.VideoTaskData.activeIndex = index;
@@ -106,6 +120,14 @@
        _this.monitoRealTimeMsg(uid);
      }, 1 * 1000);
    },
    initTaskMonitorTwo() {//2025.07.30 右侧预警数据不再与播放的实时监控绑定
      const uid = Math.round(Math.random() * 1000);
      this.taskUid = uid;
      let _this = this;
      setTimeout(() => {
        _this.monitoRealTimeMsgTwo(uid);
      }, 1 * 1000);
    },
    monitoRealTimeMsg(uid) {
      if (uid !== this.taskUid) {
        return;
@@ -114,6 +136,16 @@
      let _this = this;
      setTimeout(() => {
        _this.monitoRealTimeMsg(uid);
      }, 2 * 1000);
    },
    monitoRealTimeMsgTwo(uid) {//2025.07.30 右侧预警数据不再与播放的实时监控绑定
      if (uid !== this.taskUid) {
        return;
      }
      this.VideoTaskData.monitorTaskDataTwo();
      let _this = this;
      setTimeout(() => {
        _this.monitoRealTimeMsgTwo(uid);
      }, 2 * 1000);
    },
    toAdd(item) {
@@ -140,23 +172,28 @@
.monitoring-task-box {
  height: 100%;
  width: 100%;

  .topCarousel {
    .el-carousel__arrow {
      width: 20px;
      height: 20px;
    }

    .el-carousel__arrow:hover {
      background-color: rgba(102, 102, 102);
    }

    .is-active {
      background: #ffffff !important;
      box-shadow: 0 5px 5px 0 rgba(11, 51, 153, 0.12) !important;
      height: calc(100% - 5px);

      b {
        color: #3d68e1 !important;
      }
    }
  }

  .monitoring-task-ul {
    height: calc(100% - 90px);
    width: 100%;
@@ -166,38 +203,48 @@
    border-bottom: 1px solid #e8e8e8;
    padding-bottom: 2px;
    position: relative;

    .el-card__body {
      padding: 5px;
      box-sizing: border-box;

      .el-carousel__item {
        background-color: #fff !important;
      }
    }

    li {
      height: 150px;
      padding-top: 10px;

      .info {

        .leftInfo,
        .rightInfo {
          display: inline-block;
          width: 50%;
        }

        .infoIcon {
          height: 24px;
          cursor: pointer;

          i {
            margin: 5px;
          }
        }
      }
    }

    .img-box {
      width: 94%;
      margin: 0px auto;
      position: relative;

      .img-box-img {
        width: 40%;
      }

      .img-box-p {
        position: absolute;
        background-color: red;
@@ -213,6 +260,7 @@
      }
    }
  }

  .el-carousel__item .medium {
    color: #273a53;
    font-size: 14px;
@@ -228,20 +276,30 @@
  .el-carousel__item:nth-child(2n + 1) {
    background-color: #e0e3e7;
  }

  .el-carousel__indicators {
    display: none;
  }

  .lookMore {
    height: 38px;
    line-height: 38px;

    b {
      cursor: pointer;
      text-decoration: underline;
    }
  }

  .lookMore:hover {
    // color: red;
    color: rgb(61, 104, 225);
  }
}
.example-container {
  // max-width: 500px;
  // height: 50px;
  padding: 5px;
  background-color: #fff;
}
</style>