Merge branch 'master' of http://192.168.5.5:10010/r/web/vue-smart-ai

ZZJ

2021-11-03 b4d2703e653bf702d705b18c20d9edb9066c7c8a

 src/pages/library/components/personList.vue

@@ -1,31 +1,13 @@
<template>
  <div class="table-parent">
    <el-row class style="margin:20px">
      <!-- <el-col :span="4" class="tl">
          <b class="f14">{{this.baseObject.tableName}}</b>
      </el-col>
      <el-col :span="2">
          <b class="f14">{{this.baseObject.bwType === '1'?'黑名单':'白名单'}}</b>
      </el-col>
      <el-col :span="8">
          <b class="f14">有效时间：{{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'永久有效'}}</b>
      </el-col>-->
      <div class="tl">
        <span
          class="f14"
          style="color:#000000;"
        >{{this.baseObject.tableName?this.baseObject.tableName + '/&nbsp;':''}}</span>
        <span
          class="f14"
          style="color:#000000;"
        >{{this.baseObject.bwType === '1'?'黑名单/&nbsp;':'白名单/&nbsp;&nbsp;&nbsp;'}}</span>
        <span
          class="f14"
          style="color:#000000;"
        >有效时间：{{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'永久有效'}}</span>
    <el-row style="margin-top:20px">
      <div class="base-tip">
        <span>{{this.baseObject.tableName?this.baseObject.tableName + '/&nbsp;':''}}</span>
        <span>{{this.baseObject.bwType === '1'?'黑名单/&nbsp;':'白名单/&nbsp;&nbsp;&nbsp;'}}</span>
        <span>有效时间：{{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'永久有效'}}</span>
      </div>
    </el-row>
    <el-row class style="margin:40px 0 40px 20px">
    <el-row class style="margin:40px 0 40px 0px">
      <el-col :span="6">
        <el-input
          placeholder="姓名/性别/身份证号/手机号"
@@ -42,24 +24,24 @@
        <el-button size="small" type="primary" @click="handleSearch">搜索</el-button>
      </el-col>
      <el-col :offset="11" :span="3">
        <fTemplate authority="videoTable:edit">
        <fTemplate authority="library:set">
          <el-button
            size="small"
            class="ml10"
            type="danger"
            @click="deleteBatch"
            v-if="isShow('videoTable:edit')"
            v-if="isShow('library:set')"
          >批量删除</el-button>
        </fTemplate>
      </el-col>
      <el-col :span="2">
        <div class="text-left">
          <upload
            limitTypes=".jpg,.png,.jpeg,.gif,.mp4"
            limitTypes=".jpg,.png,.jpeg"
            limitSize
            uploadBtntext="上传照片"
            uploadBtnIcon
            v-if="isShow('videoTable:edit')"
            v-if="isShow('library:set')"
            uploadBtnSize="small"
            :isDrag="true"
            @addFilesBaBackFN="changeDialog"
@@ -77,7 +59,6 @@
        tooltip-effect="dark"
        style="width: 100%;"
        :fit="true"
        :max-height="tableHeight"
        :default-sort="{prop: 'createTime', order: 'descending'}"
        @selection-change="handleSelectionChange"
        :header-cell-style="{background:'#f8f8f8',color:'#222222'}"
@@ -136,7 +117,7 @@
            <el-switch
              v-model="scope.row.enable"
              :active-value="1"
              :disabled="!isShow('videoTable:edit')"
              :disabled="!isShow('library:set')"
              :inactive-value="0"
              @change="enable(scope.row)"
            ></el-switch>
@@ -144,7 +125,7 @@
        </el-table-column>
        <el-table-column label="操作" min-width="200" align="center">
          <template slot-scope="scope">
            <fTemplate authority="videoTable:edit">
            <fTemplate authority="library:set">
              <el-tooltip content="编辑" placement="top" popper-class="atooltip">
                <span
                  class="iconfont iconbianji iconStyle1"
@@ -156,7 +137,10 @@
            <el-tooltip content="查找此人" placement="top" popper-class="atooltip">
              <span class="iconfont iconsousuoren iconStyle1" @click="tosearch(scope.row)"></span>
            </el-tooltip>
            <fTemplate authority="videoTable:edit">
            <el-tooltip content="查看详情" placement="top" popper-class="atooltip">
              <span class="iconfont iconsousuoren iconStyle1" @click="showDetail(scope.row)"></span>
            </el-tooltip>
            <fTemplate authority="library:set">
              <el-tooltip content="复制" placement="top" popper-class="atooltip">
                <span
                  class="iconfont iconfuzhi iconStyle1"
@@ -165,7 +149,7 @@
                ></span>
              </el-tooltip>
            </fTemplate>
            <fTemplate authority="videoTable:edit">
            <fTemplate authority="library:set">
              <el-tooltip content="移动" placement="top" popper-class="atooltip">
                <span
                  class="iconfont iconyidongzhi iconStyle1"
@@ -175,7 +159,7 @@
                ></span>
              </el-tooltip>
            </fTemplate>
            <fTemplate authority="videoTable:edit">
            <fTemplate authority="library:set">
              <el-tooltip content="删除" placement="top" popper-class="atooltip">
                <span
                  class="iconfont iconshanchu iconStyle1"
@@ -189,15 +173,83 @@
        </el-table-column>
      </el-table>
    </div>
    <div class="pt5 pb20" style="height:40px;position:relative">
    <div class="pt5" style="height:40px;position:relative">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="refrash"
        :current-page="BaseManageData.page"
        :page-size="BaseManageData.size"
        :page-sizes="[10,20,50,100]"
        style="position:absolute;right:10px;bottom:5px"
        layout="total,sizes,prev,pager,next,jumper"
        :total="BaseManageData.total"
      ></el-pagination>
    </div>
    <el-dialog title="抓拍详情" :visible.sync="cameraDetailVisible" okText="确定">
      <div class="top-bar">
        <el-date-picker
          size="mini"
          @change="timeChange"
          v-model="timeRange"
          value-format="yyyy-MM-dd HH:mm:ss"
          type="datetimerange"
          range-separator="至"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
        ></el-date-picker>
        <div style="margin:0 10px;display:flex;">
          <span style="width:68px;">停留时长:</span>
          <el-input size="mini" style="width: 80px;" v-model.number="reqCameraParams.thresholdTime"></el-input>s
        </div>
        <el-button size="mini" type="primary" @click="postCameraData">查询</el-button>
      </div>

      <div class="member-info">
        <label class>人员信息:</label>
        <ul>
          <li>
            <span>姓名:</span>
            <span>{{memberInfo.personName}}</span>
          </li>
          <li>
            <span>性别:</span>
            <span>{{memberInfo.sex}}</span>
          </li>
          <li>
            <span>身份证号:</span>
            <span>{{memberInfo.idCard}}</span>
          </li>
          <li>
            <span>意图:</span>
            <span>{{memberInfo.reserved}}</span>
          </li>
        </ul>
      </div>

      <el-table :data="cameraDetailData" border>
        <el-table-column prop="faceImg" label="抓拍实景" width="160" align="center">
          <template slot-scope="scope">
            <div>
              <img
                v-if="scope.row.faceImg"
                :src="`/httpImage/`+scope.row.faceImg"
                style="max-height:84px;width:84px;object-fit:contain;background:rgba(0,0,0,0.35);"
                class="avatar"
              />
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="cameraName" label="摄像机名称" width="100" align="center"></el-table-column>
        <el-table-column prop="startTime" label="开始时间" align="center"></el-table-column>
        <el-table-column prop="endTime" label="结束时间" align="center"></el-table-column>
        <el-table-column prop="stayTime" label="停留时长" width="99" align="center">
          <template slot-scope="scope">
            <span>{{scope.row.stayTime}} 秒</span>
          </template>
        </el-table-column>
      </el-table>
      <p style="text-align:right; font-size: 14px;">共{{faceDataCount}}条数据</p>
    </el-dialog>
    <el-dialog
      title="修改信息"
      :visible.sync="dialogFormVisible"
@@ -255,7 +307,11 @@
        </el-row>
        <el-row>
          <el-col :span="20">
            <el-form-item label="性别" prop="sex" style="width:100%;margin-bottom: 10px;" class="tl">
            <el-form-item
              label="性别"
              prop="sex"
              style="width:100%;margin-bottom: 8px; text-align: left"
            >
              <el-radio-group v-model="form.sex" class="mt10">
                <el-radio label="男"></el-radio>
                <el-radio label="女"></el-radio>
@@ -450,14 +506,48 @@
</template>
<script>
import { updateBasePerson, deleteBasePersons } from "@/api/baseLibrary";
import { getCameraFaceData } from "@/api/es";
import axios from "axios";
// import { findByType } from '@/server/video.js'
import Upload from "./upload";
import fTemplate from "@/components/fTemplate";
import UploadIcon from "@/components/searching/UploadIcon.vue";

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));
  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;
}

export default {
  data() {
    return {
      timeRange: [new Date(2020, 7, 25, 8), new Date(new Date().setHours(23, 59, 59))],
      memberInfo: {
        personName: '',
        sex: '',
        idCard: '',
        reserved: ''
      },
      reqCameraParams: {
        startTime: new Date(2020, 7, 25, 8).Format("yyyy-MM-dd HH:mm:ss"),
        endTime: new Date().Format("yyyy-MM-dd HH:mm:ss"),
        thresholdTime: 10,
        faceId: []
      },
      cameraDetailData: [],
      cameraDetailVisible: false,

      dialogFormVisible: false,
      copyVisiabled: false,
      moveVisiabled: false,
@@ -468,7 +558,7 @@
      pageSize: 10,
      total: 0,
      orderType: "desc",
      orderName: "id",
      orderName: "createTime",
      contentValue: "",
      visible: false,
      selectedRowKeys: [],
@@ -500,6 +590,7 @@
      peoperLevel: [],
      oldWidth: "",
      oldHeight: "",
      faceDataCount: 0,
      // 上传后的弹框显示
      dialogVisible: false,
      // 批量上传后的返回结果
@@ -521,6 +612,28 @@
    }
  },
  methods: {
    postCameraData() {
      getCameraFaceData(this.reqCameraParams).then(res => {
        if (res && res.rtnCode == 1) {
          this.cameraDetailData = res.rtnData
          this.faceDataCount = res.rtnData.length
        }
      })
    },
    timeChange(val) {
      this.reqCameraParams.startTime = val[0];
      this.reqCameraParams.endTime = val[1];

    },
    showDetail(row) {
      this.cameraDetailData = []
      this.memberInfo.reserved = row.reserved;
      this.memberInfo.idCard = row.idCard;
      this.memberInfo.personName = row.personName;
      this.memberInfo.sex = row.sex;
      this.reqCameraParams.faceId = row.id;
      this.cameraDetailVisible = true;
    },
    isShow(authority) {
      if (this.isAdmin) {
        return true
@@ -581,7 +694,7 @@
      console.log("hello");
    },
    getUploadResult(result) {
      console.log(result, "上传的返回");
      // console.log(result, "上传的返回");
      this.uploadResult = result.data;
      this.dialogVisible = true;
      this.getPersonList();
@@ -613,6 +726,11 @@
    refrash(current, pageSize) {
      this.current = current;
      this.BaseManageData.page = current;
      this.getPersonList();
    },
    handleSizeChange(val){
      //this.pageSize = val;
      this.BaseManageData.size = val;
      this.getPersonList();
    },
    handleClick(row) {
@@ -816,18 +934,29 @@
        }
      }
    },
    // tosearch(item) {
    //   // console.log("跳转地址", item)
    //   var curWwwPath = window.document.location.href;
    //   var pathname = window.document.location.pathname;
    //   var pos = curWwwPath.indexOf(pathname);
    //   var localhostPath = curWwwPath.substring(0, pos); //ip+port
    //   var href = localhostPath + "/Layout/Searching"
    //   let captureId = item.id == "" ? item.personId : item.id
    //   var url = item.personPicUrl ? item.personPicUrl : item.personPicUrl
    //   // console.log("跳转地址",href,"url",url)
    //   var compType = 0
    //   window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
    // },
    tosearch(item) {
      // console.log("跳转地址", item)
      var curWwwPath = window.document.location.href;
      var pathname = window.document.location.pathname;
      var pos = curWwwPath.indexOf(pathname);
      var localhostPath = curWwwPath.substring(0, pos); //ip+port
      var href = localhostPath + "/Layout/Searching"
      //let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id
      let captureId = item.id == "" ? item.personId : item.id
      var url = item.personPicUrl ? item.personPicUrl : item.personPicUrl
      // console.log("跳转地址",href,"url",url)
      var compType = 0
      window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
      let imgUrl = item.personPicUrl ? item.personPicUrl : item.personPicUrl
      let compType = 0;

      let message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType;
      window.parent.postMessage({
        msg: message
      }, "*")
    },
    copyClick(row) {
      this.BaseManageData.personId = row.id
@@ -1018,8 +1147,15 @@
}
.table-parent {
  // position: relative;
  margin-left: 5px;
  height: 90%;
  overflow: visible !important;

  .base-tip {
    text-align: left;
    font-size: 14px;
    color: #000000;
  }
}

.text-left {
@@ -1031,6 +1167,12 @@
  border: 1px solid #ebeef5;
  border-bottom: none;
  // border-bottom: none;
}
.el-dialog {
  min-width: 515px;
  .el-button--info {
    color: #222;
  }
}
.el-dialog__header {
  padding: 20px 0 10px;
@@ -1077,7 +1219,10 @@
  color: #222222;
  text-align: center;
}

.el-table th {
  color: #222;
  background: #ececec;
}
.el-table .cell {
  padding-left: 8px !important;
  padding-right: 0px !important;
@@ -1145,9 +1290,31 @@
}

.avatar-uploader {
  margin: auto;
  max-width: 150px;
  min-width: 150px;
  min-height: 152px;
  border: 1px solid #eee;
}
.top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 30px;
}
.member-info {
  font-size: 13px;
  margin: 10px 0;
  display: flex;
  label {
    color: #999;
    margin-right: 6px;
  }
  ul {
    display: flex;
    li {
      margin-right: 8px;
    }
  }
}
</style>