Asp.net+Vue2构建简单记账WebApp之二（使用ABP迅速搭建.Net后台）

来源：互联网发布：小说淘宝王编辑：程序博客网时间：2024/06/05 05:51

Asp.net+Vue2构建简单记账WebApp之一（设计）
Asp.net+Vue2构建简单记账WebApp之二（使用ABP迅速搭建.Net后台）
Asp.net+Vue2构建简单记账WebApp之三（使用Vue-cli构建vue.js应用）
Asp.net+Vue2构建简单记账WebApp之四（vue.js构建记账主页面）
Asp.net+Vue2构建简单记账WebApp之五（vue.js构建记账页面）
Asp.net+Vue2构建简单记账WebApp之六（vue.js构建记账统计页面）
源码下载

现在ABP更新到3.0.0 采用了Core2.0 技术。需要vs2017进行编译

一、ABP简介

ABP是“ASP.NET Boilerplate Project (ASP.NET样板项目)”的简称。
ASP.NET Boilerplate是一个用最佳实践和流行技术开发现代WEB应用程序的新起点，它旨在成为一个通用的WEB应用程序框架和项目模板。详情可以访问官网：http://www.aspnetboilerplate.com/

二、下载模版

访问：https://aspnetboilerplate.com/Templates 下载自己的项目模版。
这里写图片描述

解压，打开项目
这里写图片描述
其实这个框架很多内容已经封装在dll里面，项目结构大概就是这样。

core里面放一些基础的东西。
EntityFramework里面放数据访问对象及仓储，
Application里面通常写服务给web和webapi调用
web，webapi就是项目的出口最终展现给第三方或者用户的地方

三、赶紧试试能用不

1、选择解决方案-还原NuGet包
这里写图片描述

2、修改数据连接（这里需要自己有数据库服务）
web.config下面修改连接，

  <connectionStrings>    <add name="Default" connectionString="Server=.; Database=MyBill; Trusted_Connection=True;" providerName="System.Data.SqlClient" />  </connectionStrings>

3、数据迁移
将web项目设为启动项目然后在程序管理控制台默认项目选择EntityFramework，输入无法将update-database 回车。
这里写图片描述
启动看看用户名admin，密码123qwe

界面风格还是很漂亮的。

四、添加我们自己的东西

1、添加实体
在core里添加如下两个类：
这里写图片描述

using Abp.Domain.Entities;namespace MyBill.Bills{    /// <summary>    /// 记账类型    /// </summary>    public class BillType : Entity    {        /// <summary>        /// 名称        /// </summary>        public string Name { get; set; }        /// <summary>        /// font图标 样式名称        /// </summary>        public string FontStyle { get; set; }        /// <summary>        /// 图片地址        /// </summary>        public string ImgUrl { get; set; }        /// <summary>        /// 是否是收入        /// </summary>        public bool IsCountIn { get; set; }    }}

using Abp.Domain.Entities;using Abp.Domain.Entities.Auditing;using System;using System.ComponentModel.DataAnnotations.Schema;namespace MyBill.Bills{    /// <summary>    /// 账单数据    /// </summary>    public class Bill : Entity, IHasCreationTime    {        /// <summary>        /// 创建者        /// </summary>        public string CreatorUser { get; set; }        /// <summary>        /// 创建时间        /// </summary>        public DateTime CreationTime { get; set; }        /// <summary>        /// 记账类型        /// </summary>        public int BillTypeId { get; set; }        [ForeignKey("BillTypeId")]        public BillType BillType { get; set; }        /// <summary>        /// 记账金额        /// </summary>        public decimal Money { get; set; }        /// <summary>        /// 描述        /// </summary>        public string Des { get; set; }    }}

2、添加数据集
在如下文件的最后面添加数据集：
这里写图片描述

        public MyBillDbContext(DbConnection existingConnection, bool contextOwnsConnection)         : base(existingConnection, contextOwnsConnection)        {        }        public IDbSet<Bill> Bills { get; set; } // 账单数据集        public IDbSet<BillType> BillTypes { get; set; } // 记账类型数据集

我想给数据迁移时给BillType一些初始数据怎么办呢？
在这里添加如下文件（可以参考同目录下其他文件写法）
这里写图片描述

using System.Linq;using MyBill.EntityFramework;using System.Collections.Generic;using MyBill.Bills;namespace MyBill.Migrations.SeedData{    /// <summary>    /// 初始化数据库中 billType数据    /// </summary>    public class DefaultBillTypeCreator    {        private readonly MyBillDbContext _context;        public DefaultBillTypeCreator(MyBillDbContext context)        {            _context = context;        }        public void Create()        {            CreateBillTypes();        }        private void CreateBillTypes()        {            List<BillType> list = new List<BillType> {                new BillType { IsCountIn= false, Name = "食物",FontStyle="fa-cutlery"},                new BillType { IsCountIn= false, Name = "衣物",FontStyle="fa-columns"},                new BillType { IsCountIn= false, Name = "生活日用",FontStyle="fa-umbrella"},                new BillType { IsCountIn= false, Name = "交通出行",FontStyle="fa-car"},                new BillType { IsCountIn= false, Name = "旅游",FontStyle="fa-fighter-jet"},                new BillType { IsCountIn= false, Name = "节日礼物",FontStyle="fa-gift"},                new BillType { IsCountIn= false, Name = "聚会聚餐",FontStyle="fa-users"},                new BillType { IsCountIn= false, Name = "医疗健康",FontStyle="fa-plus-square"},                new BillType { IsCountIn= false, Name = "宠物",FontStyle="fa-github-alt"},                new BillType { IsCountIn= false, Name = "书籍资料",FontStyle="fa-file-excel-o"},                new BillType { IsCountIn= false, Name = "工具",FontStyle="fa-wrench"},                new BillType { IsCountIn= false, Name = "运动",FontStyle="fa-frown-o"},                new BillType { IsCountIn= false, Name = "培训学习",FontStyle="fa-pied-piper-alt"},                new BillType { IsCountIn= false, Name = "孩子",FontStyle="fa-child"},                new BillType { IsCountIn= false, Name = "住房居家",FontStyle="fa-home"},                new BillType { IsCountIn= false, Name = "电影演出",FontStyle="fa-film"},                new BillType { IsCountIn= false, Name = "休闲娱乐",FontStyle="fa-coffee"},                new BillType { IsCountIn= false, Name = "红包分子",FontStyle="fa-bomb"},                new BillType { IsCountIn= false, Name = "借款",FontStyle="fa-skype"},                new BillType { IsCountIn= false, Name = "其他",FontStyle="fa-globe"},            };            foreach (var billType in list)            {                AddBillTypesIfNotExists(billType);            }        }        private void AddBillTypesIfNotExists(BillType billType)        {            if (_context.BillTypes.Any(l => l.Name == billType.Name))            {                return;            }            _context.BillTypes.Add(billType);            _context.SaveChanges();        }    }}

修改Configuration 中 seed（）方法

        protected override void Seed(MyBill.EntityFramework.MyBillDbContext context)        {            context.DisableAllFilters();            if (Tenant == null)            {                //Host seed                new InitialHostDbBuilder(context).Create();                //Default tenant seed (in host database).                new DefaultTenantCreator(context).Create();                new TenantRoleAndUserBuilder(context, 1).Create();            }            else            {                //You can add seed for tenant databases and use Tenant property...            }            new DefaultBillTypeCreator(context).Create();// 添加自己初始数据执行            context.SaveChanges();        }

执行 Add-Migration Add_Bills 添加迁移
这里写图片描述
执行 update-database 迁移数据
打开数据库可以看见
新建的表

3、写服务
服务写在Application中，创建如下文件

using System;namespace MyBill.Bills.Dto{    public class BillDto    {        public int Id { get; set; }        /// <summary>        /// 创建时间        /// </summary>        public DateTime CreationTime { get; set; }        /// <summary>        /// 记账金额        /// </summary>        public decimal Money { get; set; }        /// <summary>        /// 名称        /// </summary>        public string Name { get; set; }        /// <summary>        /// font图标 样式名称        /// </summary>        public string FontStyle { get; set; }    }}

namespace MyBill.Bills.Dto{    public class ChartNumDto    {        public string Name { get; set; }        public decimal Value { get; set; }    }}

using Abp.AutoMapper;using System;using System.ComponentModel.DataAnnotations;namespace MyBill.Bills.Dto{    [AutoMapTo(typeof(Bill))]    public class CreateBillDto    {        /// <summary>        /// 创建者        /// </summary>        public string CreatorUser { get; set; }        /// <summary>        /// 创建时间        /// </summary>        public DateTime CreationTime { get; set; }        /// <summary>        /// 记账类型        /// </summary>        [Required]        public int BillTypeId { get; set; }        /// <summary>        /// 记账金额        /// </summary>        [Required]        public decimal Money { get; set; }        /// <summary>        /// 描述        /// </summary>        public string Des { get; set; }        public CreateBillDto()        {            this.CreationTime = DateTime.Now;        }    }}

using Abp.Application.Services.Dto;using System;using System.ComponentModel.DataAnnotations;namespace MyBill.Bills.Dto{    public class GetBillDto : IPagedResultRequest, ISortedResultRequest    {        [Range(0, 1000)]        public int MaxResultCount { get; set; }        public int SkipCount { get; set; }        public string Sorting { get; set; }        public DateTime? Date { get; set; }        public string User { get; set; }        /// <summary>        /// 数据类型，0 按年，1按月,        /// </summary>        public int Type { get; set; }        /// <summary>        /// 分组依据 0，消费类型，1 月        /// </summary>        public int GroupBy { get; set; }    }}

using Abp.Application.Services;using Abp.Application.Services.Dto;using MyBill.Bills.Dto;using System.Collections.Generic;using System.Threading.Tasks;namespace MyBill.Bills{    public interface IBillAppServer : IApplicationService    {        /// <summary>        /// 添加一条记录        /// </summary>        /// <param name="input"></param>        /// <returns></returns>        Task CreatBill(CreateBillDto input);        /// <summary>        /// 删除一条记录        /// </summary>        /// <param name="key"></param>        Task DeleteBill(int key);        /// <summary>        /// 获取消费类型        /// </summary>        /// <returns></returns>        IList<BillType> GetBillType();        /// <summary>        /// 获取统计信息        /// </summary>        /// <param name="date">时间</param>        /// <param name="type">类型，0 按年统计，1 按月统计</param>        /// <returns></returns>        IList<ChartNumDto> GetCount(GetBillDto input);        /// <summary>        /// 获取列表        /// </summary>        /// <param name="getBillDto"></param>        /// <returns></returns>        PagedResultDto<BillDto> GetBills(GetBillDto input);        /// <summary>        /// 获取记账总额        /// </summary>        /// <param name="input"></param>        /// <returns></returns>        decimal GetTotallCount(GetBillDto input);    }}

using Abp;using Abp.Application.Services.Dto;using Abp.Domain.Repositories;using MyBill.Bills.Dto;using System;using System.Collections.Generic;using System.Linq;using Abp.Linq.Extensions;using System.Threading.Tasks;using System.Data.Entity;namespace MyBill.Bills{    public class BillAppServer : AbpServiceBase, IBillAppServer    {        private readonly IRepository<Bill> _billRepository;        private readonly IRepository<BillType> _billTypeRepository;        public BillAppServer(IRepository<Bill> billRepository,            IRepository<BillType> billTypeRepository            )        {            _billRepository = billRepository;            _billTypeRepository = billTypeRepository;        }        public async Task DeleteBill(int key)        {            await _billRepository.DeleteAsync(key);        }        public async Task CreatBill(CreateBillDto input)        {            var bill = ObjectMapper.Map<Bill>(input);            await _billRepository.InsertAsync(bill);        }        public IList<BillType> GetBillType()        {            return _billTypeRepository.GetAllList();        }        public IList<ChartNumDto> GetCount(GetBillDto input)        {            if (!input.Date.HasValue) return null;            string date = "";            DateTime startDate, endDate;            if (input.Type == 1)            {                date = input.Date.Value.ToString("yyyy-MM");                startDate = DateTime.Parse(date);                endDate = startDate.AddMonths(1);            }            else            {                date = input.Date.Value.Year + "-01-01";                startDate = DateTime.Parse(date);                endDate = startDate.AddYears(1);            }            if (input.GroupBy == 1)            {                var bills = _billRepository.GetAll().Where(m => m.CreationTime >= startDate && m.CreationTime < endDate && m.CreatorUser == input.User);                return bills.GroupBy(m => m.CreationTime.Month).Select(m => new ChartNumDto                {                    Name = m.Key + "月",                    Value = m.Sum(n => n.Money)                }).ToList();            }            else            {                var bills = _billRepository.GetAll().Where(m => m.CreationTime >= startDate && m.CreationTime < endDate && m.CreatorUser == input.User).Include(m => m.BillType);                return bills.GroupBy(m => m.BillType.Name).Select(m => new ChartNumDto                {                    Name = m.Key,                    Value = m.Sum(n => n.Money)                }).ToList();            }        }        public PagedResultDto<BillDto> GetBills(GetBillDto input)        {            if (!input.Date.HasValue) return null;            var date = input.Date.Value.ToString("yyyy-MM");            var startDate = DateTime.Parse(date);            var endDate = startDate.AddMonths(1);            var bills = _billRepository.GetAll().Where(m => m.CreationTime >= startDate && m.CreationTime < endDate && m.CreatorUser == input.User);            var count = bills.Count();            var billsPage = bills                                        .Include(q => q.BillType)                                        .OrderBy(q => q.CreationTime)                                        .PageBy(input)                                        .Select(m => new BillDto                                        {                                            Name = m.BillType.Name,                                            FontStyle = m.BillType.FontStyle,                                            Money = m.Money,                                            Id = m.Id,                                            CreationTime = m.CreationTime                                        })                                        .ToList();            return new PagedResultDto<BillDto>            {                TotalCount = count,                Items = billsPage            };        }        public decimal GetTotallCount(GetBillDto input)        {            var bills = _billRepository.GetAll().Where(m => m.CreatorUser == input.User);            return bills.Sum(m => m.Money);        }    }}

abp封装的有公共的仓储IRepository，所以一般不用单独写仓储了。

4、写controller
在web项目中添加
这里写图片描述

using Abp.Web.Security.AntiForgery;using MyBill.Bills;using MyBill.Bills.Dto;using System;using System.Threading.Tasks;using System.Web.Mvc;namespace MyBill.Web.Controllers{    public class BillController : MyBillControllerBase    {        private readonly IBillAppServer _billAppService;        public BillController(IBillAppServer billAppService)        {            _billAppService = billAppService;        }        [DisableAbpAntiForgeryTokenValidation]        public ActionResult GetBillType()        {            try            {                var result = _billAppService.GetBillType();                return Json(new { result = true, data = result }, JsonRequestBehavior.AllowGet);            }            catch (Exception e)            {                return Json(new { result = false, data = e.Message }, JsonRequestBehavior.AllowGet);            }        }        [DisableAbpAntiForgeryTokenValidation]        public ActionResult GetBills(GetBillDto input)        {            input.MaxResultCount = 10;            try            {                var result = _billAppService.GetBills(input);                return Json(new { result = true, data = result }, JsonRequestBehavior.AllowGet);            }            catch (Exception e)            {                return Json(new { result = false, data = e.Message }, JsonRequestBehavior.AllowGet);            }        }        [DisableAbpAntiForgeryTokenValidation]        public ActionResult GetCount(GetBillDto input)        {            try            {                var result = _billAppService.GetCount(input);                return Json(new { result = true, data = result }, JsonRequestBehavior.AllowGet);            }            catch (Exception e)            {                return Json(new { result = false, data = e.Message }, JsonRequestBehavior.AllowGet);            }        }        [DisableAbpAntiForgeryTokenValidation]        public async Task<JsonResult> AddBills(CreateBillDto bill)        {            try            {                if (string.IsNullOrEmpty(bill.CreatorUser)) bill.CreatorUser = "1";                await _billAppService.CreatBill(bill);                return Json(new { result = true, data = "success" }, JsonRequestBehavior.AllowGet);            }            catch (Exception e)            {                return Json(new { result = false, data = e.Message }, JsonRequestBehavior.AllowGet);            }        }        [DisableAbpAntiForgeryTokenValidation]        public ActionResult GetTotallCount(GetBillDto input)        {            try            {                var result = _billAppService.GetTotallCount(input);                return Json(new { result = true, data = result }, JsonRequestBehavior.AllowGet);            }            catch (Exception e)            {                return Json(new { result = false, data = e.Message }, JsonRequestBehavior.AllowGet);            }        }        [DisableAbpAntiForgeryTokenValidation]        public async Task<ActionResult> DeleteBill(int key)        {            try            {                await _billAppService.DeleteBill(key);                return Json(new { result = true, data = "" }, JsonRequestBehavior.AllowGet);            }            catch (Exception e)            {                return Json(new { result = false, data = e.Message }, JsonRequestBehavior.AllowGet);            }        }    }}

注意添加[DisableAbpAntiForgeryTokenValidation]标签，是因为abp框架对应post请求有防伪验证，加上这个标签可以不用防伪验证，不然需要post请求时修改协议头，或者使用abp自己封装的ajax请求。

5、试试controler
地址栏输入对应地址；
这里写图片描述

五、后台完成

把接口api写好扔给前台吧
1、获取记账类型：
路径：/bill/GetBillType
方法：get
参数：无
返回：正确 {“result”:true,”data”：[]} 错误{“result”:false,”data”：[]}
其中[] 表示数组。数组元素参考：{“name”:”食物”,”fontStyle”:null,”imgUrl”:null,”isCountIn”:false,”id”:1}
2、添加账单数据：
路径：/bill/AddBills
方法：post
参数：{CreatorUser：用户的名称或id标识，BillTypeId：方法1中返回数据的id，Money：记账金额，Des：描述，可不要}
返回：成功{ result = true, data = “success” } 失败：{ result = false, data = 错误内容 }
3，获取账单数据：
路径：/bill/GetBills
方法：get
参数：{User：用户的名称或id标识，Date：数据的时间，Type：‘数据类型0表示一年的数据，1表示一个月的数据根据’，SkipCount：跳过前多少数据用于分页}
返回：正确 {“result”:true,”data”：{TotalCount：数据总数，items：[]}} 错误{“result”:false,”data”：错误内容}
其中[] 表示数组。数组元素参考：{“id”:1,”creationTime”:”2017-09-12T13:13:32.03”,”money”:123.00,”name”:”生活日用”,”fontStyle”:null}]}
4，删除账单数据：
路径：/bill/DeleteBill
方法：post
参数：{key：方法3中返回数据的id}
返回：成功{ result = true, data = “success” } 失败：{ result = false, data = 错误内容 }
5，获取总的记账数
路径：/bill/GetTotallCount
方法：get
参数：{CreatorUser：用户的名称或id标识}
返回：成功{ result = true, data = 数值 } 失败：{ result = false, data = 错误内容 }
6，获取统计数据
路径：/bill/GetCount
方法：get
参数：{User：用户的名称或id标识，Date：数据的时间，Type：‘数据类型0表示一年的数据，1表示一个月的数据根据’，GroupBy：分组依据 0，消费类型，1 月}
返回：成功{ result = true, data = [] } 失败：{ result = false, data = 错误内容 }
其中[] 表示数组为图表所需数据。数组元素参考：{“name”:”生活日用”,”value”:123.00}] 或者{“name”:”9月”,”value”:123.00}]

阅读全文

0 0