人员管理列表开发及新增编辑页面开发
This commit is contained in:
parent
8fbeb58010
commit
e40ac65817
|
@ -0,0 +1,69 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
const personApi = {
|
||||||
|
addOrUpdate: 'person/addOrUpdate',
|
||||||
|
del: 'person/del',
|
||||||
|
get: 'person/get',
|
||||||
|
page: 'person/pageList',
|
||||||
|
transferOrg: 'person/transferOrg',
|
||||||
|
quit: 'person/quit',
|
||||||
|
resetPwd: 'person/resetPwd',
|
||||||
|
setAdmin: 'person/setAdmin',
|
||||||
|
}
|
||||||
|
|
||||||
|
export function personAddOrUpdate (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.addOrUpdate,
|
||||||
|
method: 'post',
|
||||||
|
data: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personGet (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.get,
|
||||||
|
method: 'get',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personDel (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.del,
|
||||||
|
method: 'post',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personPage (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.page,
|
||||||
|
method: 'get',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personTransferOrg (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.transferOrg,
|
||||||
|
method: 'get',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personQuit (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.quit,
|
||||||
|
method: 'get',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personResetPwd (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.resetPwd,
|
||||||
|
method: 'get',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function personSetAdmin (params) {
|
||||||
|
return request({
|
||||||
|
url: personApi.setAdmin,
|
||||||
|
method: 'get',
|
||||||
|
params: params
|
||||||
|
})
|
||||||
|
}
|
|
@ -14,8 +14,7 @@ export function actionToObject (json) {
|
||||||
*/
|
*/
|
||||||
export function hasBtnPermission (permission) {
|
export function hasBtnPermission (permission) {
|
||||||
const myBtns = store.getters.buttons
|
const myBtns = store.getters.buttons
|
||||||
const name = store.getters.name
|
if (myBtns.indexOf('*:*:*') > -1) {
|
||||||
if (name == 'admin') {
|
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
return myBtns.indexOf(permission) > -1
|
return myBtns.indexOf(permission) > -1
|
||||||
|
|
|
@ -96,7 +96,7 @@
|
||||||
sm: { span: 15 }
|
sm: { span: 15 }
|
||||||
},
|
},
|
||||||
orgTree: [],
|
orgTree: [],
|
||||||
modalTitle: "新增机构",
|
modalTitle: '新增机构',
|
||||||
visible: false,
|
visible: false,
|
||||||
confirmLoading: false,
|
confirmLoading: false,
|
||||||
formLoading: true,
|
formLoading: true,
|
||||||
|
@ -140,7 +140,7 @@
|
||||||
getOrgTree () {
|
getOrgTree () {
|
||||||
orgList().then((res) => {
|
orgList().then((res) => {
|
||||||
this.formLoading = false
|
this.formLoading = false
|
||||||
if (!res.code === 200) {
|
if (!res.code === 200 || !res.data.length) {
|
||||||
this.orgTree = []
|
this.orgTree = []
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -190,7 +190,6 @@
|
||||||
this.confirmLoading = false
|
this.confirmLoading = false
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
this.confirmLoading = false
|
this.confirmLoading = false
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,124 @@
|
||||||
|
<template>
|
||||||
|
<a-modal v-model="isShowOrg" title="选择机构" :footer="null" >
|
||||||
|
<div>
|
||||||
|
<a-input-search style="margin-bottom: 8px" placeholder="搜索名称" @change="onChange" />
|
||||||
|
<a-tree
|
||||||
|
:disable-branch-nodes="true"
|
||||||
|
:expanded-keys="expandedKeys"
|
||||||
|
:auto-expand-parent="autoExpandParent"
|
||||||
|
:tree-data="orgList"
|
||||||
|
@expand="onExpand"
|
||||||
|
@select="onSelect"
|
||||||
|
:replaceFields="{
|
||||||
|
children:'children',
|
||||||
|
title:'name',
|
||||||
|
key:'id'
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<template slot="name" slot-scope="{ name }">
|
||||||
|
<span v-if="name.indexOf(searchValue) > -1">
|
||||||
|
{{ name.substr(0, name.indexOf(searchValue)) }}
|
||||||
|
<span style="color: #f50">{{ searchValue }}</span>
|
||||||
|
{{ name.substr(name.indexOf(searchValue) + searchValue.length) }}
|
||||||
|
</span>
|
||||||
|
<span v-else>{{ name }}</span>
|
||||||
|
</template>
|
||||||
|
</a-tree>
|
||||||
|
</div>
|
||||||
|
</a-modal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { orgList } from '@/api/org/org'
|
||||||
|
import { listToTree } from '@/utils/util'
|
||||||
|
const rootParentId = 0
|
||||||
|
|
||||||
|
// 所有节点放进dataList,便于搜索
|
||||||
|
const dataList = []
|
||||||
|
const generateList = data => {
|
||||||
|
for (let i = 0; i < data.length; i++) {
|
||||||
|
const node = data[i]
|
||||||
|
// 设置插槽,搜索结果样式变化
|
||||||
|
node.scopedSlots = { title: 'name' }
|
||||||
|
const id = node.id
|
||||||
|
const name = node.name
|
||||||
|
dataList.push({ id, name })
|
||||||
|
if (node.children) {
|
||||||
|
generateList(node.children)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取传入id所在节点的父节点
|
||||||
|
const getParentKey = (id, tree) => {
|
||||||
|
let parentKey
|
||||||
|
for (let i = 0; i < tree.length; i++) {
|
||||||
|
const node = tree[i]
|
||||||
|
if (node.children) {
|
||||||
|
if (node.children.some(item => item.id === id)) {
|
||||||
|
parentKey = node.id
|
||||||
|
} else if (getParentKey(id, node.children)) {
|
||||||
|
parentKey = getParentKey(id, node.children)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return parentKey
|
||||||
|
}
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
expandedKeys: [],
|
||||||
|
searchValue: '',
|
||||||
|
autoExpandParent: true,
|
||||||
|
orgList: [],
|
||||||
|
isShowOrg: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onExpand (expandedKeys) {
|
||||||
|
this.expandedKeys = expandedKeys
|
||||||
|
this.autoExpandParent = false
|
||||||
|
},
|
||||||
|
onSelect (selectedKeys, info) {
|
||||||
|
var orgInfo = info.node.dataRef
|
||||||
|
const org = { id: orgInfo.id, name: orgInfo.name }
|
||||||
|
this.$emit('selectOrg', org)
|
||||||
|
this.isShowOrg = false
|
||||||
|
},
|
||||||
|
onChange (e) {
|
||||||
|
const value = e.target.value
|
||||||
|
// 获取搜索结果所在节点的父节点集合
|
||||||
|
const expandedKeys = dataList
|
||||||
|
.map(item => {
|
||||||
|
if (item.name.indexOf(value) > -1) {
|
||||||
|
return getParentKey(item.id, this.orgList)
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
})
|
||||||
|
.filter((item, i, self) => item && self.indexOf(item) === i)
|
||||||
|
// 拷贝,根据搜索结果设置展开节点
|
||||||
|
Object.assign(this, {
|
||||||
|
expandedKeys,
|
||||||
|
searchValue: value,
|
||||||
|
autoExpandParent: true
|
||||||
|
})
|
||||||
|
},
|
||||||
|
loadOrg () {
|
||||||
|
orgList().then(res => {
|
||||||
|
if (!res.code === 200 || !res.data.length) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const orgTree = listToTree(res.data, [], rootParentId)
|
||||||
|
for (var item of orgTree) {
|
||||||
|
if (item.pid === 0) {
|
||||||
|
this.expandedKeys.push(item.id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
generateList(orgTree)
|
||||||
|
this.orgList = orgTree
|
||||||
|
})
|
||||||
|
this.isShowOrg = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -0,0 +1,8 @@
|
||||||
|
<template>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
|
@ -0,0 +1,332 @@
|
||||||
|
<template>
|
||||||
|
<a-modal
|
||||||
|
:title="modalTitle"
|
||||||
|
:width="900"
|
||||||
|
:visible="visible"
|
||||||
|
:confirmLoading="confirmLoading"
|
||||||
|
@ok="handleSubmit"
|
||||||
|
@cancel="handleCancel"
|
||||||
|
>
|
||||||
|
<a-spin :spinning="confirmLoading">
|
||||||
|
<a-divider orientation="left">基本信息</a-divider>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item style="display: none;">
|
||||||
|
<a-input v-decorator="['id']" />
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item style="display: none;">
|
||||||
|
<a-input v-decorator="['userId']" />
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item
|
||||||
|
label="用户名"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input placeholder="请输入用户名" v-decorator="['userName', {rules: [{required: true, min: 5, message: '请输入至少五个字符的账号!'}]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="12" :sm="24" >
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="姓名"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input placeholder="请输入姓名" v-decorator="['name', {rules: [{required: true, message: '请输入姓名!'}]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="身份证"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input placeholder="请输入身份证" v-decorator="['idCardNo', {rules: [{required: true, message: '请输入身份证!'}]}]" @blur="idCardNoBlur"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="年龄"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input readOnly v-decorator="['age']" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="性别"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
>
|
||||||
|
<a-radio-group readOnly v-decorator="['sex',{rules: [{ required: true, message: '请选择性别!' }]}]" >
|
||||||
|
<a-radio :value="1">男</a-radio>
|
||||||
|
<a-radio :value="2">女</a-radio>
|
||||||
|
</a-radio-group>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="手机号"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input placeholder="请输入手机号" v-decorator="['phone',{rules: [{ required: true, message: '请输入手机号!' }]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="24" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="岗位"
|
||||||
|
:labelCol="{span: 3}"
|
||||||
|
:wrapperCol="{span: 20}"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input v-decorator="['jobs',{rules: [{ required: true, message: '请输入岗位!' }]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="工种"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input v-decorator="['workType',{rules: [{ required: true, message: '请输入工种!' }]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="学历"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input v-decorator="['degreeId',{rules: [{ required: true, message: '请输入工种!' }]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="24" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="人员类型"
|
||||||
|
:labelCol="{span: 3}"
|
||||||
|
:wrapperCol="{span: 20}"
|
||||||
|
>
|
||||||
|
<a-checkbox-group v-decorator="['type',{rules: [{ required: true, message: '请选择人员类型!' }]}]">
|
||||||
|
<a-checkbox value="1" name="type">
|
||||||
|
单位主要负责人
|
||||||
|
</a-checkbox>
|
||||||
|
<a-checkbox value="2" name="type">
|
||||||
|
安全管理员
|
||||||
|
</a-checkbox>
|
||||||
|
<a-checkbox value="3" name="type">
|
||||||
|
班组长
|
||||||
|
</a-checkbox>
|
||||||
|
<a-checkbox value="4" name="type">
|
||||||
|
特种作业人员
|
||||||
|
</a-checkbox>
|
||||||
|
<a-checkbox value="5" name="type">
|
||||||
|
其他
|
||||||
|
</a-checkbox>
|
||||||
|
</a-checkbox-group>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="12" :sm="24">
|
||||||
|
<a-form :form="form">
|
||||||
|
<a-form-item
|
||||||
|
label="部门信息"
|
||||||
|
:labelCol="labelCol"
|
||||||
|
:wrapperCol="wrapperCol"
|
||||||
|
has-feedback
|
||||||
|
>
|
||||||
|
<a-input readOnly @click="openOrgTree" v-decorator="['orgName',{rules: [{ required: true, message: '请选择机构!' }]}]" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item style="display: none;">
|
||||||
|
<a-input v-decorator="['orgId']" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-spin>
|
||||||
|
|
||||||
|
<org-tree @selectOrg="selectOrg($event)" ref="orgModal"/>
|
||||||
|
|
||||||
|
</a-modal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { personAddOrUpdate, personGet } from '@/api/person/person'
|
||||||
|
import OrgTree from '../org/OrgTree'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
OrgTree
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
labelCol: {
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 6 }
|
||||||
|
},
|
||||||
|
wrapperCol: {
|
||||||
|
xs: { span: 24 },
|
||||||
|
sm: { span: 16 }
|
||||||
|
},
|
||||||
|
modalTitle: '新增人员',
|
||||||
|
visible: false,
|
||||||
|
confirmLoading: false,
|
||||||
|
form: this.$form.createForm(this)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 新增初始化方法
|
||||||
|
add () {
|
||||||
|
this.modalTitle = '新增人员'
|
||||||
|
this.visible = true
|
||||||
|
},
|
||||||
|
// 编辑初始化方法
|
||||||
|
edit (record) {
|
||||||
|
this.modalTitle = '编辑人员'
|
||||||
|
this.confirmLoading = true
|
||||||
|
this.visible = true
|
||||||
|
// 基本信息加入表单
|
||||||
|
personGet({id: record.id}).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
const data = res.data
|
||||||
|
// 默认选中的多选框
|
||||||
|
const type = data.type.split(',')
|
||||||
|
this.form.getFieldDecorator('type', { valuePropName: 'checked', initialValue: type })
|
||||||
|
|
||||||
|
this.form.setFieldsValue(
|
||||||
|
{
|
||||||
|
id: data.id,
|
||||||
|
userId: data.userId,
|
||||||
|
name: data.name,
|
||||||
|
userName: data.userName,
|
||||||
|
idCardNo: data.idCardNo,
|
||||||
|
// age: data.age,
|
||||||
|
// sex: data.sex,
|
||||||
|
phone: data.phone,
|
||||||
|
jobs: data.jobs,
|
||||||
|
workType: data.workType,
|
||||||
|
degreeId: data.degreeId,
|
||||||
|
orgId: data.orgId,
|
||||||
|
orgName: data.orgName
|
||||||
|
}
|
||||||
|
)
|
||||||
|
// 动态赋值年龄和性别
|
||||||
|
this.analyzeIdCardNo(data.idCardNo)
|
||||||
|
} else {
|
||||||
|
this.$message.error('查询失败:' + res.msg)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.confirmLoading = false
|
||||||
|
},
|
||||||
|
handleSubmit () {
|
||||||
|
const { form: { validateFields } } = this
|
||||||
|
this.confirmLoading = true
|
||||||
|
validateFields((errors, values) => {
|
||||||
|
if (!errors) {
|
||||||
|
values.type = values.type.join(',')
|
||||||
|
console.log(values)
|
||||||
|
personAddOrUpdate(values).then((res) => {
|
||||||
|
this.confirmLoading = false
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('操作成功')
|
||||||
|
this.$emit('ok', values)
|
||||||
|
this.handleCancel()
|
||||||
|
} else {
|
||||||
|
this.$message.error('操作失败:' + res.msg)
|
||||||
|
}
|
||||||
|
}).finally((res) => {
|
||||||
|
this.confirmLoading = false
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.confirmLoading = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
idCardNoBlur (event) {
|
||||||
|
const idCardNo = event.target.value
|
||||||
|
this.analyzeIdCardNo(idCardNo)
|
||||||
|
},
|
||||||
|
analyzeIdCardNo (idCardNo) {
|
||||||
|
// 如果用户身份证号码为undefined则返回空
|
||||||
|
if (!idCardNo) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取性别
|
||||||
|
if (parseInt(idCardNo.substr(16, 1)) % 2 === 1) {
|
||||||
|
this.form.setFieldsValue({ sex: 1 })
|
||||||
|
} else {
|
||||||
|
console.log('sex 2')
|
||||||
|
this.form.setFieldsValue({ sex: 2 })
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取出生日期
|
||||||
|
var yearBirth = idCardNo.substring(6, 10)
|
||||||
|
var monthBirth = idCardNo.substring(10, 12)
|
||||||
|
var dayBirth = idCardNo.substring(12, 14)
|
||||||
|
// 获取当前年月日并计算年龄
|
||||||
|
var myDate = new Date()
|
||||||
|
var monthNow = myDate.getMonth() + 1
|
||||||
|
var dayNow = myDate.getDate()
|
||||||
|
var age = myDate.getFullYear() - yearBirth
|
||||||
|
if (monthNow < monthBirth || (monthNow === monthBirth && dayNow < dayBirth)) {
|
||||||
|
age--
|
||||||
|
}
|
||||||
|
console.log(age)
|
||||||
|
// 得到年龄
|
||||||
|
this.form.setFieldsValue({ age })
|
||||||
|
},
|
||||||
|
openOrgTree () {
|
||||||
|
this.$refs.orgModal.loadOrg()
|
||||||
|
},
|
||||||
|
selectOrg (orgData) {
|
||||||
|
console.log(orgData)
|
||||||
|
this.form.setFieldsValue({ orgId: orgData.id })
|
||||||
|
this.form.setFieldsValue({ orgName: orgData.name })
|
||||||
|
},
|
||||||
|
handleCancel () {
|
||||||
|
this.form.resetFields()
|
||||||
|
this.visible = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -0,0 +1,347 @@
|
||||||
|
<template>
|
||||||
|
<a-row :gutter="24">
|
||||||
|
<a-col :md="5" :sm="24">
|
||||||
|
<a-card :bordered="false" :loading="treeLoading">
|
||||||
|
<div v-if="this.orgTree != ''">
|
||||||
|
<a-tree
|
||||||
|
:treeData="orgTree"
|
||||||
|
v-if="orgTree.length"
|
||||||
|
@select="handleClick"
|
||||||
|
:defaultExpandAll="true"
|
||||||
|
:defaultExpandedKeys="defaultExpandedKeys"
|
||||||
|
:replaceFields="replaceFields" />
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
<a-empty :image="simpleImage" />
|
||||||
|
</div>
|
||||||
|
</a-card>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="19" :sm="24">
|
||||||
|
<a-card :bordered="false">
|
||||||
|
<div class="table-page-search-wrapper">
|
||||||
|
<a-form layout="inline">
|
||||||
|
<a-row :gutter="48">
|
||||||
|
<a-col :md="8" :sm="24">
|
||||||
|
<a-form-item label="姓名" >
|
||||||
|
<a-input v-model="queryParam.name" allow-clear placeholder="请输入姓名"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="8" :sm="24">
|
||||||
|
<a-form-item label="用户名" >
|
||||||
|
<a-input v-model="queryParam.userName" allow-clear placeholder="请输入用户名"/>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :md="8" :sm="24">
|
||||||
|
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
|
||||||
|
<a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
</a-card>
|
||||||
|
<a-card :bordered="false">
|
||||||
|
<div class="table-operator">
|
||||||
|
<a-button @click="$refs.personForm.add()" icon="plus" type="primary" v-if="hasPerm('person:add')">新增人员</a-button>
|
||||||
|
|
||||||
|
<a-button @click="transfer" type="primary" v-if="hasPerm('person:transfer')">转移部门</a-button>
|
||||||
|
<a-button @click="quit" type="primary" v-if="hasPerm('person:quit')">离职</a-button>
|
||||||
|
<!-- <a-button @click="export" type="primary" >导出</a-button> -->
|
||||||
|
<a-button @click="setAdmin" type="primary" v-if="hasPerm('person:setAdmin')">设置管理员</a-button>
|
||||||
|
<!-- <a-button @click="import" type="primary" v-if="hasPerm('person:import')">批量导入</a-button> -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="table-operator">
|
||||||
|
<div class='person-type'>
|
||||||
|
<a-radio-group v-model="queryParam.isAdmin" @change="onRadioChange">
|
||||||
|
<a-radio :value="2">学员</a-radio>
|
||||||
|
<a-radio :value="1">管理员</a-radio>
|
||||||
|
</a-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<s-table
|
||||||
|
ref="table"
|
||||||
|
:columns="columns"
|
||||||
|
:data="loadData"
|
||||||
|
:rowKey="(record) => record.id"
|
||||||
|
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
|
||||||
|
>
|
||||||
|
<template slot="registerDate" slot-scope="text, record">
|
||||||
|
{{ record.registerDate | moment('YYYY-MM-DD') }}
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<span slot="action" slot-scope="text, record">
|
||||||
|
<a v-if="hasPerm('person:detail')" @click="$refs.personDetail.detial(record)">详情</a>
|
||||||
|
<a-divider type="vertical" v-if="hasPerm('person:detail')" />
|
||||||
|
<a-dropdown v-if="hasPerm('person:edit') || hasPerm('person:resetPwd') || hasPerm('person:del')">
|
||||||
|
<a class="ant-dropdown-link">
|
||||||
|
更多 <a-icon type="down" />
|
||||||
|
</a>
|
||||||
|
<a-menu slot="overlay">
|
||||||
|
<a-menu-item v-if="hasPerm('person:edit')">
|
||||||
|
<a @click="$refs.personForm.edit(record)">编辑</a>
|
||||||
|
</a-menu-item>
|
||||||
|
<a-menu-item v-if="hasPerm('person:resetPwd')">
|
||||||
|
<a-popconfirm placement="topRight" title="确认重置密码?" @confirm="() => resetPwd(record)">
|
||||||
|
<a>重置密码</a>
|
||||||
|
</a-popconfirm>
|
||||||
|
</a-menu-item>
|
||||||
|
<a-menu-item v-if="hasPerm('person:del')">
|
||||||
|
<a-popconfirm placement="topRight" title="确认删除?" @confirm="() => personDelete(record)">
|
||||||
|
<a>删除</a>
|
||||||
|
</a-popconfirm>
|
||||||
|
</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</a-dropdown>
|
||||||
|
</span>
|
||||||
|
</s-table>
|
||||||
|
|
||||||
|
<person-form ref="personForm" @ok="handleOk" />
|
||||||
|
<person-detail ref="personDetail" @ok="handleOk" />
|
||||||
|
<org-tree @selectOrg="selectOrg($event)" ref="orgModal"/>
|
||||||
|
|
||||||
|
</a-card>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { STable } from '@/components'
|
||||||
|
import { Empty } from 'ant-design-vue'
|
||||||
|
import { orgList } from '@/api/org/org'
|
||||||
|
import { listToTree } from '@/utils/util'
|
||||||
|
import { personPage, personDel, personQuit, personTransferOrg, personSetAdmin, personResetPwd } from '@/api/person/person'
|
||||||
|
import PersonForm from './PersonForm'
|
||||||
|
import PersonDetail from './PersonDetail'
|
||||||
|
import OrgTree from '../org/OrgTree'
|
||||||
|
const rootParentId = 0
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
STable,
|
||||||
|
PersonForm,
|
||||||
|
PersonDetail,
|
||||||
|
OrgTree
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
// 查询参数
|
||||||
|
queryParam: {isAdmin: 2},
|
||||||
|
// 表头
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: '姓名',
|
||||||
|
dataIndex: 'name'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '用户名',
|
||||||
|
dataIndex: 'userName'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '单位信息',
|
||||||
|
dataIndex: 'unit'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '部门信息',
|
||||||
|
dataIndex: 'dept'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '年度学时要求',
|
||||||
|
dataIndex: 'classHours'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '注册时间',
|
||||||
|
dataIndex: 'registerDate',
|
||||||
|
scopedSlots: { customRender: 'registerDate' }
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 加载数据方法 必须为 Promise 对象
|
||||||
|
loadData: parameter => {
|
||||||
|
return personPage(Object.assign(parameter, this.queryParam)).then((res) => {
|
||||||
|
return res
|
||||||
|
})
|
||||||
|
},
|
||||||
|
orgTree: [],
|
||||||
|
selectedRowKeys: [],
|
||||||
|
selectedRows: [],
|
||||||
|
defaultExpandedKeys: [],
|
||||||
|
treeLoading: true,
|
||||||
|
simpleImage: Empty.PRESENTED_IMAGE_SIMPLE,
|
||||||
|
replaceFields: {
|
||||||
|
children: 'children',
|
||||||
|
title: 'name',
|
||||||
|
key: 'id',
|
||||||
|
value: 'id'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
/**
|
||||||
|
* 获取到机构树,展开顶级下树节点,考虑到后期数据量变大,不建议全部展开
|
||||||
|
*/
|
||||||
|
orgList().then(res => {
|
||||||
|
this.treeLoading = false
|
||||||
|
if (!res.code === 200 || !res.data.length) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.orgTree = listToTree(res.data, [], rootParentId)
|
||||||
|
for (var item of this.orgTree) {
|
||||||
|
if (item.pid === 0) {
|
||||||
|
this.defaultExpandedKeys.push(item.id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
if (this.hasPerm('person:edit') || this.hasPerm('person:resetPwd') || this.hasPerm('person:del')) {
|
||||||
|
this.columns.push({
|
||||||
|
title: '操作',
|
||||||
|
width: '150px',
|
||||||
|
dataIndex: 'action',
|
||||||
|
scopedSlots: { customRender: 'action' }
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/**
|
||||||
|
* 重置密码
|
||||||
|
*/
|
||||||
|
resetPwd (record) {
|
||||||
|
personResetPwd({ id: record.id }).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('重置成功')
|
||||||
|
// this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('重置失败:' + res.message)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 删除用户
|
||||||
|
*/
|
||||||
|
personDelete (record) {
|
||||||
|
personDel({ id: record.id, deleteReason: '' }).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('删除成功')
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('删除失败:' + res.message)
|
||||||
|
}
|
||||||
|
}).catch((err) => {
|
||||||
|
this.$message.error('删除错误:' + err.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
quit () {
|
||||||
|
if (!this.selectedRowKeys.length) {
|
||||||
|
this.$message.warning('请选择人员')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$confirm({
|
||||||
|
title: '提示',
|
||||||
|
content: '确认离职吗',
|
||||||
|
onOk: () => {
|
||||||
|
const paramIds = this.selectedRowKeys.join(',')
|
||||||
|
const param = { 'ids': paramIds }
|
||||||
|
personQuit(param).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('操作成功')
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('操作失败:' + res.message)
|
||||||
|
}
|
||||||
|
}).catch((err) => {
|
||||||
|
this.$message.error('操作错误:' + err.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onCancel () {
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
transfer () {
|
||||||
|
if (!this.selectedRowKeys.length) {
|
||||||
|
this.$message.warning('请选择人员')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$refs.orgModal.loadOrg()
|
||||||
|
},
|
||||||
|
selectOrg (orgData) {
|
||||||
|
this.$confirm({
|
||||||
|
title: '提示',
|
||||||
|
content: '确认转移部门至'+ orgData.name +'吗',
|
||||||
|
onOk: () => {
|
||||||
|
const paramIds = this.selectedRowKeys.join(',')
|
||||||
|
const param = { ids: paramIds,targetOrgId: orgData.id }
|
||||||
|
personTransferOrg(param).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('操作成功')
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('操作失败:' + res.message)
|
||||||
|
}
|
||||||
|
}).catch((err) => {
|
||||||
|
this.$message.error('操作错误:' + err.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onCancel () {
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
setAdmin () {
|
||||||
|
if (!this.selectedRowKeys.length) {
|
||||||
|
this.$message.warning('请选择人员')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$confirm({
|
||||||
|
title: '提示',
|
||||||
|
content: '确认设置为管理员吗',
|
||||||
|
onOk: () => {
|
||||||
|
const paramIds = this.selectedRowKeys.join(',')
|
||||||
|
const param = { 'ids': paramIds }
|
||||||
|
personSetAdmin(param).then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success('操作成功')
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
} else {
|
||||||
|
this.$message.error('操作失败:' + res.message)
|
||||||
|
}
|
||||||
|
}).catch((err) => {
|
||||||
|
this.$message.error('操作错误:' + err.message)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onCancel () {
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 点击左侧机构树查询列表
|
||||||
|
*/
|
||||||
|
handleClick (e) {
|
||||||
|
this.queryParam = {
|
||||||
|
'orgId': e.toString()
|
||||||
|
}
|
||||||
|
this.$refs.table.refresh(true)
|
||||||
|
},
|
||||||
|
handleOk () {
|
||||||
|
this.$refs.table.refresh()
|
||||||
|
},
|
||||||
|
onRadioChange(e) {
|
||||||
|
this.queryParam.isAdmin = e.target.value
|
||||||
|
this.$refs.table.refresh(true)
|
||||||
|
},
|
||||||
|
onSelectChange (selectedRowKeys, selectedRows) {
|
||||||
|
this.selectedRowKeys = selectedRowKeys
|
||||||
|
this.selectedRows = selectedRows
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
.table-operator {
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
.person-type span{
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -229,9 +229,7 @@
|
||||||
this.meneTypeFunc(record.type.toString())
|
this.meneTypeFunc(record.type.toString())
|
||||||
|
|
||||||
// 默认选中的单选框
|
// 默认选中的单选框
|
||||||
// eslint-disable-next-line no-unused-vars
|
|
||||||
const visibleDef = false
|
const visibleDef = false
|
||||||
// eslint-disable-next-line eqeqeq
|
|
||||||
if (record.visible == 1) {
|
if (record.visible == 1) {
|
||||||
this.visibleDef = true
|
this.visibleDef = true
|
||||||
}
|
}
|
||||||
|
|
|
@ -48,7 +48,7 @@
|
||||||
<span slot="action" slot-scope="text, record">
|
<span slot="action" slot-scope="text, record">
|
||||||
<a v-if="hasPerm('sys:user:edit')" @click="$refs.userForm.edit(record)">编辑</a>
|
<a v-if="hasPerm('sys:user:edit')" @click="$refs.userForm.edit(record)">编辑</a>
|
||||||
<a-divider type="vertical" v-if="hasPerm('sys:user:edit')" />
|
<a-divider type="vertical" v-if="hasPerm('sys:user:edit')" />
|
||||||
<a-dropdown v-if="hasPerm('sys:user:resetPwd') || hasPerm('sys:user:grantRole') || hasPerm('sys:user:delete')">
|
<a-dropdown v-if="hasPerm('sys:user:resetPwd') || hasPerm('sys:user:grantRole') || hasPerm('sys:user:del')">
|
||||||
<a class="ant-dropdown-link">
|
<a class="ant-dropdown-link">
|
||||||
更多 <a-icon type="down" />
|
更多 <a-icon type="down" />
|
||||||
</a>
|
</a>
|
||||||
|
@ -138,7 +138,7 @@ export default {
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
// 动态加载权限
|
// 动态加载权限
|
||||||
if (this.hasPerm('sys:user:edit') || this.hasPerm('sys:user:resetPwd') || this.hasPerm('sys:user:grantRole') || this.hasPerm('sys:user:delete')) {
|
if (this.hasPerm('sys:user:edit') || this.hasPerm('sys:user:resetPwd') || this.hasPerm('sys:user:grantRole') || this.hasPerm('sys:user:del')) {
|
||||||
this.columns.push({
|
this.columns.push({
|
||||||
title: '操作',
|
title: '操作',
|
||||||
width: '150px',
|
width: '150px',
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<template>
|
<template>
|
||||||
<page-header-wrapper :title="false">
|
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<div class="table-page-search-wrapper">
|
<div class="table-page-search-wrapper">
|
||||||
<SearchCom
|
<SearchCom
|
||||||
|
@ -30,7 +29,6 @@
|
||||||
</s-table>
|
</s-table>
|
||||||
<dictionary-form ref="modal" @ok="handleOk" />
|
<dictionary-form ref="modal" @ok="handleOk" />
|
||||||
</a-card>
|
</a-card>
|
||||||
</page-header-wrapper>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<template>
|
<template>
|
||||||
<page-header-wrapper :title="false">
|
|
||||||
<a-card :bordered="false">
|
<a-card :bordered="false">
|
||||||
<div class="table-page-search-wrapper">
|
<div class="table-page-search-wrapper">
|
||||||
<a-form layout="inline">
|
<a-form layout="inline">
|
||||||
|
@ -43,7 +42,6 @@
|
||||||
</s-table>
|
</s-table>
|
||||||
<dictionaryItem-form ref="modal" @ok="handleOk" />
|
<dictionaryItem-form ref="modal" @ok="handleOk" />
|
||||||
</a-card>
|
</a-card>
|
||||||
</page-header-wrapper>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
@ -107,7 +105,7 @@ export default {
|
||||||
},
|
},
|
||||||
// 删
|
// 删
|
||||||
handleDelete (record) {
|
handleDelete (record) {
|
||||||
dictionaryItemDel({ ids: record.id, deleteReason: "" }).then(() => {
|
dictionaryItemDel({ ids: record.id, deleteReason: '' }).then(() => {
|
||||||
this.$refs.table.refresh()
|
this.$refs.table.refresh()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue