| | |
| | | <div class="system-user-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <el-input size="default" v-model.trim="userTableData.listQuery.searchParams.username" placeholder="请输入用户名" style="max-width: 180px"> </el-input> |
| | | <el-input size="default" v-model.trim="userTableData.listQuery.searchParams.realName" placeholder="请输入真实姓名" style="max-width: 180px; margin-left: 10px"> </el-input> |
| | | <el-cascader |
| | | v-model="userTableData.listQuery.searchParams.depId" |
| | | :props="props" |
| | | :options="departmentList" |
| | | :show-all-levels="false" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | size="default" |
| | | ></el-cascader> |
| | | <el-input size="default" v-model.trim="userTableData.listQuery.searchParams.username" placeholder="请输入用户名" style="max-width: 180px;margin-left: 10px;margin-right: 10px"> </el-input> |
| | | <el-input size="default" v-model.trim="userTableData.listQuery.searchParams.realName" placeholder="请输入真实姓名" style="max-width: 180px"> </el-input> |
| | | <el-button size="default" type="primary" class="ml10" @click="initUserTableData"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="username" label="用户名" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="realName" label="真实姓名" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="sex" label="性别" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="role.name" label="关联角色" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="department.name" label="部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gender" label="性别" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <el-tag type="success" v-if="scope.row.gender == 1">男</el-tag> |
| | | <el-tag type="success" v-else-if="scope.row.gender == 0">女</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="positionId" label="职务" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | {{ parseNumber(scope.row.positionId) }} |
| | | </template> |
| | | </el-table-column> |
| | | <!-- <el-table-column prop="type" label="职务" show-overflow-tooltip>--> |
| | | <!-- <template #default="scope">--> |
| | | <!-- {{ `${userTypeList.find(item => item.id === scope.row.type)?.name}` }}--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | <el-table-column prop="department.depName" label="部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="phone" label="手机号" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="email" label="邮箱" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="用户状态" show-overflow-tooltip> |
| | |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import userDialog from '/@/views/system/user/component/userDialog.vue'; |
| | | import { userApi } from '/@/api/systemManage/user'; |
| | | import { dutyApi } from '/@/api/systemManage/duty'; |
| | | import { departmentApi } from '/@/api/systemManage/department'; |
| | | import { useRoleApi } from '/@/api/systemManage/role'; |
| | | |
| | |
| | | loading: boolean; |
| | | listQuery: { |
| | | searchParams: { |
| | | depId: string | null; |
| | | username: string | null; |
| | | realName: string | null; |
| | | }; |
| | |
| | | }; |
| | | departmentList: []; |
| | | roleList: []; |
| | | dutyList: []; |
| | | userTypeList: Array<{id:number,name:string}>; |
| | | props:{} |
| | | } |
| | | |
| | | export default defineComponent({ |
| | |
| | | loading: false, |
| | | listQuery: { |
| | | searchParams: { |
| | | depId: null, |
| | | username: null, |
| | | realName: null |
| | | }, |
| | |
| | | } |
| | | }, |
| | | departmentList: [], |
| | | roleList: [] |
| | | roleList: [], |
| | | dutyList: [], |
| | | props: { |
| | | label: 'depName', |
| | | value: 'depId', |
| | | checkStrictly: true, |
| | | emitPath: false |
| | | }, |
| | | userTypeList: [ |
| | | { id: 1, name: '超级管理员' }, |
| | | { id: 2, name: '管理员' }, |
| | | { id: 3, name: '普通员工' } |
| | | ] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initUserTableData = async () => { |
| | |
| | | } |
| | | }; |
| | | |
| | | // 回显职务信息 |
| | | const parseNumber = (value: number) => { |
| | | return state.dutyList.find((i) => i.positionId === value)?.positionName; |
| | | }; |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | |
| | | } |
| | | }; |
| | | |
| | | const getDutyData = async () => { |
| | | let res = await dutyApi().getAllList({positionName: '',positionCode: ''}); |
| | | if (res.data.code === '200') { |
| | | state.dutyList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开新增修改用户弹窗 |
| | | const onOpenUserDialog = (type: string, value: any) => { |
| | | userRef.value.openDialog(type, value, state.departmentList, state.roleList); |
| | | userRef.value.openDialog(type, value, state.departmentList, state.roleList, state.dutyList); |
| | | }; |
| | | |
| | | // 删除用户 |
| | |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | let a = { name: 1, c: { name: 1 } }; |
| | | let b = Object.assign({}, a); |
| | | b.c.name = 2; |
| | | console.log(a.c.name); |
| | | initUserTableData(); |
| | | getDepartmentData(); |
| | | getRoleData(); |
| | | getDutyData() |
| | | }); |
| | | return { |
| | | userRef, |
| | | onOpenUserDialog, |
| | | onRowDel, |
| | | parseNumber, |
| | | onHandleSizeChange, |
| | | initUserTableData, |
| | | onHandleCurrentChange, |