|
|
|
|
@@ -1,98 +1,82 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="app-container">
|
|
|
|
|
<el-row :gutter="20">
|
|
|
|
|
<splitpanes :horizontal="this.$store.getters.device === 'mobile'" class="default-theme">
|
|
|
|
|
<!--部门数据-->
|
|
|
|
|
<pane size="16">
|
|
|
|
|
<el-col>
|
|
|
|
|
<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" node-key="id" default-expand-all highlight-current @node-click="handleNodeClick" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="app-container tree-sidebar-manage-wrap">
|
|
|
|
|
<tree-panel title="组织机构" :tree-data="deptOptions" search-placeholder="请输入部门名称" storage-key="dept-sidebar-width" :defaultExpandAll="true" @node-click="handleNodeClick" @refresh="getDeptTree" ref="deptTreeRef" />
|
|
|
|
|
<div class="tree-sidebar-content">
|
|
|
|
|
<div class="content-inner">
|
|
|
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
|
<el-form-item label="用户名称" prop="userName">
|
|
|
|
|
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="手机号码" prop="phonenumber">
|
|
|
|
|
<el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="状态" prop="status">
|
|
|
|
|
<el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
|
|
|
|
|
<el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="创建时间">
|
|
|
|
|
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
|
|
<el-row :gutter="10" class="mb8">
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:user:add']">新增</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
</pane>
|
|
|
|
|
<!--用户数据-->
|
|
|
|
|
<pane size="84">
|
|
|
|
|
<el-col>
|
|
|
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
|
<el-form-item label="用户名称" prop="userName">
|
|
|
|
|
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="手机号码" prop="phonenumber">
|
|
|
|
|
<el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="状态" prop="status">
|
|
|
|
|
<el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
|
|
|
|
|
<el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="创建时间">
|
|
|
|
|
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
|
|
<el-row :gutter="10" class="mb8">
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:user:add']">新增</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['system:user:edit']">修改</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="info" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['system:user:import']">导入</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['system:user:export']">导出</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
|
|
|
|
|
<el-table-column type="selection" width="50" align="center" />
|
|
|
|
|
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns.userId.visible" />
|
|
|
|
|
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns.userName.visible" :show-overflow-tooltip="true" />
|
|
|
|
|
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns.nickName.visible" :show-overflow-tooltip="true" />
|
|
|
|
|
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns.deptName.visible" :show-overflow-tooltip="true" />
|
|
|
|
|
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns.phonenumber.visible" width="120" />
|
|
|
|
|
<el-table-column label="状态" align="center" key="status" v-if="columns.status.visible">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns.createTime.visible" width="160">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
|
|
|
|
<template slot-scope="scope" v-if="scope.row.userId !== 1">
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']">修改</el-button>
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']">删除</el-button>
|
|
|
|
|
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:user:resetPwd', 'system:user:edit']">
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
|
|
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
|
|
<el-dropdown-item command="handleResetPwd" icon="el-icon-key" v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check" v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>
|
|
|
|
|
</el-dropdown-menu>
|
|
|
|
|
</el-dropdown>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['system:user:edit']">修改</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
</pane>
|
|
|
|
|
</splitpanes>
|
|
|
|
|
</el-row>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="info" plain icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['system:user:import']">导入</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['system:user:export']">导出</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
|
|
|
|
|
<el-table-column type="selection" width="50" align="center" />
|
|
|
|
|
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns.userId.visible" />
|
|
|
|
|
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns.userName.visible" :show-overflow-tooltip="true" />
|
|
|
|
|
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns.nickName.visible" :show-overflow-tooltip="true" />
|
|
|
|
|
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns.deptName.visible" :show-overflow-tooltip="true" />
|
|
|
|
|
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns.phonenumber.visible" width="120" />
|
|
|
|
|
<el-table-column label="状态" align="center" key="status" v-if="columns.status.visible">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns.createTime.visible" width="160">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
|
|
|
|
<template slot-scope="scope" v-if="scope.row.userId !== 1">
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']">修改</el-button>
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']">删除</el-button>
|
|
|
|
|
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:user:resetPwd', 'system:user:edit']">
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
|
|
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
|
|
<el-dropdown-item command="handleResetPwd" icon="el-icon-key" v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check" v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>
|
|
|
|
|
</el-dropdown-menu>
|
|
|
|
|
</el-dropdown>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 添加或修改用户配置对话框 -->
|
|
|
|
|
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
|
|
|
|
@@ -205,13 +189,12 @@ import { listUser, getUser, delUser, addUser, updateUser, resetUserPwd, changeUs
|
|
|
|
|
import { getToken } from "@/utils/auth"
|
|
|
|
|
import Treeselect from "@riophae/vue-treeselect"
|
|
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css"
|
|
|
|
|
import { Splitpanes, Pane } from "splitpanes"
|
|
|
|
|
import "splitpanes/dist/splitpanes.css"
|
|
|
|
|
import TreePanel from "@/components/TreePanel"
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
name: "User",
|
|
|
|
|
dicts: ['sys_normal_disable', 'sys_user_sex'],
|
|
|
|
|
components: { Treeselect, Splitpanes, Pane },
|
|
|
|
|
components: { Treeselect, TreePanel },
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
// 遮罩层
|
|
|
|
|
@@ -236,8 +219,6 @@ export default {
|
|
|
|
|
enabledDeptOptions: undefined,
|
|
|
|
|
// 是否显示弹出层
|
|
|
|
|
open: false,
|
|
|
|
|
// 部门名称
|
|
|
|
|
deptName: undefined,
|
|
|
|
|
// 默认密码
|
|
|
|
|
initPassword: undefined,
|
|
|
|
|
// 日期范围
|
|
|
|
|
@@ -248,10 +229,6 @@ export default {
|
|
|
|
|
roleOptions: [],
|
|
|
|
|
// 表单参数
|
|
|
|
|
form: {},
|
|
|
|
|
defaultProps: {
|
|
|
|
|
children: "children",
|
|
|
|
|
label: "label"
|
|
|
|
|
},
|
|
|
|
|
// 用户导入参数
|
|
|
|
|
upload: {
|
|
|
|
|
// 是否显示弹出层(用户导入)
|
|
|
|
|
@@ -317,12 +294,6 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
// 根据名称筛选部门树
|
|
|
|
|
deptName(val) {
|
|
|
|
|
this.$refs.tree.filter(val)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.getList()
|
|
|
|
|
this.getDeptTree()
|
|
|
|
|
@@ -335,11 +306,10 @@ export default {
|
|
|
|
|
getList() {
|
|
|
|
|
this.loading = true
|
|
|
|
|
listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
|
|
|
|
this.userList = response.rows
|
|
|
|
|
this.total = response.total
|
|
|
|
|
this.loading = false
|
|
|
|
|
}
|
|
|
|
|
)
|
|
|
|
|
this.userList = response.rows
|
|
|
|
|
this.total = response.total
|
|
|
|
|
this.loading = false
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
/** 查询部门下拉树结构 */
|
|
|
|
|
getDeptTree() {
|
|
|
|
|
@@ -360,11 +330,6 @@ export default {
|
|
|
|
|
return true
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
// 筛选节点
|
|
|
|
|
filterNode(value, data) {
|
|
|
|
|
if (!value) return true
|
|
|
|
|
return data.label.indexOf(value) !== -1
|
|
|
|
|
},
|
|
|
|
|
// 节点单击事件
|
|
|
|
|
handleNodeClick(data) {
|
|
|
|
|
this.queryParams.deptId = data.id
|
|
|
|
|
@@ -414,7 +379,7 @@ export default {
|
|
|
|
|
this.dateRange = []
|
|
|
|
|
this.resetForm("queryForm")
|
|
|
|
|
this.queryParams.deptId = undefined
|
|
|
|
|
this.$refs.tree.setCurrentKey(null)
|
|
|
|
|
this.$refs.deptTreeRef.setCurrentKey(null)
|
|
|
|
|
this.handleQuery()
|
|
|
|
|
},
|
|
|
|
|
// 多选框选中数据
|
|
|
|
|
@@ -476,18 +441,18 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}).then(({ value }) => {
|
|
|
|
|
resetUserPwd(row.userId, value).then(() => {
|
|
|
|
|
this.$modal.msgSuccess("修改成功,新密码是:" + value)
|
|
|
|
|
})
|
|
|
|
|
}).catch(() => {})
|
|
|
|
|
resetUserPwd(row.userId, value).then(() => {
|
|
|
|
|
this.$modal.msgSuccess("修改成功,新密码是:" + value)
|
|
|
|
|
})
|
|
|
|
|
}).catch(() => {})
|
|
|
|
|
},
|
|
|
|
|
/** 分配角色操作 */
|
|
|
|
|
handleAuthRole: function(row) {
|
|
|
|
|
handleAuthRole(row) {
|
|
|
|
|
const userId = row.userId
|
|
|
|
|
this.$router.push("/system/user-auth/role/" + userId)
|
|
|
|
|
},
|
|
|
|
|
/** 提交按钮 */
|
|
|
|
|
submitForm: function() {
|
|
|
|
|
submitForm() {
|
|
|
|
|
this.$refs["form"].validate(valid => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
if (this.form.userId != undefined) {
|
|
|
|
|
@@ -555,4 +520,4 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</script>
|
|
|
|
|
|