一.前言 前段时间写博客分享和介绍了阿里云的UI框架NG-ZORRO(博客请查看:http://www.cnblogs.com/donaldtdz/p/7892960.html),结合近段时间对.Net开源框架ABP的学习.完成将ABP前端框架替换成阿里云的NG-ZORRO. 二.替换说明 ABP版本采用的v3.3 .Net Core版本 Angular 版本5.0 三.注意事项 1.angular 2版本要5.0以上 2.需要安装 "abp-ng2-module": "^1

VUE+Element 前端是一个纯粹的前端处理,前面介绍了很多都是Vue+Element开发的基础,从本章随笔开始,就需要进入深水区了,需要结合ABP框架使用(如果不知道,请自行补习一下我的随笔:ABP框架使用),ABP框架作为后端,是一个非常不错的技术方向,但是前端再使用Asp.NET 进行开发的话,虽然会快捷一点,不过可能显得有点累赘了,因此BS的前端选项采用Vue+Element来做管理(后续可能会视情况加入Vue+AntDesign),CS前端我已经完成了使用Winform+ABP的模

在前面随笔介绍了<在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理>的处理,有的时候,我们在流程中或者一些文件签署的时候,需要签上自己的大名,一般通过签名表的方式(银行很常见)实现电子签名的处理.本篇随笔介绍如何基于Vue &Element前端的技术实现电子签名的处理. 1.实现电子签名的组件 我们知道,很多常见的功能,我们都会引入对应的组件来做页面功能,会非常简洁方便,毕竟不用重复制造轮子. 我们在Github上可以找到很多基于Vue前端技

Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js.简单地说,只要你会Moment.js,那么你就会Day.js! 但是我们知道的,Moment.js 的大小是200多KB,而Day.js的大小却是2 KB,瘦身很多但却几乎拥有同样强大的 API. 现在框架基本上都是多端应用的了,所以在ABP框架中整合Winform管理端.Vue&element的

在一些内部OA或者流转的文件,或者给一些客户的报价文件.合同,或者一些医院出示的给保险机构的病历资料等,有时候可能都希望快速的使用电子签章的处理方式来给文件盖上特定的印章,本篇随笔介绍基于Vue&Element的前端项目采用第三方组件 vue-drag-resize和图片转换Base64的方式实现图片印章的盖章处理. 1.图片转换为Base64处理 图片转换为Base64编码可以通过在线工具的转换方式实现图片转Base64编码,网上很多在线的处理,百度一下即可. 如:https://c.runo

在前面随笔<循序渐进VUE+Element 前端应用开发(12)--- 整合ABP框架的前端登录处理>简单的介绍了一个结合ABP后端的登陆接口实现前端系统登陆的功能,本篇随笔继续深化这一主题,着重介绍基于ABP后端接口信息,实现对前端界面的开发工作. ABP(ASP.NET Boilerplate)框架主要是基于.net core 进行的后端Web API的开发,结合Swagger的管理界面我们可以看到发布的 API 的接口明细信息,这样前端技术人员可以很容易整合前端的API应用.Vue +

打开ABP的事例项目SimpleTaskSystem.WebSpaAngular 中LayoutView <!-- Dynamic scripts of ABP system (They are created on runtime and can not be bundled) --> <!-- 添加对ABP系统运行时动态创建的脚本文件的引用 --> <script src="~/api/AbpServiceProxies/GetAll?type=angular&

目录 1.介绍abp 2.abp如何工作 3.运行Domo 3.1官网点击 创建Demo 3.2 配置NetCore,选择Vue 3.3 输入系统名称验证码 4.官方手册文档 5.VUE项目 6. Swagger用户名密码登录 6.1 获取所有用户接口 7.Abp vNext下一代 8. Abp 第三代 9.前端 9.1 依赖包安装 9.2 运行前端代码 9.3 登录截图 9.4 用户管理截图 功能 思想 工具 数据迁移 Angular版本 1.介绍abp 全称:aspnetboilerplat

在前面随笔<循序渐进VUE+Element 前端应用开发(12)--- 整合ABP框架的前端登录处理>介绍了一个系统最初接触到的前端登录处理的实现,但往往对整个系统来说,一般会有很多业务对象,而每个业务对象的API接口又有很多,不过简单来说也就是常规的增删改查,以及一些自定义的接口,通用都比较有规律性.而本身我们这个VUE+Element 前端应用就是针对ABP框架的业务对象,因此前端的业务对象接口也是比较统一的,那么可以考虑在前端中对后端API接口调用进行封装,引入ES6的方式进行前端API

在前面随笔<循序渐进VUE+Element 前端应用开发(15)--- 用户管理模块的处理>中介绍了用户管理模块的内容,包括用户列表的展示,各种查看.编辑.新增对话框的界面处理和后台数据处理操作,本篇随笔继续深化Vue + Element权限管理模块管理的内容,介绍组织机构和角色管理模块的处理,通过组织机构和角色管理模块的介绍,使得我们了解界面组件化模块的开发思路和做法,提高我们界面设计的技巧,并减少代码的复杂性,提高界面代码的可读性,同时也是利用组件的复用管理. 1.组织机构管理模块界面 组

在权限管理系统中,菜单也属于权限控制的一个资源,应该直接应用于角色,和权限功能点一样,属于角色控制的一环.不同角色用户,登录系统后,出现的系统菜单是不同的.在VUE+Element 前端中,我们菜单结合路由集合,实现可访问路由的过滤,也就实现了对应角色菜单的展示和可访问路由的控制,详细可以参考随笔<循序渐进VUE+Element 前端应用开发(3)--- 动态菜单和路由的关联处理>,本篇随笔主要介绍菜单管理模块的界面和相关的实现逻辑. 1.菜单资源及管理界面介绍 前面介绍过,权限管理一般都会涉

在一个业务管理系统中,如果我们需要实现权限控制功能,我们需要定义好对应的权限功能点,然后在界面中对界面元素的功能点进行绑定,这样就可以在后台动态分配权限进行动态控制了,一般来说,权限功能点是针对角色进行控制的,也就是简称RBAC(Role Based Access Control).在前面随笔中,我们介绍了菜单资源,在权限管理系统中,菜单也是属于权限控制的一个资源,其也是作用于角色层面上的.本篇随笔介绍功能点管理及权限控制,功能点是作为一个业务对象数据进行管理,在角色范畴上进行分配,而在界面元素

循序渐进VUE+Element 前端应用开发的系列文章中,前面介绍了系统各个功能的处理实现,本篇随笔从一个主线上介绍前后端开发的整合,让我们从ABP框架后端的查询接口的处理,前端API接口调用的封装,以及前端Element界面的整个调用过程进行一个完整的介绍. 我们前面介绍了Vue+Element前端的接口是调用后端的ABP框架发布的API接口服务,API接口服务通过Swagger公布对应的接口信息供我们前端开发使用,提供非常好的便利:而我们使用Vue+Element的前端框架,也是需要对后端接

VUE+Element 前端应用,比较不错的一点就是界面组件化,我们可以根据重用的指导方针,把界面内容拆分为各个不同的组合,每一个模块可以是一个组件,也可以是多个组件的综合体,而且这一个过程非常方便.组件封装的目的就是为了能够更加便捷.快速的进行业务功能的开发.组件(component)是vue的最强大功能之一,组件可以实现一些类似功能的复用及与其它业务逻辑的解耦.本篇随笔介绍前端框架中常用到的一些组件封装处理,用于简化界面.隐藏实现细节的目的. 1.组件封装的需要 在我们开发一个主要界面的时候

在我们使用Vue+Element开发前端的时候,往往涉及到很多界面组件的使用,其中很多直接采用Element官方的案例即可,有些则是在这个基础上封装更好利用.更少代码的组件:另外有些则是直接采用第三方开发好的组件,目的就是实现所需功能外,尽量简化界面使用代码.本篇随笔介绍在我的项目中经常用到的各种界面组件和它的界面效果,以便在实际开发中进行相应的参考,提高开发效率. 本篇继续上一篇随笔<循序渐进VUE+Element 前端应用开发(25)--- 各种界面组件的使用(1)>,对界面控件进行进一步

在我们一些系统里面,有时候会需要一些让用户自定义的数据信息,一般这些可以使用扩展JSON进行存储,不过每个业务表的显示项目可能不一样,因此需要根据不同的表单进行设计,然后进行对应的数据存储.本篇随笔结合基于Vue+Element实现动态表单的设计.数据录入存储的相关操作. 1.动态表单的设计 动态表单的设计一般是基于某个能够动态设计界面的方式实现的,界面上定义对应的说明以及录入数据的方式,如标签后面加上文本,或者多文本等方式.由于我们后台是强类型的数据实体,后端一般不采用动态修改数据库字段的方式

多租户 如果系统需要支持多租户,那么最好事先定义好多租户的存储部署方式,Abp提供了几种方式,根据需要选择,每一个用户身份认证与权限验证都需要完全的隔离 这里设计的权限数据全部存储在缓存中,每个租户单独建立缓存Key,见权限系统服务章节介绍. 用户accesstoken accesstoken的定义就不多的介绍了,Abp其实就是直接使用微软IdentityModel这套组件,并且zero项目还直接使用的微软的用户角色相关管理,这里面性能存在一定的问题,而且使用相对比较复杂,还不利于扩展,其实功能

在我们很多模块里面,都需要使用到一些诸如图片.Excel文件.PDF文件等附件的管理,一般我们倾向于把它独立为一个公用的附件管理模块,这样可以有效的统一管理附件的信息.本篇随笔介绍附件内容的管理,包括可以对图片进行预览,对其他文件实现信息的查看和下载等操作,以及后端提供对应的附件上传等处理. 1.附件管理的界面 和其他模块一样,我们可以对附件记录表里面的信息进行管理,一般情况下,我们管理的附件都是诸如图片.Excel文件.PDF文件等附件的管理. 附件表是一个综合管理这些文件的记录表,虽然附件一

在一般系统开发中,我们一般要借助于高度定制化的代码生成工具,用于统一代码风,节省开发时间,提高开发效率.不同的项目,它的项目不同分层的基类定义不同,我们需要在框架基类的基础上扩展我们的业务类代码,尽量根据已有数据库设计的信息,完整.详细的重现我们需要的编码工作,一方面引入必要的关系和代码,一方面保留一定的注释代码供了解使用,站在开发者的角度上思考代码如何编写,这样才能够快速.高效的增量化开发我们的业务表应用模块. 1.数据库的设计 一般情况下,我们往往喜欢基于数据库建模我们的业务表存储内容,数据

基于Metronic的Bootstrap开发框架是我们稍早一点的框架产品,界面部分采用较新的Bootstrap技术,框架后台数据库支持Oracle.SqlServer.MySql.PostgreSQL.DB2.Sqlite.Access等常规数据库,可通过配置进行自由切换,使用Enterprise Library模块进行数据访问的控制的.Bootstrap开发框架的页面以及后台代码,通过代码生成工具Database2Sharp进行快速开发,实现整体性开发的最大效率提高. Bootstrap开发框

关于 Adblock Plus for firefox(以下简称 ABP)的一些笔记. 安装好 ABP,将如下代码保存为 html 文件,然后在 firefox 中打开: <p id="ad-banner">Hello World</p> 页面空白,原因是 ABP 将该 DOM 元素识别为了广告元素(谁叫你 id 带上 ad 呢).查看该元素的样式: #ad-banner { -moz-binding: url("about:abp-elemhideh