Skip to content

W
wangxiaolu-sfa-ui
提交 b84b6c4b authored 作者: lidongxu's avatar lidongxu
浏览文件
操作

feat(role): 用户管理_新增编辑用户设置多个角色

同上
上级 c796cd2d
隐藏空白字符变更
内嵌 并排
正在显示 包含 169 行增加 和 135 行删除
src/views/system/role/selectUser.vue
浏览文件 @ b84b6c4b
<template> <template>
<!-- 授权用户 --> <!-- 授权用户 -->
<el-dialog title="选择用户" v-model="visible" top="5vh" append-to-body> <el-dialog title="选择用户"
<el-form :model="queryParams" ref="queryRef" :inline="true"> v-model="visible"
<el-form-item label="用户名称" prop="userName"> top="5vh"
<el-input append-to-body>
v-model="queryParams.userName" <el-form :model="queryParams"
placeholder="请输入用户名称" ref="queryRef"
clearable :inline="true">
style="width: 180px" <el-form-item label="用户名称"
@input="handleQuery" prop="userName">
/> <el-input v-model="queryParams.userName"
</el-form-item> placeholder="请输入用户名称"
<el-form-item label="手机号码" prop="phonenumber"> clearable
<el-input style="width: 180px"
v-model="queryParams.phonenumber" @input="handleQuery" />
placeholder="请输入手机号码" </el-form-item>
clearable <el-form-item label="手机号码"
style="width: 180px" prop="phonenumber">
@input="handleQuery" <el-input v-model="queryParams.phonenumber"
/> placeholder="请输入手机号码"
</el-form-item> clearable
<el-form-item> style="width: 180px"
<el-button icon="Refresh" @click="resetQuery">重置</el-button> @input="handleQuery" />
</el-form-item> </el-form-item>
</el-form> <el-form-item>
<el-row> <el-button icon="Refresh"
<el-table @row-click="clickRow" ref="refTable" :data="userList" @selection-change="handleSelectionChange" height="260px"> @click="resetQuery">重置</el-button>
<el-table-column type="selection" width="55"></el-table-column> </el-form-item>
<el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" /> </el-form>
<el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" /> <el-row>
<el-table-column label="邮箱" prop="email" :show-overflow-tooltip="true" /> <el-table @row-click="clickRow"
<el-table-column label="手机" prop="phonenumber" :show-overflow-tooltip="true" /> ref="refTable"
<el-table-column label="状态" align="center" prop="status"> :data="userList"
<template #default="scope"> @selection-change="handleSelectionChange">
<dict-tag :options="sys_normal_disable" :value="scope.row.status" /> <el-table-column type="selection"
</template> width="55"></el-table-column>
</el-table-column> <el-table-column label="用户名称"
<el-table-column label="创建时间" align="center" prop="createTime" width="180"> prop="userName"
<template #default="scope"> :show-overflow-tooltip="true" />
<span>{{ parseTime(scope.row.createTime) }}</span> <el-table-column label="用户昵称"
</template> prop="nickName"
</el-table-column> :show-overflow-tooltip="true" />
</el-table> <el-table-column label="邮箱"
<pagination prop="email"
v-show="total > 0" :show-overflow-tooltip="true" />
:total="total" <el-table-column label="手机"
v-model:page="queryParams.pageNum" prop="phonenumber"
v-model:limit="queryParams.pageSize" :show-overflow-tooltip="true" />
@pagination="getList" <el-table-column label="状态"
/> align="center"
</el-row> prop="status">
<template #footer> <template #default="scope">
<div class="dialog-footer"> <dict-tag :options="sys_normal_disable"
<el-button type="primary" @click="handleSelectUser">确 定</el-button> :value="scope.row.status" />
<el-button @click="visible = false">取 消</el-button> </template>
</div> </el-table-column>
</template> <el-table-column label="创建时间"
</el-dialog> align="center"
prop="createTime"
width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
</el-table>
<div class="pagination-wrap">
<pagination v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList" />
</div>
</el-row>
<template #footer>
<div class="dialog-footer">
<el-button type="primary"
@click="handleSelectUser">确 定</el-button>
<el-button @click="visible = false">取 消</el-button>
</div>
</template>
</el-dialog>
</template> </template>
<script setup name="SelectUser"> <script setup
import { authUserSelectAll, unallocatedUserList } from "@/api"; name="SelectUser">
import { authUserSelectAll, unallocatedUserList } from "@/api";
const props = defineProps({ const props = defineProps({
roleId: { roleId: {
type: [Number, String] type: [Number, String]
} }
}); });
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const { sys_normal_disable } = proxy.useDict("sys_normal_disable"); const { sys_normal_disable } = proxy.useDict("sys_normal_disable");
const userList = ref([]); const userList = ref([]);
const visible = ref(false); const visible = ref(false);
const total = ref(0); const total = ref(0);
const userIds = ref([]); const userIds = ref([]);
const queryParams = reactive({ const queryParams = reactive({
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
roleId: undefined, roleId: undefined,
userName: undefined, userName: undefined,
phonenumber: undefined phonenumber: undefined
}); });
// 显示弹框 // 显示弹框
function show() { function show() {
queryParams.roleId = props.roleId; queryParams.roleId = props.roleId;
getList(); getList();
visible.value = true; visible.value = true;
} }
/**选择行 */ /**选择行 */
function clickRow(row) { function clickRow(row) {
proxy.$refs["refTable"].toggleRowSelection(row); proxy.$refs["refTable"].toggleRowSelection(row);
} }
// 多选框选中数据 // 多选框选中数据
function handleSelectionChange(selection) { function handleSelectionChange(selection) {
userIds.value = selection.map(item => item.userId); userIds.value = selection.map(item => item.userId);
} }
// 查询表数据 // 查询表数据
function getList() { function getList() {
unallocatedUserList(queryParams).then(res => { unallocatedUserList(queryParams).then(res => {
userList.value = res.data.rows; userList.value = res.data.rows;
total.value = res.data.total; total.value = res.data.total;
}); });
} }
/** 搜索按钮操作 */ /** 搜索按钮操作 */
function handleQuery() { function handleQuery() {
queryParams.pageNum = 1; queryParams.pageNum = 1;
getList(); getList();
} }
/** 重置按钮操作 */ /** 重置按钮操作 */
function resetQuery() { function resetQuery() {
proxy.resetForm("queryRef"); proxy.resetForm("queryRef");
handleQuery(); handleQuery();
} }
const emit = defineEmits(["ok"]); const emit = defineEmits(["ok"]);
/** 选择授权用户操作 */ /** 选择授权用户操作 */
function handleSelectUser() { function handleSelectUser() {
const roleId = queryParams.roleId; const roleId = queryParams.roleId;
const uIds = userIds.value.join(","); const uIds = userIds.value.join(",");
if (uIds == "") { if (uIds == "") {
proxy.$modal.msgError("请选择要分配的用户"); proxy.$modal.msgError("请选择要分配的用户");
return; return;
}
authUserSelectAll({ roleId: roleId, userIds: uIds }).then(res => {
proxy.$modal.msgSuccess(res.msg);
visible.value = false;
emit("ok");
});
} }
authUserSelectAll({ roleId: roleId, userIds: uIds }).then(res => {
proxy.$modal.msgSuccess(res.msg);
visible.value = false;
emit("ok");
});
}
defineExpose({ defineExpose({
show, show,
}); });
</script> </script>
<style scoped
style="scss">
.pagination-wrap {
width: 100%;
display: flex;
justify-content: flex-end;
}
</style>
\ No newline at end of file
src/views/system/user/index.vue
浏览文件 @ b84b6c4b
...@@ -309,13 +309,13 @@ ...@@ -309,13 +309,13 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="角色" <el-form-item label="角色"
prop="roleId"> prop="roleIds">
<!-- multiple <el-select v-model="form.roleIds"
placeholder="请选择"
multiple
clearable clearable
collapse-tags collapse-tags
collapse-tags-tooltip --> collapse-tags-tooltip>
<el-select v-model="form.roleId"
placeholder="请选择">
<el-option v-for="item in roleOptions" <el-option v-for="item in roleOptions"
:key="item.roleId" :key="item.roleId"
:label="item.roleName" :label="item.roleName"
...@@ -500,7 +500,7 @@ ...@@ -500,7 +500,7 @@
email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }], email: [{ type: "email", message: "请输入正确的邮箱地址", trigger: ["blur", "change"] }],
phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }], phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" }],
postId: [{ required: true, message: "请选择岗位", trigger: "change" }], postId: [{ required: true, message: "请选择岗位", trigger: "change" }],
roleId: [{ required: true, message: "请选择角色", trigger: "change" }], roleIds: [{ required: true, message: "请选择角色", trigger: "change" }],
privilegeId: [{ required: true, message: "请选择促销角色", trigger: "change" }] privilegeId: [{ required: true, message: "请选择促销角色", trigger: "change" }]
} }
}); });
...@@ -693,7 +693,7 @@ ...@@ -693,7 +693,7 @@
status: "0", status: "0",
remark: undefined, remark: undefined,
postId: null, postId: null,
roleId: [], roleIds: [],
proStatus: false, // 促销权限 proStatus: false, // 促销权限
privilegeId: undefined, privilegeId: undefined,
workCityList: [] // 工作城市 workCityList: [] // 工作城市
...@@ -741,7 +741,7 @@ ...@@ -741,7 +741,7 @@
// 促销权限 0 开 1 关 // 促销权限 0 开 1 关
response.data.proStatus = response.data.proStatus == 1 || response.data.proStatus == undefined ? false : true; response.data.proStatus = response.data.proStatus == 1 || response.data.proStatus == undefined ? false : true;
// 后台空角色不知道为啥返回 0 不是 null // 后台空角色不知道为啥返回 0 不是 null
response.data.roleId = response.data.roleId == 0 ? [] : response.data.roleId; // response.data.roleIds = response.data.roleId == 0 ? [] : response.data.roleId;
form.value = response.data; form.value = response.data;
postOptions.value = response.posts; postOptions.value = response.posts;
roleOptions.value = response.roles; roleOptions.value = response.roles;
...@@ -773,7 +773,7 @@ ...@@ -773,7 +773,7 @@
privilegeId: form.value.privilegeId, privilegeId: form.value.privilegeId,
status: form.value.proStatus status: form.value.proStatus
}) })
reset() reset()
} }
}); });
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论