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 */ 15 16import common from '@ohos.app.ability.common' 17import historyFeature from '../feature/HistoryFeature' 18import { Header } from '../component/Header' 19import Logger from '../module/Logger' 20 21const TAG: string = '[Sample_CustomCommonEvent_History]' 22 23@Entry 24@Component 25struct History { 26 private feature: historyFeature = new historyFeature(getContext() as common.UIAbilityContext) 27 @State arr: Array<Array<string>> = [] 28 29 async onPageShow() { 30 this.feature.getData().then((data: Array<Array<string>>) => { 31 this.arr = data 32 Logger.info('mst arr is ' + JSON.stringify(this.arr.length)) 33 Logger.info('mst arr is ' + JSON.stringify(this.arr)) 34 }) 35 } 36 37 build() { 38 Column() { 39 Header({ src: 'historyTitle.png' }) 40 Column() { 41 List({ space: 10, initialIndex: 0 }) { 42 ForEach(this.arr, (item: Array<string>, index: number) => { 43 ListItem() { 44 Column() { 45 Row() { 46 Text($r('app.string.start_time')).size({ width: '30%', height: '100%' }) 47 .fontSize(16) 48 .textAlign(TextAlign.Start) 49 .fontColor(0x000000) 50 Text(item[0]).size({ width: '70%', height: '100%' }) 51 .fontSize(16) 52 .textAlign(TextAlign.Start) 53 .fontColor(0x000000) 54 }.size({ width: '80%', height: '30%' }) 55 56 Row() { 57 Text($r('app.string.end_time')).size({ width: '20%', height: '100%' }) 58 .fontSize(12) 59 .textAlign(TextAlign.Center) 60 .fontColor(0x000000) 61 Text(item[1]).size({ width: '80%', height: '100%' }) 62 .fontSize(12) 63 .textAlign(TextAlign.Center) 64 .fontColor(0x000000) 65 }.size({ width: '80%', height: '20%' }) 66 67 Row() { 68 Text($r('app.string.total_time')).size({ width: '20%', height: '100%' }) 69 .fontSize(12) 70 .textAlign(TextAlign.Center) 71 .fontColor(0x000000) 72 Text(item[2]).size({ width: '80%', height: '100%' }) 73 .fontSize(12) 74 .textAlign(TextAlign.Center) 75 .fontColor(0x000000) 76 }.size({ width: '80%', height: '20%' }) 77 78 Row() { 79 Text($r('app.string.total_interrupt')).size({ width: '20%', height: '100%' }) 80 .fontSize(12) 81 .textAlign(TextAlign.Center) 82 .fontColor(0x000000) 83 Text(item[3]).size({ width: '80%', height: '100%' }) 84 .fontSize(12) 85 .textAlign(TextAlign.Center) 86 .fontColor(0x000000) 87 }.size({ width: '80%', height: '20%' }) 88 } 89 }.size({ width: '100%', height: '18%' }) 90 .backgroundColor(0xFFFFFF) 91 .borderRadius(10) 92 .opacity(0.8) 93 }, (item: Array<string>) => JSON.stringify(item)) 94 } 95 .listDirection(Axis.Vertical) 96 .chainAnimation(false) 97 .width('90%') 98 .margin(10) 99 } 100 .size({ width: '90%', height: '85%' }) 101 .backgroundColor(0xfbfafb) 102 .opacity(0.8) 103 .position({ x: '5%', y: '10%' }) 104 .borderRadius(10) 105 }.size({ width: '100%', height: '100%' }) 106 .backgroundImage($rawfile('vbg720.png')) 107 .backgroundImageSize(ImageSize.Contain) 108 } 109}