@model DeJin.EasyCare.WebUI.Areas.Cms.Models.ArticlesIndexModel
@{
ViewBag.Title = "文章分类列表";
Layout = "~/Views/Shared/_Layout.cshtml";
}
@section scripts
{
<script src="~/Assets/themes/default/js/components/commonSelector.js"></script>
<script>
$(function () {
//选择文章分类
$("[func=SelectArticles]").click(function () {
//弹出选择器
$("#divArticlesSelector").commonSelector({
//模态窗口id
modelId: "setArticlesModal",
//模态窗口标题
title: "选择文章",
//数据源请求地址
dataUrl: '@Url.Action("_GetArticlesCatalogsList", "Articles")',
//请求携带参数
formData: { kw: '' },
//表格头部字段描述
tableTh: ["文章分类名称", "代码", "关键词"],
//表格数据区域对应字段
tableTd: ["Name", "Code", "Keywords"],
//默认单选
multiSelect: false,
//确定按钮回调函数
okCallback: function (r, data, fulldata) {
if (r && r.Ids) {
$('#CatId').val(r.Ids);
$('#ArticlesName').val(data[0].Name);
$("#frmSearch").submit();
}
$('[func=btnCancelUser]').show();
}
});
$("#setArticlesModal").modal();
});
//清空文章
$('#CatId').val() <= 0 ? $('[func=btnCancelUser]').hide() : $('[func=btnCancelUser]').show();
$('[func=btnCancelUser]').click(function (e) {
$('#CatId').val('');
$('#ArticlesName').val('');
$(this).hide();
$("form").submit();
});
$('[func=btnDel]').click(function () {
var id = $(this).data('id');
var ele = $(this);
//idialog弹出提示
iDialog.confirm({ message: '确认要删除当前记录吗?' }).on(function (flag) {
if (flag) {
richAjax({ ids: id }, '@Url.Action("_DelArticles", "Articles", new { area = "Cms" })', true, true, true).Do(ele, "@Url.Action("ArticlesIndex", "Articles", new { area = "Cms" })");
}
});
});
$('[func=btnBatchDelete]').click(function () {
var cks = $('input[type=checkbox][name=id]:checked');
var ids = "";
if (cks.length > 0) {
cks.each(function (index, cur) {
if (ids != "") {
ids += ",";
}
ids += $(cur).val();
});
}
else {
iDialog.alert("请选择要删除的数据");
return;
}
var ele = $(this);
iDialog.confirm({ message: '确认要删除选中的这些记录吗?' }).on(function (flag) {
if (flag) {
richAjax({ ids: ids }, '@Url.Action("_DelArticles", "Articles", new { area = "Cms" })', true, true, true).Do(ele, "@Url.Action("ArticlesIndex", "Articles", new { area = "Cms" })");
}
});
});
$('[func=btnStatus]').click(function () {
richAjax({ id: $(this).data('id'), status: $(this).data('status') }, '@Url.Action("_ChangeArticlesStatus", "Articles", new { area = "Cms" })', false, true, true)
.Do($(this), "@Url.Action("ArticlesIndex", "Articles", new { area = "Cms" })");
});
//全选反选
var seltor = selector($('input[type=checkbox][name=id]'));
seltor.eventWith($('#selectAll'));
$('[func=btnCancel]').click(function () {
window.location.href = "@Model.BackUrl";
});
});
</script>
}
<div class="row">
<div class="col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
文章管理
</h3>
</div>
<div class="panel-body">
<div class="row">
<div class="col-sm-12">
<div class="mailbox-controls">
<div class="btn-group">
<a href="@Url.Action("ArticlesInfo", "Articles", new { area = "Cms" })" class="btn btn-default btn-sm"><i class="fa fa-plus"></i> 新增</a>
<a href="javascript:;" func="btnBatchDelete" class="btn btn-default btn-sm"><i class="fa fa-trash-o"></i> 批量删除</a>
</div>
<div class="pull-right">
<form id="frmSearch" class="input-group" method="get" enctype="application/x-www-form-urlencoded">
<input type="hidden" id="pageIndex" name="pageIndex" value="@Model.Pager.PageIndex" />
<input type="hidden" id="pageSize" name="pageSize" value="@Model.Pager.PageSize" />
<input type="hidden" id="CatId" name="CatId" value="@Model.CatId" />
<div class="form-group">
<div class="input-group input-group-sm" style="width: 250px; float:left">
<input type="text" readonly="readonly" class="form-control" id="ArticlesName" value="@Model.Name" placeholder="文章分类">
<div class="input-group-btn">
<a class="btn btn-default" func="btnCancelUser" href="javascript:;" title="清除选择">清空</a>
<button type="button" class="btn btn-default" func="SelectArticles" title="选择文章分类">
<i class="fa fa-search"></i>
</button>
</div>
</div>
<div class="input-group input-group-sm" style="width: 300px; float:left">
<input type="text" name="kw" class="form-control pull-right" placeholder="搜索" value="@Model.Keyword">
<div class="input-group-btn">
<button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<table id="example1" class="table table-bordered table-striped table-hover dataTable" role="grid" aria-describedby="example1_info">
<thead>
<tr role="row">
<th width="30"><input id="selectAll" type="checkbox"></th>
<th width="100">封面图</th>
<th width="8%">所属分类</th>
<th>标题</th>
<th width="8%">是否推荐</th>
<th width="8%">排序值</th>
<th width="8%">状态</th>
<th width="8%">操作</th>
</tr>
</thead>
<tbody>
@foreach (var result in Model.Results)
{
<tr>
<td><input type="checkbox" name="id" value="@result.Entity.Id"></td>
<td><a href="@result.Entity.CoverImage" target="_blank"><img src="@result.Entity.CoverImage" style="width: 65px;" /></a></td>
<td>@result.ViewBag.pe</td>
<td><a href="@Url.Action("ArticlesInfo","Articles", new {area="Cms",id = result.Entity.Id})">@result.Entity.Title</a></td>
<td>
@switch (result.Entity.IsRecommend)
{
case 1:
@:是
break;
case 2:
@:否
break;
}
</td>
<td>@result.Entity.Sort</td>
<td>
@switch (result.Entity.State)
{
case 2:
@:禁用
<a href="javascript:;" func="btnStatus" data-id="@result.Entity.Id" data-status="1" class="active"><i class="fa fa-lock"></i></a>
break;
default:
@:使用
<a href="javascript:;" func="btnStatus" data-id="@result.Entity.Id" data-status="2" class="active"><i class="fa fa-unlock"></i></a>
break;
}
</td>
<td>
<a href="@Url.Action("ArticlesInfo","Articles", new {area="Cms",id = result.Entity.Id, kw = Model.Keyword})" class="active"><i class="fa fa-edit"></i>编辑</a>
<a href="javascript:;" func="btnDel" data-id="@result.Entity.Id" class="active"><i class="fa fa-trash"></i>删除</a>
</td>
</tr>
}
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="dataTables_paginate paging_simple_numbers">
@Html.Partial("_Pager", Model.Pager)
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="divArticlesSelector"></div>
模型
using System.Collections.Generic;
using DeJin.EasyCare.WebUI.Models;
using DeJin.EasyCare.Entities.CMS;
namespace DeJin.EasyCare.WebUI.Areas.Cms.Models
{
public class ArticlesIndexModel : ListBaseModel
{
public ArticlesIndexModel(int catId=0, string kw = "", int pageIndex = 1, int pageSize = 10, string title = "文章管理", string subTitle = "文章列表") :
base(title, subTitle)
{
this.Results = new List<VM<Articles>>();
this.Keyword = kw;
CatId = catId;
if (pageIndex < 0) pageIndex = 1;
if (pageSize < 2 || pageSize > 50) pageSize = 20;
base.Pager.PageIndex = pageIndex;
base.Pager.PageSize = pageSize;
}
/// <summary>
/// 文章分类Id
/// </summary>
public int CatId { get; set; }
/// <summary>
/// 文章名称
/// </summary>
public string Name { get; set; }
/// <summary>
/// 关键词
/// </summary>
public string Keyword { get; set; }
/// <summary>
/// 角色集合
/// </summary>
public List<VM<Articles>> Results { get; set; }
}
}
Info
//创建表单提交器
$("#frmInfo").Validform({
btnSubmit: "[func=btnSave]",
tiptype: 4,
label: ".label",
showAllError: false,
postonce: true,
ajaxPost: true,
beforeSubmit: function (data) {
var formdatas = $("#frmInfo").serialize();
//kw:index 后台传递的参数
formdatas += "&kw=@Model.Keyword";
$.post('@Url.Action("_SaveArticles", "Articles")', formdatas, function (data) {
if (data.Message) {
iDialog.alert({ message: data.Message }).on(function (ok) {
if (ok) {
if (!data.IsError) {
//window.location.href = '/Cms/Articles/ArticlesIndex';
window.location.href = '@Url.Action("ArticlesIndex", new { kw = Model.Keyword})';
}
}
});
}
});
return false;
}
});
面板区
<!--添加的面板区-->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="base">
<div class="row">
<input type="hidden" name="Id" id="Id" value="@Model.Result.Entity.Id">
<input type="hidden" name="kw" value="@Model.Keyword"/>
<div class="form-group">
<label class="col-sm-2 control-label">标题<span class="require">*</span></label>
<div class="col-sm-2">
<input type="text" name="Title" id="Title" class="form-control parsley-validated" datatype="*" nullmsg="标题不能为空" value="@Model.Result.Entity.Title" placeholder="请输入标题" data-required="true">
</div>
<label class="col-sm-2 control-label">分类<span class="require">*</span></label>
<div class="col-sm-2">
<select class="form-control parsley-validated" name="CatId" id="CatId" datatype="*" nullmsg="请选择文章分类" data-required="true">
<option value="0" @Html.Raw(Model.Result.Entity.CatId == 0 ? " selected=\"selected\"" : "")>--请选择--</option>
@foreach (var catalog in Model.Catalogs)
{
<option value="@catalog.id" @Html.Raw(Model.Result.Entity.CatId == int.Parse(catalog.id) ? " selected=\"selected\"" : "")>
@for (var i = 0; i <= catalog.level; i++)
{
@:
}
@catalog.name
</option>
}
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">封面图</label>
<div class="col-sm-2">
<input type="hidden" name="CoverImage" class="txtImage" value="@Model.Result.Entity.CoverImage" />
<a href="@Model.Result.Entity.CoverImage" title="点击预览封面图" target="_blank" class="image" @Html.Raw(string.IsNullOrEmpty(Model.Result.Entity.CoverImage) ? "style=\"display: none\"" : "style=\"display: block\"")>
<img src="@Model.Result.Entity.CoverImage" style="width: 84px; max-height: 50px;" />
</a>
<button type="button" class="btn btn-success" href="javascript:void(0)" id="uploadAvatar">上传封面</button>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">作者</label>
<div class="col-sm-2">
<input type="text" name="Author" id="Author" class="form-control" value="@Model.Result.Entity.Author" placeholder="请输入作者名">
</div>
<label class="col-sm-2 control-label">作者邮箱<span class="require"></span></label>
<div class="col-sm-2">
<input type="text" name="AuthorEmail" id="AuthorEmail" class="form-control parsley-validated" value="@Model.Result.Entity.AuthorEmail" placeholder="请输入邮箱" data-required="true">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">标签</label>
<div class="col-sm-6">
<input type="text" name="Tags" id="Tags" class="form-control parsley-validated" value="@Model.Result.Entity.Tags" placeholder="请输入标签">
</div>
</div>
@*<div class="form-group">
<label class="col-sm-2 control-label">关键词<span class="require"></span></label>
<div class="col-sm-6">
<input type="text" name="Keywords" id="Keywords" class="bg-focus form-control" placeholder="请输入关键词" value="@Model.Result.Entity.Keywords">
</div>
</div>*@
<div class="form-group">
<label class="col-sm-2 control-label">原文链接</label>
<div class="col-sm-6">
<input type="text" name="Link" id="Link" class="bg-focus form-control" placeholder="请输入原文链接" value="@Model.Result.Entity.Link">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">简介<span class="require"></span></label>
<div class="col-sm-6">
<textarea name="Description" class="bg-focus form-control" placeholder="请输入简介" rows="3">@Model.Result.Entity.Description</textarea>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">排序值</label>
<div class="col-sm-2">
<input type="number" name="Sort" id="Sort" class="form-control" value="@(Model.Result.Entity.Sort == 0 ? 100 : Model.Result.Entity.Sort)" pl placeholder="请输入排序值">
</div>
<label class="col-sm-2 control-label">是否推荐</label>
<div class="col-sm-2">
<select class="form-control parsley-validated" name="IsRecommend" id="IsRecommend">
<option value="2" @Html.Raw(Model.Result.Entity.IsRecommend == 2 ? "selected=\"selected\"" : "")>否</option>
<option value="1" @Html.Raw(Model.Result.Entity.IsRecommend == 1 ? "selected=\"selected\"" : "")>是</option>
</select>
</div>
</div>
</div>
</div>
<div id="content_info" class="tab-pane">
<div class="row">
<div class="form-group">
<label class="col-sm-2 control-label">内容</label>
<div class="col-sm-8">
<textarea name="Content" id="Content" class="bg-focus form-control" placeholder="请输入内容" rows="3">@Model.Result.Entity.Content</textarea>
</div>
</div>
</div>
</div>
<div class="box-footer">
<button type="button" class="btn btn-info" func="btnSave">保存</button>
<a href="@Model.BackUrl" class="btn btn-default" func="btnCancel">取消</a>
</div>
</div>
Info模型
using DeJin.EasyCare.WebUI.Models;
using System.Collections.Generic;
using DeJin.EasyCare.Entities.CMS;
namespace DeJin.EasyCare.WebUI.Areas.Cms.Models
{
public class ArticlesInfoModel: BaseModel
{
public ArticlesInfoModel(string title = "文章管理", string subTitle = "添加文章",string kw="") :
base(title, subTitle)
{
this.Keyword = kw;
this.Result = new VM<Articles>(new Articles());
this.Catalogs = new List<JsTreeNode>();
}
/// <summary>
/// 关键词
/// </summary>
public string Keyword { get; set; }
/// <summary>
/// 系统角色信息
/// </summary>
public VM<Articles> Result { get; set; }
/// <summary>
/// 文章分类树形
/// </summary>
public List<JsTreeNode> Catalogs { get; set; }
}
}
后台
/// <summary>
/// 文章分类列表管理
/// </summary>
/// <param name="kw"></param>
/// <param name="pageIndex"></param>
/// <param name="pageSize"></param>
/// <returns></returns>
public ActionResult ArticlesIndex(int catId = 0, string kw = "", int pageIndex = 1, int pageSize = 10)
{
var model = new ArticlesIndexModel(catId, kw, pageIndex, pageSize);
base.RenderOutputBaseModel(model, new Tuple<string, string>("文章分类列表", Url.Action("ArticlesIndex", "Articles", new { area = "Cms" })));
var arts = base.ArticlesService.Value.PageArticlesEntities(model.Pager, kw, catIds: catId > 0 ? new List<int> { catId } :null);
if (arts != null)
{
foreach (var itme in arts)
{
var vm = new VM<Articles>(itme);
if (itme.CatId > 0)
{
var app = base.ArticlesService.Value.GetCatalogsById(itme.CatId);
if (app != null)
vm.ViewBag.pe = app.Name;
}
model.Results.Add(vm);
}
}
var articlesCatalogs = ArticlesService.Value.GetCatalogsById(catId);
if (articlesCatalogs != null)
{
model.CatId = articlesCatalogs.Id;
//将值绑定到文本框上
model.Name = articlesCatalogs.Name;
}
ViewBag.kw = kw;
return View(model);
}
/// <summary>
/// 文章详情
/// </summary>
/// <param name="id"></param>
/// <returns></returns>
public ActionResult ArticlesInfo(int id = 0, string kw = "")
{
var model = new ArticlesInfoModel();
base.RenderOutputBaseModel(model, new Tuple<string, string>("文章详情", Url.Action("ArticlesIndex", "Articles", new { area = "Cms" })));
var cles = base.ArticlesService.Value.GetArticlesById(id);
model.Result = cles != null ? new VM<Articles>(cles) : new VM<Articles>(new Articles());
if (model.Result.Entity == null)
{
model.Result.Entity = new Articles();
}
var resList = base.ArticlesService.Value.GetAllArticlesCatalogs();
if (resList != null && resList.Count > 0)
{
var nodes = new List<JsTreeNode>();
BuildMenus(nodes, resList, 0, true, 1);
model.Catalogs = nodes;
}
//传递到模型
model.Keyword = kw;
return View(model);
}