组装“业务用户注册”页面

“业务用户注册”页面实际上是一个对话框，是在管理员操作“新增用户”时，弹窗的注册对话框，详细如图1所示。

图1 业务用户注册对话框

结合页面需求，页面需要创建如下模型：

表1 模型分析
模型名称	作用	详细定义
userInfo	保存注册用户信息的参数。	自定义模型，包含的计算节点如下： username：用户名，与输入框绑定。 password：密码，与输入框绑定。 role：角色，与下拉框绑定。

操作步骤

在“我的应用”中，单击“设备维修管理系统”，进入应用。
在“User”目录中，鼠标放在“Page”上，单击界面上出现的“+”，在弹出菜单中选择“标准页面”。
在“标签”和“名称”文本框中输入“registerPortalUser”，单击“添加”。
当编辑已有标准页面时，为防止编辑时多人篡改，编辑前请单击进行锁定。
定义模型“userInfo”。
1. 在页面底部单击“模型视图”，然后在“模型视图”中，单击“新增模型”。
2. 添加自定义模型，模型名称“userInfo”，单击“下一步”。
3. 单击“新增节点”，为模型添加节点“username”、“password”、“role”字段，字段类型都采用默认的Text。单击“下一步”，再单击“确定”。
  图2 新增节点
4. 单击页面上方的，保存模型。
拖拽页面组件。
1. 单击“设计视图”，从“模型视图”切换到“设计视图”。
2. 从左侧基本组件列表区中，拖拽1个“表单”到“页面内容”中。
  因为当前还没有定义数据源，在“元数据表单配置向导”弹窗底部，单击“取消”，创建一个空的表单控件。
  
  图3 拖拽一个空表单
3. 拖拽1个“容器”到“表单”。
4. 拖拽1个“分栏”到“容器”。
5. 修改“分栏”为1栏（1行1列）。
  图4 设置分栏为1行1列
6. 选择“分栏”下的2次，新增2个分栏。
7. 向前两个分栏，分别拖拽1个“输入框”组件，向第三个分栏中，拖拽一个“下拉框”组件。
  图5 拖拽输入框、下拉框
配置组件属性，及数据绑定。
1. 设置第一个“输入框”属性。
  1. 添加值绑定。
    选中“输入框”组件，单击“数据绑定”下“值绑定”的，在弹窗中选择“ userInfo”下的“username”字段。
  2. 修改“标签”为“用户名”，“占位符”为“请输入用户名”。
2. 设置第二个“输入框”属性。
  1. 添加值绑定。
    选中“输入框”组件，单击“数据绑定”下“值绑定”的，在弹窗中选择“ userInfo”下的“password”字段。
  2. 修改“标签”为“密码”，“占位符”为“请输入密码”。
3. 设置“下拉框”属性。
  1. 添加值绑定。
    单击“数据绑定”下“值绑定”的，在弹窗中选择“userInfo”下的“role”字段。
  2. 修改“标签”为“角色”，并设置“选项”为“cs，客服人员”，“ds，派单人员”、“ms，维修人员”。
    图6 设置选项值
单击页面上方的，保存设置。
单击页面上方的，进入预览页面，查看页面是否符合预期，并单击查看是否有下拉框选项。

图7 页面预览