上一篇说到,因为有新朋友加入,对前端开发有了新的要求。原来基于 Bootstrap 的 UI 就不要了。在网上(其实是 GitHub 上)逛了几圈,最后使用了 antd-admin 这个框架做为基础模板,然后根据悟空 CRM 的特色进行了一些改变:

在原来的 antd-admin 的页面里,应该是属于 SPA 式的后台应用的。而 CRM 这样比较大的系统,完全 SPA 可能有点太大了。所以我就把第个模块拆出来做为一组 pages,这一组 pages 构成一个 SPA。这样,就需要在原来的右上导航条里添加一个主导航菜单区。而右边则常用的消息 badge,比如站内信,比如日程。

对于一组 pages 构成的一个 SPA,二级导航会放在左边的导航条上。当然,右边的一大块区域就是主功能区了。一般是表格,也会有一些 modal 和图什么的。

为了方便以后查看,我还创建了 wiki,对页面的设计做了对比阐述。项目的 project 功能也用起来了。

CoreCRM 开发实录 —— 基于 AntDesign 的新 UI的更多相关文章

  1. CoreCRM 开发实录——开始之新项目的技术选择

    2016年11月,接受了一个工作,是对"悟空CRM"进行一些修补.这是一个不错的 CRM,开源,并提供一个 SaaS 的服务.正好微软的 .NET Core 和 ASP.NET C ...

  2. CoreCRM 开发实录 —— 前后端分离的重构

    虽然2月初就回来了,可 CoreCRM 一直到5月才开始恢复开发,期间是各种生活中的意外和不方便. 1. 为什么要重构 首先是一件很值得高兴的事情:CoreCRM 有了第一位 contributor! ...

  3. CoreCRM 开发实录 —— 单元测试、测试驱动开发和在线服务

    测试不是问题,问题是怎么测试. ## 单元测试 我认为单元测试已经是无可争议的最佳开发实践之一.但是很多人并不同意这个观点.他们的说法无非是:写测试需要花很多时间,需求又经常变动,一但变动,一大片测试 ...

  4. CoreCRM 开发实录 —— Profile

    再简单的功能,也需要一坨代码的支持.Profile 的编辑功能主要就是修改个人的信息.比如用户名.头像.性别.电话--虽然只是一个编辑界面,但添加下来,涉及了6个文件的修改和7个新创建的文件.各种生成 ...

  5. CoreCRM 开发实录——Travis-CI 实现 .NET Core 程度在 macOS 上的构建和测试 [无水干货]

    上一篇文章我提到:为了使用"国货",我把 Linux 上的构建和测试委托给了 DaoCloud,而 Travis-CI 不能放着不用啊.还好,这货支持 macOS 系统.所以就把 ...

  6. CoreCRM 开发实录——想用国货不容易

    昨天(2016年12月29日)发了开始开发的文章.本来晚上准备在 Coding.NET 上添加几个任务开始搞起了.可是真的开始用的时候才发现:Coding.NET 的任务功能只针对私有的任务开放.我想 ...

  7. CoreCRM 开发实录 —— 单元测试之 Mock UserManager 和 SignInManager

    单元测试的核心就是:只测试眼前的逻辑.这就要求所有的依赖项都要使用仿类来代替,也就是所谓的 Mock Object.在测试 ProfileRepository 和 AccountController ...

  8. 认识Web前端、Web后端、桌面app和移动app新开发模式 - 基于Node.js环境和VS Code工具

    认识Web.桌面和移动app新开发模式 - 基于Node.js环境和VS Code工具 一.开发环境的搭建(基于win10) 1.安装node.js和npm 到node.js官网下载安装包(包含npm ...

  9. DailyTick 开发实录 —— UI 设计

    上次的文章中描述了 DailyTick 的设计理念.经过两周左右的设计和开发,现在 DailyTick 的主要 UI 已经完成了原型的设计和初步的实现.既然是原型,当然看起来就有点粗糙. 主 UI 主 ...

随机推荐

  1. while循环 格式化输出 密码本 编码的初识

    第二天课程整理 while 循环 why : while ' 循环' 的意思 what : while 无限循环 how : 1.基本结构 while + 条件 循环的代码 初识循环 while tr ...

  2. NHibernate删除数据时遇到deleted object would be re-saved by cascade级联问题

    今天在处理数据时遇到了这个问题,数据是一对多的关系,A包含多个B,想将某个B从A中移除,在保存时抛出如标题的问题,查找了下资料得知:由于在配置文件中设置了cascade为all,A和B存在级联关系,那 ...

  3. Liferay7 BPM门户开发之17: Portlet 生命周期

    Portlet 生命周期 init() =〉 render() =〉 processAction() =〉 processEvent() =〉 serveResource() =〉destroy() ...

  4. Mac下命令行tree生成文件树

    不像Windows,Mac环境本身是没有tree命令的,但可以后天呐~ 1.下载文件包并将其放在系统目录下(本人存放路径为/Users/) https://homebrew.bintray.com/b ...

  5. .net core使用NLog+Elasticsearch记录日志

    在微服务或分布式系统中,如果将日志作为文件输出,查看系统日志将非常不便:如果将日志保存到数据库中,又不能进行全文搜索.在这里我们将日志输出到ElasticSearch中,借助Kibana再查找日志. ...

  6. 第四章 客户端负载均衡:Spring Cloud Ribbon

    spring cloud ribbon 是一个基于 HTTP 和 TCP 的客户端负载均衡工具,它基于Netflix Ribbon 实现.通过Spring Cloud 的封装,可以轻松的将面向服务的R ...

  7. redis的安装使用以及在python中操作redis

    一.Redis介绍: Redis可以看作是一个key-value的存储系统,它为我们提供了丰富的数据结构,包括lists,sets,ordered sets和hashes.还包括了对这些数据结构的丰富 ...

  8. Appium定位方式总结

    通过appium-desktop定位元素 ClassName Android Android的class属性对应ClassName定位方式,ClassName一般都是会重复的,可以通过index来获取 ...

  9. bash回收站

    通过替换rm命令使被删除的文件或文件夹被移动到-/.delete/日期文件夹,方便恢复 可以定期手动删除.delete文件夹或通过额外配置定期删除减少空间占用 # for rm {{ del_time ...

  10. Mysql-8 配置主从复制(基于二进制日志)

    目录 1. 实验环境 2. 安装MySQL8 3. 配置主从复制 4. 配置复制用户 5. 数据的同步 6. 配置从节点 7. 测试主从复制 1. 实验环境 System IP Host CentOS ...