ZZJ
2021-11-09 ccee429d379e0108b7445f72ade8d97c110a6fb3
src/components/subComponents/CardItem.vue
@@ -56,8 +56,9 @@
            <img :src="item | httpImage" class="cursor-pointer" @click="detailsClick($event)" />
          </el-carousel-item>
        </el-carousel>
        <!-- 暂时认为只有人脸抓拍的报警, 首页显示小图, 其他时间均显示大图 -->
        <img
          v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''"
          v-else-if="data.targetInfo == null || data.targetInfo[0].targetType !== 'FaceDetect'"
          :src="data.picMaxUrl[0] | httpImage"
          class="cursor-pointer"
          @click="detailsClick($event)"
@@ -70,9 +71,10 @@
        />
      </div>
      <div class="s-card-left-box" v-else>
        <img :src="data.baseInfo[0] | httpImage" class="cursor-pointer" />
        <img :src="data.baseInfo[0].targetPicUrl | httpImage" class="cursor-pointer" />
      </div>
    </div>
    <!-- 右侧文字区域 -->
    <!-- 多张底图切换 -->
    <div class="s-card-right-isCompare" v-if="showType == 'compare'">
@@ -293,7 +295,7 @@
    <!-- 没有底库,非比对,普通模式 一定有targetInfo,并且targetInfo个数为1-->
    <div
      v-else-if="data.targetInfo !== null && data.targetInfo[0].picSmUrl !== '' && data.targetInfo.length == 1"
      v-else-if="data.targetInfo !== null && data.targetInfo[0].picSmUrl !== ''"
      class="s-card-right-signal"
    >
      <div
@@ -490,9 +492,9 @@
}
export default {
  mounted () {
  mounted() {
    //window.addEventListener("resize", this.watchWindow);
    window.addEventListener("resize",this.getBottom)
    window.addEventListener("resize", this.getBottom)
  },
  props: {
    data: {
@@ -502,21 +504,26 @@
    showType: {
      type: String,
      default: "search"
    }
    },
    fromCluster: {
      type: Boolean,
      default: false
    },
    searchT: {}
  },
  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 +531,7 @@
        return v.split("/")[1]
      }
    },
    sex (v) {
    sex(v) {
      try {
        let obj = JSON.parse(v)
        return obj.sex
@@ -532,11 +539,14 @@
        return v.split("/")[0]
      }
    },
    httpImage (url) {
    httpImage(url) {
      if (!url.length) {
        return ""
      }
      return '/httpImage/' + url + ((url.indexOf("?") >= 0) ? '&' : '?') + 'width=160'
    }
  },
  data () {
  data() {
    return {
      tempShowType: true,
      initialIndex: 0,
@@ -547,14 +557,14 @@
  },
  watch: {
    data: {
      handler (val, oldVal) {
      handler(val, oldVal) {
        this.$forceUpdate()
      },
      deep: true
    }
  },
  methods: {
    getBottom () {
    getBottom() {
      this.$nextTick(() => {
        let imgDom = this.$refs.firstImg
        if (imgDom) {
@@ -564,41 +574,45 @@
        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) {
      this.searchT
      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
      if (!item.id || item.id == "") {
        compType = 0 // 数据来自于底库
      }
      let message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType + '&timestamp=' + new Date().getTime();
      //let message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType;
      let message
      if (this.fromCluster) {
        message = 'toCluster?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType + '&timestamp=' + new Date().getTime() + '&start=' + this.searchT[0] + '&end=' + this.searchT[1];
      } else {
        message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType + '&timestamp=' + new Date().getTime() + '&start=' + this.searchT[0] + '&end=' + this.searchT[1];
      }
      window.parent.postMessage({
        msg: message
      }, "*")
@@ -611,18 +625,17 @@
  font-family: PingFangSC-Medium;
}
.color222 {
  font-size: 0.75rem;
  font-size: 12px;
  font-weight: 600;
  line-height: 1rem;
  line-height: 14px;
  color: #222222;
}
.color666 {
  color: #666666;
  font-size: 0.75rem;
  line-height: 1.25rem;
  font-size: 12px;
  line-height: 16px;
}
.box-card {
  cursor: default;
  .el-carousel__arrow {
    height: 20px;
@@ -644,8 +657,8 @@
      width: 100%;
      position: relative;
      overflow: hidden;
          top: 50%;
    transform: translateY(-50%);
      top: 50%;
      transform: translateY(-50%);
      .card-img-box-compear {
        width: 100%;
        display: flex;
@@ -658,10 +671,10 @@
          flex: 1;
          height: 100%;
        }
        .el-carousel{
        .el-carousel {
          flex: 1;
          width: auto;
          height: auto!important;
          height: auto !important;
        }
        .el-carousel__item {
          display: flex;