• 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 */
15import i18n from '@ohos.i18n';
16import router from '@ohos.router';
17import systemTime from '@ohos.systemDateTime';
18import IntlUtil from '../../utils/IntlUtil';
19import Logger from '../../utils/Logger';
20import TitleBar from '../../components/TitleBar';
21
22const TAG: string = 'DateAndTime';
23
24export class TimeZoneInfo {
25  key: string = '';
26  timeZone: string = '';
27  display: Resource | undefined = undefined;
28}
29
30@Entry
31@Component
32struct DateAndTime {
33  private intervalId: number = -1;
34  @State is24Hours: boolean = false;
35  @State date: string = '';
36  @State time: string = '';
37  @State timeZone: string = '';
38
39  aboutToAppear() {
40    this.is24Hours = i18n.System.is24HourClock();
41  }
42
43  onPageShow() {
44    this.getTimeDisplay();
45    this.intervalId = setInterval(() => {
46      this.getTimeDisplay();
47    }, 1000);
48  }
49
50  onPageHide() {
51    clearInterval(this.intervalId);
52  }
53
54  async getTimeDisplay() {
55    let timeZone = await systemTime.getTimezone();
56    let zone = i18n.getTimeZone(timeZone);
57    this.timeZone = IntlUtil.getTimeZoneString(zone);
58    let timeInfo = IntlUtil.getDateString();
59    this.date = timeInfo[0];
60    this.time = timeInfo[1];
61  }
62
63  @Builder Hours24View() {
64    Row() {
65      Text($r('app.string.hours_24'))
66        .fontSize(22)
67        .fontWeight(FontWeight.Bold)
68        .layoutWeight(1)
69      Toggle({ type: ToggleType.Switch, isOn: this.is24Hours })
70        .margin({ top: 20, bottom: 20 })
71        .onChange((isOn: boolean) => {
72          this.is24Hours = !this.is24Hours;
73          Logger.info(TAG, `set24HourClock result = ${i18n.System.set24HourClock(this.is24Hours)}`);
74          this.getTimeDisplay();
75        })
76    }
77    .width('95%')
78    .padding(10)
79    .margin({ top: 20, bottom: 10 })
80    .backgroundColor($r('app.color.white'))
81    .border({ color: $r('app.color.white'), width: 1, radius: 15 })
82  }
83
84  @Builder
85  TimeView($$: Data) {
86    if ($$.isDivider) {
87      Divider()
88        .color($r('app.color.divider'))
89        .width('100%')
90        .strokeWidth(1)
91        .margin({ top: 10, bottom: 10 })
92    }
93    Row() {
94      Text($$.key)
95        .fontSize(22)
96      Blank()
97      Text($$.value)
98        .fontSize(22)
99      Image($r('app.media.more'))
100        .width(15).height(50)
101        .objectFit(ImageFit.Contain)
102        .margin({ left: 10 })
103    }
104    .width('100%')
105    .margin(10)
106    .onClick($$.handleClick)
107  }
108
109  build() {
110    Column() {
111      TitleBar({ hasBackPress: true, title: $r('app.string.date_time') })
112      Scroll() {
113        Column() {
114          this.Hours24View()
115          Column() {
116            this.TimeView(new Data($r('app.string.date'), this.date, false, () => {
117              DatePickerDialog.show({
118                lunar: false,
119                onAccept: (result: DatePickerResult) => {
120                  Logger.info(TAG, `DatePicker onAccept,year：${result.year}`);
121                  let date = new Date();
122                  date.setFullYear(result.year, result.month, result.day);
123                  systemTime.setDate(date, () => {
124                    Logger.info(TAG, `setDate finish`)
125                    this.getTimeDisplay()
126                  });
127                }
128              })
129            }))
130            this.TimeView(new Data($r('app.string.time'), this.time, true, () => {
131              TimePickerDialog.show({
132                useMilitaryTime: this.is24Hours,
133                onAccept: (result: TimePickerResult) => {
134                  Logger.info(TAG, 'DatePicker onAccept');
135                  let date = new Date();
136                  date.setHours(result.hour, result.minute);
137                  systemTime.setTime(date.getTime(), () => {
138                    Logger.info(TAG, `setTime finish`)
139                    this.getTimeDisplay()
140                  });
141                }
142              })
143            }))
144            this.TimeView(new Data($r('app.string.time_zone'), this.timeZone, true, () => {
145              router.pushUrl({
146                url: 'international/pages/TimeZone'
147              });
148            }))
149          }
150          .width('95%')
151          .padding(10)
152          .margin({ top: 20, bottom: 10 })
153          .backgroundColor($r('app.color.white'))
154          .border({ color: $r('app.color.white'), width: 1, radius: 15 })
155        }
156      }
157    }
158    .width('100%')
159    .height('100%')
160    .backgroundColor($r('app.color.f5f5f5'))
161  }
162}
163
164class Data {
165  key: Resource | undefined = undefined;
166  value: string = '';
167  isDivider: boolean = false;
168  handleClick: (event: ClickEvent) => void;
169
170  constructor(key: Resource | undefined, value: string, isDivider: boolean, handleClick: (event: ClickEvent) => void) {
171    this.key = key;
172    this.value = value;
173    this.isDivider = isDivider;
174    this.handleClick = handleClick;
175  }
176}