import router from '@ohos.router';
import { getCurrentTime } from '../../common/utils/tools';
import imageBtn from '../compontents/imageBtn';

@Component
export default struct TopLogo {
  @State ratio: number = 850 / 960
  @State timeText: string = '';
  @Link outFlag: boolean; //返回按钮触发
  private timer: any = null;
  private vocObj = null;

  constructor() {
    super()
  }

  build() {
    Column() {
      Column() {
      }
      .backgroundColor('#333230')
      .width('100%')
      .height('10%')

      Row() {
        Row() {
          Image($r('app.media.shortLogo'))
            .width('10.2%')
            .height('5.7%')
            .margin({ left: 30 * this.ratio, top: -15 * this.ratio })
          Text(this.timeText)
            .fontSize(30 * this.ratio)
            .fontColor('#CCB48F')
            .margin({ top: -15 * this.ratio, left: 14 * this.ratio }) //fontsize40
        }

        imageBtn({ btnWidth: '16.7%', btnHeight: '12.2%', imgSrc: $r('app.media.topB_back') })
          .onClick(() => {
            // this.vocObj.playAudio({
            //   type: 1,
            //   name: 'button_media.wav'
            // })
            this.outFlag = true
            router.back()
          })
      }
      .position({ x: 0, y: 0 })
      .width('100%')
      .justifyContent(FlexAlign.SpaceBetween)
    }
    .width('100%')
  }

  async aboutToAppear() {
    this.timeText = await getCurrentTime();
    this.timer = setInterval(async () => {
      this.timeText = await getCurrentTime();
    }, 1000)
    // this.vocObj = new voiceService(async (status,val) => {
    //   if (status == 'idle') {
    //     router.back()
    //   }
    // });
  }

  aboutToDisappear() {
    clearInterval(this.timer)
    console.log('jiangsong: topLogo aboutToDisappear222222222')
  }
}