知晓云支持开发者结合 User Dash API 按需编写一套独立的运营后台,并支持一键部署至知晓云服务器,用户可以通过生成的链接直接访问使用。
- 该服务适用于需要独立管理后台的用户,比如你的运营同事,并非开发者,你也不会希望他直接操作数据表,此时你可以写一套简单的运营后台供运营同事使用。
如果你的电脑没有 nodejs,请先下载 nodejs 并安装
修改 public/index.html:
- 修改 TOCLFMHonESsHTsc 为你的 client id
- 修改 NDKLal9998LDjk 为你的环境 ID,如果为生产环境,环境 ID 设为空或将 env_id=NDKLal9998LDjk 去掉,测试环境 ID 的获取需要在控制台切换到测试环境后,到设置页面获取
- 替换原有的表数据
window._USER_CONFIG = {
TABLE_LIST: [
{name: 'dev_team_test' /* 数据表名称 */, id: 43488 /* 数据表 id */},
{name: 'test_user_dash', id: 52124}]
}
第一步:在此项目根目录下执行 npm install
第二步:在此项目根目录下执行 npm run build
成功时如下图所示:
第二步:将 dist 目录中的文件压缩为 zip 包:
第三步:在知晓云运营后台部署代码
本项目是在 AntDesign 的 create-react-app-antd 项目基础上改进,并结合了知晓云的 OPEN API 进行开发
在开发之前,建议你对以下罗列的几个知识点有所了解:
- 基础的 HTML/CSS/JS 知识
- React 前端框架
- webpack 构建工具
- antDesign UI
src 目录结构如下
├── App.css
├── App.js
├── components
│ ├── AddRowModalView // 添加/编辑行模态框
│ ├── CommonContainer // 样式组件
│ ├── CreateFormItem // 表单控件渲染组件
│ ├── SchemaDataFilterFormModal // 查询模态框
│ ├── SchemaFileUpload // 文件上传组件
│ ├── SchemaList // 左侧栏列表
│ └── SchemaTable // 表格组件
├── constants.js // 常量配置
├── index.css
├── index.js // 入口
├── io // 接口 API
│ └── index.js
├── registerServiceWorker.js
└── utils.js // 工具函数
目前数据表的展示和编辑支持以下数据格式
- id
- string
- number
- integer
- file
- data
- array
- object
- geojson
目前 OPEN API 暂不支持批量删除功能