Fetch the repository succeeded.
CCMS是一套完善、通用的可配置化的方案。通过配置化自动生成中后台（CMS）界面。
CCMS将内容管理系统前端页面抽象为在若干API进行流转的系统。进一步将对后台API的请求按照逻辑类型划分为表单提交、列表展示、查询数据等类型。通过JSON数据格式描述各API请求的接口信息、入参、出参及各种常见校验和简单逻辑，动态渲染前端页面。实现零开发搭建内容管理系统。
通过代理组件的属性定义、数据请求、跨组件交互和状态机判断，实现基于组件化的前端页面配置化。
通过配置JSON，定义表单步骤与组件。生成完整的后台管理功能。
参照猎户座组件开发规范，贡献者可以提供丰富种类的组件以供自己使用，并可以将组件发布供所用用户选用。
npm install ccms-antd ccms
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`}
// 界面操作更新CCMS config
loadPageConfig={async (page) => newConfig }
sourceData={{}}
callback={() => {
if (window.history.length > 1) {
window.history.back()
} else {
window.close()
}
}}
//后附config的demo 详见api文档
config={config}
/>
</>
);
config参数DEMO
{
"basic": {
"title": "我的表单"
},
"steps": [
{
type: "form",
layout: "horizontal",
fields:[
{
type:'text',
"field": "text",
"label": "这是一个提交步骤"
}
]
},
{
"type": "fetch",
"request": {
"url": "https://j-api.jd.com/mocker/data?p=263&v=POST&u=list.do",
"method": "GET"
},
"response": {
"root": "result"
},
"condition": {
"enable": true,
"field": "code",
"value": 0,
"success": {
"type": "none",
"content": {
"type": "static",
"content": "成功"
}
},
"fail": {
"type": "modal",
"content": {
"type": "field",
"field": "msg"
}
}
}
}, {
"type": "table",
"primary": "index",
"columns": [
{
"label": "id",
"field": "id",
"type": "text",
"defaultValue": "暂无数据"
},
{
"label": "datetime",
"field": "datetime",
"type": "text",
"defaultValue": "暂无数据"
},
{
"label": "name",
"field": "name",
"type": "text",
"defaultValue": "暂无数据"
}
],
"operations": {
"rowOperations": [
{
"type": "button",
"label": "编辑",
"handle": {
"type": "ccms","callback":true,
"page": "o_manage_list_edit",
"target": "current",
"data": {
"id": {
"source": "record",
"field": "id"
}
}
}
},
{
"type": "button",
"label": "删除",
"handle": {
"type": "ccms","callback":true,
"page": "o_manage_list_delete",
"target": "current",
"data": {
"id": {
"source": "record",
"field": "id"
}
}
},
"confirm": {
"enable": true,
"titleText": "确定删除应用吗？删除后无法恢复"
}
}
],
"tableOperations": [
{
"type": "button",
"label": "+ 可以新建应用",
"handle": {
"type": "ccms",
"callback":true,
"page": "o_manage_list_create",
"target": "current",
"data": {}
}
}
]
}
}
]
}
👉 Api文档
配置化内容管理系统 核心库 (共建与UI接入)
npm install
sudo npm link
npm run build
npm run test
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
1. Open source ecosystem
2. Collaboration, People, Software
3. Evaluation model
马建仓 AI 助手