【微搭低代码】学生信息采集小程序实战教程

学校在新生入学的时候需要采集学生的基础信息,低代码工具可用很好的响应这类需求,我们首先要分析一下新生采集哪些信息

  • 姓名:用于学籍管理和身份核实。
  • 身份证号码:用于身份核实和学籍管理。
  • 出生日期:用于学籍管理和年龄核实。
  • 国籍/地区:用于学籍管理和国际学生管理。
  • 家庭地址:用于联系和紧急情况联系。
  • 联系电话:用于联系和紧急情况联系。
  • 紧急联系人信息:用于紧急情况联系。
  • 学历证书、成绩单等证明材料:用于学历认证和入学审核。
  • 照片:用于学籍管理和身份证明。
  • 个人特长、爱好等信息:用于学生管理和辅导工作。

要实现这么一个小程序需要我们先建立数据源

1 建立数据源

在这里插入图片描述
依次录入我们的字段
在这里插入图片描述

2 创建自定义应用

数据源录好之后,我们需要新建自定义应用用来存放我们的小程序
在这里插入图片描述
在这里插入图片描述

3 搭建功能

先添加一个普通容器,里边放一个图片组件。设置普通容器的宽为100%
在这里插入图片描述
设置图片的宽为100%,高为145px
在这里插入图片描述
目前图片的高度并没有变化,需要设置图片为裁剪填满
在这里插入图片描述
图片地址我们从素材里选择一个图片
在这里插入图片描述
在图片组件下边放置两个文本组件,将内容分别改为

学生开学信息登记

请按照提示录入对应的信息

在这里插入图片描述
我们设置一下文本的外边距
在这里插入图片描述
在文本下边添加一个表单容器,数据源选择我们刚刚建立的数据源
在这里插入图片描述
设置字段为必录项
在这里插入图片描述
设置身份证号的校验规则
在这里插入图片描述
也可以使用正则表达式进行校验,表达式为

/^\d{17}[\d|x]|\d{15}$/

其中 ^ 表示字符串的开始,\d 表示数字,{17} 表示数字连续出现 17 次,[\d|x] 表示数字或字母 x,| 表示或者,\d{15} 表示数字连续出现 15 次,$ 表示字符串的结束。

这个表达式可以匹配 18 位或 15 位的身份证号码。其中,18 位身份证号码的最后一位可能是数字或字母 x,15 位身份证号码没有最后一位校验码。

个人特长、爱好,我们改为多行输入
在这里插入图片描述
提交后我们跳转到提交成功页面,新建一个提交成功页
在这里插入图片描述
页面放置普通容器,里边增加一个图片及文本组件
在这里插入图片描述
设置图片的宽和高为64px
在这里插入图片描述
文本内容修改为提交成功,图片从素材里选择
在这里插入图片描述
设置普通容器的布局为纵向排列,居中对齐,并设置外边距
在这里插入图片描述
回到首页,选中表单容器,我们设置返回上一页的事件修改为打开页面
在这里插入图片描述

4 生成模型应用

小程序开发好了之后,我们需要创建一个模型应用提供给老师使用
在这里插入图片描述
选择我们的数据源,自动生成页面
在这里插入图片描述
在这里插入图片描述
点击导航菜单,自动生成菜单
在这里插入图片描述
在这里插入图片描述
然后点击发布发布到企业工作台里
在这里插入图片描述
在企业工作台里就可以看到我们小程序端录入的数据
在这里插入图片描述

5 分配权限

为了提供给老师使用,我们还需要创建角色,新建一个老师角色
在这里插入图片描述
在这里插入图片描述
按照需要分配相应的权限
在这里插入图片描述
在用户模块添加相应的用户分配到角色里即可

总结

我们本篇是以新生入学这个场景,带着大家搭建了小程序和管理后台。使用低码工具开发应用还是非常方便的,全程都是可视化拖拽,无需编码,对于新手来说还是很友好的。学习低代码开发,从最基础的需求开始吧。

猜你喜欢

转载自blog.csdn.net/u012877217/article/details/129945615