zhangzengfei
2023-08-30 b2d0ac2db80c08783fd848933230618cc30d76a2
src/components/subComponents/CardItem.vue
@@ -2,13 +2,13 @@
  <div class="box-card" ref="cardItem">
    <!-- 左侧图片区域 -->
    <!-- 比对模式 -->
    <div class="s-card-left-isCompare" v-if="showType === 'compare' ">
    <div class="s-card-left-isCompare" v-if="showType === 'compare'">
      <div class="card-img-box">
        <div class="card-img-box-compear">
          <div class="card-img-box-compear-left" ref="firstImg">
            <img
              :src="data.targetInfo[0].picSmUrl | httpImage"
              :id="'/compear/'+data.targetInfo[0].picSmUrl"
              :id="'/compear/' + data.targetInfo[0].picSmUrl"
              class="cursor-pointer"
              @click="detailsClick($event)"
            />
@@ -21,11 +21,7 @@
            :arrow="data.baseInfo.length > 1 ? 'always' : 'never'"
          >
            <el-carousel-item v-for="(item, index) in data.baseInfo" :key="index">
              <img
                :src="item.targetPicUrl | httpImage"
                class="cursor-pointer"
                @click="detailsClick($event)"
              />
              <img :src="item.targetPicUrl | httpImage" class="cursor-pointer" @click="detailsClick($event)" />
            </el-carousel-item>
          </el-carousel>
        </div>
@@ -58,7 +54,9 @@
        </el-carousel>
        <!-- 暂时认为只有人脸抓拍的报警, 首页显示小图, 其他时间均显示大图 -->
        <img
          v-else-if="data.targetInfo == null || data.targetInfo[0].targetType !== 'FaceDetect'"
          v-else-if="
            (data.targetInfo && data.targetInfo.length === 0) || data.targetInfo[0].targetType !== 'FaceDetect'
          "
          :src="data.picMaxUrl[0] | httpImage"
          class="cursor-pointer"
          @click="detailsClick($event)"
@@ -85,82 +83,97 @@
        @mouseleave="cardMouseleave($event)"
      >
        <p>
          <span class="fontStyle color222">{{ data.picDate | formatTime}}</span>
          <span class="fontStyle color222">{{ data.picDate | formatTime }}</span>
        </p>
        <p style="margin-bottom: 8px;">
        <p style="margin-bottom: 8px">
          <span class="fontStyle color222">{{ data.cameraAddr }}</span>
        </p>
        <el-tooltip placement="right" popper-class="atooltip">
          <div slot="content">
            <p v-for="(item,index) in data.alarmRules" :key="index+'rule'">
              <span>{{data.taskName}}</span>&nbsp;
              <span v-if="item.alarmLevel !== '撤防'">&nbsp;{{item.alarmLevel}}</span>&nbsp;
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'">
              <span>{{ data.taskName }}</span
              >&nbsp; <span v-if="item.alarmLevel !== '撤防'">&nbsp;{{ item.alarmLevel }}</span
              >&nbsp;
              <span v-if="item.linkInfo == '联动任务'">&nbsp;联动任务</span>
            </p>
          </div>
          <el-button
            style="line-height:17px;border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left"
            style="
              line-height: 17px;
              border: none;
              padding: 0;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
            "
          >
            <span
              v-for="(item,index) in data.alarmRules"
              :key="index+'rule1'"
              style="text-overflow:ellipsis;max-width:100px"
              v-for="(item, index) in data.alarmRules"
              :key="index + 'rule1'"
              style="text-overflow: ellipsis; max-width: 100px"
            >
              <span class="fontStyle color666">{{data.taskName}}</span>&nbsp;
              <span
                class="fontStyle color666"
                v-if="item.alarmLevel !== '撤防'"
              >&nbsp;{{item.alarmLevel}}</span>&nbsp;
              <span class="fontStyle color666">{{ data.taskName }}</span
              >&nbsp;
              <span class="fontStyle color666" v-if="item.alarmLevel !== '撤防'">&nbsp;{{ item.alarmLevel }}</span
              >&nbsp;
              <span class="fontStyle color666" v-if="item.linkInfo == '联动任务'">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </span>
          </el-button>
        </el-tooltip>
        <el-tooltip placement="right" popper-class="atooltip">
          <div slot="content">
            <p>
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].tableName"
              >{{ data.baseInfo[initialIndex].tableName }}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].targetName"
              >/&nbsp;{{ data.baseInfo[initialIndex].targetName }}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].labels"
              >/&nbsp;{{ data.baseInfo[initialIndex].labels | idCard}}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].monitorLevel"
              >/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span>
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName">{{
                data.baseInfo[initialIndex].tableName
              }}</span
              >&nbsp;
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].targetName"
                >/&nbsp;{{ data.baseInfo[initialIndex].targetName }}</span
              >&nbsp;
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].labels"
                >/&nbsp;{{ data.baseInfo[initialIndex].labels | idCard }}</span
              >&nbsp;
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel"
                >/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span
              >
            </p>
          </div>
          <el-button
            style="line-height:17px;border:none;padding:0;margin:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left"
            style="
              line-height: 17px;
              border: none;
              padding: 0;
              margin: 0;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
            "
          >
            <span
              :style="data.baseInfo[initialIndex].bwType === '1'
              ? 'color: red;font-size:12px;line-height:20px'
              : 'font-size:12px;line-height:20px'"
              :style="
                data.baseInfo[initialIndex].bwType === '1'
                  ? 'color: red;font-size:12px;line-height:20px'
                  : 'font-size:12px;line-height:20px'
              "
            >
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].tableName"
              >{{ data.baseInfo[initialIndex].tableName }}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].targetName"
              >/&nbsp;{{ data.baseInfo[initialIndex].targetName }}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].labels"
              >/&nbsp;{{ data.baseInfo[initialIndex].labels | idCard}}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].monitorLevel"
              >/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span>
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName">{{
                data.baseInfo[initialIndex].tableName
              }}</span
              >&nbsp;
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].targetName"
                >/&nbsp;{{ data.baseInfo[initialIndex].targetName }}</span
              >&nbsp;
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].labels"
                >/&nbsp;{{ data.baseInfo[initialIndex].labels | idCard }}</span
              >&nbsp;
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel"
                >/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span
              >
            </span>
          </el-button>
        </el-tooltip>
@@ -175,9 +188,9 @@
        <el-tooltip content="加入底库" placement="top" popper-class="atooltip">
          <i class="iconfont icontianjiaren" @click="toAdd(data)"></i>
        </el-tooltip>
        <el-tooltip content="收藏" placement="top" popper-class="atooltip">
        <!--  <el-tooltip content="收藏" placement="top" popper-class="atooltip">
          <i class="iconfont iconshoucang2"></i>
        </el-tooltip>
        </el-tooltip> -->
      </div>
    </div>
    <!-- 底库人员模式 -->
@@ -191,31 +204,38 @@
        <p
          :title="data.baseInfo[0].compareScore"
          class="score"
          style="font-family: PingFangSC-Medium;font-size: 20px;color: #3D68E1;letter-spacing: 0.4px;"
          style="
            font-family: PingFangSC-Medium;
            font-size: 20px;
            color: #3d68e1;
            letter-spacing: 0.4px;
          "
        >
          <span>{{ data.baseInfo[0].compareScore | percentage}}</span>
          <span>{{ data.baseInfo[0].compareScore | percentage }}</span>
        </p>
        <p
          :style="data.baseInfo[0].bwType == '0' ? 'font-size:12px;line-height:20px' : 'color:red;font-size:12px;line-height:20px'"
        >{{ data.baseInfo[0].tableName }}</p>
          :style="
            data.baseInfo[0].bwType == '0'
              ? 'font-size:12px;line-height:20px'
              : 'color:red;font-size:12px;line-height:20px'
          "
        >
          {{ data.baseInfo[0].tableName }}
        </p>
        <p :style="data.baseInfo[0].bwType == '0' ? '' : 'color:red'">
          <span>{{ data.baseInfo[0].targetName }}</span>&nbsp;&nbsp;
          <span
            v-if="data.baseInfo[0].labels"
          >/&nbsp;{{ data.baseInfo[0].labels | idCard}}</span>
          <span>{{ data.baseInfo[0].targetName }}</span
          >&nbsp;&nbsp;
          <span v-if="data.baseInfo[0].labels">/&nbsp;{{ data.baseInfo[0].labels | idCard }}</span>
        </p>
      </div>
      <div class="card-icon-box">
        <el-tooltip content="查找此人" placement="top" popper-class="atooltip" style="margin-left:10px">
        <el-tooltip content="查找此人" placement="top" popper-class="atooltip" style="margin-left: 10px">
          <i class="iconfont iconsousuoren" @click="tosearch(data)" title="查找此人"></i>
        </el-tooltip>
      </div>
    </div>
    <!-- 没有底库 16:9图片 最正常的yolo抓拍 无人值守  正常yolo抓拍没有小图-->
    <div
      v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''"
      class="s-card-right-signal"
    >
    <div v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''" class="s-card-right-signal">
      <div
        class="signal-img-dev"
        :style="overflowState ? 'overflow: hidden' : 'overflow: auto'"
@@ -225,32 +245,40 @@
        <p :title="data.picDate">
          <span class="fontStyle color222">{{ data.picDate | formatTime }}</span>
        </p>
        <p :title="data.cameraAddr" style="margin-bottom: 8px;">
        <p :title="data.cameraAddr" style="margin-bottom: 8px">
          <span class="fontStyle color222">{{ data.cameraAddr }}</span>
        </p>
        <el-tooltip placement="right" popper-class="atooltip">
          <div slot="content">
            <p v-for="(item,index) in data.alarmRules" :key="index+'rule'">
              <span>{{data.taskName}}</span>&nbsp;&nbsp;
              <span v-if="item.alarmLevel !== '撤防'">{{item.alarmLevel}}</span>&nbsp;
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'">
              <span>{{ data.taskName }}</span
              >&nbsp;&nbsp; <span v-if="item.alarmLevel !== '撤防'">{{ item.alarmLevel }}</span
              >&nbsp;
              <span v-if="item.linkInfo == '联动任务'">&nbsp;联动任务</span>
            </p>
          </div>
          <el-button
            style="border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left"
            style="
              border: none;
              padding: 0;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
            "
          >
            <span
              v-for="(item,index) in data.alarmRules"
              :key="index+'rule1'"
              style="text-overflow:ellipsis;max-width:100px"
              v-for="(item, index) in data.alarmRules"
              :key="index + 'rule1'"
              style="text-overflow: ellipsis; max-width: 100px"
            >
              <span class="fontStyle color666">{{data.taskName}}</span>&nbsp;&nbsp;
              <span
                class="fontStyle color666"
                v-if="item.alarmLevel !== '撤防'"
              >{{item.alarmLevel}}</span>&nbsp;
              <span class="fontStyle color666">{{ data.taskName }}</span
              >&nbsp;&nbsp;
              <span class="fontStyle color666" v-if="item.alarmLevel !== '撤防'">{{ item.alarmLevel }}</span
              >&nbsp;
              <span class="fontStyle color666" v-if="item.linkInfo == '联动任务'">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </span>
          </el-button>
        </el-tooltip>
@@ -262,16 +290,13 @@
            <i class="iconfont iconsousuoren ml50" @click="tosearch(data)"></i>
          </el-tooltip>
        </div>
        <div
          v-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''"
          class="card-icon-box"
        >
        <div v-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''" class="card-icon-box">
          <el-tooltip content="详情" placement="top" popper-class="atooltip">
            <i class="iconfont iconcaidan" @click="detailsClick($event)"></i>
          </el-tooltip>
          <el-tooltip content="收藏" placement="top" popper-class="atooltip">
          <!-- <el-tooltip content="收藏" placement="top" popper-class="atooltip">
            <i class="iconfont iconshoucang2" @click="dialogVisible = true"></i>
          </el-tooltip>
          </el-tooltip> -->
          <!-- :class="
              data.isAlarm ? 'iconfont systemmm' : 'iconfont systemxing'
          "-->
@@ -286,18 +311,15 @@
          <el-tooltip content="加入底库" placement="top" popper-class="atooltip">
            <i class="iconfont icontianjiaren" @click="toAdd(data)"></i>
          </el-tooltip>
          <el-tooltip content="收藏" placement="top" popper-class="atooltip">
          <!--  <el-tooltip content="收藏" placement="top" popper-class="atooltip">
            <i class="iconfont iconshoucang2" @click="dialogVisible = true"></i>
          </el-tooltip>
          </el-tooltip> -->
        </div>
      </div>
    </div>
    <!-- 没有底库,非比对,普通模式 一定有targetInfo,并且targetInfo个数为1-->
    <div
      v-else-if="data.targetInfo !== null && data.targetInfo[0].picSmUrl !== ''"
      class="s-card-right-signal"
    >
    <div v-else-if="data.targetInfo !== null && data.targetInfo[0].picSmUrl !== ''" class="s-card-right-signal">
      <div
        class="signal-img-dev"
        :style="overflowState ? 'overflow: hidden' : 'overflow: auto'"
@@ -307,94 +329,112 @@
        <p
          class="score"
          v-if="VideoPhotoData.uploadType"
          style="font-family: PingFangSC-Medium;font-size: 20px;color: #3D68E1;letter-spacing: 0.4px;"
          style="
            font-family: PingFangSC-Medium;
            font-size: 20px;
            color: #3d68e1;
            letter-spacing: 0.4px;
          "
        >
          <span v-if="data.id">{{ data.compareScore | percentage}}</span>
          <span v-else>{{ data.baseInfo[0].compareScore | percentage}}</span>
          <span v-if="data.id">{{ data.compareScore | percentage }}</span>
          <span v-else>{{ data.baseInfo[0].compareScore | percentage }}</span>
        </p>
        <p :title="data.picDate">
          <span class="fontStyle color222">{{ data.picDate | formatTime }}</span>
        </p>
        <p :title="data.cameraAddr" style="margin-bottom: 8px;">
        <p :title="data.cameraAddr" style="margin-bottom: 8px">
          <span class="fontStyle color222">{{ data.cameraAddr }}</span>
        </p>
        <el-tooltip placement="right" popper-class="atooltip" v-if="!VideoPhotoData.uploadType">
          <div slot="content">
            <p v-for="(item,index) in data.alarmRules" :key="index+'rule2'">
              <span class="fontStyle">{{data.taskName}}</span>&nbsp;&nbsp;
              <span
                class="fontStyle"
                v-if="item.alarmLevel !== '撤防'"
              >{{item.alarmLevel}}</span>&nbsp;
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule2'">
              <span class="fontStyle">{{ data.taskName }}</span
              >&nbsp;&nbsp; <span class="fontStyle" v-if="item.alarmLevel !== '撤防'">{{ item.alarmLevel }}</span
              >&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </p>
          </div>
          <el-button
            style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left"
            style="
              border: none;
              padding: 0;
              margin: 0px;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
            "
          >
            <span v-for="(item,index) in data.alarmRules" :key="index+'rule3'">
              <span class="fontStyle color666">{{data.taskName}}</span>&nbsp;&nbsp;
              <span
                class="fontStyle color666"
                v-if="item.alarmLevel !== '撤防'"
              >{{item.alarmLevel}}</span>&nbsp;
            <span v-for="(item, index) in data.alarmRules" :key="index + 'rule3'">
              <span class="fontStyle color666">{{ data.taskName }}</span
              >&nbsp;&nbsp;
              <span class="fontStyle color666" v-if="item.alarmLevel !== '撤防'">{{ item.alarmLevel }}</span
              >&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle color666">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </span>
          </el-button>
        </el-tooltip>
        <!-- <p>
          <span class="fontStyle color666">{{ data.sex }}</span>&nbsp;/&nbsp;<span class="fontStyle color666">{{ data.ageDescription }}</span>&nbsp;/&nbsp;<span class="fontStyle color666">{{ data.race }}</span>
        </p>-->
        <el-tooltip
          placement="right"
          popper-class="atooltip"
          v-if="data.baseInfo && data.baseInfo[0].targetName != ''"
        >
        <el-tooltip placement="right" popper-class="atooltip" v-if="data.baseInfo && data.baseInfo[0].targetName != ''">
          <div slot="content">
            <p v-for="(item,index) in data.baseInfo" :key="index+'base1'">
              <span class="fontStyle">{{item.tableName}}</span>&nbsp;
              <span class="fontStyle" v-if="item.targetName.length">/&nbsp;{{item.targetName}}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="item.labels.length"
              >/&nbsp;{{item.labels | idCard}}</span>&nbsp;
              <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{item.labels | sex}}</span>
            <p v-for="(item, index) in data.baseInfo" :key="index + 'base1'">
              <span class="fontStyle">{{ item.tableName }}</span
              >&nbsp; <span class="fontStyle" v-if="item.targetName.length">/&nbsp;{{ item.targetName }}</span
              >&nbsp; <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{ item.labels | idCard }}</span
              >&nbsp;
              <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{ item.labels | sex }}</span>
            </p>
          </div>
          <el-button
            style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left"
            style="
              border: none;
              padding: 0;
              margin: 0px;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
            "
          >
            <span
              v-for="(item,index) in data.baseInfo"
              :key="index+'base'"
              :style="item.bwType == '1' ? 'color:red;font-size:12px;line-height:20px':'font-size:12px;line-height:20px'"
              v-for="(item, index) in data.baseInfo"
              :key="index + 'base'"
              :style="
                item.bwType == '1' ? 'color:red;font-size:12px;line-height:20px' : 'font-size:12px;line-height:20px'
              "
            >
              <span class="fontStyle">{{item.tableName}}</span>&nbsp;
              <span class="fontStyle" v-if="item.targetName.length">/&nbsp;{{item.targetName}}</span>&nbsp;
              <span
                class="fontStyle"
                v-if="item.labels.length"
              >/&nbsp;{{item.labels | idCard}}</span>&nbsp;
              <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{item.labels |sex }}</span>
              <span class="fontStyle">{{ item.tableName }}</span
              >&nbsp; <span class="fontStyle" v-if="item.targetName.length">/&nbsp;{{ item.targetName }}</span
              >&nbsp; <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{ item.labels | idCard }}</span
              >&nbsp;
              <span class="fontStyle" v-if="item.labels.length">/&nbsp;{{ item.labels | sex }}</span>
            </span>
          </el-button>
        </el-tooltip>
        <el-tooltip
          placement="right"
          popper-class="atooltip"
          v-if="data.baseInfo == null"
          style="margin-top:5px"
        >
        <el-tooltip placement="right" popper-class="atooltip" v-if="data.baseInfo == null" style="margin-top: 5px">
          <div slot="content">
            <span :style="'color:red;font-size:14px;line-height:20px'">{{data.showLabels}}</span>
            <span :style="'color:red;font-size:14px;line-height:20px'">{{ data.showLabels }}</span>
          </div>
          <el-button
            style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left"
            style="
              border: none;
              padding: 0;
              margin: 0px;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
            "
          >
            <span :style=" 'color:red;font-size:14px;line-height:20px'">{{data.showLabels}}</span>
            <span :style="'color:red;font-size:14px;line-height:20px'">{{ data.showLabels }}</span>
          </el-button>
        </el-tooltip>
      </div>
@@ -411,9 +451,9 @@
          <el-tooltip content="详情" placement="top" popper-class="atooltip">
            <i class="iconfont iconcaidan" @click="detailsClick($event)"></i>
          </el-tooltip>
          <el-tooltip content="收藏" placement="top" popper-class="atooltip">
          <!--   <el-tooltip content="收藏" placement="top" popper-class="atooltip">
            <i class="iconfont iconshoucang2"></i>
          </el-tooltip>
          </el-tooltip> -->
          <!-- :class="
              data.isAlarm ? 'iconfont systemmm' : 'iconfont systemxing'
          "-->
@@ -439,9 +479,9 @@
          >
            <i class="iconfont icontianjiaren" @click="toAdd(data)"></i>
          </el-tooltip>
          <el-tooltip content="收藏" placement="top" popper-class="atooltip">
          <!-- <el-tooltip content="收藏" placement="top" popper-class="atooltip">
            <i class="iconfont iconshoucang2"></i>
          </el-tooltip>
          </el-tooltip> -->
        </div>
      </div>
    </div>
@@ -458,14 +498,15 @@
            <p :title="data.picDate">
              <span class="fontStyle color222">{{ data.picDate | formatTime }}</span>
            </p>
            <p :title="data.cameraAddr" style="margin-bottom: 8px;">
            <p :title="data.cameraAddr" style="margin-bottom: 8px">
              <span class="fontStyle color222">{{ data.cameraAddr }}</span>
            </p>
            <p v-for="(item,index) in data.alarmRules" :key="index+'rule'">
              <span class="fontStyle color666">{{data.taskName}}</span>&nbsp;/&nbsp;
              <span class="fontStyle color666">{{item.alarmLevel}}</span>&nbsp;/&nbsp;
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'">
              <span class="fontStyle color666">{{ data.taskName }}</span
              >&nbsp;/&nbsp; <span class="fontStyle color666">{{ item.alarmLevel }}</span
              >&nbsp;/&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle color666">联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </p>
          </div>
        </div>
@@ -475,20 +516,21 @@
</template>
<script>
Date.prototype.Format = function (fmt) {
Date.prototype.Format = function(fmt) {
  var o = {
    "M+": this.getMonth() + 1, //月份
    "d+": this.getDate(), //日
    "H+": this.getHours(), //小时
    "m+": this.getMinutes(), //分
    "s+": this.getSeconds(), //秒
    "q+": Math.floor((this.getMonth() + 3) / 3), //季度
    "S": this.getMilliseconds() //毫秒
  };
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    "M+": this.getMonth() + 1, //月份
    "d+": this.getDate(), //日
    "H+": this.getHours(), //小时
    "m+": this.getMinutes(), //分
    "s+": this.getSeconds(), //秒
    "q+": Math.floor((this.getMonth() + 3) / 3), //季度
    S: this.getMilliseconds() //毫秒
  }
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length))
  for (var k in o)
    if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  return fmt;
    if (new RegExp("(" + k + ")").test(fmt))
      fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length))
  return fmt
}
export default {
@@ -543,7 +585,7 @@
      if (!url.length) {
        return ""
      }
      return '/httpImage/' + url + ((url.indexOf("?") >= 0) ? '&' : '?') + 'width=160'
      return "/httpImage/" + url + (url.indexOf("?") >= 0 ? "&" : "?") + "width=160"
    }
  },
  data() {
@@ -553,7 +595,7 @@
      carouselIndex: 0,
      dialogVisible: false,
      overflowState: true
    };
    }
  },
  watch: {
    data: {
@@ -569,9 +611,9 @@
        let imgDom = this.$refs.firstImg
        if (imgDom) {
          let num = (imgDom.offsetHeight - imgDom.offsetWidth) / 2
          return `${num}px`;
          return `${num}px`
        }
        return `4px`;
        return `4px`
      })
    },
    getUrl(bwtype) {
@@ -582,22 +624,22 @@
      }
    },
    changeInitialIndex(index) {
      this.initialIndex = index;
      this.initialIndex = index
    },
    cardMouseenter(ev) {
      this.overflowState = false;
      this.overflowState = false
    },
    cardMouseleave(ev) {
      this.overflowState = true;
      this.overflowState = true
    },
    changeCarousel(index) {
      this.carouselIndex = index;
      this.carouselIndex = index
    },
    detailsClick(ev) {
      this.$emit("detailsClick", ev);
      this.$emit("detailsClick", ev)
    },
    toAdd(item) {
      this.$emit("addToBase", item);
      this.$emit("addToBase", item)
    },
    tosearch(item) {
      this.searchT
@@ -609,18 +651,49 @@
      }
      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];
        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];
        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
      }, "*")
      window.parent.postMessage(
        {
          msg: message
        },
        "*"
      )
    }
  }
};
}
</script>
<style lang="scss">
.cursor-pointer {
  cursor: pointer;
}
.fontStyle {
  font-family: PingFangSC-Medium;
}