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 { DialogCallback } from '../../model/common/DialogUtil'; 18import { ColumnSize, ScreenManager } from '../../model/common/ScreenManager'; 19import { Constants } from '../../model/common/Constants'; 20import { UiUtil } from '../../utils/UiUtil'; 21import { StringUtil } from '../../utils/StringUtil'; 22 23const TAG: string = 'common_AddNotesDialog'; 24 25@CustomDialog 26export struct AddNotesDialog { 27 @StorageLink('isHorizontal') isHorizontal: boolean = ScreenManager.getInstance().isHorizontal(); 28 @StorageLink('isSidebar') isSidebar: boolean = ScreenManager.getInstance().isSidebar(); 29 @StorageLink('leftBlank') leftBlank: number[] = 30 [0, ScreenManager.getInstance().getStatusBarHeight(), 0, ScreenManager.getInstance().getNaviBarHeight()]; 31 controller?: CustomDialogController; 32 @Consume dialogCallback: DialogCallback; 33 @State isNull: boolean = false; 34 private inputNote: string = ''; 35 36 aboutToAppear(): void { 37 Log.info(TAG, 'aboutToAppear'); 38 this.inputNote = ''; 39 this.isNull = this.inputNote === ''; 40 } 41 42 build() { 43 Column() { 44 Row() { 45 Column() { 46 Button() { 47 Image($r('app.media.ic_gallery_public_cancel')) 48 }.height($r('app.float.icon_size')) 49 .width($r('app.float.icon_size')) 50 .onClick(() => { 51 this.dialogCallback && this.dialogCallback.cancelCallback(); 52 this.controller?.close(); 53 }) 54 }.margin({ right: $r('app.float.dialog_icon_margin_horizontal') }) 55 56 Column() { 57 TextInput({ placeholder: '', text: this.inputNote }) 58 .fontSize($r('sys.float.ohos_id_text_size_caption1')) 59 .fontFamily($r('app.string.id_text_font_family_regular')) 60 .fontColor($r('sys.color.ohos_id_color_text_primary')) 61 .maxLength(Constants.ADD_NOTES_MAX_LENGTH) 62 .enterKeyType(EnterKeyType.Done) 63 .onChange((value: string) => { 64 Log.info(TAG, `TextInput onChange : ${value}`) 65 this.inputNote = value 66 this.isNull = this.inputNote === ''; 67 }) 68 } 69 .margin({ 70 right: $r('app.float.dialog_icon_margin_horizontal'), 71 bottom: $r('sys.float.ohos_id_elements_margin_vertical_l') 72 }) 73 74 Column() { 75 Button() { 76 Image($r('app.media.ic_gallery_public_ok')) 77 }.height($r('app.float.icon_size')) 78 .width($r('app.float.icon_size')) 79 .onClick(() => { 80 let passCheck = StringUtil.checkNameInvalid(this.inputNote); 81 if (passCheck) { 82 UiUtil.showToast($r('app.string.specific_characters_not_supported')); 83 this.controller?.close(); 84 return 85 } 86 this.dialogCallback && this.dialogCallback.confirmCallback(this.inputNote); 87 this.controller?.close(); 88 }) 89 } 90 }.margin({ top: $r('sys.float.ohos_id_text_paragraph_margin_s'), 91 bottom: $r('sys.float.ohos_id_text_paragraph_margin_s') }) 92 .height($r('app.float.dialog_add_notes_content_height')) 93 } 94 .padding({ left: $r('app.float.dialog_content_margin'), right: $r('app.float.dialog_content_margin') }) 95 .height('dialog_add_notes_height') 96 .width('100%') 97 .borderRadius($r('sys.float.ohos_id_corner_radius_default_l')) 98 .width(ScreenManager.getInstance().getColumnsWidth(ColumnSize.COLUMN_FOUR)) 99 .backgroundColor($r('app.color.white')) 100 .margin({ 101 right: $r('app.float.dialog_content_margin'), 102 left: $r('app.float.dialog_content_margin'), 103 bottom: this.isHorizontal || this.isSidebar ? 0 : Constants.DIALOG_BOTTOM_OFFSET + this.leftBlank[3] 104 }) 105 .shadow({ 106 radius: $r('app.float.dialog_defult_shadow_m_radio'), 107 color: $r('app.color.dialog_defult_shadow_m_color'), 108 offsetX: $r('app.float.dialog_defult_shadow_m_offsetX'), 109 offsetY: $r('app.float.dialog_defult_shadow_m_offsetY') 110 }) 111 } 112} 113