• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/**
2 * Copyright (c) 2023 Huawei Device Co., Ltd.
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 *     http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16import account_osAccount from '@ohos.account.osAccount';
17import display from '@ohos.display';
18import UIExtensionContentSession from '@ohos.app.ability.UIExtensionContentSession';
19import PassWord from '../../common/components/PassWord';
20import SixPassword from '../../common/components/SixPassword';
21import { DialogType } from '../../common/module/DialogType';
22import AuthUtils from '../../common/utils/AuthUtils';
23import FuncUtils from '../../common/utils/FuncUtils';
24import LogUtils from '../../common/utils/LogUtils';
25import TimeUtils from '../../common/utils/TimeUtils';
26import Constants, { CmdData, CmdType, FingerPosition, WantParams } from '../../common/vm/Constants';
27import common from '@ohos.app.ability.common';
28
29const TAG = 'FingerprintAuth';
30const INTERVAL = 1000;
31let pinAuthManager: account_osAccount.PINAuth;
32let pinData = '';
33const THOUSANDTH = 1000;
34const BOTTOM_BUTTON = 56;
35const BOTTOM_TEXT = 20;
36const PADDING_8 = 8;
37const PADDING_24 = 24;
38const SINGLE_FINGER = 1;
39const PIN_FINGER = 2;
40const SIX_PIN = 6;
41const MULTI_PIN = 5;
42const RADIUS = 2;
43const PIN_FAIL_TIP = 3;
44const AUTH_LOCK = 0;
45const NOTICE_DELAY = 50;
46const ON_SCREEN = 1;
47const UNDER_SCREEN = 2;
48const FINGER_SENSOR_POSITION_LINE = 0.75;
49const SECOND = 1000;
50
51@Component
52export default struct FingerprintAuth {
53  @Link type: string;
54  @Link pinSubType: string;
55  @Link dialogType: DialogType;
56  @State prompt: string = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
57    .getStringSync($r('app.string.unified_authwidget_hint_inscreen_fp').id);
58  @State @Watch('onTextValueChange') textValue: string = '';
59  @Link @Watch('onCmdDataChange') cmdData: Array<CmdType>;
60  @State isEdit: boolean = true;
61  @State inputValue: string = '';
62  @State state: number = this.dialogType === DialogType.PIN_FINGER ? PIN_FINGER : SINGLE_FINGER;
63  @State fingerPositionY: number = 0;
64  @State fingerPosition: FingerPosition = {
65    sensorType: '',
66    udSensorRadiusInPx: 60
67  }
68  @State fingerLock: boolean = false;
69  @StorageLink('SYSTEM_NAVIGATION_BAR_HEIGHT') SYSTEM_NAVIGATION_BAR_HEIGHT: number = 0;
70  @State screen: number[] = [];
71  @StorageLink('IS_LANDSCAPE') IS_LANDSCAPE: boolean = false;
72  @State isOffFinger: boolean = false;
73  @State screenType: number = 0;
74
75  aboutToAppear(): void {
76    AuthUtils.getInstance().sendNotice('EVENT_AUTH_TYPE_READY', [Constants.noticeTypeFinger]);
77    try {
78      if (this.cmdData && this.cmdData.length > 0) {
79        this.onCmdDataChange('first');
80      }
81      if (this.fingerPosition.udSensorCenterYInThousandth !== undefined && (this.screenType === ON_SCREEN || this.screenType === UNDER_SCREEN)) {
82        let tempPositionY = px2vp(this.fingerPosition.udSensorCenterYInThousandth * this.screen[1]);
83        FuncUtils.judgmentOverflow(tempPositionY);
84        if (this.screenType === ON_SCREEN) {
85          this.fingerPositionY = px2vp(this.screen[1]) - tempPositionY / THOUSANDTH + BOTTOM_BUTTON
86          + PADDING_8 + BOTTOM_TEXT + PADDING_24;
87        } else if (this.screenType === UNDER_SCREEN) {
88          this.fingerPositionY = px2vp(this.screen[1]) - tempPositionY / THOUSANDTH + PADDING_24;
89        }
90        FuncUtils.judgmentOverflow(this.fingerPositionY);
91      }
92      LogUtils.info(TAG, 'aboutToAppear this.fingerPositionY: ' + this.fingerPositionY);
93      pinAuthManager = new account_osAccount.PINAuth();
94      pinAuthManager.registerInputer({
95        onGetData: (authSubType: account_osAccount.AuthSubType, callback: account_osAccount.IInputData) => {
96          LogUtils.info(TAG, 'aboutToAppear registerInputer onGetData');
97          let uint8PW = FuncUtils.getUint8PW(pinData);
98          callback.onSetData(authSubType, uint8PW);
99        }
100      });
101    } catch (error) {
102      LogUtils.error(TAG, 'aboutToAppear PINAuth catch error: ' + error?.code);
103      (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
104    }
105  }
106
107  aboutToDisappear(): void {
108    LogUtils.info(TAG, 'PINAuth unregisterInputer');
109    pinAuthManager?.unregisterInputer?.();
110  }
111
112  onTextValueChange(): void {
113    pinData = this.textValue;
114  }
115
116  onCmdDataChange(num?: string): void {
117    this.cmdData.length > 0 && this.cmdData.map((item) => {
118      const payload: CmdData = item.payload;
119      if (payload.type === Constants.noticeTypePin) {
120        if (payload.result === 0) {
121          (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
122        } else {
123          if (payload.remainAttempts) {
124            this.inputValue = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
125              .getStringSync($r('app.string.unified_authwidget_hint_pwd_error').id);
126            this.textValue = '';
127            if (num === 'first') {
128              this.inputValue = '';
129            }
130            if (payload.remainAttempts < PIN_FAIL_TIP) {
131              this.inputValue = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
132                .getStringSync($r('app.string.unified_authwidget_pwd_error_can_try').id) +
133              payload.remainAttempts + (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
134                .getStringSync($r('app.string.unified_authwidget_frequency').id);
135            }
136          }
137          if (payload.remainAttempts === AUTH_LOCK && payload.lockoutDuration) {
138            this.countTime(payload.lockoutDuration);
139            this.textValue = '';
140            this.toPin();
141            this.isEdit = false;
142          }
143        }
144      } else if (payload.type === Constants.noticeTypeFinger) {
145        if ([MULTI_PIN, SIX_PIN].includes(this.state)) {
146          return;
147        }
148        const displayClass = display.getDefaultDisplaySync();
149        this.screen = [displayClass.width, displayClass.height];
150        if (payload.sensorInfo && JSON.stringify(payload.sensorInfo) !== '{}') {
151          this.fingerPosition = JSON.parse(payload.sensorInfo);
152          switch (this.fingerPosition.sensorType) {
153            case 'OUT_OF_SCREEN_SENSOR': {
154              this.isOffFinger = true;
155              break;
156            }
157            default:
158              let tempPositionLine = JSON.parse(payload.sensorInfo).udSensorCenterYInThousandth / displayClass.height;
159              FuncUtils.judgmentOverflow(tempPositionLine);
160              if (tempPositionLine < FINGER_SENSOR_POSITION_LINE) {
161                this.screenType = ON_SCREEN;
162              } else if (tempPositionLine > FINGER_SENSOR_POSITION_LINE) {
163                this.screenType = UNDER_SCREEN;
164              }
165              break;
166          }
167        }
168        if (payload.remainAttempts && payload.result !== 0) {
169          this.prompt = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
170            .getStringSync($r('app.string.unified_authwidget_hint_fp_retry_s2').id);
171          this.fingerLock = false;
172          if (payload.remainAttempts > AUTH_LOCK && num !== 'first' && payload.result != 0) {
173            setTimeout(() => {
174              AuthUtils.getInstance().sendNotice('EVENT_AUTH_TYPE_READY', [Constants.noticeTypeFinger]);
175            }, NOTICE_DELAY);
176          }
177        }
178        if (num === 'first') {
179          this.prompt = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
180            .getStringSync(this.isOffFinger ?
181            $r('app.string.unified_authwidget_hint_normal_fp_only').id :
182            $r('app.string.unified_authwidget_hint_inscreen_fp').id);
183        }
184        if (payload.remainAttempts === AUTH_LOCK) {
185          this.prompt = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
186            .getStringSync($r('app.string.unified_authwidget_title_number_failed_fp_forbidden').id);
187          this.fingerLock = true;
188          if (this.dialogType === DialogType.PIN_FINGER) {
189            AuthUtils.getInstance().sendNotice(Constants.noticeEventCancel, [Constants.noticeTypeFinger]);
190            if (this.pinSubType !== Constants.pinSix) {
191              this.state = MULTI_PIN;
192            } else {
193              this.state = SIX_PIN;
194            }
195          }
196        }
197        if (payload.result === 0) {
198          this.prompt = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
199            .getStringSync($r('app.string.unified_authwidget_hint_fp_verify_success').id)
200          setTimeout(() => {
201            (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
202          }, SECOND);
203        }
204      } else {
205        LogUtils.error(TAG, 'onCmdDataChange default');
206        (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
207      }
208    })
209  }
210
211  sendFingerEvent(): void {
212    if (!this.fingerLock) {
213      AuthUtils.getInstance().sendNotice('EVENT_AUTH_TYPE_READY', [Constants.noticeTypeFinger]);
214    }
215  }
216
217  countTime(freezingTime: number): void {
218    const TRY_AGAIN = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
219      .getStringSync($r('app.string.unified_authwidget_postretry').id);
220    let promptText: string = '';
221    let freezingMillisecond = freezingTime;
222    // O: freezing FINISH
223    if (freezingMillisecond > 0) {
224      promptText = TimeUtils.getFreezingTimeNm(freezingMillisecond, (AppStorage.get("context") as common.ExtensionContext));
225      promptText = (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
226        .getStringSync($r('app.string.unified_authwidget_many_failures').id) + promptText + TRY_AGAIN;
227      setTimeout((t: number):void => this.countTime(t), INTERVAL, freezingTime - INTERVAL);
228    } else {
229      promptText = ' ';
230      this.isEdit = true;
231    }
232    this.inputValue = promptText;
233  }
234
235  onFingerPrintFontColor(prompt: string, context: Context): Resource {
236    if (prompt === context?.resourceManager?.getStringSync($r('app.string.unified_authwidget_hint_fp_retry_s2').id) ||
237      prompt === context?.resourceManager?.getStringSync($r('app.string.unified_authwidget_title_number_failed_fp_forbidden').id)) {
238      return $r('sys.color.ohos_id_color_warning');
239    } else if (prompt === context?.resourceManager?.getStringSync($r('app.string.unified_authwidget_hint_fp_verify_success').id) ||
240    context?.resourceManager?.getStringSync($r('app.string.unified_authwidget_hint_inscreen_fp').id) ||
241    context?.resourceManager?.getStringSync($r('app.string.unified_authwidget_hint_normal_fp_only').id)) {
242      return $r('sys.color.ohos_id_color_text_secondary');
243    } else {
244      return $r('sys.color.ohos_id_color_text_secondary');
245    }
246  }
247
248  getFingerPosition(type: string): Resource {
249    switch (type) {
250      case 'BACK':
251        return $r('app.media.icon_applock_2');
252      case 'FRONT':
253        return $r('app.media.icon_applock_3');
254      case 'SIDE':
255        return $r('app.media.icon_applock_4');
256      default:
257        return $r('app.media.icon_applock_3');
258    }
259  }
260
261  handleCancel(): void {
262    if (this.state === SIX_PIN || this.state === MULTI_PIN) {
263      AuthUtils.getInstance().sendNotice(Constants.noticeEventCancel, [Constants.noticeTypePin]);
264    } else {
265      AuthUtils.getInstance().sendNotice(Constants.noticeEventCancel, [] ||
266        (AppStorage.get("wantParams") as WantParams)?.type as string[]);
267    }
268    (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
269  }
270
271  toPin(): void {
272    LogUtils.debug(TAG, 'toPin this.pinSubType: ' + this.pinSubType);
273    AuthUtils.getInstance().sendNotice(Constants.noticeEventCancel, [Constants.noticeTypeFinger]);
274    if (this.pinSubType !== Constants.pinSix) {
275      this.state = MULTI_PIN;
276    } else {
277      this.state = SIX_PIN;
278    }
279  }
280
281  build() {
282    Column() {
283      GridRow({
284        columns: { xs: 4, sm: 4, md: 8, lg: 12 },
285        gutter: { x: 24, y: 24 },
286        breakpoints: { value: Constants.deviceDpi,
287          reference: BreakpointsReference.WindowSize },
288        direction: GridRowDirection.Row
289      }) {
290        GridCol({
291          span: { xs: 4, sm: 4, md: 4, lg: 6 },
292          offset: { md: 2, lg: 3 },
293        }) {
294          if (this.isOffFinger) {
295            Column() {
296              if ([PIN_FINGER, SINGLE_FINGER].includes(this.state) && this.fingerPosition !== undefined) {
297                if (AppStorage.Get('titleLength') as number < (AppStorage.get("wantParams") as WantParams)?.title.length) {
298                  Scroll() {
299                    Column() {
300                      Text((AppStorage.get("wantParams") as WantParams)?.title)
301                        .draggable(false)
302                        .fontSize($r('sys.float.ohos_id_text_size_body1'))
303                        .fontColor($r('sys.color.ohos_id_color_text_primary'))
304                        .fontWeight(FontWeight.Medium)
305                      Image(this.getFingerPosition(this.fingerPosition.outOfScreenSensorType as string))
306                        .draggable(false)
307                        .width($r('app.float.image_big'))
308                        .height($r('app.float.image_big'))
309                        .margin({ top: $r('app.float.content_padding'), bottom: $r('app.float.content_padding') })
310                        .id('outFingerImage')
311                      Text(this.prompt)
312                        .draggable(false)
313                        .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
314                        .fontSize($r('sys.float.ohos_id_text_size_body2'))
315                    }.margin({left: $r('app.float.size_24'), right: $r('app.float.size_24')})
316                  }
317                  .width('100%')
318                  .height($r('app.float.scroll_height_220'))
319                  .margin({ top: $r('app.float.title_padding_top') })
320                  .scrollable(ScrollDirection.Vertical)
321                  .scrollBarColor(Color.Gray)
322                } else {
323                  Text((AppStorage.get("wantParams") as WantParams)?.title)
324                    .draggable(false)
325                    .margin({ top: $r('app.float.title_padding_top') })
326                    .fontSize($r('sys.float.ohos_id_text_size_body1'))
327                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
328                    .height($r('app.float.size_24'))
329                    .fontWeight(FontWeight.Medium)
330                  Image(this.getFingerPosition(this.fingerPosition.outOfScreenSensorType as string))
331                    .draggable(false)
332                    .width($r('app.float.image_big'))
333                    .height($r('app.float.image_big'))
334                    .margin({ top: $r('app.float.content_padding'), bottom: $r('app.float.content_padding') })
335                    .id('outFingerImage')
336                  Text(this.prompt)
337                    .draggable(false)
338                    .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
339                    .fontSize($r('sys.float.ohos_id_text_size_body2'))
340                }
341              }
342
343              if (this.state === PIN_FINGER) {
344                Row() {
345                  Column() {
346                    Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
347                      .id('cancelBthState3FingerprintAuth')
348                      .margin({ left: $r('app.float.content_padding') })
349                      .width(Constants.ninetyPercentWidth)
350                      .height($r('app.float.btn_height'))
351                      .fontSize($r('sys.float.ohos_id_text_size_button1'))
352                      .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
353                      .fontWeight(FontWeight.Medium)
354                      .backgroundColor(Color.Transparent)
355                      .onClick(() => {
356                        this.handleCancel();
357                        this.textValue = '';
358                      })
359                  }.width(Constants.halfContainerWidth)
360
361                  Divider()
362                    .vertical(true)
363                    .height($r('app.float.digital_password_mask_height'))
364                    .color($r('sys.color.ohos_id_color_list_separator'))
365                    .width($r('app.float.divider_width'))
366                  Column() {
367                    Button($r('app.string.unified_authwidget_usepwd'))
368                      .id('usePwdBtnState3FingerprintAuth')
369                      .margin({ right: $r('app.float.content_padding') })
370                      .width(Constants.ninetyPercentWidth)
371                      .height($r('app.float.btn_height'))
372                      .fontSize($r('sys.float.ohos_id_text_size_button1'))
373                      .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
374                      .fontWeight(FontWeight.Medium)
375                      .backgroundColor(Color.Transparent)
376                      .onClick(() => {
377                        this.inputValue = ' ';
378                        this.toPin();
379                      })
380                  }.width(Constants.halfContainerWidth)
381                }
382                .height($r('app.float.btn_height'))
383                .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
384              } else if (this.state === SINGLE_FINGER) {
385                if (!((AppStorage.get("wantParams") as WantParams)?.navigationButtonText as string)) {
386                  Row() {
387                    Column() {
388                      Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
389                        .id('cancelDefBtnState3FingerprintAuth')
390                        .onClick(() => {
391                          this.handleCancel();
392                        })
393                        .backgroundColor(Color.Transparent)
394                        .height($r('app.float.btn_height'))
395                        .width(Constants.halfContainerWidth)
396                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
397                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
398                        .fontWeight(FontWeight.Medium)
399                    }.width(Constants.fullContainerHeight)
400                  }
401                  .height($r('app.float.btn_height'))
402                  .padding({ left: $r('app.float.content_padding'), right: $r('app.float.content_padding') })
403                  .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
404                } else {
405                  Row() {
406                    Column() {
407                      Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
408                        .id('cancelBtnState3FingerprintAuth')
409                        .margin({ left: $r('app.float.content_padding') })
410                        .width(Constants.ninetyPercentWidth)
411                        .height($r('app.float.btn_height'))
412                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
413                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
414                        .fontWeight(FontWeight.Medium)
415                        .backgroundColor(Color.Transparent)
416                        .onClick(() => {
417                          this.handleCancel();
418                        })
419                    }.width(Constants.halfContainerWidth)
420
421                    Divider()
422                      .vertical(true)
423                      .height($r('app.float.digital_password_mask_height'))
424                      .color($r('sys.color.ohos_id_color_list_separator'))
425                      .width($r('app.float.divider_width'))
426                    Column() {
427                      Button((AppStorage.get("wantParams") as WantParams)?.navigationButtonText as string)
428                        .onClick(() => {
429                          AuthUtils.getInstance()
430                            .sendNotice('EVENT_AUTH_USER_NAVIGATION', [Constants.noticeTypeFinger]);
431                          (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
432                        })
433                        .margin({ right: $r('app.float.content_padding') })
434                        .width(Constants.ninetyPercentWidth)
435                        .height($r('app.float.btn_height'))
436                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
437                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
438                        .fontWeight(FontWeight.Medium)
439                        .backgroundColor(Color.Transparent)
440                    }.width(Constants.halfContainerWidth)
441                  }
442                  .height($r('app.float.btn_height'))
443                  .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
444                }
445              } else if (this.state === MULTI_PIN) {
446                // Password 32-bit
447                Column() {
448                  PassWord({
449                    textValue: $textValue,
450                    inputValue: $inputValue,
451                    isEdit: $isEdit,
452                    pinSubType: $pinSubType
453                  })
454                  Row() {
455                    Column() {
456                      Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
457                        .id('cancelStateMultiFingerprintAuth')
458                        .margin({ left: $r('app.float.content_padding') })
459                        .width(Constants.ninetyPercentWidth)
460                        .height($r('app.float.btn_height'))
461                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
462                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
463                        .fontWeight(FontWeight.Medium)
464                        .backgroundColor(Color.Transparent)
465                        .onClick(() => {
466                          this.handleCancel();
467                          this.textValue = '';
468                        })
469                    }.width(Constants.halfContainerWidth)
470
471                    Divider()
472                      .vertical(true)
473                      .height($r('app.float.digital_password_mask_height'))
474                      .color($r('sys.color.ohos_id_color_list_separator'))
475                      .width($r('app.float.divider_width'))
476                    Column() {
477                      Button($r('app.string.unified_authwidget_confirm'))
478                        .margin({ right: $r('app.float.content_padding') })
479                        .width(Constants.ninetyPercentWidth)
480                        .height($r('app.float.btn_height'))
481                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
482                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
483                        .fontWeight(FontWeight.Medium)
484                        .backgroundColor(Color.Transparent)
485                        .onClick(async (e) => {
486                          AuthUtils.getInstance().sendNotice('EVENT_AUTH_TYPE_READY', [Constants.noticeTypePin]);
487                        })
488                    }.width(Constants.halfContainerWidth)
489                  }
490                  .height($r('app.float.btn_height'))
491                  .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
492                }
493              } else if (this.state === SIX_PIN) {
494                // Password 6-bit
495                Column() {
496                  SixPassword({
497                    textValue: $textValue,
498                    inputValue: $inputValue,
499                    isEdit: $isEdit
500                  })
501                  Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
502                    .id('cancelState6FingerprintAuth')
503                    .onClick(() => {
504                      this.handleCancel();
505                      this.textValue = '';
506                    })
507                    .backgroundColor(Color.Transparent)
508                    .height($r('app.float.btn_height'))
509                    .width(Constants.halfContainerWidth)
510                    .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
511                    .fontSize($r('sys.float.ohos_id_text_size_button1'))
512                    .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
513                    .fontWeight(FontWeight.Medium)
514                }
515              }
516            }
517            .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
518            .borderRadius($r('sys.float.ohos_id_corner_radius_dialog'))
519            .margin({
520              left: ($r('sys.float.ohos_id_dialog_margin_start')),
521              right: ($r('sys.float.ohos_id_dialog_margin_end')),
522              bottom: this.IS_LANDSCAPE ? '0' : ($r('sys.float.ohos_id_dialog_margin_bottom'))
523            })
524          } else {
525            if (this.state === MULTI_PIN) {
526              Column() {
527                // Password 32-bit
528                Column() {
529                  PassWord({
530                    textValue: $textValue,
531                    inputValue: $inputValue,
532                    isEdit: $isEdit,
533                    pinSubType: $pinSubType
534                  })
535                  Row() {
536                    Column() {
537                      Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
538                        .id('cancelBtnState5FingerprintAuth')
539                        .margin({ left: $r('app.float.content_padding') })
540                        .width(Constants.ninetyPercentWidth)
541                        .height($r('app.float.btn_height'))
542                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
543                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
544                        .fontWeight(FontWeight.Medium)
545                        .backgroundColor(Color.Transparent)
546                        .onClick(() => {
547                          this.handleCancel();
548                          this.textValue = '';
549                        })
550                    }.width(Constants.halfContainerWidth)
551
552                    Divider()
553                      .vertical(true)
554                      .height($r('app.float.digital_password_mask_height'))
555                      .color($r('sys.color.ohos_id_color_list_separator'))
556                      .width($r('app.float.divider_width'))
557                    Column() {
558                      Button($r('app.string.unified_authwidget_confirm'))
559                        .id('okBthState5FingerprintAuth')
560                        .margin({ right: $r('app.float.content_padding') })
561                        .width(Constants.ninetyPercentWidth)
562                        .height($r('app.float.btn_height'))
563                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
564                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
565                        .fontWeight(FontWeight.Medium)
566                        .backgroundColor(Color.Transparent)
567                        .onClick(async (e) => {
568                          AuthUtils.getInstance().sendNotice('EVENT_AUTH_TYPE_READY', [Constants.noticeTypePin]);
569                        })
570                    }.width(Constants.halfContainerWidth)
571                  }
572                  .height($r('app.float.btn_height'))
573                  .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
574                }
575              }
576              .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
577              .borderRadius($r('sys.float.ohos_id_corner_radius_dialog'))
578              .margin({
579                left: ($r('sys.float.ohos_id_dialog_margin_start')),
580                right: ($r('sys.float.ohos_id_dialog_margin_end')),
581                bottom: this.IS_LANDSCAPE ? '0' : ($r('sys.float.ohos_id_dialog_margin_bottom'))
582              })
583            } else if (this.state === SIX_PIN) {
584              Column() {
585                // Password 6-bit
586                Column() {
587                  SixPassword({
588                    textValue: $textValue,
589                    inputValue: $inputValue,
590                    isEdit: $isEdit
591                  })
592                  Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
593                    .id('sixPassCancel')
594                    .onClick(() => {
595                      this.handleCancel();
596                      this.textValue = '';
597                    })
598                    .backgroundColor(Color.Transparent)
599                    .height($r('app.float.btn_height'))
600                    .width(Constants.halfContainerWidth)
601                    .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
602                    .fontSize($r('sys.float.ohos_id_text_size_button1'))
603                    .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
604                    .fontWeight(FontWeight.Medium)
605                }
606              }
607              .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
608              .borderRadius($r('sys.float.ohos_id_corner_radius_dialog'))
609              .margin({
610                left: ($r('sys.float.ohos_id_dialog_margin_start')),
611                right: ($r('sys.float.ohos_id_dialog_margin_end')),
612                bottom: this.IS_LANDSCAPE ? '0' : ($r('sys.float.ohos_id_dialog_margin_bottom'))
613              })
614            } else if (this.state === PIN_FINGER && this.fingerPosition.udSensorRadiusInPx !== undefined ) {
615              Column() {
616                if (this.screenType === ON_SCREEN) {
617                  if (AppStorage.Get('titleLength') as number < (AppStorage.get("wantParams") as WantParams)?.title.length) {
618                    Scroll() {
619                      Text((AppStorage.get("wantParams") as WantParams)?.title)
620                        .draggable(false)
621                        .fontSize($r('sys.float.ohos_id_text_size_body1'))
622                        .fontColor($r('sys.color.ohos_id_color_text_primary'))
623                        .fontWeight(FontWeight.Medium)
624                        .margin({left: $r('app.float.size_24'), right: $r('app.float.size_24')})
625                    }
626                    .width('100%')
627                    .height($r('app.float.textArea_height'))
628                    .margin({ top: $r('app.float.title_padding_top') })
629                    .scrollable(ScrollDirection.Vertical)
630                    .scrollBarColor(Color.Gray)
631                  } else {
632                    Text((AppStorage.get("wantParams") as WantParams)?.title)
633                      .draggable(false)
634                      .margin({ top: $r('app.float.title_padding_top') })
635                      .fontSize($r('sys.float.ohos_id_text_size_body1'))
636                      .fontColor($r('sys.color.ohos_id_color_text_primary'))
637                      .height($r('app.float.size_24'))
638                      .fontWeight(FontWeight.Medium)
639                  }
640                  Image(this.prompt === (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
641                    .getStringSync($r('app.string.unified_authwidget_hint_fp_verify_success').id)
642                    ? $r('app.media.right_faceID') : $r('app.media.ic_blue_fingerprint'))
643                    .draggable(false)
644                    .margin({
645                      top: $r('app.float.digital_password_mask_height'),
646                      bottom: $r('app.float.digital_password_mask_height')
647                    })
648                    .id('blueFingerprintImgState2FingerprintAuth')
649                    .width(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
650                    .height(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
651                    .colorBlend($r('sys.color.ohos_id_color_activated'))
652                    .onClick(() => {
653                      this.sendFingerEvent();
654                    })
655                  Text(this.prompt)
656                    .draggable(false)
657                    .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
658                    .fontSize($r('sys.float.ohos_id_text_size_body2'))
659                  Row() {
660                    Column() {
661                      Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
662                        .id('cancelBtnState2FingerprintAuth')
663                        .margin({ left: $r('app.float.content_padding') })
664                        .width(Constants.ninetyPercentWidth)
665                        .height($r('app.float.btn_height'))
666                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
667                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
668                        .fontWeight(FontWeight.Medium)
669                        .backgroundColor(Color.Transparent)
670                        .onClick(() => {
671                          this.handleCancel();
672                          this.textValue = '';
673                        })
674                    }.width(Constants.halfContainerWidth)
675
676                    Divider()
677                      .vertical(true)
678                      .height($r('app.float.digital_password_mask_height'))
679                      .color($r('sys.color.ohos_id_color_list_separator'))
680                      .width($r('app.float.divider_width'))
681                    Column() {
682                      Button($r('app.string.unified_authwidget_usepwd'))
683                        .id('usePwdBtnState2FingerprintAuth')
684                        .margin({ right: $r('app.float.content_padding') })
685                        .width(Constants.ninetyPercentWidth)
686                        .height($r('app.float.btn_height'))
687                        .fontSize($r('sys.float.ohos_id_text_size_button1'))
688                        .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
689                        .fontWeight(FontWeight.Medium)
690                        .backgroundColor(Color.Transparent)
691                        .onClick(() => {
692                          this.inputValue = ' ';
693                          this.toPin();
694                        })
695                    }.width(Constants.halfContainerWidth)
696                  }
697                  .height($r('app.float.btn_height'))
698                  .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
699                } else if (this.screenType === UNDER_SCREEN) {
700                  Flex({ justifyContent: FlexAlign.SpaceBetween }) {
701                    Image($r('app.media.ic_public_cancel'))
702                      .draggable(false)
703                      .id('cancelBtnState4FingerprintAuth')
704                      .width($r('app.float.digital_password_mask_height'))
705                      .height($r('app.float.digital_password_mask_height'))
706                      .margin({
707                        top: $r('app.float.digital_password_mask_height'),
708                        left: $r('app.float.digital_password_mask_height')
709                      })
710                      .onClick(() => {
711                        this.handleCancel();
712                        this.textValue = '';
713                      })
714                    Button($r('app.string.unified_authwidget_usepwd'))
715                      .backgroundColor(Color.White)
716                      .height($r('app.float.digital_password_mask_height'))
717                      .padding(0)
718                      .margin({
719                        top: $r('app.float.digital_password_mask_height'),
720                        right: $r('app.float.digital_password_mask_height')
721                      })
722                      .fontColor($r('sys.color.ohos_id_color_activated'))
723                      .fontSize($r('sys.float.ohos_id_text_size_body1'))
724                      .fontWeight(FontWeight.Medium)
725                      .onClick(() => {
726                        this.inputValue = ' ';
727                        this.toPin();
728                      })
729                  }
730
731                  if (AppStorage.Get('titleLength') as number < (AppStorage.get("wantParams") as WantParams)?.title.length) {
732                    Scroll() {
733                      Column() {
734                        Text((AppStorage.get("wantParams") as WantParams)?.title)
735                          .draggable(false)
736                          .fontSize($r('sys.float.ohos_id_text_size_body1'))
737                          .fontColor($r('sys.color.ohos_id_color_text_primary'))
738                          .fontWeight(FontWeight.Medium)
739                        Text(this.prompt)
740                          .draggable(false)
741                          .margin({ top: $r('app.float.element_margin') })
742                          .height($r('app.float.size_24'))
743                          .fontSize($r('sys.float.ohos_id_text_size_body2'))
744                          .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
745                      }.margin({left: $r('app.float.size_24'), right: $r('app.float.size_24')})
746                    }
747                    .width('100%')
748                    .height($r('app.float.scroll_height_76'))
749                    .scrollable(ScrollDirection.Vertical)
750                    .scrollBarColor(Color.Gray)
751                  } else {
752                    Text((AppStorage.get("wantParams") as WantParams)?.title)
753                      .draggable(false)
754                      .fontSize($r('sys.float.ohos_id_text_size_body1'))
755                      .fontColor($r('sys.color.ohos_id_color_text_primary'))
756                      .height($r('app.float.size_24'))
757                      .fontWeight(FontWeight.Medium)
758                    Text(this.prompt)
759                      .draggable(false)
760                      .margin({ top: $r('app.float.element_margin') })
761                      .height($r('app.float.size_24'))
762                      .fontSize($r('sys.float.ohos_id_text_size_body2'))
763                      .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
764                  }
765                  Image(this.prompt === (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
766                    .getStringSync($r('app.string.unified_authwidget_hint_fp_verify_success').id)
767                    ? $r('app.media.right_faceID') : $r('app.media.ic_blue_fingerprint'))
768                    .draggable(false)
769                    .width(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
770                    .height(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
771                    .margin({
772                      top: $r('app.float.digital_password_mask_height'),
773                      bottom: $r('app.float.digital_password_mask_height')
774                    })
775                    .colorBlend($r('sys.color.ohos_id_color_activated'))
776                    .onClick(() => {
777                      this.sendFingerEvent();
778                    })
779                }
780              }
781              .position({ y: -Math.ceil(this.fingerPositionY) })
782              .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
783              .borderRadius($r('sys.float.ohos_id_corner_radius_dialog'))
784              .margin({
785                left: ($r('sys.float.ohos_id_dialog_margin_start')),
786                right: ($r('sys.float.ohos_id_dialog_margin_end')),
787                bottom: ($r('sys.float.ohos_id_dialog_margin_bottom'))
788              })
789            } else if (this.state === SINGLE_FINGER) {
790              Column() {
791                if (this.screenType === ON_SCREEN && this.fingerPosition.udSensorRadiusInPx !== undefined) {
792                  if (AppStorage.Get('titleLength') as number < (AppStorage.get("wantParams") as WantParams)?.title.length) {
793                    Scroll() {
794                      Text((AppStorage.get("wantParams") as WantParams)?.title)
795                        .draggable(false)
796                        .fontSize($r('sys.float.ohos_id_text_size_body1'))
797                        .fontColor($r('sys.color.ohos_id_color_text_primary'))
798                        .fontWeight(FontWeight.Medium)
799                        .margin({left: $r('app.float.size_24'), right: $r('app.float.size_24')})
800                    }
801                    .width('100%')
802                    .height($r('app.float.textArea_height'))
803                    .margin({ top: $r('app.float.title_padding_top') })
804                    .scrollable(ScrollDirection.Vertical)
805                    .scrollBarColor(Color.Gray)
806                  } else {
807                    Text((AppStorage.get("wantParams") as WantParams)?.title)
808                      .draggable(false)
809                      .margin({ top: $r('app.float.title_padding_top') })
810                      .fontSize($r('sys.float.ohos_id_text_size_body1'))
811                      .fontColor($r('sys.color.ohos_id_color_text_primary'))
812                      .height($r('app.float.size_24'))
813                      .fontWeight(FontWeight.Medium)
814                  }
815                  Image(this.prompt === (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
816                    .getStringSync($r('app.string.unified_authwidget_hint_fp_verify_success').id)
817                    ? $r('app.media.right_faceID') : $r('app.media.ic_blue_fingerprint'))
818                    .draggable(false)
819                    .margin({
820                      top: $r('app.float.digital_password_mask_height'),
821                      bottom: $r('app.float.digital_password_mask_height')
822                    })
823                    .id('blueFingerprintState1FingerprintAuth')
824                    .width(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
825                    .height(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
826                    .colorBlend($r('sys.color.ohos_id_color_activated'))
827                    .onClick(() => {
828                      this.sendFingerEvent();
829                    })
830                  Text(this.prompt)
831                    .draggable(false)
832                    .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
833                    .fontSize($r('sys.float.ohos_id_text_size_body2'))
834                  if (!((AppStorage.get("wantParams") as WantParams)?.navigationButtonText as string)) {
835                    Row() {
836                      Column() {
837                        Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
838                          .id('cancelDefBtnState1FingerprintAuth')
839                          .onClick(() => {
840                            this.handleCancel();
841                          })
842                          .backgroundColor(Color.Transparent)
843                          .height($r('app.float.btn_height'))
844                          .width(Constants.halfContainerWidth)
845                          .fontSize($r('sys.float.ohos_id_text_size_button1'))
846                          .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
847                          .fontWeight(FontWeight.Medium)
848                      }.width(Constants.fullContainerHeight)
849                    }
850                    .height($r('app.float.btn_height'))
851                    .padding({ left: $r('app.float.content_padding'), right: $r('app.float.content_padding') })
852                    .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
853                  } else {
854                    Row() {
855                      Column() {
856                        Button($r('app.string.unified_authwidget_cancel'), { stateEffect: true })
857                          .id('cancelBtnState1FingerprintAuth')
858                          .margin({ left: $r('app.float.content_padding') })
859                          .width(Constants.ninetyPercentWidth)
860                          .height($r('app.float.btn_height'))
861                          .fontSize($r('sys.float.ohos_id_text_size_button1'))
862                          .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
863                          .fontWeight(FontWeight.Medium)
864                          .backgroundColor(Color.Transparent)
865                          .onClick(() => {
866                            this.handleCancel();
867                          })
868                      }.width(Constants.halfContainerWidth)
869
870                      Divider()
871                        .vertical(true)
872                        .height($r('app.float.digital_password_mask_height'))
873                        .color($r('sys.color.ohos_id_color_list_separator'))
874                        .width($r('app.float.divider_width'))
875                      Column() {
876                        Button(((AppStorage.get("wantParams") as WantParams)?.navigationButtonText as string))
877                          .onClick(() => {
878                            AuthUtils.getInstance()
879                              .sendNotice('EVENT_AUTH_USER_NAVIGATION', [Constants.noticeTypeFinger]);
880                            (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
881                          })
882                          .id('navigationButtonTextFingerprintAuth')
883                          .margin({ right: $r('app.float.content_padding') })
884                          .width(Constants.ninetyPercentWidth)
885                          .height($r('app.float.btn_height'))
886                          .fontSize($r('sys.float.ohos_id_text_size_button1'))
887                          .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
888                          .fontWeight(FontWeight.Medium)
889                          .backgroundColor(Color.Transparent)
890                      }.width(Constants.halfContainerWidth)
891                    }
892                    .height($r('app.float.btn_height'))
893                    .margin({ top: $r('app.float.element_margin'), bottom: $r('app.float.content_padding') })
894                  }
895                } else if (this.screenType === UNDER_SCREEN && this.fingerPosition.udSensorRadiusInPx !== undefined) {
896                  Flex({ justifyContent: FlexAlign.SpaceBetween }) {
897                    Image($r('app.media.ic_public_cancel'))
898                      .draggable(false)
899                      .id('fingerUnderImage')
900                      .width($r('app.float.digital_password_mask_height'))
901                      .height($r('app.float.digital_password_mask_height'))
902                      .margin({
903                        top: $r('app.float.digital_password_mask_height'),
904                        left: $r('app.float.digital_password_mask_height')
905                      })
906                      .onClick(() => {
907                        this.handleCancel();
908                        this.textValue = '';
909                      })
910                    if ((AppStorage.get("wantParams") as WantParams)?.navigationButtonText as string) {
911                      Button((AppStorage.get("wantParams") as WantParams)?.navigationButtonText as string)
912                        .id('fingerUnderButton')
913                        .backgroundColor(Color.White)
914                        .height($r('app.float.digital_password_mask_height'))
915                        .padding(0)
916                        .margin({
917                          top: $r('app.float.digital_password_mask_height'),
918                          right: $r('app.float.digital_password_mask_height')
919                        })
920                        .fontColor($r('sys.color.ohos_id_color_activated'))
921                        .fontSize($r('sys.float.ohos_id_text_size_body1'))
922                        .fontWeight(FontWeight.Medium)
923                        .onClick(() => {
924                          AuthUtils.getInstance()
925                            .sendNotice('EVENT_AUTH_USER_NAVIGATION', [Constants.noticeTypeFinger]);
926                          (AppStorage.get("session") as UIExtensionContentSession)?.terminateSelf();
927                        })
928                    }
929                  }
930
931                  if (AppStorage.Get('titleLength') as number < (AppStorage.get("wantParams") as WantParams)?.title.length) {
932                    Scroll() {
933                      Column() {
934                        Text((AppStorage.get("wantParams") as WantParams)?.title)
935                          .draggable(false)
936                          .fontSize($r('sys.float.ohos_id_text_size_body1'))
937                          .fontColor($r('sys.color.ohos_id_color_text_primary'))
938                          .fontWeight(FontWeight.Medium)
939                        Text(this.prompt)
940                          .draggable(false)
941                          .margin({ top: $r('app.float.element_margin') })
942                          .height($r('app.float.size_24'))
943                          .fontSize($r('sys.float.ohos_id_text_size_body2'))
944                          .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
945                      }.margin({left: $r('app.float.size_24'), right: $r('app.float.size_24')})
946                    }
947                    .width('100%')
948                    .height($r('app.float.scroll_height_76'))
949                    .scrollable(ScrollDirection.Vertical)
950                    .scrollBarColor(Color.Gray)
951                  } else {
952                    Text((AppStorage.get("wantParams") as WantParams)?.title)
953                      .draggable(false)
954                      .fontSize($r('sys.float.ohos_id_text_size_body1'))
955                      .fontColor($r('sys.color.ohos_id_color_text_primary'))
956                      .height($r('app.float.size_24'))
957                      .fontWeight(FontWeight.Medium)
958                    Text(this.prompt)
959                      .draggable(false)
960                      .margin({ top: $r('app.float.element_margin') })
961                      .height($r('app.float.size_24'))
962                      .fontSize($r('sys.float.ohos_id_text_size_body2'))
963                      .fontColor(this.onFingerPrintFontColor(this.prompt, (AppStorage.get("context") as common.ExtensionContext)))
964                  }
965                  Image(this.prompt === (AppStorage.get("context") as common.ExtensionContext)?.resourceManager
966                    .getStringSync($r('app.string.unified_authwidget_hint_fp_verify_success').id)
967                    ? $r('app.media.right_faceID') : $r('app.media.ic_blue_fingerprint'))
968                    .draggable(false)
969                    .width(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
970                    .height(px2vp(this.fingerPosition.udSensorRadiusInPx * RADIUS))
971                    .margin({
972                      top: $r('app.float.digital_password_mask_height'),
973                      bottom: $r('app.float.digital_password_mask_height')
974                    })
975                    .colorBlend($r('sys.color.ohos_id_color_activated'))
976                    .onClick(() => {
977                      this.sendFingerEvent();
978                    })
979                }
980              }
981              .position({ y: -Math.ceil(this.fingerPositionY) })
982              .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
983              .borderRadius($r('sys.float.ohos_id_corner_radius_dialog'))
984              .margin({
985                left: ($r('sys.float.ohos_id_dialog_margin_start')),
986                right: ($r('sys.float.ohos_id_dialog_margin_end')),
987                bottom: ($r('sys.float.ohos_id_dialog_margin_bottom'))
988              })
989            }
990          }
991        }
992      }
993    }
994    .margin(this.IS_LANDSCAPE ? '0' : { bottom: this.SYSTEM_NAVIGATION_BAR_HEIGHT })
995    .height(Constants.fullContainerHeight)
996    .justifyContent(this.IS_LANDSCAPE ? FlexAlign.Center : FlexAlign.End)
997    .backgroundColor(Color.Transparent)
998    .id('fingerprintAuth')
999  }
1000}
1001
1002