<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 + '/ ':''}}</span>
|
<span
|
class="f14"
|
style="color:#000000;"
|
>{{this.baseObject.bwType === '1'?'黑名单/ ':'白名单/ '}}</span>
|
<span
|
class="f14"
|
style="color:#000000;"
|
>有效时间：{{this.baseObject.startTime}}--{{this.baseObject.endTime?this.baseObject.endTime:'永久有效'}}</span>
|
</div>
|
</el-row>
|
<el-row class style="margin:40px 0 40px 20px">
|
<el-col :span="6">
|
<el-input
|
placeholder="姓名/性别/身份证号/手机号"
|
autocomplete="off"
|
width="100%"
|
size="small"
|
v-model="BaseManageData.contentValue"
|
@keyup.enter.native="handleSearch"
|
>
|
<upload-icon slot="suffix"></upload-icon>
|
</el-input>
|
</el-col>
|
<el-col :span="2">
|
<el-button size="small" type="primary" @click="handleSearch">搜索</el-button>
|
</el-col>
|
<el-col :offset="11" :span="3">
|
<fTemplate authority="videoTable:edit">
|
<el-button
|
size="small"
|
class="ml10"
|
type="danger"
|
@click="deleteBatch"
|
v-if="isShow('videoTable:edit')"
|
>批量删除</el-button>
|
</fTemplate>
|
</el-col>
|
<el-col :span="2">
|
<div class="text-left">
|
<upload
|
limitTypes=".jpg,.png,.jpeg"
|
limitSize
|
uploadBtntext="上传照片"
|
uploadBtnIcon
|
v-if="isShow('videoTable:edit')"
|
uploadBtnSize="small"
|
:isDrag="true"
|
@addFilesBaBackFN="changeDialog"
|
@successFN="getUploadResult"
|
:idJson="{tableId:baseObject.id}"
|
/>
|
</div>
|
</el-col>
|
</el-row>
|
<div style="display:flex;" class="border-tabl ml20">
|
<el-table
|
id="multipleTable"
|
ref="multipleTable"
|
:data="BaseManageData.personList"
|
tooltip-effect="dark"
|
style="width: 100%;"
|
:fit="true"
|
:default-sort="{prop: 'createTime', order: 'descending'}"
|
@selection-change="handleSelectionChange"
|
:header-cell-style="{background:'#f8f8f8',color:'#222222'}"
|
>
|
<el-table-column type="selection" width="30"></el-table-column>
|
<el-table-column label="序号" width="60" sortable align="center">
|
<template slot-scope="scope">{{scope.$index+1}}</template>
|
</el-table-column>
|
<el-table-column prop="personPicUrl" label="照片" align="center" width="120">
|
<template slot-scope="scope">
|
<img
|
:src="'/httpImage/'+scope.row.personPicUrl"
|
style="width:84px;height:84px;object-fit:contain;"
|
alt
|
/>
|
<p class="text-center fb f16" v-show="haveScore(scope.row)">{{scope.row.compareScore}}%</p>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="personName"
|
label="姓名"
|
min-width="90"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
></el-table-column>
|
<el-table-column prop="sex" label="性别" width="70" sortable align="center"></el-table-column>
|
<el-table-column
|
prop="idCard"
|
label="身份证号"
|
min-width="170"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
></el-table-column>
|
<el-table-column
|
prop="phoneNum"
|
label="手机号"
|
width="110"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
></el-table-column>
|
<el-table-column prop="monitorLevel" label="等级" align="center" width="80"></el-table-column>
|
<el-table-column
|
prop="createTime"
|
label="入库时间"
|
width="140"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
></el-table-column>
|
<!-- <el-table-column prop="reserved" label="其他" align="center"></el-table-column> -->
|
<el-table-column label="生效状态" align="center" width="80">
|
<template slot-scope="scope">
|
<el-switch
|
v-model="scope.row.enable"
|
:active-value="1"
|
:disabled="!isShow('videoTable:edit')"
|
:inactive-value="0"
|
@change="enable(scope.row)"
|
></el-switch>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" min-width="200" align="center">
|
<template slot-scope="scope">
|
<fTemplate authority="videoTable:edit">
|
<el-tooltip content="编辑" placement="top" popper-class="atooltip">
|
<span
|
class="iconfont iconbianji iconStyle1"
|
style="font-size:15px;"
|
@click="handleClick(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<el-tooltip content="查找此人" placement="top" popper-class="atooltip">
|
<span class="iconfont iconsousuoren iconStyle1" @click="tosearch(scope.row)"></span>
|
</el-tooltip>
|
<el-tooltip content="查看详情" placement="top" popper-class="atooltip">
|
<span class="iconfont iconsousuoren iconStyle1" @click="showDetail(scope.row)"></span>
|
</el-tooltip>
|
<fTemplate authority="videoTable:edit">
|
<el-tooltip content="复制" placement="top" popper-class="atooltip">
|
<span
|
class="iconfont iconfuzhi iconStyle1"
|
title="复制"
|
@click="copyClick(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<fTemplate authority="videoTable:edit">
|
<el-tooltip content="移动" placement="top" popper-class="atooltip">
|
<span
|
class="iconfont iconyidongzhi iconStyle1"
|
style="font-size:15px;"
|
title="移动"
|
@click="moveClick(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<fTemplate authority="videoTable:edit">
|
<el-tooltip content="删除" placement="top" popper-class="atooltip">
|
<span
|
class="iconfont iconshanchu iconStyle1"
|
style="color:#E74C3C;"
|
@click="deleteThis(scope.row.id)"
|
title="删除"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="pt5 " style="height:40px;position:relative">
|
<el-pagination
|
@current-change="refrash"
|
:current-page="BaseManageData.page"
|
:page-size="BaseManageData.size"
|
style="position:absolute;right:10px;bottom:5px"
|
: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>
|
<p 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>
|
</p>
|
<el-table :data="cameraDetailData" border>
|
<el-table-column prop="startFacePicUrl" label="抓拍实景" width="160" align="center">
|
<template slot-scope="scope">
|
<div>
|
<img
|
v-if="scope.row.startFacePicUrl"
|
:src="`/httpImage/`+scope.row.startFacePicUrl"
|
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"
|
okText="保存"
|
width="30%"
|
:before-close="handleClose"
|
cancelText="取消"
|
>
|
<el-form ref="formForEdit" :model="form" label-width="120px" :rules="rules">
|
<div class="flex-center mb10">
|
<el-upload
|
class="avatar-uploader"
|
action
|
:http-request="updateFace"
|
accept="image/*"
|
:show-file-list="false"
|
:on-success="uploadSuccess"
|
:on-error="uploadError"
|
>
|
<div class="mask1">
|
<div slot="trigger" class="flex-center" style="position:absolute;top:120px;">
|
<p
|
style="background:rgba(0,0,0,0.35);width:150px;line-height:30px;color:#fff;font-size:13px;opacity:1;"
|
>点击修改照片</p>
|
</div>
|
</div>
|
<img
|
v-if="`httpImage/`+form.personPicUrl"
|
:src="`/httpImage/`+form.personPicUrl"
|
style="max-height:150px;width:150px;object-fit:contain;background:rgba(0,0,0,0.35);"
|
class="avatar"
|
/>
|
</el-upload>
|
</div>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="ID" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.id" disabled placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="照片标识" prop="picDesc" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.picDesc" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="姓名" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.personName" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="性别" prop="sex" style="width:100%;margin-bottom: 10px;" class="tl">
|
<el-radio-group v-model="form.sex" class="mt10">
|
<el-radio label="男"></el-radio>
|
<el-radio label="女"></el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="身份证号" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.idCard" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="手机号" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.phoneNum" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="人员等级" prop="monitorLevel" style="width:100%;margin-bottom: 10px;">
|
<el-select
|
size="small"
|
v-model="form.monitorLevel"
|
placeholder="请选择"
|
style="width:100%"
|
>
|
<el-option
|
v-for="item in VideoPhotoData.dictionary.MONITORLEVEL"
|
:key="item.value"
|
:label="item.name"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="入库位置" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.fromServerId" disabled placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="入库时间" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.createTime" disabled placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="其他" style="width:100%;margin-bottom: 10px;">
|
<el-input size="small" v-model="form.reserved" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button size="small" @click="handleClose" type="info">取 消</el-button>
|
<el-button size="small" type="primary" @click="submit()">确 定</el-button>
|
</div>
|
</el-dialog>
|
<el-dialog title="提示" :visible.sync="dialogVisible" :close="getPersonList" width="30%">
|
<div>
|
<div class="tl">
|
<span>上传成功的数量：{{uploadResult.successList.length}}</span>
|
</div>
|
<div class="flex-box mt10">
|
<span>上传失败的数量：{{uploadResult.failList.length}}</span>
|
<div class="ml20" v-for="(i,index) in uploadResult.failList" :key="index">{{i}}</div>
|
</div>
|
<div class="flex-box mt10">
|
<span>包含多张人脸的图片数量：{{uploadResult.multiFaceList.length}}</span>
|
<div class="ml20" v-for="(i,index) in uploadResult.multiFaceList" :key="index">{{i}}</div>
|
</div>
|
<div class="flex-box mt10">
|
<span>不含人脸的图片数量：{{uploadResult.noFaceList.length}}</span>
|
<div class="ml20" v-for="(i,index) in uploadResult.noFaceList" :key="index">{{i}}</div>
|
</div>
|
</div>
|
</el-dialog>
|
|
<el-dialog
|
title="复制到"
|
:visible.sync="copyVisiabled"
|
okText="保存"
|
width="35%"
|
class="copy"
|
cancelText="取消"
|
>
|
<div class="addToBase1">
|
<div class="items" v-if="baseObject.bwType === '1'">
|
<div class="lable">
|
<p>黑名单 ></p>
|
</div>
|
<div class="baseList">
|
<el-checkbox-group v-model="BaseManageData.selectBlacks" @change="blackAngWhite">
|
<div class="base" v-for="(item, index) in BaseManageData.blackList" :key="index">
|
<el-checkbox
|
:label="item.value"
|
:title="item.title"
|
:disabled="item.disabled"
|
>{{item.title}}</el-checkbox>
|
</div>
|
</el-checkbox-group>
|
</div>
|
</div>
|
<div class="items" v-else>
|
<div class="lable">
|
<p>白名单 ></p>
|
</div>
|
<div class="baseList">
|
<el-checkbox-group v-model="BaseManageData.selectWhites" @change="blackAngWhite">
|
<div class="base" v-for="(item, index) in BaseManageData.whiteList" :key="index">
|
<el-checkbox
|
:label="item.value"
|
:title="item.title"
|
:disabled="item.disabled"
|
>{{item.title}}</el-checkbox>
|
</div>
|
</el-checkbox-group>
|
</div>
|
</div>
|
</div>
|
<div slot="footer" class="dialog-footer">
|
<el-button size="small" @click="copyClose" type="info">取 消</el-button>
|
<el-button size="small" type="primary" @click="copySubmit()">确 定</el-button>
|
</div>
|
</el-dialog>
|
|
<el-dialog
|
title="移动至"
|
:visible.sync="moveVisiabled"
|
okText="保存"
|
class="move"
|
width="35%"
|
cancelText="取消"
|
>
|
<div class="addToBase1">
|
<div class="items">
|
<div class="lable">
|
<p>黑名单 ></p>
|
</div>
|
<div class="baseList">
|
<el-checkbox-group
|
v-model="BaseManageData.selectBlacks"
|
@change="blackAngWhite"
|
:max="1"
|
>
|
<div class="base" v-for="(item, index) in BaseManageData.blackList" :key="index">
|
<el-checkbox
|
:label="item.value"
|
:title="item.title"
|
:disabled="item.disabled"
|
>{{item.title}}</el-checkbox>
|
</div>
|
</el-checkbox-group>
|
</div>
|
</div>
|
<div class="items">
|
<div class="lable">
|
<p>白名单 ></p>
|
</div>
|
<div class="baseList">
|
<el-checkbox-group
|
v-model="BaseManageData.selectWhites"
|
@change="blackAngWhite"
|
:max="1"
|
>
|
<div class="base" v-for="(item, index) in BaseManageData.whiteList" :key="index">
|
<el-checkbox
|
:label="item.value"
|
:title="item.title"
|
:disabled="item.disabled"
|
>{{item.title}}</el-checkbox>
|
</div>
|
</el-checkbox-group>
|
</div>
|
</div>
|
</div>
|
<div slot="footer" class="dialog-footer">
|
<el-button size="small" @click="moveClose" type="info">取 消</el-button>
|
<el-button size="small" type="primary" @click="moveSubmit()">确 定</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</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()],
|
memberInfo: {
|
personName: '',
|
sex: '',
|
idCard: '',
|
reserved: ''
|
},
|
reqCameraParams: {
|
cameraIds: [],
|
startDate: new Date(2020, 7, 25, 8).Format("yyyy-MM-dd HH:mm:ss"),
|
endDate: new Date().Format("yyyy-MM-dd HH:mm:ss"),
|
thresholdTime: 10,
|
personIds: []
|
},
|
cameraDetailData: [],
|
cameraDetailVisible: false,
|
|
dialogFormVisible: false,
|
copyVisiabled: false,
|
moveVisiabled: false,
|
buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
|
searchName: "",
|
current: 1,
|
compare: false,
|
pageSize: 10,
|
total: 0,
|
orderType: "desc",
|
orderName: "id",
|
contentValue: "",
|
visible: false,
|
selectedRowKeys: [],
|
form: {
|
id: "",
|
sex: "男",
|
personName: "呵呵呵",
|
tableId: "",
|
picDesc: "",
|
idCard: "12312938102143253",
|
phoneNum: "18712766787",
|
monitorLevel: "one",
|
faceUrl: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg",
|
enable: 0,
|
reserved: ""
|
},
|
rules: {
|
picDesc: [
|
{ required: true, message: "请输入照片标识", trigger: "submit" }
|
],
|
sex: [{ required: true, message: "请勾选性别", trigger: "submit" }],
|
monitorLevel: [
|
{ required: true, message: "请选择人员等级", trigger: "submit" }
|
]
|
},
|
tableData: [],
|
tableHeight: window.innerHeight - 320,
|
multipleSelection: [],
|
peoperLevel: [],
|
oldWidth: "",
|
oldHeight: "",
|
faceDataCount: 0,
|
// 上传后的弹框显示
|
dialogVisible: false,
|
// 批量上传后的返回结果
|
uploadResult: { failList: [], successList: [], multiFaceList: [], noFaceList: [] }
|
};
|
},
|
computed: {
|
isAdmin() {
|
if (
|
sessionStorage.getItem('userInfo') &&
|
sessionStorage.getItem('userInfo') !== ''
|
) {
|
let loginName = JSON.parse(sessionStorage.getItem('userInfo')).username
|
return (
|
loginName === 'superadmin' || loginName === 'basic'
|
)
|
}
|
return false;
|
}
|
},
|
methods: {
|
postCameraData(){
|
getCameraFaceData(this.reqCameraParams).then(res=>{
|
if(res && res.code == 200){
|
this.cameraDetailData = res.data.allSource
|
this.faceDataCount = res.data.count
|
}
|
})
|
},
|
timeChange(val) {
|
console.log(val);
|
this.reqCameraParams.startDate = val[0];
|
this.reqCameraParams.endDate = 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.personIds = [];
|
this.reqCameraParams.personIds.push(row.id)
|
console.log(this.reqCameraParams)
|
this.cameraDetailVisible = true;
|
},
|
isShow(authority) {
|
if (this.isAdmin) {
|
return true
|
} else if (
|
this.buttonAuthority.indexOf(',' + authority + ',') > -1
|
) {
|
return true
|
} else {
|
return false
|
}
|
},
|
toggleSelection(rows) {
|
if (rows) {
|
rows.forEach(row => {
|
this.$refs.multipleTable.toggleRowSelection(row);
|
});
|
} else {
|
this.$refs.multipleTable.clearSelection();
|
}
|
},
|
deleteThis(id) {
|
let token =
|
sessionStorage.getItem("loginedInfo") &&
|
JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
|
this.$confirm("提示：确定删除该底库人员？", {
|
center: true,
|
cancelButtonClass: "comfirm-class-cancle",
|
confirmButtonClass: "comfirm-class-sure"
|
})
|
.then(_ => {
|
fetch(`/data/api-v/dbperson/deleteDbPersonById/${id}`, {
|
method: "POST",
|
headers: {
|
"Content-Type": "application/json",
|
Authorization: token
|
}
|
})
|
.then(res => {
|
return res.json();
|
})
|
.then(data => {
|
// console.log(data.data);
|
if (data.success) {
|
this.$notify({
|
type: "success",
|
message: "该人员删除成功！"
|
});
|
}
|
this.getPersonList();
|
})
|
.catch(err => {
|
console.log(err);
|
});
|
})
|
.catch(_ => { });
|
},
|
sayHello() {
|
console.log("hello");
|
},
|
getUploadResult(result) {
|
console.log(result, "上传的返回");
|
this.uploadResult = result.data;
|
this.dialogVisible = true;
|
this.getPersonList();
|
},
|
async getPersonList() {
|
// console.log("执行了刷新函数", this.BaseManageData.syncTables[0]);
|
if (this.baseObject.id && this.baseObject.id !== undefined) {
|
// console.log("底库id", this.baseObject.id);
|
this.BaseManageData.tableId = this.baseObject.id;
|
// this.BaseManageData.queryPersonList();
|
this.setLoadSearch(this.BaseManageData.queryPersonList())
|
}
|
},
|
changeDialog(data) {
|
data.erFileList.map((item, index) => {
|
this.$notify({
|
type: "error",
|
message: item.errorMsg.message
|
});
|
});
|
},
|
handleClose() {
|
//this.getPersonList();
|
this.dialogFormVisible = false;
|
},
|
handleSelectionChange(val) {
|
this.selectedRowKeys = val;
|
},
|
refrash(current, pageSize) {
|
this.current = current;
|
this.BaseManageData.page = current;
|
this.getPersonList();
|
},
|
handleClick(row) {
|
this.form = row;
|
this.dialogFormVisible = true;
|
},
|
async submit() {
|
this.$refs["formForEdit"].validate(async valid => {
|
// console.log("通过验证", valid);
|
if (valid) {
|
let { ...json } = this.form;
|
delete (json["compareScore"])
|
// console.log("修改的参数：", json);
|
let res = await updateBasePerson(json);
|
// console.log("保存了", res);
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: "人员修改成功！"
|
});
|
this.dialogFormVisible = false;
|
} else {
|
this.$notify({
|
type: "error",
|
message: "人员修改失败，请重试！！"
|
});
|
}
|
} else {
|
return false;
|
}
|
});
|
},
|
confirm() {
|
this.$confirm({
|
title: "Confirm",
|
content: "Bla bla ...",
|
okText: "确认",
|
cancelText: "取消"
|
});
|
},
|
async enable(item) {
|
let res = await updateBasePerson({
|
id: item.id,
|
enable: item.enable,
|
sex: item.sex,
|
personName: item.personName,
|
picDesc: item.picDesc,
|
idCard: item.idCard,
|
phoneNum: item.phoneNum,
|
monitorLevel: item.monitorLevel,
|
personPicUrl: item.personPicUrl,
|
reserved: item.reserved
|
});
|
if (res.success === true) {
|
this.$notify({
|
type: "success",
|
message: "底库人员成功变更生效状态！"
|
});
|
} else {
|
this.$notify({
|
type: "error",
|
message: "底库人员变更生效状态失败！"
|
});
|
}
|
},
|
handleSearch() {
|
this.getPersonList();
|
},
|
searchImg() {
|
this.$refs.uploadDrag && this.$refs.uploadDrag.uploadStart();
|
},
|
haveScore(row) {
|
if (row.compareScore && row.compareScore !== "") {
|
return true
|
} else {
|
return false
|
}
|
},
|
async searchImgList(faceUrl, threshold) {
|
// console.log("搜图参数", faceUrl, threshold);
|
let json = {
|
tableId: this.baseObject.id,
|
page: this.current,
|
size: this.pageSize,
|
faceUrl: faceUrl,
|
threshold: threshold,
|
orderType: this.orderType,
|
orderName: this.orderName
|
};
|
let res = await getPersonByPhoto(json);
|
// console.log("列表查询", json);
|
this.tableData = res.data.datalist;
|
this.total = res.data.total;
|
this.compare = true;
|
},
|
updateThreshold() { },
|
async updateFace(param) {
|
const fd = new FormData();
|
fd.append("file", param.file);
|
fd.append("id", this.form.id);
|
// console.log("换脸了吗", fd);
|
let res = await axios({
|
method: "post",
|
url: `/data/api-v/dbperson/updateFace`,
|
headers: {
|
'Authorization': sessionStorage.getItem('loginedInfo') && JSON.parse(sessionStorage.getItem('loginedInfo')).access_token
|
},
|
data: fd
|
});
|
if (res.data.success) {
|
this.form.personPicUrl = res.data.data.personPicUrl;
|
this.form.faceFeature = res.data.data.faceFeature;
|
}
|
},
|
uploadSuccess() {
|
console.log("换脸成功了");
|
},
|
uploadError() {
|
console.log("换脸失败了");
|
},
|
deleteBatch() {
|
// console.log('要删除的', this.selectedRowKeys.length)
|
if (this.selectedRowKeys.length === 0) {
|
this.$notify({
|
type: "warning",
|
message: "请选择要删除的人员"
|
});
|
} else {
|
this.$confirm("提示：确定删除该底库选中人员？", {
|
center: true,
|
cancelButtonClass: "comfirm-class-cancle",
|
confirmButtonClass: "comfirm-class-sure"
|
}).then(async _ => {
|
let ids = [];
|
this.selectedRowKeys.map((item, index) => {
|
ids.push(item.id);
|
});
|
// console.log('批量删除数组', ids)
|
let res = await deleteBasePersons(ids);
|
// console.log(res, '批量删除结果')
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: "删除成功！"
|
});
|
this.getPersonList();
|
} else {
|
this.$notify({
|
type: "error",
|
message: "删除失败！"
|
});
|
}
|
});
|
}
|
},
|
async init() {
|
await this.BaseManageData.querySyncTables();
|
await this.BaseManageData.queryLocalTables();
|
if (this.baseObject.id && this.baseObject.id !== undefined) {
|
// console.log("one;", this.baseObject.id);
|
} else if (
|
this.BaseManageData.syncTables[0].id &&
|
this.BaseManageData.syncTables[0].id !== undefined
|
) {
|
this.BaseManageData.tableId = this.BaseManageData.syncTables[0].id;
|
this.BaseManageData.queryPersonList();
|
} else {
|
this.BaseManageData.tableId = this.BaseManageData.localTables[0].id;
|
this.BaseManageData.queryPersonList();
|
}
|
},
|
handleRowStyle({ row, rowIndex }) {
|
// console.log(row, rowIndex, "handleRowStyle");
|
if (rowIndex === 0) {
|
return "background:#222222;";
|
}
|
},
|
blackAngWhite() {
|
if (this.BaseManageData.selectBlacks.length > 0) {
|
for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
|
//this.VideoPhotoData.whiteList[i].disabled = true
|
this.$set(this.BaseManageData.whiteList[i], 'disabled', true)
|
}
|
}
|
if (this.BaseManageData.selectBlacks.length == 0) {
|
for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
|
//this.VideoPhotoData.whiteList[i].disabled = false
|
this.$set(this.BaseManageData.whiteList[i], 'disabled', false)
|
}
|
}
|
if (this.BaseManageData.selectWhites.length > 0) {
|
for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
|
// this.VideoPhotoData.blackList[i].disabled = true
|
this.$set(this.BaseManageData.blackList[i], 'disabled', true)
|
}
|
}
|
if (this.BaseManageData.selectWhites.length == 0) {
|
for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
|
//this.VideoPhotoData.blackList[i].disabled = false
|
this.$set(this.BaseManageData.blackList[i], 'disabled', false)
|
}
|
}
|
},
|
// 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) {
|
//let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id
|
let captureId = item.id == "" ? item.personId : item.id
|
let imgUrl = item.personPicUrl ? item.personPicUrl : item.personPicUrl
|
let compType = 1 // 数据来自于es
|
if (!item.id || item.id == "") {
|
compType = 0 // 数据来自于底库
|
}
|
// window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
|
|
let message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType;
|
window.parent.postMessage({
|
msg: message
|
}, "*")
|
},
|
copyClick(row) {
|
this.BaseManageData.personId = row.id
|
this.copyVisiabled = true
|
},
|
moveClick(row) {
|
this.BaseManageData.personId = row.id
|
this.moveVisiabled = true
|
},
|
copyClose() {
|
this.copyVisiabled = false
|
this.BaseManageData.personId = ""
|
this.BaseManageData.selectBlacks = []
|
this.BaseManageData.selectWhites = []
|
},
|
moveClose() {
|
this.moveVisiabled = false
|
this.BaseManageData.personId = ""
|
this.BaseManageData.selectBlacks = []
|
this.BaseManageData.selectWhites = []
|
},
|
copySubmit() {
|
if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
|
this.$notify({
|
title: "注意",
|
message: "请选择要复制到的库",
|
type: "warning"
|
})
|
return
|
}
|
var resp = this.BaseManageData.copyTo()
|
resp.then(data => {
|
if (data.success) {
|
this.$notify({
|
title: "成功",
|
message: data.data,
|
type: "success"
|
})
|
} else {
|
this.$notify({
|
title: "失败",
|
message: data.data,
|
type: "error"
|
})
|
}
|
})
|
this.copyVisiabled = false
|
this.BaseManageData.personId = ""
|
this.BaseManageData.selectBlacks = []
|
this.BaseManageData.selectWhites = []
|
},
|
moveSubmit() {
|
if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
|
this.$notify({
|
title: "注意",
|
message: "请选择要移动到的库",
|
type: "warning"
|
})
|
return
|
}
|
var resp = this.BaseManageData.moveTo()
|
resp.then(data => {
|
if (data.success) {
|
this.$notify({
|
title: "成功",
|
message: data.data,
|
type: "success"
|
})
|
} else {
|
this.$notify({
|
title: "失败",
|
message: data.data,
|
type: "error"
|
})
|
}
|
this.moveVisiabled = false
|
this.BaseManageData.personId = ""
|
this.BaseManageData.selectBlacks = []
|
this.BaseManageData.selectWhites = []
|
this.BaseManageData.queryPersonList()
|
})
|
},
|
setLoadSearch(fn) {
|
this.AuthData.setLoading("multipleTable", this);
|
fn.then(_ => {
|
this.AuthData.closeLoad();
|
})
|
}
|
},
|
mounted() {
|
this.getPersonList();
|
this.VideoPhotoData.queryDictionary();
|
this.BaseManageData.queryTagList();
|
this.oldWidth = document.body.clientWidth;
|
this.oldHeight = document.body.clientHeight;
|
this.blackAngWhite();
|
window.onresize = () => {
|
let width = document.body.clientWidth;
|
let height = document.body.clientHeight;
|
// console.log(width, height, "窗口变化对比", this.oldWidth, this.oldHeight);
|
if (width !== this.oldWidth && width < 1750) {
|
}
|
this.$nextTick(() => {
|
this.$refs.multipleTable.doLayout();
|
});
|
};
|
this.$nextTick(() => {
|
this.$refs.multipleTable.doLayout();
|
});
|
},
|
beforeDestroy() {
|
window.onresize = null;
|
},
|
watch: {
|
baseObject: {
|
handler(newVal, oldVal) {
|
// console.log(newVal, "监听baseObject");
|
this.BaseManageData.cleanData();
|
this.getPersonList();
|
},
|
deep: true
|
},
|
"BaseManageData.selectBlacks": function (value) {
|
this.blackAngWhite()
|
},
|
"BaseManageData.selectWhites": function (value) {
|
this.blackAngWhite()
|
},
|
},
|
components: {
|
// httpImg,
|
Upload,
|
fTemplate,
|
UploadIcon
|
},
|
props: {
|
baseObject: {
|
default: () => { },
|
type: Object
|
}
|
}
|
};
|
</script>
|
<style lang="scss">
|
.iconStyle1 {
|
font-size: 16px;
|
margin-left: 8px;
|
cursor: pointer;
|
color: #303133;
|
}
|
.activeRow {
|
background: rgb(245, 247, 250);
|
}
|
.cursor-pointer {
|
cursor: pointer;
|
}
|
.el-table {
|
position: relative;
|
overflow: hidden;
|
-webkit-box-sizing: border-box;
|
box-sizing: border-box;
|
-webkit-box-flex: 1;
|
-ms-flex: 1;
|
flex: 1;
|
width: auto;
|
max-width: none;
|
font-size: 14px;
|
color: #606266;
|
thead {
|
background: green !important;
|
}
|
}
|
.avatar-uploader:hover {
|
.mask1 {
|
display: block;
|
}
|
}
|
.mask1 {
|
position: absolute;
|
width: 150px;
|
height: 150px;
|
background: rgba(0, 0, 0, 0.35);
|
backdrop-filter: blur(1px) brightness(100%);
|
text-align: center;
|
z-index: 1;
|
border-radius: 3px;
|
display: none;
|
}
|
.table-parent {
|
// position: relative;
|
height: 90%;
|
overflow: visible !important;
|
}
|
|
.text-left {
|
.el-upload-list {
|
display: none;
|
}
|
}
|
.border-tabl {
|
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;
|
text-align: left;
|
-webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
|
box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
|
}
|
.el-dialog__title {
|
line-height: 20px;
|
font-size: 15px;
|
margin-left: 10px;
|
color: #303133;
|
}
|
.el-dialog__body {
|
padding: 30px 20px 20px 20px;
|
color: #606266;
|
font-size: 14px;
|
word-break: break-all;
|
}
|
.dialog-footer {
|
text-align: center;
|
}
|
.comfirm-class-sure {
|
background: #f53d3d;
|
border-radius: 2px;
|
outline: none;
|
color: #fff;
|
background-color: #f53d3d;
|
border-color: #f53d3d;
|
font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #ffffff;
|
text-align: center;
|
}
|
.comfirm-class-cancle {
|
background: #eaeaea;
|
border-radius: 2px;
|
outline: none;
|
color: #fff;
|
background-color: #eaeaea;
|
border-color: #eaeaea;
|
font-family: PingFangSC-Regular;
|
font-size: 13px;
|
color: #222222;
|
text-align: center;
|
}
|
.el-table th{
|
color: #222;
|
background: #ececec;
|
}
|
.el-table .cell {
|
padding-left: 8px !important;
|
padding-right: 0px !important;
|
}
|
.addToBase1 {
|
width: 98%;
|
height: 350px;
|
position: relative;
|
.topLabel {
|
margin-top: 20px;
|
height: 40px;
|
border-bottom: 1px solid #eee;
|
font-family: PingFangSC-Medium;
|
font-size: 20px;
|
font-weight: 600;
|
line-height: 1rem;
|
color: #222222;
|
text-align: left;
|
margin-left: 15px;
|
}
|
.items {
|
width: 100%;
|
height: auto;
|
max-height: 35%;
|
overflow-y: auto;
|
margin: 20px 0px;
|
.lable {
|
width: 15%;
|
margin-top: 10px;
|
float: left;
|
//font-family: PingFangSC-Medium;
|
font-size: 14px;
|
font-weight: 600;
|
}
|
.baseList {
|
width: 85%;
|
height: 100%;
|
float: left;
|
.base {
|
width: calc(33% - 10px);
|
padding: 0px 5px;
|
line-height: 30px;
|
float: left;
|
text-align: left;
|
font-size: 12px !important;
|
.el-checkbox {
|
width: 100%;
|
display: block;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
.el-checkbox__label {
|
display: inline !important;
|
}
|
}
|
}
|
}
|
}
|
}
|
.copy,
|
.move {
|
.el-dialog__body {
|
padding: 0px !important;
|
}
|
}
|
|
.avatar-uploader {
|
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>
|
