15 Star 35 Fork 17

京东零售 / CCMS-ANTD

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
README.md 2.38 KB
一键复制 编辑 原始数据 按行查看 历史
wangmaixi 提交于 2023-03-14 06:32 . docs: 更新文档地址

CCMS

🌏 关于CCMS

CCMS是一套完善、通用的可配置化的方案。通过配置化自动生成中后台(CMS)界面。
CCMS将内容管理系统前端页面抽象为在若干API进行流转的系统。进一步将对后台API的请求按照逻辑类型划分为表单提交、列表展示、查询数据等类型。通过JSON数据格式描述各API请求的接口信息、入参、出参及各种常见校验和简单逻辑,动态渲染前端页面。最终实现零开发搭建内容管理系统。

✨ 特点

  • 🛠️ 配置生成CMS后台管理界面
  • 📚 通过步骤设计覆盖不同后台业务应用场景
  • 🏹 跨页面数据传输、跨组件交互
  • 🎏 支持引入不同组件库

工作原理

通过代理组件的属性定义、数据请求、跨组件交互和状态机判断,实现基于组件化的前端页面配置化。

便捷使用

通过配置JSON,定义表单步骤与组件。生成完整的后台管理功能。

组件库接入

参照猎户座组件开发规范,开发者可以提供丰富种类的组件以供自己使用,并可以将组件发布供所用用户选用。

⚙️ 使用

npm install ccms-antd

🌰 示例

import { CCMS } from 'ccms-antd';

const App = () => (
  <>
    <CCMS
      checkPageAuth={async () => true}
      loadPageURL={async (id) => `/url?id=${id}&type=page`}
      loadPageFrameURL={async (id) => `/url?id=${id}&type=open`}
      loadPageConfig={async (page) => newConfig }
      sourceData={{}}
      callback={() => {
        if (window.history.length > 1) {
          window.history.back()
        } else {
          window.close()
        }
      }}
      config={config}
    />
  </>
);

📖 API文档

👉 Api文档

🧑‍🤝‍🧑 参与共建 配置化内容管理系统 UI库(ant design版)

初始化工程

需要首先初始化ccms工程!

npm install

npm link ccms

sudo npm link

编译

npm run build

生成文档

npm run docs

单元测试

npm run test
TypeScript
1
https://gitee.com/jd-platform-opensource/ccms-antd.git
git@gitee.com:jd-platform-opensource/ccms-antd.git
jd-platform-opensource
ccms-antd
CCMS-ANTD
master

搜索帮助