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 ReceiveController from "./receiveController" 16import ConversationController from "../../pages/conversation/conversationController" 17 18@Component 19export struct Receive { 20 @State mReceiveController: ReceiveController = ReceiveController.getInstance(); 21 @Link mConversationController: ConversationController; 22 23 aboutToAppear() { 24 this.mReceiveController.onInit((receiverData) => { 25 this.mConversationController.setReceiveContactValue(receiverData) 26 }) 27 } 28 29 build() { 30 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Start }) { 31 Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceBetween }) { 32 Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 33 Text($r("app.string.putAddresser")) 34 .maxLines(1) 35 .lineHeight($r("app.float.addressee_line_height")) 36 .fontSize($r("app.float.addressee_font_size")) 37 .fontColor($r("sys.color.ohos_id_color_text_secondary")) 38 .fontWeight(FontWeight.Regular) 39 .fontFamily("HarmonyHeiTi") 40 .flexShrink(0) 41 Flex({ wrap: FlexWrap.NoWrap, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Start }) { 42 // If a contact is selected 43 if (this.mReceiveController.isInputStatus) { 44 if (this.mReceiveController.selectContacts.length > 0) { 45 ForEach(this.mReceiveController.selectContacts, (item, index) => { 46 Row() { 47 if (item.contactName == "" || item.contactName == null) { 48 Text(item.telephoneFormat) 49 .textAlign(TextAlign.Center) 50 .maxLines(1) 51 .textOverflow({ overflow: TextOverflow.Ellipsis }) 52 .fontSize(12) 53 .flexShrink(1) 54 } 55 if (item.contactName != "" && item.contactName != null) { 56 Text(item.contactName) 57 .textAlign(TextAlign.Center) 58 .maxLines(1) 59 .textOverflow({ overflow: TextOverflow.Ellipsis }) 60 .fontSize(12) 61 .flexShrink(1) 62 } 63 if (item.select) { 64 Image($rawfile("icon/ic_public_cancel.svg")) 65 .width(16) 66 .height(16) 67 .flexShrink(1) 68 } 69 } 70 .padding({ left: 8, right: 8 }) 71 .margin(8) 72 .backgroundColor($r("sys.color.ohos_id_color_component_normal")) 73 .borderRadius(24) 74 .height(28) 75 .alignItems(VerticalAlign.Center) 76 .constraintSize({ maxWidth: item.select ? 244 : 228 ,minWidth: 68}) 77 .onClick(() => { 78 this.mReceiveController.nameClick(index, (receiverData) => { 79 this.mConversationController.setReceiveContactValue(receiverData); 80 }) 81 }) 82 }, item => JSON.stringify(item)) 83 } 84 Flex() { 85 TextArea({ text: this.mReceiveController.myText }) 86 .caretColor($r("sys.color.ohos_id_color_focused_outline")) 87 .placeholderColor($r("sys.color.ohos_id_color_text_hint")) 88 .backgroundColor($r("sys.color.ohos_id_color_background_transparent")) 89 .focusable(true) 90 .flexShrink(1) 91 .onChange((value) => { 92 this.mReceiveController.searchChange(value, (receiverData) => { 93 this.mConversationController.setReceiveContactValue(receiverData); 94 }); 95 }) 96 .onBlur(() => { 97 this.mReceiveController.checkReceive((receiverData) => { 98 this.mConversationController.setReceiveContactValue(receiverData); 99 }); 100 }) 101 .onFocus(() => { 102 this.mReceiveController.myContactFocus(); 103 }) 104 } 105 .flexShrink(1) 106 .constraintSize({ maxHeight: 120 }) 107 } 108 else { 109 Text(this.mReceiveController.strSelectContact) 110 .fontColor($r("sys.color.ohos_id_color_text_primary_activated")) 111 .textAlign(TextAlign.Center) 112 .fontSize(16) 113 .lineHeight(22) 114 .maxLines(1) 115 .textAlign(TextAlign.Start) 116 .textOverflow({ overflow: TextOverflow.Ellipsis }) 117 .width("100%") 118 .padding({ top: 12, bottom: 12 }) 119 .onClick(() => { 120 this.mReceiveController.myContactClick(); 121 }) 122 } 123 } 124 .flexShrink(1) 125 } 126 .flexBasis("auto") 127 .flexShrink(1) 128 129 // Contact icon on the right 130 Image($rawfile("icon/ic_about.svg")) 131 .width(24) 132 .height(24) 133 .onClick(() => { 134 // The page for selecting a contact is displayed. 135 this.mReceiveController.clickToContracts((receiverData) => { 136 this.mConversationController.setReceiveContactValue(receiverData); 137 }) 138 }) 139 140 } 141 .constraintSize({ minHeight: 56, maxHeight:200 }) 142 .backgroundColor($r("sys.color.ohos_id_color_background")) 143 .borderRadius($r("app.float.settings_items_radius")) 144 .padding({ left: 12, right: 12 }) 145 146 Column() { 147 // Indicates whether to display the recent contact list. 148 if (this.mReceiveController.isShowSearch && this.mReceiveController.contacts.length > 0) { 149 // Flex({ alignItems: ItemAlign.Center, justifyContent: FlexAlign.Start }) { 150 // Text("最近联系人") 151 // .fontSize(16) 152 // .fontColor($r("sys.color.ohos_id_color_text_tertiary")) 153 // .fontWeight(FontWeight.Regular) 154 // } 155 // .height(48) 156 // List area 157 List({ space: 0, initialIndex: 0 }) { 158 ForEach(this.mReceiveController.contacts, (item, index) => { 159 ListItem() { 160 Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) { 161 Image($rawfile("icon/ic_user_portrait.svg")) 162 .objectFit(ImageFit.Fill) 163 .width("40vp") 164 .height("40vp") 165 .clip(new Circle({ width: "40vp", height: "40vp" })) 166 .backgroundColor($r("app.color.ic_user_head_color")) 167 .onClick(() => { 168 this.mReceiveController.titleBarAvatar(index) 169 }) 170 171 Flex({ 172 direction: FlexDirection.Column, 173 justifyContent: FlexAlign.Center, 174 alignItems: ItemAlign.Start 175 }) { 176 if (item.contactName != '' || item.contactName != null) { 177 Text(item.contactName) 178 .fontSize(16) 179 .fontColor($r("sys.color.ohos_id_color_text_primary")) 180 .maxLines(1) 181 .fontWeight(FontWeight.Medium) 182 .textOverflow({ overflow: TextOverflow.Ellipsis }) 183 } 184 Text(item.telephoneFormat) 185 .fontColor($r("sys.color.ohos_id_color_text_tertiary")) 186 .fontSize(14) 187 .maxLines(1) 188 .margin({ top: 4 }) 189 .textOverflow({ overflow: TextOverflow.Ellipsis }) 190 } 191 .layoutWeight(1) 192 .margin({ left: 12 }) 193 .onClick(() => { 194 this.mReceiveController.addContact(index, (receiverData) => { 195 this.mConversationController.setReceiveContactValue(receiverData); 196 }) 197 }) 198 } 199 .width('100%') 200 .height(64) 201 } 202 }, item => JSON.stringify(item)) 203 } 204 .listDirection(Axis.Vertical) // Arrange Direction 205 .edgeEffect(EdgeEffect.Spring) // Sliding to the edge has no effect 206 .divider({ 207 strokeWidth: 1, 208 color: $r("sys.color.ohos_id_color_list_separator"), 209 startMargin: 52, 210 endMargin: 0 211 }) // Demarcation line between each row 212 } 213 }.padding({ left: 12, right: 12, bottom: 56 }) 214 } 215 .width("100%") 216 .padding({ left: 12, right: 12 }) 217 } 218}
