mirror of
https://github.com/QingdaoU/OnlineJudge.git
synced 2024-09-21 16:33:22 +00:00
重构编辑用户界面和 js
This commit is contained in:
parent
c0b48c219f
commit
e8ffa09ec4
@ -1,133 +1,106 @@
|
||||
require(["jquery", "avalon", "csrfToken", "bsAlert", "validator"], function ($, avalon, csrfTokenHeader, bsAlert) {
|
||||
require(["jquery", "avalon", "csrfToken", "bsAlert", "pager", "validator"],
|
||||
function ($, avalon, csrfTokenHeader, bsAlert) {
|
||||
avalon.ready(function () {
|
||||
if (avalon.vmodels.userList) {
|
||||
var vm = avalon.vmodels.userList;
|
||||
}
|
||||
else {
|
||||
var vm = avalon.define({
|
||||
$id: "userList",
|
||||
|
||||
userList: [],
|
||||
userType: ["一般用户", "管理员", "超级管理员"],
|
||||
|
||||
// avalon:定义模式 userList
|
||||
avalon.ready(function () {
|
||||
keyword: "",
|
||||
showAdminOnly: false,
|
||||
isEditing: false,
|
||||
|
||||
if (avalon.vmodels.userList) {
|
||||
var vm = avalon.vmodels.userList;
|
||||
// initialize avalon object
|
||||
userList = []; //previousPage= 0; nextPage= 0; page = 1;
|
||||
//editingUserId= 0; totalPage = 1; keyword= ""; showAdminOnly= false;
|
||||
//user editor fields
|
||||
username= ""; realName= ""; email= ""; adminType= 0; id= 0;
|
||||
}
|
||||
else {
|
||||
var vm = avalon.define({
|
||||
$id: "userList",
|
||||
//通用变量
|
||||
userList: [],
|
||||
previousPage: 0,
|
||||
nextPage: 0,
|
||||
page: 1,
|
||||
editingUserId: 0,
|
||||
totalPage: 1,
|
||||
userType: ["一般用户", "管理员", "超级管理员"],
|
||||
keyword: "",
|
||||
showAdminOnly: false,
|
||||
//编辑区域同步变量
|
||||
username: "",
|
||||
realName: "",
|
||||
email: "",
|
||||
adminType: 0,
|
||||
id: 0,
|
||||
getNext: function () {
|
||||
if (!vm.nextPage)
|
||||
return;
|
||||
getPageData(vm.page + 1);
|
||||
},
|
||||
getPrevious: function () {
|
||||
if (!vm.previousPage)
|
||||
return;
|
||||
getPageData(vm.page - 1);
|
||||
},
|
||||
getBtnClass: function (btn) { //上一页/下一页按钮启用禁用逻辑
|
||||
if (btn == "next") {
|
||||
return vm.nextPage ? "btn btn-primary" : "btn btn-primary disabled";
|
||||
username: "",
|
||||
realName: "",
|
||||
email: "",
|
||||
adminType: 0,
|
||||
userId: -1,
|
||||
|
||||
pager: {
|
||||
getPage: function (page) {
|
||||
getPage(page);
|
||||
}
|
||||
},
|
||||
editUser: function (user) {
|
||||
vm.username = user.username;
|
||||
vm.realName = user.real_name;
|
||||
vm.adminType = user.admin_type;
|
||||
vm.email = user.email;
|
||||
vm.userId = user.id;
|
||||
|
||||
vm.isEditing = true;
|
||||
},
|
||||
search: function () {
|
||||
getPage(1);
|
||||
avalon.vmodels.userPager.currentPage = 1;
|
||||
}
|
||||
else {
|
||||
return vm.previousPage ? "btn btn-primary" : "btn btn-primary disabled";
|
||||
}
|
||||
},
|
||||
editUser: function (user) { //点击编辑按钮的事件,显示/隐藏编辑区
|
||||
vm.username = user.username;
|
||||
vm.realName = user.real_name;
|
||||
vm.adminType = user.admin_type;
|
||||
vm.email = user.email;
|
||||
vm.id = user.id;
|
||||
if (vm.editingUserId == user.id)
|
||||
vm.editingUserId = 0;
|
||||
else
|
||||
vm.editingUserId = user.id;
|
||||
},
|
||||
search: function () {
|
||||
getPageData(1);
|
||||
}
|
||||
});
|
||||
}
|
||||
vm.$watch("showAdminOnly", function () {
|
||||
getPage(1);
|
||||
avalon.vmodels.userPager.currentPage = 1;
|
||||
});
|
||||
}
|
||||
vm.$watch("showAdminOnly", function () {
|
||||
getPageData(1);
|
||||
|
||||
function getPage(page) {
|
||||
var url = "/api/admin/user/?paging=true&page=" + page + "&page_size=10";
|
||||
if (vm.showAdminOnly == true)
|
||||
url += "&admin_type=1";
|
||||
if (vm.keyword != "")
|
||||
url += "&keyword=" + vm.keyword;
|
||||
$.ajax({
|
||||
beforeSend: csrfTokenHeader,
|
||||
url: url,
|
||||
dataType: "json",
|
||||
method: "get",
|
||||
success: function (data) {
|
||||
if (!data.code) {
|
||||
vm.userList = data.data.results;
|
||||
avalon.vmodels.userPager.totalPage = data.data.total_page;
|
||||
}
|
||||
else {
|
||||
bsAlert(data.data);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$("#edit-user-form").validator()
|
||||
.on('submit', function (e) {
|
||||
if (!e.isDefaultPrevented()) {
|
||||
var data = {
|
||||
username: vm.username,
|
||||
real_name: vm.realName,
|
||||
email: vm.email,
|
||||
id: vm.userId,
|
||||
admin_type: vm.adminType
|
||||
};
|
||||
if ($("#password").val() !== "")
|
||||
data.password = $("#password").val();
|
||||
$.ajax({
|
||||
url: "/api/admin/user/",
|
||||
data: data,
|
||||
dataType: "json",
|
||||
method: "put",
|
||||
success: function (data) {
|
||||
if (!data.code) {
|
||||
bsAlert("编辑成功!");
|
||||
getPage(1);
|
||||
$("#password").val("");
|
||||
vm.isEditing = false;
|
||||
} else {
|
||||
bsAlert(data.data);
|
||||
}
|
||||
}
|
||||
});
|
||||
return false;
|
||||
}
|
||||
});
|
||||
});
|
||||
avalon.scan();
|
||||
getPageData(1); //用户列表初始化
|
||||
//Ajax get数据
|
||||
function getPageData(page) {
|
||||
var url = "/api/admin/user/?paging=true&page=" + page + "&page_size=10";
|
||||
if (vm.showAdminOnly == true)
|
||||
url += "&admin_type=1";
|
||||
if (vm.keyword != "")
|
||||
url += "&keyword=" + vm.keyword;
|
||||
$.ajax({
|
||||
beforeSend: csrfTokenHeader,
|
||||
url: url,
|
||||
dataType: "json",
|
||||
method: "get",
|
||||
success: function (data) {
|
||||
if (!data.code) {
|
||||
vm.userList = data.data.results;
|
||||
vm.totalPage = data.data.total_page;
|
||||
vm.previousPage = data.data.previous_page;
|
||||
vm.nextPage = data.data.next_page;
|
||||
vm.page = page;
|
||||
}
|
||||
else {
|
||||
bsAlert(data.data);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$("#edit_user-form").validator()
|
||||
.on('submit', function (e) {
|
||||
if (!e.isDefaultPrevented()) {
|
||||
var data = {
|
||||
username: vm.username,
|
||||
real_name: vm.realName,
|
||||
email: vm.email,
|
||||
id: vm.id,
|
||||
admin_type: vm.adminType
|
||||
};
|
||||
if ($("#password").val() !== "")
|
||||
data.password = $("#password").val();
|
||||
$.ajax({
|
||||
beforeSend: csrfTokenHeader,
|
||||
url: "/api/admin/user/",
|
||||
data: data,
|
||||
dataType: "json",
|
||||
method: "put",
|
||||
success: function (data) {
|
||||
if (!data.code) {
|
||||
bsAlert("编辑成功!");
|
||||
getPageData(1);
|
||||
$("#password").val("");
|
||||
} else {
|
||||
bsAlert(data.data);
|
||||
}
|
||||
}
|
||||
});
|
||||
return false;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
})
|
||||
});
|
@ -16,7 +16,6 @@
|
||||
<th>ID</th>
|
||||
<th>用户名</th>
|
||||
<th>注册时间</th>
|
||||
<th>最近登陆</th>
|
||||
<th>真实姓名</th>
|
||||
<th>电子邮箱</th>
|
||||
<th>用户类型</th>
|
||||
@ -26,7 +25,6 @@
|
||||
<td>{{ el.id }}</td>
|
||||
<td>{{ el.username }}</td>
|
||||
<td>{{ el.create_time|date("yyyy-MM-dd HH:mm:ss")}}</td>
|
||||
<td>{{ el.last_login|date("yyyy-MM-dd HH:mm:ss")}}</td>
|
||||
<td>{{ el.real_name }}</td>
|
||||
<td>{{ el.email }}</td>
|
||||
<td>{{ userType[el.admin_type]}}</td>
|
||||
@ -39,17 +37,15 @@
|
||||
<label>仅显示管理员 <input ms-duplex-checked="showAdminOnly" type="checkbox"/></label>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
页数:{{ page }}/{{ totalPage }}
|
||||
<button ms-attr-class="getBtnClass('pre')" ms-click="getPrevious">上一页</button>
|
||||
<button ms-attr-class="getBtnClass('next')" ms-click="getNext">下一页</button>
|
||||
<ms:pager $id="userPager" config="pager"></ms:pager>
|
||||
</div>
|
||||
<div ms-visible="editingUserId">
|
||||
<div ms-visible="isEditing">
|
||||
<h3>修改用户信息</h3>
|
||||
|
||||
<form id="edit_user-form">
|
||||
<form id="edit-user-form">
|
||||
<div class="row">
|
||||
<div class="form-group col-md-4"><label>ID</label>
|
||||
<input name="id" type="number" class="form-control" readonly ms-duplex="id">
|
||||
<input name="id" type="number" class="form-control" readonly ms-duplex="userId">
|
||||
</div>
|
||||
<div class="form-group col-md-4"><label>用户名</label>
|
||||
<input name="username" type="text" class="form-control" ms-duplex="username"
|
||||
@ -64,7 +60,7 @@
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="form-group col-md-4"><label>新密码(留空则保留原密码)</label>
|
||||
<input name="password" type="password" class="form-control" id="password"
|
||||
<input name="password" type="password" class="form-control" id="password" autocomplete="off"
|
||||
placeholder="此项留空则保留原密码" data-minlength="6" data-minlength-error="密码不得少于6位">
|
||||
<div class="help-block with-errors"></div>
|
||||
</div>
|
||||
@ -80,7 +76,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button type="submit" class="btn btn-primary">提交</button>
|
||||
<button type="submit" class="btn btn-success">保存修改</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user