前端有不同的角色，我在后台设置了不同的菜单管理账号，如下图：
不同的账号表格中要展示不同的内容，要显示不同的列。
解决办法是在定义表格前获取url中的group_id参数，根据不同参数定义不同的表格。
代码如下：
javascript
define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {
var Controller = {
index: function () {
// 初始化表格参数配置
Table.api.init({
extend: {
//group_id的值传递给后台接口处理相应逻辑
index_url: 'user/user/index'+location.search,
add_url: 'user/user/add'+location.search,
edit_url: 'user/user/edit'+location.search,
del_url: 'user/user/del'+location.search,
multi_url: 'user/user/multi',
table: 'user',
}
});
var table = $("#table");
// 解析 URL 查询参数 获取group_id的值
var queryParams = new URLSearchParams(location.search);
var groupId = queryParams.get('group_id');
if (groupId == 1) {
// 学员表格
table.bootstrapTable({
url: $.fn.bootstrapTable.defaults.extend.index_url,
pk: 'id',
sortName: 'user.id',
columns: [
[
{checkbox: true},
{field: 'id', title: __('Id'), sortable: true,operate:false},
{field: 'group.name', title: __('Group'),operate:false},
{field: 'username', title: __('Username'), operate: 'LIKE'},
{field: 'nickname', title: __('Nickname'), operate: 'LIKE'},
// {field: 'email', title: __('Email'), operate: 'LIKE'},
{field: 'mobile', title: __('Mobile'), operate: 'LIKE'},
{field: 'avatar', title: __('Avatar'), events: Table.api.events.image, formatter: Table.api.formatter.image, operate: false},
// {field: 'level', title: __('Level'), operate: 'BETWEEN', sortable: true},
// {field: 'gender', title: __('Gender'), visible: false, searchList: {1: __('Male'), 0: __('Female')}},
// {field: 'score', title: __('Score'), operate: 'BETWEEN', sortable: true},
// {field: 'successions', title: __('Successions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'maxsuccessions', title: __('Maxsuccessions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'logintime', title: __('Logintime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'loginip', title: __('Loginip'), formatter: Table.api.formatter.search},
{field: 'createtime', title: __('Createtime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'joinip', title: __('Joinip'), formatter: Table.api.formatter.search},
{field: 'status', title: __('Status'), formatter: Table.api.formatter.status, searchList: {normal: __('Normal'), hidden: __('Hidden')}},
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
]
]
});
} else if (groupId == 2) {
// 家长表格
table.bootstrapTable({
url: $.fn.bootstrapTable.defaults.extend.index_url,
pk: 'id',
sortName: 'user.id',
columns: [
[
{checkbox: true},
{field: 'id', title: __('Id'), sortable: true,operate:false},
{field: 'group.name', title: __('Group'),operate:false},
{field: 'username', title: __('Username'), operate: 'LIKE'},
{field: 'nickname', title: __('Nickname'), operate: 'LIKE'},
// {field: 'email', title: __('Email'), operate: 'LIKE'},
{field: 'mobile', title: __('Mobile'), operate: 'LIKE'},
{field: 'avatar', title: __('Avatar'), events: Table.api.events.image, formatter: Table.api.formatter.image, operate: false},
// {field: 'level', title: __('Level'), operate: 'BETWEEN', sortable: true},
// {field: 'gender', title: __('Gender'), visible: false, searchList: {1: __('Male'), 0: __('Female')}},
// {field: 'score', title: __('Score'), operate: 'BETWEEN', sortable: true},
// {field: 'successions', title: __('Successions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'maxsuccessions', title: __('Maxsuccessions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'logintime', title: __('Logintime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'loginip', title: __('Loginip'), formatter: Table.api.formatter.search},
{field: 'createtime', title: __('Createtime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'joinip', title: __('Joinip'), formatter: Table.api.formatter.search},
{field: 'status', title: __('Status'), formatter: Table.api.formatter.status, searchList: {normal: __('Normal'), hidden: __('Hidden')}},
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
]
]
});
} else if (groupId == 3) {
// 经销商表格
table.bootstrapTable({
url: $.fn.bootstrapTable.defaults.extend.index_url,
pk: 'id',
sortName: 'user.id',
columns: [
[
{checkbox: true},
{field: 'id', title: __('Id'), sortable: true,operate:false},
{field: 'group.name', title: __('Group'),operate:false},
{field: 'username', title: __('Username'), operate: 'LIKE'},
{field: 'nickname', title: __('Nickname'), operate: 'LIKE'},
// {field: 'email', title: __('Email'), operate: 'LIKE'},
{field: 'mobile', title: __('Mobile'), operate: 'LIKE'},
{field: 'avatar', title: __('Avatar'), events: Table.api.events.image, formatter: Table.api.formatter.image, operate: false},
// {field: 'level', title: __('Level'), operate: 'BETWEEN', sortable: true},
// {field: 'gender', title: __('Gender'), visible: false, searchList: {1: __('Male'), 0: __('Female')}},
// {field: 'score', title: __('Score'), operate: 'BETWEEN', sortable: true},
// {field: 'successions', title: __('Successions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'maxsuccessions', title: __('Maxsuccessions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'logintime', title: __('Logintime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'loginip', title: __('Loginip'), formatter: Table.api.formatter.search},
{field: 'createtime', title: __('Createtime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'joinip', title: __('Joinip'), formatter: Table.api.formatter.search},
{field: 'status', title: __('Status'), formatter: Table.api.formatter.status, searchList: {normal: __('Normal'), hidden: __('Hidden')}},
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
]
]
});
}else{
// 体验账号表格
table.bootstrapTable({
url: $.fn.bootstrapTable.defaults.extend.index_url,
pk: 'id',
sortName: 'user.id',
columns: [
[
{checkbox: true},
{field: 'id', title: __('Id'), sortable: true,operate:false},
{field: 'group.name', title: __('Group'),operate:false},
{field: 'username', title: __('Username'), operate: 'LIKE'},
{field: 'nickname', title: __('Nickname'), operate: 'LIKE'},
// {field: 'email', title: __('Email'), operate: 'LIKE'},
{field: 'mobile', title: __('Mobile'), operate: 'LIKE'},
{field: 'avatar', title: __('Avatar'), events: Table.api.events.image, formatter: Table.api.formatter.image, operate: false},
// {field: 'level', title: __('Level'), operate: 'BETWEEN', sortable: true},
// {field: 'gender', title: __('Gender'), visible: false, searchList: {1: __('Male'), 0: __('Female')}},
// {field: 'score', title: __('Score'), operate: 'BETWEEN', sortable: true},
// {field: 'successions', title: __('Successions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'maxsuccessions', title: __('Maxsuccessions'), visible: false, operate: 'BETWEEN', sortable: true},
// {field: 'logintime', title: __('Logintime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'loginip', title: __('Loginip'), formatter: Table.api.formatter.search},
{field: 'createtime', title: __('Createtime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true},
// {field: 'joinip', title: __('Joinip'), formatter: Table.api.formatter.search},
{field: 'status', title: __('Status'), formatter: Table.api.formatter.status, searchList: {normal: __('Normal'), hidden: __('Hidden')}},
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
]
]
});
}
// 为表格绑定事件
Table.api.bindevent(table);
},
add: function () {
Controller.api.bindevent();
},
edit: function () {
Controller.api.bindevent();
},
api: {
bindevent: function () {
Form.api.bindevent($("form[role=form]"));
}
}
};
return Controller;
});