|
@@ -304,235 +304,209 @@ function resetUserPwdBtn(row) {
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
|
<template>
|
|
|
- <div>
|
|
|
|
|
- <el-card class="tjm_card_style_custom">
|
|
|
|
|
- <div class="tjm_card_title">条件检索</div>
|
|
|
|
|
- <div class="tjm_card_select">
|
|
|
|
|
- <div class="tjm_card_select_left">
|
|
|
|
|
- <el-form
|
|
|
|
|
- :inline="true"
|
|
|
|
|
- :model="params"
|
|
|
|
|
- label-width="80px"
|
|
|
|
|
- :label-position="'left'"
|
|
|
|
|
- >
|
|
|
|
|
- <!-- <el-form-item label="用户编号">
|
|
|
|
|
- <el-input v-model="params.code" clearable />
|
|
|
|
|
- </el-form-item> -->
|
|
|
|
|
- <el-form-item label="用户名称">
|
|
|
|
|
- <el-input v-model="params.userName" clearable />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- <el-form-item label="姓名">
|
|
|
|
|
- <el-input v-model="params.realName" clearable />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
|
|
+ <el-card class="tjm_card_style_custom">
|
|
|
|
|
+ <div class="tjm_card_title">条件检索</div>
|
|
|
|
|
+ <div class="tjm_card_select">
|
|
|
|
|
+ <el-scrollbar>
|
|
|
|
|
+ <el-form class="tjm_card_select_left" :model="params" label-width="80px" label-position="left">
|
|
|
|
|
+ <el-row :gutter="15">
|
|
|
|
|
+ <!-- <el-col :lg="8" :md="12" :xs="24">
|
|
|
|
|
+ <el-form-item label="用户编号">
|
|
|
|
|
+ <el-input v-model="params.code" clearable placeholder="请输入用户编号"></el-input>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col> -->
|
|
|
|
|
+ <el-col :lg="8" :md="12" :xs="24">
|
|
|
|
|
+ <el-form-item label="用户名称">
|
|
|
|
|
+ <el-input v-model="params.userName" clearable placeholder="请输入用户名称"></el-input>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :lg="8" :md="12" :xs="24">
|
|
|
|
|
+ <el-form-item label="姓名">
|
|
|
|
|
+ <el-input v-model="params.realName" clearable placeholder="请输入姓名"></el-input>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <!-- <el-col :lg="8" :md="12" :xs="24">
|
|
|
|
|
+ <el-form-item label="创建时间">
|
|
|
|
|
+ <el-date-picker v-model="params.date" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :lg="8" :md="12" :xs="24">
|
|
|
|
|
+ <el-form-item label="用户状态">
|
|
|
|
|
+ <el-select v-model="params.status" clearable placeholder="请选择用户状态">
|
|
|
|
|
+ <el-option label="启用" value="1"></el-option>
|
|
|
|
|
+ <el-option label="禁用" value="2"></el-option>
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col> -->
|
|
|
|
|
+ </el-row>
|
|
|
|
|
+ </el-form>
|
|
|
|
|
|
|
|
- <!-- <el-form-item label="创建时间">
|
|
|
|
|
- <el-date-picker
|
|
|
|
|
- v-model="params.date"
|
|
|
|
|
- type="daterange"
|
|
|
|
|
- placeholder="Pick a date"
|
|
|
|
|
- clearable
|
|
|
|
|
- />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- <el-form-item label="用户状态">
|
|
|
|
|
- <el-select
|
|
|
|
|
- v-model="params.status"
|
|
|
|
|
- clearable
|
|
|
|
|
- placeholder="请选择"
|
|
|
|
|
- >
|
|
|
|
|
- <el-option label="启用" value="1" />
|
|
|
|
|
- <el-option label="禁用" value="2" />
|
|
|
|
|
- </el-select>
|
|
|
|
|
- </el-form-item> -->
|
|
|
|
|
- <el-form-item>
|
|
|
|
|
- <el-button type="primary" @click="searchUserListBtn">
|
|
|
|
|
- <el-icon class="tjm_btn_icon_right"><tjm-icon-ep-Plus /></el-icon>
|
|
|
|
|
- 搜索
|
|
|
|
|
- </el-button>
|
|
|
|
|
- <el-button @click="resetParamsBtn">
|
|
|
|
|
- <el-icon class="tjm_btn_icon_right"><tjm-icon-ep-RefreshRight /></el-icon>
|
|
|
|
|
- 重置
|
|
|
|
|
- </el-button>
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-form>
|
|
|
|
|
|
|
+ <div class="tjm_card_select_right">
|
|
|
|
|
+ <el-button type="primary" icon="search" @click="searchUserListBtn">搜索</el-button>
|
|
|
|
|
+ <el-button icon="refresh-right" @click="resetParamsBtn">重置</el-button>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+ </el-scrollbar>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <el-divider></el-divider>
|
|
|
|
|
+
|
|
|
|
|
+ <div class="tjm_card_tools">
|
|
|
|
|
+ <div class="tjm_card_tools_left">
|
|
|
|
|
+ <el-button type="primary" icon="plus" @click="addUserBtn">新增</el-button>
|
|
|
|
|
+ <el-button type="danger" icon="delete" @click="delUserMoreBtn">批量删除</el-button>
|
|
|
</div>
|
|
</div>
|
|
|
- <el-divider />
|
|
|
|
|
- <div class="tjm_card_tools">
|
|
|
|
|
- <div class="tjm_card_tools_left">
|
|
|
|
|
- <el-button type="primary" @click="addUserBtn">
|
|
|
|
|
- <el-icon class="tjm_btn_icon_right"><tjm-icon-ep-Plus /></el-icon>
|
|
|
|
|
- 新增
|
|
|
|
|
- </el-button>
|
|
|
|
|
- <el-button type="danger" @click="delUserMoreBtn">
|
|
|
|
|
- <el-icon class="tjm_btn_icon_right"><tjm-icon-ep-delete /></el-icon>
|
|
|
|
|
- 批量删除
|
|
|
|
|
- </el-button>
|
|
|
|
|
- </div>
|
|
|
|
|
- <!-- <div class="tjm_card_tools_right">
|
|
|
|
|
- <el-button>
|
|
|
|
|
- <el-icon class="tjm_btn_icon_right"><tjm-icon-ep-download /></el-icon>
|
|
|
|
|
- excel导出数据
|
|
|
|
|
- </el-button>
|
|
|
|
|
- </div> -->
|
|
|
|
|
|
|
+ <div class="tjm_card_tools_right">
|
|
|
|
|
+ <el-button icon="download" @click="table_export">导出</el-button>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="tjm_card_table">
|
|
|
|
|
- <div class="tjm_card_table_left" style="height: 450px; overflow: auto">
|
|
|
|
|
- <el-input
|
|
|
|
|
- v-model="deptName"
|
|
|
|
|
- placeholder="请输入部门名称"
|
|
|
|
|
- clearable
|
|
|
|
|
- prefix-icon="Search"
|
|
|
|
|
- />
|
|
|
|
|
- <!-- default-expand-all -->
|
|
|
|
|
- <el-tree
|
|
|
|
|
- :data="deptOptions"
|
|
|
|
|
- :props="{ label: 'name', children: 'children' }"
|
|
|
|
|
- :expand-on-click-node="false"
|
|
|
|
|
- ref="deptTreeRef"
|
|
|
|
|
- node-key="id"
|
|
|
|
|
- highlight-current
|
|
|
|
|
- @node-click="treeNodeClick"
|
|
|
|
|
- :filter-node-method="filterNode"
|
|
|
|
|
- style="margin-top: 6px"
|
|
|
|
|
- />
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="tjm_card_table_right">
|
|
|
|
|
- <el-table
|
|
|
|
|
- header-cell-class-name="tjm_cart_table_header"
|
|
|
|
|
- :data="tableData"
|
|
|
|
|
- border
|
|
|
|
|
- width="100%"
|
|
|
|
|
- @selection-change="selectionChange"
|
|
|
|
|
- >
|
|
|
|
|
- <el-table-column type="selection" width="55" />
|
|
|
|
|
- <el-table-column type="index" label="序号" width="55" />
|
|
|
|
|
- <el-table-column prop="userName" label="用户名" />
|
|
|
|
|
- <el-table-column prop="deptName" label="所属部门" width="240" />
|
|
|
|
|
- <el-table-column prop="name" label="姓名" />
|
|
|
|
|
- <el-table-column prop="mobile" label="手机号" />
|
|
|
|
|
- <el-table-column prop="email" label="电子邮箱" width="240" />
|
|
|
|
|
- <el-table-column prop="state" label="用户状态">
|
|
|
|
|
- <template #default="scope">
|
|
|
|
|
- {{ ["启用", "禁用"][scope.row.state] }}
|
|
|
|
|
- </template>
|
|
|
|
|
- </el-table-column>
|
|
|
|
|
- <el-table-column prop="ope" label="操作">
|
|
|
|
|
- <template #default="scope">
|
|
|
|
|
- <el-tooltip content="修改" placement="top">
|
|
|
|
|
- <el-button
|
|
|
|
|
- link
|
|
|
|
|
- type="primary"
|
|
|
|
|
- icon="Edit"
|
|
|
|
|
- @click="modUserBtn(scope.row)"
|
|
|
|
|
- ></el-button>
|
|
|
|
|
- </el-tooltip>
|
|
|
|
|
- <el-tooltip content="删除" placement="top">
|
|
|
|
|
- <el-button
|
|
|
|
|
- link
|
|
|
|
|
- type="primary"
|
|
|
|
|
- icon="Delete"
|
|
|
|
|
- @click="delUserBtn(scope.row)"
|
|
|
|
|
- ></el-button>
|
|
|
|
|
- </el-tooltip>
|
|
|
|
|
- <el-tooltip content="重置密码" placement="top">
|
|
|
|
|
- <el-button
|
|
|
|
|
- link
|
|
|
|
|
- type="primary"
|
|
|
|
|
- icon="Key"
|
|
|
|
|
- @click="resetUserPwdBtn(scope.row)"
|
|
|
|
|
- ></el-button>
|
|
|
|
|
- </el-tooltip>
|
|
|
|
|
- </template>
|
|
|
|
|
- </el-table-column>
|
|
|
|
|
- </el-table>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="tjm_card_pagination">
|
|
|
|
|
- <el-pagination
|
|
|
|
|
- background
|
|
|
|
|
- layout="total,sizes,prev, pager, next,"
|
|
|
|
|
- :total="total"
|
|
|
|
|
- :page-sizes="[20, 30, 100]"
|
|
|
|
|
- @size-change="sizeChange"
|
|
|
|
|
- @current-change="currentChange"
|
|
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="tjm_card_table">
|
|
|
|
|
+ <div class="tjm_card_table_left">
|
|
|
|
|
+ <el-input
|
|
|
|
|
+ v-model="deptName"
|
|
|
|
|
+ placeholder="请输入部门名称"
|
|
|
|
|
+ clearable
|
|
|
|
|
+ prefix-icon="Search"
|
|
|
|
|
+ />
|
|
|
|
|
+ <!-- default-expand-all -->
|
|
|
|
|
+ <el-tree
|
|
|
|
|
+ :data="deptOptions"
|
|
|
|
|
+ :props="{ label: 'name', children: 'children' }"
|
|
|
|
|
+ :expand-on-click-node="false"
|
|
|
|
|
+ ref="deptTreeRef"
|
|
|
|
|
+ node-key="id"
|
|
|
|
|
+ highlight-current
|
|
|
|
|
+ @node-click="treeNodeClick"
|
|
|
|
|
+ :filter-node-method="filterNode"
|
|
|
|
|
+ style="margin-top: 6px"
|
|
|
/>
|
|
/>
|
|
|
</div>
|
|
</div>
|
|
|
- </el-card>
|
|
|
|
|
|
|
+ <el-table style="flex: 1;" row-key="id" header-cell-class-name="tjm_card_table_header" :data="tableData" border @selection-change="selectionChange">
|
|
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
|
|
+ <el-table-column type="index" label="序号" width="55" />
|
|
|
|
|
+ <el-table-column prop="userName" label="用户名" />
|
|
|
|
|
+ <el-table-column prop="deptName" label="所属部门" width="240" />
|
|
|
|
|
+ <el-table-column prop="name" label="姓名" />
|
|
|
|
|
+ <el-table-column prop="mobile" label="手机号" />
|
|
|
|
|
+ <el-table-column prop="email" label="电子邮箱" width="240" />
|
|
|
|
|
+ <el-table-column prop="state" label="用户状态">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ {{ ["启用", "禁用"][scope.row.state] }}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column prop="ope" label="操作">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <el-tooltip content="修改" placement="top">
|
|
|
|
|
+ <el-button
|
|
|
|
|
+ link
|
|
|
|
|
+ type="primary"
|
|
|
|
|
+ icon="Edit"
|
|
|
|
|
+ @click="modUserBtn(scope.row)"
|
|
|
|
|
+ ></el-button>
|
|
|
|
|
+ </el-tooltip>
|
|
|
|
|
+ <el-tooltip content="删除" placement="top">
|
|
|
|
|
+ <el-button
|
|
|
|
|
+ link
|
|
|
|
|
+ type="primary"
|
|
|
|
|
+ icon="Delete"
|
|
|
|
|
+ @click="delUserBtn(scope.row)"
|
|
|
|
|
+ ></el-button>
|
|
|
|
|
+ </el-tooltip>
|
|
|
|
|
+ <el-tooltip content="重置密码" placement="top">
|
|
|
|
|
+ <el-button
|
|
|
|
|
+ link
|
|
|
|
|
+ type="primary"
|
|
|
|
|
+ icon="Key"
|
|
|
|
|
+ @click="resetUserPwdBtn(scope.row)"
|
|
|
|
|
+ ></el-button>
|
|
|
|
|
+ </el-tooltip>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ </el-table>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="tjm_card_pagination">
|
|
|
|
|
+ <el-pagination
|
|
|
|
|
+ background
|
|
|
|
|
+ layout="total,sizes,prev, pager, next,"
|
|
|
|
|
+ :total="total"
|
|
|
|
|
+ :page-sizes="[20, 30, 100]"
|
|
|
|
|
+ @size-change="sizeChange"
|
|
|
|
|
+ @current-change="currentChange"
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-card>
|
|
|
|
|
|
|
|
- <!-- 编辑 -->
|
|
|
|
|
- <el-dialog :title="title" v-model="open" width="680px" append-to-body>
|
|
|
|
|
- <el-form ref="userRef" :model="form" :rules="rules" label-width="100px">
|
|
|
|
|
- <el-row>
|
|
|
|
|
- <el-col :span="24">
|
|
|
|
|
- <el-form-item label="用户名" prop="userName">
|
|
|
|
|
- <el-input
|
|
|
|
|
- v-model="form.userName"
|
|
|
|
|
- placeholder="请输入用户名"
|
|
|
|
|
- />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-col>
|
|
|
|
|
- <el-col :span="24">
|
|
|
|
|
- <el-form-item label="所属部门" prop="depId">
|
|
|
|
|
- <el-tree-select
|
|
|
|
|
- style="width: 100%"
|
|
|
|
|
- v-model="form.depId"
|
|
|
|
|
- :data="deptOptions"
|
|
|
|
|
- filterable
|
|
|
|
|
- :props="{ value: 'id', label: 'name', children: 'children' }"
|
|
|
|
|
- value-key="id"
|
|
|
|
|
- placeholder="选择所属部门"
|
|
|
|
|
- check-strictly
|
|
|
|
|
- />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-col>
|
|
|
|
|
- <el-col :span="24">
|
|
|
|
|
- <el-form-item label="角色" prop="roleIds">
|
|
|
|
|
- <el-select
|
|
|
|
|
- v-model="form.roleIds"
|
|
|
|
|
- multiple
|
|
|
|
|
- placeholder="请选择角色"
|
|
|
|
|
- style="width: 100%"
|
|
|
|
|
- >
|
|
|
|
|
- <el-option
|
|
|
|
|
- v-for="item in roleData"
|
|
|
|
|
- :key="item.id"
|
|
|
|
|
- :label="item.name"
|
|
|
|
|
- :value="item.id"
|
|
|
|
|
- />
|
|
|
|
|
- </el-select>
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-col>
|
|
|
|
|
- <el-col :span="24">
|
|
|
|
|
- <el-form-item label="姓名" prop="realName">
|
|
|
|
|
- <el-input
|
|
|
|
|
- v-model="form.realName"
|
|
|
|
|
- placeholder="请输入姓名"
|
|
|
|
|
- />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-col>
|
|
|
|
|
- <el-col :span="24">
|
|
|
|
|
- <el-form-item label="手机号" prop="phone">
|
|
|
|
|
- <el-input
|
|
|
|
|
- v-model="form.phone"
|
|
|
|
|
- placeholder="请输入手机号"
|
|
|
|
|
|
|
+ <!-- 编辑 -->
|
|
|
|
|
+ <el-dialog :title="title" v-model="open" width="680px" append-to-body>
|
|
|
|
|
+ <el-form ref="userRef" :model="form" :rules="rules" label-width="100px">
|
|
|
|
|
+ <el-row>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-form-item label="用户名" prop="userName">
|
|
|
|
|
+ <el-input
|
|
|
|
|
+ v-model="form.userName"
|
|
|
|
|
+ placeholder="请输入用户名"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-form-item label="所属部门" prop="depId">
|
|
|
|
|
+ <el-tree-select
|
|
|
|
|
+ style="width: 100%"
|
|
|
|
|
+ v-model="form.depId"
|
|
|
|
|
+ :data="deptOptions"
|
|
|
|
|
+ filterable
|
|
|
|
|
+ :props="{ value: 'id', label: 'name', children: 'children' }"
|
|
|
|
|
+ value-key="id"
|
|
|
|
|
+ placeholder="选择所属部门"
|
|
|
|
|
+ check-strictly
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-form-item label="角色" prop="roleIds">
|
|
|
|
|
+ <el-select
|
|
|
|
|
+ v-model="form.roleIds"
|
|
|
|
|
+ multiple
|
|
|
|
|
+ placeholder="请选择角色"
|
|
|
|
|
+ style="width: 100%"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-option
|
|
|
|
|
+ v-for="item in roleData"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :label="item.name"
|
|
|
|
|
+ :value="item.id"
|
|
|
/>
|
|
/>
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-col>
|
|
|
|
|
- <el-col :span="24">
|
|
|
|
|
- <el-form-item label="邮箱" prop="email">
|
|
|
|
|
- <el-input v-model="form.email" placeholder="邮箱" clearable />
|
|
|
|
|
- </el-form-item>
|
|
|
|
|
- </el-col>
|
|
|
|
|
- </el-row>
|
|
|
|
|
- </el-form>
|
|
|
|
|
- <template #footer>
|
|
|
|
|
- <div class="dialog-footer">
|
|
|
|
|
- <el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
|
|
- <el-button @click="cancel">取 消</el-button>
|
|
|
|
|
- </div>
|
|
|
|
|
- </template>
|
|
|
|
|
- </el-dialog>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-form-item label="姓名" prop="realName">
|
|
|
|
|
+ <el-input
|
|
|
|
|
+ v-model="form.realName"
|
|
|
|
|
+ placeholder="请输入姓名"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-form-item label="手机号" prop="phone">
|
|
|
|
|
+ <el-input
|
|
|
|
|
+ v-model="form.phone"
|
|
|
|
|
+ placeholder="请输入手机号"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-form-item label="邮箱" prop="email">
|
|
|
|
|
+ <el-input v-model="form.email" placeholder="邮箱" clearable />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ </el-row>
|
|
|
|
|
+ </el-form>
|
|
|
|
|
+ <template #footer>
|
|
|
|
|
+ <div class="dialog-footer">
|
|
|
|
|
+ <el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
|
|
+ <el-button @click="cancel">取 消</el-button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-dialog>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<style lang="scss" scoped></style>
|
|
<style lang="scss" scoped></style>
|