On this page
管理员列表
控制器:app/controller/admin/manager.js
js
async index() {
const { ctx, app } = this;
let data = await ctx.page('Manager')
await ctx.renderTemplate({
title: "管理员管理",
tempType: "table",
table: {
// 按钮
buttons: {
add: "/admin/manager/create"
},
// 表头
columns: [{
title: '管理员',
fixed: 'left',
key: "username"
}, {
title: '时间',
key: 'created_time',
width: 180,
fixed: 'center'
}, {
title: "操作",
width: 200,
fixed: 'center',
action:{
edit:function(id){
return `/admin/manager/edit/${id}`
},
delete:function(id){
return `/admin/manager/delete/${id}`
},
}
}],
data
}
})
}
扩展:app/extend/context.js
js
// 分页
async page(modelName, where, options = {}) {
let page = this.query.page ? parseInt(this.query.page) : 1;
let limit = this.query.limit ? parseInt(this.query.limit) : 10;
let offset = (page - 1) * limit;
if (!options.order) {
options.order = [
['id', 'DESC']
];
}
let res = await this.app.model[modelName].findAndCountAll({
where,
offset,
limit,
...options
});
// 总共有多少页
let totalPage = Math.ceil(res.count / limit)
// 其他参数
let query = { ...this.query }
if (query.hasOwnProperty('page')) {
delete query.page
}
if (query.hasOwnProperty('limit')) {
delete query.limit
}
// 对象转&拼接字符串
const urlEncode = (param, key, encode)=>{
if (param==null) return '';
var paramStr = '';
var t = typeof (param);
if (t == 'string' || t == 'number' || t == 'boolean') {
paramStr += '&' + key + '=' + ((encode==null||encode) ? encodeURIComponent(param) : param);
} else {
for (var i in param) {
var k = key == null ? i : key + (param instanceof Array ? '[' + i + ']' : '.' + i)
paramStr += urlEncode(param[i], k, encode)
}
}
return paramStr;
}
query = urlEncode(query)
let pageEl = ''
for (let index = 1; index <= totalPage; index++) {
// 当前页码
let active = ''
if(index === page){
active = 'active'
}
pageEl += `<li class="page-item ${active}"><a class="page-link" href="?page=${index}&limit=${limit}${query}">${index}</a></li>`
}
const preDisabled = page <= 1 ? 'disabled' : ''
const nextDisabled = page >= totalPage ? 'disabled' : ''
let pageRender = `
<ul class="pagination">
<li class="page-item ${preDisabled}">
<a class="page-link" href="?page=${page - 1}&limit=${limit}${query}" aria-label="Previous">
<span aria-hidden="true">«</span>
<span class="sr-only">Previous</span>
</a>
</li>
${pageEl}
<li class="page-item ${nextDisabled}">
<a class="page-link" href="?page=${page + 1}&limit=${limit}${query}" aria-label="Next">
<span aria-hidden="true">»</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
`;
this.locals.pageRender = pageRender
return res.rows
},
路由:app/router.js
js
router.get("/admin/manager", controller.admin.manager.index);