算力管理过滤设备

ZZJ

2022-06-02 db4ed65e1d7d43a10b1315cd8fa1f97984555016

 src/views/hashrate/CameraManage/CameraRules/index.vue

@@ -56,7 +56,7 @@
            :disabled="false"
            :snapshot_url="Camera.baseImg"
            :canvasDataShow="Camera.canvasData"
            :currentCameraId="Camera.cameraId"
            :currentCamera="Camera"
            :loading="Camera.loading"
            :canvasWidth="canvasWidth"
            :canvasHeight="canvasHeight"
@@ -82,24 +82,24 @@
                v-for="(data, index) in swipercanvasData"
                :key="index"
              >
                <b
                <!--  <b
                  class="video-title"
                  style="font-size: 14px; margin-top: -10px"
                  >{{ data.name }}</b
                >
                > -->
                <polygon-canvas
                  ref="canvas"
                  v-loading="loading"
                  element-loading-text="刷新中，请稍等..."
                  element-loading-background="rgba(0, 0, 0, 0.8)"
                  :divId="data.cameraId"
                  :divId="data.camera.cameraId"
                  :isShowDrawArrow="true"
                  :isLink="true"
                  :disabled="false"
                  :loading="data.loading"
                  :snapshot_url="data.baseImg"
                  :canvasDataShow="data.canvasData"
                  :currentCameraId="data.cameraId"
                  :currentCamera="data.camera"
                  @changeLoading="changeLoading"
                  @refresh="refresh2"
                ></polygon-canvas>
@@ -149,10 +149,12 @@
              :rule="item"
              :id="'rule_' + index"
              :ruleType="'separate'"
              :cameraId="Camera.cameraId"
              @edit="editRules(item, index, 'separate')"
              @addSdk="addSdk('separate', index)"
              @backToOrigin="backToOrigin('separate', index)"
              @editSdk="editSdk($event, 'separate', index)"
              @deletRule="deletRule('separate', index)"
            ></RuleItem>
          </template>

@@ -176,7 +178,7 @@
          <!-- 摄像机 -->
          <LinkageCameraBox
            :cameras="item.cameraIds"
            @addLinkageRule="addLinkageRule"
            @addLinkageRule="addLinkageRule(item.cameraIds)"
          ></LinkageCameraBox>
          <div class="Anchor" :id="'linkage_camera' + index"></div>

@@ -187,17 +189,36 @@
              :rule="item"
              @edit="editRules(item, index, 'linkage')"
              @addSdk="addSdk('linkage', index)"
              @backToOrigin="backToOrigin('linkage', index)"
              @editSdk="editSdk($event, 'linkage', index, item.Cameras)"
              @backToOrigin="backToOrigin('linkage', index, item.cameraIds)"
              @editSdk="editSdk($event, 'linkage', index)"
              @deletRule="deletRule('linkage', index)"
              :id="'linkage_' + index"
            ></RuleItem>
          </div>
        </div>
      </template>

      <div class="empty" @click="addLinkageRule" v-else>
      <div
        class="empty"
        v-if="linkageRule.length <= 0 && !TreeDataPool.multiple"
      >
        <img src="/images/hashrate/联动场景空页面.png" alt="" />
        <div class="des">暂无联动场景</div>
      </div>

      <div
        class="newCameraArea"
        v-if="linkageRule.length <= 0 && TreeDataPool.multiple"
      >
        <LinkageCameraBox
          :cameras="CarmerasId"
          @addLinkageRule="addLinkageRule(CarmerasId)"
        ></LinkageCameraBox>

        <div class="empty">
          <img src="/images/hashrate/联动场景空页面.png" alt="" />
          <div class="des">暂无联动场景</div>
        </div>
      </div>
    </div>

@@ -219,7 +240,7 @@
      @getEditSdk="getEditSdk"
      :editSdk="editSdkObj.sdk"
      :linkEditCamera="
        ruleType === 'linkage' && editSdkObj ? editSdkObj.cameras : null
        ruleType === 'linkage' && editSdkObj ? editSdkObj.camera_polygons : null
      "
      :Cameras="ruleType === 'linkage' ? Carmeras : [Camera]"
    ></SdkSettingBox>
@@ -283,6 +304,13 @@
    selectedCameraIds() {
      return this.TreeDataPool.selectedNodes;
    },
    CarmerasId() {
      let arr = [];
      this.Carmeras.forEach((item) => {
        arr.push(item.cameraId);
      });
      return arr;
    },
  },
  data() {
    return {
@@ -325,6 +353,8 @@
          prevEl: ".swiper-next-border",
        },
      },
      showNewLinkage: false,
      newLinkageIds: [],

      // swiperOption: {
      //   slidesPerView: 5,
@@ -342,7 +372,7 @@
      SeparateRules: [], //独立场景
      linkageRule: [], //联动场景
      cameraId: "",
      showSysInfo: false,
      showSysInfo: true,
      showCanvas: true,
      canvasWidth: 568,
      canvasHeight: 320,
@@ -358,8 +388,8 @@
    this.plumbIns = jsPlumb.getInstance();
  },
  mounted() {
    this.PollData.statistics();
    this.TaskMange.findAllSdk({ installed: true });
    // this.PollData.statistics();
    this.TaskMange.findAllSdk();
  },
  destroyed() {
    document.querySelector("html").style["min-width"] = "1280px";
@@ -468,6 +498,7 @@
        this.$refs.canvas.showModal();
      }
    },

    getCanvasData(data) {
      let polyon = { ...data };
      polyon.camera_id = this.Camera.cameraId;
@@ -481,8 +512,12 @@
      let carmeras = this.Carmeras;
      for (let i = 0; i < carmeras.length; i++) {
        swipers = swipers.concat({
          cameraId: carmeras[i].cameraId,
          name: carmeras[i].camearInfo.name,
          camera: {
            cameraId: carmeras[i].cameraId,
            cameraName: carmeras[i].cameraName,
            type: carmeras[i].type,
            rtsp: carmeras[i].rtsp,
          },
          baseImg: carmeras[i].baseImg ? carmeras[i].baseImg : undefined,
          canvasData: carmeras[i].canvasData,
          loading: carmeras[i].loading,
@@ -491,6 +526,7 @@
      this.swipercanvasData = swipers;
    },
    refresh(url) {
      console.log(url);
      this.Camera.baseImg = url;
    },
    refresh2(url, id) {
@@ -523,6 +559,7 @@

      this.Camera = newCamera;
      this.SeparateRules = this.Camera.rules;

      this.$nextTick(() => {
        this.connectLine();
      });
@@ -534,19 +571,22 @@
          this.runType = element.run_type;
        }
      });

      // 获取混合场景
      this.showRules(id);
    },

    // 获取混合场景
    showRules(id) {
      if (!id) {
        return;
      }
      if (typeof id === "string") {
        id = [id];
      }
      let rules = [];

      getLinkSceneRule({ cameraIds: [id] })
      getLinkSceneRule({ cameraIds: id })
        .then((rsp) => {
          if (rsp && rsp.success) {
            rules = rsp.data;
            rules = rsp.data.rules;
            // 统一规则编辑的数据结构
            for (let i = 0; i < rules.length; i++) {
              rules[i].group_rules = rules[i].rules;
@@ -554,18 +594,12 @@

            this.linkageRule = rules;

            console.log(this.linkageRule);

            this.$set(this.Camera, "rules", this.Camera.rules.concat(rules));

            this.$nextTick(() => {
              this.connectLine2();
            });

            this.linkageRule.forEach((rule) => {
              rule.Cameras = [];
              rule.cameraIds.forEach((id) => {
                let newCamera = new VideoRuleData(id);
                rule.Cameras.push(newCamera);
              });
            });
          }
        })
@@ -783,14 +817,15 @@
      this.showAddBox = true;
    },

    addLinkageRule() {
      if (this.Carmeras.length < 2) {
    addLinkageRule(ids) {
      if (ids.length < 2) {
        this.$message({
          message: "请至少选择两台摄像机",
          type: "warning",
        });
        return;
      }
      this.newLinkageIds = ids;
      this.ruleType = "linkage";
      this.showAddBox = true;
    },
@@ -810,13 +845,7 @@
          });
        } else {
          //联动场景
          let arr = [this.Camera.cameraId];
          this.Carmeras.forEach((item) => {
            if (item.cameraId != this.Camera.cameraId) {
              arr.push(item.cameraId);
            }
          });
          newRule.data.cameraIds = arr;
          newRule.data.cameraIds = this.newLinkageIds;
          this.linkageRule.push(newRule.data);
          this.$nextTick(() => {
            this.connectLine2();
@@ -856,6 +885,7 @@
        }

        this.showAddBox = false;
        this.$forceUpdate();
      }
      this.editData = {};
    },
@@ -914,13 +944,16 @@
    },

    //取消修改
    async backToOrigin(type, index) {
    async backToOrigin(type, index, ids) {
      if (type === "separate") {
        const rsp = await getCameraSceneRule({
          cameraId: this.Camera.cameraId,
        });
        if (rsp && rsp.success) {
          let rules = rsp.data.rules ? rsp.data.rules : [];
          rules.forEach((item) => {
            item.cameraIds = rsp.data.cameraInfo.id;
          });
          if (rules[index]) {
            this.SeparateRules[index] = rules[index];
          } else {
@@ -930,32 +963,25 @@
        this.$forceUpdate();
        this.connectLine();
      } else {
        getLinkSceneRule({ cameraIds: [this.Camera.cameraId] })
          .then((rsp) => {
            if (rsp && rsp.success) {
              let rules = rsp.data;
              console.log(rules);
              if (rules[index]) {
                console.log(1111);
                this.linkageRule[index] = rules[index];
                this.linkageRule.group_rules = this.linkageRule.rules;
              } else {
                console.log(2222);
                this.linkageRule.splice(index, 1);
              }
              this.$forceUpdate();
              this.connectLine2();
        getLinkSceneRule({ cameraIds: ids }).then((rsp) => {
          if (rsp && rsp.success) {
            let rules = rsp.data.rules ? rsp.data.rules : [];
            if (rules[index]) {
              this.linkageRule[index] = rules[index];
              this.linkageRule.group_rules = this.linkageRule.rules;
            } else {
              this.linkageRule.splice(index, 1);
            }
            console.log("失败");
          })
          .catch((err) => {
            console.log(err);
          });
            this.$forceUpdate();
            this.connectLine2();
          }
          console.log("失败");
        });
      }
    },

    // 编辑算法
    editSdk(sdkIndex, type, ruleIndex, Cameras) {
    editSdk(sdkIndex, type, ruleIndex) {
      this.addData = {};
      this.ruleType = type;
      if (type === "separate") {
@@ -970,13 +996,21 @@
          ruleIndex,
          sdkIndex,
          type,
          cameras: Cameras,
          camera_polygons: this.linkageRule[ruleIndex].camera_polygons,
          sdk: this.linkageRule[ruleIndex].rules[sdkIndex],
        };
      }

      this.showSdkBox = false;
      this.showSdkSettingBox = true;
    },

    deletRule(type, index) {
      if (type === "separate") {
        this.SeparateRules.splice(index, 1);
      } else {
        this.linkageRule.splice(index, 1);
      }
    },

    getEditSdk(newRule) {
@@ -1224,6 +1258,29 @@
      }
    }

    .newCameraArea {
      display: flex;
      .empty {
        margin-left: 60px;
        width: 1220px;
        height: 198px;
        border: 1px solid #c0c5cc;
        border-radius: 5px;
        text-align: center;
        background: #f0f5fa;
        img {
          margin-top: 14px;
          width: 250px;
          height: 150px;
        }

        .des {
          margin-top: 2px;
          color: #666;
        }
      }
    }

    ::v-deep .sourcePoint {
      margin-top: -4px;
      margin-left: -6px;
@@ -1246,6 +1303,8 @@
  }

  .swiper-box-container2 {
    margin: 0;
    margin-top: -13px;
    width: 568px;
  }

@@ -1268,7 +1327,7 @@
    .swiper-next-border ::v-deep {
      position: absolute;
      bottom: 146px;
      right: 10px;
      right: 58px;
      cursor: pointer;
      z-index: 1;