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 { Log } from '@ohos/base/src/main/ets/utils/Log'; 16import type { DialogCallback } from '../../model/common/DialogUtil'; 17import screenManager from '@ohos/base/src/main/ets/manager/ScreenManager'; 18import { Constants } from '../../model/common/Constants'; 19import { showToast } from '@ohos/base/src/main/ets/utils/UiUtil'; 20import { getResourceString } from '@ohos/base/src/main/ets/utils/ResourceUtils'; 21 22@CustomDialog 23export struct NewAlbumDialog { 24 private TAG: string = 'NewAlbumDialog' 25 @StorageLink('isHorizontal') isHorizontal: boolean = screenManager.isHorizontal(); 26 @StorageLink('isSidebar') isSidebar: boolean = screenManager.isSidebar(); 27 @StorageLink('leftBlank') leftBlank: [number, number, number, number] = [0, 0, 0, 0]; 28 controller: CustomDialogController; 29 @Consume renameFileName: string; 30 @Consume dialogCallback: DialogCallback; 31 @State isNull: boolean = false; 32 @State dividerColor: Resource = $r('app.color.dialog_divider_h_color_182431'); 33 @State dividerWidth: string = '1vp'; 34 private inputName: string = ''; 35 36 aboutToAppear(): void { 37 Log.info(this.TAG, 'aboutToAppear'); 38 this.inputName = this.renameFileName; 39 this.isNull = this.inputName === ''; 40 if (this.inputName.length === Constants.ALBUM_NAME_MAX_LENGTH) { 41 getResourceString($r('app.string.Maximum_length_reached')).then((message: string) => { 42 showToast(message) 43 }) 44 } 45 } 46 47 build() { 48 Column() { 49 Row() { 50 Text($r('app.string.album_new_album_title')) 51 .fontSize($r('sys.float.ohos_id_text_size_headline7')) 52 .fontWeight(FontWeight.Medium) 53 .fontColor($r('sys.color.ohos_id_color_text_primary')) 54 }.alignItems(VerticalAlign.Center) 55 .height($r('app.float.dialog_title_height')) 56 .margin({ 57 left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') 58 }) 59 60 Row() { 61 Column() { 62 TextInput({ placeholder: '', text: this.inputName }) 63 .fontSize($r('sys.float.ohos_id_text_size_body1')) 64 .fontFamily($r('app.string.id_text_font_family_regular')) 65 .fontColor($r('app.color.text_input_font_color_182431')) 66 .maxLength(Constants.ALBUM_NAME_MAX_LENGTH) 67 .enterKeyType(EnterKeyType.Done) 68 .backgroundColor($r('app.color.transparent')) 69 .onChange((value: string) => { 70 Log.info(this.TAG, `TextInput onChange : ${value}`) 71 this.inputName = value 72 if (value.length === Constants.ALBUM_NAME_MAX_LENGTH) { 73 getResourceString($r('app.string.Maximum_length_reached')).then((message: string) => { 74 showToast(message) 75 }) 76 } 77 this.isNull = this.inputName === ''; 78 }) 79 .margin({ 80 left: $r('app.float.input_text_margin'), right: $r('app.float.input_text_margin') 81 }) 82 83 Divider().vertical(false).strokeWidth(this.dividerWidth) 84 .color(this.dividerColor) 85 .margin({ 86 left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') 87 }) 88 } 89 }.margin({ 90 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 91 92 Stack({ alignContent: Alignment.Top }) { 93 Row() { 94 Button() { 95 Text($r('app.string.dialog_cancel')) 96 .fontSize($r('sys.float.ohos_id_text_size_button1')) 97 .fontColor($r('app.color.color_control_highlight')) 98 .width('50%') 99 .fontWeight(FontWeight.Medium) 100 .textAlign(TextAlign.Center) 101 } 102 .margin({ right: $r('app.float.details_dialog_button_margin_right') }) 103 .backgroundColor($r('app.color.transparent')) 104 .height($r('app.float.details_dialog_button_height')) 105 .onClick(() => { 106 this.dialogCallback && this.dialogCallback.cancelCallback(); 107 this.controller.close() 108 }) 109 110 Row() { 111 Divider() 112 .vertical(true) 113 .height($r('app.float.dialog_divider_height')) 114 .color($r('app.color.divider_vertical_color')) 115 }.height($r('app.float.details_dialog_button_height')) 116 .alignItems(VerticalAlign.Center) 117 118 Button() { 119 Text($r('app.string.yes')) 120 .fontSize($r('sys.float.ohos_id_text_size_button1')) 121 .fontColor($r('app.color.color_control_highlight')) 122 .width('50%') 123 .fontWeight(FontWeight.Medium) 124 .textAlign(TextAlign.Center) 125 } 126 .enabled(!this.isNull) 127 .opacity(this.isNull ? $r('app.float.disable_button_opacity') : 1) 128 .margin({ right: $r('app.float.details_dialog_button_margin_left') }) 129 .backgroundColor($r('app.color.transparent')) 130 .height($r('app.float.details_dialog_button_height')) 131 .onClick(() => { 132 let check = /[\\.\\\\/:*?<>\"|\[\]{}\s]/; 133 let passCheck = check.test(this.inputName) 134 if (passCheck) { 135 getResourceString($r('app.string.specific_characters_not_supported')).then((message: string) => { 136 showToast(message) 137 }) 138 return 139 } 140 this.dialogCallback && this.dialogCallback.confirmCallback(this.inputName); 141 this.controller.close() 142 }) 143 } 144 } 145 .height($r('app.float.details_dialog_button_area_height')) 146 .margin({ 147 left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') 148 }) 149 .height($r('app.float.details_dialog_button_area_height')) 150 } 151 .alignItems(HorizontalAlign.Start) 152 .borderRadius($r('app.float.dialog_border_radius')) 153 .width(screenManager.getColumnsWidth(4)) 154 .backgroundColor($r('app.color.white')) 155 .margin({ 156 right: $r('app.float.dialog_window_margin'), 157 left: $r('app.float.dialog_window_margin'), 158 bottom: this.isHorizontal || this.isSidebar ? 0 : Constants.DIALOG_BOTTOM_OFFSET + px2vp(this.leftBlank[3]) 159 }) 160 } 161} 162