129 lines
2.6 KiB
Vue
129 lines
2.6 KiB
Vue
|
|
|
|
<template>
|
|
<div>
|
|
<Curd
|
|
:columns="columns"
|
|
:api-conf="apiConf"
|
|
:form-items="formItems"
|
|
@edit="editHandler"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import base from "~/templates/base";
|
|
import Curd from "../../components/smallCommon/Curd.vue";
|
|
export default {
|
|
name: "user",
|
|
extends: base,
|
|
components: {
|
|
Curd
|
|
},
|
|
data () {
|
|
return {
|
|
isEdit: false,
|
|
roles: [],
|
|
columns: [
|
|
{
|
|
dataIndex: 'username',
|
|
key: 'username',
|
|
title: '用户名'
|
|
},
|
|
|
|
{
|
|
dataIndex: 'email',
|
|
key: 'email',
|
|
title: '邮箱'
|
|
},
|
|
{
|
|
dataIndex: 'phone',
|
|
key: 'phone',
|
|
title: '电话'
|
|
},
|
|
{
|
|
dataIndex: 'roleId',
|
|
key: 'roleId',
|
|
title: '角色'
|
|
}
|
|
],
|
|
apiConf: {
|
|
listApi: { api: '/api/User/List', method: 'get' },
|
|
deleteApi: { api: '/api/User/DeleteUser', method: 'post', paramsType: 'Object', deleteKey: 'userId' } ,
|
|
editApi: { api: '/api/User/UpdateUser', method: 'post', },
|
|
addApi: { api: '/api/User/Add', method: 'post' }
|
|
}
|
|
}
|
|
},
|
|
|
|
computed: {
|
|
formItems () {
|
|
const self = this
|
|
return [
|
|
{
|
|
type: 'input',
|
|
key: 'username',
|
|
label: '用户名',
|
|
isSearch: true,
|
|
placeholder: '请输入用户名',
|
|
rules: [
|
|
{ required: true, message: '请输入用户名' }
|
|
]
|
|
},
|
|
{
|
|
type: 'input',
|
|
key: 'password',
|
|
label: '密码',
|
|
placeholder: '请输入密码',
|
|
hide: self.isEdit,
|
|
rules: [
|
|
{ required: true, message: '请输入密码' }
|
|
]
|
|
},
|
|
{
|
|
type: 'input',
|
|
key: 'email',
|
|
label: '邮箱',
|
|
placeholder: '请输入邮箱',
|
|
},
|
|
{
|
|
type: 'input',
|
|
key: 'phone',
|
|
label: '电话',
|
|
placeholder: '请输入电话',
|
|
},
|
|
{
|
|
type: 'select',
|
|
key: 'roleId',
|
|
label: '角色',
|
|
placeholder: '请选择角色',
|
|
children: self.roles,
|
|
rules: [
|
|
{ required: true, message: '请选择角色' }
|
|
]
|
|
}
|
|
]
|
|
}
|
|
},
|
|
created() {
|
|
this.getRoles()
|
|
},
|
|
|
|
methods: {
|
|
editHandler (isEdit) {
|
|
this.isEdit = isEdit
|
|
},
|
|
getRoles () {
|
|
this.$get('/api/Role/all').then(({ data }) => {
|
|
this.roles = data.map(item => ({
|
|
label: item.roleName,
|
|
value: item.id
|
|
}))
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped lang="less">
|
|
|
|
</style>
|