
# 应用设计操作
业务人员使用低代码创建应用的最重要一步就是设计应用，应用设计模块的功能主要是对与应用的整个页面与交互逻辑，事件流逻辑进行配置，通过应用设计模块完成核心的应用开发工作，当应用设计完成之后才能进行发布；
#### 配置菜单
**新建菜单组**
1. 进入低代码平台应用，找到需要设计的应用，单击设计图标进入应用设计器；
   图1应用设计器   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062329816.png) 

2. 在应用设计器页面的应用设计器面板单击 【添加菜单】可以进行添加菜单，也可单击添加菜单分组，菜单分组可以继续添加菜单。
   图2添加菜单1   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098681937.png) 
3. 单击新建菜单组后，会在当前应用中添加一个一级菜单；可以在右侧的属性面板区域设置菜单的编码/名称等字段信息，菜单组不可上传图标；
   图3添加菜单2   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098682373.png)
   - 编码：菜单的编码，使用驼峰命名法；
   
   - 名称：单行文本输入框，用户可以自定义菜单的名称，并可以设置菜单的其他语言名称
    
 
**新建子菜单**
基于一级菜单添加二级菜单，选择一级菜单鼠标右键，在悬浮的卡片上单击【添加子菜单】，
图4添加子菜单   
![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098802717.png)
**拖拽菜单**
如果创建了一个菜单，菜单的层级需要进行调整，可以通过在应用构建器里面进行拖拽菜单顺序；
图5拖拽菜单   
![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062725140.png)
**删除菜单**
鼠标左键选中需要删除的菜单，右键单击菜单在出现的卡片里面，单击删除即可删除菜单。
图6删除的菜单   
![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002099006213.png)
删除菜单后，需要单击保存按钮，对已经操作的记录进行保存
#### 配置页面
**新建页面**
配置说明：在低代码平台中，已经成功创建了菜单结构，菜单本身只是一个空壳，除非与相应的页面关联，否则单击菜单将不产生任何效果。因此需要创建页面。
在创建页面的时候，先选择需要的页面布局，再选择不同的页面模版，录入页面名称和源类后，页面创建成功。其中在系统根据不同的布局页内置了不同的页面模版，例如一格布局有查询列表与空模版；
需要执行以下步骤：
- 创建菜单：首先，创建菜单结构，这是应用的导航框架。但记住，这些菜单仅是容器，它们还没有内容或功能。
- 新建页面：为了构建业务系统，需要新建页面。这些页面将成为业务应用的核心。在每个页面上，可以添加各种元素，包括表单、图表、列表等，以满足特定的业务需求。
- 关联页面：为了使菜单有实际效果，必须关联每个菜单项到相应的页面。这就像给菜单赋予了生命。通过关联页面，可以确保用户单击菜单时会跳转到相关的页面。
操作步骤
1. 单击新建页面，新建页面的方式有三种
   - 鼠标右键单击对应的菜单，在弹出的浮层中选择添加页面；
   
   - 可以在空白出单击添加页面；
   
   - 可以在右侧属性面板中单击新建页面
   
   
   图7新建页面   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098449957.png) 
2. 单击新建页面后，系统会弹出新建页面的弹窗信息，在弹窗中，需要选择右侧的页面布局方式，输入名称与默认源类，单击【确认】即可创建成功。
   图8新建   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062489760.png)
   图9输入信息   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098568461.png)
   - 页面布局：左侧支持页面布局样式；选择对应页面布局后，右侧上面会显示对应的布局样式；
   
   - 页面模版：下拉框，查询列表页、空模版页面；当用户选择查询列表页面的时候，系统自动在页面中放入一个继承下面的查询列表；当用户选择空模版页面的时候，在新建的页面中就没有查询列表；
   
   - 默认源类：下拉框，获取的是智能体厂的所有模型；非必填。如果填写后，整个页面拖动的瓦片源类数据或默认填充页面的默认源类数据；
    
3. 单击【确认】按钮后，页面就成功创建，如下图：
   ![](https://support.huaweicloud.com/ndts-mnft/public_sys-resources/note_3.0-zh-cn.png)
   下图之所有有数据是因为我的父类已经配置了查询列表，会自动根据页面的默认源类去找寻继父类的查询列表信息；
   图10查询列表   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062331472.png) 
4. 到这里页面就新建成功了
**编辑页面**
操作步骤：
1. 在应用画布中，单击空白区域，可以看到蓝框会将页面进行选中，上方显示页面的名称与删除按钮； ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098449965.png)
   
2. 可以在页面的属性面板中进行事件配置，单击事件配置，会进入事件流设计器，如下图： 可以在这个页面中新建页面内部的事件流，事件流的主要用途是控制页面中不同瓦片之间的数据传递与事件的传递；
   图11事件配置   
   ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062489772.png)
   事件流的添加方式有几步：
   - 单击添加事件流，
     图12添加事件流   
     ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098568465.png) 
    
   - 选择开始节点，可以使用鼠标左键单击任何一个 连接点，例如单击查询，单击查询接入点的时候，会自动将按钮的值 给到【开始节点】
     图13开始节点   
     ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062331476.png) 
   
   
   
   - 单击事件流结束节点，例如刷新
     图14结束节点   
     ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098449969.png) 
   
   
   
   - 添加完成的效果如下，这个事件流连线代表的意思是，单击上面的查询按钮，会将下面的瓦片进行刷新，如果需要对事件流保存，需要单击返回到应用设计器面板后，再进行保存；
     图15完成效果   
     ![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062489776.png) 
    
**删除页面**
如果新建页面错误了，可以直接选中页面，单击头部的删除按钮，即可完成页面的删除；
图16删除页面   
![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002098568469.png)
#### 配置瓦片
低代码平台的瓦片模版功能为用户提供了多种预定义的瓦片类型，通过继承与复用的方式，旨在降低瓦片开发的工作量。这些瓦片模版的灵活性和多样性允许用户根据具体需求构建各种不同类型的瓦片，用于构建复杂的业务应用。
图17对话框   
![](https://support.huaweicloud.com/ndts-mnft/zh-cn_image_0000002062331480.png)
