/src/customize
├── customizeCards.js
└── index.js 

/src/utils
├── router.js

// 主模块 卡片的 customize
/* hzero-front/src/customize/cards.js */
import { isFunction } from 'lodash';

import { mapCustomize } from 'utils/customize';

/**
 * 如果 卡片存在 则加载卡片
 * 否则 返回 null
 * @param cardCode
 * @return {Promise<null|*>}
 */
export async function loadCardAsync(cardCode) {
  if (mapCustomize.has({ module: 'hzero-front', feature: 'cards', key: cardCode })) {
    const layout = mapCustomize.get({ module: 'hzero-front', feature: 'cards', key: cardCode });
    if (isFunction(layout && layout.component)) {
      const card = await layout.component();
      return card;
    }
  }
  return null;
}

export function setCard(cardConfig) {
  // TODO: 判断是否需要检查 重复设置的问题
  mapCustomize.set({
    module: 'hzero-front',
    feature: 'cards',
    key: cardConfig.code,
    data: { component: cardConfig.component },
  });
}

/* src/utils/router.js */
// ... 其他代码
// 增加 customize 的引入
import '../customize';
// ... 其他代码

/* src/customize/index.js */
// 引入 工作流模块 的卡片配置
import './customizeCards';

/* src/customize/customizeCards.js */

// 引入 存储 卡片配置的方法
import { setCard } from 'hzero-front/lib/customize/cards';
// 引入 家在 model 的包装方法
import { dynamicWrapper } from '../utils/router';
// 设置 编码为 Workflow 的 卡片
setCard({
  code: 'Workflow',
  component: async () => {
    return dynamicWrapper(window.dvaApp, ['cards/workflow'], () =>
      import('../routes/Cards/Workflow')
    );
  },
});

// 卡片开发 (基于 dva 及 hzero-ui)
// 卡片组件
/* src/routers/Cards/Workflow/index.js */
// 该卡片的 model
/* src/models/cards/workflow.js */
export default {
    namespace: 'cardWorkflow', // 卡片的namespace
    // ... 其他代码
};
// 该卡片的 service
/* src/services/cards/workflowService.js */