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

@@ -20,22 +20,15 @@
</div>
<ul class="user-info">
<li><div style="height: 100%"><svg-icon icon-class="login" /> 登录账号<div class="user-right">{{ user.username }}</div></div></li>
<li><svg-icon icon-class="user1" /> 用户姓名 <div class="user-right">{{ user.personName }}</div></li>
<li><svg-icon icon-class="dept" /> 所属部门
<el-tooltip effect="dark" placement="top">
<div slot="content">
<span v-for="item in depts">{{ item.name }} </span>
</div>
<span class="user-right" v-for="item in depts">{{ item.name }}<span v-if="depts.length>1">...</span></span>
</el-tooltip>
</li>
<li><svg-icon icon-class="user1" /> 用户姓名 <div class="user-right">{{ user.person_name }}</div></li>
<!-- <li><svg-icon icon-class="dept" /> 所属部门 <div class="user-right"> {{ user.dept.name }}</div></li>-->
<li><svg-icon icon-class="phone" /> 手机号码 <div class="user-right">{{ user.phone }}</div></li>
<li><svg-icon icon-class="email" /> 用户邮箱 <div class="user-right">{{ user.email }}</div></li>
<li>
<svg-icon icon-class="anq" /> 安全设置
<div class="user-right">
<a @click="$refs.pass.dialog = true">修改密码</a>
<a @click="$refs.email.dialog = true">修改邮箱</a>
<!-- <a @click="$refs.email.dialog = true">修改邮箱</a>-->
</div>
</li>
</ul>
@@ -48,8 +41,8 @@
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="用户资料" name="first">
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 10px;" size="mini" label-width="65px">
<el-form-item label="姓名" prop="personName">
<el-input v-model="form.personName" style="width: 35%" />
<el-form-item label="姓名" prop="person_name">
<el-input v-model="form.person_name" style="width: 35%" />
<span style="color: #C0C0C0;margin-left: 10px;">用户姓名不作为登录使用</span>
</el-form-item>
<el-form-item label="手机号" prop="phone">
@@ -71,7 +64,7 @@
<el-tab-pane label="操作日志" name="second">
<el-table v-loading="loading" :data="data" style="width: 100%;">
<el-table-column prop="description" label="行为" min-width="130" show-overflow-tooltip />
<el-table-column prop="requestIp" label="IP" />
<el-table-column prop="request_ip" label="IP" />
<el-table-column show-overflow-tooltip prop="address" label="IP来源" />
<el-table-column prop="browser" label="浏览器" min-width="120" show-overflow-tooltip />
<el-table-column prop="time" label="请求耗时" align="center">
@@ -90,7 +83,7 @@
<div style="display:inline-block;float: right;cursor: pointer" @click="init">创建日期<i class="el-icon-refresh" style="margin-left: 40px" /></div>
</template>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
<span>{{ parseTime(scope.row.create_time) }}</span>
</template>
</el-table-column>
</el-table>
@@ -123,7 +116,7 @@ import store from '@/store'
import { isvalidPhone } from '@/utils/validate'
import { parseTime } from '@/utils/index'
import crud from '@/mixins/crud'
import { editUser } from '@/views/system/user'
import { editUser } from '@/views/system/user/user'
import Avatar from '@/assets/images/avatar.png'
export default {
name: 'Center',
@@ -149,9 +142,8 @@ export default {
'Authorization': getToken()
},
form: {},
deptsName: '',
rules: {
personName: [
person_name: [
{ required: true, message: '请输入用户姓名', trigger: 'blur' },
{ min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
],
@@ -164,13 +156,12 @@ export default {
computed: {
...mapGetters([
'user',
'depts',
'updateAvatarApi',
'baseApi'
])
},
created() {
this.form = { id: this.user.id, personName: this.user.personName, gender: this.user.gender, phone: this.user.phone }
this.form = { id: this.user.id, person_name: this.user.person_name, gender: this.user.gender, phone: this.user.phone }
store.dispatch('GetInfo').then(() => {})
},
methods: {
@@ -211,24 +202,24 @@ export default {
</script>
<style rel="stylesheet/scss" lang="scss">
.avatar {
width: 120px;
height: 120px;
border-radius: 50%;
.avatar {
width: 120px;
height: 120px;
border-radius: 50%;
}
.user-info {
padding-left: 0;
list-style: none;
li{
border-bottom: 1px solid #F0F3F4;
padding: 11px 0;
font-size: 13px;
}
.user-info {
padding-left: 0;
list-style: none;
li{
border-bottom: 1px solid #F0F3F4;
padding: 11px 0;
font-size: 13px;
}
.user-right {
float: right;
a{
color: #317EF3;
}
.user-right {
float: right;
a{
color: #317EF3;
}
}
}
</style>

View File

@@ -67,7 +67,7 @@
<script>
import crudDept from '@/views/system/dept/dept'
import crudDept from '../../dept/dept'
import CRUD, { header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import pagination from '@crud/Pagination'

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