|
|
@@ -232,45 +232,54 @@
|
|
|
</el-dialog>
|
|
|
<!-- 内容区域 -->
|
|
|
<div class="content">
|
|
|
- <!-- 合并后的表格 -->
|
|
|
- <el-table :data="combinedData" border style="width: 100%;" stripe :header-cell-style="headerCellStyle">
|
|
|
- <el-table-column show-overflow-tooltip prop="company_name" label="组织名称" min-width="32" header-align="center" align="center" />
|
|
|
- <el-table-column show-overflow-tooltip prop="company_number" label="学校名称" min-width="32" header-align="center" align="center" />
|
|
|
- <el-table-column show-overflow-tooltip prop="name" label="姓名" min-width="32" header-align="center" align="center" />
|
|
|
- <el-table-column show-overflow-tooltip prop="account" label="账户" min-width="32" header-align="center" align="center" />
|
|
|
- <el-table-column show-overflow-tooltip prop="status" label="状态" min-width="32" header-align="center" align="center" />
|
|
|
- <el-table-column show-overflow-tooltip label="身份" min-width="32" header-align="center" align="center" >
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <div>{{ roleType(row) }}</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column show-overflow-toolti label="操作" min-width="35" header-align="center" align="center">
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <el-button link type="text" size="small" @click="ajax__open_stop(row.userid)">{{ row.status === '启用中' ? '停用' : '启用' }}</el-button>
|
|
|
- <el-button link type="text" size="small" @click="run(row.userid)">移动</el-button>
|
|
|
-
|
|
|
- <!-- 管理员操作按钮，只有当 row.type === 1 时才显示 -->
|
|
|
- <el-button
|
|
|
- v-if="row.type === 1"
|
|
|
- link
|
|
|
- type="text"
|
|
|
- size="small"
|
|
|
- @click="ajax_admin(row.userid, row.role, row.type)"
|
|
|
- >
|
|
|
- {{ row.role === 1 ? '已设置管理员' : '设置管理员' }}
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <!-- 分页区域 -->
|
|
|
- <div class="Pagetion" v-if="up_page">
|
|
|
- <el-pagination
|
|
|
- :current-page="currentPage"
|
|
|
- :page-size="pageSize"
|
|
|
- :total="combinedData.length"
|
|
|
- layout="total, prev, pager, next, jumper"
|
|
|
- @current-change="handlePageChange">
|
|
|
- </el-pagination>
|
|
|
+ <!-- 按钮区域 -->
|
|
|
+ <div class="button_top">
|
|
|
+ <!-- "启用中"按钮 -->
|
|
|
+ <a @click="showType(1)" :style="{ color: type == 1 ? 'black' : 'rgb(179, 179, 179)' }">启用中({{ tableData_start }})</a>
|
|
|
+ <!-- "已停用"按钮 -->
|
|
|
+ <a @click="showType(0)" :style="{ color: type == 0 ? 'black' : 'rgb(179, 179, 179)' }">已停用({{ tableData_stop }})</a>
|
|
|
+ </div>
|
|
|
+ <!-- 启用中区域 -->
|
|
|
+ <div>
|
|
|
+ <el-table :data="tableData" border style="width: 100%;" stripe :header-cell-style="headerCellStyle" v-loading="tableLoading">
|
|
|
+ <el-table-column show-overflow-tooltip prop="company_name" label="组织名称" min-width="32" header-align="center" align="center" />
|
|
|
+ <el-table-column show-overflow-tooltip prop="company_number" label="学校名称" min-width="32" header-align="center" align="center" />
|
|
|
+ <el-table-column show-overflow-tooltip prop="name" label="姓名" min-width="32" header-align="center" align="center" />
|
|
|
+ <el-table-column show-overflow-tooltip prop="account" label="账户" min-width="32" header-align="center" align="center" />
|
|
|
+ <el-table-column show-overflow-tooltip label="身份" min-width="32" header-align="center" align="center" >
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <div>{{ roleType(row) }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column show-overflow-toolti label="操作" min-width="35" header-align="center" align="center">
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <el-button link type="text" size="small" @click="ajax__open_stop(row)" v-if="row.state == 1">停用</el-button>
|
|
|
+ <el-button link type="text" size="small" @click="run(row.userid)" v-if="row.state == 1">移动</el-button>
|
|
|
+ <el-button link type="text" size="small" @click="ajax__open_stop(row)" v-if="row.state == 0">启用</el-button>
|
|
|
+
|
|
|
+ <!-- 管理员操作按钮，只有当 row.type === 1 时才显示 -->
|
|
|
+ <el-button
|
|
|
+ v-if="row.type === 1 && row.state == 1"
|
|
|
+ link
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ @click="ajax_admin(row.userid, row.role, row.type)"
|
|
|
+ >
|
|
|
+ {{ row.role === 1 ? '已设置管理员' : '设置管理员' }}
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!-- 分页区域 -->
|
|
|
+ <div class="Pagetion" v-if="total">
|
|
|
+ <el-pagination
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-size="pageSize"
|
|
|
+ :total="total"
|
|
|
+ layout="total, prev, pager, next, jumper"
|
|
|
+ @current-change="handlePageChange">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -278,6 +287,9 @@
|
|
|
|
|
|
<script>
|
|
|
import { API_CONFIG } from '@/common/apiConfig';
|
|
|
+import { addOp } from '@/api/user';
|
|
|
+import { mapGetters } from 'vuex';
|
|
|
+
|
|
|
export default {
|
|
|
name: 'HelloWorld',
|
|
|
components: {
|
|
|
@@ -331,7 +343,8 @@ export default {
|
|
|
// 启用数组
|
|
|
tableData: [],
|
|
|
// 停用数组
|
|
|
- tableData_stop: [],
|
|
|
+ tableData_start: '',
|
|
|
+ tableData_stop: '',
|
|
|
// 添加账户初始化
|
|
|
form: {
|
|
|
name: '',
|
|
|
@@ -355,26 +368,13 @@ export default {
|
|
|
// 用来存储传递的参数
|
|
|
ajaxParams: null,
|
|
|
check_user_id: "", // 存放当前选择的用户的ID
|
|
|
+ type: 1,
|
|
|
+ total: 0,
|
|
|
+ tableLoading: false
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
|
- // 计算当前页显示的数据
|
|
|
- paginatedData() {
|
|
|
- const start = (this.currentPage - 1) * this.pageSize;
|
|
|
- const end = this.currentPage * this.pageSize;
|
|
|
- return this.tableData.slice(start, end); // 获取当前页的数据
|
|
|
- },
|
|
|
- down_paginatedData() {
|
|
|
- const start = (this.down_currentPage - 1) * this.down_pageSize;
|
|
|
- const end = this.down_currentPage * this.down_pageSize;
|
|
|
- return this.tableData_stop.slice(start, end); // 获取当前页的数据
|
|
|
- },
|
|
|
- combinedData() {
|
|
|
- return [...this.tableData, ...this.tableData_stop].map(item => ({
|
|
|
- ...item,
|
|
|
- status: this.tableData.includes(item) ? '启用中' : '已停用'
|
|
|
- }));
|
|
|
- },
|
|
|
+ ...mapGetters(['userid']),
|
|
|
roleType(){
|
|
|
return function(row){
|
|
|
if(row.type == 2){
|
|
|
@@ -391,18 +391,6 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
- // 监视 currentPage 的变化
|
|
|
- currentPage(newPage, oldPage) {
|
|
|
- if (newPage !== oldPage) {
|
|
|
- this.ajax_user_open(newPage); // 页码变化时触发 ajax_user_open
|
|
|
- }
|
|
|
- },
|
|
|
- // 监视 down_currentPage 的变化
|
|
|
- down_currentPage(newPage, oldPage) {
|
|
|
- if (newPage !== oldPage) {
|
|
|
- this.ajax_user_stop(newPage); // 页码变化时触发 ajax_user_stop
|
|
|
- }
|
|
|
- },
|
|
|
},
|
|
|
methods: {
|
|
|
// 移动按钮，将isOrgFormVisible区域显示
|
|
|
@@ -432,51 +420,15 @@ export default {
|
|
|
close_add_school(){
|
|
|
this.add_school_dialog = false;
|
|
|
},
|
|
|
- // 启用中
|
|
|
- showopen() {
|
|
|
- this.open_content = true;
|
|
|
- this.add_button = true;
|
|
|
- this.stop_content = false;
|
|
|
- this.open = true; // 启用中按钮颜色变为黑色
|
|
|
- this.stop = false; // 已停用按钮颜色变为灰色
|
|
|
- this.up_page = true;
|
|
|
- this.down_page = false;
|
|
|
- },
|
|
|
- // 已停用
|
|
|
- showstop() {
|
|
|
- this.open_content = false;
|
|
|
- this.add_button = false;
|
|
|
- this.stop_content = true;
|
|
|
- this.open = false; // 启用中按钮颜色变为灰色
|
|
|
- this.stop = true; // 已停用按钮颜色变为黑色
|
|
|
- this.up_page = false;
|
|
|
- this.down_page = true;
|
|
|
+ showType(type){
|
|
|
+ this.type = type;
|
|
|
+ this.currentPage = 1;
|
|
|
+ this.ajax_user_open()
|
|
|
},
|
|
|
// 页码扩展按钮
|
|
|
handlePageChange(page) {
|
|
|
this.currentPage = page;
|
|
|
- },
|
|
|
- // 停用区域 页码扩展按钮
|
|
|
- down_handlePageChange(page) {
|
|
|
- this.down_currentPage = page;
|
|
|
- },
|
|
|
- //移动按钮中中国大陆区域
|
|
|
- cn_orgization(){
|
|
|
- this.cn_org = true;
|
|
|
- this.hk_org = false;
|
|
|
- this.com_org = false;
|
|
|
- },
|
|
|
- //移动按钮中香港区域
|
|
|
- hk_orgization(){
|
|
|
- this.cn_org = false;
|
|
|
- this.hk_org = true;
|
|
|
- this.com_org = false;
|
|
|
- },
|
|
|
- //移动按钮中外国区域
|
|
|
- com_orgization(){
|
|
|
- this.cn_org = false;
|
|
|
- this.hk_org = false;
|
|
|
- this.com_org = true;
|
|
|
+ this.ajax_user_open()
|
|
|
},
|
|
|
// 表头的背景色
|
|
|
headerCellStyle() {
|
|
|
@@ -485,14 +437,16 @@ export default {
|
|
|
// 已启用
|
|
|
ajax_user_open() {
|
|
|
// 确认后发起请求
|
|
|
+ this.tableLoading = true
|
|
|
let params = [
|
|
|
{
|
|
|
functionName: API_CONFIG.ajaxstart.functionName, // 使用配置中的存储过程名称
|
|
|
- r_type: 1,
|
|
|
+ r_type: this.type,
|
|
|
page: this.currentPage, // 使用当前页码
|
|
|
num: this.pageSize, // 每页条目数
|
|
|
},
|
|
|
];
|
|
|
+ this.tableData = []
|
|
|
this.$ajax.post(API_CONFIG.baseUrl, params)
|
|
|
.then((res) => {
|
|
|
// 假设 res.data[0] 是返回的用户数据数组
|
|
|
@@ -504,70 +458,33 @@ export default {
|
|
|
userid: user.user_id,
|
|
|
role: user.admin_role || 0, // 角色，假设 1 为管理员，0 为普通用户
|
|
|
school: user.s_id,
|
|
|
- type:user.usertype
|
|
|
- }));
|
|
|
-
|
|
|
- // 只在当前页填充数据，其他页为空
|
|
|
- this.tableData = Array(this.pageSize * (this.currentPage - 1)).fill(null).concat(users);
|
|
|
- //读取返回数组的第一条数据的总条数来当作table.data数组的长度
|
|
|
- const totalCount = res.data[0][0].total_count;
|
|
|
- this.tableData.length=totalCount;
|
|
|
- // 打印映射后的用户信息
|
|
|
- // console.log("启用的用户信息:", res.data);
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- // 处理失败的响应
|
|
|
- this.$message.error("查询失败");
|
|
|
- console.error("请求失败，错误信息：", err); // 打印更详细的错误信息
|
|
|
- });
|
|
|
- },
|
|
|
- //停用
|
|
|
- ajax_user_stop() {
|
|
|
- // 确认后发起请求
|
|
|
- let params = [
|
|
|
- {
|
|
|
- functionName: API_CONFIG.ajaxstart.functionName, // 使用配置中的存储过程名称
|
|
|
- r_type: 0,
|
|
|
- page: this.down_currentPage, // 使用当前页码
|
|
|
- num: this.down_pageSize, // 每页条目数
|
|
|
- },
|
|
|
- ];
|
|
|
- this.$ajax.post(API_CONFIG.baseUrl, params)
|
|
|
- .then((res) => {
|
|
|
- // 假设 res.data[0] 是返回的用户数据数组
|
|
|
- const users = res.data[0].map(user => ({
|
|
|
- company_name: user.org_name || '暂无', // 组织名称
|
|
|
- company_number: user.school_name || '暂无', // 学校名称
|
|
|
- name: user.user_name || '暂无', // 姓名
|
|
|
- account: user.account_name || '暂无', // 账户
|
|
|
- userid: user.user_id,
|
|
|
+ type:user.usertype,
|
|
|
+ state: user.user_state
|
|
|
}));
|
|
|
|
|
|
- // 只在当前页填充数据，其他页为空
|
|
|
- this.tableData_stop = Array(this.down_pageSize * (this.down_currentPage - 1)).fill(null).concat(users);
|
|
|
- //读取返回数组的第一条数据的总条数来当作table.data数组的长度
|
|
|
- const totalCount = res.data[0][0].total_count;
|
|
|
- this.tableData_stop.length = totalCount;
|
|
|
-
|
|
|
- // 打印映射后的用户信息
|
|
|
- // console.log("停用的用户信息:", res.data);
|
|
|
+ // this.tableData = Array(this.pageSize * (this.currentPage - 1)).fill(null).concat(users);
|
|
|
+ this.tableData = users;
|
|
|
+ this.total=res.data[0][0].total_count;
|
|
|
+ this.tableData_stop = res.data[2][0].num
|
|
|
+ this.tableData_start = res.data[1][0].num
|
|
|
+ this.tableLoading = false
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
// 处理失败的响应
|
|
|
- this.$message.error("查询失败");
|
|
|
+ this.tableLoading = false
|
|
|
+ // this.$message.error("查询失败");
|
|
|
console.error("请求失败，错误信息：", err); // 打印更详细的错误信息
|
|
|
});
|
|
|
},
|
|
|
// 停用或者启用
|
|
|
- ajax__open_stop(userid) {
|
|
|
- const isOpenArea = this.open_content; // 判断是否在启用区域
|
|
|
- const actionMessage = isOpenArea ? '停用该条数据' : '启用该条数据';
|
|
|
- const successMessage = isOpenArea ? '停用成功!' : '启用成功!';
|
|
|
- const cancelMessage = isOpenArea ? '已取消停用' : '已取消启用';
|
|
|
+ ajax__open_stop(row) {
|
|
|
+ const actionMessage = row.state == 1 ? '停用该用户' : '启用该用户';
|
|
|
+ const successMessage = row.state == 1 ? '停用成功!' : '启用成功!';
|
|
|
+ const cancelMessage = row.state == 1 ? '已取消停用' : '已取消启用';
|
|
|
let params = [
|
|
|
{
|
|
|
functionName: API_CONFIG.userstate.functionName, // 调用存储过程的名称
|
|
|
- u_id: userid, // 将传入的userid设置为 u_id
|
|
|
+ u_id: row.userid, // 将传入的userid设置为 u_id
|
|
|
},
|
|
|
];
|
|
|
// 弹窗提示确认
|
|
|
@@ -578,15 +495,20 @@ export default {
|
|
|
}).then(() => {
|
|
|
// 在用户点击确定后，发起 AJAX 请求
|
|
|
this.$ajax.post(API_CONFIG.baseUrl, params)
|
|
|
- .then(() => {
|
|
|
+ .then(async () => {
|
|
|
// 提示操作成功
|
|
|
this.$message({
|
|
|
type: 'success',
|
|
|
message: successMessage
|
|
|
});
|
|
|
- // 调用停用和启用用户的函数
|
|
|
- this.ajax_user_stop();
|
|
|
+
|
|
|
this.ajax_user_open();
|
|
|
+ await addOp({
|
|
|
+ uid: this.userid,
|
|
|
+ cid: '',
|
|
|
+ type: 'user_op',
|
|
|
+ content: `${row.state == 1 ? '停用' : '启用'}了${row.userid}`
|
|
|
+ })
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
// 处理失败的响应
|
|
|
@@ -623,21 +545,8 @@ export default {
|
|
|
];
|
|
|
|
|
|
this.$ajax.post(API_CONFIG.baseUrl, params)
|
|
|
- .then((res) => {
|
|
|
- // 假设返回的数据格式正确，直接执行
|
|
|
- this.tableData = res.data[0].map(user => {
|
|
|
- return {
|
|
|
- company_name: user.name || '暂无',
|
|
|
- company_number: user.id || '暂无',
|
|
|
- name: user.username || '暂无',
|
|
|
- account: user.account || '暂无',
|
|
|
- role: user.role,
|
|
|
- userid: user.userid,
|
|
|
- };
|
|
|
- });
|
|
|
- // console.log("返回的数据为：",res.data);
|
|
|
+ .then(() => {
|
|
|
// 只有在成功执行时调用这两个函数
|
|
|
- this.ajax_user_stop();
|
|
|
this.ajax_user_open();
|
|
|
// 如果更新成功，显示成功提示并调用 ajax_user_stop 和 ajax_user_open
|
|
|
this.$message({
|
|
|
@@ -939,7 +848,7 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.ajax_user_stop(); // 如果是在启用区域，停用
|
|
|
+ // this.ajax_user_stop(); // 如果是在启用区域，停用
|
|
|
this.ajax_user_open(); // 如果是在停用区域，启用
|
|
|
this.ajax_org(); // 组件创建时，立即调用 ajax_org 获取数据
|
|
|
this.ajax_school(); // 组件创建时，立即调用 ajax_org 获取数据
|
