统计查询人脸比对卡片图片分值区布局调整

hanbaoshan

2020-12-04 46183ba8c63b38ea3671e7923edc7ec2fd34a6c3

 src/components/canvas/Dialog.vue

@@ -86,7 +86,7 @@
            @click="undo"
            :disabled="disableSelect"
            style="position:absolute;left:25px;top:400px;font-size:2rem;cursor:pointer"
          ></span> -->
          ></span>-->
        </el-tooltip>
        <!-- <el-button type="default" @click="undo()">撤销</el-button> -->
      </el-col>
@@ -97,11 +97,7 @@
          width="960"
          height="540"
          :style="
            `position:static;background:url(${
              snapshot_url
                ? `/httpImage/${snapshot_url}`
                : backImg
            }) 0% 0%/960px 540px no-repeat;`
            `position:static;background:url(${snapshot_url}) 0% 0%/960px 540px no-repeat;`
          "
        ></canvas>
        <p
@@ -112,7 +108,7 @@
          class="iconfont icongengxin"
          @click="refresh"
          style="position:absolute;left:930px;font-size:2.5rem;cursor:pointer;color:white"
        ></span> -->
        ></span>-->
      </el-col>
    </el-row>
  </div>
@@ -122,7 +118,7 @@
  name: "canvasDialog",
  data() {
    return {
      backImg: require("../../assets/baseimg.png"),
      backImg: require("../../assets/img/baseimg.png"),
      url: "", // canvas图片的二进制格式转为dataURL格式
      type: "0", // 绘图状态 '0'为选中删除，'1'为画线，‘2’为画矩形，‘4’为画箭头，‘5’为画多边形
      points: [], // 记录绘制多边形时的各点坐标，绘制多边形时由于不是一笔完成，以数组数据做始终闭合的图形，双击后录成快照，把数组内容转移到最终数据中，然后清空数组
@@ -215,14 +211,15 @@
        src: this.c.toDataURL("image/png")
      });
      this.delCursor = { type: -1, index: -1, remarksName: "", id: "" }
      

      console.log("画布初始化");
    },
    // 取消画布清除状态函数
    cancel() {
      this.changeType('0')
      this.undisabled()
      this.delCursor = {}
      //this.delCursor = {}
      this.delCursor = { type: -1, index: -1, remarksName: "", id: "" };
      this.canvasHistory.length = 0;
      this.step = -1;
      this.canvasData = JSON.parse(JSON.stringify(this.canvasDataToChild));
@@ -397,6 +394,7 @@
    },
    // 删除元素
    del() {
      debugger
      let delEle = {};
      switch (this.delCursor.type) {
        case "1":
@@ -413,7 +411,7 @@
          break;
        case "5":
          delEle = this.canvasData.polygon[this.delCursor.index];
          this.canvasData.polygon.splice(this.delCursor.index, 1);
          this.canvasData.polygon.splice(this.delCursor.index+1, 1);
          break;
      }
      this.clickSelect();
@@ -789,8 +787,8 @@
      }
      // console.log("撤销！",this.canvasData);
    },
    disabledOthers(type){
      console.log("当前type:",type)
    disabledOthers(type) {
      console.log("当前type:", type)
      switch (type) {
        case "1":
          this.disableLine = false
@@ -817,14 +815,14 @@
          this.disableLine = true
          this.disableRect = true
          this.disableArrow = true
          this.disablePolygon = false  
          this.disablePolygon = false
          this.disableSelect = true
          break
      }
      console.log("禁用直线：",this.disableLine)
      console.log("禁用矩形：",this.disableRect)
      console.log("禁用箭头：",this.disableArrow)
      console.log("禁用多边形：",this.disablePolygon)
      console.log("禁用直线：", this.disableLine)
      console.log("禁用矩形：", this.disableRect)
      console.log("禁用箭头：", this.disableArrow)
      console.log("禁用多边形：", this.disablePolygon)
    },
    undisabled() {
      this.disableLine = false
@@ -856,6 +854,7 @@
      width = typeof width !== "undefined" ? width : 1;
      // color = typeof color !== 'undefined' ? color : 'yellow'
      // 计算各角度和对应的P2,P3坐标
      debugger
      let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI;
      let angle1 = ((angle + theta) * Math.PI) / 180;
      let angle2 = ((angle - theta) * Math.PI) / 180;
@@ -1273,7 +1272,10 @@
      this.lineIndex = this.canvasData.line.length;
      this.rectIndex = this.canvasData.rect.length;
      this.arrowIndex = this.canvasData.arrow.length;
      this.polygonIndex = this.canvasData.polygon.length;
      //排除this.canvasData.polygon全部区域(全部区域的id就是摄像机的id)

      let filterPolygonArr = this.canvasData.polygon.filter(item=>item.id != this.TreeDataPool.selectedNode.id)
      this.polygonIndex = filterPolygonArr.length;
    },
    // 生成uuid
    getUuid() {