1/**
2 * Copyright (c) 2022-2024 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 { WidthPercent } from '../common/util/ConfigData';
17import HeadComponent from '../common/component/headComponent';
18import CmShowSysCaPresenter from '../presenter/CmShowSysCaPresenter';
19import CMShowUserCaPresenter from '../presenter/CmShowUserCaPresenter';
20import CmFaPresenter from '../presenter/CmFaPresenter';
21import { GlobalContext } from '../common/GlobalContext';
22import { CertAbstractVo } from '../model/CertManagerVo/CertAbstractVo';
23import ComponentConfig from '../common/component/ComponentConfig';
24import router from '@ohos.router';
25import { CustomContentDialog } from '@ohos.arkui.advanced.Dialog';
26import { NavEntryKey } from '../common/NavEntryKey';
27import { CaUserDetailParam } from './picker/CaUserDetailPage';
28import { SheetParam } from './picker/SheetParam';
29
30const COPIES_NUM: number = 12;
31
32@Component
33export struct DialogSubjectComponent {
34  private map?: Map<string, string>;
35  private subjectNameCN: string = '';
36  private subjectNameO: string = '';
37  private subjectNameOU: string = '';
38  private serial: string = '';
39
40  aboutToAppear() {
41    if (this.map != null) {
42      let subjectNameCN = this.map.get('常用名称:');
43      if (subjectNameCN !== undefined) {
44        this.subjectNameCN = subjectNameCN;
45      }
46
47      let subjectNameO = this.map.get('组织:');
48      if (subjectNameO !== undefined) {
49        this.subjectNameO = subjectNameO;
50      }
51
52      let subjectNameOU = this.map.get('组织单位:');
53      if (subjectNameOU !== undefined) {
54        this.subjectNameOU = subjectNameOU;
55      }
56
57      let serial = this.map.get('序列号:');
58      if (serial !== undefined) {
59        this.serial = serial;
60      }
61    }
62  }
63
64  build() {
65    Column() {
66      Text($r('app.string.DialogSubjectComponent_firText'))
67        .fontSize($r('sys.float.ohos_id_text_size_body2'))
68        .fontColor($r('sys.color.ohos_id_color_text_primary'))
69        .fontWeight(FontWeight.Regular)
70        .margin({
71          top: $r('app.float.sys_elements_margin_vertical_l')
72        })
73      Text(this.subjectNameCN)
74        .fontSize($r('sys.float.ohos_id_text_size_body2'))
75        .fontColor($r('sys.color.ohos_id_color_text_primary'))
76        .fontWeight(FontWeight.Regular)
77      Text($r('app.string.DialogSubjectComponent_secText'))
78        .fontSize($r('sys.float.ohos_id_text_size_body2'))
79        .fontColor($r('sys.color.ohos_id_color_text_primary'))
80        .fontWeight(FontWeight.Regular)
81        .margin({
82          top: $r('app.float.sys_elements_margin_vertical_m')
83        })
84      Text(this.subjectNameO)
85        .fontSize($r('sys.float.ohos_id_text_size_body2'))
86        .fontColor($r('sys.color.ohos_id_color_text_primary'))
87        .fontWeight(FontWeight.Regular)
88      Text($r('app.string.DialogSubjectComponent_thdText'))
89        .fontSize($r('sys.float.ohos_id_text_size_body2'))
90        .fontColor($r('sys.color.ohos_id_color_text_primary'))
91        .fontWeight(FontWeight.Regular)
92        .margin({
93          top: $r('app.float.sys_elements_margin_vertical_m')
94        })
95      Text(this.subjectNameOU)
96        .fontSize($r('sys.float.ohos_id_text_size_body2'))
97        .fontColor($r('sys.color.ohos_id_color_text_primary'))
98        .fontWeight(FontWeight.Regular)
99      Text($r('app.string.DialogSubjectComponent_fouText'))
100        .fontSize($r('sys.float.ohos_id_text_size_body2'))
101        .fontColor($r('sys.color.ohos_id_color_text_primary'))
102        .fontWeight(FontWeight.Regular)
103        .margin({
104          top: $r('app.float.sys_elements_margin_vertical_m')
105        })
106      Text(this.serial)
107        .fontSize($r('sys.float.ohos_id_text_size_body2'))
108        .fontColor($r('sys.color.ohos_id_color_text_primary'))
109        .fontWeight(FontWeight.Regular)
110    }.alignItems(HorizontalAlign.Start);
111  }
112}
113
114@Component
115export struct DialogIssuerComponent {
116  private map?: Map<string, string>;
117  private issuerNameCN: string = '';
118  private issuerNameO: string = '';
119  private issuerNameOU: string = '';
120
121  aboutToAppear() {
122    if (this.map != null) {
123      let issuerNameCN = this.map.get('常用名称:');
124      if (issuerNameCN !== undefined) {
125        this.issuerNameCN = issuerNameCN;
126      }
127
128      let issuerNameO = this.map.get('组织:');
129      if (issuerNameO !== undefined) {
130        this.issuerNameO = issuerNameO;
131      }
132
133      let issuerNameOU = this.map.get('组织单位:');
134      if (issuerNameOU !== undefined) {
135        this.issuerNameOU = issuerNameOU;
136      }
137    }
138  }
139
140  build() {
141    Column() {
142      Text($r('app.string.DialogSubjectComponent_firText'))
143        .fontSize($r('sys.float.ohos_id_text_size_body2'))
144        .fontColor($r('sys.color.ohos_id_color_text_primary'))
145        .fontWeight(FontWeight.Regular)
146        .margin({
147          top: $r('app.float.sys_elements_margin_vertical_l')
148        })
149      Text(this.issuerNameCN)
150        .fontSize($r('sys.float.ohos_id_text_size_body2'))
151        .fontColor($r('sys.color.ohos_id_color_text_primary'))
152        .fontWeight(FontWeight.Regular)
153      Text($r('app.string.DialogSubjectComponent_secText'))
154        .fontSize($r('sys.float.ohos_id_text_size_body2'))
155        .fontColor($r('sys.color.ohos_id_color_text_primary'))
156        .fontWeight(FontWeight.Regular)
157        .margin({
158          top: $r('app.float.sys_elements_margin_vertical_m')
159        })
160      Text(this.issuerNameO)
161        .fontSize($r('sys.float.ohos_id_text_size_body2'))
162        .fontColor($r('sys.color.ohos_id_color_text_primary'))
163        .fontWeight(FontWeight.Regular)
164      Text($r('app.string.DialogSubjectComponent_thdText'))
165        .fontSize($r('sys.float.ohos_id_text_size_body2'))
166        .fontColor($r('sys.color.ohos_id_color_text_primary'))
167        .fontWeight(FontWeight.Regular)
168        .margin({
169          top: $r('app.float.sys_elements_margin_vertical_m')
170        })
171      Text(this.issuerNameOU)
172        .fontSize($r('sys.float.ohos_id_text_size_body2'))
173        .fontColor($r('sys.color.ohos_id_color_text_primary'))
174        .fontWeight(FontWeight.Regular)
175    }.alignItems(HorizontalAlign.Start);
176  }
177}
178
179@Component
180export struct DialogDateComponent {
181  private map?: Map<string, string>;
182  private notBefore: string = '';
183  private notAfter: string = '';
184
185  aboutToAppear() {
186    if (this.map != null) {
187      let notBefore = this.map.get('颁发时间:');
188      if (notBefore != undefined) {
189        this.notBefore = notBefore;
190      }
191
192      let notAfter = this.map.get('有效期至:');
193      if (notAfter != undefined) {
194        this.notAfter = notAfter;
195      }
196    }
197  }
198
199  build() {
200    Column() {
201      Text($r('app.string.DialogSubjectComponent_fifText'))
202        .fontSize($r('sys.float.ohos_id_text_size_body2'))
203        .fontColor($r('sys.color.ohos_id_color_text_primary'))
204        .fontWeight(FontWeight.Regular)
205        .margin({
206          top: $r('app.float.sys_elements_margin_vertical_l')
207        })
208      Text(this.notBefore)
209        .fontSize($r('sys.float.ohos_id_text_size_body2'))
210        .fontColor($r('sys.color.ohos_id_color_text_primary'))
211        .fontWeight(FontWeight.Regular)
212      Text($r('app.string.DialogSubjectComponent_sixText'))
213        .fontSize($r('sys.float.ohos_id_text_size_body2'))
214        .fontColor($r('sys.color.ohos_id_color_text_primary'))
215        .fontWeight(FontWeight.Regular)
216        .margin({
217          top: $r('app.float.sys_elements_margin_vertical_m')
218        })
219      Text(this.notAfter)
220        .fontSize($r('sys.float.ohos_id_text_size_body2'))
221        .fontColor($r('sys.color.ohos_id_color_text_primary'))
222        .fontWeight(FontWeight.Regular)
223    }.alignItems(HorizontalAlign.Start);
224  }
225}
226
227@Component
228export struct DialogFingerPrintComponent {
229  private fingerprintSha256: string = '';
230
231  build() {
232    Column() {
233      Text($r('app.string.CustomDialogExample_FingerPrint_text'))
234        .fontSize($r('sys.float.ohos_id_text_size_body2'))
235        .fontColor($r('sys.color.ohos_id_color_text_primary'))
236        .fontWeight(FontWeight.Regular)
237        .margin({
238          top: $r('app.float.sys_elements_margin_vertical_l')
239        })
240      Text(this.fingerprintSha256)
241        .fontSize($r('sys.float.ohos_id_text_size_body2'))
242        .fontColor($r('sys.color.ohos_id_color_text_primary'))
243        .fontWeight(FontWeight.Regular)
244        .margin({
245          right: $r('app.float.wh_value_24')
246        })
247    }.alignItems(HorizontalAlign.Start);
248  }
249}
250
251@Component
252struct ComponentSystem {
253  private certAlias: string = '';
254  private subjectName: string = '';
255  private uri: string = '';
256  @Link setStatus: CmShowSysCaPresenter;
257  private sysCaScroller: Scroller = new Scroller();
258
259  onItemClicked?: () => void;
260
261  @State isHoverBackgroundColor: ResourceColor = '';
262  @Styles pressedStyles(): void {
263    .backgroundColor($r('sys.color.ohos_id_color_click_effect'))
264  }
265  @Styles normalStyles(): void {
266    .backgroundColor(this.isHoverBackgroundColor)
267  }
268
269  systemDetailsDialog: CustomDialogController = new CustomDialogController({
270    alignment: DialogAlignment.Center,
271    builder: CustomContentDialog({
272      contentBuilder: () => {
273        this.systemDetailContent();
274      },
275      contentAreaPadding: { right: $r('app.float.wh_value_0') },
276      buttons: [{
277        value: $r('app.string.CustomDialogExample_Button_text'),
278        buttonStyle: ButtonStyleMode.TEXTUAL,
279        action: () => {
280          this.systemDetailsDialog?.close();
281        }
282      }]
283    })
284  })
285
286  @Builder
287  systemDetailContent(): void {
288    Column() {
289      Text($r('app.string.CustomDialogExample_firText'))
290        .fontSize($r('sys.float.ohos_id_text_size_dialog_tittle'))
291        .fontColor($r('sys.color.ohos_id_color_text_primary'))
292        .fontWeight(FontWeight.Medium)
293        .height($r('app.float.wh_value_56'))
294        .margin({
295          bottom: $r('app.float.wh_value_8'),
296          right: $r('app.float.wh_value_24')
297        })
298        .alignSelf(ItemAlign.Start)
299
300      Text(this.setStatus.certInfo.certAlias)
301        .fontSize($r('sys.float.ohos_id_text_size_body1'))
302        .fontColor($r('sys.color.ohos_id_color_text_primary'))
303        .fontWeight(FontWeight.Medium)
304        .margin({
305          bottom: $r('app.float.wh_value_24'),
306          right: $r('app.float.wh_value_24')
307        })
308        .alignSelf(ItemAlign.Start)
309
310      Scroll(this.sysCaScroller) {
311        List() {
312          ListItem() {
313            Text($r('app.string.CustomDialogExample_firListItem_text'))
314              .fontSize($r('sys.float.ohos_id_text_size_body1'))
315              .fontColor($r('sys.color.ohos_id_color_text_primary'))
316              .fontWeight(FontWeight.Medium)
317          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
318
319          ListItem() {
320            DialogSubjectComponent({ map: this.setStatus.certInfo.subjectNameMap });
321          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
322
323          ListItem() {
324            Text($r('app.string.CustomDialogExample_secListItem_text'))
325              .fontSize($r('sys.float.ohos_id_text_size_body1'))
326              .fontColor($r('sys.color.ohos_id_color_text_primary'))
327              .fontWeight(FontWeight.Medium)
328          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
329          .margin({
330            top: $r('app.float.wh_value_24')
331          })
332
333          ListItem() {
334            DialogIssuerComponent({ map: this.setStatus.certInfo.issuerNameMap });
335          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
336
337          ListItem() {
338            Text($r('app.string.CustomDialogExample_thdListItem_text'))
339              .fontSize($r('sys.float.ohos_id_text_size_body1'))
340              .fontColor($r('sys.color.ohos_id_color_text_primary'))
341              .fontWeight(FontWeight.Medium)
342          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
343          .margin({
344            top: $r('app.float.wh_value_24')
345          })
346
347          ListItem() {
348            DialogDateComponent({ map: this.setStatus.certInfo.dateMap });
349          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
350
351          ListItem() {
352            Text($r('app.string.CustomDialogExample_fouListItem_text'))
353              .fontSize($r('sys.float.ohos_id_text_size_body1'))
354              .fontColor($r('sys.color.ohos_id_color_text_primary'))
355              .fontWeight(FontWeight.Medium)
356          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
357          .margin({
358            top: $r('app.float.wh_value_24')
359          })
360
361          ListItem() {
362            DialogFingerPrintComponent({ fingerprintSha256: this.setStatus.certInfo.fingerprintSha256 });
363          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
364        }
365        .margin({ right: $r('app.float.wh_value_24') })
366        .scrollBar(BarState.Off)
367      }
368      .scrollable(ScrollDirection.Vertical)
369      .scrollBarWidth('3vp')
370      .height($r('app.float.CustomDialogExample_list_height_value'))
371    }
372    .padding({
373      left: $r('app.float.wh_value_24'),
374    })
375    .width(WidthPercent.WH_100_100)
376    .borderRadius($r('app.float.user_list_divider_borderRadius_value'))
377    .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
378  }
379
380  build() {
381    Flex({ justifyContent: FlexAlign.SpaceBetween, alignItems: ItemAlign.Center }) {
382      Column() {
383        Text(this.certAlias)
384          .fontSize($r('sys.float.ohos_id_text_size_body1'))
385          .fontColor($r('sys.color.ohos_id_color_text_primary'))
386          .fontWeight(FontWeight.Medium)
387          .textAlign(TextAlign.Start)
388          .margin({ top: $r('app.float.wh_value_10') });
389        Text(this.subjectName)
390          .fontSize($r('sys.float.ohos_id_text_size_body2'))
391          .fontColor($r('sys.color.ohos_id_color_text_secondary'))
392          .fontWeight(FontWeight.Regular)
393          .textAlign(TextAlign.Start)
394          .margin({ top: $r('app.float.wh_value_2'), bottom: $r('app.float.wh_value_11') });
395      }.alignItems(HorizontalAlign.Start);
396    }
397    .onHover((isHover?: boolean) => {
398      this.isHoverBackgroundColor = isHover ? $r('sys.color.ohos_id_color_hover') : ''
399    })
400    .backgroundColor(this.isHoverBackgroundColor)
401    .stateStyles({
402      pressed: this.pressedStyles,
403      normal: this.normalStyles
404    })
405    .padding({
406      left: $r('app.float.wh_value_8'),
407      right: $r('app.float.wh_value_8')
408    })
409    .borderRadius($r('app.float.wh_value_20'))
410    .onClick(() => {
411      this.setStatus.getSystemTrustedCertificate(this.uri, () => {
412        if (this.onItemClicked !== undefined) {
413          this.onItemClicked();
414        } else {
415          this.systemDetailsDialog.open();
416        }
417      });
418    })
419  }
420}
421
422@Component
423struct ComponentUser {
424  private certAlias: string = '';
425  private subjectName: string = '';
426  private indexNum: number = -1;
427  private uri: string = '';
428  @State statusText: Resource = $r('app.string.CustomDialogExampleUser_Status_false');
429  @Link setStatus: CMShowUserCaPresenter;
430  @State mUserCaPresenterDetail: CMShowUserCaPresenter = CMShowUserCaPresenter.getInstance();
431  private userCaScroller: Scroller = new Scroller();
432
433  onItemClicked?: () => void;
434
435  @State isHoverBackgroundColor: ResourceColor = '';
436  @Styles pressedStyles(): void {
437    .backgroundColor($r('sys.color.ohos_id_color_click_effect'))
438  }
439  @Styles normalStyles(): void {
440    .backgroundColor(this.isHoverBackgroundColor)
441  }
442
443  rootCertificateDialog: CustomDialogController = new CustomDialogController({
444    alignment: DialogAlignment.Center,
445    cancel: () => {
446      this.setStatus.updateUserTrustedCertificateList();
447    },
448    builder: CustomContentDialog({
449      contentBuilder: () => {
450        this.rootCertificateContent();
451      },
452      contentAreaPadding: { right: $r('app.float.wh_value_0') },
453      buttons: [
454        {
455          value: $r('app.string.root_certificate_cancel'),
456          buttonStyle: ButtonStyleMode.TEXTUAL,
457          action: () => {
458            this.setStatus.updateUserTrustedCertificateList();
459          }
460        },
461        {
462          value: $r('app.string.root_certificate_continue'),
463          buttonStyle: ButtonStyleMode.TEXTUAL,
464          action: () => {
465            this.setStatus.setUserCertificateStatus(this.mUserCaPresenterDetail.certInfo.uri, true).then(result => {
466              if (result) {
467                this.setStatus.updateUserTrustedCertificateList();
468              }
469            });
470          }
471        }
472      ]
473    })
474  })
475
476  userDetailsDialog: CustomDialogController = new CustomDialogController({
477    alignment: DialogAlignment.Center,
478    cancel: () => {
479      this.setStatus.updateUserTrustedCertificateList();
480    },
481    builder: CustomContentDialog({
482      contentBuilder: () => {
483        this.userDetailContent(this.setStatus.certList[this.indexNum].status);
484      },
485      contentAreaPadding: { right: $r('app.float.wh_value_0') },
486      buttons: [
487        {
488          value: $r('app.string.CustomDialogExampleUser_Flex_firButton_text'),
489          buttonStyle: ButtonStyleMode.TEXTUAL,
490          action: () => {
491            this.setStatus.updateUserTrustedCertificateList();
492            this.userDetailsDialog?.close();
493          }
494        },
495        {
496          value: $r('app.string.CustomDialogExampleUser_Flex_secButton_text'),
497          buttonStyle: ButtonStyleMode.TEXTUAL,
498          action: () => {
499            this.onShowDeleteWarnDialog();
500          },
501          role: ButtonRole.ERROR
502        }
503      ]
504    })
505  })
506
507  deleteCertWarnDialog: CustomDialogController = new CustomDialogController({
508    cancel: () => {
509      this.setStatus.updateUserTrustedCertificateList();
510    },
511    builder: CustomContentDialog({
512      contentBuilder: () => {
513        this.deleteWarnContent();
514      },
515      contentAreaPadding: { right: $r('app.float.wh_value_0') },
516      buttons: [
517        {
518          value: $r('app.string.deleteAllCredCancel'),
519          buttonStyle: ButtonStyleMode.TEXTUAL,
520          action: () => {
521            this.deleteCertWarnDialog?.close();
522            this.setStatus.updateUserTrustedCertificateList();
523          }
524        },
525        {
526          value: $r('app.string.deleteAllCredDelete'),
527          buttonStyle: ButtonStyleMode.TEXTUAL,
528          action: () => {
529            this.setStatus.deleteUserCertificate(this.mUserCaPresenterDetail.certInfo.uri, () => {
530              this.setStatus.updateUserTrustedCertificateList();
531              this.deleteCertWarnDialog?.close();
532            })
533          },
534          role: ButtonRole.ERROR
535        }
536      ]
537    })
538  })
539
540  @Builder
541  rootCertificateContent(): void {
542    Column() {
543      Text($r('app.string.root_certificate'))
544        .height($r('app.float.wh_value_56'))
545        .fontSize($r('sys.float.ohos_id_text_size_dialog_tittle'))
546        .fontColor($r('sys.color.ohos_id_color_text_primary'))
547        .fontWeight(FontWeight.Medium)
548        .margin({
549          left: $r('app.float.wh_value_24'),
550          right: $r('app.float.wh_value_24')
551        })
552        .alignSelf(ItemAlign.Start)
553
554      Text($r('app.string.root_certificate_message'))
555        .fontSize($r('sys.float.ohos_id_text_size_body1'))
556        .fontWeight(FontWeight.Regular)
557        .fontColor($r('sys.color.ohos_id_color_primary'))
558        .margin({
559          left: $r('app.float.wh_value_24'),
560          right: $r('app.float.wh_value_24')
561        })
562        .alignSelf(ItemAlign.Start)
563    }
564    .width(WidthPercent.WH_100_100)
565    .borderRadius($r('app.float.user_list_divider_borderRadius_value'))
566    .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
567  }
568
569  @Builder
570  deleteWarnContent(): void {
571    Column() {
572      Text($r('app.string.CustomDialogExampleUser_warning_Button_title_text'))
573        .height($r('app.float.wh_value_56'))
574        .fontSize($r('sys.float.ohos_id_text_size_dialog_tittle'))
575        .fontColor($r('sys.color.ohos_id_color_text_primary'))
576        .fontWeight(FontWeight.Medium)
577        .margin({
578          left: $r('app.float.wh_value_24'),
579          right: $r('app.float.wh_value_24')
580        })
581        .alignSelf(ItemAlign.Start)
582
583      Text($r('app.string.CustomDialogExampleUser_warning_Button_message_text'))
584        .fontSize($r('sys.float.ohos_id_text_size_body1'))
585        .fontWeight(FontWeight.Regular)
586        .fontColor($r('sys.color.ohos_id_color_primary'))
587        .margin({
588          left: $r('app.float.wh_value_24'),
589          right: $r('app.float.wh_value_24')
590        })
591        .alignSelf(ItemAlign.Start)
592    }
593    .width(WidthPercent.WH_100_100)
594    .borderRadius($r('app.float.user_list_divider_borderRadius_value'))
595    .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
596  }
597
598  @Builder
599  userDetailContent($$: boolean): void {
600    Column() {
601      Text($r('app.string.CustomDialogExample_firText'))
602        .fontSize($r('sys.float.ohos_id_text_size_dialog_tittle'))
603        .fontColor($r('sys.color.ohos_id_color_text_primary'))
604        .fontWeight(FontWeight.Medium)
605        .height($r('app.float.wh_value_56'))
606        .margin({
607          bottom: $r('app.float.wh_value_8'),
608          right: $r('app.float.wh_value_24')
609        })
610        .alignSelf(ItemAlign.Start)
611
612      Flex({ justifyContent: FlexAlign.SpaceBetween, alignItems: ItemAlign.Center }) {
613        Column() {
614          Text(this.mUserCaPresenterDetail.certInfo.certAlias)
615            .fontSize($r('sys.float.ohos_id_text_size_body1'))
616            .fontColor($r('sys.color.ohos_id_color_text_primary'))
617            .fontWeight(FontWeight.Medium)
618        }.alignItems(HorizontalAlign.Start);
619
620        Toggle({ type: ToggleType.Switch, isOn: $$ })
621          .margin({
622            left: $r('app.float.wh_value_16'),
623            right: $r('app.float.wh_value_24')
624          })
625          .flexShrink(0)
626          .width($r('app.float.CustomDialogExampleUser_Flex_Toggle_width_value'))
627          .height($r('app.float.CustomDialogExampleUser_Flex_Toggle_height_value'))
628          .selectedColor($r('app.color.CustomDialogExampleUser_Flex_Toggle_selectedColor_007DFF'))
629          .onChange((isOn: boolean) => {
630            if (isOn) {
631              this.onShowRootCertificateDialog();
632            } else {
633              this.setStatus.setUserCertificateStatus(this.mUserCaPresenterDetail.certInfo.uri, false);
634            }
635          });
636      }
637
638      Scroll(this.userCaScroller) {
639        List() {
640          ListItem() {
641            Text($r('app.string.CustomDialogExample_firListItem_text'))
642              .fontSize($r('sys.float.ohos_id_text_size_body1'))
643              .fontColor($r('sys.color.ohos_id_color_text_primary'))
644              .fontWeight(FontWeight.Medium)
645              .margin({
646                top: $r('app.float.wh_value_24')
647              })
648          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
649
650          ListItem() {
651            DialogSubjectComponent({ map: this.mUserCaPresenterDetail.certInfo.subjectNameMap });
652          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
653
654          ListItem() {
655            Text($r('app.string.CustomDialogExample_secListItem_text'))
656              .fontSize($r('sys.float.ohos_id_text_size_body1'))
657              .fontColor($r('sys.color.ohos_id_color_text_primary'))
658              .fontWeight(FontWeight.Medium)
659              .margin({
660                top: $r('app.float.wh_value_24')
661              })
662          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
663
664          ListItem() {
665            DialogIssuerComponent({ map: this.mUserCaPresenterDetail.certInfo.issuerNameMap });
666          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
667
668          ListItem() {
669            Text($r('app.string.CustomDialogExample_thdListItem_text'))
670              .fontSize($r('sys.float.ohos_id_text_size_body1'))
671              .fontColor($r('sys.color.ohos_id_color_text_primary'))
672              .fontWeight(FontWeight.Medium)
673              .margin({
674                top: $r('app.float.wh_value_24')
675              })
676          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
677
678          ListItem() {
679            DialogDateComponent({ map: this.mUserCaPresenterDetail.certInfo.dateMap });
680          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
681
682          ListItem() {
683            Text($r('app.string.CustomDialogExample_fouListItem_text'))
684              .fontSize($r('sys.float.ohos_id_text_size_body1'))
685              .fontColor($r('sys.color.ohos_id_color_text_primary'))
686              .fontWeight(FontWeight.Medium)
687              .margin({
688                top: $r('app.float.wh_value_24')
689              })
690          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
691
692          ListItem() {
693            DialogFingerPrintComponent({
694              fingerprintSha256: this.mUserCaPresenterDetail.certInfo.fingerprintSha256
695            });
696          }.width(ComponentConfig.WH_100_100).align(Alignment.Start)
697        }
698        .margin({
699          right: $r('app.float.wh_value_24')
700        })
701        .scrollBar(BarState.Off)
702      }
703      .height($r('app.float.CustomDialogExample_list_height_value'))
704      .scrollable(ScrollDirection.Vertical)
705      .scrollBarWidth('3vp')
706    }
707    .padding({
708      left: $r('app.float.wh_value_24')
709    })
710    .width(WidthPercent.WH_100_100)
711    .borderRadius($r('app.float.user_list_divider_borderRadius_value'))
712    .backgroundColor($r('sys.color.ohos_id_color_dialog_bg'))
713  }
714
715  onShowRootCertificateDialog() {
716    this.userDetailsDialog?.close();
717    this.rootCertificateDialog.open();
718  }
719
720  onShowDeleteWarnDialog() {
721    this.deleteCertWarnDialog.open();
722    this.userDetailsDialog?.close();
723  }
724
725  aboutToAppear() {
726    console.info('in ComponentUser aboutToAppear');
727    if (this.setStatus.certList[this.indexNum].status == true) {
728      this.statusText = $r('app.string.CustomDialogExampleUser_Status_true');
729    } else {
730      this.statusText = $r('app.string.CustomDialogExampleUser_Status_false');
731    }
732  }
733
734  build() {
735    Flex({ justifyContent: FlexAlign.SpaceBetween, alignItems: ItemAlign.Center }) {
736      Column() {
737        Text(this.certAlias)
738          .fontSize($r('sys.float.ohos_id_text_size_body1'))
739          .fontColor($r('sys.color.ohos_id_color_text_primary'))
740          .fontWeight(FontWeight.Medium)
741          .textAlign(TextAlign.Start)
742          .margin({ top: $r('app.float.wh_value_10') })
743        Text(this.subjectName)
744          .fontSize($r('sys.float.ohos_id_text_size_body2'))
745          .fontColor($r('sys.color.ohos_id_color_text_primary'))
746          .fontWeight(FontWeight.Regular)
747          .textAlign(TextAlign.Start)
748          .margin({ top: $r('app.float.wh_value_2'), bottom: $r('app.float.wh_value_11') });
749      }
750      .alignItems(HorizontalAlign.Start);
751      Row() {
752        Text(this.statusText)
753          .fontSize($r('sys.float.ohos_id_text_size_body2'))
754          .fontColor($r('sys.color.ohos_id_color_text_secondary'))
755          .textAlign(TextAlign.End)
756          .margin({
757            right: $r('app.float.componentUser_thdText_margin_value')
758          })
759        Image($r('app.media.ic_settings_arrow'))
760          .width($r('app.float.componentUser_image_width_value'))
761          .height($r('app.float.componentUser_image_height_value'))
762          .fillColor($r('sys.color.ohos_id_color_primary'))
763          .opacity($r('app.float.componentUser_image_opacity_value'));
764      }
765      .flexShrink(0)
766      .margin($r('app.float.wh_value_12'))
767    }
768    .onHover((isHover?: boolean) => {
769      this.isHoverBackgroundColor = isHover ? $r('sys.color.ohos_id_color_hover') : ''
770    })
771    .backgroundColor(this.isHoverBackgroundColor)
772    .stateStyles({
773      pressed: this.pressedStyles,
774      normal: this.normalStyles
775    })
776    .padding({
777      left: $r('app.float.wh_value_8'),
778      right: $r('app.float.wh_value_8')
779    })
780    .borderRadius($r('app.float.wh_value_20'))
781    .onClick(() => {
782      this.mUserCaPresenterDetail.getUserTrustedCertificate(this.uri, () => {
783        if (this.onItemClicked !== undefined) {
784          this.onItemClicked();
785        } else {
786          this.userDetailsDialog.open();
787        }
788      });
789    });
790  }
791}
792
793@Entry
794@Component
795export struct TrustedEvidence {
796  @State mShowSysCaPresenter: CmShowSysCaPresenter = CmShowSysCaPresenter.getInstance();
797  @State mShowUserCaPresenter: CMShowUserCaPresenter = CMShowUserCaPresenter.getInstance();
798  @State mFaPresenter: CmFaPresenter = CmFaPresenter.getInstance();
799  @State currentIndex: number = 0;
800  @State fontColor: Resource = $r('app.color.TrustedEvidence_TabBuilder_fontColor_182431');
801  @State selectedFontColor: Resource = $r('app.color.font_color_007DFF');
802  private controller: TabsController = new TabsController();
803  private sysCaScroller: Scroller = new Scroller();
804  private userCaScroller: Scroller = new Scroller();
805  @State animationDurationNum: number = 400;
806
807  isStartBySheetFirst: boolean = false;
808  isStartBySheet: boolean = false;
809  selected?: (path: string, param?: Object) => void;
810  @Prop sheetParam: SheetParam;
811  @State headRectHeight: number = 64;
812  @State headRectHeightReal: number = 0;
813  @State private sysScrollerHeight: number = 0;
814  @State private userScrollerHeight: number = 0;
815
816  @Builder
817  TabBuilder(index: number) {
818    Column() {
819      Text(index == 0 ? $r('app.string.system') : $r('app.string.user'))
820        .fontColor(this.currentIndex === index ? this.selectedFontColor : this.fontColor)
821        .fontSize($r('app.float.TrustedEvidence_TabBuilder_Text_fontSize_value'))
822        .fontWeight(this.currentIndex === index ? FontWeight.Medium : FontWeight.Regular)
823        .alignSelf(ItemAlign.Center)
824        .margin({
825          top: $r('app.float.TrustedEvidence_TabBuilder_Text_padding_top_value')
826        })
827      if (this.currentIndex === index) {
828        Divider()
829          .width($r('app.float.TrustedEvidence_TabBuilder_Divider_width_value'))
830          .margin({ top: $r('app.float.TrustedEvidence_TabBuilder_Divider_padding_top_value') })
831          .color(this.selectedFontColor)
832          .alignSelf(ItemAlign.Center)
833      }
834    }
835    .width(WidthPercent.WH_100_100)
836  }
837
838  aboutToAppear() {
839    this.mShowSysCaPresenter.updateSystemTrustedCertificateList();
840    this.mShowUserCaPresenter.updateUserTrustedCertificateList();
841  }
842
843  onPageShow() {
844    let uri = GlobalContext.getContext().getAbilityWant().uri;
845    GlobalContext.getContext().clearAbilityWantUri();
846
847    if (uri === 'certInstall') {
848      router.pushUrl({
849        url: 'pages/certInstallFromStorage'
850      })
851    } else if (uri === 'requestAuthorize') {
852      this.mFaPresenter.startRequestAuth(GlobalContext.getContext().getAbilityWant().parameters?.appUid as string);
853    } else {
854      console.error('The want type is not supported');
855    }
856  }
857
858  build() {
859    Column() {
860      GridRow({ columns: COPIES_NUM, gutter: vp2px(1) === 2 ? $r('app.float.wh_value_12') : $r('app.float.wh_value_0') }) {
861        GridCol({ span: COPIES_NUM }) {
862          Row() {
863            Stack({ alignContent: Alignment.Top }) {
864              Column() {
865                HeadComponent({ headName: $r('app.string.CA_cert'), isStartBySheet: this.isStartBySheet,
866                  icBackIsVisibility: !this.isStartBySheetFirst,
867                  onBackClicked: () => {
868                    this.selected?.(NavEntryKey.POP);
869                  }})
870                  .margin({
871                    left: $r('app.float.wh_value_12'),
872                    top: this.isStartBySheet ? 8 : 0
873                  })
874              }.onAreaChange((oldArea, newArea) => {
875                this.headRectHeight = newArea.height as number;
876                this.headRectHeightReal = newArea.height as number;
877              }).zIndex(1)
878
879              Column() {
880                Tabs({ barPosition: BarPosition.Start, index: 0, controller: this.controller }) {
881                  TabContent() {
882                    Stack({ alignContent: Alignment.TopEnd }) {
883                      Scroll(this.sysCaScroller) {
884                        List() {
885                          ForEach(this.mShowSysCaPresenter.certList, (item: CertAbstractVo) => {
886                            ListItem() {
887                              ComponentSystem({
888                                certAlias: item.certAlias,
889                                subjectName: item.subjectNameCN,
890                                uri: item.uri,
891                                setStatus: $mShowSysCaPresenter,
892                                onItemClicked: this.isStartBySheet ? () => {
893                                  this.selected?.(NavEntryKey.CA_SYSTEM_DETAIL_ENTRY);
894                                } : undefined
895                              })
896                            }
897                          }, (item: CertAbstractVo) => JSON.stringify(item))
898                        }
899                        .borderRadius($r('sys.float.padding_level10'))
900                        .backgroundColor($r('sys.color.ohos_id_color_card_bg'))
901                        .scrollBar(BarState.Off)
902                        .padding({
903                          right: $r('app.float.wh_value_4'),
904                          left: $r('app.float.wh_value_4'),
905                          top: $r('app.float.wh_value_4'),
906                          bottom: $r('app.float.wh_value_4')
907                        })
908                        .divider({
909                          strokeWidth: $r('app.float.sys_list_divider_strokeWidth_value'),
910                          color: $r('sys.color.ohos_id_color_list_separator'),
911                          startMargin: $r('app.float.wh_value_8'),
912                          endMargin: $r('app.float.wh_value_8')
913                        })
914                        .visibility(this.mShowSysCaPresenter.certList.length > 0
915                          ? Visibility.Visible : Visibility.None)
916                      }
917                      .width(WidthPercent.WH_100_100)
918                      .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100)
919                      .align(Alignment.Top)
920                      .edgeEffect(EdgeEffect.Spring)
921                      .scrollable(ScrollDirection.Vertical)
922                      .scrollBar(BarState.Off)
923                      .padding({
924                        left: $r('app.float.wh_value_16'),
925                        right: $r('app.float.wh_value_16'),
926                        bottom: this.isStartBySheet ? $r('app.float.wh_value_80') : $r('app.float.wh_value_24')
927                      })
928                      .constraintSize({
929                        minHeight: this.getScrollMinHeight()
930                      }).onAreaChange((oldArea, newArea) => {
931                        this.sysScrollerHeight = newArea.height as number;
932                      })
933
934                      Column() {
935                        ScrollBar({
936                          scroller: this.sysCaScroller,
937                          direction: ScrollBarDirection.Vertical,
938                          state: BarState.Auto
939                        }).margin({
940                          bottom: this.isStartBySheet ? $r('app.float.wh_value_80') : $r('app.float.wh_value_24')
941                        })
942                      }.height(this.sysScrollerHeight)
943                    }
944                  }
945                  .tabBar(this.TabBuilder(0))
946
947                  TabContent() {
948                    Stack({ alignContent: Alignment.TopEnd }) {
949                      Scroll(this.userCaScroller) {
950                        List() {
951                          ForEach(this.mShowUserCaPresenter.certList, (item: CertAbstractVo, index) => {
952                            ListItem() {
953                              ComponentUser({
954                                certAlias: item.certAlias,
955                                subjectName: item.subjectNameCN,
956                                uri: item.uri,
957                                setStatus: $mShowUserCaPresenter,
958                                indexNum: index,
959                                onItemClicked: this.isStartBySheet ? () => {
960                                  this.selected?.(NavEntryKey.CA_USER_DETAIL_ENTRY,
961                                    new CaUserDetailParam(this.mShowUserCaPresenter));
962                                } : undefined
963                              })
964                            }
965                          }, (item: CertAbstractVo) => JSON.stringify(item))
966                        }
967                        .borderRadius($r('sys.float.padding_level10'))
968                        .backgroundColor($r('sys.color.ohos_id_color_card_bg'))
969                        .divider({
970                          strokeWidth: $r('app.float.sys_list_divider_strokeWidth_value'),
971                          color: $r('sys.color.ohos_id_color_list_separator'),
972                          startMargin: $r('app.float.wh_value_8'),
973                          endMargin: $r('app.float.wh_value_8')
974                        })
975                        .scrollBar(BarState.Off)
976                        .padding({
977                          left: $r('app.float.wh_value_4'),
978                          right: $r('app.float.wh_value_4'),
979                          top: $r('app.float.wh_value_4'),
980                          bottom: $r('app.float.wh_value_4')
981                        })
982                        .visibility(this.mShowUserCaPresenter.certList.length > 0
983                          ? Visibility.Visible : Visibility.None)
984                      }
985                      .position({ y: $r('app.float.wh_value_0') })
986                      .width(WidthPercent.WH_100_100)
987                      .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100)
988                      .align(Alignment.Top)
989                      .edgeEffect(EdgeEffect.Spring)
990                      .scrollable(ScrollDirection.Vertical)
991                      .scrollBar(BarState.Off)
992                      .padding({
993                        left: $r('app.float.wh_value_16'),
994                        right: $r('app.float.wh_value_16'),
995                        bottom: this.isStartBySheet ? $r('app.float.wh_value_80') : $r('app.float.wh_value_24')
996                      })
997                      .constraintSize({
998                        minHeight: this.getScrollMinHeight()
999                      }).onAreaChange((oldArea, newArea) => {
1000                        this.userScrollerHeight = newArea.height as number;
1001                      })
1002
1003                      Column() {
1004                        ScrollBar({
1005                          scroller: this.userCaScroller,
1006                          direction: ScrollBarDirection.Vertical,
1007                          state: BarState.Auto
1008                        }).margin({
1009                          bottom: this.isStartBySheet ? $r('app.float.wh_value_80') : $r('app.float.wh_value_24')
1010                        })
1011                      }.height(this.userScrollerHeight)
1012                    }
1013                  }
1014                  .tabBar(this.TabBuilder(1))
1015                }
1016                .vertical(false)
1017                .scrollable(true)
1018                .barMode(BarMode.Fixed)
1019                .barWidth($r('app.float.tabs_barWidth_value'))
1020                .barHeight($r('app.float.tabs_barHeight_value'))
1021                .animationDuration(this.animationDurationNum)
1022                .width(WidthPercent.WH_100_100)
1023                .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100)
1024                .onChange((index: number) => {
1025                  this.currentIndex = index;
1026                })
1027              }
1028              .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100)
1029              .width(WidthPercent.WH_100_100)
1030              .padding({
1031                top: this.headRectHeight
1032              })
1033            }
1034            .width(WidthPercent.WH_100_100)
1035            .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100)
1036          }
1037          .width(WidthPercent.WH_100_100)
1038          .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100);
1039        }
1040      }
1041      .backgroundColor($r('sys.color.ohos_id_color_sub_background'))
1042      .width(WidthPercent.WH_100_100)
1043      .height(this.isStartBySheet ? WidthPercent.WH_AUTO : WidthPercent.WH_100_100);
1044    }
1045  }
1046
1047  getScrollMinHeight() {
1048    if (this.sheetParam === undefined || this.headRectHeightReal === 0 ||
1049      this.sheetParam.sheetMinHeight < this.headRectHeightReal) {
1050      return 0;
1051    }
1052    return this.sheetParam.sheetMinHeight - this.headRectHeightReal - 56;
1053  }
1054}