1/* 2 * Copyright (c) 2022-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 { 17 Action, 18 ActionBarMode, 19 ActionBarProp, 20 ActionBarSelectionMode, 21 Constants, 22 Log, 23 ScreenManager 24} from '@ohos/common'; 25import { ActionBar } from '@ohos/common/CommonComponents'; 26 27const TAG: string = 'timeline_TimelinePageActionBar'; 28 29@Component 30export struct TimelinePageActionBar { 31 @Consume isEmpty: boolean; 32 @Consume @Watch('updateActionBarProp') isSelectedMode: boolean; 33 @Consume @Watch('updateActionBarProp') isAllSelected: boolean; 34 @Link @Watch('updateActionBarProp') totalSelectedCount: number; 35 @Provide selectedCount: number = 0; 36 @Consume @Watch('updatePlaceholderStatus') isShowSideBar: boolean; 37 onMenuClicked: Function = (): void => {}; 38 @StorageLink('isHorizontal') @Watch('updateActionBarProp') isHorizontal: boolean 39 = ScreenManager.getInstance().isHorizontal(); 40 @StorageLink('isSidebar') isSidebar: boolean = ScreenManager.getInstance().isSidebar(); 41 @State actionBarProp: ActionBarProp = new ActionBarProp(); 42 @StorageLink('statusBarHeight') statusBarHeight: number = 0; 43 @State isNeedPlaceholder: boolean = true; 44 @Consume moreMenuList: Action[]; 45 @StorageLink('deviceType') deviceType: string | undefined = AppStorage.get<string>('deviceType') ; 46 private actionBarPaddingTop: number | Resource = 0; 47 48 aboutToAppear(): void { 49 if (this.deviceType === Constants.PC_DEVICE_TYPE) { 50 this.actionBarPaddingTop = $r('app.float.album_set_page_action_bar_padding_top'); 51 } else if (this.deviceType === Constants.PAD_DEVICE_TYPE) { 52 this.actionBarPaddingTop = 0 53 } else { 54 this.actionBarPaddingTop = px2vp(this.statusBarHeight) 55 } 56 this.updateActionBarProp(); 57 this.updatePlaceholderStatus(); 58 } 59 60 updatePlaceholderStatus(): void { 61 if (this.deviceType !== Constants.PC_DEVICE_TYPE) { 62 this.isNeedPlaceholder = false; 63 } else { 64 this.isNeedPlaceholder = this.isShowSideBar ? false : true 65 } 66 } 67 68 updateActionBarProp(): void { 69 this.selectedCount = this.totalSelectedCount; 70 if (this.isHorizontal) { 71 this.actionBarProp = this.createHorizontalActionBar(); 72 } else { 73 this.actionBarProp = this.createActionBar(); 74 } 75 } 76 77 build() { 78 Column() { 79 ActionBar({ 80 actionBarProp: $actionBarProp, 81 onMenuClicked: this.onMenuClicked, 82 isNeedPlaceholder: this.isNeedPlaceholder 83 }) 84 } 85 .padding({ 86 top: this.deviceType === Constants.DEFAULT_DEVICE_TYPE ? px2vp(this.statusBarHeight) : this.actionBarPaddingTop 87 }) 88 } 89 90 private createHorizontalActionBar(): ActionBarProp { 91 let menuList: Array<Action> = new Array<Action>(); 92 let actionBarProp: ActionBarProp = new ActionBarProp(); 93 if (!this.isEmpty && this.deviceType === Constants.PC_DEVICE_TYPE) { 94 menuList.push(Action.MULTISELECT); 95 } 96 actionBarProp 97 .setHasTabBar(true) 98 .setTitle($r('app.string.tab_timeline')) 99 .setIsHeadTitle(true) 100 .setMenuList(menuList) 101 .setBackgroundColor($r('app.color.transparent')) 102 .setMode(ActionBarMode.STANDARD_MODE); 103 Log.info(TAG, `createActionBar, isSelectedMode: ${this.isSelectedMode}`); 104 if (this.isSelectedMode) { 105 menuList = new Array<Action>(); 106 menuList.push((this.isAllSelected ? Action.DESELECT_ALL : Action.SELECT_ALL), 107 Boolean(this.selectedCount) ? Action.DELETE : Action.DELETE_INVALID, Action.MORE); 108 actionBarProp 109 .setLeftAction(Action.CANCEL) 110 .setMenuList(menuList) 111 .setMode(ActionBarMode.SELECTION_MODE) 112 .setSelectionMode(ActionBarSelectionMode.MULTI); 113 } 114 return actionBarProp; 115 } 116 117 private createActionBar(): ActionBarProp { 118 let menuList: Array<Action> = new Array<Action>(); 119 let actionBarProp: ActionBarProp = new ActionBarProp(); 120 actionBarProp 121 .setHasTabBar(this.isSidebar) 122 .setTitle($r('app.string.tab_timeline')) 123 .setIsHeadTitle(true) 124 .setMode(ActionBarMode.STANDARD_MODE); 125 Log.info(TAG, `createActionBar, isSelectedMode: ${this.isSelectedMode}`); 126 if (this.isSelectedMode) { 127 actionBarProp 128 .setLeftAction(Action.CANCEL) 129 .setMenuList(menuList) 130 .setMode(ActionBarMode.SELECTION_MODE) 131 .setSelectionMode(ActionBarSelectionMode.MULTI); 132 } 133 return actionBarProp; 134 } 135}