zhangzengfei
2022-07-20 4a800a8fc83c6bd1f86a8e847b079a51a7532c09
src/pages/visual/components/subComponents/CardItem2.vue
@@ -7,8 +7,8 @@
        <div class="card-img-box-compear">
          <div class="card-img-box-compear-left" ref="firstImg">
            <img
              :src="'/httpImage/'+data.targetInfo[0].picSmUrl"
              :id="'/compear/'+data.targetInfo[0].picSmUrl"
              :src="'/httpImage/' + data.targetInfo[0].picSmUrl"
              :id="'/compear/' + data.targetInfo[0].picSmUrl"
              class="cursor-pointer"
              @click="detailsClick($event)"
            />
@@ -20,9 +20,12 @@
            indicator-position="none"
            :arrow="data.baseInfo.length > 1 ? 'always' : 'never'"
          >
            <el-carousel-item v-for="(item, index) in data.baseInfo" :key="index">
            <el-carousel-item
              v-for="(item, index) in data.baseInfo"
              :key="index"
            >
              <img
                :src="'/httpImage/'+item.targetPicUrl"
                :src="'/httpImage/' + item.targetPicUrl"
                class="cursor-pointer"
                @click="detailsClick($event)"
              />
@@ -34,7 +37,7 @@
          style
          :style="{
            bottom: getBottom(),
            background: getUrl(data.baseInfo[initialIndex].bwType)
            background: getUrl(data.baseInfo[initialIndex].bwType),
          }"
        >
          <b>{{ `${data.baseInfo[initialIndex].compareScore}%` }}</b>
@@ -43,7 +46,10 @@
    </div>
    <!-- 普通模式 -->
    <div v-else class="s-card-left">
      <div class="s-card-left-box" v-if="data.targetInfo == null || data.targetInfo.length > 0">
      <div
        class="s-card-left-box"
        v-if="data.targetInfo == null || data.targetInfo.length > 0"
      >
        <el-carousel
          trigger="click"
          height="100%"
@@ -52,75 +58,165 @@
          :autoplay="false"
          @change="changeCarousel"
        >
          <el-carousel-item v-for="(item, index) in data.picMaxUrl" :key="index + 'img'">
            <img :src="'/httpImage/'+item" class="cursor-pointer" @click="detailsClick($event)" />
          <el-carousel-item
            v-for="(item, index) in data.picMaxUrl"
            :key="index + 'img'"
          >
            <img
              :src="'/httpImage/' + item"
              class="cursor-pointer"
              @click="detailsClick($event)"
            />
          </el-carousel-item>
        </el-carousel>
        <img
          v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == '' || !data.targetInfo[0].picSmUrl"
          :src="'/httpImage/'+data.picMaxUrl[0]"
          v-else-if="
            data.targetInfo == null ||
            data.targetInfo[0].picSmUrl == '' ||
            !data.targetInfo[0].picSmUrl
          "
          :src="'/httpImage/' + data.picMaxUrl[0]"
          class="cursor-pointer"
          @click="detailsClick($event)"
        />
        <img
          v-else
          :src="'/httpImage/'+data.targetInfo[0].picSmUrl"
          :src="'/httpImage/' + data.targetInfo[0].picSmUrl"
          class="cursor-pointer"
          @click="detailsClick($event)"
        />
      </div>
      <div class="s-card-left-box" v-else>
        <img
          :src="'/httpImage/'+data.baseInfo[0].targetPicUrl"
          :src="'/httpImage/' + data.baseInfo[0].targetPicUrl"
          class="cursor-pointer"
          @click="detailsClick($event)"
        />
      </div>
    </div>
    <!-- 右侧文字区域 -->
      <!-- 多张底图切换 -->
    <!-- 多张底图切换 -->
    <div class="s-card-right-isCompare" v-if="showType == 'compare'">
      <div
        class="person"
        class="person"
        :style="overflowState ? 'overflow: hidden' : 'overflow: auto'"
        @mouseenter="cardMouseenter($event)"
        @mouseleave="cardMouseleave($event)"
      >
        <p :title="data.baseInfo[0].compareScore" class="score" v-if="showType == 'findByPic'">
        <p
          :title="data.baseInfo[0].compareScore"
          class="score"
          v-if="showType == 'findByPic'"
        >
          <span v-if="data.id">{{ data.compareScore }}%</span>
          <span v-else>{{ data.baseInfo[0].compareScore }}%</span>
        </p>
        <p :title="data.picDate">
          <span class="fontStyle color222">{{ data.picDate }}</span>
        </p>
        <p :title="data.cameraAddr" style="margin-bottom: 0.5rem;">
        <p :title="data.cameraAddr" style="margin-bottom: 0.5rem">
          <span class="fontStyle color222">{{ data.cameraAddr }}</span>
        </p>
        <el-tooltip placement="right">
          <div slot="content">
            <p v-for="(item,index) in data.alarmRules" :key="index+'rule'">
              <span >{{data.taskName}}</span>&nbsp;<span  v-if="item.alarmLevel !== '撤防'" :style="item.defenceState ? 'color:red':''">&nbsp;{{item.alarmLevel}}</span>&nbsp;<span v-if="item.isLink">&nbsp;联动任务</span>
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'">
              <span>{{ data.taskName }}</span
              >&nbsp;<span
                v-if="item.alarmLevel !== '撤防'"
                :style="item.defenceState ? 'color:red' : ''"
                >&nbsp;{{ item.alarmLevel }}</span
              >&nbsp;<span v-if="item.isLink">&nbsp;联动任务</span>
            </p>
          </div>
          <el-button style="line-height:1.0625rem;border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:7.5rem;text-align:left">
            <span v-for="(item,index) in data.alarmRules" :key="index+'rule1'" style="text-overflow:ellipsis;max-width:6.25rem">
              <span class="fontStyle color666">{{data.taskName}}</span>&nbsp;<span class="fontStyle color666" v-if="item.alarmLevel !== '撤防'" :style="item.defenceState ? 'color:red':''">&nbsp;{{item.alarmLevel}}</span>&nbsp;<span class="fontStyle color666" v-if="item.isLink">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
          <el-button
            style="
              line-height: 1.0625rem;
              border: none;
              padding: 0;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 7.5rem;
              text-align: left;
            "
          >
            <span
              v-for="(item, index) in data.alarmRules"
              :key="index + 'rule1'"
              style="text-overflow: ellipsis; max-width: 6.25rem"
            >
              <span class="fontStyle color666">{{ data.taskName }}</span
              >&nbsp;<span
                class="fontStyle color666"
                v-if="item.alarmLevel !== '撤防'"
                :style="item.defenceState ? 'color:red' : ''"
                >&nbsp;{{ item.alarmLevel }}</span
              >&nbsp;<span class="fontStyle color666" v-if="item.isLink"
                >&nbsp;联动任务</span
              >
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </span>
          </el-button>
        </el-tooltip>
        <el-tooltip placement="right">
          <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].personName">/&nbsp;{{ data.baseInfo[initialIndex].personName }}</span>&nbsp;<span class="fontStyle" v-if="data.baseInfo[initialIndex].sex">/&nbsp;{{ data.baseInfo[initialIndex].sex }}</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].personName"
                >/&nbsp;{{ data.baseInfo[initialIndex].personName }}</span
              >&nbsp;<span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].sex"
                >/&nbsp;{{ data.baseInfo[initialIndex].sex }}</span
              >&nbsp;<span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].monitorLevel"
                >/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span
              >
            </p>
          </div>
          <el-button style="line-height:1.0625rem;border:none;padding:0;margin:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:7.5rem;text-align:left">
          <el-button
            style="
              line-height: 1.0625rem;
              border: none;
              padding: 0;
              margin: 0;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 7.5rem;
              text-align: left;
            "
          >
            <span
            :style="data.baseInfo[initialIndex].bwType === '1'
              ? 'color: red;font-size:0.75rem;line-height:1.25rem'
              : 'font-size:0.75rem;line-height:1.25rem'">
              <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName">{{ data.baseInfo[initialIndex].tableName }}</span>&nbsp;<span class="fontStyle" v-if="data.baseInfo[initialIndex].personName">/&nbsp;{{ data.baseInfo[initialIndex].personName }}</span>&nbsp;<span class="fontStyle" v-if="data.baseInfo[initialIndex].sex">/&nbsp;{{ data.baseInfo[initialIndex].sex }}</span>&nbsp;<span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel">/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span>
              :style="
                data.baseInfo[initialIndex].bwType === '1'
                  ? 'color: red;font-size:0.75rem;line-height:1.25rem'
                  : 'font-size:0.75rem;line-height:1.25rem'
              "
            >
              <span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].tableName"
                >{{ data.baseInfo[initialIndex].tableName }}</span
              >&nbsp;<span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].personName"
                >/&nbsp;{{ data.baseInfo[initialIndex].personName }}</span
              >&nbsp;<span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].sex"
                >/&nbsp;{{ data.baseInfo[initialIndex].sex }}</span
              >&nbsp;<span
                class="fontStyle"
                v-if="data.baseInfo[initialIndex].monitorLevel"
                >/&nbsp;{{ data.baseInfo[initialIndex].monitorLevel }}</span
              >
            </span>
          </el-button>
        </el-tooltip>
@@ -129,10 +225,20 @@
        <el-tooltip class="item" effect="dark" content="详情" placement="top">
          <i class="fontFamily systemmulu" @click="detailsClick($event)"></i>
        </el-tooltip>
        <el-tooltip class="item" effect="dark" content="查找此人" placement="top">
        <el-tooltip
          class="item"
          effect="dark"
          content="查找此人"
          placement="top"
        >
          <i class="fontFamily system1"></i>
        </el-tooltip>
        <el-tooltip class="item" effect="dark" content="加入地库" placement="top">
        <el-tooltip
          class="item"
          effect="dark"
          content="加入地库"
          placement="top"
        >
          <i class="fontFamily systemyonghutianjia"></i>
        </el-tooltip>
        <el-tooltip class="item" effect="dark" content="收藏" placement="top">
@@ -148,24 +254,55 @@
        @mouseenter="cardMouseenter($event)"
        @mouseleave="cardMouseleave($event)"
      >
        <p :title="data.baseInfo[0].compareScore" class="score" style="font-family: PingFangSC-Medium;font-size: 1.25rem;color: #F53D3D;letter-spacing: 0.4px;">
          <span >{{ data.baseInfo[0].compareScore }}%</span>
        <p
          :title="data.baseInfo[0].compareScore"
          class="score"
          style="
            font-family: PingFangSC-Medium;
            font-size: 1.25rem;
            color: #f53d3d;
            letter-spacing: 0.4px;
          "
        >
          <span>{{ data.baseInfo[0].compareScore }}%</span>
        </p>
        <p :style="data.baseInfo[0].bwType == '0' ? 'font-size:0.75rem;line-height:1.25rem' : 'color:red;font-size:0.75rem;line-height:1.25rem'">
        <p
          :style="
            data.baseInfo[0].bwType == '0'
              ? 'font-size:0.75rem;line-height:1.25rem'
              : 'color:red;font-size:0.75rem;line-height:1.25rem'
          "
        >
          {{ data.baseInfo[0].tableName }}
        </p>
        <p :style="data.baseInfo[0].bwType == '0' ? '' : 'color:red'">
          <span>{{ data.baseInfo[0].personName }}</span>&nbsp;&nbsp;<span v-if="data.baseInfo[0].sex">/&nbsp;{{ data.baseInfo[0].sex }}</span>
          <span>{{ data.baseInfo[0].personName }}</span
          >&nbsp;&nbsp;<span v-if="data.baseInfo[0].sex"
            >/&nbsp;{{ data.baseInfo[0].sex }}</span
          >
        </p>
      </div>
      <div class="card-icon-box">
          <el-tooltip class="item" effect="dark" content="查找此人" placement="top" style="margin-left:0.625rem">
            <i class="fontFamily system1" @click="tosearch(data)" title="查找此人"></i>
          </el-tooltip>
        </div>
        <el-tooltip
          class="item"
          effect="dark"
          content="查找此人"
          placement="top"
          style="margin-left: 0.625rem"
        >
          <i
            class="fontFamily system1"
            @click="tosearch(data)"
            title="查找此人"
          ></i>
        </el-tooltip>
      </div>
    </div>
    <!-- 没有底图 16:9图片 -->
    <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'"
@@ -175,44 +312,69 @@
        <p :title="data.picDate">
          <span class="fontStyle color222">{{ data.picDate }}</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;
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'">
              <span>{{ data.taskName }}</span
              >&nbsp;&nbsp;
              <span
                v-if="item.alarmLevel !== '撤防'"
                :style="item.defenceState ? 'color:red':''"
              >{{item.alarmLevel}}</span>&nbsp;
                :style="item.defenceState ? 'color:red' : ''"
                >{{ 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;background:#0D1A45"
            style="
              border: none;
              padding: 0;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
              background: #0d1a45;
            "
          >
            <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">{{ data.taskName }}</span
              >&nbsp;&nbsp;
              <span
                class="fontStyle color666"
                v-if="item.alarmLevel !== '撤防'"
                :style="item.defenceState ? 'color:red':''"
              >{{item.alarmLevel}}</span>&nbsp;
              <span class="fontStyle color666" v-if="item.linkInfo == '联动任务'">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
                :style="item.defenceState ? 'color:red' : ''"
                >{{ 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>
          </el-button>
        </el-tooltip>
      </div>
    </div>
    <!-- 没有底库,非比对,普通模式 -->
        <div v-else-if="data.targetInfo && data.targetInfo !== null && data.targetInfo[0].picSmUrl !== '' && data.targetInfo.length <= 1" class="s-card-right-signal">
    <div
      v-else-if="
        data.targetInfo &&
        data.targetInfo !== null &&
        data.targetInfo[0].picSmUrl !== '' &&
        data.targetInfo.length <= 1
      "
      class="s-card-right-signal"
    >
      <div
        class="signal-img-dev"
        :style="overflowState ? 'overflow: hidden' : 'overflow: auto'"
@@ -222,7 +384,12 @@
        <p
          class="score"
          v-if="showType == 'findByPic'"
          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 }}%</span>
          <span v-else>{{ data.baseInfo[0].compareScore }}%</span>
@@ -230,34 +397,61 @@
        <p :title="data.picDate">
          <span class="fontStyle color222">{{ data.picDate }}</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="showType != 'findByPic'">
        <el-tooltip
          placement="right"
          popper-class="atooltip"
          v-if="showType != 'findByPic'"
        >
          <div slot="content">
            <p v-for="(item,index) in data.alarmRules" :key="index+'rule2'">
              <span class="fontStyle">{{data.taskName}}</span>&nbsp;&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 !== '撤防'"
                :style="item.defenceState ? 'color:red':''"
              >{{item.alarmLevel}}</span>&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
                :style="item.defenceState ? 'color:red' : ''"
                >{{ item.alarmLevel }}</span
              >&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle"
                >&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;background:#0D1A45"
            style="
              border: none;
              padding: 0;
              margin: 0px;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
              background: #0d1a45;
            "
          >
            <span v-for="(item,index) in data.alarmRules" :key="index+'rule3'">
              <span class="fontStyle color666">{{data.taskName}}</span>&nbsp;&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 !== '撤防'"
                :style="item.defenceState ? 'color:red':''"
              >{{item.alarmLevel}}</span>&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle color666">&nbsp;联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
                :style="item.defenceState ? 'color:red' : ''"
                >{{ 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>
          </el-button>
        </el-tooltip>
@@ -267,25 +461,49 @@
        </p>-->
        <el-tooltip placement="right" popper-class="atooltip">
          <div slot="content">
            <p v-for="(item,index) in data.baseInfo" :key="index+'base1'">
              <span class="fontStyle">{{item.tableName}}</span>&nbsp;
              <span class="fontStyle">/&nbsp;{{item.targetName}}</span>&nbsp;
              <span class="fontStyle" >/&nbsp;{{item.labels.split("/")[1]}}</span>&nbsp;
              <span class="fontStyle" >/&nbsp;{{item.labels.split("/")[0]}}</span>
            <p v-for="(item, index) in data.baseInfo" :key="index + 'base1'">
              <span class="fontStyle">{{ item.tableName }}</span
              >&nbsp; <span class="fontStyle">/&nbsp;{{ item.targetName }}</span
              >&nbsp;
              <span class="fontStyle"
                >/&nbsp;{{ item.labels.split("/")[1] }}</span
              >&nbsp;
              <span class="fontStyle"
                >/&nbsp;{{ item.labels.split("/")[0] }}</span
              >
            </p>
          </div>
          <el-button
            style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left;background:#0D1A45"
            style="
              border: none;
              padding: 0;
              margin: 0px;
              overflow: hidden;
              text-overflow: ellipsis;
              cursor: default;
              width: 100%;
              text-align: left;
              background: #0d1a45;
            "
          >
            <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">/&nbsp;{{item.targetName}}</span>&nbsp;
              <span class="fontStyle" >/&nbsp;{{item.labels.split("/")[1]}}</span>&nbsp;
              <span class="fontStyle" >/&nbsp;{{item.labels.split("/")[0]}}</span>
              <span class="fontStyle">{{ item.tableName }}</span
              >&nbsp; <span class="fontStyle">/&nbsp;{{ item.targetName }}</span
              >&nbsp;
              <span class="fontStyle"
                >/&nbsp;{{ item.labels.split("/")[1] }}</span
              >&nbsp;
              <span class="fontStyle"
                >/&nbsp;{{ item.labels.split("/")[0] }}</span
              >
            </span>
          </el-button>
        </el-tooltip>
@@ -304,17 +522,23 @@
            <p :title="data.picDate">
              <span class="fontStyle color222">{{ data.picDate }}</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;
            <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'">
              <span class="fontStyle color666">{{ data.taskName }}</span
              >&nbsp;/&nbsp;
              <span
                class="fontStyle color666"
                :style="item.defenceState ? 'color:red':''"
              >{{item.alarmLevel}}</span>&nbsp;/&nbsp;
              <span v-if="item.linkInfo == '联动任务'" class="fontStyle color666">联动任务</span>
              <span v-if="index < data.alarmRules.length-1">/&nbsp;</span>
                :style="item.defenceState ? 'color:red' : ''"
                >{{ item.alarmLevel }}</span
              >&nbsp;/&nbsp;
              <span
                v-if="item.linkInfo == '联动任务'"
                class="fontStyle color666"
                >联动任务</span
              >
              <span v-if="index < data.alarmRules.length - 1">/&nbsp;</span>
            </p>
          </div>
        </div>
@@ -324,23 +548,22 @@
</template>
<script>
export default {
  mounted() {
  },
  mounted() {},
  props: {
    data: {
      type: Object,
      default: null
      default: null,
    },
    showType: {
      type: String,
      default: "search"
    }
      default: "search",
    },
  },
  data() {
    return {
      initialIndex: 0,
      carouselIndex: 0,
      overflowState: true
      overflowState: true,
    };
  },
  methods: {
@@ -359,18 +582,22 @@
    detailsClick(ev) {
      this.$emit("detailsClick", ev);
    },
    tosearch(item){
    tosearch(item) {
      var curWwwPath = window.document.location.href;
      var pathname= window.document.location.pathname;
      var pathname = window.document.location.pathname;
      var pos = curWwwPath.indexOf(pathname);
      var localhostPath = curWwwPath .substring(0,pos); //ip+port
      var href = localhostPath+"/Layout/Searching"
      console.log("跳转地址",href)
      let captureId = item.id
      var url = item.picSmUrl? item.picSmUrl[0] : item.baseInfo[0].personPicUrl
      window.open(href+'?showType=findByPic&captureId=' + captureId + '&picSmUrl=' + url)
    }
  }
      var localhostPath = curWwwPath.substring(0, pos); //ip+port
      var href = localhostPath + "/Layout/Searching";
      console.log("跳转地址", href);
      let captureId = item.id;
      var url = item.picSmUrl
        ? item.picSmUrl[0]
        : item.baseInfo[0].personPicUrl;
      window.open(
        href + "?showType=findByPic&captureId=" + captureId + "&picSmUrl=" + url
      );
    },
  },
};
</script>
<style lang="scss" scoped>
@@ -380,14 +607,14 @@
.color222 {
  font-family: PingFangSC-Regular;
  font-size: 0.625rem;
  color: #95B7FF;
  line-height: 1.125rem
  color: #95b7ff;
  line-height: 1.125rem;
}
.color666 {
  font-family: PingFangSC-Regular;
  font-size: 0.6875rem;
  color: #687BE3;
  line-height: 1.25rem
  color: #687be3;
  line-height: 1.25rem;
}
</style>
@@ -488,7 +715,7 @@
      margin-left: 0.625rem;
      padding-top: 0.625rem;
      i {
        color: #3D68E1;
        color: #3d68e1;
        font-size: 1.25rem !important;
        padding-right: 0.625rem;
        cursor: pointer;
@@ -555,7 +782,7 @@
      position: absolute;
      bottom: 0px;
      i {
        color: #3D68E1;
        color: #3d68e1;
        font-size: 1.25rem !important;
        padding-right: 0.625rem;
        cursor: pointer;
@@ -595,7 +822,7 @@
      position: absolute;
      bottom: 0px;
      i {
        color: #3D68E1;
        color: #3d68e1;
        font-size: 1.25rem !important;
        padding-right: 0.625rem;
        cursor: pointer;