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 DeviceUtil from '../utils/DeviceUtil';
16
17/**
18 * Type of the dialog box: No title, 1 message, and 2 buttons
19 */
20@CustomDialog
21export struct DeleteDialog {
22    controller: CustomDialogController;
23    /**
24     * Cancel Event
25     */
26    cancel: () => void;
27    /**
28     * Acknowledge Event
29     */
30    confirm: () => void;
31    /**
32     * Message content
33     */
34    msg: string | Resource;
35    /**
36     * Check whether the deleted information contains locked information.
37     */
38    hasLockMsg: boolean;
39    setSelectLock?: () => void;
40    /**
41     * Whether to delete lock information synchronously
42     */
43    isSelectLockMsg?: boolean;
44    setSelectLockChange?: (isOn: boolean) => void;
45
46    build() {
47        Column() {
48            Text(this.msg)
49                .width('100%')
50                .margin({ bottom: 8 })
51                .textAlign(TextAlign.Center)
52                .fontSize(16)
53                .fontColor($r('sys.color.ohos_id_color_text_primary'))
54                .lineHeight(22)
55                .fontWeight(FontWeight.Regular)
56                .fontFamily('HarmonyHeiTi')
57            if (this.hasLockMsg) {
58                Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
59                    Toggle({ type: ToggleType.Checkbox, isOn: this.isSelectLockMsg })
60                        .width('20vp')
61                        .height('20vp')
62                        .onChange((isOn: boolean) => {
63                            this.setSelectLockChange(isOn)
64                        })
65                    Text($r('app.string.msg_delete_dialog_cb_tip')).height('100%')
66                }
67                .width('100%')
68                .height('32vp')
69                .onClick((event?: ClickEvent) => {
70                    this.setSelectLock();
71                })
72            }
73            Flex({
74                direction: FlexDirection.Row,
75                justifyContent: FlexAlign.SpaceEvenly,
76                alignItems: ItemAlign.Center
77            }) {
78                Button() {
79                    Text($r('app.string.cancel'))
80                        .textAlign(TextAlign.Center)
81                        .fontSize(16)
82                        .fontColor($r('sys.color.ohos_id_color_floating_button_bg_normal'))
83                        .fontWeight(FontWeight.Medium)
84                        .fontFamily('HarmonyHeiTi')
85                        .lineHeight(22)
86                }
87                .backgroundColor($r('sys.color.ohos_id_color_background_transparent'))
88                .layoutWeight(1)
89                .onClick(() => {
90                    this.controller.close();
91                    this.cancel();
92                })
93
94                Divider()
95                    .vertical(true)
96                    .strokeWidth('1px')
97                    .height('20vp')
98                    .color($r('sys.color.ohos_id_color_list_separator'))
99                Button() {
100                    Text($r('app.string.delete'))
101                        .textAlign(TextAlign.Center)
102                        .fontSize(16)
103                        .fontColor($r('sys.color.ohos_id_color_warning'))
104                        .fontWeight(FontWeight.Medium)
105                        .fontFamily('HarmonyHeiTi')
106                        .lineHeight(22)
107                }
108                .backgroundColor($r('sys.color.ohos_id_color_background_transparent'))
109                .layoutWeight(1)
110                .onClick(() => {
111                    this.controller.close();
112                    this.confirm();
113                })
114            }
115            .width('100%')
116            .height(40)
117        }
118        .width('100%')
119        .padding({ left: 24, right: 24, top: 24, bottom: 16 })
120    }
121}
122
123@CustomDialog
124export struct DelConversionDialog {
125    controller: CustomDialogController;
126    /**
127     * Cancel Event
128     */
129    cancel: () => void;
130    /**
131     * Acknowledge Event
132     */
133    confirm: () => void;
134    /**
135     * Message content
136     */
137    msg: string | Resource;
138
139    build() {
140        Column() {
141            Text(this.msg)
142                .width('100%')
143                .margin({ bottom: 8 })
144                .textAlign(TextAlign.Center)
145                .fontSize(16)
146                .fontColor($r('sys.color.ohos_id_color_text_primary'))
147                .lineHeight(22)
148                .fontWeight(FontWeight.Regular)
149                .fontFamily('HarmonyHeiTi')
150            Flex({
151                direction: FlexDirection.Row,
152                justifyContent: FlexAlign.SpaceEvenly,
153                alignItems: ItemAlign.Center
154            }) {
155                Button() {
156                    Text($r('app.string.cancel'))
157                        .textAlign(TextAlign.Center)
158                        .fontSize(16)
159                        .fontColor($r('sys.color.ohos_id_color_floating_button_bg_normal'))
160                        .fontWeight(FontWeight.Medium)
161                        .fontFamily('HarmonyHeiTi')
162                        .lineHeight(22)
163                }
164                .backgroundColor($r('sys.color.ohos_id_color_background_transparent'))
165                .layoutWeight(1)
166                .onClick(() => {
167                    this.controller.close();
168                    this.cancel();
169                })
170
171                Divider()
172                    .vertical(true)
173                    .strokeWidth('1px')
174                    .height('20vp')
175                    .color($r('sys.color.ohos_id_color_list_separator'))
176                Button() {
177                    Text($r('app.string.delete'))
178                        .textAlign(TextAlign.Center)
179                        .fontSize(16)
180                        .fontColor($r('sys.color.ohos_id_color_warning'))
181                        .fontWeight(FontWeight.Medium)
182                        .fontFamily('HarmonyHeiTi')
183                        .lineHeight(22)
184                }
185                .backgroundColor($r('sys.color.ohos_id_color_background_transparent'))
186                .layoutWeight(1)
187                .onClick(() => {
188                    this.controller.close();
189                    this.confirm();
190                })
191            }
192            .width('100%')
193            .height(40)
194        }
195        .width('100%')
196        .padding({ left: 24, right: 24, top: 24, bottom: 16 })
197    }
198}
199
200export class MmsSimpleDialog {
201    value: AlertDialogParamWithMms;
202    private dialogGridCount: number = 4;
203    private dialogAlignment: DialogAlignment = DeviceUtil.isTablet() ? DialogAlignment.Center : DialogAlignment.Bottom;
204    private dialogOffset: Offset = DeviceUtil.isTablet() ? { dx: 0, dy: 0 } : { dx: 0, dy: -12 };
205
206    constructor(value: AlertDialogParamWithMms) {
207        this.value = value;
208    }
209
210    show() {
211        AlertDialog.show(
212            {
213                message: this.value.message,
214                autoCancel: false,
215                alignment: this.dialogAlignment,
216                offset: this.dialogOffset,
217                gridCount: this.dialogGridCount,
218                primaryButton: {
219                    value: this.value.primaryButton.value,
220                    action: this.value.primaryButton.action,
221                    fontColor: $r('sys.color.ohos_id_color_activated')
222                },
223                secondaryButton: {
224                    value: this.value.secondaryButton.value,
225                    action: this.value.secondaryButton.action,
226                    fontColor: $r('sys.color.ohos_id_color_warning')
227                }
228            }
229        )
230    }
231}
232
233
234@CustomDialog
235export struct SysSimpleExample {
236    controller: CustomDialogController
237    cancel: () => void
238    confirm: () => void
239    value: AlertDialogParamWithMms;
240    private dialogAlignment: DialogAlignment = DeviceUtil.isTablet() ? DialogAlignment.Center : DialogAlignment.Bottom;
241    private dialogOffset: Offset = DeviceUtil.isTablet() ? { dx: 0, dy: 0 } : { dx: 0, dy: -12 };
242
243    build() {
244        Column() {
245            Text(this.value.message)
246                .fontSize(16)
247                .fontWeight(FontWeight.Regular)
248                .margin({ top: 24, bottom: 8 })
249            Flex({ justifyContent: FlexAlign.SpaceAround, alignItems: ItemAlign.Center }) {
250                Button($r('app.string.cancel'))
251                    .onClick(() => {
252                        this.controller.close()
253                        this.cancel()
254                    })
255                    .backgroundColor(0xffffff)
256                    .fontColor($r('sys.color.ohos_id_color_activated'))
257                    .fontWeight(FontWeight.Medium)
258                    .layoutWeight(1)
259                Text('|').fontSize(16).fontColor(Color.Gray)
260                Button($r('app.string.restore'))
261                    .onClick(() => {
262                        this.controller.close()
263                        this.confirm()
264                    })
265                    .backgroundColor(0xffffff)
266                    .fontColor($r('sys.color.ohos_id_color_warning'))
267                    .fontWeight(FontWeight.Medium)
268                    .layoutWeight(1)
269            }.margin({ bottom: 12, top: 12 })
270        }.borderRadius(24)
271    }
272}
273
274declare interface AlertDialogParamWithMms {
275    message: ResourceStr;
276    primaryButton: {
277        value: ResourceStr;
278        action: () => void;
279    };
280    secondaryButton: {
281        value: ResourceStr;
282        action: () => void;
283    };
284}
285
286export interface CheckBoxItem {
287    title: string | Resource;
288    isOn: boolean;
289    onClick: (event?: ClickEvent) => void;
290}
291
292/**
293 * Type of the dialog box: 1 title, 2 options, and 2 buttons
294 */
295@CustomDialog
296export struct CheckBoxDialog {
297    controller: CustomDialogController;
298    /**
299     * Cancel Event
300     */
301    cancel: () => void;
302    /**
303     * Acknowledge Event
304     */
305    confirm: () => void;
306    /**
307     * Title
308     */
309    title: string | Resource;
310    /**
311     * Option Collection
312     */
313    @State itemList: Array<CheckBoxItem> = [];
314
315    build() {
316        Column() {
317            // dialog title
318            Text(this.title)
319                .width('100%')
320                .margin({ bottom: 8 })
321                .fontSize(16)
322                .fontColor($r('sys.color.ohos_id_color_text_primary'))
323                .lineHeight(22)
324                .fontWeight(FontWeight.Regular)
325                .fontFamily('HarmonyHeiTi')
326            // item Checklist
327            ForEach(this.itemList, (item, index) => {
328                Flex({
329                    direction: FlexDirection.Row,
330                    justifyContent: FlexAlign.SpaceBetween,
331                    alignItems: ItemAlign.Center
332                }) {
333                    Text(item.title)
334                    Toggle({ type: ToggleType.Checkbox, isOn: item.isOn })
335                        .width('20vp')
336                        .height('20vp')
337                        .enabled(false)
338                }
339                .width('100%')
340                .height('32vp')
341                .onClick(item.onClick)
342            }, (item, index) => index.toString())
343            // OK and Cancel Buttons
344            Flex({
345                direction: FlexDirection.Row,
346                justifyContent: FlexAlign.SpaceEvenly,
347                alignItems: ItemAlign.Center
348            }) {
349                Button() {
350                    Text($r('app.string.cancel'))
351                        .textAlign(TextAlign.Center)
352                        .fontSize(16)
353                        .fontColor($r('sys.color.ohos_id_color_floating_button_bg_normal'))
354                        .fontWeight(FontWeight.Medium)
355                        .fontFamily('HarmonyHeiTi')
356                        .lineHeight(22)
357                        .onClick(() => {
358                            this.controller.close();
359                            this.cancel();
360                        })
361                }.backgroundColor($r('sys.color.ohos_id_color_background_transparent')).layoutWeight(1)
362
363                Divider()
364                    .vertical(true)
365                    .strokeWidth('1px')
366                    .height('20vp')
367                    .color($r('sys.color.ohos_id_color_list_separator'))
368                Button() {
369                    Text($r('app.string.ok'))
370                        .textAlign(TextAlign.Center)
371                        .fontSize(16)
372                        .fontColor($r('sys.color.ohos_id_color_floating_button_bg_normal'))
373                        .fontWeight(FontWeight.Medium)
374                        .fontFamily('HarmonyHeiTi')
375                        .lineHeight(22)
376                        .onClick(() => {
377                            this.controller.close();
378                            this.confirm();
379                        })
380                }.backgroundColor($r('sys.color.ohos_id_color_background_transparent')).layoutWeight(1)
381            }
382            .width('100%')
383            .height(40)
384        }
385        .width('100%')
386        .padding({ left: 24, right: 24, top: 24, bottom: 16 })
387    }
388}
389
390@CustomDialog
391export struct TransmitMsgDialog {
392    scroller: Scroller = new Scroller()
393    controller: CustomDialogController;
394    /**
395     * Cancel an event
396     */
397    cancel: () => void;
398    /**
399     * Acknowledgment Events
400     */
401    confirm: () => void;
402    /**
403     * Message content
404     */
405    msg: object | Resource | any;
406    isChecked: boolean = true;
407    changeValue?: () => void;
408    clickChecked?: () => void;
409
410    build() {
411        Column() {
412            Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Start, justifyContent: FlexAlign.Start }) {
413                Flex({
414                    direction: FlexDirection.Column,
415                    alignItems: ItemAlign.Start,
416                    justifyContent: FlexAlign.Start
417                }) {
418                    // Title
419                    Column() {
420                        if (this.msg.contactsParam.contactsNum > 1) {
421                            Text() {
422                                Span($r('app.string.contentSentTo'))
423                                    .fontSize(20)
424                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
425                                    .fontWeight(FontWeight.Bold)
426                                Span(this.msg.contactsParam.contactName == '' ?
427                                this.msg.contactsParam.telephoneFormatSplit :
428                                this.msg.contactsParam.contactNameSplit)
429                                    .fontSize(20)
430                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
431                                    .fontWeight(FontWeight.Bold)
432                                Span($r('app.string.including'))
433                                    .fontSize(20)
434                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
435                                    .fontWeight(FontWeight.Bold)
436                                Span(this.msg.contactsParam.contactsNum)
437                                    .fontSize(20)
438                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
439                                    .fontWeight(FontWeight.Bold)
440                                Span($r('app.string.people'))
441                                    .fontSize(20)
442                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
443                                    .fontWeight(FontWeight.Bold)
444                            }
445                        } else {
446                            Text() {
447                                Span($r('app.string.contentSentTo'))
448                                    .fontSize(20)
449                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
450                                    .fontWeight(FontWeight.Bold)
451                                Span(this.msg.contactsParam.contactName == '' ?
452                                this.msg.contactsParam.telephoneFormat :
453                                this.msg.contactsParam.contactName)
454                                    .fontSize(20)
455                                    .fontColor($r('sys.color.ohos_id_color_text_primary'))
456                                    .fontWeight(FontWeight.Bold)
457                            }
458                        }
459                    }
460                    .alignItems(HorizontalAlign.Start)
461                    .width('100%')
462
463                    // Forwarded content
464                    Column() {
465                        List() {
466                            ForEach(this.msg.transmitContentList, item => {
467                                ListItem() {
468                                    if (item.msgShowType == 0 || item.msgShowType == 4) {
469                                        Flex() {
470                                            if (item.msgUriPath != '' && (item.msgType == 1 || item.msgType == 2)) {
471                                                Image($rawfile(item.msgUriPath))
472                                                    .width('100%')
473                                                    .height(150)
474                                            } else if (item.msgUriPath != '' && item.msgType == 5) {
475                                                Image($rawfile('icon/msg_contacts.svg'))
476                                                    .height(48)
477                                                    .width(48)
478                                                    .margin({ left: 10, right: 10 })
479                                                Flex() {
480                                                    Text(item.msgUriPath)
481                                                        .align(Alignment.Center)
482                                                    if (item.audioTime != '') {
483                                                        Text(item.audioTime)
484                                                            .align(Alignment.Center)
485                                                    }
486                                                }
487                                                .padding(5)
488                                                .margin({ right: 40 })
489                                            } else if (item.content != '') {
490                                                if (this.isChecked || (!this.isChecked && item.isMsm)) {
491                                                    Column() {
492                                                        Column() {
493                                                            Text(this.msg.transmitContent)
494                                                            Text(item.contentInfo)
495                                                        }
496
497                                                        Column() {
498                                                            Text(item.content)
499                                                                .fontSize(16)
500                                                                .margin({ top: 5 })
501                                                        }
502                                                    }
503                                                    .padding({ top: 20 })
504                                                    .width('100%')
505                                                    .alignItems(HorizontalAlign.Start)
506
507                                                } else if (!this.isChecked && !item.isMsm) {
508                                                    TextArea({
509                                                        text: item.content
510                                                    })
511                                                        .onChange((item) => {
512                                                            this.changeValue()
513                                                        })
514                                                }
515                                            }
516                                        }
517                                    } else if (item.msgShowType == 1 || item.msgShowType == 2) {
518                                        Flex() {
519                                            Image($rawfile('icon/ppt.svg'))
520                                                .width('100%')
521                                                .height(150)
522                                            if (item.content != '') {
523                                                Text(item.content)
524                                            }
525                                        }
526                                        .padding(20)
527                                        .backgroundColor('#20A9A9A9')
528                                        .borderRadius(15)
529                                    } else {
530                                        Flex() {
531                                            if (item.content != '') {
532                                                Text(item.content)
533                                                    .margin({ top: 10, left: 30, bottom: 10 })
534                                            }
535                                        }
536                                    }
537
538                                }
539                            }, item => item.msgType.toString())
540                        }
541                    }
542                    .alignItems(HorizontalAlign.Start)
543                    .width('100%')
544                }
545            }
546
547            Flex({ justifyContent: FlexAlign.SpaceAround }) {
548                Button() {
549                    Text($r('app.string.cancel'))
550                        .textAlign(TextAlign.Center)
551                        .fontSize(16)
552                        .fontColor($r('sys.color.ohos_id_color_floating_button_bg_normal'))
553                        .fontWeight(FontWeight.Medium)
554                        .fontFamily('HarmonyHeiTi')
555                        .lineHeight(22)
556                }
557                .backgroundColor($r('sys.color.ohos_id_color_background_transparent'))
558                .layoutWeight(1)
559                .onClick(() => {
560                    this.controller.close();
561                    this.cancel();
562                })
563
564                Divider()
565                    .vertical(true)
566                    .strokeWidth('1px')
567                    .height('20vp')
568                    .color($r('sys.color.ohos_id_color_list_separator'))
569                Button() {
570                    Text($r('app.string.msg_transmit'))
571                        .textAlign(TextAlign.Center)
572                        .fontSize(16)
573                        .fontColor($r('sys.color.ohos_id_color_warning'))
574                        .fontWeight(FontWeight.Medium)
575                        .fontFamily('HarmonyHeiTi')
576                        .lineHeight(22)
577                }
578                .backgroundColor($r('sys.color.ohos_id_color_background_transparent'))
579                .layoutWeight(1)
580                .onClick(() => {
581                    this.controller.close();
582                    this.confirm();
583                })
584            }
585        }
586        .width('100%')
587        .height(200)
588        .padding({ left: 24, right: 24, top: 24, bottom: 40 })
589    }
590}