大致要实现的 效果如下

1,添加Controller(用到的X.PagedList 注意到nuget添加)

using System.Web.Mvc;
using Abp.Application.Services.Dto;
using Abp.Runtime.Caching;
using Abp.Threading;
using Abp.Web.Mvc.Authorization;
using AutoMapper;
using LearningMpaAbp.Notifications;
using LearningMpaAbp.Tasks;
using LearningMpaAbp.Tasks.Dtos;
using LearningMpaAbp.Users;
using LearningMpaAbp.Users.Dto;
using LearningMpaAbp.Web.Models.Tasks;
using X.PagedList; namespace LearningMpaAbp.Web.Controllers
{
[AbpMvcAuthorize]
public class TasksController : LearningMpaAbpControllerBase
{
private readonly ITaskAppService _taskAppService;
private readonly IUserAppService _userAppService;
private readonly INotificationAppService _notificationAppService;
private readonly ICacheManager _cacheManager; public TasksController(ITaskAppService taskAppService, IUserAppService userAppService, ICacheManager cacheManager, INotificationAppService notificationAppService)
{
_taskAppService = taskAppService;
_userAppService = userAppService;
_cacheManager = cacheManager;
_notificationAppService = notificationAppService;
} public ActionResult Index(GetTasksInput input)
{
var output = _taskAppService.GetTasks(input); var model = new IndexViewModel(output.Tasks)
{
SelectedTaskState = input.State
};
return View(model);
} // GET: Tasks
public ActionResult PagedList(int? page)
{
//每页行数
var pageSize = 5;
var pageNumber = page ?? 1; //第几页 var filter = new GetTasksInput
{
SkipCount = (pageNumber - 1) * pageSize, //忽略个数
MaxResultCount = pageSize
};
var result = _taskAppService.GetPagedTasks(filter); //已经在应用服务层手动完成了分页逻辑,所以需手动构造分页结果
var onePageOfTasks = new StaticPagedList<TaskDto>(result.Items, pageNumber, pageSize, result.TotalCount);
//将分页结果放入ViewBag供View使用
ViewBag.OnePageOfTasks = onePageOfTasks; return View();
} public PartialViewResult GetList(GetTasksInput input)
{
var output = _taskAppService.GetTasks(input);
return PartialView("_List", output.Tasks);
} /// <summary>
/// 获取创建任务分部视图
/// 该方法使用ICacheManager进行缓存,在WebModule中配置缓存过期时间为10mins
/// </summary>
/// <returns></returns>
public PartialViewResult RemoteCreate()
{
//1.1 注释该段代码,使用下面缓存的方式
//var userList = _userAppService.GetUsers(); //1.2 同步调用异步解决方案(最新Abp创建的模板项目已经去掉该同步方法,所以可以通过下面这种方式获取用户列表)
//var userList = AsyncHelper.RunSync(() => _userAppService.GetUsersAsync()); //1.3 缓存版本
var userList = _cacheManager.GetCache("ControllerCache").Get("AllUsers", () => _userAppService.GetUsers()); //1.4 转换为泛型版本
//var userList = _cacheManager.GetCache("ControllerCache").AsTyped<string, ListResultDto<UserListDto>>().Get("AllUsers", () => _userAppService.GetUsers()); //1.5 泛型缓存版本
//var userList = _cacheManager.GetCache<string, ListResultDto<UserListDto>>("ControllerCache").Get("AllUsers", () => _userAppService.GetUsers()); ViewBag.AssignedPersonId = new SelectList(userList.Items, "Id", "Name");
return PartialView("_CreateTaskPartial");
} /// <summary>
/// 获取创建任务分部视图(子视图)
/// 该方法使用[OutputCache]进行缓存,缓存过期时间为2mins
/// </summary>
/// <returns></returns>
[ChildActionOnly]
[OutputCache(Duration = 1200, VaryByParam = "none")]
public PartialViewResult Create()
{
var userList = _userAppService.GetUsers();
ViewBag.AssignedPersonId = new SelectList(userList.Items, "Id", "Name");
return PartialView("_CreateTask");
} // POST: Tasks/Create
// 为了防止“过多发布”攻击,请启用要绑定到的特定属性,有关
// 详细信息,请参阅 http://go.microsoft.com/fwlink/?LinkId=317598。
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(CreateTaskInput task)
{
var id = _taskAppService.CreateTask(task); var input = new GetTasksInput();
var output = _taskAppService.GetTasks(input); return PartialView("_List", output.Tasks);
} // GET: Tasks/Edit/5 public PartialViewResult Edit(int id)
{
var task = _taskAppService.GetTaskById(id); var updateTaskDto = Mapper.Map<UpdateTaskInput>(task); var userList = _userAppService.GetUsers();
ViewBag.AssignedPersonId = new SelectList(userList.Items, "Id", "Name", updateTaskDto.AssignedPersonId); return PartialView("_EditTask", updateTaskDto);
} // POST: Tasks/Edit/5
// 为了防止“过多发布”攻击,请启用要绑定到的特定属性,有关
// 详细信息,请参阅 http://go.microsoft.com/fwlink/?LinkId=317598。
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(UpdateTaskInput updateTaskDto)
{
_taskAppService.UpdateTask(updateTaskDto); var input = new GetTasksInput();
var output = _taskAppService.GetTasks(input); return PartialView("_List", output.Tasks);
} public ActionResult NotifyUser()
{
_notificationAppService.NotificationUsersWhoHaveOpenTask();
return new EmptyResult();
}
}
}

2,视图

@using Abp.Web.Mvc.Extensions
@model LearningMpaAbp.Web.Models.Tasks.IndexViewModel @{
ViewBag.Title = L("TaskList");
ViewBag.ActiveMenu = "TaskList"; //Matches with the menu name in SimpleTaskAppNavigationProvider to highlight the menu item
}
@section scripts{
@Html.IncludeScript("~/Views/Tasks/index.js");
}
<h2>
@L("TaskList") <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#add">Create Task</button> <a class="btn btn-primary" data-toggle="modal" href="@Url.Action("RemoteCreate")" data-target="#modal" role="button">(Create Task)使用Remote方式调用Modal进行展现</a> <a class="btn btn-success" href="@Url.Action("PagedList")" role="button">分页展示</a> <button type="button" class="btn btn-info" onclick="notifyUser();">通知未完成任务的用户</button>
<!--任务清单按照状态过滤的下拉框-->
<span class="pull-right">
@Html.DropDownListFor(
model => model.SelectedTaskState,
Model.GetTaskStateSelectListItems(),
new
{
@class = "form-control select2",
id = "TaskStateCombobox"
})
</span>
</h2> <!--任务清单展示-->
<div class="row" id="taskList">
@{ Html.RenderPartial("_List", Model.Tasks); }
</div> <!--通过初始加载页面的时候提前将创建任务模态框加载进来-->
@Html.Action("Create") <!--编辑任务模态框通过ajax动态填充到此div中-->
<div id="edit"> </div> <!--Remote方式弹出创建任务模态框-->
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="createTask" data-backdrop="static">
<div class="modal-dialog" role="document">
<div class="modal-content"> </div>
</div>
</div>

另外还有_createTaskPartial,_EditTaskPartial 等,这里就不贴代码了

以上。。。

参考http://www.jianshu.com/p/620c20fa511b

代码地址https://github.com/tianxiangd/LearnAbp

ABP学习入门系列(五)(展示实现增删改查)的更多相关文章

  1. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(一)

    前言:出于某种原因,需要学习下Knockout.js,这个组件很早前听说过,但一直没尝试使用,这两天学习了下,觉得它真心不错,双向绑定的机制简直太爽了.今天打算结合bootstrapTable和Kno ...

  2. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(四):自定义T4模板快速生成页面

    前言:上篇介绍了下ko增删改查的封装,确实节省了大量的js代码.博主是一个喜欢偷懒的人,总觉得这些基础的增删改查效果能不能通过一个什么工具直接生成页面效果,啥代码都不用写了,那该多爽.于是研究了下T4 ...

  3. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(二)

    前言:上篇 JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(一) 介绍了下knockout.js的一些基础用法,由于篇幅的关系,所以只能分成两篇,望见谅!昨天就 ...

  4. SQLite 入门教程(四)增删改查,有讲究 (转)

    转于: SQLite 入门教程(四)增删改查,有讲究 一.插入数据 INSERT INTO 表(列...) VALUES(值...) 根据前面几篇的内容,我们可以很轻送的创建一个数据表,并向其中插入一 ...

  5. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(三):两个Viewmodel搞定增删改查

    前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用法,都是写基础应用,根本谈不上封装,仅仅是避免了html控件的取值和赋值,远远没有将MVVM的精妙展现出来.最近项目打 ...

  6. MVC3+EF4.1学习系列(二)-------基础的增删改查和持久对象的生命周期变化

    上篇文章中 我们已经创建了EF4.1基于code first的例子  有了数据库 并初始化了一些数据  今天这里写基础的增删改查和持久对象的生命周期变化 学习下原文先把运行好的原图贴来上~~ 一.创建 ...

  7. SQL Server学习之路(五):“增删改查”之“改”

    0.目录 1.前言 2.通过SSMS修改数据 3.通过SQL语句修改数据 3.1 修改单列数据 3.2 修改多列数据 1.前言 增删改查都是对数据的操作,其中"改"对应的SQL语句 ...

  8. MongoDB入门(介绍、安装、增删改查)

    文章作者公众号bigsai,已收录在回车课堂,如有帮助还请不吝啬点个赞赞支持一下! 课程导学 大家好我是bigsai,我们都学过数据库,但你可能更熟悉关系(型)数据库例如MySQL,SQL SERVE ...

  9. SQLite 入门教程(四)增删改查,有讲究

    增删改查操作,其中增删改操作被称为数据操作语言 DML,相对来说简单一点. 查操作相对来说复杂一点,涉及到很多子句,所以这篇先讲增删改操作,以例子为主,后面再讲查操作. 一.插入数据 INSERT I ...

  10. hibernate系列笔记(1)---Hibernate增删改查

    Hibernate增删改查 1.首先我们要知道什么是Hibernate Hibernate是一个轻量级的ORMapping对象.主要用来实现Java和数据库表之间的映射,除此之外还提供数据查询和数据获 ...

随机推荐

  1. Cesium简介 [转]

    http://www.cnblogs.com/laixiangran/p/4984522.html 一.Cesium介绍 Cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎. ...

  2. JAVA 从头开始<四>

    一.switch 1.根据输入月份获取季节 import java.util.*; class Demo8{ public static void main(String[] args) { Syst ...

  3. EF 多对多循环引用序列化失败 解决办法

    错误:Self referencing loop detected with type 'System.Data.Entity.DynamicProxies.tbldph_901D48A194FB31 ...

  4. Day 26封装

    一.封装 广义上的封装: 属于一个类的静态和动态属性,总是出现在一个类中. 使用的永远用类名或者对象名调用. 狭义上的封装:就是把变量和方法私有化,在类的外部以及子类中不能直接使用了 . class ...

  5. openstack 虚机迁移 Unacceptable CPU info: CPU doesn't have compatibility

    问题: Unacceptable CPU info: CPU doesn't have compatibility 解决: vim /usr/lib/python2.7/site-packages/n ...

  6. 系统可能不会保存你所做的修改 onbeforeunload

    网上找了好多实现这个的方法,说的还是不明白.害得我(我自己的原因)以为是需要在服务器环境下才能跑通 window.onbeforeunload; 后来猜想是不是函数返回值发生变化就会触发. <! ...

  7. Tcp下载文件

    一.下载文件 tcp 客户端 1.创建套接字down_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)2.获取ip,portdown ...

  8. 使用 find 命令实现高级排除需求

    使用 find 命令实现高级排除需求 Linked 关于 find 命令,本博客介绍过 atime,ctime,mtime 介绍过 --exec 参数. 介绍这些的基本需求是进行文件管理.事实上,基于 ...

  9. maven 服务器搭建 -- nexus

    参考文档 http://blog.sina.com.cn/s/blog_5745d6cb0100hasa.html 首先下载nexus webapp,可以使用wget来下载: Java代码 wget  ...

  10. 【xsy1201】 随机游走 高斯消元

    题目大意:你有一个$n*m$的网格(有边界),你从$(1,1)$开始随机游走,求走到$(n,m)$的期望步数. 数据范围:$n≤10$,$m≤1000$. 我们令 $f[i][j]$表示从$(1,1) ...