|
@@ -1,13 +1,509 @@
|
|
|
<template>
|
|
|
- <div>zzjg</div>
|
|
|
+ <div>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="5">
|
|
|
+ <tree-nav @renderTable="updateDeptId" treeType="zzjg"></tree-nav>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="19">
|
|
|
+ <el-container>
|
|
|
+ <el-header>
|
|
|
+ <div>
|
|
|
+ <el-input placeholder="请输入搜索关键字" suffix-icon="el-icon-search" v-model="searchText"
|
|
|
+ style="width: 200px;"></el-input>
|
|
|
+ <el-button type="primary" @click="tableParams.keyword = searchText">搜索</el-button>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button type="info" @click="exportAll">导出机构与用户</el-button>
|
|
|
+ <el-upload
|
|
|
+ class="upload-demo"
|
|
|
+ :action="import_url"
|
|
|
+ :show-file-list="false"
|
|
|
+ :data="import_data"
|
|
|
+ :on-success="import_success"
|
|
|
+ style="display: inline-block;margin: 0 10px;">
|
|
|
+ <el-button type="primary">导入机构与用户</el-button>
|
|
|
+ </el-upload>
|
|
|
+ <el-button type="info" @click="showDialog('add')">新增用户</el-button>
|
|
|
+ <el-button type="primary" @click="hdlxglDialogShow">设为活动管理</el-button>
|
|
|
+ <el-button type="warning" @click="delUser">批量删除</el-button>
|
|
|
+ </div>
|
|
|
+ </el-header>
|
|
|
+ <el-main>
|
|
|
+ <el-table
|
|
|
+ ref="multipleTable"
|
|
|
+ :data="tableData"
|
|
|
+ tooltip-effect="dark"
|
|
|
+ style="width: 100%"
|
|
|
+ @selection-change="changeChecked">
|
|
|
+ <el-table-column type="selection" width="55"></el-table-column>
|
|
|
+ <el-table-column label="姓名">
|
|
|
+ <template slot-scope="scope">{{ scope.row.user_name }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="部门">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{
|
|
|
+ scope.row.org_info.dept_full.reduce(function (path, data) {
|
|
|
+ return path += '/' + data.dept_name || ''
|
|
|
+ }, '')
|
|
|
+ }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="角色">
|
|
|
+ <template slot-scope="scope">{{ scope.row.user_role_name }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="管理活动类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.glhdlx }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="账号类型">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.user_level === '1' ? '普通账号' : '临时账号' }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" width="120">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-link type="primary" @click="showAccessDialog(scope.row)">权限</el-link>
|
|
|
+ <span style="color: #409eff;margin: 0 10px;">|</span>
|
|
|
+ <el-link type="primary" @click="showDialog('edit', scope.row)">编辑</el-link>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-main>
|
|
|
+ <el-footer style="text-align: right">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ hide-on-single-page
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :page-size="tableParams.limit"
|
|
|
+ :total="total_rows"
|
|
|
+ @current-change="pageChange"></el-pagination>
|
|
|
+ </el-footer>
|
|
|
+ </el-container>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <!-- 用户信息 -->
|
|
|
+ <el-dialog
|
|
|
+ :title="dialogType==='add'?'新增用户':'编辑用户'"
|
|
|
+ :visible.sync="userDialogVisible"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ @closed="resetDialog('user_main')"
|
|
|
+ width="700px">
|
|
|
+ <el-form ref="user_main" :model="user_main" :rules="form_rules" label-width="120px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="用户名" prop="user_name">
|
|
|
+ <el-input v-model="user_main.user_name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="密码" prop="user_password">
|
|
|
+ <el-input v-model="user_main.user_password"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="用户姓名" prop="user_realname">
|
|
|
+ <el-input v-model="user_main.user_realname"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="账号类型" prop="user_level">
|
|
|
+ <el-select v-model="user_main.user_level" placeholder="请选择">
|
|
|
+ <el-option label="临时账号" value="0"></el-option>
|
|
|
+ <el-option label="普通账号" value="1"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item label="部门" prop="dept_id">
|
|
|
+ <el-cascader
|
|
|
+ :options="deptOptions"
|
|
|
+ :props="{ checkStrictly: true }"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ v-model="user_main.dept_id"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="手机号" prop="user_phone">
|
|
|
+ <el-input v-model="user_main.user_phone"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="用户角色" prop="user_role_id">
|
|
|
+ <el-select v-model="user_main.user_role_id" placeholder="请选择">
|
|
|
+ <el-option v-for="role in roleList" :label="role.role_name" :value="role.role_id"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="onSubmit('user_main')">提交</el-button>
|
|
|
+ <el-button @click="onReset('user_main')">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 权限信息 -->
|
|
|
+ <el-dialog
|
|
|
+ :title="activeUserName+'的权限修改'"
|
|
|
+ :visible.sync="accessDialogVisible"
|
|
|
+ width="300px">
|
|
|
+ <el-switch
|
|
|
+ v-model="accessSwitch"
|
|
|
+ @change="changeAccess"
|
|
|
+ active-text="部门管理员">
|
|
|
+ </el-switch>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- 活动类型选择 -->
|
|
|
+ <el-dialog
|
|
|
+ title="活动类型选择"
|
|
|
+ :visible.sync="hdlxxzDialogVisible"
|
|
|
+ width="700px"
|
|
|
+ :close-on-click-modal="false">
|
|
|
+ <el-cascader
|
|
|
+ :options="hdlxOptions"
|
|
|
+ :props="{ checkStrictly: true }"
|
|
|
+ placeholder="请选择活动类型"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ v-model="hdlxCheckedId"></el-cascader>
|
|
|
+ <el-divider></el-divider>
|
|
|
+ <el-button type="primary" @click="addHdlxAdmin">提交设置</el-button>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import TreeNav from '@/components/TreeNav/index.vue'
|
|
|
+import axios from "axios";
|
|
|
+import { useUserStore } from '@/stores/user'
|
|
|
+const { token } = useUserStore()
|
|
|
|
|
|
-export default {
|
|
|
+import {
|
|
|
+ list_tree,
|
|
|
+ user_list,
|
|
|
+ user_add,
|
|
|
+ user_delete,
|
|
|
+ user_role,
|
|
|
+ user_edit,
|
|
|
+ user_set_access,
|
|
|
+ hdlx_list_tree,
|
|
|
+ hdlx_members_manage,
|
|
|
+ export_all,
|
|
|
+ org_user_list,
|
|
|
+ org_user_add,
|
|
|
+ org_user_detail,
|
|
|
+ org_user_edit
|
|
|
+} from "./api";
|
|
|
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ TreeNav
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ roleList: [], // 角色列表
|
|
|
+ deptOptions: [], // 部门组织级联
|
|
|
+ hdlxOptions: [], // 活动类型级联
|
|
|
+ searchText: '',
|
|
|
+ tableData: [],
|
|
|
+ total_rows: 0,
|
|
|
+ userDialogVisible: false,
|
|
|
+ accessDialogVisible: false,
|
|
|
+ accessSwitch: false,
|
|
|
+ user_main: {
|
|
|
+ user_name: '',
|
|
|
+ user_password: '',
|
|
|
+ user_realname: '',
|
|
|
+ dept_id: '',
|
|
|
+ user_level: '',
|
|
|
+ user_phone: '',
|
|
|
+ user_role_id: ''
|
|
|
+ },
|
|
|
+ form_rules: {
|
|
|
+ user_name: [
|
|
|
+ {required: true, message: '请输入用户名', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ // user_password: [
|
|
|
+ // {required: true, message: '请输入密码', trigger: 'blur'}
|
|
|
+ // ],
|
|
|
+ user_realname: [
|
|
|
+ {required: true, message: '请输入用户姓名', trigger: 'blur'}
|
|
|
+ ],
|
|
|
+ user_level: [
|
|
|
+ {required: true, message: '请选择账号类型', trigger: 'change'}
|
|
|
+ ],
|
|
|
+ dept_id: [
|
|
|
+ {required: true, message: '请选择部门', trigger: 'change'}
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ activeDeptName: '',
|
|
|
+ activeTableChecked: [],
|
|
|
+ activeUserId: '',
|
|
|
+ activeUserName: '',
|
|
|
+ tableParams: {
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ dept_id: '',
|
|
|
+ keyword: ''
|
|
|
+ },
|
|
|
+ dialogType: '',
|
|
|
+ hdlxxzDialogVisible: false,
|
|
|
+ hdlxCheckedId: [],
|
|
|
+ import_url: import.meta.env.VITE_APP_BASE_API + 'user/org/import',
|
|
|
+ import_data : {
|
|
|
+ api: 'json',
|
|
|
+ token: token
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.loadingUserRolesData()
|
|
|
+ this.loadingCascadeData()
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ // 监听传参改变
|
|
|
+ tableParams: {
|
|
|
+ handler(newData, oldData) {
|
|
|
+ this.renderTable(newData)
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ deep: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ loadingUserRolesData() {
|
|
|
+ user_role()
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.roleList = res.data.page_data
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ loadingCascadeData() {
|
|
|
+ list_tree()
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ const list = res.data.one_info
|
|
|
+ this.deptOptions = list
|
|
|
+ }
|
|
|
+ })
|
|
|
+ hdlx_list_tree()
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ const list = res.data.one_info
|
|
|
+ this.hdlxOptions = list
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ updateDeptId(data) {
|
|
|
+ this.activeDeptName = data.msg.label
|
|
|
+ this.tableParams.dept_id = data.msg.id
|
|
|
+ },
|
|
|
+ // 渲染列表
|
|
|
+ renderTable(data) {
|
|
|
+ user_list(data)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.tableData = res.data.page_data
|
|
|
+ this.total_rows = res.data.total_rows * 1
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ pageChange(page) {
|
|
|
+ this.tableParams.page = page
|
|
|
+ },
|
|
|
+ showDialog(type, data) {
|
|
|
+ let _this = this
|
|
|
+ if (data) {
|
|
|
+ this.activeUserId = data.user_id
|
|
|
+ data.dept_id = data.org_info.dept_id
|
|
|
+ Object.keys(data).forEach(function (key) {
|
|
|
+ if (_this.user_main.hasOwnProperty(key)) {
|
|
|
+ _this.user_main[key] = data[key]
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.dialogType = type
|
|
|
+ this.userDialogVisible = true
|
|
|
+ },
|
|
|
+ showAccessDialog(row) {
|
|
|
+ this.activeUserId = row.user_id
|
|
|
+ this.activeUserName = row.user_name
|
|
|
+ this.accessSwitch = row.org_info.is_master === '1' ? true : false
|
|
|
+ this.accessDialogVisible = true
|
|
|
+ },
|
|
|
+ changeAccess(val) {
|
|
|
+ let data = {}
|
|
|
+ data.user_id = this.activeUserId
|
|
|
+ data.access = {
|
|
|
+ dept_master: val ? 1 : 0
|
|
|
+ }
|
|
|
+ user_set_access(data)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.$message.success(res.msg)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ changeChecked(val) {
|
|
|
+ this.activeTableChecked = val
|
|
|
+ },
|
|
|
+ delUser() {
|
|
|
+ let user_id_list = this.getCheckedUsers()
|
|
|
+ if (user_id_list) {
|
|
|
+ this.$confirm('此操作将永久删除多个用户, 是否继续?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ user_delete({user_id: user_id_list})
|
|
|
+ .then(res => {
|
|
|
+ console.log(res)
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '删除成功!'
|
|
|
+ });
|
|
|
+ this.renderTable(this.tableParams)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消删除'
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSubmit(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ let user_main = this.user_main
|
|
|
+ user_main.dept_id = user_main.dept_id[user_main.dept_id.length - 1]
|
|
|
+ let data = {}
|
|
|
+ data.issubmit = 1
|
|
|
+ data.user_main = user_main
|
|
|
+ if (this.dialogType === 'add') {
|
|
|
+ user_add(data)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.$message({
|
|
|
+ showClose: true,
|
|
|
+ message: res.msg,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.userDialogVisible = false
|
|
|
+ this.renderTable(this.tableParams)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else if (this.dialogType === 'edit') {
|
|
|
+ data.user_id = this.activeUserId
|
|
|
+ user_edit(data)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.$message({
|
|
|
+ showClose: true,
|
|
|
+ message: res.msg,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.userDialogVisible = false
|
|
|
+ this.renderTable(this.tableParams)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onReset(formName) {
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ },
|
|
|
+ resetDialog(formData) {
|
|
|
+ this.user_main = {
|
|
|
+ user_name: '',
|
|
|
+ user_password: '',
|
|
|
+ user_realname: '',
|
|
|
+ dept_id: '',
|
|
|
+ user_level: '',
|
|
|
+ user_phone: '',
|
|
|
+ user_role_id: ''
|
|
|
+ }
|
|
|
+ this.$refs[formData].clearValidate()
|
|
|
+ },
|
|
|
+ // 获取用户多选列表
|
|
|
+ getCheckedUsers() {
|
|
|
+ const checkedDatas = this.activeTableChecked
|
|
|
+ if (checkedDatas.length <= 0) {
|
|
|
+ this.$message.info('请勾选需要操作的用户')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let user_id_list = []
|
|
|
+ checkedDatas.forEach(item => {
|
|
|
+ item.user_id ?
|
|
|
+ user_id_list.push(item.user_id) :
|
|
|
+ null
|
|
|
+ })
|
|
|
+ return user_id_list
|
|
|
+ },
|
|
|
+ // 添加为活动管理
|
|
|
+ hdlxglDialogShow() {
|
|
|
+ let user_id_list = this.getCheckedUsers()
|
|
|
+ if (user_id_list) {
|
|
|
+ this.hdlxxzDialogVisible = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addHdlxAdmin() {
|
|
|
+ const hh_id = this.hdlxCheckedId
|
|
|
+ const data = {
|
|
|
+ hh_id: hh_id[hh_id.length - 1],
|
|
|
+ type: 'add',
|
|
|
+ user_ids: this.getCheckedUsers().toString()
|
|
|
+ }
|
|
|
+ console.log(data)
|
|
|
+ hdlx_members_manage(data)
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === '1') {
|
|
|
+ this.$message.success('添加成功')
|
|
|
+ this.hdlxxzDialogVisible = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ exportAll() {
|
|
|
+ axios.get('https://hdpb.dev.bozedu.net/user/org/index', {
|
|
|
+ params: {
|
|
|
+ api: 'xls',
|
|
|
+ output_way: 2
|
|
|
+ }
|
|
|
+ }).then(res => {
|
|
|
+ if (res.status === 200 && res.data.code === '1') {
|
|
|
+ const data = res.data.data
|
|
|
+ const download_url = data.download_url
|
|
|
+ let tagA = document.createElement('a')
|
|
|
+ tagA.download = download_url
|
|
|
+ tagA.href = download_url
|
|
|
+ tagA.click()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ import_success() {
|
|
|
+ this.$message.success('导入成功')
|
|
|
+ this.renderTable()
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .el-cascader {
|
|
|
+ display: block;
|
|
|
+}
|
|
|
</style>
|