这一年经历了许多的困难,庆幸的是许多人对我伸出援手让我度过难关。基于于助人为乐,以及对自身技术的总结提高,我决定把这几年来专注于管理系统的开发经验,整理成一个方案,并将其前端的绝大部分代码开源出来。
DSN-UI是基于Vue3 + Typescript + Vue Router 4 + Pinia + Element Plus再封装的前端方案,它能够让你更快速地搭建自己的后台管理系统,避免花过多的时间编写一些组件和后台的基础页面。同时它没有使用Element Plus自带的icon库,而是选择了Font Awesome 5作为icon库。
目前DSN-UI并没有完全实现用户登录等具体的业务,需要使用者自己进行对接。
由于需要请求数据,才能说明一些组件的用法,因此通过Koa搭建后端,模拟出提供数据的api以供使用。
DSN-UI有可以满足一定的自适应(Responsive)需求。
组件说明会说明一些重要以及方便的组件,剩余的一些小组件需要使用者自己根据例子研究源码。
打开终端,进入uaa-ui目录,安装依赖后执行npm run serve
即可启动dsn-ui
打开终端,进入uaa-serve目录,安装依赖后执行npm run serve
即可启动Koa后端
不同的功能节点分别展示了三个不同的表格组件,源码当中展示了组件的用法。
因为是基于ts,列配置的参数可以参考接口的属性。
点击权限的修改按钮,进入权限的详情页
简单代码即可使用