XA/xa-ui-prod
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
zc
2025-06-05 09:55:41 +08:00
commit 935360c185
459 changed files with 61034 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/views/visitorExamine/RoleAuthModal.vue Normal file
View File

@@ -0,0 +1,80 @@
<template>
<div>
<el-checkbox v-model="menuExpand" @change="handleTreeExpand">展开/折叠</el-checkbox>
<el-checkbox v-model="menuNodeAll" @change="handleTreeNodeAll">全选/全不选</el-checkbox>
<el-tree
class="tree-border"
:data="menuOptions"
show-checkbox
ref="authRef"
node-key="id"
empty-text="加载中，请稍候"
:props="defaultProps"
/>
</div>
</template>
<script>
export default {
name: 'RoleAuthModal',
props: {
// 源策略选项
menuOptions: {
type: Array,
default: () => []
}
},
data() {
return {
menuExpand: false,
menuNodeAll: false,
pointIds: [],
defaultProps: {
children: 'children',
label: 'label'
}
}
},
methods: {
/** 获取树权限 */
getAuthScope(id) {
const pointIds = id.split(",")
this.$nextTick(() => {
pointIds.forEach((v) => {
this.$nextTick(() => {
this.$refs.authRef.setChecked(v, true, false)
})
})
})
},
/** 树权限（展开/折叠） */
handleTreeExpand(value) {
let treeList = this.menuOptions
for (let i = 0; i < treeList.length; i++) {
this.$refs.authRef.store.nodesMap[treeList[i].id].expanded = value
}
},
/** 树权限（全选/全不选） */
handleTreeNodeAll(value) {
this.$refs.authRef.setCheckedNodes(value ? this.menuOptions : [])
},
/** 所有权限节点数据 */
getAllCheckedKeys() {
// 目前被选中的节点
let checkedKey = this.$refs.authRef.getCheckedNodes()
let checkedKeys =[];
if(checkedKey.length>0){
for(let i=0;i<checkedKey.length;i++){
if(checkedKey[i].type=='1'){
checkedKeys.push(checkedKey[i].id);
}
}
}
// 半选中的节点
let halfCheckedKeys = this.$refs.authRef.getHalfCheckedKeys()
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
return checkedKeys
}
}
}
</script>

754
src/views/visitorExamine/index.vue Normal file
View File

@@ -0,0 +1,754 @@
<template>
<div class="app-container">
<el-radio-group v-model="tabFlag" style="margin-bottom: 30px;" @change="changeTab">
<el-radio-button label="wsh">未审核</el-radio-button>
<el-radio-button label="ysh">已审核</el-radio-button>
</el-radio-group>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<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="userId">
<el-input
v-model="queryParams.people.name"
placeholder="请输入被访人"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="访问园区/企业" prop="deptId">
<el-input
v-model="queryParams.branch.name"
placeholder="请输入访问园区/企业"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
<el-form-item label="预约时间" prop="startTime">
<el-date-picker clearable
v-model="queryParams.startTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择预约时间">
</el-date-picker>
</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-table v-loading="loading" :data="visitorList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="来访人" align="center" prop="name" />
<el-table-column label="用户性别" align="center" prop="sex">
<template slot-scope="scope">
<template v-if="scope.row.sex != null">
<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"/>
</template>
<template v-else>保密</template>
</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="deptId" >
<template slot-scope="scope" >
<span v-if="scope.row.branch!=null">{{scope.row.branch.name}}</span>
</template>
</el-table-column>
<el-table-column label="被访人" align="center" prop="userId" >
<template slot-scope="scope">
<span v-if="scope.row.people!=null">{{scope.row.people.name}}</span>
</template>
</el-table-column>
<el-table-column label="预约时间" align="center" prop="startTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="审核人" align="center" prop="examine.createBy" width="180" v-if="tabFlag=='ysh'" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button v-if="tabFlag=='wsh'"
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['visitor:visitor:edit']"
>审核</el-button>
<el-button v-if="tabFlag=='ysh'"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['visitor:visitor: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-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="105px">
<el-row>
<el-col :span="24" >
<el-form-item label="来访人头像:" prop="avatar">
<div class="card_list" >
<!-- <image-upload v-model="form.avatar" :limit="1" :isShowTip="false" /> -->
<el-image
class="avatar_img"
:src="form.avatar"
:preview-src-list="[form.avatar]" >
</el-image>
<!-- <div style="padding: 14px; width: calc(100% - 60px);">
<el-popover
placement="top-start"
title="注册照片示例"
width="500"
trigger="hover">
<div class="txt">照片要求</div>
<el-image
:src="logo"
:preview-src-list="[logo]" >
</el-image>
<div class="txt">1、小于2M</div>
<div class="txt">2、面部区域像素不低于128x128</div>
<div class="txt">3、人像大小占整张照片1/3以上</div>
<el-button slot="reference">照片示例图</el-button>
</el-popover>
<div class="txt">1、确保照片是正脸，且足够清晰，同一个人最多3张注册照。</div>
<div class="txt" >2、照片格式支持JPG\JPEG\PNG</div>
</div> -->
</div>
</el-form-item>
</el-col>
<el-col :span="8" >
<el-form-item label="来访人:" prop="name">
{{ form.name }}
<!-- <el-input v-model="form.name" placeholder="请输入来访人" /> -->
</el-form-item>
</el-col>
<el-col :span="8" >
<el-form-item label="联系电话:" prop="phone">
{{ form.phone }}
<!-- <el-input v-model="form.phone" placeholder="请输入联系电话" /> -->
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="来访人性别:" prop="sex">
<template v-if="form.sex">
<dict-tag :options="dict.type.sys_user_sex" :value="form.sex"/>
</template>
<template v-else>保密</template>
<!-- <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="8" >
<el-form-item label="身份证号码:" prop="idcard">
<template v-if="form.idcard">
{{ form.idcard }}
</template>
<template v-else>未填</template>
<!-- <el-input v-model="form.idcard" placeholder="请输入身份证号码" /> -->
</el-form-item>
</el-col>
<el-col :span="8" >
<el-form-item label="车牌号码:" prop="carNo">
<template v-if="form.carNo">
{{ form.carNo }}
</template>
<template v-else>未填</template>
<!-- <el-input v-model="form.carNo" placeholder="请输入车牌号码" /> -->
</el-form-item>
</el-col>
<!-- <el-col :span="8" >
<el-form-item label="访客类型:" prop="flag">
<template v-if="form.flag">
{{ form.flag }}
</template>
<template v-else>未填</template>
<el-input v-model="form.flag" placeholder="请输入访客类型" />
</el-form-item>
</el-col> -->
<el-col :span="8" >
<el-form-item label="园区/公司:" prop="deptId">
<!-- <treeselect v-model="form.deptId" :options="branchOptions" :normalizer="normalizer" placeholder="选择所在部门" disabled/> -->
<dict-tag :options="dict.type.sys_company_type" :value="form.deptId"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="被访人:" prop="userId">
<!-- <el-select v-model="form.userId" placeholder="请选择被访人" filterable disabled>
<el-option
v-for="dict in peopleOptions"
:key="dict.id"
:label="dict.name"
:value="dict.id"
></el-option>
</el-select> -->
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="预约时间:" prop="startTime">
<template v-if="form.startTime">
{{ form.startTime }}
</template>
<template v-else>未填</template>
<!-- <el-date-picker clearable
v-model="form.startTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择预约时间">
</el-date-picker> -->
</el-form-item>
</el-col>
<el-col :span="8" >
<el-form-item label="来访结束时间:" prop="endTime">
<!-- <el-date-picker clearable
v-model="form.endTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择来访结束时间">
</el-date-picker> -->
<template v-if="form.endTime">
{{ form.endTime }}
</template>
<template v-else>未填</template>
</el-form-item>
</el-col>
<el-col :span="8" >
<el-form-item label="访客事由:" prop="matter">
<template v-if="form.matter">
<dict-tag :options="dict.type.vis_info_reason" :value="form.matter"/>
</template>
<template v-else>未填</template>
<!-- <el-input v-model="form.matter" placeholder="请输入来访事由" /> -->
</el-form-item>
</el-col>
<el-col :span="8" >
<el-form-item label="携带物品:" prop="res">
<template v-if="form.res">
{{ form.res }}
</template>
<template v-else>未填</template>
<!-- <el-input v-model="form.res" placeholder="请输入携带物品" /> -->
</el-form-item>
</el-col>
<el-col :span="12" v-if="form.id!=null" >
<el-form-item label="头像注册状态:" prop="faceGuid">
<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" v-if="form.id!=null">
<el-form-item label="人员注册状态:" prop="guid">
<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="24" >
<el-form-item label="备注:" prop="remark">
<template v-if="form.remark">
{{ form.remark }}
</template>
<template v-else>未填</template>
<!-- <el-input v-model="form.remark" placeholder="请输入备注" /> -->
</el-form-item>
</el-col>
</el-row>
<!--添加按钮-->
<!--
<el-button type="primary" style="float: left;" >随访人员信息</el-button>
-->
<el-tag effect="dark" style="float: left;" >随访人员信息</el-tag>
<!-- <el-button type="success" style="float: right;" size="medium" @click="addRow(itemData.length)">添加</el-button> -->
<!--表格-->
<el-table :data="itemData" style="width: 100%" ref="tb" class="people_table">
<el-table-column fixed prop="date" label="人员头像">
<template slot-scope="scope">
<el-image
style="width: 80px; height: 80px"
:src="scope.row.avatar"
:preview-src-list="[scope.row.avatar]" >
</el-image>
<!--<image-upload v-model="scope.row.avatar" style="width: 80px; height: 80px" :limit="1" :isShowTip="false" />
<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 prop="name" label="姓名" align="center">
<!-- <template slot-scope="scope">
<el-input v-model="scope.row.name" :label="scope.row.index"></el-input>
</template> -->
</el-table-column>
<el-table-column prop="phone" label="电话号码" align="center">
<!-- <template slot-scope="scope">
<el-input v-model="scope.row.phone" :label="scope.row.index"></el-input>
</template> -->
</el-table-column>
<!-- <el-table-column fixed="right" label="操作" align="center">
<template slot-scope="scope">
<el-button @click.native.prevent="deleteRow(scope.$index, itemData)" type="text" size="small">移除</el-button>
</template>
</el-table-column> -->
</el-table>
<br></br>
<el-tag effect="dark" style="float: left;" >审核信息</el-tag>
<br></br>
<el-row>
<el-col :span="8" >
<el-form-item label="审核意见:" >
<el-select v-model="form.examine.examine" placeholder="请选择审核意见">
<el-option
v-for="dict in dict.type.vis_examine_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<!--<el-col :span="8" >
<el-form-item label="通行规则:" prop="ruleId">
<el-select v-model="form.examine.ruleId" placeholder="请选择通行规则">
<el-option
v-for="dict in ruleOptions"
:key="dict.id"
:label="dict.name"
:value="dict.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="16" >
<el-form-item label="准入时间" >
<el-time-picker
is-range
v-model="form.value2"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围"
value-format="HH:mm:ss"
>
</el-time-picker>
</el-form-item>
</el-col>-->
<!-- <el-col :span="24" >
<el-form-item label="通行位置" prop="pointIds">
<RoleAuthModal ref="authRef" :menuOptions="menuOptions" />
</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>
</div>
</template>
<script>
import {
listVisitor,
getVisitor,
delVisitor,
addVisitor,
updateVisitor,
updateVisitorExamine, canceVisitor
} from "@/api/visitor/visitor";
import logoImg from '@/assets/images/example.png'
import {branchTreeSelect} from "@/api/system/sysBranch";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {listSysPeople} from "@/api/system/sysPeople";
import {listRule, ruleAuthApi} from "@/api/system/rule";
import RoleAuthModal from './RoleAuthModal'
export default {
name: "Visitor",
dicts: ['sys_user_sex','vis_examine_type','vis_info_reason','sys_company_type'],
components: {Treeselect,RoleAuthModal },
data() {
return {
tabFlag:'wsh',
logo: logoImg,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 访客信息表格数据
visitorList: [],
// 部门树选项
branchOptions: [],
peopleOptions:[],
menuOptions:[],
ruleOptions: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
name: null,
sex: null,
avatar: null,
userId: null,
deptId: null,
startTime: null,
people:{},
branch:{},
},
queryParams1: {
branchId: undefined,
pageNum: 1,
pageSize: 99999
},
// 表单参数
form: {
value2:['08:00:00','18:00:00'],
examine:{
examine:'0',
admittanceStart: '08:00:00',
admittanceEnd: '18:00:00',
}
},
// 表单校验
rules: {
name: [
{ required: true, message: "来访人不能为空", trigger: "blur" }
],
phone: [
{ required: true, message: "来访人联系电话不能为空", trigger: "blur" }
],
pointIds: [
{ required: true, message: "来访人通行位置不能为空", trigger: "blur" }
],
},
radio: 0,
//给一个默认行
itemData: [{
avatar: '',
name: '',
phone: ''
}],
};
},
watch: {
// 监听deptId
'form.deptId': 'getPeople'
},
created() {
this.queryParams.tabFlag=this.tabFlag;
this.getList();
this.getOptions();
},
methods: {
/** 查询访客信息列表 */
getList() {
this.loading = true;
listVisitor(this.queryParams).then(response => {
this.visitorList = response.rows;
this.total = response.total;
this.loading = false;
});
},
/** 查询选项列表 */
getOptions() {
this.branchOptions = []
branchTreeSelect().then(response => {
this.branchOptions = response.data
})
this.menuOptions = []
ruleAuthApi().then(response => {
this.menuOptions = response.depts
})
this.ruleOptions=[];
listRule().then(response => {
this.ruleOptions = response.rows
})
},
/** 查询选项列表 */
getPeople() {
this.queryParams1.branchId=this.form.deptId;
this.peopleOptions = []
listSysPeople(this.queryParams1).then(response => {
this.peopleOptions = response.rows
})
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
phone: null,
sex: null,
avatar: null,
idcard: null,
carNo: null,
userId: null,
deptId: null,
flag: null,
startTime: null,
endTime: null,
matter: null,
res: null,
guid: null,
faceGuid: null,
remark: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
examine:{
admittanceStart: '08:00:00',
admittanceEnd: '18:00:00',
}
};
this.resetForm("form");
},
/** 转换树数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.id,
label: node.label,
isDisabled: false,
children: node.children
};
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加访客信息";
/* this.$nextTick(() => {
this.$refs.authRef.handleTreeNodeAll()
})*/
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
this.itemData=[];
getVisitor(id).then(response => {
this.form = response.data;
this.itemData=response.data.itemList;
if(this.form.examine.admittanceStart!=null){
let value2=[this.form.examine.admittanceStart,this.form.examine.admittanceEnd]
this.$set(this.form,'value2',value2)
}else{
this.form.value2=['08:00:00','18:00:00'],
this.form.examine.examine='0'
}
this.open = true;
this.title = "审核访客信息";
/* this.$nextTick(() => {
this.$refs.authRef.handleTreeNodeAll()
this.$refs.authRef.getAuthScope(row.pointId)
})*/
});
},
/** 提交按钮 */
submitForm() {
this.form.examine.admittanceStart=this.form.value2[0]
this.form.examine.admittanceEnd=this.form.value2[1]
this.form.itemList=this.itemData;
// this.form.examine.pointIds = this.$refs.authRef.getAllCheckedKeys()
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateVisitorExamine(this.form).then(response => {
this.$modal.msgSuccess("审核成功");
this.open = false;
this.getList();
});
} else {
addVisitor(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 canceVisitor(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("撤销成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download('visitor/visitor/export', {
...this.queryParams
}, `visitor_${new Date().getTime()}.xlsx`)
},
// 增加一行
addRow(length) {
if (this.itemData == undefined) {
this.itemData = new Array();
}
let obj = {};
obj.avatar = "";
obj.name = "";
obj.phone = "";
this.itemData.push(obj);
},
// 删除一行
deleteRow(index) {
this.itemData.splice(index, 1)
},
changeTab(){
this.queryParams.tabFlag=this.tabFlag;
this.getList();
}
}
};
</script>
<style lang="scss" scoped>
.card_list {
display: flex;
align-items: center;
padding: 10px;
border-radius: 5px;
cursor: pointer;
margin-bottom: 10px;
}
.published-div {
position: absolute;
top: 70px;
right: 150px;
}
.el-button--mini.is-circle {
padding: 2px;
}
.el-col-8 {
height: 60px;
}
.el-select {
width: 100%;
}
.el-date-editor.el-input, .el-date-editor.el-input__inner {
width: 100%;
}
.el-table .cell .el-upload{
line-height: 80px;
width: 80px;
height: 80px;
}
.el-table .cell .el-upload-list--picture-card .el-upload-list__item {
overflow: hidden;
background-color: #fff;
border: 1px solid #c0ccda;
border-radius: 6px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 80px;
height: 80px;
margin: 0 8px 8px 0;
display: inline-block;
}
::v-deep .people_table{
.el-upload-list--picture-card .el-upload-list__item,.el-upload--picture-card{
width:100%;
height:80px;
}
.el-upload--picture-card{
line-height:90px;
}
}
.avatar_img{
width:140px;
height:140px;
}
</style>