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
|
keyword: "",
|
||||||
avalon.ready(function () {
|
showAdminOnly: false,
|
||||||
|
isEditing: false,
|
||||||
|
|
||||||
if (avalon.vmodels.userList) {
|
username: "",
|
||||||
var vm = avalon.vmodels.userList;
|
realName: "",
|
||||||
// initialize avalon object
|
email: "",
|
||||||
userList = []; //previousPage= 0; nextPage= 0; page = 1;
|
adminType: 0,
|
||||||
//editingUserId= 0; totalPage = 1; keyword= ""; showAdminOnly= false;
|
userId: -1,
|
||||||
//user editor fields
|
|
||||||
username= ""; realName= ""; email= ""; adminType= 0; id= 0;
|
pager: {
|
||||||
}
|
getPage: function (page) {
|
||||||
else {
|
getPage(page);
|
||||||
var vm = avalon.define({
|
}
|
||||||
$id: "userList",
|
},
|
||||||
//通用变量
|
editUser: function (user) {
|
||||||
userList: [],
|
vm.username = user.username;
|
||||||
previousPage: 0,
|
vm.realName = user.real_name;
|
||||||
nextPage: 0,
|
vm.adminType = user.admin_type;
|
||||||
page: 1,
|
vm.email = user.email;
|
||||||
editingUserId: 0,
|
vm.userId = user.id;
|
||||||
totalPage: 1,
|
|
||||||
userType: ["一般用户", "管理员", "超级管理员"],
|
vm.isEditing = true;
|
||||||
keyword: "",
|
},
|
||||||
showAdminOnly: false,
|
search: function () {
|
||||||
//编辑区域同步变量
|
getPage(1);
|
||||||
username: "",
|
avalon.vmodels.userPager.currentPage = 1;
|
||||||
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";
|
|
||||||
}
|
}
|
||||||
else {
|
});
|
||||||
return vm.previousPage ? "btn btn-primary" : "btn btn-primary disabled";
|
}
|
||||||
}
|
vm.$watch("showAdminOnly", function () {
|
||||||
},
|
getPage(1);
|
||||||
editUser: function (user) { //点击编辑按钮的事件,显示/隐藏编辑区
|
avalon.vmodels.userPager.currentPage = 1;
|
||||||
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 () {
|
function getPage(page) {
|
||||||
getPageData(1);
|
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();
|
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>ID</th>
|
||||||
<th>用户名</th>
|
<th>用户名</th>
|
||||||
<th>注册时间</th>
|
<th>注册时间</th>
|
||||||
<th>最近登陆</th>
|
|
||||||
<th>真实姓名</th>
|
<th>真实姓名</th>
|
||||||
<th>电子邮箱</th>
|
<th>电子邮箱</th>
|
||||||
<th>用户类型</th>
|
<th>用户类型</th>
|
||||||
@ -26,7 +25,6 @@
|
|||||||
<td>{{ el.id }}</td>
|
<td>{{ el.id }}</td>
|
||||||
<td>{{ el.username }}</td>
|
<td>{{ el.username }}</td>
|
||||||
<td>{{ el.create_time|date("yyyy-MM-dd HH:mm:ss")}}</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.real_name }}</td>
|
||||||
<td>{{ el.email }}</td>
|
<td>{{ el.email }}</td>
|
||||||
<td>{{ userType[el.admin_type]}}</td>
|
<td>{{ userType[el.admin_type]}}</td>
|
||||||
@ -39,17 +37,15 @@
|
|||||||
<label>仅显示管理员 <input ms-duplex-checked="showAdminOnly" type="checkbox"/></label>
|
<label>仅显示管理员 <input ms-duplex-checked="showAdminOnly" type="checkbox"/></label>
|
||||||
</div>
|
</div>
|
||||||
<div class="text-right">
|
<div class="text-right">
|
||||||
页数:{{ page }}/{{ totalPage }}
|
<ms:pager $id="userPager" config="pager"></ms:pager>
|
||||||
<button ms-attr-class="getBtnClass('pre')" ms-click="getPrevious">上一页</button>
|
|
||||||
<button ms-attr-class="getBtnClass('next')" ms-click="getNext">下一页</button>
|
|
||||||
</div>
|
</div>
|
||||||
<div ms-visible="editingUserId">
|
<div ms-visible="isEditing">
|
||||||
<h3>修改用户信息</h3>
|
<h3>修改用户信息</h3>
|
||||||
|
|
||||||
<form id="edit_user-form">
|
<form id="edit-user-form">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="form-group col-md-4"><label>ID</label>
|
<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>
|
||||||
<div class="form-group col-md-4"><label>用户名</label>
|
<div class="form-group col-md-4"><label>用户名</label>
|
||||||
<input name="username" type="text" class="form-control" ms-duplex="username"
|
<input name="username" type="text" class="form-control" ms-duplex="username"
|
||||||
@ -64,7 +60,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="form-group col-md-4"><label>新密码(留空则保留原密码)</label>
|
<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位">
|
placeholder="此项留空则保留原密码" data-minlength="6" data-minlength-error="密码不得少于6位">
|
||||||
<div class="help-block with-errors"></div>
|
<div class="help-block with-errors"></div>
|
||||||
</div>
|
</div>
|
||||||
@ -80,7 +76,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<button type="submit" class="btn btn-primary">提交</button>
|
<button type="submit" class="btn btn-success">保存修改</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
Reference in New Issue
Block a user