• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/**
2 * Copyright (c) 2021-2022 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 prompt from '@system.prompt';
17import router from '@system.router';
18import deviceInfo from '@ohos.deviceInfo';
19import WifiModel, {
20  ApScanResult,
21  WiFiEncryptMethodMap,
22  WiFiIntensityMap,
23  WifiScanInfo,
24  WiFiSummaryMap
25} from '../model/wifiImpl/WifiModel';
26import LogUtil from '../../../../../../common/utils/src/main/ets/default/baseUtil/LogUtil';
27import ConfigData from '../../../../../../common/utils/src/main/ets/default/baseUtil/ConfigData';
28import HeadComponent from '../../../../../../common/component/src/main/ets/default/headComponent';
29import ResourceUtil from '../../../../../../common/search/src/main/ets/default/common/ResourceUtil';
30import ImageAnimatorComponent from '../../../../../../common/component/src/main/ets/default/imageAnimatorComponent';
31import wifi from '@ohos.wifi';
32
33const MODULE_TAG = ConfigData.TAG + 'WifiModel.wifi -> ';
34const deviceTypeInfo = deviceInfo.deviceType;
35
36function genWiFiIntensity(intensityEnum: number) {
37  if (intensityEnum === WiFiIntensityMap.GOOD) {
38    return $r("app.string.wifiSigIntensityStrong");
39  }
40
41  if (intensityEnum === WiFiIntensityMap.WELL) {
42    return $r("app.string.wifiSigIntensityWell");
43  }
44
45  if (intensityEnum === WiFiIntensityMap.NORMAL) {
46    return $r("app.string.wifiSigIntensityNormal");
47  }
48
49  if (intensityEnum === WiFiIntensityMap.BAD) {
50    return $r("app.string.wifiSigIntensityBad");
51  }
52  return $r("app.string.wifiSigIntensityBad");
53}
54
55function genWiFiEncryptMethod(encryptEnum: number) {
56  if (encryptEnum === WiFiEncryptMethodMap.OPEN) {
57    return $r("app.string.wifiEncryptMethodOpen");
58  }
59
60  if (encryptEnum === WiFiEncryptMethodMap.WEP) {
61    return $r("app.string.wifiEncryptMethodWEP");
62  }
63
64  if (encryptEnum === WiFiEncryptMethodMap.WPA) {
65    return $r("app.string.wifiEncryptMethodWPA");
66  }
67
68  if (encryptEnum === WiFiEncryptMethodMap.WPA2) {
69    return $r("app.string.wifiEncryptMethodWPA2");
70  }
71
72  return $r("app.string.wifiEncryptMethodOpen");
73}
74
75function genWiFiStatusSummary(statusEnum: number) {
76  if (statusEnum === WiFiSummaryMap.CONNECTED) {
77    return $r("app.string.wifiSummaryConnected");
78  }
79
80  if (statusEnum === WiFiSummaryMap.CONNECTING) {
81    return $r("app.string.wifiSummaryConnecting");
82  }
83
84  if (statusEnum === WiFiSummaryMap.OBTAINING_IP) {
85    return $r("app.string.wifiSummaryObtainingIP");
86  }
87
88  if (statusEnum === WiFiSummaryMap.SAVE_ENCRYPTED) {
89    return $r("app.string.wifiSummarySaveEncrypted");
90  }
91
92  if (statusEnum === WiFiSummaryMap.SAVE_OPEN) {
93    return $r("app.string.wifiSummarySaveOpen");
94  }
95
96  if (statusEnum === WiFiSummaryMap.ENCRYPTED) {
97    return $r("app.string.wifiSummaryEncrypted");
98  }
99
100  if (statusEnum === WiFiSummaryMap.OPEN) {
101    return $r("app.string.wifiSummaryOpen");
102  }
103  return $r("app.string.wifiSummaryConnected");
104}
105
106export interface WiFiMenuModel {
107  settingIcon: string;
108  settingSummary: number;
109  settingTitle: string;
110  settingValue: string;
111  settingArrow: string;
112  settingArrowStyle: string;
113  settingUri: string;
114  apInfo: WifiScanInfo;
115}
116
117export class apParam {
118  apInfo: WifiScanInfo;
119  isConnected: Boolean;
120
121  constructor(apInfo: WifiScanInfo, isConnected: boolean) {
122    this.apInfo = apInfo;
123    this.isConnected = isConnected;
124  }
125}
126
127@Entry
128@Component
129struct Index {
130  scroller: Scroller = new Scroller();
131  @StorageLink('slWiFiLists') scanWiFiResults: WiFiMenuModel[] = [];
132  @StorageLink('slConnectedWifi') connectedWiFi: WiFiMenuModel = {
133    settingIcon: '',
134    settingSummary: 0,
135    settingTitle: '',
136    settingValue: '',
137    settingArrow: '',
138    settingArrowStyle: '',
139    settingUri: '',
140    apInfo: {
141      ssid: '',
142      bssid: '',
143      rssi: -100,
144      band: 0,
145      frequency: 0,
146      timestamp: 0,
147      securityType: 1,
148    },
149  };
150  @State isWiFiEnabled: boolean = false;
151  @State isPhoneOrRK: boolean = false;
152  @State userSelectedApInfo: WifiScanInfo = {
153    ssid: '',
154    bssid: '',
155    rssi: -100,
156    band: 0,
157    frequency: 0,
158    timestamp: 0,
159    securityType: 1,
160  };
161  private switchDebounceFlag: number | undefined = undefined;
162  private timerId: number = -1;
163  private errorMessage: string = "";
164  private clickApInfoDialog: CustomDialogController | null = new CustomDialogController({
165    builder: apInfoDialog({
166      apInfo: this.userSelectedApInfo,
167    }),
168    alignment: deviceTypeInfo === 'phone' || deviceTypeInfo === 'default' ? DialogAlignment.Bottom : DialogAlignment.Center,
169    offset: ({ dx: 0, dy: deviceTypeInfo === 'phone' || deviceTypeInfo === 'default' ? '-24dp' : 0 }),
170    autoCancel: true,
171    customStyle: true
172  });
173  private clickApInfoDetailsDialog: CustomDialogController | null = new CustomDialogController({
174    builder: apInfoDetailsDialog({
175      apInfo: this.userSelectedApInfo,
176      disconnectAction: () => {
177        WifiModel.disconnectWiFi();
178        WifiModel.refreshApScanResults();
179      }
180    }),
181    alignment: deviceTypeInfo === 'phone' || deviceTypeInfo === 'default' ? DialogAlignment.Bottom : DialogAlignment.Center,
182    offset: ({ dx: 0, dy: deviceTypeInfo === 'phone' || deviceTypeInfo === 'default' ? '-24dp' : 0 }),
183    autoCancel: true,
184    customStyle: true
185  });
186
187  build() {
188    Column() {
189      GridContainer({ gutter: ConfigData.GRID_CONTAINER_GUTTER_24, margin: ConfigData.GRID_CONTAINER_MARGIN_24 }) {
190        Column() {
191          HeadComponent({ headName: $r('app.string.wifiTab'), isActive: true });
192
193          Row() {
194            Text($r('app.string.wifiTab'))
195              .fontSize($r('sys.float.ohos_id_text_size_body1'))
196              .fontColor($r('sys.color.ohos_id_color_text_primary'))
197              .fontWeight(FontWeight.Medium)
198              .textAlign(TextAlign.Start)
199
200            Blank()
201
202            Toggle({ type: ToggleType.Switch, isOn: this.isWiFiEnabled })
203              .width('36vp')
204              .height('20vp')
205              .selectedColor('#007DFF')
206              .onChange((isOn: boolean) => {
207                this.switchWiFiActiveStatus(isOn);
208              });
209          }
210          .height($r('app.float.wh_value_56'))
211          .width(ConfigData.WH_100_100)
212          .alignItems(VerticalAlign.Center)
213          .margin({ top: $r("app.float.distance_8") })
214          .padding({ left: $r("app.float.wh_value_12"), right: $r('app.float.wh_value_6') })
215          .backgroundColor($r("app.color.white_bg_color"))
216          .borderRadius($r('app.float.radius_24'));
217
218          Scroll(this.scroller) {
219            Column() {
220              Column() {
221                Row() {
222                  Text($r("app.string.wifiTipConnectedWLAN"))
223                    .fontSize($r('sys.float.ohos_id_text_size_body2'))
224                    .fontColor($r('sys.color.ohos_id_color_text_secondary'))
225                    .fontWeight(FontWeight.Medium)
226                    .textAlign(TextAlign.Start)
227                    .height($r('app.float.distance_19'));
228                }
229                .height($r("app.float.wh_value_48"))
230                .width(ConfigData.WH_100_100)
231                .padding({
232                  left: $r('app.float.wh_value_12'),
233                  top: $r('app.float.distance_19_5'),
234                  bottom: $r('app.float.distance_9_5')
235                })
236                .justifyContent(FlexAlign.Start);
237
238                Column() {
239                  ConnectedWiFiEntryComponent({
240                    connectedWiFi: $connectedWiFi,
241                    titleFontColor: "activated"
242                  })
243                }
244                .height($r("app.float.wh_value_64"))
245                .borderRadius($r("app.float.radius_24"))
246                .backgroundColor($r("app.color.white_bg_color"))
247                .margin({ top: $r("app.float.wh_value_4"), bottom: $r("app.float.wh_value_4") })
248                .onClick(() => {
249                  LogUtil.info(MODULE_TAG + 'clicked connected wifi item');
250                  this.userSelectedApInfo = this.connectedWiFi.apInfo;
251                  this.clickApInfoDetailsDialog?.open();
252                  LogUtil.info(MODULE_TAG + 'end!!!');
253                });
254              }
255              .visibility(this.isNeedRenderConnectedWiFi() ? Visibility.Visible : Visibility.None);
256
257              Column() {
258                Row() {
259                  Text($r("app.string.wifiTipValidWLAN"))
260                    .fontSize($r('sys.float.ohos_id_text_size_body2'))
261                    .fontColor($r('sys.color.ohos_id_color_text_secondary'))
262                    .fontWeight(FontWeight.Medium)
263                    .height($r('app.float.wh_value_19'))
264                    .margin({ top: $r('app.float.distance_19_5'), bottom: $r('app.float.distance_9_5') });
265
266                  Blank()
267
268                  ImageAnimatorComponent({
269                    imageWidth: $r('app.float.wh_value_24'),
270                    imageHeight: $r('app.float.wh_value_24')
271                  })
272                    .visibility(this.scanWiFiResults.length === 0 ? Visibility.Visible : Visibility.None)
273                }
274                .height($r("app.float.wh_value_48"))
275                .width(ConfigData.WH_100_100)
276                .padding({ left: $r('app.float.wh_value_12'), right: $r('app.float.wh_value_12') })
277                .alignItems(VerticalAlign.Center);
278
279                Column() {
280                  List() {
281                    ForEach(this.scanWiFiResults, (item: WiFiMenuModel) => {
282                      ListItem() {
283                        WiFiEntryComponent({
284                          settingIcon: item.settingIcon,
285                          settingTitle: item.settingTitle,
286                          settingSummary: genWiFiStatusSummary(item.settingSummary),
287                          settingValue: item.settingValue,
288                          settingArrow: item.settingArrow,
289                          settingUri: item.settingUri,
290                          titleFontColor: "inactivated"
291                        });
292                      }
293                      .onClick(() => {
294                        if (WifiModel.isSavedAp(item.settingTitle)) {
295                          this.userSelectedApInfo = item.apInfo;
296                          this.clickApInfoDialog?.open();
297                        } else {
298                          this.jumpToConnectApPage(item.apInfo);
299                        }
300                      })
301                    });
302                  }
303                  .margin({ top: $r('app.float.wh_value_4'), bottom: $r('app.float.wh_value_4') })
304                  .divider({
305                    strokeWidth: $r('app.float.divider_wh'),
306                    color: $r('app.color.color_E3E3E3_grey'),
307                    startMargin: $r("app.float.wh_value_12"),
308                    endMargin: $r("app.float.wh_value_12"),
309                  });
310                }
311                .borderRadius($r("app.float.radius_24"))
312                .backgroundColor($r("app.color.white_bg_color"))
313                .visibility(this.scanWiFiResults.length !== 0 ? Visibility.Visible : Visibility.None)
314              }
315              .visibility(this.isWiFiEnabled ? Visibility.Visible : Visibility.None);
316            }
317          }
318          .width(ConfigData.WH_100_100)
319          .borderRadius($r("app.float.radius_24"))
320          .scrollable(ScrollDirection.Vertical)
321          .scrollBar(BarState.Off)
322          .layoutWeight(ConfigData.LAYOUT_WEIGHT_1)
323          .align(Alignment.Top);
324        }
325        .useSizeType({
326          sm: { span: 4, offset: 0 },
327          md: { span: 6, offset: 1 },
328          lg: { span: 8, offset: 2 }
329        });
330      }
331      .width(ConfigData.WH_100_100)
332      .height(ConfigData.WH_100_100)
333    }
334    .backgroundColor($r("sys.color.ohos_id_color_sub_background"))
335    .width(ConfigData.WH_100_100)
336    .height(ConfigData.WH_100_100);
337  }
338
339  isNeedRenderConnectedWiFi() {
340    if (this.isWiFiEnabled !== true) {
341      return false;
342    }
343
344    if (typeof this.connectedWiFi.settingTitle === 'undefined') {
345      return false;
346    }
347    // as the ConnectionStateChange event is diff with the getLinkInfo callback,
348    // we always get the diff status between them
349    let titleSign: boolean = (!!this.connectedWiFi.settingTitle) && (this.connectedWiFi.settingTitle.length > 0);
350    let arrowSign: boolean = (!!this.connectedWiFi.settingArrow) && (this.connectedWiFi.settingArrow.length > 0);
351    if (titleSign && arrowSign) {
352      return true;
353    }
354    return false;
355  }
356
357  jumpToConnectApPage(apInfo: WifiScanInfo) {
358    WifiModel.setUserSelectedAp(apInfo);
359    // direct connect to wifi in security type 1(Open)
360    if (apInfo.securityType === 1) {
361      WifiModel.connectWiFi('');
362      return;
363    }
364    let params: apParam = new apParam(apInfo, false);
365    router.push({
366      uri: 'pages/wifiPsd',
367      params: params,
368    });
369  }
370
371  timeLimits() {
372    this.timerId = setTimeout(() => {
373      if (this.isWiFiEnabled == WifiModel.isWiFiActive()) {
374        this.timerId = -1;
375        return;
376      }
377      this.isWiFiEnabled = WifiModel.isWiFiActive();
378      LogUtil.error(MODULE_TAG + 'wifi timeLimits active status : ' + this.isWiFiEnabled);
379      this.timerId = -1;
380      prompt.showToast({
381        message: this.errorMessage,
382        duration: 1000,
383      });
384    }, 5000)
385  }
386
387  switchWiFiActiveStatus(isOn: boolean) {
388    // make the ui change quickly
389    this.isWiFiEnabled = isOn;
390    LogUtil.info(MODULE_TAG + 'curr enable status : ' + this.isWiFiEnabled);
391
392    // delay the wifi status change event
393    if (this.switchDebounceFlag) {
394      clearTimeout(this.switchDebounceFlag);
395    }
396
397    if (this.timerId != -1) {
398      clearTimeout(this.timerId);
399    }
400
401    this.switchDebounceFlag = setTimeout(() => {
402      if (this.isWiFiEnabled) {
403        LogUtil.info(MODULE_TAG + 'enable wifi');
404        WifiModel.enableWiFi();
405      } else {
406        LogUtil.info(MODULE_TAG + 'disable wifi');
407        WifiModel.disableWifi();
408      }
409      this.switchDebounceFlag = undefined;
410      this.timeLimits();
411    }, 500);
412  }
413
414  aboutToAppear(): void {
415    LogUtil.info(MODULE_TAG + 'about to appear wifi page');
416    try {
417      ResourceUtil.getString($r('app.string.ERROR_WIFI_CHANGE')).then((data) => {
418        this.errorMessage = data;
419      })
420    } catch (error) {
421      LogUtil.error(MODULE_TAG + 'get errorMessage String error:' + JSON.stringify(error));
422    }
423    WifiModel.registerWiFiStatusObserver((code: number) => {
424      LogUtil.info(MODULE_TAG + 'wifi status code : ' + code + ' taskId : ' + this.switchDebounceFlag);
425      if ((!this.switchDebounceFlag) && (code == 0 || code == 1)) {
426        this.isWiFiEnabled = Boolean(code);
427        LogUtil.info(MODULE_TAG + 'wifi active status code : ' + code + " isWiFiEnabled" + this.isWiFiEnabled);
428        if (this.timerId != -1) {
429          clearTimeout(this.timerId);
430          this.timerId = -1;
431        }
432      }
433    });
434    // init wifi active status
435    this.isWiFiEnabled = WifiModel.isWiFiActive();
436    let wifiDefaultModel: WiFiMenuModel = (new ApScanResult()).renderToListModel();
437    AppStorage.SetOrCreate('slConnectedWifi', wifiDefaultModel);
438  }
439
440  aboutToDisappear(): void {
441    LogUtil.info(MODULE_TAG + 'about to disappear');
442    if (this.timerId != -1) {
443      clearTimeout(this.timerId);
444    }
445    if (this.switchDebounceFlag) {
446      clearTimeout(this.switchDebounceFlag);
447    }
448    WifiModel.destroyWiFiModelData();
449    WifiModel.unregisterWiFiStatusObserver();
450    this.clickApInfoDialog = null;
451    this.clickApInfoDetailsDialog = null;
452  }
453
454  onPageShow() {
455    LogUtil.info(MODULE_TAG + 'on page show');
456    WifiModel.registerWiFiConnectionObserver((code: number) => {
457      LogUtil.info(MODULE_TAG + 'wifi connection code : ' + code);
458      WifiModel.refreshApScanResults();
459    });
460    WifiModel.startScanTask();
461  }
462
463  onPageHide(): void {
464    LogUtil.info(MODULE_TAG + 'on page hide');
465    WifiModel.unregisterWiFiConnectionObserver();
466    WifiModel.stopScanTask();
467  }
468
469  onBackPress() {
470    LogUtil.info('settings Wifi onBackPress');
471  }
472}
473
474@Component
475export default struct ApInfoComponent {
476  @State label: string = "";
477  @State value: string = "";
478
479  build() {
480    Row() {
481      Text(this.label)
482        .fontSize($r('sys.float.ohos_id_text_size_body1'))
483        .fontColor($r('sys.color.ohos_id_color_text_primary'))
484        .fontWeight(FontWeight.Medium)
485        .textAlign(TextAlign.Start);
486
487      Blank();
488
489      Text(this.value)
490        .fontSize($r('sys.float.ohos_id_text_size_body2'))
491        .fontColor($r('sys.color.ohos_id_color_text_secondary'))
492        .fontWeight(FontWeight.Regular)
493        .textAlign(TextAlign.End);
494    }
495    .height($r('app.float.wh_value_48'))
496    .width(ConfigData.WH_100_100)
497    .backgroundColor($r("app.color.white_bg_color"))
498    .alignItems(VerticalAlign.Center);
499  }
500}
501
502export interface WifiDialogData {
503  key: ResourceStr;
504  value: ResourceStr;
505}
506
507export interface WifiButton {
508  summary: ResourceStr;
509  opType: number;
510}
511
512/**
513 * Choose Unlock Method Dialog
514 */
515@CustomDialog
516struct apInfoDialog {
517  controller?: CustomDialogController;
518  @State dataList: WifiDialogData[] = [
519    { key: $r('app.string.wifiInfoTitleIntensity'), value: $r('app.string.wifiSigIntensityBad') },
520    { key: $r('app.string.wifiInfoTitleEncryptMethod'), value: $r('app.string.wifiEncryptMethodOpen') }
521  ];
522  private apInfo: WifiScanInfo | null = null;
523  // 0 is cancel, 1 is delete, 2 is connect
524  private buttons: WifiButton[] = [
525    { summary: $r('app.string.wifiButtonCancel'), opType: 0 },
526    { summary: $r('app.string.wifiButtonDelete'), opType: 1 },
527    { summary: $r('app.string.wifiButtonConnect'), opType: 2 }
528  ];
529
530  build() {
531    Column() {
532      Column() {
533        Row() {
534          Text(this.apInfo?.ssid)
535            .fontSize($r('app.float.font_20'))
536            .fontColor($r('sys.color.ohos_id_color_text_primary'))
537            .fontWeight(FontWeight.Medium)
538            .align(Alignment.Start)
539        }
540        .height($r("app.float.wh_value_56"))
541        .width(ConfigData.WH_100_100)
542        .padding({ left: $r("app.float.wh_value_24"), right: $r("app.float.wh_value_24") })
543
544        List() {
545          ForEach(this.dataList, (item: WifiDialogData) => {
546            ListItem() {
547              ApInfoComponent({
548                label: item.key as string,
549                value: item.value as string,
550              });
551            }
552            .height($r('app.float.wh_value_48'))
553            .onClick(() => {
554              LogUtil.info(MODULE_TAG + 'clicked ap info item');
555            })
556          })
557        }
558        .margin({ left: $r("app.float.wh_value_24"), right: $r("app.float.wh_value_24") })
559        .divider({
560          strokeWidth: $r('app.float.divider_wh'),
561          color: $r('app.color.color_E3E3E3_grey'),
562        })
563
564        List() {
565          ForEach(this.buttons, (item: WifiButton) => {
566            ListItem() {
567              Row() {
568                Text(item.summary)
569                  .fontSize($r('sys.float.ohos_id_text_size_body1'))
570                  .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
571                  .fontWeight(FontWeight.Medium)
572                  .width(ConfigData.WH_100_100)
573                  .textAlign(TextAlign.Center)
574              }
575              .width($r("app.float.dialog_118"))
576              .height($r("app.float.wh_value_40"))
577              .alignItems(VerticalAlign.Center)
578            }
579            .margin({ left: $r("app.float.wh_value_4"), right: $r("app.float.wh_value_4") })
580            .onClick(() => {
581              // 0 is cancel, 1 is delete, 2 is connect
582              if (item.opType === 0) {
583                LogUtil.info(MODULE_TAG + 'clicked ap info cancel');
584              }
585
586              if (item.opType === 1) {
587                LogUtil.info(MODULE_TAG + 'clicked ap info delete');
588                if (this.apInfo) {
589                  WifiModel.removeDeviceConfig(this.apInfo);
590                }
591                WifiModel.refreshApScanResults();
592              }
593
594              if (item.opType === 2) {
595                LogUtil.info(MODULE_TAG + 'clicked ap info connect');
596                WifiModel.disconnectWiFi();
597                if (this.apInfo) {
598                  WifiModel.connectByDeviceConfig(this.apInfo);
599                }
600                WifiModel.refreshApScanResults();
601              }
602              this.controller?.close();
603            })
604          })
605        }
606        .scrollBar(BarState.Off)
607        .margin({
608          top: $r('app.float.wh_value_8'),
609          left: $r("app.float.wh_value_16"),
610          right: $r("app.float.wh_value_16"),
611          bottom: $r("app.float.wh_value_16")
612        })
613        .height($r('app.float.wh_value_40'))
614        .listDirection(Axis.Horizontal)
615        .divider({
616          strokeWidth: $r('app.float.divider_wh'),
617          color: $r('app.color.color_E3E3E3_grey'),
618          startMargin: $r('app.float.wh_value_8'),
619          endMargin: $r('app.float.wh_value_8')
620        })
621      }
622      .height($r("app.float.wh_value_216"))
623      .borderRadius($r("app.float.radius_32"))
624      .backgroundColor($r("app.color.white_bg_color"))
625    }
626    .width(deviceTypeInfo === 'phone' || deviceTypeInfo === 'default' ? ConfigData.WH_100_100 : $r("app.float.wh_value_410"))
627    .padding(deviceTypeInfo === 'phone' || deviceTypeInfo === 'default' ? {
628      left: $r("app.float.wh_value_12"),
629      right: $r("app.float.wh_value_12")
630    } : {})
631  }
632
633  aboutToAppear(): void {
634    // gen wifi signal level
635    let intensity = this.apInfo ? WifiModel.getSignalIntensity(this.apInfo) : WiFiIntensityMap.BAD;
636    let encryptType = this.apInfo ? WifiModel.getEncryptMethod(this.apInfo) : WiFiEncryptMethodMap.OPEN;
637    this.dataList = [
638      { key: $r('app.string.wifiInfoTitleIntensity'),
639        value: genWiFiIntensity(intensity) },
640      { key: $r('app.string.wifiInfoTitleEncryptMethod'),
641        value: genWiFiEncryptMethod(encryptType) }
642    ];
643  }
644}
645
646@CustomDialog
647struct apInfoDetailsDialog {
648  controller?: CustomDialogController;
649  private apInfo: WifiScanInfo | null = null;
650  private value: string = '';
651  private frequency: string = '2.4GHz';
652  private speed: string = '144Mbps';
653  @State dataList: WifiDialogData[] = [
654    { key: $r('app.string.wifiInfoTitleStatus'),
655      value: $r('app.string.wifiSummaryConnected') },
656    { key: $r('app.string.wifiInfoTitleIntensity'),
657      value: $r('app.string.wifiSigIntensityBad') },
658    { key: $r('app.string.wifiInfoTitleSpeed'),
659      value: this.speed },
660    { key: $r('app.string.wifiInfoTitleFrequency'),
661      value: this.frequency },
662    { key: $r('app.string.wifiInfoTitleEncryptMethod'),
663      value: $r("app.string.wifiEncryptMethodOpen") }
664  ];
665  private buttons: WifiButton[] = [
666    { summary: $r('app.string.wifiButtonCancel'), opType: 0 },
667    { summary: $r('app.string.wifiButtonDelete'), opType: 2 }
668  ];
669
670  build() {
671    Column() {
672      Column() {
673        Column() {
674          QRCode(this.value)
675            .width(160)
676            .height(160)
677        }
678        .width(ConfigData.WH_100_100)
679        .margin({ top: $r("app.float.wh_48") })
680        .alignItems(HorizontalAlign.Center);
681
682        Row() {
683          Text(this.apInfo?.ssid)
684            .width(ConfigData.WH_100_100)
685            .fontSize($r('app.float.font_24'))
686            .fontColor($r('sys.color.ohos_id_color_text_primary'))
687            .fontWeight(FontWeight.Medium)
688            .textAlign(TextAlign.Center);
689        }
690        .width($r("app.float.wh_value_288"))
691        .height($r("app.float.wh_value_32"))
692        .margin({ top: $r("app.float.wh_value_28") });
693
694        Row() {
695          Text($r("app.string.wifiTipsScanInfo"))
696            .width(ConfigData.WH_100_100)
697            .fontSize($r('sys.float.ohos_id_text_size_body2'))
698            .fontColor($r('sys.color.ohos_id_color_text_secondary'))
699            .fontWeight(FontWeight.Medium)
700            .textAlign(TextAlign.Start);
701        }
702        .width($r("app.float.wh_value_250"))
703        .height($r("app.float.wh_value_19"))
704        .margin({ top: $r("app.float.wh_value_6") });
705
706        List() {
707          ForEach(this.dataList, (item: WifiDialogData) => {
708            ListItem() {
709              ApInfoComponent({
710                label: item.key as string,
711                value: item.value as string
712              });
713            }
714            .height($r('app.float.wh_value_48'))
715            .onClick(() => {
716              LogUtil.info(MODULE_TAG + 'clicked ap detail info item');
717            })
718          })
719        }
720        .margin({
721          top: $r("app.float.wh_value_16"),
722          left: $r("app.float.wh_value_24"),
723          right: $r("app.float.wh_value_24")
724        })
725        .divider({
726          strokeWidth: $r('app.float.divider_wh'),
727          color: $r('app.color.color_E3E3E3_grey'),
728        })
729
730        List() {
731          ForEach(this.buttons, (item: WifiButton) => {
732            ListItem() {
733              Row() {
734                Text(item.summary)
735                  .fontSize($r('sys.float.ohos_id_text_size_body1'))
736                  .fontColor($r('sys.color.ohos_id_color_text_primary_activated'))
737                  .fontWeight(FontWeight.Medium)
738                  .width(ConfigData.WH_100_100)
739                  .textAlign(TextAlign.Center)
740              }
741              .width($r("app.float.wh_value_160"))
742              .height($r("app.float.wh_value_40"))
743              .alignItems(VerticalAlign.Center)
744            }
745            .margin({ left: $r("app.float.wh_value_4"), right: $r("app.float.wh_value_4") })
746            .onClick(() => {
747              if (item.opType === 0) {
748                LogUtil.info(MODULE_TAG + 'clicked ap info cancel');
749              }
750
751              if (item.opType === 2) {
752                LogUtil.info(MODULE_TAG + 'clicked ap info to disconnect');
753                WifiModel.disconnectWiFi();
754                if (this.apInfo) {
755                  WifiModel.removeDeviceConfig(this.apInfo);
756                }
757                WifiModel.refreshApScanResults();
758              }
759              this.controller?.close();
760            })
761          })
762        }
763        .margin({
764          top: $r('app.float.wh_value_8'),
765          bottom: $r('app.float.wh_value_16'),
766          left: $r("app.float.wh_value_4"),
767          right: $r("app.float.wh_value_4")
768        })
769        .height($r('app.float.wh_value_40'))
770        .listDirection(Axis.Horizontal)
771        .divider({
772          strokeWidth: $r('app.float.divider_wh'),
773          color: $r('app.color.color_E3E3E3_grey'),
774          startMargin: $r('app.float.wh_value_8'),
775          endMargin: $r('app.float.wh_value_8')
776        });
777      }
778      .alignItems(HorizontalAlign.Center)
779      .height($r("app.float.wh_value_620"))
780      .padding({ top: $r('app.float.wh_value_6') })
781      .borderRadius($r("app.float.radius_32"))
782      .backgroundColor($r("app.color.white_bg_color"))
783    }
784    .width(deviceInfo.deviceType === 'phone' ? ConfigData.WH_100_100 : $r("app.float.wh_value_410"))
785    .padding(deviceInfo.deviceType === 'phone' ? {
786      left: $r("app.float.wh_value_12"),
787      right: $r("app.float.wh_value_12")
788    } : {})
789  }
790
791  aboutToAppear(): void {
792    // gen wifi signal level
793    let intensity = this.apInfo ? WifiModel.getSignalIntensity(this.apInfo) : WiFiIntensityMap.BAD;
794    let encryptType = this.apInfo ? WifiModel.getEncryptMethod(this.apInfo) : WiFiEncryptMethodMap.OPEN;
795    let linkInfo: wifi.WifiLinkedInfo = WifiModel.getLinkInfo();
796    if (linkInfo != undefined) {
797      this.speed = linkInfo.linkSpeed + 'Mbps';
798      //5.0GHz limit:[5180MHz,5825MHz],2.4GHz limit:[2412MHz,2484MHz]
799      LogUtil.info(MODULE_TAG + 'get frequency: ' + linkInfo.frequency);
800      this.frequency = linkInfo.frequency > 3500 ? "5GHz" : "2.4GHz";
801    }
802    this.dataList = [
803      { key: $r('app.string.wifiInfoTitleStatus'),
804        value: $r('app.string.wifiSummaryConnected') },
805      { key: $r('app.string.wifiInfoTitleIntensity'),
806        value: genWiFiIntensity(intensity) },
807      { key: $r('app.string.wifiInfoTitleSpeed'),
808        value: this.speed },
809      { key: $r('app.string.wifiInfoTitleFrequency'),
810        value: this.frequency },
811      { key: $r('app.string.wifiInfoTitleEncryptMethod'),
812        value: genWiFiEncryptMethod(encryptType) }
813    ];
814  }
815
816  private disconnectAction: () => void = () => {
817  };
818}
819
820@Component
821struct WiFiEntryComponent {
822  @State settingIcon: string = "";
823  @State settingTitle: string = "";
824  @State settingValue: string = "";
825  @State settingArrow: string = "";
826  @State settingUri: string = "";
827  @State titleFontColor: string = "";
828  @State isTouched: boolean = false;
829  private settingSummary: string | Resource = ''; // 状态描述
830
831  build() {
832    Row() {
833      Column() {
834        Text(this.settingTitle)
835          .fontSize($r('sys.float.ohos_id_text_size_body1'))
836          .fontColor(this.titleFontColor === "activated" ?
837          $r('sys.color.ohos_id_color_text_primary_activated') : $r('sys.color.ohos_id_color_text_primary'))
838          .fontWeight(FontWeight.Medium);
839
840        Text(this.settingSummary)
841          .fontSize($r('sys.float.ohos_id_text_size_body2'))
842          .fontColor(this.titleFontColor === "activated" ?
843          $r('sys.color.ohos_id_color_text_primary') : $r('sys.color.ohos_id_color_text_secondary'))
844          .fontWeight(FontWeight.Regular)
845          .margin({ top: $r('app.float.wh_value_8') });
846      }
847      .margin({ left: $r("app.float.wh_value_12") })
848      .alignItems(HorizontalAlign.Start)
849
850      Blank()
851
852      Image(this.settingArrow)
853        .fillColor($r("sys.color.ohos_id_color_primary"))
854        .width($r('app.float.wh_value_24'))
855        .height($r('app.float.wh_value_24'))
856        .margin({ right: $r("app.float.wh_value_12") });
857    }
858    .height($r('app.float.wh_value_64'))
859    .width(ConfigData.WH_100_100)
860    .borderRadius($r("app.float.radius_24"))
861    .alignItems(VerticalAlign.Center)
862    .backgroundColor(this.isTouched ? $r("app.color.color_D8D8D8_grey") : $r("sys.color.ohos_id_color_foreground_contrary"))
863    .onTouch((event?: TouchEvent | undefined) => {
864      if (event?.type === TouchType.Down) {
865        this.isTouched = true;
866      }
867
868      if (event?.type === TouchType.Up) {
869        this.isTouched = false;
870      }
871    })
872  }
873}
874
875@Component
876struct ConnectedWiFiEntryComponent {
877  @Link connectedWiFi: WiFiMenuModel;
878  @State titleFontColor: string = "";
879  @State isTouched: boolean = false;
880
881  build() {
882    Row() {
883      Column() {
884        Text(this.connectedWiFi.settingTitle)
885          .fontSize($r('sys.float.ohos_id_text_size_body1'))
886          .fontColor(this.titleFontColor === "activated" ?
887          $r('sys.color.ohos_id_color_text_primary_activated') : $r('sys.color.ohos_id_color_text_primary'))
888          .fontWeight(FontWeight.Medium);
889
890        Text(genWiFiStatusSummary(this.connectedWiFi.settingSummary))
891          .fontSize($r('sys.float.ohos_id_text_size_body2'))
892          .fontColor(this.titleFontColor === "activated" ?
893          $r('sys.color.ohos_id_color_text_primary') : $r('sys.color.ohos_id_color_text_secondary'))
894          .fontWeight(FontWeight.Regular)
895          .margin({ top: $r('app.float.wh_value_8') });
896      }
897      .margin({ left: $r("app.float.wh_value_12") })
898      .alignItems(HorizontalAlign.Start)
899
900      Blank()
901
902      Image(this.connectedWiFi.settingArrow)
903        .fillColor($r("sys.color.ohos_id_color_primary"))
904        .width($r('app.float.wh_value_24'))
905        .height($r('app.float.wh_value_24'))
906        .margin({ right: $r("app.float.wh_value_12") });
907    }
908    .height($r('app.float.wh_value_64'))
909    .width(ConfigData.WH_100_100)
910    .borderRadius($r("app.float.radius_24"))
911    .alignItems(VerticalAlign.Center)
912    .backgroundColor(this.isTouched ? $r("app.color.color_D8D8D8_grey") : $r("sys.color.ohos_id_color_foreground_contrary"))
913    .onTouch((event?: TouchEvent | undefined) => {
914      if (event?.type === TouchType.Down) {
915        this.isTouched = true;
916      }
917      if (event?.type === TouchType.Up) {
918        this.isTouched = false;
919      }
920    })
921  }
922}
923