|
@@ -1,8 +1,8 @@
|
|
<template>
|
|
<template>
|
|
<div class="app-container">
|
|
<div class="app-container">
|
|
- <el-row :gutter="20">
|
|
|
|
|
|
+ <el-row :gutter="20" >
|
|
<!--部门数据-->
|
|
<!--部门数据-->
|
|
- <el-col :span="4" :xs="24">
|
|
|
|
|
|
+ <!-- <el-col :span="4" :xs="24" style="background-color: #fff; padding-top: 5px; border-radius: 5px;">
|
|
<div class="head-container">
|
|
<div class="head-container">
|
|
<el-input
|
|
<el-input
|
|
v-model="deptName"
|
|
v-model="deptName"
|
|
@@ -26,14 +26,14 @@
|
|
@node-click="handleNodeClick"
|
|
@node-click="handleNodeClick"
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
- </el-col>
|
|
|
|
|
|
+ </el-col> -->
|
|
<!--用户数据-->
|
|
<!--用户数据-->
|
|
- <el-col :span="20" :xs="24">
|
|
|
|
- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
- <el-form-item label="用户名称" prop="userName">
|
|
|
|
|
|
+ <el-col :span="24" :xs="24">
|
|
|
|
+ <el-form style="background-color: #fff; padding-top: 25px; margin-bottom: 20px; border-radius: 5px; padding:5px;" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
+ <el-form-item label="账号" prop="userName">
|
|
<el-input
|
|
<el-input
|
|
v-model="queryParams.userName"
|
|
v-model="queryParams.userName"
|
|
- placeholder="请输入用户名称"
|
|
|
|
|
|
+ placeholder="请输入账号"
|
|
clearable
|
|
clearable
|
|
style="width: 240px"
|
|
style="width: 240px"
|
|
@keyup.enter.native="handleQuery"
|
|
@keyup.enter.native="handleQuery"
|
|
@@ -80,125 +80,130 @@
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-form>
|
|
</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[0].visible" />
|
|
|
|
- <el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
|
|
|
|
- <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
|
|
|
|
- <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
|
|
|
|
- <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
|
|
|
|
- <el-table-column label="状态" align="center" key="status" v-if="columns[5].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[6].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>
|
|
|
|
|
|
+ <div class="ntg">
|
|
|
|
+ <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[0].visible" />
|
|
|
|
+ <el-table-column label="账号" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
|
|
|
|
+ <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
|
|
|
|
+ <!-- <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" /> -->
|
|
|
|
+ <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
|
|
|
|
+ <el-table-column label="状态" align="center" key="status" v-if="columns[5].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[6].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"
|
|
|
|
+ >
|
|
|
|
+ <!-- v-if="scope.row.userId !== 1" -->
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <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>
|
|
|
|
|
|
- <pagination
|
|
|
|
- v-show="total>0"
|
|
|
|
- :total="total"
|
|
|
|
- :page.sync="queryParams.pageNum"
|
|
|
|
- :limit.sync="queryParams.pageSize"
|
|
|
|
- @pagination="getList"
|
|
|
|
- />
|
|
|
|
</el-col>
|
|
</el-col>
|
|
</el-row>
|
|
</el-row>
|
|
|
|
|
|
@@ -206,16 +211,28 @@
|
|
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
|
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
<el-row>
|
|
<el-row>
|
|
- <el-col :span="12">
|
|
|
|
|
|
+ <el-col :span="24">
|
|
<el-form-item label="用户昵称" prop="nickName">
|
|
<el-form-item label="用户昵称" prop="nickName">
|
|
<el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
|
|
<el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-col>
|
|
- <el-col :span="12">
|
|
|
|
|
|
+ <el-col :span="24">
|
|
<el-form-item label="归属部门" prop="deptId">
|
|
<el-form-item label="归属部门" prop="deptId">
|
|
<treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
|
|
<treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-col>
|
|
|
|
+ <!-- <el-col :span="12">
|
|
|
|
+ <el-form-item label="用户类型" prop="userType">
|
|
|
|
+ <el-select v-model="form.userType" placeholder="请选择用户类型">
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="dict in dict.type.usertype"
|
|
|
|
+ :key="dict.value"
|
|
|
|
+ :label="dict.label"
|
|
|
|
+ :value="dict.value"
|
|
|
|
+ ></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-col> -->
|
|
</el-row>
|
|
</el-row>
|
|
<el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-col :span="12">
|
|
@@ -231,8 +248,8 @@
|
|
</el-row>
|
|
</el-row>
|
|
<el-row>
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-col :span="12">
|
|
- <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
|
|
|
|
- <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
|
|
|
|
|
|
+ <el-form-item v-if="form.userId == undefined" label="账号" prop="userName">
|
|
|
|
+ <el-input v-model="form.userName" placeholder="请输入账号" maxlength="30" />
|
|
</el-form-item>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-col :span="12">
|
|
@@ -348,7 +365,7 @@ import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
|
|
|
export default {
|
|
export default {
|
|
name: "User",
|
|
name: "User",
|
|
- dicts: ['sys_normal_disable', 'sys_user_sex'],
|
|
|
|
|
|
+ dicts: ['sys_normal_disable', 'sys_user_sex','usertype'],
|
|
components: { Treeselect },
|
|
components: { Treeselect },
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
@@ -415,7 +432,7 @@ export default {
|
|
// 列信息
|
|
// 列信息
|
|
columns: [
|
|
columns: [
|
|
{ key: 0, label: `用户编号`, visible: true },
|
|
{ key: 0, label: `用户编号`, visible: true },
|
|
- { key: 1, label: `用户名称`, visible: true },
|
|
|
|
|
|
+ { key: 1, label: `账号`, visible: true },
|
|
{ key: 2, label: `用户昵称`, visible: true },
|
|
{ key: 2, label: `用户昵称`, visible: true },
|
|
{ key: 3, label: `部门`, visible: true },
|
|
{ key: 3, label: `部门`, visible: true },
|
|
{ key: 4, label: `手机号码`, visible: true },
|
|
{ key: 4, label: `手机号码`, visible: true },
|
|
@@ -425,8 +442,8 @@ export default {
|
|
// 表单校验
|
|
// 表单校验
|
|
rules: {
|
|
rules: {
|
|
userName: [
|
|
userName: [
|
|
- { required: true, message: "用户名称不能为空", trigger: "blur" },
|
|
|
|
- { min: 2, max: 20, message: '用户名称长度必须介于 2 和 20 之间', trigger: 'blur' }
|
|
|
|
|
|
+ { required: true, message: "账号不能为空", trigger: "blur" },
|
|
|
|
+ { min: 2, max: 20, message: '账号长度必须介于 2 和 20 之间', trigger: 'blur' }
|
|
],
|
|
],
|
|
nickName: [
|
|
nickName: [
|
|
{ required: true, message: "用户昵称不能为空", trigger: "blur" }
|
|
{ required: true, message: "用户昵称不能为空", trigger: "blur" }
|
|
@@ -435,6 +452,9 @@ export default {
|
|
{ required: true, message: "用户密码不能为空", trigger: "blur" },
|
|
{ required: true, message: "用户密码不能为空", trigger: "blur" },
|
|
{ min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
|
|
{ min: 5, max: 20, message: '用户密码长度必须介于 5 和 20 之间', trigger: 'blur' }
|
|
],
|
|
],
|
|
|
|
+ // userType: [
|
|
|
|
+ // { required: true, message: "不能为空", trigger: "blur" },
|
|
|
|
+ // ],
|
|
email: [
|
|
email: [
|
|
{
|
|
{
|
|
type: "email",
|
|
type: "email",
|
|
@@ -443,12 +463,14 @@ export default {
|
|
}
|
|
}
|
|
],
|
|
],
|
|
phonenumber: [
|
|
phonenumber: [
|
|
|
|
+ { required: true, message: "不能为空", trigger: "blur" },
|
|
{
|
|
{
|
|
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
|
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
|
message: "请输入正确的手机号码",
|
|
message: "请输入正确的手机号码",
|
|
trigger: "blur"
|
|
trigger: "blur"
|
|
}
|
|
}
|
|
- ]
|
|
|
|
|
|
+ ],
|
|
|
|
+
|
|
}
|
|
}
|
|
};
|
|
};
|
|
},
|
|
},
|
|
@@ -522,7 +544,8 @@ export default {
|
|
status: "0",
|
|
status: "0",
|
|
remark: undefined,
|
|
remark: undefined,
|
|
postIds: [],
|
|
postIds: [],
|
|
- roleIds: []
|
|
|
|
|
|
+ roleIds: [],
|
|
|
|
+ userType:'00'
|
|
};
|
|
};
|
|
this.resetForm("form");
|
|
this.resetForm("form");
|
|
},
|
|
},
|
|
@@ -667,4 +690,30 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
};
|
|
};
|
|
-</script>
|
|
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+<style scoped lang="scss">
|
|
|
|
+ .app-container{
|
|
|
|
+ background-color: #f3f4f6;
|
|
|
|
+ height: 100vh;
|
|
|
|
+ }
|
|
|
|
+ .ntg{
|
|
|
|
+ background-color: #fff;
|
|
|
|
+ padding: 5px;
|
|
|
|
+ padding-top: 25px;
|
|
|
|
+ border-radius: 5px;
|
|
|
|
+ .pagination-container{
|
|
|
|
+ height: 50px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .nghf{
|
|
|
|
+ background-color: #fff;
|
|
|
|
+ padding: 5px;
|
|
|
|
+ padding-top: 25px;
|
|
|
|
+ border-radius: 5px;
|
|
|
|
+ margin-bottom: 20px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+</style>
|