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

hanbaoshan

2020-12-04 46183ba8c63b38ea3671e7923edc7ec2fd34a6c3

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

 src/components/canvas/Dialog.vue

@@ -394,6 +394,7 @@
    },
    // 删除元素
    del() {
      debugger
      let delEle = {};
      switch (this.delCursor.type) {
        case "1":
@@ -537,7 +538,6 @@
          _this.type = "0";
          _this.delCursor.type = "2";
          _this.delCursor.index = i;
          debugger
          _this.delCursor.remarksName = v.name;
          _this.delCursor.id = v.id;
          // console.log("当前选中元素：",_this.delCursor)
@@ -854,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;

 src/components/subComponents/CardItem.vue

@@ -31,9 +31,8 @@
        </div>
        <div
          class="s-card-left-isCompare-div compareScore111"
          style
          :style="{
            bottom: getBottom(),
            bottom: '0',
            background: getUrl(data.baseInfo[initialIndex].bwType)
          }"
        >
@@ -491,8 +490,9 @@
}

export default {
  mounted() {
    window.addEventListener("resize", this.watchWindow);
  mounted () {
    //window.addEventListener("resize", this.watchWindow);
    window.addEventListener("resize",this.getBottom)
  },
  props: {
    data: {
@@ -505,18 +505,18 @@
    }
  },
  computed: {
    isId() {
    isId () {
      return this.data.id
    }
  },
  filters: {
    formatTime(t) {
    formatTime (t) {
      return new Date(t).Format("yyyy-MM-dd HH:mm:ss")
    },
    percentage(score) {
    percentage (score) {
      return score.toFixed(2) + "%"
    },
    idCard(v) {
    idCard (v) {
      try {
        let obj = JSON.parse(v)
        return obj.idCard
@@ -524,7 +524,7 @@
        return v.split("/")[1]
      }
    },
    sex(v) {
    sex (v) {
      try {
        let obj = JSON.parse(v)
        return obj.sex
@@ -532,11 +532,11 @@
        return v.split("/")[0]
      }
    },
    httpImage(url) {
    httpImage (url) {
      return '/httpImage/' + url + ((url.indexOf("?") >= 0) ? '&' : '?') + 'width=160'
    }
  },
  data() {
  data () {
    return {
      tempShowType: true,
      initialIndex: 0,
@@ -547,48 +547,49 @@
  },
  watch: {
    data: {
      handler(val, oldVal) {
      handler (val, oldVal) {
        this.$forceUpdate()
      },
      deep: true
    }
  },
  methods: {
    getBottom() {
      // let imgDom = document.getElementById(str)
      let imgDom = this.$refs.firstImg
      if (imgDom) {
        let num = (imgDom.offsetHeight - imgDom.offsetWidth) / 2
        return `${num}px`;
      }
      return `4px`;
    getBottom () {
      this.$nextTick(() => {
        let imgDom = this.$refs.firstImg
        if (imgDom) {
          let num = (imgDom.offsetHeight - imgDom.offsetWidth) / 2
          return `${num}px`;
        }
        return `4px`;
      })
    },
    getUrl(bwtype) {
    getUrl (bwtype) {
      if (bwtype == 1) {
        return `url(${require("@/assets/img/red.png")})`
      } else {
        return `url(${require("@/assets/img/green.png")})`
      }
    },
    changeInitialIndex(index) {
    changeInitialIndex (index) {
      this.initialIndex = index;
    },
    cardMouseenter(ev) {
    cardMouseenter (ev) {
      this.overflowState = false;
    },
    cardMouseleave(ev) {
    cardMouseleave (ev) {
      this.overflowState = true;
    },
    changeCarousel(index) {
    changeCarousel (index) {
      this.carouselIndex = index;
    },
    detailsClick(ev) {
    detailsClick (ev) {
      this.$emit("detailsClick", ev);
    },
    toAdd(item) {
    toAdd (item) {
      this.$emit("addToBase", item);
    },
    tosearch(item) {
    tosearch (item) {
      let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id
      let imgUrl = item.targetInfo ? item.targetInfo[0].picSmUrl : item.baseInfo[0].targetPicUrl
      let compType = 1 //  数据来自于es
@@ -621,6 +622,7 @@
  line-height: 1.25rem;
}
.box-card {

  cursor: default;
  .el-carousel__arrow {
    height: 20px;
@@ -640,11 +642,11 @@
    .card-img-box {
      box-sizing: border-box;
      width: 100%;
      height: 100%;
      position: relative;
      overflow: hidden;
          top: 50%;
    transform: translateY(-50%);
      .card-img-box-compear {
        height: 100%;
        width: 100%;
        display: flex;
        .card-img-box-compear-left {
@@ -653,8 +655,13 @@
          justify-content: center;
          align-items: Center;
          overflow: hidden;
          width: 100%;
          flex: 1;
          height: 100%;
        }
        .el-carousel{
          flex: 1;
          width: auto;
          height: auto!important;
        }
        .el-carousel__item {
          display: flex;
@@ -692,9 +699,10 @@
      }
    }
    img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: contain;
      //height: 100%;
      //object-fit: contain;
    }
    .s-card-left-isCompare-div {
      width: 60px;