1/*
2 * Copyright (c) 2022-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 */
15
16import { Log } from '../../utils/Log';
17import { ColumnSize, ScreenManager } from '../../model/common/ScreenManager';
18import { Constants } from '../../model/common/Constants';
19import { DetailsDialogComponent } from '../DetailsDialogComponent';
20
21const TAG: string = 'common_MultiSelectDialog';
22
23@Observed
24export class MultiSelectDetails {
25  public count: number = 0;
26  public size: number = 0;
27}
28
29@CustomDialog
30export struct MultiSelectDialog {
31  static readonly INTERNAL_PREFIX_NUM = 3;
32  static readonly EXTERNAL_PREFIX_NUM = 2;
33  @StorageLink('isHorizontal') isHorizontal: boolean = ScreenManager.getInstance().isHorizontal();
34  @StorageLink('isSidebar') isSidebar: boolean = ScreenManager.getInstance().isSidebar();
35  @StorageLink('leftBlank') leftBlank: number[] =
36    [0, ScreenManager.getInstance().getStatusBarHeight(), 0, ScreenManager.getInstance().getNaviBarHeight()];
37  controller?: CustomDialogController;
38  @Consume multiSelectDetails: MultiSelectDetails;
39  private isPcDevice: boolean = AppStorage.get<string>('deviceType') === Constants.PC_DEVICE_TYPE;
40
41  aboutToAppear() {
42  }
43
44  build() {
45    Column() {
46      Row() {
47        Text($r('app.string.details'))
48          .fontSize($r('sys.float.ohos_id_text_size_dialog_tittle'))
49          .fontWeight(FontWeight.Medium)
50          .fontColor($r('sys.color.ohos_id_color_text_primary'))
51      }
52      .alignItems(VerticalAlign.Center)
53      .height($r('app.float.dialog_title_height'))
54
55      Row() {
56        Column() {
57          Text($r('app.string.count'))
58            .fontSize($r('sys.float.ohos_id_text_size_body2'))
59            .fontFamily($r('app.string.id_text_font_family_regular'))
60            .fontColor($r('sys.color.ohos_id_color_text_primary'))
61        }
62
63        Column() {
64          Text(' ')
65            .fontSize($r('sys.float.ohos_id_text_size_body2'))
66            .fontFamily($r('app.string.id_text_font_family_regular'))
67            .fontColor($r('sys.color.ohos_id_color_text_primary'))
68        }
69
70        Column() {
71          Text($r('app.string.items', this.multiSelectDetails.count))
72            .fontSize($r('sys.float.ohos_id_text_size_body2'))
73            .fontFamily($r('app.string.id_text_font_family_regular'))
74            .fontColor($r('sys.color.ohos_id_color_text_secondary'))
75            .textOverflow({ overflow: TextOverflow.Ellipsis })
76        }
77      }.margin({
78        bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') })
79
80      DetailsDialogComponent({
81        title: $r('app.string.size'),
82        content: `${(this.multiSelectDetails.size / (1024 * 1024)).toFixed(2)}MB`,
83        isLast: true
84      })
85
86      Stack({ alignContent: Alignment.Top }) {
87        Button() {
88          Text($r('app.string.detail_dialog_confirm'))
89            .fontSize($r('sys.float.ohos_id_text_size_button1'))
90            .fontColor($r('app.color.color_control_highlight'))
91            .width('100%')
92            .fontWeight(FontWeight.Medium)
93            .textAlign(TextAlign.Center)
94        }
95        .backgroundColor($r('sys.color.ohos_id_color_button_normal'))
96        .height($r('app.float.details_dialog_button_height'))
97        .onClick(() => {
98          this.controller?.close();
99        })
100        .margin({
101          left: $r('app.float.dialog_single_button_indent_margin'),
102          right: $r('app.float.dialog_single_button_indent_margin')
103        })
104      }
105      .width('100%')
106      .height($r('app.float.details_dialog_button_area_height'))
107    }
108    .borderRadius($r('sys.float.ohos_id_corner_radius_default_l'))
109    .width(this.isPcDevice ? $r('app.float.pc_dialog_width') : ScreenManager.getInstance()
110                                                                 .getColumnsWidth(ColumnSize.COLUMN_FOUR))
111    .backgroundColor($r('app.color.white'))
112    .margin({
113      right: $r('app.float.dialog_content_margin'),
114      left: $r('app.float.dialog_content_margin'),
115      bottom: this.isHorizontal || this.isSidebar ? 0 : Constants.DIALOG_BOTTOM_OFFSET + this.leftBlank[3]
116    })
117    .padding({ left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') })
118    .alignItems(HorizontalAlign.Start)
119    .shadow({
120      radius: $r('app.float.dialog_defult_shadow_m_radio'),
121      color: $r('app.color.dialog_defult_shadow_m_color'),
122      offsetX: $r('app.float.dialog_defult_shadow_m_offsetX'),
123      offsetY: $r('app.float.dialog_defult_shadow_m_offsetY')
124    })
125  }
126}
127