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";


//菜单按钮
//主要用于功能组操作菜单.文件下拉菜单等.
@ComponentV2
export struct GroupTextEventMenu {
  @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(8)
          .fontColor(Color.Gray)
        Blank().width('auto')
        Button()
          .height(15)
          .width(15)
          .padding(1)
          .backgroundImage($r('app.media.base_seetings'))
          .backgroundImagePosition({ x: '10%', y: '10%' })
          .backgroundImageSize({
            width: '80%', // 图片宽度占满按钮
            height: '80%' // 图片高度占满按钮
          })
          .bindMenu(this.GroupMenu(this.grpEvent.grpMenu))
          .backgroundColor(Color.Transparent)
      }
    }.align(Alignment.BottomEnd)
  }
}

//菜单目录按钮
//功能目录菜单,主要用于针对单一按钮多个功能形式
@ComponentV2
export struct MenuBtn {
  @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 })
          .width('auto')
          .margin({
            top: 0,
            left: 0,
            bottom: 0,
            right: 0
          })
          .onClick(()=>{
             this.curtIndex=index;
             ExecuteCommand(item as TitleButton);
          })
      })
    }
  }

  build() {
    Column({ space: 2 }) {
      if (this.menuBtn != undefined) {
        Button()
          .bindMenu(this.EventMenu)
          .width('35vp')
          .height('35vp')
          .backgroundImage($r('app.media.' + this.menuBtn[this.curtIndex].eIcon))
          .backgroundImagePosition({ x: '10%', y: '10%' })
          .backgroundColor(Color.Transparent)
          .backgroundImageSize({
            width: '80%', // 图片宽度占满按钮
            height: '80%' // 图片高度占满按钮
          })
        Button()
          .bindMenu(this.EventMenu)
          .width('50vp')
          .height('7vp')
          .backgroundImage($r('app.media.base_chevron_down'))
          .backgroundImagePosition({ x: '35%', y: '-50%' })
          .backgroundColor(Color.Transparent)
        Text(this.menuBtn[this.curtIndex].eName)
          .fontSize('8fp')
          .width('50vp')
          .height('10vp')
          .textAlign(TextAlign.Center)

      }
    }
    .height('50vp')
    .width('50vp')
    .padding('1vp')
  }
}