import { TitleGroup } from "../LayoutInterface/Interface/GroupInterface";
import { TitleButton } from "../LayoutInterface/Interface/ButtonInterface";
import { ExecuteCommand } from "../EventSubWin/ExCom";
import { mwInfo } from "../AppStorageV2Class";
import { BaseMenuData } from "../LayoutInterface/Interface/MenuInterface";


//按钮统一尺寸,该按钮为正方形,所以以主窗口宽为基准,长=高->正方形
let ebWidth=mwInfo.mWinWidth*0.02;
let ebHeigth=mwInfo.mWinWidth*0.02;

@Builder
export function BaseMenu(indexMenu:BaseMenuData) {
  Menu() {
    ForEach(indexMenu.aMenus, (item: TitleButton|Array<TitleButton>, index: number) => {
      //如果是功能组则
      if(Array.isArray(item)){
        MenuItem({
          startIcon: $r('app.media.' + item[0].eIcon),
          content: item[0].eName,
          builder: SubMenu(item)
        })
      }else{
        MenuItem({ startIcon: $r('app.media.'+item.eIcon), content: item.eName })
          .onClick(()=> {
            ExecuteCommand(item as TitleButton);
          })
          .size({height: ebWidth})
      }
    })
  }.fontSize(20)
}

@Builder
export function SubMenu(subMenu:Array<TitleButton>){
  Menu() {
    ForEach(subMenu, (subItem: TitleButton, index: number) => {
      MenuItem({
        startIcon: $r('app.media.' + subItem.eIcon),
        content: subItem.eName,
      })
        .onClick(() => {
          ExecuteCommand(subItem as TitleButton);
        })
        .size({ height: ebWidth })
    })
  }.fontSize(20)
}

//菜单按钮
//主要用于功能组操作菜单.文件下拉菜单等.
@ComponentV2
export struct GroupTextEventMenu {
  @Param grpEvent: TitleGroup | undefined = undefined;
  @Local argsMenu:BaseMenuData= {
    aMenus: this.grpEvent?.grpMenu as Array<TitleButton|Array<TitleButton>>,
    aIndex: 0
  };
  build() {
    Row() {
      if (this.grpEvent != undefined) {
        //功能组名文本
        Blank().width('auto')
        Text(this.grpEvent.grpName)
          .fontSize(16)
          .fontColor(Color.Gray)
        Blank().width('auto')
        Button()
          .height(mwInfo.mWinWidth*0.005)
          .width(mwInfo.mWinWidth*0.005)
          .padding(1)
          .backgroundImage($r('app.media.base_seetings'))
          .backgroundImagePosition({ x: '5%', y: '5%' })
          .backgroundImageSize({
            width: '90%', // 图片宽度占满按钮
            height: '90%' // 图片高度占满按钮
          })
          .bindMenu(BaseMenu(this.argsMenu))
          .backgroundColor(Color.Transparent)
      }
    }.align(Alignment.BottomEnd)
  }
}