加油站小程序实战教程11会员注册

发布于:2025-04-18 ⋅ 阅读:(27) ⋅ 点赞:(0)


上一篇我们介绍了我的页面,显示未开通界面的搭建。当用户点击开通会员时,我们给出弹窗提示用户进行手机号授权,得到手机号之后我们调用API来完成会员的注册。本篇我们介绍一下会员注册的流程。

1 创建API

会员注册的时候需要调用API,我们在用户管理模块,添加会员注册方法。
在这里插入图片描述
添加入参,我们传入两个参数openid和手机号码
在这里插入图片描述
输入如下代码:

const ErrorCode = {
    SUCCESS: 0,
    PARAM_ERROR: 1001,
    NOT_FOUND: 1002,
    SYSTEM_ERROR: 1003,
    USER_EXISTS: 1004,
    USER_NOT_EXISTS: 1005
};

// 用户注册
module.exports = async function (params, context) {
    const { openid, phone } = params;

    // 参数验证
    if (!openid || !phone) {
        return {
            code: ErrorCode.PARAM_ERROR,
            message: '参数错误'
        };
    }

    try {
        // 检查用户是否已存在
        const existUser = await context.callModel({
            name: "users",
            methodName: "wedaGetItemV2",
            params: {
                filter: {
                    where: {
                        $and: [
                        {
                            openid: {
                            $eq: openid, 
                            },
                        },
                        {
                            phone: {
                            $eq: phone, 
                            },
                        },
                        ],
                    },
                    },
                    
        select: {
          $master: true, // 常见的配置,返回主表
        },
            }
        });
        console.log("existUser",existUser)

        if (Object.keys(existUser).length > 0) {
            return {
                code: ErrorCode.USER_EXISTS,
                message: '用户已存在'
            };
        }

        // 创建新用户
        const result = await context.callModel({
            name: "users",
            methodName: "wedaCreateV2",
            params: {
                data: {
                    openid,
                    phone,
                    status: "1"
                }
            }
        });

        const userid = result.id

        // 开通会员
        const member = await context.callModel({
            name: "members",
            methodName: "wedaCreateV2",
            params: {
                data: {
                    user_id:{_id:userid},
                    level:"1",
                    status: "1",
                    points:0,
                    balance:0
                }
            }
        });

        return {
            code: ErrorCode.SUCCESS,
            data: {userid:result.id,memberid:member.id}
        };
    } catch (error) {
        return {
            code: ErrorCode.SYSTEM_ERROR,
            message: '系统错误'
        };
    }
}

我们的注册逻辑是分为两步,先注册用户,然后再开通会员。

代码写好后点击运行测试,看到执行成功后点击出参自动映射
在这里插入图片描述
映射成功后可以看到我们出参的结构
在这里插入图片描述

2 搭建页面布局

API写好之后,就需要搭建布局,在内容插槽下边添加弹窗组件
在这里插入图片描述
弹窗内容里添加获取手机号组件
在这里插入图片描述
将按钮的标题改为开通会员
在这里插入图片描述
关闭弹窗的显示底部内容配置
在这里插入图片描述

3 绑定事件

布局搭建好之后,就可以给按钮绑定事件了,我们的组件是可以得到用户授权的手机号的,得到之后我们就可以调用API来完成注册

选中我们的按钮,设置获取手机号成功事件,方法选择调用数据源方法
在这里插入图片描述
名称选择我们的用户管理,方法选择开通会员
在这里插入图片描述
openid绑定为currentUser的openId
在这里插入图片描述
手机绑定我们的无区号手机号
在这里插入图片描述

event.detail.purePhoneNumber

设置成功后再跟一个javascript调用,调用一下我们的获取会员状态的方法
在这里插入图片描述
这样就完成了整体的配置

总结

本篇我们介绍了会员注册的开发流程。先讲解了后端API怎么开发,接着搭建了页面布局,之后进行了事件绑定。低代码开发既涉及前端开发也涉及后端开发,因为支持写各类逻辑,总体上比较灵活,不像有些人宣传的说是只能托拉拽不能写复杂的应用。


网站公告

今日签到

点亮在社区的每一天
去签到