<template>
|
<div class="table-parent">
|
<el-row>
|
<div class="base-tip">
|
<div class="left-tips">
|
<span class="ku-name">{{ this.baseObject.tableName }}</span>
|
<span
|
class="list"
|
:class="
|
this.baseObject.bwType === '1' ? 'black-list' : 'white-list'
|
"
|
>{{ this.baseObject.bwType === "1" ? "黑名单" : "白名单" }}</span
|
>
|
<span class="ok-time"
|
>有效时间:{{ this.baseObject.startTime }} --
|
{{
|
this.baseObject.endTime ? this.baseObject.endTime : "永久有效"
|
}}</span
|
>
|
</div>
|
|
<div class="right-btns">
|
<span style="margin-right: 2px">底库状态(生效/失效)</span>
|
<el-switch
|
:active-value="1"
|
:width="52"
|
:inactive-value="0"
|
v-model="baseObject.enable"
|
active-color="#4E94FF"
|
inactive-color="#BBBBBB"
|
style="margin-right: 10px"
|
:disabled="isDisabled(baseObject)"
|
@change="setEnable(baseObject)"
|
>
|
</el-switch>
|
<div class="shutiao" v-if="baseObject.enable"></div>
|
<div class="shutiao1" v-else></div>
|
<el-tooltip content="删除" placement="top" popper-class="atooltip">
|
<span
|
class="iconfont iconfont-wrap iconshanchuku-09"
|
v-if="isShow('library:set')"
|
@click.stop="askDelete('base')"
|
></span>
|
</el-tooltip>
|
|
<el-tooltip content="编辑" placement="top" popper-class="atooltip">
|
<span
|
class="iconfont iconfont-wrap iconbianjiku-09"
|
@click.stop="edit"
|
v-if="isShow('library:set')"
|
></span>
|
</el-tooltip>
|
</div>
|
</div>
|
</el-row>
|
<div class="border-tabl">
|
<div class="head-search">
|
<div class="desc">
|
本库共有
|
<span class="nums">{{ BaseManageData.total }}条</span>
|
数据
|
</div>
|
<div class="right-group">
|
<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-button size="small" type="primary" @click="handleSearch"
|
>搜索</el-button
|
>
|
<el-tooltip
|
content="批量删除"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconfont-wrap iconpiliangshanchu-09"
|
@click="askDelete('batch')"
|
v-if="isShow('library:set')"
|
></span>
|
</el-tooltip>
|
|
<el-tooltip
|
content="上传照片"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<UploadBtn
|
limitTypes=".jpg,.png,.jpeg"
|
limitSize
|
uploadBtntext="上传照片"
|
uploadBtnIcon
|
v-if="isShow('library:set')"
|
uploadBtnSize="small"
|
:isDrag="true"
|
@addFilesBaBackFN="changeDialog"
|
@successFN="getUploadResult"
|
:idJson="{ tableId: baseObject.id }"
|
/>
|
</el-tooltip>
|
</div>
|
</div>
|
<el-table
|
id="multipleTable"
|
ref="multipleTable"
|
class="tableBox"
|
:data="BaseManageData.personList"
|
tooltip-effect="dark"
|
style="width: 100%; overflow: auto"
|
:fit="true"
|
cell-class-name="cell-classname"
|
@row-click="pickRow"
|
:default-sort="{ prop: 'createTime', order: 'descending' }"
|
@selection-change="handleSelectionChange"
|
border
|
:header-cell-style="{
|
background: '#fff',
|
color: '#222222',
|
padding: '2px 1px',
|
borderBottom: 'none',
|
}"
|
>
|
<el-table-column type="selection" width="40"></el-table-column>
|
<el-table-column prop="personPicUrl" label="照片" 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 label="生效状态" min-width="70">
|
<template slot-scope="scope">
|
<el-switch
|
v-model="scope.row.enable"
|
:active-value="1"
|
:disabled="!isShow('library:set')"
|
:inactive-value="0"
|
active-color="#4E94FF"
|
inactive-color="#C4C4C4"
|
@change="enable(scope.row)"
|
></el-switch>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="personName"
|
label="姓名"
|
min-width="70"
|
show-overflow-tooltip
|
sortable
|
></el-table-column>
|
<el-table-column
|
prop="sex"
|
label="性别"
|
min-width="60"
|
sortable
|
></el-table-column>
|
<el-table-column
|
prop="idCard"
|
label="身份证号"
|
min-width="150"
|
show-overflow-tooltip
|
sortable
|
></el-table-column>
|
<el-table-column
|
prop="phoneNum"
|
label="手机号"
|
min-width="100"
|
show-overflow-tooltip
|
sortable
|
></el-table-column>
|
<el-table-column
|
prop="monitorLevel"
|
label="等级"
|
min-width="50"
|
></el-table-column>
|
<el-table-column
|
prop="createTime"
|
label="入库时间"
|
min-width="140"
|
show-overflow-tooltip
|
sortable
|
></el-table-column>
|
<el-table-column label="操作" min-width="130">
|
<template slot-scope="scope">
|
<fTemplate authority="library:set">
|
<el-tooltip
|
content="编辑"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconbianjixinxi-09"
|
style="font-size: 24px; cursor: pointer"
|
@click="editRow(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<el-popover
|
placement="top"
|
trigger="click"
|
popper-class="popper-caozuo"
|
>
|
<el-tooltip
|
content="查找此人"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconchazhaociren-09"
|
@click="tosearch(scope.row)"
|
></span>
|
</el-tooltip>
|
<el-tooltip
|
content="查看详情"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconchakanxiangqing-09"
|
@click="showDetail(scope.row)"
|
></span>
|
</el-tooltip>
|
<fTemplate authority="library:set">
|
<el-tooltip
|
content="复制"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconfuzhi-09"
|
title="复制"
|
@click="copyClick(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<fTemplate authority="library:set">
|
<el-tooltip
|
content="移动"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconyidong-09"
|
title="移动"
|
@click="moveClick(scope.row)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<fTemplate authority="library:set" class="del-wrap">
|
<el-tooltip
|
content="删除"
|
placement="top"
|
popper-class="atooltip"
|
>
|
<span
|
class="iconfont iconshanchu-09"
|
@click="askDelete('single', scope.row.id)"
|
></span>
|
</el-tooltip>
|
</fTemplate>
|
<span
|
slot="reference"
|
class="iconfont icongengduocaozuo-09"
|
style="font-size: 24px; cursor: pointer"
|
></span>
|
</el-popover>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="refrash"
|
:current-page="BaseManageData.page"
|
:page-size="BaseManageData.size"
|
:page-sizes="[10, 20, 50, 100]"
|
style="margin-top: 10px"
|
layout="total,sizes,prev,pager,next,jumper"
|
:total="BaseManageData.total"
|
></el-pagination>
|
</div>
|
<el-dialog
|
title="抓拍详情"
|
:visible.sync="cameraDetailVisible"
|
okText="确定"
|
custom-class="zhuapai-dialog"
|
>
|
<div class="member-info">
|
<label class>
|
<img src="/images/library/个人信息.png" alt="" srcset="" />
|
</label>
|
<ul>
|
<li>
|
<span>{{ memberInfo.personName }}</span>
|
</li>
|
<li>
|
<span>{{ memberInfo.sex }}</span>
|
</li>
|
<li style="margin-right: 80px">
|
<span>{{ memberInfo.idCard }}</span>
|
</li>
|
<li>
|
<span>意图:</span>
|
<span>{{ memberInfo.reserved }}</span>
|
</li>
|
</ul>
|
</div>
|
|
<div class="top-bar">
|
<div style="display: flex">
|
<span style="margin-right: 10px">停留时长</span>
|
<el-input
|
size="mini"
|
style="width: 58px; margin-right: 4px"
|
v-model.number="reqCameraParams.thresholdTime"
|
></el-input
|
>s
|
</div>
|
<div style="display: flex">
|
<span style="margin-right: 10px">时期</span>
|
<el-date-picker
|
size="mini"
|
popper-class="popper-pick"
|
@change="timeChange"
|
v-model="timeRange"
|
align="center"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始时间"
|
end-placeholder="结束时间"
|
></el-date-picker>
|
</div>
|
|
<el-button size="mini" type="primary" @click="postCameraData"
|
>查询</el-button
|
>
|
</div>
|
<p style="text-align: right; font-size: 14px; color: #5f5f5f">
|
共{{ faceDataCount }}条数据
|
</p>
|
|
<el-table
|
:data="cameraDetailData"
|
tooltip-effect="dark"
|
:fit="true"
|
style="width: 100%; overflow: auto"
|
:header-cell-style="{
|
background: '#fff',
|
color: '#222222',
|
padding: '2px 1px',
|
borderBottom: 'none',
|
}"
|
>
|
<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>
|
|
<div class="bot-btn">
|
<el-button
|
size="mini"
|
type="primary"
|
@click="cameraDetailVisible = false"
|
>关闭</el-button
|
>
|
</div>
|
</el-dialog>
|
<el-drawer title="修改信息" :modal="false" :visible.sync="showInfoDrawer">
|
<el-form
|
ref="formForEdit"
|
:model="inputPersonForm"
|
label-width="100px"
|
: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: 70px"
|
>
|
<p
|
style="
|
background: rgba(0, 0, 0, 0.35);
|
width: 100px;
|
line-height: 30px;
|
color: #fff;
|
font-size: 13px;
|
opacity: 1;
|
"
|
>
|
点击修改照片
|
</p>
|
</div>
|
</div>
|
<img
|
v-if="`httpImage/` + inputPersonForm.personPicUrl"
|
:src="`/httpImage/` + inputPersonForm.personPicUrl"
|
style="
|
max-height: 100px;
|
width: 100px;
|
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: 20px">
|
<el-input
|
size="small"
|
v-model="inputPersonForm.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: 20px"
|
>
|
<el-input
|
size="small"
|
v-model="inputPersonForm.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: 20px">
|
<el-input
|
size="small"
|
v-model="inputPersonForm.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: 20px; text-align: left"
|
>
|
<el-radio-group v-model="inputPersonForm.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="身份证号"
|
prop="idCard"
|
style="width: 100%; margin-bottom: 20px"
|
>
|
<el-input
|
size="small"
|
v-model="inputPersonForm.idCard"
|
placeholder="请输入"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item
|
label="手机号"
|
prop="phoneNum"
|
style="width: 100%; margin-bottom: 20px"
|
>
|
<el-input
|
size="small"
|
v-model="inputPersonForm.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: 20px"
|
>
|
<el-select
|
size="small"
|
v-model="inputPersonForm.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: 20px"
|
>
|
<el-input
|
size="small"
|
v-model="inputPersonForm.fromServerId"
|
disabled
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item
|
label="入库时间"
|
style="width: 100%; margin-bottom: 20px"
|
>
|
<el-input
|
size="small"
|
v-model="inputPersonForm.createTime"
|
disabled
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="其他" style="width: 100%; margin-bottom: 20px">
|
<el-input
|
size="small"
|
v-model="inputPersonForm.reserved"
|
placeholder="请输入"
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<div class="dialog-footer">
|
<!-- {{BaseManageData.personList[1].idCard}} -->
|
<el-button
|
size="small"
|
class="cancel-btn"
|
@click="handleClose"
|
type="info"
|
>取消</el-button
|
>
|
<el-button size="small" class="sure-btn" type="primary" @click="submit"
|
>确定</el-button
|
>
|
</div>
|
</el-drawer>
|
<el-dialog
|
:visible.sync="dialogVisible"
|
:close="getPersonList"
|
:center="true"
|
custom-class="suc-dialog"
|
>
|
<div>
|
<div class="suc-icon">
|
<i class="iconfont iconduigou3"></i>
|
</div>
|
<div class="tt">上传成功</div>
|
<div class="flex-box">
|
<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>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
<el-button type="primary" @click="dialogVisible = false"
|
>确 定</el-button
|
>
|
</span>
|
</el-dialog>
|
|
<!-- 确认删除对话框 -->
|
<el-dialog
|
:visible.sync="askDeleteShow"
|
:center="true"
|
custom-class="del-dialog"
|
>
|
<div>
|
<div class="suc-icon">
|
<i class="iconfont icongantanhao1"></i>
|
</div>
|
<div class="tt">{{ delText[0] }}</div>
|
<div class="flex-box">
|
<span>{{ delText[1] }}</span>
|
</div>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="askDeleteShow = false">取 消</el-button>
|
<el-button type="primary" @click="handleDel" :loading="delBtnLoading"
|
>确 定</el-button
|
>
|
</span>
|
</el-dialog>
|
|
<el-dialog
|
title="复制到"
|
:visible.sync="copyVisiabled"
|
okText="保存"
|
custom-class="copy-dialog"
|
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"
|
:class="
|
BaseManageData.selectBlacks.includes(item.value)
|
? 'white-wrap'
|
: ''
|
"
|
>
|
<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"
|
:class="
|
BaseManageData.selectWhites.includes(item.value)
|
? 'white-wrap'
|
: ''
|
"
|
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="保存"
|
custom-class="copy-dialog"
|
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"
|
:class="
|
BaseManageData.selectBlacks.includes(item.value)
|
? 'white-wrap'
|
: ''
|
"
|
>
|
<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"
|
:class="
|
BaseManageData.selectWhites.includes(item.value)
|
? 'white-wrap'
|
: ''
|
"
|
>
|
<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,
|
updateDbTableStatus,
|
deleteDbPersonById,
|
deleteDBtablesById,
|
} from "@/api/baseLibrary";
|
import { getCameraFaceData } from "@/api/es";
|
import { isIDCard } from "../../../scripts/validate";
|
|
import axios from "axios";
|
import UploadBtn from "./upload";
|
import fTemplate from "@/components/fTemplate";
|
import UploadIcon from "@/components/searching/UploadIcon.vue";
|
function isPhone(rule, value, callback) {
|
if (!value) {
|
return callback();
|
} else if (value.trim()) {
|
var pattern = /^1[345789]\d{9}$/;
|
if (pattern.test(value)) {
|
return callback();
|
}
|
return callback(new Error("输入的手机号错误"));
|
}
|
}
|
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 {
|
components: {
|
UploadBtn,
|
fTemplate,
|
UploadIcon,
|
},
|
props: {
|
baseObject: {
|
default: () => {},
|
type: Object,
|
},
|
syncType: {
|
type: String,
|
},
|
},
|
computed: {
|
isAdmin() {
|
if (
|
sessionStorage.getItem("userInfo") &&
|
sessionStorage.getItem("userInfo") !== ""
|
) {
|
let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username;
|
return loginName === "superadmin" || loginName === "basic";
|
}
|
return false;
|
},
|
delText() {
|
switch (this.delType) {
|
case "base":
|
return ["删除底库", "确定删除该底库?"];
|
case "single":
|
return ["删除人员", "确定删除该底库人员?"];
|
case "batch":
|
return ["批量删除", "确定删除该底库选中人员?"];
|
default:
|
return ["", ""];
|
}
|
},
|
},
|
data() {
|
return {
|
timeRange: [
|
new Date(2020, 7, 25, 8),
|
new Date(new Date().setHours(23, 59, 59)),
|
],
|
memberInfo: {
|
personName: "",
|
sex: "",
|
idCard: "",
|
reserved: "",
|
},
|
askDeleteShow: false,
|
toDeleteId: "",
|
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,
|
copyVisiabled: false,
|
moveVisiabled: false,
|
buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
|
searchName: "",
|
current: 1,
|
compare: false,
|
pageSize: 10,
|
total: 0,
|
orderType: "desc",
|
orderName: "createTime",
|
contentValue: "",
|
visible: false,
|
showInfoDrawer: false,
|
selectedRowKeys: [],
|
inputPersonForm: {},
|
rules: {
|
picDesc: [
|
{ required: true, message: "请输入照片标识", trigger: "change" },
|
],
|
sex: [{ required: true, message: "请勾选性别", trigger: "change" }],
|
idCard: [{ validator: isIDCard, trigger: "blur" }],
|
phoneNum: [{ validator: isPhone, trigger: "blur" }],
|
monitorLevel: [
|
{ required: true, message: "请选择人员等级", trigger: "change" },
|
],
|
},
|
tableData: [],
|
oldWidth: "",
|
oldHeight: "",
|
delType: "",
|
faceDataCount: 0,
|
// 上传后的弹框显示
|
dialogVisible: false,
|
// 批量上传后的返回结果
|
uploadResult: {
|
failList: [],
|
successList: [],
|
multiFaceList: [],
|
noFaceList: [],
|
},
|
delBtnLoading: false,
|
};
|
},
|
|
watch: {
|
"BaseManageData.selectBlacks": function (value) {
|
this.blackAngWhite();
|
},
|
"BaseManageData.selectWhites": function (value) {
|
this.blackAngWhite();
|
},
|
},
|
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) {
|
return (
|
this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
|
);
|
},
|
pickRow(row, column, event) {
|
this.$refs.multipleTable.toggleRowSelection(row);
|
},
|
toggleSelection(rows) {
|
if (rows) {
|
rows.forEach((row) => {
|
this.$refs.multipleTable.toggleRowSelection(row);
|
});
|
} else {
|
this.$refs.multipleTable.clearSelection();
|
}
|
},
|
askDelete(typ, id) {
|
if (typ == "batch") {
|
if (this.selectedRowKeys.length === 0) {
|
this.$notify({
|
type: "warning",
|
message: "请选择要删除的人员",
|
duration: 1000000,
|
});
|
return;
|
}
|
}
|
this.askDeleteShow = true;
|
this.delType = typ;
|
id && (this.toDeleteId = id);
|
},
|
getUploadResult(result) {
|
this.uploadResult = result.data;
|
this.dialogVisible = true;
|
this.getPersonList();
|
},
|
async setEnable(item) {
|
let res = await updateDbTableStatus({
|
id: item.id,
|
enable: item.enable,
|
});
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: "底库成功变更生效状态!",
|
});
|
} else {
|
this.$notify({
|
type: "error",
|
message: "底库变更生效状态失败!",
|
});
|
}
|
},
|
isDisabled(item) {
|
var flag = true;
|
if (this.isShow("library:set")) {
|
if (item.endTime == "") {
|
flag = false;
|
} else {
|
flag = !this.$moment(new Date()).isBetween(
|
item.startTime,
|
item.endTime
|
);
|
}
|
}
|
return flag;
|
},
|
edit() {
|
this.$emit("changeShow", this.baseObject, this.syncType);
|
},
|
|
deleteThis() {
|
debugger;
|
deleteDbPersonById({ id: this.toDeleteId })
|
.then((data) => {
|
if (data.success) {
|
this.$notify({
|
type: "success",
|
message: "该人员删除成功!",
|
});
|
}
|
this.getPersonList();
|
})
|
.catch((err) => {});
|
},
|
deleteBase() {
|
deleteDBtablesById({ id: this.baseObject.id })
|
.then((res) => {
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: "底库删除成功!",
|
});
|
}
|
|
this.$emit("onDelete");
|
})
|
.catch((err) => {
|
this.$notify({
|
type: "error",
|
message: err,
|
});
|
});
|
},
|
async deleteBatch() {
|
let ids = [];
|
this.selectedRowKeys.map((item, index) => {
|
ids.push(item.id);
|
});
|
let res = await deleteBasePersons({ ids: ids });
|
if (res.success) {
|
this.$notify({
|
type: "success",
|
message: "删除成功!",
|
});
|
this.getPersonList();
|
} else {
|
this.$notify({
|
type: "error",
|
message: "删除失败!",
|
});
|
}
|
},
|
async getPersonList() {
|
this.$nextTick(() => {
|
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,
|
customClass: "PersonListDialog",
|
});
|
});
|
},
|
handleClose() {
|
this.showInfoDrawer = false;
|
},
|
handleSelectionChange(val) {
|
this.selectedRowKeys = val;
|
},
|
refrash(current, pageSize) {
|
this.current = current;
|
this.BaseManageData.page = current;
|
this.getPersonList();
|
},
|
handleSizeChange(val) {
|
this.BaseManageData.size = val;
|
this.getPersonList();
|
},
|
editRow(row) {
|
this.inputPersonForm = { ...row };
|
this.showInfoDrawer = true;
|
},
|
async submit() {
|
this.$refs["formForEdit"].validate(async (valid) => {
|
if (valid) {
|
let { ...json } = this.inputPersonForm;
|
delete json["compareScore"];
|
let res = await updateBasePerson(json);
|
if (res.success) {
|
this.getPersonList();
|
this.$notify.success("人员修改成功!");
|
this.showInfoDrawer = false;
|
} else {
|
this.$notify.error("人员修改失败,请重试!");
|
}
|
} else {
|
return false;
|
}
|
});
|
},
|
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();
|
},
|
async handleDel() {
|
this.delBtnLoading = true;
|
if (this.delType == "single") {
|
await this.deleteThis();
|
} else if (this.delType == "base") {
|
await this.deleteBase();
|
} else if (this.delType == "batch") {
|
await this.deleteBatch();
|
}
|
|
this.delBtnLoading = false;
|
this.askDeleteShow = false;
|
},
|
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.inputPersonForm.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.inputPersonForm.persoasyncnPicUrl = res.data.data.personPicUrl;
|
this.inputPersonForm.faceFeature = res.data.data.faceFeature;
|
}
|
},
|
uploadSuccess() {},
|
uploadError() {},
|
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();
|
}
|
},
|
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) {
|
//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 = 0;
|
|
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;
|
if (width !== this.oldWidth && width < 1750) {
|
}
|
this.$nextTick(() => {
|
this.$refs.multipleTable.doLayout();
|
});
|
};
|
this.$nextTick(() => {
|
this.$refs.multipleTable.doLayout();
|
});
|
},
|
beforeDestroy() {
|
window.onresize = null;
|
},
|
};
|
</script>
|
<style lang="scss">
|
.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;
|
}
|
.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 {
|
height: 100%;
|
overflow: visible !important;
|
.zhuapai-dialog {
|
border-radius: 24px;
|
top: 50%;
|
min-height: 625px;
|
.bot-btn {
|
position: absolute;
|
bottom: 20px;
|
left: calc(50% - 75px);
|
.el-button--mini {
|
padding: 10px 34px;
|
font-size: 14px;
|
background: var(--colorCard) !important;
|
border-color: var(--colorCard) !important;
|
width: 150px;
|
border-radius: 18px;
|
}
|
}
|
.el-dialog__body {
|
padding-top: 0;
|
.el-table::before {
|
visibility: hidden;
|
}
|
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
background-color: var(--colorCard);
|
border-color: var(--colorCard);
|
}
|
.el-checkbox__input.is-checked .el-checkbox__inner {
|
background-color: var(--colorCard);
|
border-color: var(--colorCard);
|
}
|
.el-table th.el-table__cell > .cell {
|
background: #f7f8fa;
|
height: 38px;
|
line-height: 38px;
|
}
|
.el-table__body tr.hover-row > td.el-table__cell {
|
background-color: #ffffff !important;
|
}
|
}
|
.el-dialog__header {
|
box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
|
text-align: center;
|
.el-dialog__title {
|
line-height: 22px;
|
font-size: 16px;
|
color: #5f5f5f;
|
}
|
.el-dialog__headerbtn .el-dialog__close {
|
color: #999999;
|
}
|
}
|
}
|
.base-tip {
|
text-align: left;
|
font-size: 14px;
|
color: #000000;
|
background: #ffffff;
|
border-radius: 8px;
|
box-shadow: 0px 0px 6px 1px rgb(143 159 191 / 15%);
|
height: 70px;
|
line-height: 70px;
|
color: rgb(102, 102, 102);
|
padding: 0 20px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.ku-name {
|
font-weight: bold;
|
font-size: 16px;
|
line-height: 22px;
|
color: #5f5f5f;
|
margin-right: 10px;
|
}
|
.right-btns {
|
display: flex;
|
align-items: center;
|
cursor: pointer;
|
.shutiao {
|
width: 1.73px;
|
height: 8.67px;
|
background: var(--colorCard);
|
border-radius: 1px;
|
position: absolute;
|
right: 125px;
|
transition: 0.5s;
|
}
|
|
.shutiao1 {
|
width: 1.73px;
|
height: 8.67px;
|
background: #bbbbbb;
|
border-radius: 1px;
|
position: absolute;
|
right: 153px;
|
transform: rotate(90deg);
|
transition: 0.5s;
|
}
|
.el-switch__core {
|
height: 26px;
|
border-radius: 18px;
|
}
|
.el-switch__core:after {
|
width: 20px;
|
height: 20px;
|
top: 2px;
|
}
|
.el-switch.is-checked .el-switch__core::after {
|
margin-left: -22px;
|
}
|
.iconshanchuku-09 {
|
color: #fe6d68;
|
}
|
.iconshanchuku-09:hover {
|
background: #fe6d68;
|
border: 1px solid #fe6d68;
|
color: #fff;
|
}
|
.iconbianjiku-09 {
|
color: rgb(102, 102, 102);
|
}
|
.iconbianjiku-09:hover {
|
border: 1px solid var(--colorCard);
|
background: var(--colorCard);
|
color: #fff;
|
}
|
}
|
.ok-time {
|
color: #999999;
|
font-size: 12px;
|
line-height: 17px;
|
margin-left: 20px;
|
}
|
.list {
|
border-radius: 9px;
|
height: 18px;
|
width: 52px;
|
display: inline-block;
|
line-height: 18px;
|
font-weight: bold;
|
font-size: 12px;
|
text-align: center;
|
}
|
.white-list {
|
background: rgba(36, 178, 156, 0.3);
|
color: #24b29c;
|
}
|
.black-list {
|
background: rgba(255, 61, 59, 0.3);
|
color: #ff3d3b;
|
}
|
}
|
.el-drawer {
|
box-shadow: -4px 0px 8px rgb(0 0 0 / 16%);
|
border-radius: 24px 0px 0px 24px;
|
min-width: 380px;
|
.el-drawer__header > :first-child {
|
font-size: 16px;
|
}
|
.el-drawer__header {
|
padding: 15px 20px;
|
box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
|
margin-bottom: 0;
|
}
|
.el-drawer__body {
|
padding: 20px;
|
.el-input.is-disabled .el-input__inner {
|
border: 1px solid #d4d6d9;
|
border-radius: 16px;
|
background: #edeff2;
|
color: #bbbbbb;
|
font-size: 14px;
|
}
|
.el-form-item.is-error .el-input__inner,
|
.el-form-item.is-error .el-input__inner:focus,
|
.el-form-item.is-error .el-textarea__inner,
|
.el-form-item.is-error .el-textarea__inner:focus,
|
.el-message-box__input input.invalid,
|
.el-message-box__input input.invalid:focus {
|
border-color: #f56c6c;
|
}
|
.el-radio__input.is-checked .el-radio__inner {
|
border-color: var(--colorCard);
|
background: var(--colorCard);
|
}
|
.el-form-item__label {
|
line-height: 32px;
|
}
|
.el-form-item__content {
|
line-height: 32px;
|
}
|
.el-input--small {
|
font-size: 14px;
|
.el-input__inner {
|
border: 1px solid #d4d6d9;
|
box-sizing: border-box;
|
border-radius: 16px;
|
}
|
}
|
.el-form-item__label {
|
color: #999999;
|
}
|
.el-form-item__error {
|
color: #fe6d68;
|
padding-top: 2px;
|
left: 15px;
|
}
|
.el-form-item.is-required:not(.is-no-asterisk)
|
> .el-form-item__label:before {
|
color: #fe6d68;
|
}
|
.el-col-20 {
|
width: 92.3333%;
|
}
|
.dialog-footer {
|
margin-top: 10px;
|
.sure-btn {
|
padding: 11px 65px;
|
font-size: 14px;
|
border-radius: 18px;
|
border-color: var(--colorCard) !important;
|
background: var(--colorCard) !important;
|
color: #fff;
|
}
|
.cancel-btn {
|
padding: 11px 65px;
|
font-size: 14px;
|
border-radius: 18px;
|
background: #ffffff;
|
border-color: #999999;
|
color: #999999;
|
}
|
}
|
}
|
}
|
}
|
.text-left {
|
.el-upload-list {
|
display: none;
|
}
|
}
|
|
.border-tabl {
|
border: 1px solid #ebeef5;
|
border-bottom: none;
|
display: flex;
|
flex-direction: column;
|
border-radius: 8px;
|
background: #ffffff;
|
padding: 10px;
|
margin-top: 8px;
|
box-shadow: 0px 0px 6px 1px rgb(143 159 191 / 15%);
|
.tableBox {
|
border: none;
|
&::before,
|
&::after {
|
display: none;
|
}
|
.el-table--border .el-table__cell,
|
.el-table__body-wrapper
|
.el-table--border.is-scrolling-left
|
~ .el-table__fixed {
|
border-right: none;
|
}
|
td {
|
border: none;
|
}
|
}
|
.cell-classname {
|
background-color: #ffffff;
|
}
|
.head-search {
|
font-size: 14px;
|
line-height: 20px;
|
color: #5f5f5f;
|
display: flex;
|
margin: 15px 10px 20px 10px;
|
justify-content: space-between;
|
align-items: center;
|
.desc {
|
min-width: fit-content;
|
margin-right: 20px;
|
}
|
.right-group {
|
display: flex;
|
.el-input--small {
|
width: 320px;
|
}
|
.iconpiliangshanchu-09 {
|
color: #fe6d68;
|
}
|
.iconpiliangshanchu-09:hover {
|
background: #fe6d68;
|
border: 1px solid #fe6d68;
|
color: #fff;
|
}
|
.el-button--small {
|
padding: 8px 45px;
|
position: relative;
|
font-size: 14px;
|
background: var(--colorCard) !important;
|
border-radius: 0px 18px 18px 0px;
|
border-color: var(--colorCard) !important;
|
color: #fff;
|
margin-right: 10px;
|
}
|
|
.el-button--small:hover {
|
filter: brightness(92%);
|
}
|
.el-input__suffix {
|
top: 6px;
|
right: 10px;
|
}
|
.el-input--small .el-input__inner {
|
height: 32px;
|
line-height: 33px;
|
border: 1px solid #d4d6d9;
|
border-radius: 18px 0px 0px 18px;
|
width: 320px;
|
|
.el-input__inner::placeholder {
|
font-size: 14px;
|
line-height: 20px;
|
color: #bbbbbb;
|
}
|
}
|
.el-input--small .el-input__inner:focus {
|
border: 1px solid var(--colorCard);
|
}
|
// .compearValue
|
.compearValue {
|
.el-input-number__decrease,
|
.el-input-number__increase {
|
background-color: transparent;
|
border: none;
|
width: fit-content;
|
margin-right: 10px;
|
margin: 2px 10px 2px 0;
|
}
|
.el-input-number--mini {
|
width: 72px;
|
}
|
}
|
.uploadIconBox .left-section1 .el-input__inner {
|
height: 32px;
|
line-height: 32px;
|
border: 1px solid #d4d6d9;
|
width: inherit;
|
border-radius: 16px;
|
padding: 0;
|
padding-left: 10px;
|
text-align: left;
|
font-size: 14px;
|
color: #5f5f5f;
|
}
|
}
|
.nums {
|
font-weight: bold;
|
font-size: 15px;
|
}
|
}
|
.el-table::before {
|
visibility: hidden;
|
}
|
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
background-color: var(--colorCard);
|
border-color: var(--colorCard);
|
}
|
.el-checkbox__input.is-checked .el-checkbox__inner {
|
background-color: var(--colorCard);
|
border-color: var(--colorCard);
|
}
|
.el-table th.el-table__cell > .cell {
|
background: #f7f8fa;
|
height: 38px;
|
line-height: 38px;
|
}
|
.el-table__body tr.hover-row > td.el-table__cell {
|
background-color: #ffffff !important;
|
}
|
.hover-row {
|
cursor: pointer;
|
}
|
.hover-row:hover {
|
td {
|
background-color: #fff;
|
border-top: 1px solid var(--colorCard);
|
border-bottom: 1px solid var(--colorCard);
|
|
&:first-child {
|
background-color: #fff;
|
border-radius: 20px 0 0 20px;
|
border-left: 1px solid var(--colorCard);
|
border-bottom: 1px solid var(--colorCard);
|
}
|
|
&:last-child {
|
border-radius: 0 20px 20px 0;
|
background-color: #fff;
|
border-right: 1px solid var(--colorCard);
|
border-bottom: 1px solid var(--colorCard);
|
}
|
}
|
}
|
.el-table td.el-table__cell div {
|
-webkit-box-sizing: border-box;
|
box-sizing: border-box;
|
line-height: inherit;
|
}
|
::-webkit-scrollbar-thumb {
|
border-radius: 6px;
|
background-color: #dfdfdf;
|
}
|
::-webkit-scrollbar {
|
background-color: transparent;
|
}
|
::-webkit-scrollbar-track {
|
background-color: transparent;
|
box-shadow: none;
|
}
|
}
|
.el-dialog {
|
min-width: 515px;
|
.el-button--info {
|
color: #222;
|
}
|
}
|
.iconfont-wrap {
|
border: 1px solid #d3d5d9;
|
box-sizing: border-box;
|
border-radius: 8px;
|
display: inline-block;
|
width: 32px;
|
height: 32px;
|
cursor: pointer;
|
line-height: 32px;
|
text-align: center;
|
font-size: 23px;
|
transition: all 0.2s;
|
margin-left: 10px;
|
}
|
.el-dialog__header {
|
padding: 20px 0 10px;
|
text-align: left;
|
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;
|
}
|
|
.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;
|
margin: 20px 0 10px 0;
|
|
color: #999;
|
.el-button--mini {
|
padding: 8px 15px;
|
font-size: 14px;
|
border-radius: 3px;
|
background: var(--colorCard) !important;
|
border-radius: 16px;
|
border-color: var(--colorCard) !important;
|
width: 128px;
|
}
|
.el-input--mini .el-input__inner {
|
height: 32px;
|
line-height: 32px;
|
border: 1px solid #d4d5d8;
|
border-radius: 16px;
|
}
|
.el-range-editor--mini.el-input__inner {
|
height: 32px;
|
border-radius: 16px;
|
border: 1px solid #d4d5d8;
|
width: 370px;
|
}
|
.el-range-editor--mini .el-range__icon,
|
.el-range-editor--mini .el-range__close-icon {
|
line-height: 25px;
|
}
|
.el-date-range-picker__time-header > .el-icon-arrow-right {
|
color: #d4d5d8;
|
}
|
.el-range-editor--mini .el-range-separator {
|
line-height: 32px;
|
font-size: 12px;
|
height: 32px;
|
color: #d4d5d8;
|
}
|
.el-range-editor--mini .el-range-input {
|
font-size: 14px;
|
}
|
}
|
.el-dialog.el-dialog--center.suc-dialog {
|
border-radius: 24px;
|
height: 290px;
|
width: 360px;
|
.el-dialog__header {
|
box-shadow: none;
|
padding: 10px;
|
}
|
.el-dialog__headerbtn .el-dialog__close {
|
color: #999999;
|
font-size: 20px;
|
}
|
.el-dialog__body {
|
text-align: center;
|
padding: 0 20px 10px 20px;
|
}
|
.suc-icon {
|
margin-bottom: 20px;
|
text-align: center;
|
|
.iconfont {
|
font-size: 40px;
|
color: #13ce66;
|
}
|
}
|
.dialog-footer {
|
.el-button--default {
|
color: #999999;
|
background: #fff;
|
padding: 9px 37px;
|
font-size: 14px;
|
border: 1px solid #999999;
|
border-radius: 18px;
|
width: 150px;
|
}
|
.el-button--primary {
|
background: var(--colorCard) !important;
|
padding: 9px 37px;
|
color: #fff;
|
border: 1px solidvar(--colorCard) !important;
|
border-radius: 18px;
|
font-size: 14px;
|
width: 150px;
|
}
|
}
|
.tt {
|
font-weight: bold;
|
text-align: center;
|
|
font-size: 16px;
|
line-height: 22px;
|
color: #5f5f5f;
|
margin-bottom: 10px;
|
}
|
.flex-box {
|
font-size: 14px;
|
line-height: 20px;
|
display: flex;
|
justify-content: center;
|
color: #5f5f5f;
|
}
|
}
|
.el-dialog.copy-dialog {
|
width: 550px;
|
border-radius: 24px;
|
.el-dialog__header {
|
text-align: center;
|
}
|
.el-dialog__headerbtn .el-dialog__close {
|
color: #999999;
|
font-size: 20px;
|
}
|
.el-dialog__title {
|
line-height: 22px;
|
font-size: 16px;
|
color: #5f5f5f;
|
}
|
.el-dialog__body {
|
padding: 20px 15px;
|
color: #5f5f5f;
|
}
|
.dialog-footer {
|
// width: 315px;
|
.el-button--info {
|
color: #999999;
|
background: #fff;
|
padding: 9px 37px;
|
font-size: 14px;
|
border: 1px solid #999999;
|
border-radius: 18px;
|
width: 150px;
|
}
|
.el-button--primary {
|
background: var(--colorCard) !important;
|
padding: 9px 37px;
|
color: #fff;
|
border: 1px solidvar(--colorCard) !important;
|
border-radius: 18px;
|
font-size: 14px;
|
width: 150px;
|
}
|
}
|
.addToBase1 {
|
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%;
|
min-height: 150px;
|
margin-bottom: 10px;
|
.lable {
|
font-size: 16px;
|
font-weight: bold;
|
text-align: left;
|
margin-bottom: 10px;
|
}
|
.baseList {
|
height: 100%;
|
overflow: auto;
|
.base {
|
width: 152px;
|
padding: 5px 5px 5px 10px;
|
line-height: 30px;
|
box-sizing: border-box;
|
float: left;
|
text-align: left;
|
background: #eff1f5;
|
border-radius: 8px;
|
margin: 0 10px;
|
margin-bottom: 10px;
|
.el-checkbox__input.is-checked .el-checkbox__inner {
|
background-color: var(--colorCard);
|
border-color: var(--colorCard);
|
}
|
.el-checkbox {
|
width: 100%;
|
display: block;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
.el-checkbox__label {
|
display: inline !important;
|
padding-left: 6px;
|
line-height: 20px;
|
color: #5f5f5f;
|
}
|
}
|
}
|
.white-wrap {
|
background: #ffffff;
|
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.16);
|
}
|
}
|
}
|
}
|
}
|
.el-dialog.el-dialog--center.del-dialog {
|
border-radius: 24px;
|
height: 235px;
|
width: 360px;
|
.el-dialog__header {
|
box-shadow: none;
|
padding: 10px;
|
}
|
.el-dialog__headerbtn .el-dialog__close {
|
color: #999999;
|
font-size: 20px;
|
}
|
.el-dialog__body {
|
text-align: center;
|
padding: 0 20px 10px 20px;
|
}
|
.suc-icon {
|
margin-bottom: 20px;
|
text-align: center;
|
|
.iconfont {
|
font-size: 40px;
|
color: #fe6d68;
|
}
|
}
|
.dialog-footer {
|
.el-button--default {
|
color: #999999;
|
background: #fff;
|
padding: 9px 37px;
|
font-size: 14px;
|
border: 1px solid #999999;
|
border-radius: 18px;
|
width: 150px;
|
}
|
.el-button--primary {
|
background: var(--colorCard) !important;
|
padding: 9px 37px;
|
color: #fff;
|
border: 1px solidvar(--colorCard) !important;
|
border-radius: 18px;
|
font-size: 14px;
|
width: 150px;
|
}
|
}
|
.tt {
|
font-weight: bold;
|
text-align: center;
|
|
font-size: 16px;
|
line-height: 22px;
|
color: #5f5f5f;
|
margin-bottom: 10px;
|
}
|
.flex-box {
|
font-size: 14px;
|
line-height: 20px;
|
display: flex;
|
justify-content: center;
|
color: #5f5f5f;
|
}
|
}
|
.member-info {
|
padding: 20px 0;
|
display: flex;
|
border-bottom: 1px solid #eff1f5;
|
label {
|
color: #999;
|
margin-right: 20px;
|
}
|
ul {
|
display: flex;
|
align-items: center;
|
li {
|
margin-right: 20px;
|
font-weight: bold;
|
}
|
}
|
}
|
|
.el-picker-panel.el-date-range-picker.el-popper.popper-pick {
|
border-radius: 8px;
|
.el-input--small .el-input__inner {
|
border: 1px solid #d4d5d8;
|
border-radius: 16px;
|
}
|
.el-date-range-picker__time-header {
|
border-bottom: none;
|
}
|
.el-picker-panel__footer {
|
border-top: none;
|
text-align: center;
|
padding-bottom: 10px;
|
border-radius: inherit;
|
}
|
.el-date-range-picker .el-picker-panel__content {
|
margin: 0;
|
padding: 5px 15px;
|
}
|
.el-button--text {
|
color: #999999;
|
background: #fff;
|
padding: 9px 37px;
|
font-size: 14px;
|
border: 1px solid #999999;
|
border-radius: 18px;
|
}
|
.el-date-table td.start-date span,
|
.el-date-table td.end-date span {
|
background-color: var(--colorCard);
|
}
|
.el-date-table td.in-range div {
|
background-color: var(--colorCard) 17;
|
}
|
.el-button--default {
|
background: var(--colorCard);
|
padding: 9px 37px;
|
color: #fff;
|
border: 1px solidvar(--colorCard);
|
border-radius: 18px;
|
font-size: 14px;
|
}
|
}
|
.el-popover.el-popper.popper-caozuo {
|
box-shadow: 0px 0px 10px rgb(0 0 0 / 12%);
|
border-radius: 8px;
|
padding: 0;
|
padding-right: 1px;
|
& > span {
|
width: 32px;
|
height: 32px;
|
cursor: pointer;
|
display: inline-block;
|
text-align: center;
|
line-height: 32px;
|
border-radius: 8px;
|
font-size: 24px;
|
.iconfont {
|
font-size: 24px;
|
}
|
.iconshanchu-09 {
|
color: #fe6d68;
|
}
|
}
|
& > span:hover {
|
background: var(--colorCard);
|
color: #fff;
|
}
|
& > .del-wrap:hover {
|
background: #fe6d68;
|
.iconshanchu-09 {
|
color: #fff;
|
}
|
}
|
}
|
|
.PersonListDialog {
|
width: 360px !important;
|
}
|
</style>
|