1/*
2 * Copyright (c) 2024 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 { BlockTag } from '../model/BlockTag';
16import { tagDesRule } from '../utils';
17import { formatDate } from '../utils/timeUtil';
18import { Block } from './Block';
19
20export interface RadioItem {
21  label: ResourceStr;
22  value: Object;
23}
24
25@Component
26export struct RadioBlock {
27  @Prop title: string;
28  @Link isEnabled: boolean;
29  @Link value: Object;
30  @Prop dataSource: RadioItem[];
31  @StorageLink('Block') listRadioBlockTags: Array<BlockTag> = [];
32  @State listRadioBlockTagsTemp: Array<BlockTag> = [];
33
34  build() {
35    Column() {
36      Block({ title: this.title, isEnabled: $isEnabled }) {
37        Flex({ wrap: FlexWrap.Wrap }) {
38          ForEach(this.dataSource, (item: RadioItem, index: number) => {
39            Row({ space: 8 }) {
40              Radio({ group: this.title, value: JSON.stringify(item.value) })
41                .checked(JSON.stringify(this.value) === JSON.stringify(item.value))
42                .enabled(this.isEnabled)
43                .onChange((checked) => {
44                  if (checked) {
45                    this.value = item.value;
46                    let time = formatDate(new Date(Date.now()))
47                    this.listRadioBlockTagsTemp.push(new BlockTag(time, tagDesRule(this.title, item.label.toString())))
48                  }
49                })
50                .onClick(() => {
51                  setTimeout(() => {
52                    if (AppStorage.get('Block')) {
53                      this.listRadioBlockTags = this.listRadioBlockTags.concat(this.listRadioBlockTagsTemp);
54                      this.listRadioBlockTagsTemp = [];
55                    } else {
56                      if (this.listRadioBlockTagsTemp) {
57                        this.listRadioBlockTags = this.listRadioBlockTags.concat(this.listRadioBlockTagsTemp);
58                      }
59                      if (this.listRadioBlockTags) {
60                        this.listRadioBlockTagsTemp = [];
61                      }
62                    }
63                  }, 200)
64                })
65
66              Text(item.label)
67                .fontSize($r('sys.float.Body_M'))
68                .fontWeight(FontWeight.Regular)
69                .fontColor($r('sys.color.font_primary'))
70            }
71            .margin(index % 3 !== 0 ? { left: 16 } : {})
72          })
73        }
74        .width('100%')
75      }
76    }
77  }
78}
79
80@Preview
81@Component
82struct RadioBlockPreview {
83  @State isEnabled: boolean = true
84  @State value: ButtonType = ButtonType.Capsule
85
86  build() {
87    RadioBlock({
88      title: 'RadioBlock',
89      isEnabled: $isEnabled,
90      value: $value,
91      dataSource: [
92        { label: '胶囊按钮', value: ButtonType.Capsule },
93        { label: '普通按钮', value: ButtonType.Normal },
94        { label: '圆形按钮', value: ButtonType.Circle },
95      ]
96    })
97  }
98}