526 lines
21 KiB
Vue
526 lines
21 KiB
Vue
<template>
|
||
<div>
|
||
<el-card>
|
||
<span class="show-text">姓名:</span>
|
||
<el-input id="inputPersonalName" v-model="PersonalName" class="personal-name" clearable placeholder="请输入姓名"
|
||
style="width: 200px;margin-right: 26px" />
|
||
<span class="show-text">角色:</span>
|
||
<el-select id="selectPersonalRoleValue" v-model="PersonalroleValue" class="personal-role-value" clearable
|
||
placeholder="请选择角色" style="width:200px;margin-right: 14px">
|
||
<el-option v-for="item in Personalrole" :key="item.value" :label="item.label" :value="item.value" />
|
||
</el-select>
|
||
<el-button :disabled="loading" icon="el-icon-search" plain type="primary" @click="searchTable()">查询</el-button>
|
||
<el-button icon="el-icon-circle-plus-outline" plain style="margin-left: 14px" type="success"
|
||
@click="addType('form')">
|
||
新增
|
||
</el-button>
|
||
<div style="margin-top: 10px">
|
||
<el-table v-loading="loading" :data="tableData" border element-loading-background="rgba(0, 0, 0, 0.2)"
|
||
element-loading-spinner="el-icon-loading" element-loading-text="数据加载中" height="76vh" highlight-current-row
|
||
size="mini" stripe style="width: 1580px;" tooltip-effect="dark">
|
||
<el-table-column align="center" label=" " type="index" width="100" />
|
||
<el-table-column align="left" label="姓名" show-overflow-tooltip width="320">
|
||
<template slot-scope="scope">
|
||
<template v-if="scope.row.edit">
|
||
<el-input v-model="scope.row.personnel_name" clearable size="mini" style="width:200px;margin-right:3px"
|
||
width="120" />
|
||
</template>
|
||
<span v-else>{{ scope.row.personnel_name }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column align="center" label="工号" min-width="180" show-overflow-tooltip>
|
||
<template slot-scope="scope">
|
||
<template v-if="scope.row.edit">
|
||
<el-input v-model="scope.row.account" clearable size="mini" style="width:200px;margin-right:3px"
|
||
width="120" />
|
||
</template>
|
||
<span v-else>{{ scope.row.account }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column align="center" label="密码" min-width="180" show-overflow-tooltip>
|
||
<template slot-scope="scope">
|
||
<template v-if="scope.row.edit">
|
||
<el-input v-model="scope.row.password" clearable size="mini" style="width:200px;margin-right:3px"
|
||
width="120" />
|
||
</template>
|
||
<!-- <span v-else>{{ scope.row.password }}</span>-->
|
||
<span v-else>******</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column align="center" label="角色" min-width="180" show-overflow-tooltip>
|
||
<template slot-scope="scope">
|
||
<span type="success">{{ scope.row.roles_function }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column align="center" label="操作" min-width="450">
|
||
<template slot-scope="scope">
|
||
<el-button icon="el-icon-refresh-right" style="font-family: MiSans Regular,serif;color: #4d77d6"
|
||
type="text" @click="resetPassword(scope.row)">重置密码
|
||
</el-button>
|
||
<el-button icon="el-icon-edit" style="font-family: MiSans Regular,serif;color: #4d77d6" type="text"
|
||
@click="editType('form1', scope.row)">编辑
|
||
</el-button>
|
||
<el-button icon="el-icon-delete"
|
||
style="font-family: MiSans Regular,serif;color: #c61a1a;padding: 0;margin: 0" type="text"
|
||
@click="openDelete(scope.row)">删除
|
||
</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<div class="block" style="margin-top: 10px;">
|
||
<el-pagination v-if="!loading" :current-page="pageList" :page-size="pageSize" :page-sizes="[10, 20, 30, 40]"
|
||
:total="total" background layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
|
||
@current-change="handleCurrentChange" />
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
<el-dialog :show-close="false" :title="title" :visible.sync="dialogFormVisible" center width="440px">
|
||
<el-divider style="margin: 0" />
|
||
<el-form ref="form" :model="form" :rules="rules" label-position="right" label-width="100px">
|
||
<el-form-item label="姓名" prop="PersonalName">
|
||
<el-input v-model="form.PersonalName" clearable placeholder="请输入姓名" style="width: 240px;border-radius: 4px" />
|
||
</el-form-item>
|
||
<el-form-item label="工号" prop="account">
|
||
<el-input v-model="form.account" clearable placeholder="请输入工号" style="width: 240px;border-radius: 4px" />
|
||
</el-form-item>
|
||
<!-- <el-form-item label="密码" prop="password">-->
|
||
<!-- <el-input v-model="form.password" clearable placeholder="请输入密码" style="width: 240px;border-radius: 4px"/>-->
|
||
<!-- </el-form-item>-->
|
||
<el-form-item label="角色" prop="PersonalroleValue">
|
||
<el-select v-model="form.PersonalroleValue" clearable filterable placeholder="请选择角色"
|
||
style="width:240px;border-radius: 4px">
|
||
<el-option v-for="item in Personalrole" :key="item.value" :label="item.label" :value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-row>
|
||
<el-col :span="14" />
|
||
<el-form-item>
|
||
<el-button style="width: 80px;height: 40px" type="primary" @click="submit('form')">确 定</el-button>
|
||
<el-button style="width: 80px;height: 40px" @click="callOff('form')">取消</el-button>
|
||
</el-form-item>
|
||
</el-row>
|
||
</el-form>
|
||
</el-dialog>
|
||
<el-dialog :show-close="false" :title="title1" :visible.sync="dialogFormVisible1" center width="440px">
|
||
<el-divider style="margin: 0" />
|
||
<el-form ref="form1" :model="form1" :rules="rules1" label-position="right" label-width="100px">
|
||
<el-form-item label="姓名" prop="PersonalName">
|
||
<el-input v-model="form1.PersonalName" clearable placeholder="请输入姓名"
|
||
style="width: 240px;border-radius: 4px" />
|
||
</el-form-item>
|
||
<el-form-item label="工号" prop="account">
|
||
<el-input v-model="form1.account" placeholder="请输入工号" readonly style="width: 240px;border-radius: 4px" />
|
||
</el-form-item>
|
||
<!-- <el-form-item label="密码" prop="password">-->
|
||
<!-- <el-input-->
|
||
<!-- v-model="form1.password"-->
|
||
<!-- clearable-->
|
||
<!-- placeholder="请输入密码"-->
|
||
<!-- style="width: 240px;border-radius: 4px"/>-->
|
||
<!-- </el-form-item>-->
|
||
<el-form-item label="角色" prop="PersonalroleValue">
|
||
<el-select v-model="form1.PersonalroleValue" clearable filterable placeholder="请选择角色"
|
||
style="width:240px;border-radius: 4px">
|
||
<el-option v-for="item in Personalrole" :key="item.value" :label="item.label" :value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-row>
|
||
<el-col :span="14" />
|
||
<el-form-item>
|
||
<el-button style="width: 80px;height: 40px" type="primary" @click="confirmEdit('form1')">确 定</el-button>
|
||
<el-button style="width: 80px;height: 40px" @click="callOff1('form1')">取消</el-button>
|
||
</el-form-item>
|
||
</el-row>
|
||
</el-form>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
PersonalName: '', // 姓名
|
||
PersonalroleValue: '', // 角色
|
||
Personalrole: [],
|
||
title: '',
|
||
title1: '',
|
||
dialogFormVisible: false,
|
||
dialogFormVisible1: false,
|
||
isShowSearchOpNamePermission: false,
|
||
clickOpNamePermissionList: [],
|
||
isShowCameraPermission: false, // 摄像头权限
|
||
cameraPermissionList: [],
|
||
form: {
|
||
PersonalName: '',
|
||
account: '',
|
||
password: '',
|
||
PersonalroleValue: ''
|
||
},
|
||
rules: {
|
||
PersonalName: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
|
||
account: [{ required: true, message: '请输入账号', trigger: 'change' }],
|
||
password: [{ required: true, message: '请输入密码', trigger: 'change' }],
|
||
PersonalroleValue: [{ required: true, message: '请选择角色', trigger: 'blur' }]
|
||
},
|
||
form1: {
|
||
PersonalName: '',
|
||
account: '',
|
||
password: '',
|
||
PersonalroleValue: ''
|
||
},
|
||
rules1: {
|
||
PersonalName: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
|
||
account: [{ required: true, message: '请输入账号', trigger: 'change' }],
|
||
password: [{ required: true, message: '请输入密码', trigger: 'change' }],
|
||
PersonalroleValue: [{ required: true, message: '请选择角色', trigger: 'blur' }]
|
||
},
|
||
loading: false,
|
||
tableData: [],
|
||
total: 0, // 总条数
|
||
pageSize: 10, // 每页显示条数
|
||
pageList: 1 // 后台获取页
|
||
}
|
||
},
|
||
created() {
|
||
this.getPersonalrole()
|
||
this.searchTable()
|
||
},
|
||
methods: {
|
||
// 初始化获取角色信息
|
||
getPersonalrole() {
|
||
this.Personalrole = []
|
||
var Data = this.CreateData('11', '人员管理_角色信息初始化查询_查询')
|
||
this.ExecDatabase(Data).then(response => {
|
||
for (let i = 0; i < response.data.length; i++) {
|
||
this.Personalrole.push({
|
||
label: response.data[i].Roles_Function,
|
||
value: response.data[i].Roles_number
|
||
})
|
||
}
|
||
})
|
||
},
|
||
changeIsClient(row) {
|
||
var param = []
|
||
param[0] = ['Personnel_Number', row.personnel_number]
|
||
param[1] = ['value', row.isClient]
|
||
var Data = this.CreateData('12', '登录基础数据_人员信息_切换是否用户', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result === '1') {
|
||
this.$message({
|
||
message: '修改成功',
|
||
type: 'success'
|
||
})
|
||
this.searchTable()
|
||
} else {
|
||
this.$message.error('修改失败')
|
||
}
|
||
})
|
||
},
|
||
// 查询
|
||
searchTable() {
|
||
if (this.PersonalName === '' || this.PersonalName === null) {
|
||
this.PersonalName_check = 0
|
||
} else {
|
||
this.PersonalName_check = 1
|
||
}
|
||
if (this.PersonalroleValue === '' || this.PersonalroleValue === null) {
|
||
this.PersonalroleValue_check = 0
|
||
} else {
|
||
this.PersonalroleValue_check = 1
|
||
}
|
||
this.loading = true
|
||
this.tableData = []
|
||
var param = []
|
||
param[0] = ['姓名_check', this.PersonalName_check]
|
||
param[1] = ['姓名', this.PersonalName]
|
||
param[2] = ['角色代码_check', this.PersonalroleValue_check]
|
||
param[3] = ['角色代码', this.PersonalroleValue]
|
||
param[4] = ['PageCurrent', this.pageList]
|
||
param[5] = ['PageSize', this.pageSize]
|
||
param[6] = ['PageCount', '1111', 'int', '1']
|
||
param[7] = ['ItemCount', '1111', 'int', '1']
|
||
var Data = this.CreateData('11', '人员管理_人员信息查询_查询', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data.result.length !== 0) {
|
||
for (let i = 0; i < response.data.result.length; i++) {
|
||
this.tableData.push({
|
||
personnel_number: response.data.result[i].Personnel_Number,
|
||
personnel_name: response.data.result[i].Personnel_Name,
|
||
account: response.data.result[i].account,
|
||
password: response.data.result[i].password,
|
||
roles_number: parseInt(response.data.result[i].Roles_number),
|
||
roles_function: response.data.result[i].Roles_Function,
|
||
isClient: response.data.result[i].isClient
|
||
})
|
||
}
|
||
}
|
||
this.total = parseInt(response.data.output[0].ItemCount)
|
||
this.loading = false
|
||
})
|
||
},
|
||
|
||
// 点击编辑
|
||
editType(formName, row) {
|
||
if (this.$refs[formName] !== undefined) {
|
||
this.$refs[formName].resetFields()
|
||
}
|
||
this.form1.PersonalName = row.personnel_name
|
||
this.form1.personnel_number = row.personnel_number
|
||
this.form1.account = row.account
|
||
this.form1.password = row.password
|
||
this.form1.PersonalroleValue = row.roles_number
|
||
this.title1 = '编辑人员'
|
||
this.dialogFormVisible1 = true
|
||
},
|
||
|
||
// 确定编辑
|
||
confirmEdit(formName) {
|
||
this.$refs[formName].validate((valid) => {
|
||
if (valid) {
|
||
var param = []
|
||
param[0] = ['Personnel_Number', this.form1.personnel_number]
|
||
param[1] = ['account', this.form1.account]
|
||
param[2] = ['password', this.form1.password]
|
||
param[3] = ['Personnel_Name', this.form1.PersonalName]
|
||
param[4] = ['Roles_number', this.form1.PersonalroleValue]
|
||
if (this.form1.account === '' || this.form1.account === null) {
|
||
this.$message.error('请输入工号')
|
||
} else if (this.form1.password === '' || this.form1.password === null) {
|
||
this.$message.error('请输入密码')
|
||
} else if (this.form1.personnel_name === '' || this.form1.personnel_name === null) {
|
||
this.$message.error('请输入姓名')
|
||
} else if (this.form1.PersonalroleValue === '' || this.form1.PersonalroleValue === null) {
|
||
this.$message.error('请选择角色')
|
||
} else {
|
||
var Data = this.CreateData('12', '人员管理_人员信息修改_编辑', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result === '1') {
|
||
this.$message({
|
||
message: '信息编辑成功',
|
||
type: 'success'
|
||
})
|
||
this.searchTable()
|
||
this.dialogFormVisible1 = false
|
||
} else {
|
||
this.$message.error('信息编辑失败')
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
// 删除
|
||
openDelete(row) {
|
||
this.$confirm('当前人员将永久删除, 是否继续?', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
confirmButtonClass: 'confirm-confirm-button',
|
||
cancelButtonClass: 'confirm-cancel-button',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
var param = []
|
||
param[0] = ['Personnel_Number', row.personnel_number]
|
||
var Data = this.CreateData('12', '人员管理_人员信息修改_删除', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result === '1') {
|
||
this.$message({
|
||
message: '人员离职成功',
|
||
type: 'success'
|
||
})
|
||
this.searchTable()
|
||
} else {
|
||
this.$message.error('人员离职失败')
|
||
}
|
||
})
|
||
}).catch(() => {
|
||
this.$message({
|
||
type: 'info',
|
||
message: '已取消删除'
|
||
})
|
||
})
|
||
},
|
||
|
||
// 点击增加
|
||
addType(formName) {
|
||
if (this.$refs[formName] !== undefined) {
|
||
this.$refs[formName].resetFields()
|
||
}
|
||
this.form.PersonalName = ''
|
||
this.form.account = ''
|
||
this.form.password = '123456'
|
||
this.form.PersonalroleValue = ''
|
||
this.title = '增加人员'
|
||
this.dialogFormVisible = true
|
||
},
|
||
|
||
// 增加确定
|
||
submit(formName) {
|
||
this.$refs[formName].validate((valid) => {
|
||
if (valid) {
|
||
// 验证密码复杂性 最小六位 并且必须存在数字 与 字母
|
||
// 复杂度校验放在第二次手动设置密码中了
|
||
// if (this.form.password.length < 6 || !/[0-9]/.test(this.form.password) || !/[a-zA-Z]/.test(this.form.password)) {
|
||
// this.$message.error('密码复杂度不符合要求，最小六位且必须数字与字母同时存在')
|
||
// return false
|
||
// }
|
||
|
||
var param = []
|
||
param[0] = ['Personnel_Name', this.form.PersonalName]
|
||
param[1] = ['account', this.form.account]
|
||
param[2] = ['password', this.form.password]
|
||
param[3] = ['Roles_number', this.form.PersonalroleValue]
|
||
var Data = this.CreateData('11', '人员管理_人员信息新增_新增', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result === '1') {
|
||
this.$message({
|
||
message: '信息增加成功',
|
||
type: 'success'
|
||
})
|
||
this.pageList = 1
|
||
this.pageSize = 10
|
||
this.searchTable()
|
||
} else {
|
||
this.$message.error('信息增加失败')
|
||
}
|
||
})
|
||
this.dialogFormVisible = false
|
||
} else {
|
||
return false
|
||
}
|
||
})
|
||
},
|
||
// 查看设备权限
|
||
searchOpNamePermission(row) {
|
||
console.log(row)
|
||
this.isShowSearchOpNamePermission = true
|
||
this.getUserOpNameList(row.personnel_number)
|
||
},
|
||
// 摄像头权限
|
||
searchCameraPermission(row) {
|
||
console.log(row)
|
||
this.isShowCameraPermission = true
|
||
this.getCameraPermission(row.personnel_number)
|
||
},
|
||
getCameraPermission(personnel_number) {
|
||
this.cameraPermissionList = []
|
||
var param = []
|
||
param[0] = ['Personnel_Number', personnel_number]
|
||
var Data = this.CreateData('11', 'WEB_摄像头查看权限_查询', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data.length != 0) {
|
||
this.cameraPermissionList = response.data
|
||
}
|
||
})
|
||
},
|
||
// 重置密码
|
||
resetPassword(row) {
|
||
this.$confirm('是否重置此用户的登陆密码为初始密码?', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
confirmButtonClass: 'confirm-confirm-button',
|
||
cancelButtonClass: 'confirm-cancel-button',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
this.clickOpNamePermissionList = []
|
||
var param = []
|
||
param[0] = ['Personnel_Number', row.personnel_number]
|
||
var Data = this.CreateData('12', 'WEB_登录基础数据_人员信息_重置密码', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result == 1) {
|
||
this.$message.success('密码重置成功，初始密码为123456')
|
||
}
|
||
})
|
||
})
|
||
},
|
||
getUserOpNameList(personnel_number) {
|
||
this.clickOpNamePermissionList = []
|
||
var param = []
|
||
param[0] = ['Personnel_Number', personnel_number]
|
||
var Data = this.CreateData('11', 'WEB_人员设备查看权限_查询', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].length != 0) {
|
||
this.clickOpNamePermissionList = response.data
|
||
}
|
||
})
|
||
},
|
||
updateOpNamePermission(row, type) {
|
||
console.log(row)
|
||
this.$confirm('是否确认切换设权限', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
var param = []
|
||
param[0] = ['设备AID', row.设备AID]
|
||
param[1] = ['Personnel_Number', row.Personnel_Number]
|
||
param[2] = ['type', type]
|
||
var Data = this.CreateData('12', 'WEB_人员设备查看权限_权限切换', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result == '1') {
|
||
this.$message.success('权限切换成功')
|
||
this.getUserOpNameList(row.Personnel_Number)
|
||
}
|
||
})
|
||
})
|
||
},
|
||
updateCameraPermission(row, type) {
|
||
console.log(row)
|
||
this.$confirm('是否确认切换摄像头权限', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
var param = []
|
||
param[0] = ['摄像头AID', row.AID]
|
||
param[1] = ['Personnel_Number', row.Personnel_Number]
|
||
param[2] = ['type', type]
|
||
var Data = this.CreateData('12', 'WEB_人员摄像头查看权限_权限切换', param)
|
||
this.ExecDatabase(Data).then(response => {
|
||
if (response.data[0].result == '1') {
|
||
this.$message.success('权限切换成功')
|
||
this.getCameraPermission(row.Personnel_Number)
|
||
}
|
||
})
|
||
})
|
||
},
|
||
tableRowClassName({ row }) {
|
||
if (row.是否授权 == 1) {
|
||
return 'success'
|
||
} else {
|
||
return 'no-success'
|
||
}
|
||
},
|
||
|
||
// 重置表单
|
||
callOff(formName) {
|
||
this.dialogFormVisible = false
|
||
this.$refs[formName].resetFields()
|
||
},
|
||
|
||
// 重置表单
|
||
callOff1(formName) {
|
||
this.dialogFormVisible1 = false
|
||
this.$refs[formName].resetFields()
|
||
},
|
||
// 分页
|
||
handleSizeChange(val) {
|
||
this.pageList = 1
|
||
this.pageSize = val
|
||
this.searchTable()
|
||
},
|
||
handleCurrentChange(val) {
|
||
this.pageList = val
|
||
this.searchTable()
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
::v-deep.el-table .success {}
|
||
|
||
::v-deep.el-table .no-success {}
|
||
</style>
|