{
  "widgettype": "VBox",
  "options": {"width": "100%", "height": "100%", "padding": "0", "backgroundColor": "#f4f6f9"},
  "subwidgets": [
    {
      "widgettype": "VBox",
      "options": {"width": "100%", "padding": "0"},
      "subwidgets": [
        {
          "widgettype": "HBox",
          "options": {"width": "100%", "align": "center", "padding": "0 12px", "height": "48px", "backgroundColor": "#fff", "borderBottom": "1px solid #e0e6ed"},
          "subwidgets": [
            {"widgettype": "Text", "options": {"label": "拖拽编程画布", "fontSize": "16px", "fontWeight": "bold"}},
            {"widgettype": "Text", "options": {"label": "名称", "fontSize": "13px", "marginLeft": "24px"}},
            {"widgettype": "Input", "id": "graph-name", "options": {"placeholder": "输入画布名称", "width": "220px", "marginLeft": "6px"}}
          ]
        },
        {
          "widgettype": "HBox",
          "options": {"width": "100%", "padding": "8px 12px", "backgroundColor": "#fff", "borderBottom": "1px solid #e0e6ed", "gap": "8px"},
          "subwidgets": [
            {"widgettype": "Button", "id": "btn-save", "options": {"label": "保存画布", "buttonType": "primary"}},
            {"widgettype": "Button", "id": "btn-validate", "options": {"label": "校验", "buttonType": "default"}},
            {"widgettype": "Button", "id": "btn-compile", "options": {"label": "编译脚本", "buttonType": "success"}},
            {"widgettype": "Button", "id": "btn-publish", "options": {"label": "发布到脚本引擎", "buttonType": "warning"}}
          ]
        }
      ]
    },
    {
      "widgettype": "HBox",
      "options": {"width": "100%", "height": "100%", "align": "stretch"},
      "subwidgets": [
        {
          "widgettype": "VBox",
          "id": "block-panel",
          "options": {"width": "220px", "backgroundColor": "#fff", "borderRight": "1px solid #e0e6ed", "overflow": "auto"}
        },
        {
          "widgettype": "VBox",
          "id": "canvas-area",
          "options": {"width": "100%", "height": "100%", "position": "relative", "overflow": "hidden"}
        },
        {
          "widgettype": "VBox",
          "options": {"width": "300px", "backgroundColor": "#fff", "borderLeft": "1px solid #e0e6ed"},
          "subwidgets": [
            {
              "widgettype": "VBox",
              "options": {"width": "100%", "padding": "0"},
              "subwidgets": [
                {"widgettype": "Text", "options": {"label": "参数面板", "fontSize": "13px", "fontWeight": "bold", "padding": "8px 10px", "backgroundColor": "#f0f4fa"}},
                {"widgettype": "VBox", "id": "param-panel", "options": {"width": "100%", "padding": "10px"}}
              ]
            },
            {
              "widgettype": "VBox",
              "options": {"width": "100%", "padding": "0", "marginTop": "12px"},
              "subwidgets": [
                {"widgettype": "Text", "options": {"label": "校验/编译结果", "fontSize": "13px", "fontWeight": "bold", "padding": "8px 10px", "backgroundColor": "#f0f4fa"}},
                {"widgettype": "VBox", "id": "validate-result", "options": {"width": "100%", "padding": "10px"}},
                {"widgettype": "VBox", "id": "compile-output", "options": {"width": "100%", "padding": "10px"}}
              ]
            }
          ]
        }
      ]
    }
  ]
}