isabella232 / sula-real

🎉 Use sula in real.

sula-real

特点

• 💻 真实还原开发场景，贴近项目开发代码，非理想才最 real
• 🚀 选取前端中台最典型场景开发，基于 sula-templates 高效开发
• 🥗 除 sula 外，仅依赖 @umijs/preset-react 和 @ant-design/pro-layout

主题

import { IrisBlue } from './theme';

export default {
  theme: IrisBlue, // GeekBlue
};

IrisBlue

启动

$ mkdir real-demo

$ cd real-demo

// cnpm i -g degit
$ degit https://github.com/umijs/sula-real.git

$ npm i

$ npm start

目录

各页面特点

登录

Username: admin(admin权限) or 任意值(其他权限)

password： sula

图表

基于sula-charts开发的dashboard页面

事件页

列表页

1. 高级搜索 + 上传下载功能 + 按钮权限
2. 弹框表单

详情页

1. 标签详情页

流程页

列表页

1. 初始搜索条件
2. 初始分页设置
3. 状态操作组件

表单页

1. 分组卡片布局
2. 表单远程数据源关联
3. 图片上传
4. 启动编辑按钮

详情页

1. 自定义底部按钮

活动页

列表页

1. 批量删除
2. 下拉菜单收起操作按钮
3. 搜索条件同步url
4. 过滤插件

表单页

1. 分步表单
2. 日期插件
3. 表单关联控制 / 组关联
4. 表单任意布局
5. 自定义容器组件

详情页

1. 分组卡片展示

发布页

列表页

1. 分步搜索列表
2. 抽屉表单