940 lines
34 KiB
Vue
940 lines
34 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<el-row :gutter="20">
|
||
<!--部门数据-->
|
||
<el-col :span="4" :xs="24">
|
||
<div class="head-container">
|
||
<el-input
|
||
v-model="branchName"
|
||
placeholder="请输入部门名称"
|
||
clearable
|
||
size="small"
|
||
prefix-icon="el-icon-search"
|
||
style="margin-bottom: 20px"
|
||
/>
|
||
</div>
|
||
<div class="head-container">
|
||
<el-tree
|
||
:data="branchOptions"
|
||
:props="defaultProps"
|
||
node-key="id"
|
||
:expand-on-click-node="false"
|
||
:filter-node-method="filterNode"
|
||
ref="treeRef"
|
||
@node-click="handleNodeClick"
|
||
:default-expanded-keys="nodeKey">
|
||
<!-- <span slot-scope="{ node, data }">
|
||
<el-tooltip class="item" effect="dark" :content="node.label" placement="right">
|
||
<span class="custom-tree-node">{{ node.label }}</span>
|
||
</el-tooltip>
|
||
</span> -->
|
||
</el-tree>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="20" :xs="24">
|
||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
|
||
<el-form-item label="人员名称" prop="name">
|
||
<el-input
|
||
v-model="queryParams.name"
|
||
placeholder="请输入人员名称"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="联系电话" prop="phone">
|
||
<el-input
|
||
v-model="queryParams.phone"
|
||
placeholder="请输入联系电话"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item label="身份证号码" prop="idcard">
|
||
<el-input
|
||
v-model="queryParams.idcard"
|
||
placeholder="请输入"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="是否注册" prop="guidFlag">
|
||
<el-select v-model="queryParams.guidFlag" placeholder="请选择" clearable @keyup.enter.native="handleQuery" >
|
||
<el-option key="yzc" label="已注册" value="yzc" />
|
||
<el-option key="wzc" label="未注册" value="wzc" />
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="是否下发" prop="downFlag">
|
||
<el-select v-model="queryParams.downFlag" placeholder="请选择" clearable @keyup.enter.native="handleQuery" >
|
||
<el-option key="yxf" label="已下发" value="yxf" />
|
||
<el-option key="wxf" label="未下发" value="wxf" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="人脸注册" prop="faceFlag">
|
||
<el-select v-model="queryParams.faceFlag" placeholder="请选择" clearable @keyup.enter.native="handleQuery" >
|
||
<el-option key="yzc" label="已注册人脸" value="yzc" />
|
||
<el-option key="wzc" label="未注册人脸" value="wzc" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="卡号注册" prop="cardFlag">
|
||
<el-select v-model="queryParams.cardFlag" placeholder="请选择" clearable @keyup.enter.native="handleQuery" >
|
||
<el-option key="yzc" label="已录入卡号" value="yzc" />
|
||
<el-option key="wzc" label="未录入卡号" value="wzc" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="卡号" prop="doorNo">
|
||
<el-input
|
||
v-model="queryParams.doorNo"
|
||
placeholder="请输入卡号"
|
||
clearable
|
||
@keyup.enter.native="handleQuery"
|
||
/>
|
||
</el-form-item>
|
||
|
||
<el-form-item>
|
||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
|
||
<el-row :gutter="10" class="mb8">
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="primary"
|
||
plain
|
||
icon="el-icon-plus"
|
||
size="mini"
|
||
@click="handleAdd"
|
||
v-hasPermi="['system:sysPeople:add']"
|
||
>新增</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="success"
|
||
plain
|
||
icon="el-icon-edit"
|
||
size="mini"
|
||
:disabled="single"
|
||
@click="handleUpdate"
|
||
v-hasPermi="['system:sysPeople:edit']"
|
||
>修改</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="danger"
|
||
plain
|
||
icon="el-icon-delete"
|
||
size="mini"
|
||
:disabled="multiple"
|
||
@click="handleDelete"
|
||
v-hasPermi="['system:sysPeople:remove']"
|
||
>删除</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="success"
|
||
plain
|
||
icon="el-icon-bottom"
|
||
size="mini"
|
||
:disabled="multiple"
|
||
@click="handleDown"
|
||
v-hasPermi="['system:sysPeople:remove']"
|
||
>下发</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="info"
|
||
plain
|
||
icon="el-icon-upload2"
|
||
size="mini"
|
||
@click="handleImport"
|
||
v-hasPermi="['system:sysPeople:import']"
|
||
>导入</el-button>
|
||
</el-col>
|
||
<el-col :span="1.5">
|
||
<el-button
|
||
type="warning"
|
||
plain
|
||
icon="el-icon-download"
|
||
size="mini"
|
||
@click="handleExport"
|
||
v-hasPermi="['system:sysPeople:export']"
|
||
>导出</el-button>
|
||
</el-col>
|
||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||
</el-row>
|
||
|
||
<el-table v-loading="loading" :data="sysPeopleList" @selection-change="handleSelectionChange">
|
||
<el-table-column type="selection" width="55" align="center" />
|
||
<!-- <el-table-column label="序号" align="center" min-width="80">
|
||
<template v-slot="scope">
|
||
<span>{{ queryParams.pageSize * (queryParams.pageNum - 1) + scope.$index + 1 }}</span>
|
||
</template>
|
||
</el-table-column>-->
|
||
<el-table-column label="人员名称" align="center" prop="name" />
|
||
<el-table-column label="联系电话" align="center" prop="phone" />
|
||
<el-table-column label="性别" align="center" prop="sex">
|
||
<template slot-scope="scope">
|
||
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"/>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="头像地址" align="center" prop="avatar" >
|
||
<template v-slot="scope">
|
||
<el-image
|
||
style="width: 80px; height: 80px"
|
||
:src="scope.row.avatar"
|
||
:preview-src-list="[scope.row.avatar]" >
|
||
</el-image>
|
||
<!-- <div class="published-div" v-if="scope.row.faceGuid!=undefined">
|
||
<el-button type="success" icon="el-icon-check" size="mini" circle></el-button>
|
||
</div>
|
||
<div class="published-div" v-if="scope.row.faceGuid==undefined">
|
||
<el-button type="danger" icon="el-icon-close" size="mini" circle></el-button>
|
||
</div> -->
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="所在部门" align="center" prop="branchId" min-width="100">
|
||
<template v-slot="scope">
|
||
<template v-if="scope.row.branch">{{ scope.row.branch.name }}</template>
|
||
<template v-else>暂无</template>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="职位标签" align="center" prop="position" />
|
||
<el-table-column label="身份证号码" align="center" prop="idcard" />
|
||
<el-table-column label="卡号" align="center" prop="doorNo" min-width="100"/>
|
||
<el-table-column label="创建时间" align="center" prop="createTime" min-width="100">
|
||
<template v-slot="scope">
|
||
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="人员注册状态" align="center" prop="guid" min-width="100">
|
||
<template v-slot="scope">
|
||
<el-switch v-if="scope.row.guid!=undefined" :value="true"
|
||
disabled>
|
||
</el-switch>
|
||
<el-switch v-if="scope.row.guid==undefined" :value="false"
|
||
disabled>
|
||
</el-switch>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="下发状态" align="center" prop="createTime" min-width="100">
|
||
<template v-slot="scope">
|
||
<span v-if="scope.row.down==0">未下发</span>
|
||
<span v-if="scope.row.down>0">已下发</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" width="150" align="center" class-name="small-padding fixed-width">
|
||
<template slot-scope="scope">
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-edit"
|
||
@click="handleUpdate(scope.row)"
|
||
v-hasPermi="['system:sysPeople:edit']"
|
||
>修改</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-delete"
|
||
@click="handleDelete(scope.row)"
|
||
v-hasPermi="['system:sysPeople:remove']"
|
||
>删除</el-button>
|
||
<el-button
|
||
size="mini"
|
||
type="text"
|
||
icon="el-icon-bottom"
|
||
@click="handleDown(scope.row)"
|
||
v-hasPermi="['system:sysPeople:remove']"
|
||
>下发</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
|
||
<pagination
|
||
v-show="total>0"
|
||
:total="total"
|
||
:page.sync="queryParams.pageNum"
|
||
:limit.sync="queryParams.pageSize"
|
||
@pagination="getList"
|
||
/>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 添加或修改人员管理对话框 -->
|
||
<el-dialog :title="title" :visible.sync="open" width="780px" append-to-body>
|
||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||
<el-row>
|
||
<el-col :span="24" >
|
||
<el-form-item label="头像地址" prop="avatar">
|
||
<div class="card_list" >
|
||
<image-minio-upload v-model="form.avatar" :limit="1" :isShowTip="false" :fileName="form.gh"/>
|
||
<div class="avater_box">
|
||
<div class="avater_l">
|
||
<!-- <el-popover
|
||
placement="top-start"
|
||
title="注册照片示例"
|
||
width="500"
|
||
trigger="hover">
|
||
<div class="txt">照片要求</div>
|
||
<el-image
|
||
:src="logo"
|
||
:preview-src-list="[logo]" >
|
||
</el-image>
|
||
<el-button size="mini" slot="reference" type="danger" plain>照片示例图</el-button>
|
||
<el-button size="mini" slot="reference" type="primary" v-if="form.avatar!=undefined&&form.avatar!=''">人脸已采集</el-button>
|
||
<el-button size="mini" slot="reference" @click="cjZp" v-if="form.avatar==undefined||form.avatar==''" :loading="isCjZp" type="danger" ><span v-if="isCjZp">前往设备采集人脸</span><span v-if="!isCjZp">人脸采集</span></el-button>
|
||
</el-popover> -->
|
||
<el-button size="mini" slot="reference" type="primary" v-if="form.avatar!=undefined&&form.avatar!=''">人脸已采集</el-button>
|
||
<el-button size="mini" slot="reference" @click="cjZp" v-if="form.avatar==undefined||form.avatar==''" :loading="isCjZp" type="danger" ><span v-if="isCjZp">前往设备采集人脸</span><span v-if="!isCjZp">人脸采集</span></el-button>
|
||
<div class="txt">1、确保照片是正脸，且足够清晰，同一个人最多3张注册照。</div>
|
||
<div class="txt">2、照片格式支持JPG\JPEG\PNG</div>
|
||
<div class="txt">3、小于2M</div>
|
||
<div class="txt">4、面部区域像素不低于128x128</div>
|
||
<div class="txt">5、人像大小占整张照片1/3以上</div>
|
||
</div>
|
||
<div class="avater_r">
|
||
<img :src="logo" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="工号" prop="gh">
|
||
<el-input v-model="form.gh" placeholder="请输入人员工号" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="人员名称" prop="name">
|
||
<el-input v-model="form.name" placeholder="请输入人员名称" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="所在部门" prop="branchId">
|
||
<treeselect v-model="form.branchId" :options="branchOptions" :normalizer="normalizer" placeholder="选择所在部门" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="联系电话" prop="phone">
|
||
<el-input v-model="form.phone" placeholder="请输入联系电话" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="性别" prop="sex">
|
||
<el-select v-model="form.sex" placeholder="请选择用户性别">
|
||
<el-option
|
||
v-for="dict in dict.type.sys_user_sex"
|
||
:key="dict.value"
|
||
:label="dict.label"
|
||
:value="dict.value"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="12" >
|
||
<el-form-item label="职位标签" prop="position">
|
||
<el-input v-model="form.position" placeholder="请输入职位标签" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="身份证" prop="idcard" >
|
||
<el-input v-model="form.idcard" placeholder="请输入身份证号码" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="卡号" prop="doorNo">
|
||
<el-input v-model="form.doorNo" placeholder="请输入卡号" @change="selectDoor"/>
|
||
<el-button size="mini" type="primary" v-if="form.doorNo!=undefined&&form.doorNo!=''">卡号已采集</el-button>
|
||
<el-button size="mini" @click="cjKh" v-if="form.doorNo==undefined||form.doorNo==''" :loading="isCjKh" type="primary" ><span v-if="isCjKh">前往设备采集卡号</span><span v-if="!isCjKh">卡号采集</span></el-button>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="关联用户" prop="userId">
|
||
<el-select v-model="form.userId" filterable placeholder="请选择关联用户" style="width:100%;" clearable :filter-method="changeTreeSelect" @visible-change="visChange">
|
||
<el-option
|
||
v-for="item in peopleOptions"
|
||
:key="item.userId"
|
||
:label="item.userName"
|
||
:value="item.userId">
|
||
</el-option>
|
||
</el-select>
|
||
<!-- <treeselect v-model="form.userId" :options="peopleOptions" :normalizer="normalizer1" placeholder="请选择关联用户" /> -->
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="车牌号码" prop="carNo">
|
||
<el-input v-model="form.carNo" placeholder="请输入车辆号码" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="入职时间" prop="carNo">
|
||
<el-date-picker clearable
|
||
v-model="form.joinTime"
|
||
type="date"
|
||
value-format="yyyy-MM-dd"
|
||
placeholder="请选择入职时间">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="指纹采集" prop="carNo">
|
||
<el-button size="mini" type="primary" v-if="form.fingerprint!=undefined">指纹已采集</el-button>
|
||
<el-button size="mini" @click="cjZw" v-if="form.fingerprint==undefined" :loading="isCjZw" type="primary" ><span v-if="isCjZw">前往设备采集指纹</span><span v-if="!isCjZw">指纹采集</span></el-button>
|
||
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="头像注册状态" prop="faceGuid" label-width="100px">
|
||
<el-switch v-if="form.faceGuid!=undefined" :value="true"
|
||
disabled>
|
||
</el-switch>
|
||
<el-switch v-if="form.faceGuid==undefined" :value="false"
|
||
disabled>
|
||
</el-switch>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12" >
|
||
<el-form-item label="人员注册状态" prop="guid" label-width="100px">
|
||
<el-switch v-if="form.guid!=undefined" :value="true"
|
||
disabled>
|
||
</el-switch>
|
||
<el-switch v-if="form.guid==undefined" :value="false"
|
||
disabled>
|
||
</el-switch>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="12" >
|
||
<el-form-item label="是否出门证审核人" prop="guid" label-width="100px">
|
||
<el-select v-model="form.carryStuffExamine" placeholder="请选择">
|
||
<el-option
|
||
v-for="dict in dict.type.vis_stuff_examine_level"
|
||
:key="dict.value"
|
||
:label="dict.label"
|
||
:value="dict.value"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
<el-col :span="24" >
|
||
<el-form-item label="备注" prop="remark">
|
||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||
<el-button @click="cancel">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
<!-- 用户导入对话框 -->
|
||
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
|
||
<el-upload
|
||
ref="upload"
|
||
:limit="1"
|
||
accept=".xlsx, .xls"
|
||
:headers="upload.headers"
|
||
:action="upload.url + '?updateSupport=' + upload.updateSupport"
|
||
:disabled="upload.isUploading"
|
||
:on-progress="handleFileUploadProgress"
|
||
:on-success="handleFileSuccess"
|
||
:auto-upload="false"
|
||
drag
|
||
>
|
||
<i class="el-icon-upload"></i>
|
||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||
<div class="el-upload__tip text-center" slot="tip">
|
||
<div class="el-upload__tip" slot="tip">
|
||
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的数据
|
||
</div>
|
||
<span>仅允许导入xls、xlsx格式文件。</span>
|
||
<el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>
|
||
</div>
|
||
</el-upload>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="submitFileForm">确 定</el-button>
|
||
<el-button @click="upload.open = false">取 消</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
listSysPeople,
|
||
getSysPeople,
|
||
delSysPeople,
|
||
addSysPeople,
|
||
updateSysPeople,
|
||
dactylogram,
|
||
faceCollect,
|
||
featureInfo,
|
||
faceFind, icCardRegist,personFind,downSysPeople
|
||
} from "@/api/system/sysPeople";
|
||
import Treeselect from "@riophae/vue-treeselect";
|
||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||
import logoImg from '@/assets/images/exampleavater.png'
|
||
import {branchTreeSelect, getSysBranch, listSysBranch} from "@/api/system/sysBranch";
|
||
import {listPoint} from "@/api/system/point";
|
||
import {listUser} from "@/api/system/user";
|
||
import {getToken} from "@/utils/auth";
|
||
|
||
export default {
|
||
name: "SysPeople",
|
||
dicts: ['sys_user_sex', 'vis_stuff_examine_level'],
|
||
components: {Treeselect },
|
||
data() {
|
||
return {
|
||
logo: logoImg,
|
||
// 遮罩层
|
||
loading: true,
|
||
isCjZw:false,
|
||
isCjZp:false,
|
||
isCjKh:false,
|
||
// 选中数组
|
||
ids: [],
|
||
// 部门树选项
|
||
branchOptions: [],
|
||
nodeKey: [],
|
||
// 部门名称
|
||
branchId: undefined,
|
||
branchName: undefined,
|
||
// 非单个禁用
|
||
single: true,
|
||
// 非多个禁用
|
||
multiple: true,
|
||
// 显示搜索条件
|
||
showSearch: true,
|
||
// 总条数
|
||
total: 0,
|
||
// 人员管理表格数据
|
||
sysPeopleList: [],
|
||
peopleOptions:[],
|
||
// 弹出层标题
|
||
title: "",
|
||
// 是否显示弹出层
|
||
open: false,
|
||
defaultProps: {
|
||
children: 'children',
|
||
label: 'label'
|
||
},
|
||
// 查询参数
|
||
queryParams: {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
name: null,
|
||
phone: null,
|
||
sex: null,
|
||
branchId: null,
|
||
guidFlag: null,
|
||
downFlag: null,
|
||
faceFlag: null,
|
||
delFlag:"0"
|
||
},
|
||
queryParams1: {
|
||
deptId: undefined,
|
||
},
|
||
// 表单参数
|
||
form: {},
|
||
// 导入参数
|
||
upload: {
|
||
// 是否显示弹出层（用户导入）
|
||
open: false,
|
||
// 弹出层标题（用户导入）
|
||
title: "",
|
||
// 是否禁用上传
|
||
isUploading: false,
|
||
// 是否更新已经存在的用户数据
|
||
updateSupport: 0,
|
||
// 设置上传的请求头部
|
||
headers: { Authorization: "Bearer " + getToken() },
|
||
// 上传的地址
|
||
url: process.env.VUE_APP_BASE_API + "/system/sysPeople/importData"
|
||
},
|
||
// 表单校验
|
||
rules: {
|
||
gh: [
|
||
{ required: true, message: "工号不能为空", trigger: "blur" }
|
||
],
|
||
name: [
|
||
{ required: true, message: "人员名称不能为空", trigger: "blur" }
|
||
],
|
||
/* phone: [
|
||
{ required: true, message: "联系电话不能为空", trigger: "blur" },
|
||
{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,message: "请输入正确的手机号码",trigger: "blur"}
|
||
],*/
|
||
/* avatar: [
|
||
{ required: true, message: "头像地址不能为空", trigger: "blur" }
|
||
],*/
|
||
branchId: [
|
||
{ required: true, message: "所在部门不能为空", trigger: "blur" }
|
||
],
|
||
/* idcard: [
|
||
{ required: true, message: "身份证号码不能为空", trigger: "blur" },
|
||
{ pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,message: "请输入正确的身份证号码",trigger: "blur"}
|
||
],*/
|
||
}
|
||
};
|
||
},
|
||
watch: {
|
||
// 根据名称筛选部门树
|
||
branchName(val) {
|
||
this.$refs.treeRef.filter(val)
|
||
},
|
||
'form.branchId': 'getPeople',
|
||
},
|
||
created() {
|
||
this.getList();
|
||
this.getOptions()
|
||
|
||
},
|
||
methods: {
|
||
/** 查询人员管理列表 */
|
||
getList() {
|
||
this.loading = true;
|
||
listSysPeople(this.queryParams).then(response => {
|
||
this.sysPeopleList = response.rows;
|
||
this.total = response.total;
|
||
this.loading = false;
|
||
});
|
||
},
|
||
/** 查询选项列表 */
|
||
getOptions() {
|
||
this.branchOptions = []
|
||
branchTreeSelect().then(response => {
|
||
this.branchOptions = response.data
|
||
this.nodeKey.push(this.branchOptions[0].id)
|
||
})
|
||
},
|
||
/** 查询选项列表 */
|
||
getPeople() {
|
||
if(this.form.branchId!=null){
|
||
getSysBranch(this.form.branchId).then(response => {
|
||
this.queryParams1.deptId=response.data.deptId;
|
||
this.peopleOptions = []
|
||
listUser(this.queryParams1).then(response => {
|
||
this.peopleOptions = response.rows
|
||
})
|
||
});
|
||
}else {
|
||
listUser(this.queryParams1).then(response => {
|
||
this.peopleOptions = response.rows
|
||
})
|
||
}
|
||
},
|
||
changeTreeSelect(userName){
|
||
listUser({userName}).then(response => {
|
||
this.peopleOptions = response.rows;
|
||
})
|
||
},
|
||
visChange(e){
|
||
if(e){
|
||
this.getPeople();
|
||
}
|
||
},
|
||
/** 转换树数据结构 */
|
||
normalizer(node) {
|
||
if (node.children && !node.children.length) {
|
||
delete node.children;
|
||
}
|
||
return {
|
||
id: node.id,
|
||
label: node.label,
|
||
isDisabled: false,
|
||
children: node.children
|
||
};
|
||
},
|
||
normalizer1(node) {
|
||
if (node.children && !node.children.length) {
|
||
delete node.children;
|
||
}
|
||
return {
|
||
id: node.userId,
|
||
label: node.userName,
|
||
isDisabled: false,
|
||
children: node.children
|
||
};
|
||
},
|
||
// 取消按钮
|
||
cancel() {
|
||
this.open = false;
|
||
this.reset();
|
||
},
|
||
// 表单重置
|
||
reset() {
|
||
this.form = {
|
||
id: null,
|
||
name: null,
|
||
phone: null,
|
||
sex: null,
|
||
avatar: null,
|
||
branchId: null,
|
||
position: null,
|
||
idcard: null,
|
||
carNo: null,
|
||
doorNo: null,
|
||
guid: null,
|
||
faceGuid: null,
|
||
userId: null,
|
||
remark: null,
|
||
createBy: null,
|
||
createTime: null,
|
||
updateBy: null,
|
||
updateTime: null
|
||
};
|
||
this.resetForm("form");
|
||
},
|
||
/** 搜索按钮操作 */
|
||
handleQuery() {
|
||
this.queryParams.pageNum = 1;
|
||
this.getList();
|
||
},
|
||
/** 重置按钮操作 */
|
||
resetQuery() {
|
||
this.resetForm("queryForm");
|
||
this.queryParams.branchId = undefined;
|
||
this.handleQuery();
|
||
},
|
||
// 多选框选中数据
|
||
handleSelectionChange(selection) {
|
||
this.ids = selection.map(item => item.id)
|
||
this.single = selection.length!==1
|
||
this.multiple = !selection.length
|
||
},
|
||
/** 筛选节点 */
|
||
filterNode(value, data) {
|
||
if (!value) return true
|
||
return data.label.indexOf(value) !== -1
|
||
},
|
||
/** 节点单击事件 */
|
||
handleNodeClick(data) {
|
||
this.queryParams.branchId = data.id
|
||
this.handleQuery()
|
||
},
|
||
/** 新增按钮操作 */
|
||
handleAdd() {
|
||
this.reset();
|
||
this.open = true;
|
||
this.title = "添加人员管理";
|
||
},
|
||
/** 修改按钮操作 */
|
||
handleUpdate(row) {
|
||
this.reset();
|
||
const id = row.id || this.ids
|
||
getSysPeople(id).then(response => {
|
||
this.form = response.data;
|
||
this.open = true;
|
||
this.title = "修改人员管理";
|
||
});
|
||
},
|
||
/** 提交按钮 */
|
||
submitForm() {
|
||
this.$refs["form"].validate(valid => {
|
||
if (valid) {
|
||
if (this.form.id != null) {
|
||
updateSysPeople(this.form).then(response => {
|
||
this.$modal.msgSuccess("修改成功");
|
||
this.open = false;
|
||
this.getList();
|
||
});
|
||
} else {
|
||
addSysPeople(this.form).then(response => {
|
||
this.$modal.msgSuccess("新增成功");
|
||
this.open = false;
|
||
this.getList();
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/** 删除按钮操作 */
|
||
handleDelete(row) {
|
||
const ids = row.id || this.ids;
|
||
this.$modal.confirm('是否确认删除人员管理编号为"' + ids + '"的数据项？').then(function() {
|
||
return delSysPeople(ids);
|
||
}).then(() => {
|
||
this.getList();
|
||
this.$modal.msgSuccess("删除成功");
|
||
}).catch(() => {});
|
||
},
|
||
/** 导出按钮操作 */
|
||
handleExport() {
|
||
this.download('system/sysPeople/export', {
|
||
...this.queryParams
|
||
}, `人员信息_${new Date().getTime()}.xlsx`)
|
||
},
|
||
cjZp() {
|
||
if(this.form.name==undefined){
|
||
this.$modal.msgError("请先输入人员名称");
|
||
return false
|
||
}
|
||
if(!this.isCjZp){
|
||
this.isCjZp=true;
|
||
faceCollect(this.form).then(response => {
|
||
this.form.faceGuid=undefined;
|
||
this.form.guid=response.data.guid
|
||
//获取指纹和照片
|
||
setInterval(this.findeCjxxs,3000)
|
||
}).catch(error => {
|
||
this.isCjZp=false;
|
||
|
||
});;
|
||
}
|
||
},
|
||
cjZw() {
|
||
if(this.form.name==undefined){
|
||
this.$modal.msgError("请先输入人员名称");
|
||
return false
|
||
}
|
||
if(!this.isCjZw){
|
||
this.isCjZw=true;
|
||
dactylogram(this.form).then(response => {
|
||
this.form.guid=response.data.guid
|
||
setInterval(this.findeCjxxs,3000)
|
||
}).catch(error => {
|
||
this.isCjZw=false;
|
||
});
|
||
}
|
||
|
||
},
|
||
cjKh() {
|
||
if(this.form.name==undefined){
|
||
this.$modal.msgError("请先输入人员名称");
|
||
return false
|
||
}
|
||
if(!this.isCjKh){
|
||
this.isCjKh=true;
|
||
icCardRegist(this.form).then(response => {
|
||
this.form.guid=response.data.guid
|
||
setInterval(this.findeCjxxs,3000)
|
||
}).catch(error => {
|
||
this.isCjKh=false;
|
||
});;
|
||
}
|
||
|
||
},
|
||
findeCjxxs(){
|
||
if(this.isCjZw){
|
||
featureInfo(this.form).then(response => {
|
||
if(response.data.fingerprint!=""&&response.data.fingerprint!=undefined){
|
||
this.form.fingerprint=response.data.fingerprint
|
||
this.isCjZw=false;
|
||
}
|
||
});
|
||
}
|
||
if(this.isCjZp){
|
||
faceFind(this.form).then(response => {
|
||
if(response.data.avatar!=""&&response.data.avatar!=undefined){
|
||
this.form.avatar=response.data.avatar
|
||
this.form.faceGuid=response.data.faceGuid
|
||
this.isCjZp=false;
|
||
}
|
||
});
|
||
}
|
||
if(this.isCjKh){
|
||
personFind(this.form).then(response => {
|
||
if(response.data.doorNo!=""&&response.data.doorNo!=undefined){
|
||
this.form.doorNo=response.data.doorNo
|
||
this.isCjKh=false;
|
||
}
|
||
});
|
||
}
|
||
},
|
||
/** 删除按钮操作 */
|
||
handleDown(row) {
|
||
const ids = row.id || this.ids;
|
||
this.$modal.confirm('是否确认下发人员编号为"' + ids + '"的数据项？').then(function() {
|
||
return downSysPeople(ids);
|
||
}).then(() => {
|
||
this.$modal.msgSuccess("下发成功");
|
||
}).catch(() => {});
|
||
},
|
||
/** 导入按钮操作 */
|
||
handleImport() {
|
||
this.upload.title = "人员信息导入";
|
||
this.upload.open = true;
|
||
},
|
||
// 文件上传中处理
|
||
handleFileUploadProgress(event, file, fileList) {
|
||
this.upload.isUploading = true;
|
||
},
|
||
// 文件上传成功处理
|
||
handleFileSuccess(response, file, fileList) {
|
||
this.upload.open = false;
|
||
this.upload.isUploading = false;
|
||
this.$refs.upload.clearFiles();
|
||
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
|
||
this.getList();
|
||
},
|
||
// 提交上传文件
|
||
submitFileForm() {
|
||
this.$refs.upload.submit();
|
||
},
|
||
/** 下载模板操作 */
|
||
importTemplate() {
|
||
this.download('system/sysPeople/importTemplate', {
|
||
}, `人员信息_${new Date().getTime()}.xlsx`)
|
||
},
|
||
selectDoor(){
|
||
let num;
|
||
if(this.form.doorNo.length>10){
|
||
num=this.form.doorNo.substring(this.form.doorNo.length-10,this.form.doorNo.length)
|
||
this.form.doorNo=num
|
||
}
|
||
if(this.form.doorNo.length>8){
|
||
num=this.toHex(this.form.doorNo);
|
||
let first=this.form.doorNo.substring(0,1);
|
||
if(first=='0'){
|
||
num=num.substring(1,num.length)
|
||
}else{
|
||
num=num.substring(2,num.length)
|
||
}
|
||
this.form.doorNo=parseInt(num,16)
|
||
}
|
||
},
|
||
toHex(num){
|
||
var rs = "";
|
||
var temp;
|
||
while(num/16 > 0){
|
||
temp = num%16;
|
||
rs = (temp+"").replace("10","A").replace("11","B").replace("12","C").replace("13","D").replace("14","E").replace("15","F") + rs;
|
||
num = parseInt(num/16);
|
||
}
|
||
return rs;
|
||
},
|
||
}
|
||
};
|
||
</script>
|
||
<style>
|
||
.card_list {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 10px;
|
||
border-radius: 5px;
|
||
cursor: pointer;
|
||
margin-bottom: 10px;
|
||
}
|
||
.published-div {
|
||
position: absolute;
|
||
top: 70px;
|
||
right: 60px;
|
||
}
|
||
.el-button--mini.is-circle {
|
||
padding: 2px;
|
||
}
|
||
.el-form-item--medium .el-form-item__label {
|
||
line-height: 40px;
|
||
}
|
||
.el-tree{
|
||
height:700px;
|
||
overflow: auto;
|
||
}
|
||
.custom-tree-node{
|
||
font-size:14px;
|
||
}
|
||
</style>
|