import { HMRouter, HMRouterMgr } from "@hadss/hmrouter";
import { ToastUtil } from "@pura/harmony-utils/src/main/ets/action/ToastUtil";
import { BASE_IMAGE_URL } from "../../app/AppCache";
import AppConstants from "../../app/AppConstant";
import { MainMessageBean } from "../../model/resultModel/MessageResultModel";
import { cardRoundBorderStyle } from "../../style/BorderStyle";
import { StringUtils } from "../../util/StringUtils";
import { BaseTopBar } from "../custom/BaseTopTar";
import { createWaterMark } from "../custom/Watermark";

@Component
@HMRouter({ pageUrl: 'MessageDetailsPage' })
export struct MessageDetailsPage {
  @State param: MainMessageBean | undefined = undefined

  aboutToAppear(): void {
    this.param = HMRouterMgr.getCurrentParam() as MainMessageBean;
    if (!this.param) {
      ToastUtil.showToast('参数错误！')
      HMRouterMgr.pop()
      return
    }
  }

  build() {
    Column() {
      BaseTopBar({
        title: $r('app.string.title_msg_details')
      })

      Scroll() {
        Column() {
          Text(this.param!.msgTitle)
            .fontColor($r('app.color.colorGrey8'))
            .fontSize($r('app.float.text_size_18'))
            .textAlign(TextAlign.Start)
            .align(Alignment.Center)
            .fontWeight(FontWeight.Bold)
            .width(AppConstants.PERCENTAGE_MAX)
            .height('auto')

          Row() {
            Image(BASE_IMAGE_URL + this.param!.appIcon)
              .width($r('app.float.default_24'))
              .height($r('app.float.default_24'))

            Text(this.param!.appName)
              .fontColor($r('app.color.colorBluen7'))
              .fontSize($r('app.float.text_size_16'))
              .textAlign(TextAlign.Start)
              .fontWeight(FontWeight.Bold)
              .width(AppConstants.PERCENTAGE_MAX)
              .height('auto')
              .margin({ left: $r('app.float.default_5') })
          }
          .width(AppConstants.PERCENTAGE_MAX)
          .alignItems(VerticalAlign.Center)
          .justifyContent(FlexAlign.Start)
          .margin({ top: $r('app.float.default_10'), bottom: $r('app.float.default_10') })

          Divider()
            .width(AppConstants.PERCENTAGE_MAX)
            .height($r('app.float.default_1'))
            .backgroundColor($r('app.color.colorGrey1'))

          Text("\t\t"+StringUtils.get(this.param!.msgContent, '暂无内容'))
            .fontColor($r('app.color.colorGrey8'))
            .fontSize($r('app.float.text_size_16'))
            .textAlign(TextAlign.Start)
            .align(Alignment.TopStart)
            .fontWeight(FontWeight.Normal)
            .width(AppConstants.PERCENTAGE_MAX)
            .layoutWeight(1)
            .margin({ top: $r('app.float.default_10'),bottom: $r('app.float.default_10') })

          Text(this.param!.sendingTime)
            .fontColor($r('app.color.colorGrey8'))
            .fontSize($r('app.float.text_size_14'))
            .textAlign(TextAlign.End)
            .width(AppConstants.PERCENTAGE_MAX)
        }
        .width(AppConstants.PERCENTAGE_MAX)
        .height(AppConstants.PERCENTAGE_MAX)
        .backgroundColor($r('app.color.white'))
        .padding($r('app.float.default_10'))
        .border(cardRoundBorderStyle)
      }
      .width(AppConstants.PERCENTAGE_MAX)
      .layoutWeight(1)
      .padding($r('app.float.default_15'))

    }
    .width(AppConstants.PERCENTAGE_MAX)
    .height(AppConstants.PERCENTAGE_MAX)
    .backgroundColor($r('app.color.page_background'))
    .overlay(createWaterMark())

  }
}