<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"
|
></el-input>
|
</el-col>
|
<el-col :span="2">
|
<el-button size="small" type="primary" @click="handleSearch"
|
>搜索</el-button
|
>
|
</el-col>
|
<el-col :offset="8" :span="3">
|
<fTemplate authority="library:set">
|
<el-button
|
size="small"
|
class="ml10"
|
type="danger"
|
@click="deleteBatch"
|
v-if="isShow('library:set')"
|
>批量删除</el-button
|
>
|
</fTemplate>
|
</el-col>
|
<el-col :span="2">
|
<div class="text-left">
|
<el-button size="small" class="ml10" type="primary" @click="addCar"
|
>添加车辆</el-button
|
>
|
<el-drawer
|
title="车辆信息"
|
:modal="false"
|
:destroy-on-close="true"
|
:append-to-body="true"
|
:visible.sync="addDrawer"
|
:direction="direction"
|
:before-close="handleClose1"
|
>
|
<div class="drawerSpace">
|
<div class="uploadLine">
|
<div class="car-picture">
|
<el-upload
|
action
|
:http-request="uploadCar"
|
accept="image/*"
|
list-type="picture-card"
|
:file-list="form.carUrls"
|
:before-remove="handleRemoveCarPic"
|
>
|
<i class="el-icon-plus" style="margin-top: 25px"></i>
|
<div>上传车辆照片</div>
|
</el-upload>
|
</div>
|
<div class="person-picture">
|
<el-upload
|
action
|
:http-request="uploadPerson"
|
list-type="picture-card"
|
accept="image/*"
|
:limit="1"
|
:file-list="form.faceUrl"
|
:on-remove="handleRemoveFacePic"
|
>
|
<i class="el-icon-plus" style="margin-top: 25px"></i>
|
<div>上传车主照片</div>
|
</el-upload>
|
</div>
|
</div>
|
<el-form
|
ref="formForCar"
|
:model="form"
|
label-width="100px"
|
style="margin-top: 20px; margin-bottom: 50px"
|
:rule="rules"
|
>
|
<el-form-item label="*车牌号：">
|
<el-input
|
placeholder="请输入车牌号"
|
v-model="form.carNo"
|
class="inputWidth"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="车辆类型：">
|
<el-select
|
v-model="form.carType"
|
placeholder="请选择车辆类型"
|
class="inputWidth"
|
>
|
<el-option
|
v-for="item in VideoPhotoData.dictionary.CARTYPE"
|
:key="item.value"
|
:label="item.name"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="车辆品牌：">
|
<el-select
|
v-model="form.carBrand"
|
placeholder="请选择车辆品牌"
|
class="inputWidth"
|
>
|
<el-option
|
v-for="item in VideoPhotoData.dictionary.BRAND"
|
:key="item.value"
|
:label="item.name"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="车身颜色：">
|
<el-select
|
v-model="form.carColor"
|
placeholder="请选择车身颜色"
|
class="inputWidth"
|
>
|
<el-option
|
v-for="item in VideoPhotoData.dictionary.nColor"
|
:key="item.value"
|
:label="item.name"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="车主姓名：">
|
<el-input
|
v-model="form.personName"
|
class="inputWidth"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="车主性别：">
|
<el-radio-group v-model="form.sex">
|
<el-radio label="男"></el-radio>
|
<el-radio label="女"></el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="身份证号：">
|
<el-input v-model="form.idCard" class="inputWidth"></el-input>
|
</el-form-item>
|
<el-form-item label="手机号：">
|
<el-input
|
v-model="form.phoneNum"
|
class="inputWidth"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="其他：">
|
<el-input
|
v-model="form.reserved"
|
class="inputWidth"
|
></el-input>
|
</el-form-item>
|
<el-form-item style="text-align: tight">
|
<el-button
|
type="primary"
|
@click="submitCar"
|
style="margin-left: 120px"
|
>保存</el-button
|
>
|
<el-button @click="resetForm">取消</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</el-drawer>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-left">
|
<el-button size="small" class="ml10" type="primary" @click="addBatch"
|
>批量上传车牌</el-button
|
>
|
<el-drawer
|
title="上传车牌"
|
:modal="false"
|
:append-to-body="true"
|
:visible.sync="addBatchDrawer"
|
:direction="direction"
|
:before-close="handleClose2"
|
>
|
<div class="drawerSpace">
|
<div class="plateAttach">
|
<el-input
|
type="textarea"
|
:rows="25"
|
v-model="plates"
|
style="width: 90%"
|
placeholder="请输入车牌号"
|
></el-input>
|
<p>
|
车牌号以逗号或回车键隔开，单次最多支持100条上传，例如：京YAB123,京F34Y87
|
</p>
|
<el-button
|
type="primary"
|
@click="platesBatch"
|
style="margin-left: 210px"
|
>保存</el-button
|
>
|
<el-button @click="resetForm('ruleForm')">取消</el-button>
|
</div>
|
</div>
|
</el-drawer>
|
</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="70" sortable align="center">
|
<template slot-scope="scope">{{ scope.$index + 1 }}</template>
|
</el-table-column>
|
<el-table-column
|
prop="carNo"
|
label="车牌号"
|
sortable
|
align="center"
|
width="120"
|
></el-table-column>
|
<el-table-column
|
prop="carType"
|
label="车辆类型"
|
width="100"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
></el-table-column>
|
<el-table-column
|
prop="carBrand"
|
label="车辆品牌"
|
min-width="100"
|
sortable
|
align="center"
|
></el-table-column>
|
<el-table-column
|
prop="carColor"
|
label="车身颜色"
|
width="100"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
>
|
<template slot-scope="scope">{{
|
getDataName(VideoPhotoData.dictionary.nColor, scope.row.carColor)
|
}}</template>
|
</el-table-column>
|
<el-table-column
|
prop="personName"
|
label="车主姓名"
|
min-width="110"
|
show-overflow-tooltip
|
sortable
|
align="center"
|
></el-table-column>
|
<el-table-column
|
prop="sex"
|
label="车主性别"
|
align="center"
|
width="80"
|
></el-table-column>
|
<el-table-column
|
prop="carUrls"
|
label="车辆照片"
|
width="140"
|
show-overflow-tooltip
|
sortable
|
class="picture"
|
align="center"
|
>
|
<template slot-scope="scope">
|
<el-carousel
|
style="height: 100px"
|
:autoplay="false"
|
indicator-position="none"
|
:arrow="scope.row.carUrls.length > 1 ? 'always' : 'never'"
|
>
|
<el-carousel-item
|
v-for="(item, index) in scope.row.carUrls"
|
:key="index"
|
>
|
<img
|
style="width: 100px; height: 100px; object-fit: contain"
|
:src="item.url"
|
alt
|
/>
|
</el-carousel-item>
|
</el-carousel>
|
</template>
|
</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('library:set')"
|
: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="library:set">
|
<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>
|
<fTemplate authority="library:set">
|
<el-tooltip
|
content="复制"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconfuzhi iconStyle1"
|
title="复制"
|
@click="copyClick(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<fTemplate authority="library:set">
|
<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="library:set">
|
<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 pb20" 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="dialogVisible"
|
:append-to-body="true"
|
:close="getCarList"
|
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"
|
:append-to-body="true"
|
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"
|
:append-to-body="true"
|
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 {
|
addBaseCar,
|
updateBaseCar,
|
deleteBasePersons,
|
plateBatch,
|
} from "@/api/baseLibrary";
|
import axios from "axios";
|
// import { findByType } from '@/server/video.js'
|
import Upload from "./upload";
|
import fTemplate from "@/components/fTemplate";
|
import request from "@/scripts/httpRequest";
|
export default {
|
components: {
|
// httpImg,
|
fTemplate,
|
},
|
props: {
|
baseObject: {
|
default: () => {},
|
type: Object,
|
},
|
},
|
data() {
|
return {
|
dialogFormVisible: false,
|
addDrawer: false,
|
plates: "",
|
addBatchDrawer: false,
|
direction: "rtl",
|
dialogImageUrl: "",
|
fileList: [
|
{
|
name: "fasjido.jpg",
|
url: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg",
|
},
|
{
|
name: "fasjido.jpg",
|
url: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg",
|
},
|
],
|
provinces: [
|
{ name: "京", value: 1 },
|
{ name: "津", value: 2 },
|
{ name: "冀", value: 3 },
|
],
|
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: "男",
|
name: "",
|
tableId: "",
|
picDesc: "",
|
idCard: "",
|
phoneNum: "",
|
monitorLevel: "one",
|
carUrls: [], //{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"},{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"}
|
faceUrl: [],
|
faceFeature: "",
|
carPicUrls: "",
|
personPicUrl: "",
|
carColor: "0",
|
carType: "0",
|
carBrand: "0",
|
carNo: "",
|
enable: 0,
|
reserved: "",
|
},
|
rules: {
|
picDesc: [
|
{ required: true, message: "请输入照片标识", trigger: "change" },
|
],
|
sex: [{ required: true, message: "请勾选性别", trigger: "change" }],
|
monitorLevel: [
|
{ required: true, message: "请选择人员等级", trigger: "change" },
|
],
|
},
|
tableData: [],
|
tableHeight: window.innerHeight - 320,
|
multipleSelection: [],
|
peoperLevel: [],
|
oldWidth: "",
|
oldHeight: "",
|
// 上传后的弹框显示
|
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: {
|
handleRemoveCarPic(file, fileList) {
|
var index = fileList.findIndex((item) => {
|
if (item.uid == file.uid) {
|
return true;
|
}
|
});
|
this.form.carUrls.splice(index, 1);
|
},
|
handleRemoveFacePic(file, fileList) {
|
this.form.faceUrl.splice(0, 1);
|
},
|
beforeUoload() {},
|
handlePictureCardPreview(file) {
|
this.dialogImageUrl = file.url;
|
this.dialogVisible = true;
|
},
|
async uploadCar(param) {
|
const fd = new FormData();
|
fd.append("file", param.file);
|
fd.append("picType", "0");
|
let res = await request({
|
method: "post",
|
url: `/data/api-v/dbperson/fileupload`,
|
data: fd,
|
});
|
if (res.success) {
|
this.form.carUrls.push({ url: "/httpImage/" + res.data.picUrl });
|
}
|
},
|
async uploadPerson(param) {
|
const fd = new FormData();
|
fd.append("file", param.file);
|
fd.append("picType", "1");
|
let res = await request({
|
method: "post",
|
url: `/data/api-v/dbperson/fileupload`,
|
data: fd,
|
});
|
if (res.success) {
|
this.form.faceUrl.push({ url: "/httpImage/" + res.data.picUrl });
|
this.form.faceFeature = res.data.faceFeature;
|
}
|
},
|
addCar() {
|
this.addDrawer = true;
|
},
|
addBatch() {
|
this.addBatchDrawer = true;
|
},
|
resetForm() {},
|
handleClose1(done) {
|
(this.form = {
|
id: "",
|
sex: "男",
|
name: "",
|
tableId: "",
|
picDesc: "",
|
idCard: "",
|
phoneNum: "",
|
monitorLevel: "one",
|
carUrls: [], //{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"},{url:"/httpImage/192.168.20.10:6701/818,56d0122c44f069"}
|
faceUrl: [],
|
faceFeature: "",
|
carPicUrls: "",
|
personPicUrl: "",
|
carColor: "0",
|
carType: "0",
|
carBrand: "0",
|
carNo: "",
|
enable: 0,
|
reserved: "",
|
}),
|
done();
|
// this.$confirm('确认关闭？')
|
// .then(_ => {
|
// done();
|
// })
|
// .catch(_ => {});
|
},
|
handleClose2(done) {
|
done();
|
// this.$confirm('确认关闭？')
|
// .then(_ => {
|
// done();
|
// })
|
// .catch(_ => {});
|
},
|
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=${id}`, {
|
method: "GET",
|
headers: {
|
"Content-Type": "application/json",
|
Authorization: token,
|
},
|
})
|
.then((res) => {
|
return res.json();
|
})
|
.then((data) => {
|
if (data.success) {
|
this.$notify({
|
type: "success",
|
message: "该人员删除成功！",
|
});
|
}
|
this.getCarList();
|
})
|
.catch((err) => {
|
});
|
})
|
.catch((_) => {});
|
},
|
sayHello() {
|
},
|
getUploadResult(result) {
|
this.uploadResult = result.data;
|
this.dialogVisible = true;
|
this.getCarList();
|
},
|
async getCarList() {
|
if (this.baseObject.id && this.baseObject.id !== undefined) {
|
this.BaseManageData.tableId = this.baseObject.id;
|
this.setLoadSearch(this.BaseManageData.queryPersonList());
|
}
|
},
|
changeDialog(data) {
|
data.erFileList.map((item, index) => {
|
this.$notify({
|
type: "error",
|
message: item.errorMsg.message,
|
});
|
});
|
},
|
handleClose() {
|
//this.getCarList();
|
this.dialogFormVisible = false;
|
},
|
handleSelectionChange(val) {
|
this.selectedRowKeys = val;
|
},
|
refrash(current, pageSize) {
|
this.current = current;
|
this.BaseManageData.page = current;
|
this.getCarList();
|
},
|
handleClick(row) {
|
this.form = row;
|
// 这块儿后台的字典value值有问题，需要前端来回转
|
this.form.carColor += "";
|
this.form.carType += "";
|
this.form.carBrand += "";
|
this.addDrawer = true;
|
},
|
async submit() {
|
this.$refs["formForEdit"].validate(async (valid) => {
|
if (valid) {
|
let { ...json } = this.form;
|
delete json["compareScore"];
|
let res = await updateBasePerson(json);
|
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.getCarList();
|
},
|
searchImg() {
|
this.$refs.uploadDrag && this.$refs.uploadDrag.uploadStart();
|
},
|
haveScore(row) {
|
if (row.compareScore && row.compareScore !== "") {
|
return true;
|
} else {
|
return false;
|
}
|
},
|
async searchImgList(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);
|
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);
|
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() {
|
},
|
uploadError() {
|
},
|
deleteBatch() {
|
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);
|
});
|
let res = await deleteBasePersons(ids);
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: "删除成功！",
|
});
|
this.getCarList();
|
} else {
|
this.$notify({
|
type: "error",
|
message: "删除失败！",
|
});
|
}
|
});
|
}
|
},
|
async init() {
|
await this.BaseManageData.querySyncTables();
|
await this.BaseManageData.queryLocalTables();
|
if (this.baseObject.id && this.baseObject.id !== undefined) {
|
} 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 }) {
|
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) {
|
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;
|
var compType = 0;
|
window.open(
|
href +
|
"?showType=findByPic&targetId=" +
|
captureId +
|
"&picSmUrl=" +
|
url +
|
"&compType=" +
|
compType
|
);
|
},
|
async platesBatch() {
|
var temp = this.plates.split(/[\n,]/g);
|
var reg = /[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领]{1}[A-Z]{1}[A-Z0-9]{5,6}/;
|
for (let i = 0; i < temp.length; i++) {
|
if (temp[i] == "") {
|
temp.splice(i, 1);
|
i--;
|
} else {
|
if (!reg.test(temp[i])) {
|
this.$notify({
|
type: "error",
|
message: "车牌号:" + temp[i] + "不符合规则，请检查!",
|
});
|
return;
|
}
|
}
|
}
|
if (temp.length == 0) {
|
this.$notify({
|
type: "error",
|
message: "请输入车牌号",
|
});
|
return;
|
}
|
let param = {
|
tableId: this.baseObject.id,
|
carNos: temp,
|
};
|
let resp = await plateBatch(param);
|
if (resp && resp.success) {
|
// 刷新car列表
|
this.$notify({
|
type: "success",
|
message: resp.msg,
|
});
|
this.getCarList();
|
this.addBatchDrawer = false;
|
} else {
|
this.$notify({
|
type: "error",
|
message: resp.msg,
|
});
|
}
|
},
|
async submitCar() {
|
this.$refs["formForCar"].validate(async (valid) => {
|
if (valid) {
|
let { ...json } = this.form;
|
|
for (let index in json.carUrls) {
|
if (index == 0) {
|
json.carPicUrls += json.carUrls[index].url.substring(11);
|
} else {
|
json.carPicUrls += ";" + json.carUrls[index].url.substring(11);
|
}
|
}
|
json.carColor = parseInt(json.carColor);
|
json.carType = parseInt(json.carType);
|
json.carBrand = parseInt(json.carBrand);
|
json.personPicUrl = json.faceUrl[0].url.substring(11);
|
json.tableId = this.baseObject.id;
|
delete json["compareScore"];
|
let res;
|
if (json.id == "") {
|
res = await addBaseCar(json);
|
} else {
|
res = await updateBaseCar(json);
|
}
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: res.data.msg,
|
});
|
this.getCarList();
|
this.addDrawer = false;
|
} else {
|
this.$notify({
|
type: "error",
|
message: res.data.msg,
|
});
|
}
|
} else {
|
return false;
|
}
|
});
|
},
|
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 = [];
|
},
|
getDataName: (dataList, key) => {
|
let name = "";
|
if (Array.isArray(dataList) && dataList.length > 0) {
|
for (let i = 0; i < dataList.length; i++) {
|
if (dataList[i].value == key) {
|
name = dataList[i].name;
|
}
|
}
|
}
|
return name;
|
},
|
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.getCarList();
|
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;
|
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) {
|
this.BaseManageData.cleanData();
|
this.getCarList();
|
},
|
deep: true,
|
},
|
"BaseManageData.selectBlacks": function (value) {
|
this.blackAngWhite();
|
},
|
"BaseManageData.selectWhites": function (value) {
|
this.blackAngWhite();
|
},
|
},
|
};
|
</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: 100px;
|
height: 100px;
|
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: 100%;
|
overflow: visible !important;
|
.picture {
|
.el-carousel__item {
|
display: flex;
|
justify-content: center;
|
align-items: Center;
|
overflow: hidden;
|
}
|
.el-carousel__container {
|
height: 100% !important;
|
.el-carousel__arrow {
|
top: 50% !important;
|
}
|
.el-carousel__arrow {
|
height: 20px;
|
width: 20px;
|
}
|
.el-carousel__arrow--right {
|
right: 5px !important;
|
}
|
.el-carousel__arrow--left {
|
left: 5px !important;
|
}
|
}
|
}
|
.el-carousel__container {
|
height: 100px;
|
.el-carousel__arrow {
|
width: 25px;
|
height: 25px;
|
}
|
}
|
.el-drawer.ltr,
|
.el-drawer.rtl {
|
width: 27% !important;
|
//height: 90%;
|
//top: 9%;
|
.el-drawer__header {
|
border-bottom: 2px solid #eee;
|
padding-bottom: 10px;
|
font-size: 16px;
|
margin-bottom: 0px;
|
}
|
}
|
}
|
|
.text-left {
|
.el-upload-list {
|
display: none;
|
}
|
}
|
.border-tabl {
|
border: 1px solid #ebeef5;
|
border-bottom: none;
|
height: calc(100% - 100px);
|
overflow: auto;
|
}
|
.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 .cell {
|
padding-left: 8px !important;
|
padding-right: 0px !important;
|
}
|
// .addToBase1 {
|
// 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;
|
// overflow-y: auto;
|
// margin-bottom: 20px;
|
// .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: 100px;
|
min-width: 100px;
|
min-height: 100px;
|
border: 1px solid #eee;
|
}
|
|
.inputWidth {
|
width: 270px !important;
|
}
|
.rightInputWidth {
|
max-width: 270px;
|
}
|
|
.el-drawer.ltr,
|
.el-drawer.rtl {
|
min-width: 450px;
|
width: 25% !important;
|
//height: 90%;
|
//min-height: 1100px;
|
//top: 9%;
|
.el-drawer__header {
|
border-bottom: 2px solid #eee;
|
padding-bottom: 10px;
|
font-size: 16px;
|
margin-bottom: 0px;
|
:focus {
|
outline: 0;
|
}
|
}
|
}
|
|
.drawerSpace {
|
height: calc(100% - 140px);
|
box-sizing: border-box;
|
margin-bottom: 30px;
|
overflow-y: scroll;
|
.uploadLine {
|
height: 280px;
|
|
.car-picture {
|
float: left;
|
margin: 15px;
|
border: 1px solid #eee;
|
width: 280px;
|
height: 260px;
|
overflow: hidden;
|
.el-upload--picture-card {
|
margin: 10px;
|
width: 110px;
|
height: 110px;
|
line-height: 35px;
|
}
|
.el-upload-list--picture-card {
|
.el-upload-list__item {
|
margin: 10px;
|
width: 110px;
|
height: 110px;
|
img {
|
object-fit: contain;
|
}
|
}
|
.el-progress--circle {
|
width: 30px !important;
|
}
|
}
|
}
|
.person-picture {
|
float: left;
|
margin-top: 15px;
|
width: 120px;
|
height: 120px;
|
overflow: hidden;
|
.el-upload--picture-card {
|
width: 110px;
|
height: 110px;
|
line-height: 35px;
|
}
|
.el-upload-list__item {
|
margin: 10px;
|
width: 110px;
|
height: 110px;
|
img {
|
object-fit: contain;
|
}
|
}
|
}
|
}
|
.plateAttach {
|
width: calc(100% - 40px);
|
height: calc(100% - 40px);
|
padding: 20px;
|
p {
|
margin-top: 20px;
|
width: 400px;
|
line-height: 20px;
|
}
|
}
|
}
|
</style>
|
