大道至简,新一代企业应用无栈开发

平台之上,一种语言,可视化、脚本化、全端一体化开发

面板拼装

用户可定制的页面区域

docutils document without title

1   面板拼装区

1.1   渲染模板拼装区 zopen.portlet:render

视图左右侧可通过如下渲染,即可实现内容可用户定制:

right = root.call_script('zopen.portlet:render',
        context=context,
        request=request,
        view=view,
        id = 'xx',
        store_obj=store_obj,
        store_key=store_key,
        viewlets=viewlets,
        defaults=defaults,
        )

输入参数:

  • id: 组件的ID

  • store_obj:【可选】数据存放的在那个对象上,默认就是context

  • store_key:存放在 context.settings 的key,约定 _portlets_ 开头。

  • template_type: 布局模板类型。如果采用了布局模板,具体模板uid存放在以 template_ + store_key 的key中。

  • viewlets: 可选的专有面板, ['xxx.xxx:viewlet_xxx', 'xxx.xxx:viewlet_xxx'] 类似微应用,脚本名约定:

    • viewlet_file_ 是文件专有
    • viewlet_folder_ 是文件夹专有
    • viewlet_datacontainer_ 是表单库专属
    • viewlet_dataitem_ 是表单专属
    • viewlet_all_ 通用的专有面板
    • 其他一些视图特有的面板,也建议以 viewlet_ 开头
  • defaults:如果没有设置,默认的展示模板脚本: ['xxx.xxx:viewlet_xxx', 'xxx.xxx:viewlet_xxx']

    也可以通过 root.packages.list_plugins 来搜索站点满足条件的全部插件。

输出:一个页面组件

1.2   事件 customize

支持customize事件,用于定制布局。

点击之后进入定制界面,可以通过如下方法调用:

view.select('#xxxx').trigger('customize')

2   面板插件

在页面拼装区的每个面板,是以 插件 规范来定制的.

每个面板插件,由同名的界面渲染脚本和设置表单组成,包括2种插件:

2.1   单一面板

  1. 面板渲染脚本用于渲染用户界面

  2. 命名必须以 portlet_ 开头

  3. 脚本返回ui组件,参数包括:

    • md: 模板的设置信息
    • context
    • request
    • view
  4. 面板设置表单用于设置渲染参数

    表单保存的内容,会传递进入上面的 md 参数。

2.2   组合面板

  1. 组合模板为多个单一模板提供布局
  2. 命名以 portlets_ 开头
  3. 脚本渲染的时候会传递如下参数:
    • md={} 自身的设置信息
    • context
    • request
    • view
    • portlets 子微应用信息信息
    • path 微应用部署的位置,这个信息在渲染子微应用的时候可能需要