[前端]: 添加了admin公告管理页面以及相应的js,包含公告显示,修改,新建

This commit is contained in:
sxw
2015-08-07 19:20:19 +08:00
parent 2a29dfffb4
commit 7375bda40c
3 changed files with 162 additions and 96 deletions

View File

@@ -1,53 +1,96 @@
require(["jquery", "avalon", "csrf", "bs_alert", "editor", "validation"], function ($, avalon, csrfHeader, bs_alert, editor) {
annoumcementEditor = editor("#editor");
editAnnoumcementEditor = null;
if (!avalon.vmodels.announcement)
avalon.vmodels.announcement = null;
vm = avalon.define({
$id: "announcement",
announcement: [],
previous_page: 0,
next_page: 0,
page: 1,
isEditing: false,
getState: function (el) {
if (el.visible)
return "可见";
else
return "隐藏";
},
getNext: function (el) {
getPageData(++(vm.page), function (data) {
});
},
getPrevious: function (el) {
getPageData(--(vm.page), function (data) {
});
},
getBtnClass: function (btn) {
if (btn) {
return vm.next_page ? "btn btn-primary" : "btn btn-primary disabled";
}
else {
return vm.previous_page ? "btn btn-primary" : "btn btn-primary disabled";
announcementEditor = editor("#editor"); //创建新建公告的内容编辑器
editAnnouncementEditor = null;
if (!avalon.vmodels.announcement) // 防止模式重新定义
{
// avalon:定义模式 announcement
vm = avalon.define({
$id: "announcement",
announcement: [], // 公告列表数据项
previous_page: 0, // 之前的页数
next_page: 0, // 之后的页数
page: 1, // 当前页数
isEditing: 0, // 正在编辑的公告的ID 为零说明未在编辑
getState: function (el) { //获取公告当前状态,显示
if (el.visible)
return "可见";
else
return "隐藏";
},
getNext: function (el) {
if (!vm.next_page)
return;
getPageData(++(vm.page));
},
getPrevious: function (el) {
if (!vm.previous_page)
return;
getPageData(--(vm.page));
},
getBtnClass: function (btn) {
if (btn) {
return vm.next_page ? "btn btn-primary" : "btn btn-primary disabled";
}
else {
return vm.previous_page ? "btn btn-primary" : "btn btn-primary disabled";
}
},
enEdit: function (el) { //点击编辑按钮的事件,显示/隐藏编辑区
$("#newTitle").val(el.title);
if (!editAnnouncementEditor) //初始化编辑器
editAnnouncementEditor = editor("#editAnnouncementEditor");
editAnnouncementEditor.setValue(el.content);
if (el.visible == false)
$("#hidden").attr("checked", true);
if (vm.isEditing == el.id)
vm.isEditing = 0;
else
vm.isEditing = el.id;
editAnnouncementEditor.focus();
},
disEdit: function () { //收起编辑框
vm.isEditing = 0;
},
submitChange: function () { // 处理编辑公告提交事件,顺便验证字段为空
var title = $("#newTitle").val(), content = editAnnouncementEditor.getValue(), visible = true;
if ($("#hidden").attr("checked") == true)
visible = false;
if (title != "") {
if (content != "") {
$.ajax({ //发送修改公告请求
beforeSend: csrfHeader,
url: "/api/edit_announcements/",
dataType: "json",
method: "post",
data: {id: vm.isEditing, title: title, content: content, visible: visible},
success: function (data) {
if (!data.code) {
bs_alert("修改成功");
vm.isEditing = 0;
}
else {
bs_alert(data.data);
}
}
});
}
else
bs_alert("公告内容不得为空");
}
else
bs_alert("公告标题不能为空");
}
});
}
},
enEdit: function(el){
$("#newTitle").val(el.title);
if (!editAnnoumcementEditor)
editAnnoumcementEditor = editor("#editAnnoumcementEditor");
editAnnoumcementEditor.setValue(el.content);
vm.isEditing = true;
editAnnoumcementEditor.focus();
}
});
getPageData(1, function (data) {
avalon.scan();
});
function getPageData(page, callback) {
avalon.scan();
getPageData(1); //公告列表初始化
vm.page = 1;
vm.isEditing = 0;
//Ajax get数据
function getPageData(page) {
$.ajax({
beforeSend: csrfHeader,
url: "/api/announcements/?paging=true&page=" + page + "&page_size=10",
@@ -58,7 +101,6 @@ require(["jquery", "avalon", "csrf", "bs_alert", "editor", "validation"], functi
vm.announcement = data.data.results;
vm.previous_page = data.data.previous_page;
vm.next_page = data.data.next_page;
callback(data);
}
else {
bs_alert(data.data);
@@ -67,48 +109,7 @@ require(["jquery", "avalon", "csrf", "bs_alert", "editor", "validation"], functi
});
}
$("#announcement-edit-form")
.formValidation({
framework: "bootstrap",
fields: {
title: {
validators: {
notEmpty: {
message: "请填写公告标题"
}
}
}
}
}
).on('success.form.fv', function (e) {
e.preventDefault();
var title = $("#newTitle").val();
var content = editor1.getValue();
if (content == "") {
bs_alert("请填写公告内容")
return;
}
$.ajax({
beforeSend: csrfHeader,
url: "/api/admin/announcement/",
data: {title: title, content: content},
dataType: "json",
method: "post",
success: function (data) {
if (!data.code) {
bs_alert("提交成功!");
$("#title").val("");
editor1.setValue("");
getPageData(1, function (data) {});
} else {
bs_alert(data.data);
}
}
})
});
//新建公告表单验证与数据提交
$("#announcement-form")
.formValidation({
framework: "bootstrap",
@@ -125,9 +126,9 @@ require(["jquery", "avalon", "csrf", "bs_alert", "editor", "validation"], functi
).on('success.form.fv', function (e) {
e.preventDefault();
var title = $("#title").val();
var content = editor1.getValue();
var content = announcementEditor.getValue();
if (content == "") {
bs_alert("请填写公告内容")
bs_alert("请填写公告内容");
return;
}
$.ajax({
@@ -140,13 +141,13 @@ require(["jquery", "avalon", "csrf", "bs_alert", "editor", "validation"], functi
if (!data.code) {
bs_alert("提交成功!");
$("#title").val("");
editor1.setValue("");
getPageData(1, function (data) {});
announcementEditor.setValue("");
getPageData(1, function (data) {
});
} else {
bs_alert(data.data);
}
}
})
});