1/**
2 * Copyright (c) 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 */
15import mediaquery from '@ohos.mediaquery';
16import IndexController from './indexController'
17import ConversationList from './conversationlist/conversationList'
18import ConListController from './conversationlist/conversationListController';
19import DeviceUtil from '../utils/DeviceUtil';
20import MmsPreferences from '../utils/MmsPreferences';
21import HiLog from '../utils/HiLog'
22import WantUtil from '../utils/WantUtil';
23
24const TAG = 'Index';
25
26@Entry
27@Component
28struct Index {
29  @State mIndexCtrl: IndexController = IndexController.getInstance();
30  @State mConListCtrl: ConListController = ConListController.getInstance();
31  private gridColumns: GridRowColumnOption = { sm: 4, md: 8, lg: 12 };
32  private girdSpan: GridColColumnOption = { sm: 4, md: 8, lg: 12 };
33  private gridGutter: string = '24vp';
34  private gridMargin: string = '24vp';
35  private smListener: mediaquery.MediaQueryListener;
36  private mdListener: mediaquery.MediaQueryListener;
37  private lgListener: mediaquery.MediaQueryListener;
38
39  isBreakpointSM = (mediaQueryResult) => {
40    if (mediaQueryResult.matches) {
41      AppStorage.SetOrCreate('curBp', 'sm')
42    }
43  }
44  isBreakpointMD = (mediaQueryResult) => {
45    if (mediaQueryResult.matches) {
46      AppStorage.SetOrCreate('curBp', 'md')
47    }
48  }
49  isBreakpointLG = (mediaQueryResult) => {
50    if (mediaQueryResult.matches) {
51      AppStorage.SetOrCreate('curBp', 'lg')
52    }
53  }
54
55  /**
56   * The function executes after a new instance of the custom component is created and before its build function
57   * is executed.
58   * Allows state variables to be changed in the aboutToAppear function, and these changes will take effect in
59   * subsequent executions of the build function.
60   */
61  aboutToAppear() {
62    this.mIndexCtrl.onInit();
63    this.mConListCtrl.onInit();
64    this.smListener = mediaquery.matchMediaSync('(320vp<width<=520vp)');
65    this.smListener.on('change', this.isBreakpointSM);
66    this.mdListener = mediaquery.matchMediaSync('(520vp<width<=840vp)');
67    this.mdListener.on('change', this.isBreakpointMD);
68    this.lgListener = mediaquery.matchMediaSync('(840vp<width)');
69    this.lgListener.on('change', this.isBreakpointLG);
70  }
71
72  /**
73   * Function executes before custom component destructor consumption.
74   * Changing state variables in the aboutToDisappear function is not allowed, especially changes to the @Link
75   * variable may cause unstable application behavior.
76   */
77  aboutToDisappear() {
78    this.mConListCtrl.onDestroy();
79    this.mIndexCtrl.onDestroy();
80    this.smListener.off('change', this.isBreakpointSM);
81    this.mdListener.off('change', this.isBreakpointMD);
82    this.lgListener.off('change', this.isBreakpointLG);
83  }
84
85  /**
86   * Triggers once when this page is displayed. In scenarios such as routing and application access to the foreground
87   * and background, only customized components modified by @Entry take effect.
88   */
89  async onPageShow() {
90    WantUtil.getWant();
91    await MmsPreferences.getInstance().initPreferences();
92    this.mIndexCtrl.onShow();
93    this.mConListCtrl.onShow();
94  }
95
96  /**
97   * Triggers once when this page disappears. In scenarios such as routing and application access to the foreground
98   * and background, only customized components modified by @Entry take effect.
99   */
100  onPageHide() {
101    this.mConListCtrl.onHide();
102    this.mIndexCtrl.onHide();
103  }
104
105  /**
106   * Triggered when a user clicks the back button. Only the customized component modified by @Entry takes effect.
107   * If true is returned, the page processes the return logic and does not route the page.
108   * If false is returned, the default return logic is used.
109   * If no value is returned, the value is treated as false.
110   */
111  onBackPress() {
112    if (this.mIndexCtrl.showConList) {
113      return this.mConListCtrl.onBackPress();
114    }
115    return false;
116  }
117
118  build() {
119    Column() {
120      GridRow({ columns: this.gridColumns, gutter: this.gridGutter }) {
121        GridCol({ span: this.girdSpan }) {
122          if (this.mIndexCtrl.showConList) {
123            Flex() {
124              ConversationList({
125                mConListCtrl: $mConListCtrl
126              })
127            }
128            .width('100%')
129            .height('100%')
130          }
131        }
132      }
133      .height('100%')
134    }
135    .padding({ left: this.gridMargin, right: this.gridMargin })
136    .width('100%')
137    .height('100%')
138  }
139}