• 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        .listDirection(Axis.Horizontal)
59        .height(RecentsStyleConstants.SINGLE_LIST_MISSION_HEIGHT)
60      }
61      .padding({ top: RecentsStyleConstants.SINGLE_LIST_MIDDLE_AREA_TOP_MARGIN })
62      .width(RecentsStyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
63      .height(RecentsStyleConstants.SINGLE_LIST_MIDDLE_AERA_HEIGHT)
64
65      // bottom area, button for cleaning up running applications
66      Column() {
67        Stack() {
68          Column() {
69          }
70          .width(RecentsStyleConstants.RECENT_DELETE_IMAGE_COLUMN_SIZE)
71          .height(RecentsStyleConstants.RECENT_DELETE_IMAGE_COLUMN_SIZE)
72          .opacity(RecentsStyleConstants.DEFAULT_DELETE_IMAGE_OPACITY)
73          .backgroundColor(RecentsStyleConstants.DEFAULT_FONT_COLOR)
74          .borderRadius(RecentsStyleConstants.RECENT_DELETE_IMAGE_COLUMN_SIZE / 2)
75
76          Image(RecentsStyleConstants.DEFAULT_DELETE_IMAGE_FULL)
77            .width(RecentsStyleConstants.RECENT_DELETE_IMAGE_SIZE)
78            .height(RecentsStyleConstants.RECENT_DELETE_IMAGE_SIZE)
79        }
80        .onClick(() => {
81          this.isClickSubComponent = true;
82          Log.showDebug(TAG, 'onClick click delete button');
83          this.mRecentMissionsViewModel.deleteRecentMission(true, -1);
84          this.mRecentMissionsViewModel.backView();
85          this.mRecentMissionsViewModel.getRecentMissionsList();
86        })
87      }
88      .margin({ bottom: RecentsStyleConstants.SINGLE_LIST_DELETE_IMAGE_FULL_BOTTOM_MARGIN })
89      .width(RecentsStyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
90    }
91    .height(RecentsStyleConstants.DEFAULT_LAYOUT_PERCENTAGE)
92
93  }
94}