《仿盒马》app开发技术分享-- 回收金提现安全锁校验（55）

## 技术栈

Appgallery connect

## 开发准备

上一节我们实现了回收金提现记录的展示功能，我们回收金相关的内容更加的丰富了，在之前的业务逻辑中我们添加了一个设置安全锁的功能，虽然我们成功设置了安全锁，也把对应的表信息提交到云端，但是我们并没有在提现的流程中去使用安全锁相关的内容，这一节我们就把安全锁相关的内容跟提现流程关联起来，让我们的功能安全性更高

## 功能分析

首先我们在进入提现页面的时候要先查询当前userid下的安全锁表有没有数据，有数据我们就拿当前安全锁开启的状态，如果是开启的，那我们就在用户点击提现按钮的时候进行一个弹窗校验，根据用户在弹窗里绘制的值跟我们设置的安全锁的值进行匹配，如果匹配成功，就执行内容的添加操作，如果不成功，提醒用户，安全锁验证失败

## 代码实现

首先我们在提现页面先查询对应的表内容

```css

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

let condition3 = new cloudDatabase.DatabaseQuery(verify_info);

condition.equalTo("user_id", this.user?.user_id)

let listData3 = await databaseZone.query(condition3);

let json3 = JSON.stringify(listData3)

let data3: VerifyInfo[] = JSON.parse(json3)

this.verifyInfo=data3

```

然后我们进行数据源的非空判断，安全锁开关判断

```css

if (this.verifyInfo.length>0) {

if (this.verifyInfo[0].open_lock) {

}

}

```

都没问题之后我们需要有一个校验的弹窗

```css

import showToast from '../utils/ToastUtils';

@Preview

@CustomDialog

export struct WithdrawalLockDialog {

@State passwords: Number[]=[];

public callback:(passwords:string)=>void=():void=>{}

private patternLockController: PatternLockController = new PatternLockController();

controller: CustomDialogController;

build() {

Column({space:10}) {

Text("请验证您的安全密码！")

.fontColor(Color.White)

.fontWeight(FontWeight.Bold)

.fontSize(16)

.width('100%')

.textAlign(TextAlign.Center)

.padding(10)

PatternLock(this.patternLockController)

.sideLength(300)

.circleRadius(9)

.pathStrokeWidth(5)

.borderRadius(10)

.activeColor('#707070')

.selectedColor('#707070')

.pathColor('#707070')

.backgroundColor('#F5F5F5')

.autoReset(true)

.onDotConnect((index: number) => {

console.log("onDotConnect index: " + index);

})

.onPatternComplete((input: Array<number>) => {

if (input.length < 5) {

showToast("图案连接数不能小于5")

return;

}

const str: string = JSON.stringify(input);

this.callback(str)

this.controller.close()

})

}.width('100%').height(400)

}

}

```

这里我们把弹窗中输入的值通过回调传递出去，在提现页面引用弹窗

```css

private dialogController: CustomDialogController = new CustomDialogController({

builder: WithdrawalLockDialog({

callback: async (str:string)=>{

}

}),

alignment: DialogAlignment.Bottom,

customStyle:false

});

```

然后我们把输入的值跟表中存储的值进行校验，验证成功后提交对应的记录

```css

if (str==this.verifyInfo[0].lock_str) {

showToast("校验成功")

let record=new withdrawal_record()

record.id=Math.floor(Math.random() * 1000000)

record.user_id=this.user!.user_id

record.bank_name=this.bankList[0].bank_name

record.bank_num=this.bankList[0].bank_card

record.creat_time=this.year+"-"+this.month+"-"+this.day+" "+this.time

record.type_str='0'

record.money=this.moneyNum

let status = await databaseZone.upsert(record);

let money=new money_info()

money.id=Math.floor(Math.random() * 1000000)

money.user_id=this.user!.user_id

money.money=String(this.moneyNum)

money.all_money=''

money.money_type='1'

money.address='银行卡提现'

money.year=this.year

money.month=this.month

money.day=this.day

money.time=this.time

money.create_time=this.year+"-"+this.month+"-"+this.day+" "+this.time

let nums = await databaseZone.upsert(money);

let userData=new user_info()

userData.id=this.userInfo!.id

userData.user_id=this.userInfo!.user_id

userData.sex=this.userInfo!.sex

userData.bind_phone=this.userInfo!.bind_phone

userData.create_time=this.userInfo!.create_time

userData.nickname=this.userInfo!.nickname

userData.head_img=this.userInfo!.head_img

if (this.userInfo?.money!=null) {

userData.money=this.userInfo!.money-this.moneyNum

}else {

userData.money=0

}

if (this.userInfo?.points!=null) {

userData.points=this.userInfo!.points

}else {

userData.points=0

}

let s= await databaseZone.upsert(userData);

if (s>0) {

router.pushUrl({url:'pages/recycle/money/SuccessPage'})

}

this.dialogController.close()

}else {

showToast("安全锁验证失败！")

}

```

现在我们就成功在提现时开启安全锁