hjs

一个企业级全栈应用框架

model 配置

/**
 * dashboard 后台管理系统模型定义 一份模版对应一个模版解析器 一个解析器生成各种模版系统
 * 基于dashboard模板可以建立多个领域模型(基类）(业务维度)
 * 每个模型可以派生出不同的项目 模型衍生出项目  model衍生出project
 */
const dashboardModel = {
  mode: "dashboard", // 模板类型 不同类型模板有不一样的数据结构
  name: '', // 模版名称
  desc: '', // 模版描述
  icon: '', // 模版图标
  homePage: '', // 首页路径
  // 头部菜单配置
  menu: [
    {
      key: "", // 菜单唯一描述
      name: "", // 菜单名称
      menuType: "", // 枚举值  group(点击展开子菜单) / module(点击显示模块)

      // 当menuType为group时，可以有子菜单
      subMenu: [
        {
          // 可递归
        },
      ],
      // 当menuType为module时
      moduleType: '', // 枚举值  sider/ iframe / custom / schema
      // 当moduleType为sider时 侧边导航菜单
      siderConfig: {
        menu: [{}]
      },
      // 当moduleType为iframe时
      iframeConfig: {
        path: '', // iframe路径
      },
      // 当moduleType为custom时
      customConfig: {
        path: '', // 自定义路径
      },
      // 当moduleType为schema时
      schemaConfig: {
        api: '', // 接口地址 restful 规范
        // 板块的数据结构
        schema: {
          type: 'object',
          properties: {
            key: {
              // ...schema // 标准配置
              type: '', // 字段类型
              lable: '', // 字段中文
              minimum: 0, // 最小值
              maximum: 1000000, // 最大值
              // 字段在table中的相关配置
              tableOption: {
                elTableColumnConfig: {}, // el-table-column的配置
                visible: true, // 是否显示
              },
              // 字段在search-bar中的相关配置
              searchOption: {
                elComponentConfig: {}, // el-component的配置
                comType: '', // 组件类型 input select radio date-range other
                default: '', // 默认值
                // 当comType为select时，可以有枚举列表
                enumList: [{
                  value: '', // 枚举值
                  label: '', // 枚举标签
                }], // 枚举列表

                // 当comType为dynamicSelect时，可以有枚举列表
                api: '',
              },
              // 字段在组件中的相关配置
              comAOption: {},
              comBOption: {},
              // 字段在不同动态component中的相关配置 前缀对应 componentConfig中的键值
              // 如 componentConfig中的createForm 则前缀为 createFormOption
              // 字段在createForm中对应的配置
              createFormOption: {
                // ...elComponentConfig, 标准el-component配置
                comType: '', // 组件类型 input select radio date-range other
                visible: true, // 是否显示
                disabled: false, // 是否禁用
                default: '', // 默认值

                // comType === select时 
                enumList: [{
                  value: '', // 枚举值
                  label: '', // 枚举标签
                }], // 枚举列表

                // comType === dynamicSelect时
                api: '',
              },
              // 字段在editForm中对应的配置
              editFormOption: {
                // ...elComponentConfig, 标准el-component配置
                comType: '', // 组件类型 input select radio date-range other
                visible: true, // 是否显示
                disabled: false, // 是否禁用
                default: '', // 默认值
              },
              // 字段在detailPanel中对应的配置
              detailPanelOption: {
                // ...elComponentConfig, 标准el-component配置
                comType: '', // 组件类型 input select radio date-range other
                visible: true, // 是否显示
              },
            }
          },
          required: [], // 必填字段
          // additionalProperties: false,
        },
        tableConfig: {
          headerButtons: [{
            label: '', // 按钮文字
            eventKey: '', // 按钮事件key
            eventOption: {
              // 当eventKey = showComponent时，
              comName: '', // 组件名称
            }, // 按钮具体配置
            // ...elButtonConfig
          }],
          rowButtons: [{
            label: '', // 按钮文字
            eventKey: '', // 按钮事件key
            eventOption: {
              // 当eventKey为remove时，可以有params参数
              params: {
                 // 参数key 对应的rowValue的key的值 userId: row[userId]
                 // 当rowValueKey=参数值  当格式为schema:xxx时 到table中找相应的xxx字段
                paramsKey: 'rowValueKey',
              },
              // 当eventKey = showComponent时，
              comName: '', // 组件名称
            }, // 按钮事件具体配置
            // ...elButtonConfig
          }],
        }, // 表格配置
        searchConfig: {}, // search-bar搜索配置
        // 动态组件相关配制 
        componentConfig: {
          // 新增form为例 
          createForm: {
            title: '', // 表单标题
            saveBtnText: '', // 保存按钮文字
            cancelBtnText: '取消', // 取消按钮文字
          },
          // 编辑form为例
          editForm: {
            mainKey: '', // 主键字段
            title: '', // 表单标题
            saveBtnText: '', // 保存按钮文字
            cancelBtnText: '取消', // 取消按钮文字
          },
          detailPanel: {
            title: '', // 面板标题
            saveBtnText: '', // 保存按钮文字
            cancelBtnText: '取消', // 取消按钮文字
            mainKey: '', // 主键字段
          },
          comA: {},
          comB: {},
        }, // 自定义组件配置
      },


    },
  ],
};

// schemaConfig
/**
 * schemaConfig -> 解释器 {
 *   schema-view {
 *    schema-search-bar {
 *      select date-rage other components
 *      schema-table
 *      scheam-table-row
 *    }
 *    schema-form {
 *      input select radio 其它控件
 *    }
 *  }
 * }
 */
export default dashboardModel;

服务端启动

const { serverStart } = require('@baseh/hjs')

const app = serverStart({})

自定义服务端

• router-schema
• router
• controller
• service
• extend
• config

前端构建

const { frontendBuild } = require("@baseh/hjs")

frontendBuild(process.env._ENV)

自定义页面扩展

• 在 app/pages/ 目录下写入口 entry.xxx.js

dashboard / custom-view 自定义页面扩展

• 在 app/pages/dashboard/xxx 下写页面

dashboard / shcema-view/components 动态组件扩展

1.在app/pages/dashboard/complex-view/schema-view/components下写组件 2.配置到app/pages/dashboard/complex-view/schema-view/components/component-config.js

schema-form 控件扩展

1.在app/widgets/schema-form/complex-view下写控件 2.配置到app/widgets/schema-form/form-item-config.js

schema-search-bar 控件扩展

1.在app/widgets/schema-search-bar/complex-view下写控件 2.配置到 app/widgets/schema-search-bar/search-item-config.js