• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1/**
2 * Copyright (c) 2021-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 { Log } from '@ohos/common';
16import RecentMissionCard from '../common/uicomponents/RecentMissionCard';
17import { RecentsStyleConstants } from '../common/constants/RecentsStyleConstants';
18import { RecentMissionsViewModel } from '../viewmodel/RecentMissionsViewModel';
19
20const TAG = 'RecentMissionsSingleLayout';
21
22/**
23 * Single-line display of recent task list (phone adaptation).
24 */
25@Component
26export struct RecentMissionsSingleLayout {
27  @Link recentMissionsSingleList: [];
28  @Link isClickSubComponent: boolean;
29  @StorageLink('recentIdx') recentIdx: number = 0;
30  private mRecentMissionsViewModel: RecentMissionsViewModel;
31
32  aboutToAppear(): void {
33    this.mRecentMissionsViewModel = RecentMissionsViewModel.getInstance();
34  }
35
36  build() {
37    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceBetween }) {
38      // middle area, mission list
39      Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
40        List({ space: RecentsStyleConstants.SINGLE_LIST_MIDDLE_AREA_SPACE, initialIndex: this.recentIdx}) {
41          ForEach(this.recentMissionsSingleList, (item) => {
42            ListItem() {
43              RecentMissionCard({
44                missionId: item.missionId,
45                appIconId: item.appIconId,
46                appLabelId: item.appLabelId,
47                appName: item.appName,
48                bundleName: item.bundleName,
49                moduleName: item.moduleName,
50                abilityName: item.abilityName,
51                lockedState: item.lockedState,
52                isClickSubComponent: $isClickSubComponent,
53                snapShotTime: item.snapShotTime
54              })
55            }
56          }, (item) => JSON.stringify(item))
57        }
58        .cachedCount(3)
59        .scrollBar(BarState.Off)
60        .listDirection(Axis.Horizontal)
61        .height(RecentsStyleConstants.SINGLE_LIST_MISSION_HEIGHT)
62      }
63      .padding({ top: RecentsStyleConstants.SINGLE_LIST_MIDDLE_AREA_TOP_MARGIN })
64      .width(RecentsStyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
65      .height(RecentsStyleConstants.SINGLE_LIST_MIDDLE_AERA_HEIGHT)
66
67      // bottom area, button for cleaning up running applications
68      Column() {
69        Stack() {
70          Column() {
71          }
72          .width(RecentsStyleConstants.RECENT_DELETE_IMAGE_COLUMN_SIZE)
73          .height(RecentsStyleConstants.RECENT_DELETE_IMAGE_COLUMN_SIZE)
74          .opacity(RecentsStyleConstants.DEFAULT_DELETE_IMAGE_OPACITY)
75          .backgroundColor(RecentsStyleConstants.DEFAULT_FONT_COLOR)
76          .borderRadius(RecentsStyleConstants.RECENT_DELETE_IMAGE_COLUMN_SIZE / 2)
77
78          Image(RecentsStyleConstants.DEFAULT_DELETE_IMAGE_FULL)
79            .width(RecentsStyleConstants.RECENT_DELETE_IMAGE_SIZE)
80            .height(RecentsStyleConstants.RECENT_DELETE_IMAGE_SIZE)
81        }
82        .onClick(() => {
83          this.isClickSubComponent = true;
84          Log.showDebug(TAG, 'onClick click delete button');
85          this.mRecentMissionsViewModel.deleteRecentMission(true, -1);
86          this.mRecentMissionsViewModel.backView();
87          this.mRecentMissionsViewModel.getRecentMissionsList();
88        })
89      }
90      .margin({ bottom: RecentsStyleConstants.SINGLE_LIST_DELETE_IMAGE_FULL_BOTTOM_MARGIN })
91      .width(RecentsStyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
92    }
93    .height(RecentsStyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
94
95  }
96}