# 结课作业

新手指引系列文档将带领大家快速借助CodeWave平台能力搭建一个属于自己的低代码应用,并在应用的搭建过程中掌握平台的各类基础知识。

# 需求任务

完成客户管理功能,并实现下列要求:

  • 新增客户信息,客户姓名和手机号为必填项。
  • 编辑客户信息,客户手机号不可编辑。
  • 变更手机号功能,当客户状态为已跟进,不显示变更手机号链接。
  • 筛选条件:客户姓名模糊筛选,手机号结尾匹配,状态单选。
  • 点击删除,删除客户。
  • 点击查看详情,打开新的标签页进入到详情页面。

具体功能可参照案例模板入门教学案例模板

# 操作步骤

  1. 分析需求,创建实体,其中客户状态设为如下图所示枚举类型。

    image-20230226125943021

    image-20230226125947701

  2. 选择并勾选实体列显示项。

    image-20230226130005598

  3. dashboard总览页页面下添加子页面。

    image-20230226130046592

  4. 页面下拖入面板组件,修改标题,删除多余文本组件。

    image-20230226130059313

  5. 拖入客户实体,选择列表(全)

    image-20230226130125438

  6. 打开弹窗,为姓名和手机号配置验证规则,设置必填校验。

    image-20230226130209753

  7. 选中手机号表单项,条件显示设为 not(isUpdate),当客户状态为已跟进,不显示变更手机号链接。

    image-20230226130324753

  8. 拖入新的弹窗组件,修改组件名字为changeMoile

    image-20230226130233304

    image-20230226130246661

  9. 双击编辑弹窗,修改标题文本为修改手机号,删除多余内容,拖入表单组件,修改表单组件名称为mobileForm

    image-20230226130413203

  10. 删除多余表单项,选中手机号表单项,增加必填验证规则。

    image-20230226130457480

  11. 设置双向绑定,将手机号表单项值设置为input.mobile

    image-20230226130549601

  12. 拖入链接组件到数据表格行,文字修改为更改手机号,同理增加查看详情链接。

    image-20230226130713608

  13. 设置更改手机号链接显示条件,当客户状态为已跟进,不显示变更手机号链接。

    image-20230609164013485

  14. 设置更改手机号链接点击事件逻辑。

    image-20230226130957817

  15. 设置确定按钮点击事件逻辑。

    image-20230226131013862

  16. 设置取消按钮点击事件逻辑。

    image-20230226131037601

  17. 更改数据查询筛选条件,客户姓名模糊筛选,手机号结尾匹配,状态单选。

    image-20230609164244780

  18. 新建客户详情子页面。

    image-20230226131151828

  19. 拖入客户实体,选择详情

    image-20230226131210353

  20. 设置查看详情链接打开方式。

    image-20230226131229666

  21. 设置链接地址,跳转到当前行的详情页。

    image-20230609164420461

  22. 发布开发环境预览查看运行结果。

上次更新: 2023年06月14日