• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/*
2 * Copyright (c) 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 { fileUtils } from '../utils/FileUtils';
17
18@Preview
19@Component
20export struct FileBrowse {
21  @State folders: Array<string> = ['folder'];
22  @State files: Array<string> = [];
23  @State currentFolder: string = '';
24
25  aboutToAppear() {
26    fileUtils.listFolders().then((folders: Array<string>) => {
27      this.folders = folders;
28    })
29  }
30
31  build() {
32    Navigation() {
33      List({ space: 12 }) {
34        ForEach(this.folders, (item: string) => {
35          ListItem() {
36            NavRouter() {
37              Row() {
38                Image($r('app.media.ic_files_folder'))
39                  .size({ width: 32, height: 26 })
40                  .objectFit(ImageFit.Contain)
41                Text(item)
42                  .fontSize(16)
43                  .width('100%')
44                  .margin({ left: 12 })
45              }
46              .height(56)
47              .padding({ left: 16 })
48              .backgroundColor(Color.White)
49              .borderRadius(24)
50
51              NavDestination() {
52                this.FilesView()
53              }
54              .title(this.CustomTitle(item))
55              .backgroundColor($r('app.color.light_gray'))
56            }
57            .onStateChange(async (isActivated: boolean) => {
58              if (isActivated) {
59                this.currentFolder = item;
60                this.files = await fileUtils.listFiles(item);
61              }
62            })
63          }
64        })
65      }
66      .padding({ left: 12, right: 12 })
67    }
68    .hideBackButton(false)
69    .titleMode(NavigationTitleMode.Mini)
70    .title($r('app.string.download_files_title'))
71    .mode(NavigationMode.Stack)
72    .backgroundColor($r('app.color.light_gray'))
73  }
74
75  @Builder
76  CustomTitle(title: string) {
77    Row() {
78      Text(title)
79        .fontSize(20)
80        .fontColor($r('app.color.text_normal'))
81        .fontWeight(700)
82        .margin({ left: 8 })
83    }
84    .width('100%')
85  }
86
87  @Builder
88  FilesView() {
89    Column() {
90      List({ space: 12 }) {
91        if (this.files.length === 0) {
92          ListItem() {
93            Text($r('app.string.folder_empty'))
94              .fontSize(16)
95              .width('100%')
96              .margin({ top: 50 })
97              .textAlign(TextAlign.Center)
98          }
99        }
100        ForEach(this.files, (item: string) => {
101          ListItem() {
102            Text(decodeURIComponent(item))
103              .fontSize(16)
104              .width('100%')
105          }
106          .padding(12)
107          .height(48)
108          .backgroundColor(Color.White)
109          .borderRadius(24)
110        })
111      }
112      .padding({ left: 12, right: 12 })
113      .layoutWeight(1)
114
115      Column() {
116        Button() {
117          Image($r('app.media.ic_public_delete'))
118            .objectFit(ImageFit.Cover)
119            .size({ width: 24, height: 24 })
120        }
121        .type(ButtonType.Circle)
122        .width(40)
123        .height(40)
124        .backgroundColor('#FF0000')
125        .margin({ left: 5 })
126
127        Text($r('app.string.clear_folder'))
128          .fontSize(14)
129          .fontColor($r('app.color.text_normal'))
130          .opacity(0.6)
131          .margin({ top: 8 })
132      }
133      .margin({ bottom: 24, top: 6 })
134      .onClick(() => {
135        fileUtils.clearFolder(this.currentFolder);
136        this.files = [];
137      })
138    }
139    .height('100%')
140    .backgroundColor($r('app.color.light_gray'))
141  }
142}