import { TitleMenu } from "../LayoutInterface/Interface/MenuInterface";
import { TitleGroup } from "../LayoutInterface/Interface/GroupInterface";
import { TitleButton } from "../LayoutInterface/Interface/ButtonInterface";
import { EventBtn } from "./Button";
import { ExecuteCommand } from "../EventSubWindow/ExecuteCommand";
import { AppStorageV2 } from "@kit.ArkUI";
import { MainWindowInfo } from "../AppStorageV2Class";


//菜单按钮
//主要用于功能组操作菜单.文件下拉菜单等.
@ComponentV2
export struct GroupTextEventMenu {
  @Local mwInfo: MainWindowInfo = AppStorageV2.connect<MainWindowInfo>(MainWindowInfo, () => new MainWindowInfo())!;
  @Param grpEvent: TitleGroup | undefined = undefined;

  @Builder
  GroupMenu(menus: Array<TitleMenu>) {
    ForEach(menus, (item: TitleMenu, index: number) => {
      MenuItem({ startIcon: $r('app.media.' + item.mIcon), content: item.mName })
        .width('auto')
        .margin({
          top: 0,
          left: 0,
          bottom: 0,
          right: 0
        })
    })
  }

  build() {
    Row() {
      if (this.grpEvent != undefined) {
        //功能组名文本
        Blank().width('auto')
        Text(this.grpEvent.grpName)
          .fontSize(16)
          .fontColor(Color.Gray)
        Blank().width('auto')
        Button()
          .height(this.mwInfo.mainWindowWidth*0.01)
          .width(this.mwInfo.mainWindowWidth*0.01)
          .padding(1)
          .backgroundImage($r('app.media.base_seetings'))
          .backgroundImagePosition({ x: '5%', y: '5%' })
          .backgroundImageSize({
            width: '90%', // 图片宽度占满按钮
            height: '90%' // 图片高度占满按钮
          })
          .bindMenu(this.GroupMenu(this.grpEvent.grpMenu))
          .backgroundColor('#F8F9FA')
      }
    }.align(Alignment.BottomEnd)
  }
}

//菜单目录按钮
//功能目录菜单,主要用于针对单一按钮多个功能形式
@ComponentV2
export struct MenuBtn {
  @Local mwInfo: MainWindowInfo = AppStorageV2.connect<MainWindowInfo>(MainWindowInfo, () => new MainWindowInfo())!;
  @Param menuBtn: Array<TitleButton> | undefined = undefined;
  @Param iconState: boolean = false;
  @Local curtIndex:number=0;
  @Builder
  EventMenu() {
    Menu() {
      ForEach(this.menuBtn, (item: TitleButton, index: number) => {
        MenuItem({ startIcon: $r('app.media.' + item.eIcon), content: item.eName })
          .margin({
            top: 0,
            left: 0,
            bottom: 0,
            right: 0
          })
          .onClick(()=>{
             this.curtIndex=index;
             ExecuteCommand(item as TitleButton);
          })
      })
    }
  }

  build() {
    Column({ space: 0 }) {
      if (this.menuBtn != undefined) {
        Button()
          .bindMenu(this.EventMenu)
          .width(this.mwInfo.mainWindowWidth*0.02)
          .height(this.mwInfo.mainWindowWidth*0.02)
          .backgroundImage($r('app.media.' + this.menuBtn[this.curtIndex].eIcon))
          .backgroundImagePosition({ x: '5%', y: '5%' })
          .backgroundColor('#F8F9FA')
          .backgroundImageSize({
            width: '90%', // 图片宽度占满按钮
            height: '90%' // 图片高度占满按钮
          })
        Button()
          .type(ButtonType.Normal)
          .bindMenu(this.EventMenu)
          .width(this.mwInfo.mainWindowWidth*0.02)
          .height(this.mwInfo.mainWindowWidth*0.005)
          .backgroundImage($r('app.media.base_chevron_down'))
          .backgroundImagePosition({ x: '35%', y: '0%' })
          .backgroundColor('#F8F9FA')

        Text(this.menuBtn[this.curtIndex].eName)
          .fontSize(16)
          .width('auto')
          .height(this.mwInfo.mainWindowWidth*0.005)
          .textAlign(TextAlign.Center)
      }
    }.padding(1)
  }
}