0
点赞
收藏
分享

微信扫一扫

华为云低代码平台Astro|通过零代码快速搭建打卡小程序

萨摩斯加士奇 2023-03-24 阅读 92

如何基于Astro零代码能力,DIY开发,完成问卷、投票、信息收集、流程处理等工作,还能够在线筛选、分析数据。实现一站式快速开发个性化应用,体验轻松拖拽开发的乐趣。

环境准备

注册华为云账号、实名认证。如果您已拥有华为账号且已通过实名认证,可直接体验。若您还没有通过实名认证的账号,需要完成个人或企业账号的实名认证。

资源准备

申请免费试用Astro Zero:本次体验使用免费版Astro Zero即可完成,点击链接“申请免费试用Astro Zero”,完成免费版的资源领取。

进入运行环境显示如下页面就完成了资源的所有准备了。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单


 


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_02


 

应用构建部分

1、编辑应用名称:打卡案例。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_03


 

2、创建空白表单。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_04


 


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_05


 

3、在新建的表单中,为表单命名“员工打卡信息”,拖拽“用户”组件到右侧画布,将组件名称改为“员工”。

注意事项:初始表单会自带三个组件填充画布,可在后续的操作中删除。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_06


 

拖拽“单选”组件到画布上。在右侧的属性中,修改名称为“每日打卡状态”,设置两个选项的名称分别为“已打卡”、“未打卡”,“点击”下图位置4(将状态默认值设置为未打卡,右侧圈圈)。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_07


 

完成以上两个组件的配置后,点击“保存”,点击“退出”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_08


 

4、点击“新建”,点击“新建表单”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_09


 

5、设置表单名称为“健康打卡”,拖拽“关联记录”组件到画布上,设置显示名称为“打卡员工”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_10


 

点击下图所示下拉框。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_11


 

选择“员工打卡信息”选项。

 


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_12


 

选择“全部”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_13


 

拖拽“单选”组件到画布上,设置名称为“当前是否绿码”,设置选项分别为“绿码”、“红码”,勾选“必填”选项。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_14


 

完成以上两个组件的配置后,点击“保存”,点击“退出”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_15


 

5、自动化:点击右下角“自动化”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_16


 

点击“开始创建”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_17


 

选择“数据新增时触发”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_18


 

右上角名称设置为“员工打卡后,更改打卡状态”,选择触发器的表单为“健康打卡”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_19


 

点击添加动作,选择“获取单条数据”。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_20


 

右侧配置如下图所示,配置后点击保存。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_21


 

按照下图依次点击。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_22

 

按照下图配置后保存。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_23


 

依次点击“保存”、“启用”按钮后,点击左上角退出即可。



华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_24

 

测试部分

在“员工打卡信息”表单,新建测试数据。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_25



 

在“健康打卡”表单,提交一条数据。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_26


 


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_27


 

提交成功,新增数据一条。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_28


 

员工打卡信息,显示张三已经打卡。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_29


 

可优化部分

添加表格试图。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_30


 

选择“过滤”,按照红色区域进行配置。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_表单_31


 

修改名称后保存。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_数据_32


 

成功创建“已打卡”的视图。


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_33


 

按照上述步骤,创建“未打卡”人员的视图。

最终效果如下,可切换视图


华为云低代码平台Astro|通过零代码快速搭建打卡小程序_拖拽_34


 

 


举报

相关推荐

0 条评论