refactor: 前端驼峰转下划线

This commit is contained in:
2024-01-27 15:41:13 +08:00
parent 1c6f2bd7be
commit 29ca5f703c
18 changed files with 496 additions and 400 deletions

View File

@@ -36,7 +36,7 @@
@keyup.enter.native="crud.toQuery"
/>
<el-select
v-model="query.isUsed"
v-model="query.is_used"
clearable
size="mini"
placeholder="状态"
@@ -72,7 +72,7 @@
<el-input v-model.number="form.phone" style="width: 200px;" />
</el-form-item>
<el-form-item label="姓名" prop="preson_name">
<el-input v-model="form.personName" style="width: 200px;" />
<el-input v-model="form.person_name" style="width: 200px;" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="form.email" style="width: 200px;" />
@@ -91,7 +91,7 @@
/>
</el-form-item>
<br v-if="!crud.status.add">
<el-form-item v-if="crud.status.add" label="密码" prop="password">
<el-form-item label="密码" prop="password">
<el-input v-model="form.password" style="width: 200px;" show-password auto-complete="new-password" />
</el-form-item>
<el-form-item label="性别">
@@ -100,9 +100,9 @@
<el-radio label="">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="状态" prop="isUesd">
<el-form-item label="状态" prop="is_uesd">
<el-switch
v-model="form.isUsed"
v-model="form.is_used"
active-color="#409EFF"
inactive-color="#F56C6C"
/>
@@ -122,9 +122,9 @@
<!--:disabled="level !== 1 && item.level <= level"-->
<el-option
v-for="item in roles"
:key="item.roleId"
:key="item.role_id"
:label="item.name"
:value="item.roleId"
:value="item.role_id"
/>
</el-select>
</el-form-item>
@@ -145,24 +145,26 @@
<el-table-column :selectable="checkboxT" type="selection" width="55" />
<el-table-column prop="username" label="用户名" :min-width="flexWidth('username',crud.data,'用户名')" />
<el-table-column
prop="personName"
prop="person_name"
label="姓名"
:min-width="flexWidth('personName',crud.data,'姓名')"
:min-width="flexWidth('person_name',crud.data,'姓名')"
/>
<el-table-column prop="gender" label="性别" :min-width="flexWidth('personName',crud.data,'性别')" />
<el-table-column prop="gender" label="性别" :min-width="flexWidth('gender',crud.data,'性别')" />
<el-table-column prop="phone" label="电话" :min-width="flexWidth('phone',crud.data,'电话')" />
<el-table-column prop="email" label="邮箱" :min-width="flexWidth('email',crud.data,'邮箱')" />
<el-table-column show-overflow-tooltip prop="depts" label="部门">
<el-table-column show-overflow-tooltip prop="depts" label="部门" :min-width="flexWidth('depts',crud.data,'邮箱')">
<template slot-scope="scope">
<span v-for=" item in scope.row.depts" :key="item.index">{{ item.name }} </span>
</template>
</el-table-column>>
<el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<span :style="{'color': caseStatusColorFilter(scope.row.isUsed)}">{{ enabledTypeOptions.find(item => {return item.key == scope.row.isUsed}).display_name }}</span>
<span v-for="(item, index) in scope.row.depts" :key="index">
{{ item.name }}<span v-if="index !== scope.row.depts.length - 1">、</span>
</span>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建日期" :min-width="flexWidth('createTime',crud.data,'创建日期')" />
<el-table-column label="状态" align="center" prop="enabled">
<template slot-scope="scope">
<span :style="{'color': caseStatusColorFilter(scope.row.is_used)}">{{ enabledTypeOptions.find(item => {return item.key == scope.row.is_used}).display_name }}</span>
</template>
</el-table-column>
<el-table-column prop="create_time" label="创建日期" :min-width="flexWidth('create_time',crud.data,'创建日期')" />
<el-table-column
label="操作"
fixed="right"
@@ -172,17 +174,17 @@
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="crud.toEdit(scope.row)">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handdeleted(scope.row)">删除</el-button>
<el-dropdown size="mini">
<el-dropdown v-hasPermi="['system:user:resetPwd', 'system:user:edit']" size="mini">
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item icon="el-icon-refresh-right"><span @click="resetPassword(scope.row)">重置密码</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-key">
<span @click="openDeptDrawer(scope.row)">分配部门</span>
<span @click="openDeptDrawer(scope.row)">部门权限</span>
</el-dropdown-item>
<el-dropdown-item icon="el-icon-key">
<span @click="openDataDialog(scope.row)">数据权限</span>
</el-dropdown-item>
<el-dropdown-item icon="el-icon-lock"><span @click="changeEnabled(scope.row)">{{ enabledTypeOptions.find(item => {return item.key !== scope.row.isUsed}).display_name }}账号</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-lock"><span @click="changeEnabled(scope.row)">{{ enabledTypeOptions.find(item => {return item.key !== scope.row.is_used}).display_name }}账号</span></el-dropdown-item>
<el-dropdown-item icon="el-icon-circle-check">
<span @click="openRoleDrawer(scope.row)">分配角色</span>
</el-dropdown-item>
@@ -214,7 +216,7 @@
:data="deptsDatas"
:default-checked-keys="depChecked"
:props="deptProps"
node-key="deptId"
node-key="dept_id"
highlight-current
check-strictly
@check="handCheck"
@@ -249,8 +251,8 @@
<el-form-item label="用户名" prop="username">
<el-input v-model="dataDialog.username" disabled style="width: 200px;" />
</el-form-item>
<el-form-item label="姓名" prop="presonName">
<el-input v-model="dataDialog.personName" disabled style="width: 200px;" />
<el-form-item label="姓名" prop="person_name">
<el-input v-model="dataDialog.person_name" disabled style="width: 200px;" />
</el-form-item>
<el-table
ref="dialogTable"
@@ -263,15 +265,15 @@
<el-table-column label="数据权限">
<template slot-scope="scope">
<el-select
v-model="scope.row.permissionId"
v-model="scope.row.permission_id"
placeholder="请选择"
@change="openRelevance(scope.row, scope.$index)"
>
<el-option
v-for="item in permissions"
:key="item.permissionId"
:key="item.permission_id"
:label="item.name"
:value="item.permissionId"
:value="item.permission_id"
/>
</el-select>
</template>
@@ -304,10 +306,14 @@
:data="dataPermissions"
style="width: 100%; max-height: 500px"
>
<el-table-column prop="permissionScopeType" label="权限类型" min-width="100" show-overflow-tooltip />
<el-table-column prop="permission_scope_type" label="权限类型" min-width="100" show-overflow-tooltip>
<template slot-scope="scope">
{{ dict.label.permission_scope_type[scope.row.permission_scope_type] }}
</template>
</el-table-column>
<el-table-column prop="permissionName" label="权限范围" min-width="100" show-overflow-tooltip />
<el-table-column prop="deptName" label="部门名称" min-width="100" show-overflow-tooltip />
<el-table-column prop="personName" label="用户名称" min-width="100" show-overflow-tooltip />
<el-table-column prop="person_name" label="用户名称" min-width="100" show-overflow-tooltip />
</el-table>
</el-dialog>
<relevance-user-dialog :dialog-show.sync="relevanceUser" :is-single="false" :users="userIds" @selectUsers="selectUsers" />
@@ -317,7 +323,7 @@
<script>
import crudUser from '@/views/system/user/user'
import crudDept from '@/views/system/dept/dept'
import crudDept from '../dept/dept'
import crudDataPermission from '@/views/system/dataPermission/dataPermission'
import { getAll, getLevel } from '@/views/system/role/role'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
@@ -333,13 +339,13 @@ import RelevanceDeptDialog from '@/views/system/user/dialog/relevanceDeptDialog'
let userRoles = []
const defaultForm = {
deptId: null,
dept_id: null,
depts: [],
username: null,
personName: null,
person_name: null,
gender: '男',
email: null,
isUsed: true,
is_used: true,
roles: [],
phone: null,
password: null
@@ -348,7 +354,7 @@ export default {
name: 'User',
components: { RelevanceDeptDialog, RelevanceUserDialog, Treeselect, crudOperation, rrOperation, udOperation, pagination },
cruds() {
return CRUD({ title: '用户', idField: 'userId', url: 'api/users', crudMethod: { ...crudUser }})
return CRUD({ title: '用户', idField: 'user_id', url: 'api/users', crudMethod: { ...crudUser }})
},
mixins: [presenter(), header(), form(defaultForm), crud()],
// 数据字典
@@ -374,7 +380,7 @@ export default {
{ required: true, message: '请输入用户名', trigger: 'blur' },
{ min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
],
personName: [
person_name: [
{ required: true, message: '请输入用户姓名', trigger: 'blur' },
{ min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
]
@@ -389,7 +395,7 @@ export default {
dataPerm: false,
dataDialog: {},
permissions: [],
permissionId: '',
permission_id: '',
multipleSelection: [], // 选中
relevanceUser: false, // 关联用户
rowData: {}, // 当行数据
@@ -433,8 +439,8 @@ export default {
}
})
},
caseStatusColorFilter(isUsed) {
if (isUsed === true) {
caseStatusColorFilter(is_used) {
if (is_used === true) {
return '#378be2'
}
return '#F56C6C'
@@ -453,13 +459,13 @@ export default {
// 新增与编辑前做的操作
[CRUD.HOOK.afterToCU](crud, form) {
this.getRoles()
if (form.deptId == null) {
if (form.dept_id == null) {
crudDept.getDepts()
} else {
this.getSupDepts(form.deptId)
this.getSupDepts(form.dept_id)
}
// this.getRoleLevel() 暂时不用
form.isUsed = form.enabled.toString()
// form.is_used = form.enabled.toString()
},
// 新增前将多选的值设置为空
[CRUD.HOOK.beforeToAdd]() {
@@ -511,7 +517,6 @@ export default {
q = { name: node }
}
crudDept.getDeptTree(q).then(res => {
console.log('res', res)
if (resolve) {
resolve(res.content)
} else {
@@ -529,10 +534,7 @@ export default {
}, 100)
},
getDepts() {
console.log('获取部门')
crudDept.getDepts({ isUsed: true }).then(res => {
console.log('获取的部门信息', res)
crudDept.getDepts({ is_used: true }).then(res => {
this.depts = res.content.map(function(obj) {
if (obj.hasChildren) {
obj.children = null
@@ -543,7 +545,6 @@ export default {
},
getSupDepts(deptId) {
crudDept.getDeptSuperior(deptId).then(res => {
console.log('父部门', res)
const date = res.content
this.buildDepts(date)
this.depts = date
@@ -562,7 +563,7 @@ export default {
// 获取弹窗内部门数据
loadDepts({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
crudDept.getDeptvo({ isUsed: true, pid: parentNode.dept_id }).then(res => {
crudDept.getDeptvo({ is_used: true, pid: parentNode.dept_id }).then(res => {
parentNode.children = res.content.map(function(obj) {
obj.children = null
return obj
@@ -575,27 +576,27 @@ export default {
},
normalizer(node) {
return {
id: node.deptId,
id: node.dept_id,
label: node.name,
children: node.children
}
},
// 切换部门
handleNodeClick(data) {
this.query.deptId = data.deptId
this.query.dept_id = data.dept_id
this.query.needAll = true
this.crud.toQuery()
this.query.deptId = null
this.query.dept_id = null
},
// 改变状态
changeEnabled(row) {
const satus = this.enabledTypeOptions.find(item => { return item.key !== row.isUsed })
const satus = this.enabledTypeOptions.find(item => { return item.key !== row.is_used })
this.$confirm('此操作将' + satus.display_name + '账号:' + row.username + ', 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
row.isUsed = satus.key
row.is_used = satus.key
crudUser.edit(row).then(res => {
this.crud.toQuery()
this.crud.notify('账号' + row.username + '已' + satus.display_name)
@@ -638,13 +639,13 @@ export default {
crudDept.getDeptTree().then(res => {
this.deptsDatas = res.content
})
this.openDrawer()
this.openDrawer() // 打开抽屉
this.drawerTitle = '分配部门权限'
this.flag = true
// 默认选中
const deptIds = []
for (var index in row.depts) {
deptIds.push(row.depts[index].deptId)
deptIds.push(row.depts[index].dept_id)
}
this.$nextTick(() => {
this.$refs.deptUser.setCheckedKeys(deptIds)
@@ -679,23 +680,25 @@ export default {
this.multipleSelection = []
// 获取权限范围
crudDataPermission.getDataScopeType().then(res => {
console.log('权限范围', res)
this.dataDialog.dataScopeType = res
// permissions
crudDataPermission.getDataPermissionOption().then(res => {
// console.log(res)
console.log('数据权限', res)
this.permissions = res
this.dataDialog.personName = row.personName
this.dataDialog.person_name = row.person_name
this.dataDialog.username = row.username
this.dataDialog.userId = row.userId
this.dataPermissionTitle = '[' + row.personName + '] 数据权限'
this.dataDialog.user_id = row.user_id
this.dataPermissionTitle = '[' + row.person_name + '] 数据权限'
this.dataPerm = true
// 回显数据
crudDataPermission.getDataShow(row.userId).then(res => {
crudDataPermission.getDataShow(row.user_id).then(res => {
console.log('要回显的数据', res)
this.$nextTick(function() {
for (var index = 0; index < res.length; index++) {
for (var i = 0; i < this.dataDialog.dataScopeType.length; i++) {
if (this.dataDialog.dataScopeType[i].value == res[index].permissionScopeType) {
this.dataDialog.dataScopeType[i].permissionId = res[index].permissionId
this.dataDialog.dataScopeType[i].permission_id = res[index].permission_id
if (res[index].users) this.dataDialog.dataScopeType[i].users = res[index].users
if (res[index].depts) this.dataDialog.dataScopeType[i].depts = res[index].depts
// 选中
@@ -714,24 +717,23 @@ export default {
},
openRelevance(row, index) {
for (var i = 0; i < this.permissions.length; i++) {
if (this.permissions[i].permissionId != undefined && this.permissions[i].permissionId && this.permissions[i].permissionId != row.permissionId) {
this.$delete(this.dataDialog.dataScopeType[index], this.permissions[i].permissionId.toString())
if (this.permissions[i].permission_id != undefined && this.permissions[i].permission_id && this.permissions[i].permission_id != row.permission_id) {
this.$delete(this.dataDialog.dataScopeType[index], this.permissions[i].permission_id.toString())
}
}
this.$set(this.dataDialog.dataScopeType[index], this.dataDialog.dataScopeType[index].permissionId, row.permissionId)
this.$set(this.dataDialog.dataScopeType[index], this.dataDialog.dataScopeType[index].permission_id, row.permission_id)
this.rowData = {}
this.deptIds = []
this.userIds = []
console.log(row)
if (row.permissionId == '1605129738328870912') { // 选择用户
if (row.permission_id == '1605129738328870912') { // 选择用户
this.userIds = this.dataDialog.dataScopeType[index].users
this.rowData = row
this.relevanceUser = true
} else if (row.permissionId == '1605129882164137984') { // 选择部门
} else if (row.permission_id == '1605129882164137984') { // 选择部门
this.deptIds = this.dataDialog.dataScopeType[index].depts
this.rowData = row
this.relevanceDept = true
} else if (row.permissionId == '1605128919449735168') { // 自身
} else if (row.permission_id == '1605128919449735168') { // 自身
const param = {
userId: this.dataDialog.userId
}
@@ -744,7 +746,7 @@ export default {
},
selectUsers(row) { // row对话框传来的数据
for (var i = 0; i < this.dataDialog.dataScopeType.length; i++) {
if (this.dataDialog.dataScopeType[i].dictId == this.rowData.dictId) {
if (this.dataDialog.dataScopeType[i].dict_id == this.rowData.dict_id) {
if (this.dataDialog.dataScopeType[i].depts != undefined && this.dataDialog.dataScopeType[i].depts.length > 0) this.dataDialog.dataScopeType[i].depts = []
this.dataDialog.dataScopeType[i].users = row
break
@@ -754,7 +756,7 @@ export default {
},
selectDepts(row) {
for (var i = 0; i < this.dataDialog.dataScopeType.length; i++) {
if (this.dataDialog.dataScopeType[i].dictId == this.rowData.dictId) {
if (this.dataDialog.dataScopeType[i].dict_id == this.rowData.dictId) {
if (this.dataDialog.dataScopeType[i].users != undefined && this.dataDialog.dataScopeType[i].users.length > 0) this.dataDialog.dataScopeType[i].users = []
this.dataDialog.dataScopeType[i].depts = row
break
@@ -767,10 +769,9 @@ export default {
},
savePermise() {
const param = {
userId: this.dataDialog.userId,
user_id: this.dataDialog.user_id,
datas: this.multipleSelection
}
console.log('param', param)
crudDataPermission.saveDataPermission(param).then(res => {
this.dataPerm = false
this.crud.notify('添加数据权限成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
@@ -783,7 +784,7 @@ export default {
this.depChecked = []
},
giveValue(row) {
this.depCheckedId = row.userId
this.depCheckedId = row.user_id
},
clearCheck() { // 清空选中
if (this.flag) this.$refs.deptUser.setCheckedKeys([])
@@ -801,12 +802,12 @@ export default {
},
saveChecked() {
const user = {
userId: this.depCheckedId
user_id: this.depCheckedId
}
if (this.flag) {
user.deptIds = this.$refs.deptUser.getCheckedKeys()
} else {
user.rolesIds = this.crud.selections.map(item => (item.roleId))
user.rolesIds = this.crud.selections.map(item => (item.role_id))
}
crudUser.edit(user).then(res => {
this.cancelForm()
@@ -864,7 +865,6 @@ export default {
permissionScopeType: row.value
}
crudDataPermission.getDataDetail(param).then(res => {
console.log(res)
this.dataPermissions = res
})
this.showData = true