|
|
|
@@ -1,5 +1,5 @@ |
|
|
|
<template> |
|
|
|
<div class="app-container"> |
|
|
|
<div class="user-container"> |
|
|
|
<!-- <doc-alert title="用户体系" url="https://doc.iocoder.cn/user-center/" /> |
|
|
|
<doc-alert title="三方登陆" url="https://doc.iocoder.cn/social-user/" /> |
|
|
|
<doc-alert |
|
|
|
@@ -8,40 +8,43 @@ |
|
|
|
/> --> |
|
|
|
<!-- 搜索工作栏 --> |
|
|
|
|
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-row :gutter="8" class="user-box"> |
|
|
|
<!--部门数据--> |
|
|
|
<el-col :span="4" :xs="24"> |
|
|
|
<div class="head-container"> |
|
|
|
<el-input |
|
|
|
v-model="deptName" |
|
|
|
placeholder="请输入部门名称" |
|
|
|
clearable |
|
|
|
size="small" |
|
|
|
prefix-icon="el-icon-search" |
|
|
|
style="margin-bottom: 20px" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="head-container"> |
|
|
|
<el-tree |
|
|
|
:data="deptOptions" |
|
|
|
:props="defaultProps" |
|
|
|
:expand-on-click-node="false" |
|
|
|
:filter-node-method="filterNode" |
|
|
|
ref="tree" |
|
|
|
default-expand-all |
|
|
|
highlight-current |
|
|
|
@node-click="handleNodeClick" |
|
|
|
/> |
|
|
|
<div class="user-box-left"> |
|
|
|
<div class="head-container"> |
|
|
|
<el-input |
|
|
|
v-model="deptName" |
|
|
|
placeholder="请输入部门名称" |
|
|
|
clearable |
|
|
|
size="small" |
|
|
|
prefix-icon="el-icon-search" |
|
|
|
style="margin-bottom: 20px" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
<div class="head-container"> |
|
|
|
<el-tree |
|
|
|
:data="deptOptions" |
|
|
|
:props="defaultProps" |
|
|
|
:expand-on-click-node="false" |
|
|
|
:filter-node-method="filterNode" |
|
|
|
ref="tree" |
|
|
|
default-expand-all |
|
|
|
highlight-current |
|
|
|
@node-click="handleNodeClick" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
<!--用户数据--> |
|
|
|
<el-col :span="20" :xs="24"> |
|
|
|
<search-bar |
|
|
|
:formConfigs="formConfig" |
|
|
|
ref="searchBarForm" |
|
|
|
@headBtnClick="buttonClick" |
|
|
|
/> |
|
|
|
<!-- <el-form |
|
|
|
<div class="user-box-right"> |
|
|
|
<search-bar |
|
|
|
:formConfigs="formConfig" |
|
|
|
ref="userSearchBarForm" |
|
|
|
@headBtnClick="buttonClick" |
|
|
|
/> |
|
|
|
<!-- <el-form |
|
|
|
:model="queryParams" |
|
|
|
ref="queryForm" |
|
|
|
size="small" |
|
|
|
@@ -104,7 +107,7 @@ |
|
|
|
</el-form-item> |
|
|
|
</el-form> --> |
|
|
|
|
|
|
|
<!-- <el-row :gutter="10" class="mb8"> |
|
|
|
<!-- <el-row :gutter="10" class="mb8"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
@@ -144,25 +147,25 @@ |
|
|
|
></right-toolbar> |
|
|
|
</el-row> --> |
|
|
|
|
|
|
|
<!-- 列表 --> |
|
|
|
<base-table |
|
|
|
:page="queryParams.pageNo" |
|
|
|
:limit="queryParams.pageSize" |
|
|
|
:table-props="tableProps" |
|
|
|
:table-data="userList" |
|
|
|
:max-height="tableH" |
|
|
|
@emitFun="handleStatusChange" |
|
|
|
> |
|
|
|
<method-btn |
|
|
|
v-if="tableBtn.length" |
|
|
|
slot="handleBtn" |
|
|
|
:width="220" |
|
|
|
label="操作" |
|
|
|
:method-list="tableBtn" |
|
|
|
@clickBtn="handleClick" |
|
|
|
/> |
|
|
|
</base-table> |
|
|
|
<!-- <el-table v-loading="loading" :data="userList"> |
|
|
|
<!-- 列表 --> |
|
|
|
<base-table |
|
|
|
:page="queryParams.pageNo" |
|
|
|
:limit="queryParams.pageSize" |
|
|
|
:table-props="tableProps" |
|
|
|
:table-data="userList" |
|
|
|
:max-height="tableH" |
|
|
|
@emitFun="handleStatusChange" |
|
|
|
> |
|
|
|
<method-btn |
|
|
|
v-if="tableBtn.length" |
|
|
|
slot="handleBtn" |
|
|
|
:width="220" |
|
|
|
label="操作" |
|
|
|
:method-list="tableBtn" |
|
|
|
@clickBtn="handleClick" |
|
|
|
/> |
|
|
|
</base-table> |
|
|
|
<!-- <el-table v-loading="loading" :data="userList"> |
|
|
|
<el-table-column |
|
|
|
label="用户编号" |
|
|
|
align="center" |
|
|
|
@@ -288,18 +291,19 @@ |
|
|
|
</el-table-column> |
|
|
|
</el-table> --> |
|
|
|
|
|
|
|
<pagination |
|
|
|
:page.sync="queryParams.pageNo" |
|
|
|
:limit.sync="queryParams.pageSize" |
|
|
|
:total="total" |
|
|
|
@pagination="getList" |
|
|
|
/> |
|
|
|
<pagination |
|
|
|
:page.sync="queryParams.pageNo" |
|
|
|
:limit.sync="queryParams.pageSize" |
|
|
|
:total="total" |
|
|
|
@pagination="getList" |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<!-- 添加或修改参数配置对话框 --> |
|
|
|
<base-dialog :dialogTitle="title" :dialogVisible="open" width="50%"> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="12"> |
|
|
|
<el-form-item label="用户昵称" prop="nickname"> |
|
|
|
@@ -412,8 +416,8 @@ |
|
|
|
</el-row> |
|
|
|
</el-form> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
|
|
|
<el-button @click="cancel">取 消</el-button> |
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
|
|
|
</div> |
|
|
|
</base-dialog> |
|
|
|
|
|
|
|
@@ -448,7 +452,7 @@ |
|
|
|
:underline="false" |
|
|
|
style="font-size: 12px; vertical-align: baseline" |
|
|
|
@click="importTemplate" |
|
|
|
>下载模板</el-link |
|
|
|
>导出模板</el-link |
|
|
|
> |
|
|
|
</div> |
|
|
|
</el-upload> |
|
|
|
@@ -606,6 +610,11 @@ export default { |
|
|
|
name: "search", |
|
|
|
color: "primary", |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: "button", |
|
|
|
btnName: "重置", |
|
|
|
name: "cancel", |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: this.$auth.hasPermiOr([ |
|
|
|
"system:user:create", |
|
|
|
@@ -615,18 +624,11 @@ export default { |
|
|
|
? "separate" |
|
|
|
: "", |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: this.$auth.hasPermi("system:user:create") ? "button" : "", |
|
|
|
btnName: "新增", |
|
|
|
name: "addNew", |
|
|
|
color: "success", |
|
|
|
plain: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: this.$auth.hasPermi("system:user:import") ? "button" : "", |
|
|
|
btnName: "导入", |
|
|
|
name: "import", |
|
|
|
color: "warning", |
|
|
|
color: "primary", |
|
|
|
plain: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
@@ -636,20 +638,15 @@ export default { |
|
|
|
color: "primary", |
|
|
|
plain: true, |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: this.$auth.hasPermi("system:user:create") ? "button" : "", |
|
|
|
btnName: "新增", |
|
|
|
name: "addNew", |
|
|
|
color: "success", |
|
|
|
plain: true, |
|
|
|
}, |
|
|
|
], |
|
|
|
tableBtn: [ |
|
|
|
this.$auth.hasPermi("system:user:update") |
|
|
|
? { |
|
|
|
type: "edit", |
|
|
|
btnName: "修改", |
|
|
|
} |
|
|
|
: undefined, |
|
|
|
this.$auth.hasPermi("system:user:delete") |
|
|
|
? { |
|
|
|
type: "delete", |
|
|
|
btnName: "删除", |
|
|
|
} |
|
|
|
: undefined, |
|
|
|
this.$auth.hasPermi("system:user:update-password") |
|
|
|
? { |
|
|
|
type: "reset", |
|
|
|
@@ -662,6 +659,18 @@ export default { |
|
|
|
btnName: "分配角色", |
|
|
|
} |
|
|
|
: undefined, |
|
|
|
this.$auth.hasPermi("system:user:update") |
|
|
|
? { |
|
|
|
type: "edit", |
|
|
|
btnName: "修改", |
|
|
|
} |
|
|
|
: undefined, |
|
|
|
this.$auth.hasPermi("system:user:delete") |
|
|
|
? { |
|
|
|
type: "delete", |
|
|
|
btnName: "删除", |
|
|
|
} |
|
|
|
: undefined, |
|
|
|
].filter((v) => v), |
|
|
|
tableProps, |
|
|
|
// 遮罩层 |
|
|
|
@@ -803,6 +812,15 @@ export default { |
|
|
|
case "search": |
|
|
|
this.handleQuery(val); |
|
|
|
break; |
|
|
|
case "cancel": |
|
|
|
this.$refs["userSearchBarForm"].resetForm(); |
|
|
|
this.queryParams.pageNo = 1; |
|
|
|
this.queryParams.username = ""; |
|
|
|
this.queryParams.mobile = ""; |
|
|
|
this.queryParams.status = ""; |
|
|
|
this.queryParams.createTime = []; |
|
|
|
this.getList(); |
|
|
|
break; |
|
|
|
case "addNew": |
|
|
|
this.handleAdd(); |
|
|
|
break; |
|
|
|
@@ -1033,7 +1051,7 @@ export default { |
|
|
|
this.upload.title = "用户导入"; |
|
|
|
this.upload.open = true; |
|
|
|
}, |
|
|
|
/** 下载模板操作 */ |
|
|
|
/** 导出模板操作 */ |
|
|
|
importTemplate() { |
|
|
|
importTemplate().then((response) => { |
|
|
|
this.$download.excel(response, "用户导入模板.xls"); |
|
|
|
@@ -1090,11 +1108,19 @@ export default { |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
|
|
.app-container { |
|
|
|
.user-container { |
|
|
|
width: 100%; |
|
|
|
height: calc(100vh - 120px - 8px); |
|
|
|
background-color: #fff; |
|
|
|
border-radius: 8px; |
|
|
|
padding: 8px; |
|
|
|
background-color: #f2f4f9; |
|
|
|
|
|
|
|
.user-box { |
|
|
|
.user-box-left, |
|
|
|
.user-box-right { |
|
|
|
background-color: #fff; |
|
|
|
padding: 8px; |
|
|
|
border-radius: 8px; |
|
|
|
height: calc(100vh - 128px); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
