《仿盒马》app开发技术分享-- 注销账号恢复（85）

技术栈

Appgallery connect

开发准备

上一节我们实现了欢迎页的逻辑，并且在欢迎页面实现了对账号状态的提示，但是如果我们的用户之前因为一些原因注销了账号，但现在又想用回我们的应用怎么办？我们这一节就要在注销账号的提示弹窗处，实现一个账号恢复功能，使我们的用户可以继续使用我们的应用

功能分析

要实现账号恢复，首先我们需要在注销弹窗的事件出实现页面的跳转，在新页面里，我们通过修改用户当前账号的状态来实现，当然了，我们也需要在里边添加一些恢复的说明，避免引起不必要的麻烦

代码实现

首先我们实现账号恢复的ui页面，创建好等会要使用的变量

 @State message: string = '提示语句';
  @State acc:string = ''
  @State psw:string = ''

 CommonTopBar({ title: "账号恢复", alpha: 0, titleAlignment: TextAlign.Center ,backButton:true})
      Text(this.message)
        .border({width:1,color:Color.Black})
        .borderRadius(15)
        .margin({left:15,right:15})
        .fontColor(Color.Black)
        .padding(10)

        .fontSize(16)
        .fontWeight(FontWeight.Bold)
      Column() {
        TextInput({text:this.acc,
          placeholder: '请输入注销前的账号'
        })
          .backgroundColor("#f6f6f6")
          .placeholderColor("#ff999595")
          .fontColor("#333333")
          .maxLength(11)
          .type(InputType.Number)
          .onChange((value: String) => {
            this.acc = value.toString()
          }).margin(20)

        TextInput({text:this.psw,
          placeholder: '请输入注销前的密码'
        })
          .backgroundColor("#f6f6f6")
          .placeholderColor("#ff999595")
          .fontColor("#333333")
          .type(InputType.Password)
          .onChange((value: String) => {
            this.psw = value.toString()
          }).margin(20)

然后我们来实现点击账号恢复的业务逻辑，在点击账号恢复时，我们先要根据用户输入的账号密码校验准确性

 let databaseZone = cloudDatabase.zone('default');

              let condition = new cloudDatabase.DatabaseQuery(user);
              condition.equalTo("user_name",this.acc).and().equalTo("psw",this.psw)
              let listData = await databaseZone.query(condition);
              let json = JSON.stringify(listData)
              let data1:User[]= JSON.parse(json)

当用户输入的账号密码准确，我们紧接着修改账号状态，并且跳转到首页

 let userInfo = new user();
                userInfo.id=data1[0].id
                userInfo.user_id=data1[0].user_id
                userInfo.user_name=data1[0].user_name
                userInfo.psw=data1[0].psw
                userInfo.is_vip=false
                userInfo.user_code=data1[0].user_code;
                userInfo.is_log_off=false
                let num = await databaseZone.upsert(userInfo);
                if (num>0) {
                  showToast("账号恢复成功")
                  router.replaceUrl({ url: 'pages/Index' });
                }

完整方法

        Row() {
          Text('账号恢复')
            .fontColor(Color.White)
            .fontSize(18)
            .backgroundColor("#ffe74141")
            .padding(10)
            .borderRadius(10)
            .onClick(async ()=>{
              let databaseZone = cloudDatabase.zone('default');

              let condition = new cloudDatabase.DatabaseQuery(user);
              condition.equalTo("user_name",this.acc).and().equalTo("psw",this.psw)
              let listData = await databaseZone.query(condition);
              let json = JSON.stringify(listData)
              let data1:User[]= JSON.parse(json)
              if (data1.length>0) {
                let userInfo = new user();
                userInfo.id=data1[0].id
                userInfo.user_id=data1[0].user_id
                userInfo.user_name=data1[0].user_name
                userInfo.psw=data1[0].psw
                userInfo.is_vip=false
                userInfo.user_code=data1[0].user_code;
                userInfo.is_log_off=false
                let num = await databaseZone.upsert(userInfo);
                if (num>0) {
                  showToast("账号恢复成功")
                  router.replaceUrl({ url: 'pages/Index' });
                }
              }



            })

        }
        .width('100%')
        .justifyContent(FlexAlign.Center)

到这里我们就实现了账号的恢复功能