|
@@ -21,19 +21,19 @@
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
|
|
|
- <el-form-item label="状态" prop="status">
|
|
|
+ <el-form-item label="状态" prop="state">
|
|
|
<el-select
|
|
|
- v-model="queryParams.status"
|
|
|
+ v-model="queryParams.state"
|
|
|
placeholder="全部"
|
|
|
clearable
|
|
|
class="!w-[100px]"
|
|
|
>
|
|
|
- <el-option label="启用" value="1" />
|
|
|
- <el-option label="禁用" value="0" />
|
|
|
+ <el-option label="启用" value=0 />
|
|
|
+ <el-option label="禁用" value=1 />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
|
|
|
- <el-form-item label="创建时间">
|
|
|
+<!-- <el-form-item label="创建时间">
|
|
|
<el-date-picker
|
|
|
class="!w-[240px]"
|
|
|
v-model="dateTimeRange"
|
|
@@ -43,7 +43,7 @@
|
|
|
end-placeholder="截止时间"
|
|
|
value-format="YYYY-MM-DD"
|
|
|
/>
|
|
|
- </el-form-item>
|
|
|
+ </el-form-item>-->
|
|
|
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" @click="handleQuery"
|
|
@@ -63,7 +63,7 @@
|
|
|
<div>
|
|
|
<el-button
|
|
|
v-hasPerm="['sys:user:add']"
|
|
|
- type="success"
|
|
|
+ type="primary"
|
|
|
@click="openDialog('user-form')"
|
|
|
><i-ep-plus />新增</el-button
|
|
|
>
|
|
@@ -103,56 +103,61 @@
|
|
|
>
|
|
|
<el-table-column type="selection" width="50" align="center" />
|
|
|
<el-table-column
|
|
|
- key="id"
|
|
|
- label="编号"
|
|
|
+ label="用户名"
|
|
|
+ width="120"
|
|
|
align="center"
|
|
|
- prop="id"
|
|
|
- width="100"
|
|
|
+ prop="userName"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- key="username"
|
|
|
- label="用户名"
|
|
|
- align="center"
|
|
|
- prop="username"
|
|
|
+ label="姓名"
|
|
|
+ width="120"
|
|
|
+ align="center"
|
|
|
+ prop="nickName"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="用户昵称"
|
|
|
- width="120"
|
|
|
- align="center"
|
|
|
- prop="nickname"
|
|
|
+ key="employeeCode"
|
|
|
+ label="员工编号"
|
|
|
+ align="center"
|
|
|
+ prop="employeeCode"
|
|
|
/>
|
|
|
-
|
|
|
<el-table-column
|
|
|
label="性别"
|
|
|
width="100"
|
|
|
align="center"
|
|
|
- prop="genderLabel"
|
|
|
- />
|
|
|
+ prop="sex"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag :type="scope.row.sex == 0 ? 'info' : 'success'">{{
|
|
|
+ scope.row.sex == 0 ? "未知" : scope.row.sex == 1 ? "男" : "女"
|
|
|
+ }}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
|
label="部门"
|
|
|
width="120"
|
|
|
align="center"
|
|
|
- prop="deptName"
|
|
|
+ overHidden="true"
|
|
|
+ prop="deptNames"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
label="手机号码"
|
|
|
align="center"
|
|
|
- prop="mobile"
|
|
|
+ prop="phone"
|
|
|
width="120"
|
|
|
/>
|
|
|
|
|
|
- <el-table-column label="状态" align="center" prop="status">
|
|
|
+ <el-table-column label="状态" align="center" prop="state">
|
|
|
<template #default="scope">
|
|
|
- <el-tag :type="scope.row.status == 1 ? 'success' : 'info'">{{
|
|
|
- scope.row.status == 1 ? "启用" : "禁用"
|
|
|
+ <el-tag :type="scope.row.state == 0 ? 'success' : 'info'">{{
|
|
|
+ scope.row.state == 0 ? "启用" : "禁用"
|
|
|
}}</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="创建时间"
|
|
|
align="center"
|
|
|
- prop="createTime"
|
|
|
+ prop="created"
|
|
|
width="180"
|
|
|
/>
|
|
|
<el-table-column label="操作" fixed="right" width="220">
|
|
@@ -162,6 +167,7 @@
|
|
|
type="primary"
|
|
|
size="small"
|
|
|
link
|
|
|
+ v-if="scope.row.id !== '1'"
|
|
|
@click="resetPassword(scope.row)"
|
|
|
><i-ep-refresh-left />重置密码</el-button
|
|
|
>
|
|
@@ -170,14 +176,16 @@
|
|
|
type="primary"
|
|
|
link
|
|
|
size="small"
|
|
|
- @click="openDialog('user-form', scope.row.id)"
|
|
|
+ v-if="scope.row.id !== '1'"
|
|
|
+ @click="openDialog('user-form', scope.row)"
|
|
|
><i-ep-edit />编辑</el-button
|
|
|
>
|
|
|
<el-button
|
|
|
- v-hasPerm="['sys:user:delete']"
|
|
|
+ v-hasPerm="['sys:user:del']"
|
|
|
type="primary"
|
|
|
link
|
|
|
size="small"
|
|
|
+ v-if="scope.row.id !== '1'"
|
|
|
@click="handleDelete(scope.row.id)"
|
|
|
><i-ep-delete />删除</el-button
|
|
|
>
|
|
@@ -210,66 +218,118 @@
|
|
|
ref="userFormRef"
|
|
|
:model="formData"
|
|
|
:rules="rules"
|
|
|
- label-width="80px"
|
|
|
+ label-width="90px"
|
|
|
>
|
|
|
- <el-form-item label="用户名" prop="username">
|
|
|
- <el-input
|
|
|
- v-model="formData.username"
|
|
|
- :readonly="!!formData.id"
|
|
|
- placeholder="请输入用户名"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="用户昵称" prop="nickname">
|
|
|
- <el-input v-model="formData.nickname" placeholder="请输入用户昵称" />
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="所属部门" prop="deptId">
|
|
|
- <el-tree-select
|
|
|
- v-model="formData.deptId"
|
|
|
- placeholder="请选择所属部门"
|
|
|
- :data="deptList"
|
|
|
- filterable
|
|
|
- check-strictly
|
|
|
- :render-after-expand="false"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="性别" prop="gender">
|
|
|
- <dictionary v-model="formData.gender" type-code="gender" />
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="角色" prop="roleIds">
|
|
|
- <el-select v-model="formData.roleIds" multiple placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in roleList"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="手机号码" prop="mobile">
|
|
|
- <el-input
|
|
|
- v-model="formData.mobile"
|
|
|
- placeholder="请输入手机号码"
|
|
|
- maxlength="11"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
+ <el-row :gutter="22">
|
|
|
+ <el-col :span="11">
|
|
|
+ <el-form-item label="用户名" prop="userName">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.userName"
|
|
|
+ :disabled="!!formData.id"
|
|
|
+ placeholder="请输入用户名"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="11">
|
|
|
+ <el-form-item label="用户昵称" prop="nickName">
|
|
|
+ <el-input v-model="formData.nickName" placeholder="请输入用户昵称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
|
|
|
- <el-form-item label="邮箱" prop="email">
|
|
|
- <el-input
|
|
|
- v-model="formData.email"
|
|
|
- placeholder="请输入邮箱"
|
|
|
- maxlength="50"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
+ <el-row :gutter="22">
|
|
|
+ <el-col :span="11">
|
|
|
+ <el-form-item label="员工编号" prop="employeeCode">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.employeeCode"
|
|
|
+ placeholder="请输入员工编号"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="11">
|
|
|
+ <el-form-item label="性别" prop="sex">
|
|
|
+ <el-radio-group v-model="formData.sex">
|
|
|
+ <el-radio :value=0>未知</el-radio>
|
|
|
+ <el-radio :value=1>男</el-radio>
|
|
|
+ <el-radio :value=2>女</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="22">
|
|
|
+ <el-col :span="22">
|
|
|
+ <el-form-item label="所属部门" prop="deptIds">
|
|
|
+ <el-tree-select
|
|
|
+ v-model="formData.deptIds"
|
|
|
+ placeholder="请选择所属部门"
|
|
|
+ :data="deptList"
|
|
|
+ :multiple="true"
|
|
|
+ filterable
|
|
|
+ show-checkbox
|
|
|
+ load-key="deptName"
|
|
|
+ value-key="id"
|
|
|
+ :props="{ children: 'children', label: 'deptName',value: 'id', disabled: '' }"
|
|
|
+ check-strictly
|
|
|
+ :render-after-expand="false"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="22">
|
|
|
+ <el-col :span="22">
|
|
|
+ <el-form-item label="角色" prop="roleIds">
|
|
|
+ <el-select v-model="formData.roleIds" multiple placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in roleList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.roleName"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="22">
|
|
|
+ <el-col :span="22">
|
|
|
+ <el-form-item label="岗位" prop="postIds">
|
|
|
+ <el-select v-model="formData.postIds" multiple placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in postList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.postName"
|
|
|
+ :value="item.id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="22">
|
|
|
+ <el-col :span="11">
|
|
|
+ <el-form-item label="手机号码" prop="phone">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.phone"
|
|
|
+ placeholder="请输入手机号码"
|
|
|
+ maxlength="11"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="11">
|
|
|
+ <el-form-item label="邮箱" prop="email">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.email"
|
|
|
+ placeholder="请输入邮箱"
|
|
|
+ maxlength="50"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
|
|
|
- <el-form-item label="状态" prop="status">
|
|
|
- <el-radio-group v-model="formData.status">
|
|
|
- <el-radio :value="1">正常</el-radio>
|
|
|
- <el-radio :value="0">禁用</el-radio>
|
|
|
+ <el-form-item label="状态" prop="state">
|
|
|
+ <el-radio-group v-model="formData.state">
|
|
|
+ <el-radio :value=0>正常</el-radio>
|
|
|
+ <el-radio :value=1>禁用</el-radio>
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
@@ -285,6 +345,9 @@
|
|
|
v-model="importData.deptId"
|
|
|
placeholder="请选择部门"
|
|
|
:data="deptList"
|
|
|
+ load-key="deptName"
|
|
|
+ value-key="id"
|
|
|
+ :props="{ children: 'children', label: 'deptName',value: 'id', disabled: '' }"
|
|
|
filterable
|
|
|
check-strictly
|
|
|
/>
|
|
@@ -334,19 +397,19 @@ defineOptions({
|
|
|
|
|
|
import {
|
|
|
getUserPage,
|
|
|
- getUserForm,
|
|
|
deleteUsers,
|
|
|
addUser,
|
|
|
updateUser,
|
|
|
updateUserPassword,
|
|
|
downloadTemplateApi,
|
|
|
exportUser,
|
|
|
+ getPostOptions,
|
|
|
importUser,
|
|
|
} from "@/api/system/user";
|
|
|
import { treeList } from "@/api/system/dept";
|
|
|
import { getRoleOptions } from "@/api/system/role";
|
|
|
|
|
|
-import { UserForm, UserQuery, UserPageVO } from "@/api/system/user/types";
|
|
|
+import {UserQuery, UserPageVO } from "@/api/system/user/types";
|
|
|
import type { UploadInstance } from "element-plus";
|
|
|
import { genFileId } from "element-plus";
|
|
|
|
|
@@ -365,13 +428,8 @@ const total = ref(0); // 数据总数
|
|
|
const pageData = ref<UserPageVO[]>(); // 用户分页数据
|
|
|
const deptList = ref<OptionType[]>(); // 部门下拉数据源
|
|
|
const roleList = ref<OptionType[]>(); // 角色下拉数据源
|
|
|
+const postList = ref<OptionType[]>(); // 岗位下拉数据源
|
|
|
|
|
|
-watch?.(dateTimeRange, (newVal) => {
|
|
|
- if (newVal) {
|
|
|
- queryParams.startTime = newVal[0];
|
|
|
- queryParams.endTime = newVal[1];
|
|
|
- }
|
|
|
-});
|
|
|
|
|
|
// 弹窗对象
|
|
|
const dialog = reactive({
|
|
@@ -382,8 +440,9 @@ const dialog = reactive({
|
|
|
});
|
|
|
|
|
|
// 用户表单数据
|
|
|
-const formData = reactive<UserForm>({
|
|
|
- status: 1,
|
|
|
+const formData = reactive({
|
|
|
+ state: 0,
|
|
|
+ sex: 0
|
|
|
});
|
|
|
|
|
|
// 用户导入数据
|
|
@@ -395,10 +454,11 @@ const importData = reactive({
|
|
|
|
|
|
// 校验规则
|
|
|
const rules = reactive({
|
|
|
- username: [{ required: true, message: "用户名不能为空", trigger: "blur" }],
|
|
|
- nickname: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
|
|
|
- deptId: [{ required: true, message: "所属部门不能为空", trigger: "blur" }],
|
|
|
+ userName: [{ required: true, message: "用户名不能为空", trigger: "blur" }],
|
|
|
+ nickName: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
|
|
|
+ deptIds: [{ required: true, message: "所属部门不能为空", trigger: "blur" }],
|
|
|
roleIds: [{ required: true, message: "用户角色不能为空", trigger: "blur" }],
|
|
|
+ postIds: [{ required: true, message: "用户岗位不能为空", trigger: "blur" }],
|
|
|
email: [
|
|
|
{
|
|
|
pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
|
|
@@ -406,7 +466,7 @@ const rules = reactive({
|
|
|
trigger: "blur",
|
|
|
},
|
|
|
],
|
|
|
- mobile: [
|
|
|
+ phone: [
|
|
|
{
|
|
|
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
|
|
message: "请输入正确的手机号码",
|
|
@@ -420,8 +480,8 @@ function handleQuery() {
|
|
|
loading.value = true;
|
|
|
getUserPage(queryParams)
|
|
|
.then(({ data }) => {
|
|
|
- pageData.value = data.list;
|
|
|
- total.value = data.total;
|
|
|
+ pageData.value = data.records;
|
|
|
+ total.value = data.totalCount;
|
|
|
})
|
|
|
.finally(() => {
|
|
|
loading.value = false;
|
|
@@ -446,31 +506,29 @@ function handleSelectionChange(selection: any) {
|
|
|
|
|
|
/** 重置密码 */
|
|
|
function resetPassword(row: { [key: string]: any }) {
|
|
|
- ElMessageBox.prompt(
|
|
|
- "请输入用户「" + row.username + "」的新密码",
|
|
|
- "重置密码",
|
|
|
- {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- }
|
|
|
- ).then(({ value }) => {
|
|
|
- if (!value) {
|
|
|
- ElMessage.warning("请输入新密码");
|
|
|
- return false;
|
|
|
- }
|
|
|
- updateUserPassword(row.id, value).then(() => {
|
|
|
- ElMessage.success("密码重置成功,新密码是:" + value);
|
|
|
+ ElMessageBox.confirm("确认重置用户密码吗?", "警告", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ }).then(function () {
|
|
|
+ updateUserPassword(row).then(() => {
|
|
|
+ ElMessage.success("密码重置成功,新密码为系统初始密码");
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
|
|
|
/** 加载角色下拉数据源 */
|
|
|
async function loadRoleOptions() {
|
|
|
- getRoleOptions().then((response) => {
|
|
|
+ getRoleOptions({}).then((response) => {
|
|
|
roleList.value = response.data;
|
|
|
});
|
|
|
}
|
|
|
-
|
|
|
+/** 加载岗位下拉数据源 */
|
|
|
+async function loadPostOptions() {
|
|
|
+ getPostOptions({}).then((response) => {
|
|
|
+ postList.value = response.data;
|
|
|
+ });
|
|
|
+}
|
|
|
/** 加载部门下拉数据源 */
|
|
|
async function loadDeptOptions() {
|
|
|
treeList().then((response) => {
|
|
@@ -484,19 +542,18 @@ async function loadDeptOptions() {
|
|
|
* @param type 弹窗类型 用户表单:user-form | 用户导入:user-import
|
|
|
* @param id 用户ID
|
|
|
*/
|
|
|
-async function openDialog(type: string, id?: number) {
|
|
|
+async function openDialog(type: string, row?: number) {
|
|
|
dialog.visible = true;
|
|
|
dialog.type = type;
|
|
|
|
|
|
if (dialog.type === "user-form") {
|
|
|
// 用户表单弹窗
|
|
|
await loadDeptOptions();
|
|
|
+ await loadPostOptions();
|
|
|
await loadRoleOptions();
|
|
|
- if (id) {
|
|
|
+ if (row) {
|
|
|
dialog.title = "修改用户";
|
|
|
- getUserForm(id).then(({ data }) => {
|
|
|
- Object.assign(formData, { ...data });
|
|
|
- });
|
|
|
+ Object.assign(formData, row);
|
|
|
} else {
|
|
|
dialog.title = "新增用户";
|
|
|
}
|
|
@@ -572,18 +629,13 @@ const handleSubmit = useThrottleFn(() => {
|
|
|
|
|
|
/** 删除用户 */
|
|
|
function handleDelete(id?: number) {
|
|
|
- const userIds = [id || removeIds.value].join(",");
|
|
|
- if (!userIds) {
|
|
|
- ElMessage.warning("请勾选删除项");
|
|
|
- return;
|
|
|
- }
|
|
|
|
|
|
ElMessageBox.confirm("确认删除用户?", "警告", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
|
type: "warning",
|
|
|
}).then(function () {
|
|
|
- deleteUsers(userIds).then(() => {
|
|
|
+ deleteUsers(id).then(() => {
|
|
|
ElMessage.success("删除成功");
|
|
|
resetQuery();
|
|
|
});
|