WonderfulDemo/entry/src/main/ets/pages/Index.ets

import {componentLocation} from  '../model/ComponentLocation'
import { TitleStateComp } from '../common/component/TitleStateComp';
import { BottomOperateComp } from '../common/component/BottomOperateComp';
import router from '@ohos.router'
import { TaskComp } from '../common/component/TaskComp'
import {  Warehousing}from  '../common/component/Warehousing'
import { SmartFactoryCard }from  '../common/component/SmartFactoryCard'
import CommonConstants from '../common/constants/CommonConstants'
import UniversalCard from  '../model/UniversalCard'
@CustomDialog
struct login {
  @Link textValue: string
  @Link inputValue: string
  controller: CustomDialogController
  cancel: () => void
  confirm: () => void
  build() {
    Column() {
      Text('退出登录')
        .textAlign(TextAlign.Center)
        .fontColor('#e6000000')
        .fontSize(px2vp(53))
        .fontWeight(FontWeight.Medium)
        .width('100%')
        .height('30%')
      Text('是否返回登录页?')
        .textAlign(TextAlign.Center)
        .width('100%')
        .height('30%')
      Row({space:10}){
        Text('取消')
          .width('40%')
          .borderRadius(21)
          .height('70%')
          .textAlign(TextAlign.Center)
          .backgroundColor('#0f000000')
          .fontColor('#0A59F7')
          .onClick(()=>{
            this.controller.close()
          })
        Text('确认')
          .width('40%')
          .height('70%')
          .borderRadius(21)
          .backgroundColor('#0A59F7')
          .textAlign(TextAlign.Center)
          .fontColor('#ffff')
          .onClick(()=>{
            this.controller.close()
          })
      }
      .width('100%')
      .justifyContent(FlexAlign.Center)
      .height('30%')


    }.width('25%')
    .height('20%')
    .borderRadius(15)
    .backgroundColor('#ffff')
  }
}
@CustomDialog
struct confirmPopup {
  @Link cardServices:UniversalCard[]
  controller: CustomDialogController
  cancel: () => void
  confirm: () => void
  @Link x: number
  @Link  y: number
  @Link index:number
  build(){
    Column(){
      Column(){
        Row(){
          Image($r('app.media.card'))
            .width(px2vp(50))
            .height(px2vp(50))
          Text('卡片服务')
            .padding({left:10})
            .margin(px2vp(5))
            .width('100%')
            .fontWeight(FontWeight.Medium)
            .fontSize(px2vp(38))
            .textAlign(TextAlign.Start)
            .onClick(()=>{
              this.controller.close()
              this.cardServices[this.index]= {
                id:this.cardServices[this.index].id,
                userId:this.cardServices[this.index].userId,
                cardType:this.cardServices[this.index].cardType,
                cardStatus:1,
                cardSort:this.cardServices[this.index].cardSort,
              }
            })

        }.width('100%')
        .height('80%')
        .padding({left:10})
        .borderRadius(px2vp(15))
        .backgroundColor($r('app.color.general_font_white_color'))
        Divider()
          .width('80%')

      }
      .margin({bottom:5})
      .borderRadius(px2vp(15))
      .height('20%')
      .width('120%')
      .backgroundColor($r('app.color.general_font_white_color'))


      Image(this.index===1?$r("app.media.processImages"):$r('app.media.storage'))
        .width(px2vp(220))
        .height(px2vp(220))
        .borderRadius(15)
    }
    .alignItems(HorizontalAlign.Start)
    .width('350px')
    .height('600px')
    .offset({x:this.x+20+'px', y:this.y-340+'px'})
  }
}
@CustomDialog
struct shutdown {
  @Link shutdownTransparency:number
  @Link textValue: string
  @Link inputValue: string
  controller: CustomDialogController
  cancel: () => void
  confirm: () => void
  build() {
    Column() {
      Row(){
        Image($r('app.media.restart'))
          .width(px2vp(107))
          .height(px2vp(107))
          .onClick(()=>{
            this.shutdownTransparency=0
            this.controller.close()
          })
        Blank()
        Image($r('app.media.shutdown'))
          .width(px2vp(107))
          .height(px2vp(107))
          .onClick(()=>{
            this.shutdownTransparency=0
            this.controller.close()
          })

      }.width('100%')
      .height('50%')
      Row(){
        Text('重启')
          .fontWeight(FontWeight.Medium)
          .fontSize(px2vp(27))
          .width(px2vp(107))
          .height(px2vp(107))
          .textAlign(TextAlign.Center)
          .fontColor('#FFFFFF')

        Blank()
        Text('关机')
          .fontWeight(FontWeight.Medium)
          .fontSize(px2vp(27))
          .width(px2vp(107))
          .textAlign(TextAlign.Center)
          .height(px2vp(107))
          .fontColor('#FFFFFF')

      }.width('100%')
      .height('30%')


    }.width('20%')
    .height('20%')
    .borderRadius(15)

  }
}
@Entry
@Component
struct Index {
  @State index:number=0
  @State x:number=0
  @State y:number=0
  @State cardServices:UniversalCard[] = CommonConstants.Card_DATA
  @State  SmartFactoryCardDelete:number=0
  @State SmartFactoryDelete:number=0
  @State  SmartFactoryCarLongPressDelete:number=0
  @State storageCardDelete:number=0
  @State smartWarehouseCard:number=0
  @State avatarFrame:boolean=false
  @State deleteConfirmation:number=0
  @State longPressDelete:number=0
  scroller: Scroller = new Scroller()
  @State shutdownTransparency:number=0
  @State YanSe: number = 0
  @State carswitch:number=0
  private isHomePage: boolean = true
  @State textValue: string = ''
  @State inputValue: string = ''
  loginDialogController: CustomDialogController = new CustomDialogController({
    builder:login({
      textValue: $textValue,
      inputValue: $inputValue,
    }),
    alignment: DialogAlignment.Center,
    autoCancel:false,
    customStyle:true
  })
  shutdownDialogController: CustomDialogController = new CustomDialogController({
    builder:shutdown({
      textValue: $textValue,
      inputValue: $inputValue,
      shutdownTransparency:this.shutdownTransparency
    }),
    alignment: DialogAlignment.Center,
    autoCancel:false,
    customStyle:true
  })
  confirmPopupDialogController: CustomDialogController = new CustomDialogController({
    builder: confirmPopup({
      x:this.x,
      y:this.y,
      index:this.index,
      cardServices:this.cardServices
    }
      ),
    alignment: DialogAlignment.TopStart,
    autoCancel:true,
    customStyle:true,
  })
  build() {
    Stack(){
      Row() {
        Column() {
          TitleStateComp({ isHomePage: this.isHomePage })
            .onClick(()=>{
              this.avatarFrame=!this.avatarFrame
            })
          Row() {

            Flex({ wrap: FlexWrap.Wrap }) {
              if (this.cardServices[1].cardStatus===1){
                Stack(){
                  Column(){
                    TaskComp({isHomePage: this.isHomePage})
                    Text('生产操作')
                      .fontSize(px2vp(27))
                      .margin({top:5})
                      .fontWeight(FontWeight.Medium)
                      .fontColor($r('app.color.robot_set_card_white'))
                  }
                  .height('40%')
                  .width('32%')
                  .gesture(
                    LongPressGesture({ repeat: false })
                      .onActionEnd(() => {
                        this.deleteConfirmation=1
                      })
                  )
                  if (this.deleteConfirmation===1){
                    Row(){
                      Text('取消')
                        .fontWeight(FontWeight.Medium)
                        .fontSize(px2vp(27))
                        .textAlign(TextAlign.Center)
                        .width('20%')
                        .height('20%')
                        .margin(10)
                        .borderRadius(px2vp(21))
                        .fontColor($r('app.color.robot_set_card_blue'))
                        .backgroundColor($r('app.color.general_font_white_color'))
                        .onClick(()=>{
                          this.deleteConfirmation=0
                        })
                      Text('删除')
                        .fontWeight(FontWeight.Medium)
                        .fontSize(px2vp(27))
                        .width('20%')
                        .margin(10)
                        .fontColor($r('app.color.general_font_white_color'))
                        .borderRadius(px2vp(21))
                        .height('20%')
                        .textAlign(TextAlign.Center)
                        .backgroundColor(  $r('app.color.robot_set_card_blue'))
                        .onClick(()=>{
                          this.deleteConfirmation=0
                          this.cardServices[1]= {
                            id:this.cardServices[1].id,
                            userId:this.cardServices[1].userId,
                            cardType:this.cardServices[1].cardType,
                            cardStatus:2,
                            cardSort:this.cardServices[1].cardSort,
                          }
                        })
                    }
                    .justifyContent(FlexAlign.Center)
                    .height('40%')
                    .width('32%')
                  }

                }

              }
              if (this.cardServices[0].cardStatus===1){
                Stack(){
                  Column(){
                    Warehousing()
                    Text('智能仓储')
                      .margin({top:5})
                      .fontSize(px2vp(27))
                      .fontWeight(FontWeight.Medium)
                      .fontColor($r('app.color.robot_set_card_white'))
                  }
                  .height('40%')
                  .width('32%')
                  .margin({left:10})
                  .onClick(()=>{
                    router.pushUrl({
                      url:'pages/Storage'
                    })
                  })
                  .gesture(
                    LongPressGesture({ repeat: false })
                      .onActionEnd(() => {
                        this.smartWarehouseCard=1
                      })
                  )
                  if (this.smartWarehouseCard===1){
                    Row(){
                      Text('取消')
                        .fontWeight(FontWeight.Medium)
                        .fontSize(px2vp(27))
                        .textAlign(TextAlign.Center)
                        .width('20%')
                        .height('20%')
                        .margin(10)
                        .borderRadius(px2vp(21))
                        .fontColor($r('app.color.robot_set_card_blue'))
                        .backgroundColor($r('app.color.general_font_white_color'))
                        .onClick(()=>{
                          this.smartWarehouseCard=0
                        })
                      Text('删除')
                        .fontWeight(FontWeight.Medium)
                        .fontSize(px2vp(27))
                        .width('20%')
                        .margin(10)
                        .fontColor($r('app.color.general_font_white_color'))
                        .borderRadius(px2vp(21))
                        .height('20%')
                        .textAlign(TextAlign.Center)
                        .backgroundColor(  $r('app.color.robot_set_card_blue'))
                        .onClick(()=>{
                          this.smartWarehouseCard=0
                          this.cardServices[0]= {
                            id:this.cardServices[0].id,
                            userId:this.cardServices[0].userId,
                            cardType:this.cardServices[0].cardType,
                            cardStatus:2,
                            cardSort:this.cardServices[0].cardSort,
                          }
                        })
                    }
                    .justifyContent(FlexAlign.Center)
                    .height('40%')
                    .width('32%')
                  }
                }
              }
              if (this.SmartFactoryCardDelete===0){
                Stack(){
                  Column(){
                    SmartFactoryCard()
                    Text('智汇工厂')
                      .margin({top:5})
                      .fontSize(px2vp(27))
                      .fontWeight(FontWeight.Medium)
                      .fontColor($r('app.color.robot_set_card_white'))
                  }
                  .height('40%')
                  .width('32%')
                  .margin({left:10})
                  .onClick(()=>{
                    router.pushUrl({
                      url:'pages/SmartFactory'
                    })
                  })
                  .gesture(
                    LongPressGesture({ repeat: false })
                      .onActionEnd(() => {
                        this.SmartFactoryCarLongPressDelete=1
                      })
                  )
                  if (this.SmartFactoryCarLongPressDelete===1){
                    Row(){
                      Text('取消')
                        .fontWeight(FontWeight.Medium)
                        .fontSize(px2vp(27))
                        .textAlign(TextAlign.Center)
                        .width('20%')
                        .height('20%')
                        .margin(10)
                        .borderRadius(px2vp(21))
                        .fontColor($r('app.color.robot_set_card_blue'))
                        .backgroundColor($r('app.color.general_font_white_color'))
                        .onClick(()=>{
                          this.SmartFactoryCarLongPressDelete=0
                        })
                      Text('删除')
                        .fontWeight(FontWeight.Medium)
                        .fontSize(px2vp(27))
                        .width('20%')
                        .margin(10)
                        .fontColor($r('app.color.general_font_white_color'))
                        .borderRadius(px2vp(21))
                        .height('20%')
                        .textAlign(TextAlign.Center)
                        .backgroundColor(  $r('app.color.robot_set_card_blue'))
                        .onClick(()=>{
                          this.SmartFactoryCarLongPressDelete=0
                          this.SmartFactoryCardDelete=1
                        })
                    }
                    .justifyContent(FlexAlign.Center)
                    .height('40%')
                    .width('32%')
                  }
                }
              }

            }
            .width('100%')
            .height('100%')
          }
          .justifyContent(FlexAlign.Center)
          .width('100%')
          .height('68%')
          Row({ space: 10 }) {
            Text().width('1%')
            Column({ space: 10 }) {
              Image($r("app.media.shezhi"))
                .width('60%')
                .height('60%')
                .margin({top:5})
              Text('设置')
                .width('100%')
                .textAlign(TextAlign.Center)
                .fontSize(16)
                .fontColor('#ffff')
            }
            .width('10%')
            .justifyContent(FlexAlign.Center)
            .backdropBlur(13)
            .height('90%')
            .borderRadius(15)
            .backgroundColor('#4d000000')
            .onClick(() => {
              router.pushUrl({
                url: 'pages/SetPage'
              })
            })
            Column({ space: 10 }) {
              Image($r("app.media.storage"))
                .width('60%')
                .height('60%')
                .margin({top:5})
              Text('智能仓储')
                .width('100%')
                .textAlign(TextAlign.Center)
                .fontSize(16)
                .fontColor('#ffff')
            }
            .width('10%')
            .justifyContent(FlexAlign.Center)
            .height('90%')
            .borderRadius(15)
            .backgroundColor('#4d000000')
            .id('smartWarehousing')
            .onClick(() => {

              router.pushUrl({
                url: 'pages/Storage'
              })
            })
            .gesture(
              LongPressGesture({ repeat: false })
                .onActionEnd(() => {
                  let rect = componentLocation.getComponentRect('smartWarehousing')
                  let touchPoint: TouchObject = {
                    id: 1,
                    x: rect.left, // 组件中心点x坐标
                    y:rect.bottom, // 组件中心点y坐标
                    type: TouchType.Down,
                    screenX: rect.left + (rect.right - rect.left) / 2, // 组件中心点x坐标
                    screenY: rect.left + (rect.right - rect.left) / 2, // 组件中心点y坐标
                  }
                  this.x=touchPoint.x
                  this.y=touchPoint.y
                  this.index=0
                  this.confirmPopupDialogController.open()

                })
            )
            Column({ space: 10 }) {
              Image($r('app.media.jiqiren'))
                .width('60%')
                .height('60%')
                .margin({top:5})
              Text('机器人调试')
                .width('100%')
                .textAlign(TextAlign.Center)
                .fontSize(16)
                .fontColor('#ffff')
            }
            .width('10%')
            .justifyContent(FlexAlign.Center)
            .height('90%')
            .borderRadius(15)
            .backgroundColor('#4d000000')
            .onClick(() => {
              router.pushUrl({
                url: 'pages/RobotDebug'
              })
            })

            Column({ space: 10 }) {
              Image($r("app.media.processImages"))
                .width('60%')
                .height('60%')
                .margin({top:5})
              Text('工序操作')
                .width('100%')
                .textAlign(TextAlign.Center)
                .fontSize(16)
                .fontColor('#ffff')

            }
            .width('10%')
            .justifyContent(FlexAlign.Center)
            .height('90%')
            .borderRadius(15)
            .id('workingProcedure')
            .backgroundColor('#4d000000')
            .onClick(() => {
              router.pushUrl({
                url: 'pages/process/ProcessHome'
              })
            })
            .gesture(
              LongPressGesture({ repeat: false })
                .onActionEnd(() => {
                  let rect = componentLocation.getComponentRect('workingProcedure')
                  let touchPoint: TouchObject = {
                    id: 1,
                    x: rect.left, // 组件中心点x坐标
                    y:rect.bottom, // 组件中心点y坐标
                    type: TouchType.Down,
                    screenX: rect.left + (rect.right - rect.left) / 2, // 组件中心点x坐标
                    screenY: rect.left + (rect.right - rect.left) / 2, // 组件中心点y坐标
                  }
                  this.x=touchPoint.x
                  this.y=touchPoint.y
                  this.index=1
                  this.confirmPopupDialogController.open()
                })
            )

            Column({ space: 10 }) {
              Image($r('app.media.baobiao'))
                .width('60%')
                .height('60%')
                .margin({top:5})
              Text('统计报表')
                .width('100%')
                .textAlign(TextAlign.Center)
                .fontSize(16)
                .fontColor('#ffff')

            }
            .width('10%')
            .justifyContent(FlexAlign.Center)
            .height('90%')
            .borderRadius(15)
            .backgroundColor('#4d000000')
          }
          .width('100%')
          .height('16%')
          BottomOperateComp({ isHomePage: this.isHomePage,
          }
          )
        }
        .backgroundImage($r('app.media.BG'))
        .backgroundImageSize({ width: '100%', height: '100%' })
        .width('100%')
        .height('100%')
      }
      .height('100%')
      .width('100%')
      if (this.avatarFrame){
        Column(){
          Text('个人设置')
            .height('33%')
            .fontSize(px2vp(32))
            .fontWeight(FontWeight.Medium)
            .fontColor('#e6000000')
          Divider()
          Text('退出登录')
            .height('33%')
            .fontSize(px2vp(32))
            .fontWeight(FontWeight.Medium)
            .fontColor('#e6000000')
            .onClick(()=>{
              this.loginDialogController.open()
            })
          Divider()
          Text('开关/重启')
            .height('33%')
            .fontSize(px2vp(32))
            .fontWeight(FontWeight.Medium)
            .fontColor('#e6000000')
            .onClick(()=>{
              this.shutdownTransparency=1
              this.shutdownDialogController.open()
              this.avatarFrame=!this.avatarFrame
            })

        }.width('15%')
        .height('25%')
        .backgroundColor('#ffff')
        .margin({top:'4%',right:'1%'})
        .borderRadius(21)
      }
      if (this.shutdownTransparency===1){
        Column(){

        }.width('100%')
        .backgroundColor('#cc000000')
        .height('100%')
        //.opacity(0.8)
        .blur(30)
      }
    }
    .alignContent(Alignment.TopEnd)
    .height('100%')
    .width('100%')

  }
  // 动画效果
  pageTransition() {
    // 设置1ms是为了使延时生效
    PageTransitionEnter({ duration: 1, curve: Curve.Linear, delay: 400 })
      .scale({
        x: 0,
        y: 0,
        z: 0,
        centerX: '50%',
        centerY: '50%'
      })
    PageTransitionExit({ duration: 0, curve: Curve.Linear })
  }
}