subject-two/entry/src/main/ets/pages/compontents/judge/RealTime.ets

import apiJudgeSdk from 'libJudgeSdk.so';
import Judge from '../../judgeSDK/utils/judgeReal';
import { MarkRule, Project, ProjectObj } from '../../judgeSDK/api/judgeSDK.d';
import common from '@ohos.app.ability.common';
import {
  examJudgeMapSetScaling
} from '../../judgeSDK/api'

interface RoadDataType {
  name: string,
  key: string | string[]
}

@Component
export default struct RealTime {
  @State message: string = '开始绘制'
  // 控制XComponent组件的创建和销毁
  @State draw: boolean = false
  //监管接口序列号
  @State serialNumber: number = 0
  //模拟考试项目
  @State projects: Project[] = []
  @State projectsObj: ProjectObj = {}
  @State markRuleListObj: MarkRule = {}
  @State scaleNum: number = 100
  @State gpsActive: number = 1
  private widthNumber: string | number | Resource = 0
  private heightNumber: string | number | Resource = 0
  private context = getContext(this) as common.UIAbilityContext;
  @State ratio: number = 1
  @State lane: Object = {}
  @State timer:number = 0

  constructor() {
    super()
  }

  // xcomponentController: XComponentController = new XComponentController()

  build() {
    Row() {
      Column() {
        Row() {
          Text('车道信息').fontColor(this.gpsActive == 0 ? '#2D3C5A' : '#fff').fontSize(20)
        }
        .width('100%')
        .height(37)
        .backgroundColor(this.gpsActive == 0 ? '#fff' : '#1A1A1A')
        .margin({ top: 10 * this.ratio, right: 10 })
        .justifyContent(FlexAlign.Center)

        Flex({ direction: FlexDirection.Column, justifyContent: FlexAlign.Start }) {
          ForEach(this.RoadData, (item) => {
            Column() {
              Text(`${item.name}:${this.getValues(item)}`)
                .fontSize(20)
                .lineHeight(30)
                .fontColor('#fff')
            }.height(30).justifyContent(FlexAlign.Start).width('100%')
          })
        }.margin({top:5})

      }.width(168 * 1.5)
      .height(this.heightNumber)
      .backgroundColor('#282828')
      .margin({ top: 6 * this.ratio, })

      Column() {
        if (this.draw) {
          XComponent({
            id: 'duolun_plugin_id_draw', //显示轨迹窗口id名称，注意这个ID要和C++侧一致，不能变
            type: 'surface',
            libraryname: 'JudgeSdk'
            // libraryname: 'judgesdk'
          })
            .width(this.widthNumber)
            .height(this.heightNumber)
            .onLoad(() => {
              apiJudgeSdk.examJudgeMapSetDrawing(true); //停止绘制地图轨迹，false:表示结束绘制
            })
            .onDestroy(() => {
              apiJudgeSdk.examJudgeMapSetDrawing(false); //停止绘制地图轨迹，false:表示结束绘制
              this.draw = false;
              clearInterval(globalThis.realTimer)
            })
        } else {
          Column() {
          }
          .width(this.widthNumber)
          .height(this.heightNumber)
        }
      }
      .width('100%')
      .backgroundColor('#fff')

      Row(){
        Image($rawfile('judge/big.png')).width(60).onClick(()=>{
          this.scaleFn( -this.getScaleNum() )
          console.info('surenjun getScaleNum',-this.getScaleNum())
        })
        Image($rawfile('judge/small.png')).width(60).onClick(()=>{
          this.scaleFn( this.getScaleNum() )
        }).margin({left:20})
      }.position({x:'32%',y:60})
    }
    .height('100%')
  }

  async aboutToDisappear() {
    clearInterval(this.timer)
  }
  async aboutToAppear() {
    const judge = new Judge(this)
    let timer = setInterval(()=>{
      this.lane = globalThis.laneData;
    },1000)
    this.timer = timer
  }

  getScaleNum = ()=>{
    const scaleNum = this.scaleNum;
    if(scaleNum < 200){
      return 10
    }
    if(scaleNum >= 200 && scaleNum < 400){
      return 30
    }

    if(scaleNum >= 400 && scaleNum < 600){
      return 50
    }

    if(scaleNum >= 600 && scaleNum < 800){
      return 70
    }

    if(scaleNum >= 800 && scaleNum < 1000){
      return 100
    }

    if(scaleNum >= 1000 && scaleNum < 2000){
      return 500
    }
    if(scaleNum >= 2000 && scaleNum <= 5000){
      return 1000
    }

    return 1000
  }

  getValues(roadColumn) {
    const lane = this.lane || {};
    let key = roadColumn.key;
    let str = ''
    if (Array.isArray(key)) {
      key.forEach((k, index) => {
        str += (lane[k] === undefined ? '' : lane[k]) + (index == key.length - 1 ? '' : '/')
      })
    } else {
      str = lane[key] === undefined ? '' : lane[key]
    }
    return str
  }

  private RoadData: Array<RoadDataType> = [
    { name: '路段组号', key: 'MapRoad_Code_No' },
    { name: '路段编码', key: 'MapRoad_Name' },
    { name: '车轮压线', key: ['TouchLineType', 'TouchDir'] },
    { name: '车身碰线', key: ['TouchLineTypeCS', 'TouchLineDirCS'] },
    { name: '基准车道', key: ['BasePointInLaneNo', 'BaseLaneCount'] },
    { name: '前点车道', key: ['FrontPointLaneNo', 'FrontPointLaneCount'] },
    { name: '后车点道', key: ['BackPointLaneNo','BackPointLaneCount'] },
    { name: '左前/后车身距离', key: ['Body_LF_ToLeftEdge', 'Body_LB_ToLeftEdge'] },
    { name: '右前/后车身距离', key: ['Body_RF_ToRightEdge', 'Body_RB_ToRightEdge'] },
    { name: '右前/后车身边线', key: ['Body_RF_ToBaseLine','Body_RB_ToBaseLine'] },
    { name: '右前/后轮距离', key: ['Wheel_RF_ToRightEdge', 'Wheel_RB_ToRightEdge'] },
    { name: '右前/后轮边线', key: ['Wheel_RF_ToBaseLine', 'Wheel_RB_ToBaseLine'] },
    { name: '左前/后轮距离', key: ['Wheel_LF_ToRightEdge', 'Wheel_LB_ToRightEdge'] },
    { name: '左前/后轮边线', key: ['Wheel_LF_ToBaseLine', 'Wheel_LB_ToBaseLine'] },
    { name: '车道属性', key: ['BasePointInLaneDir', 'CrossLineAttr','DirInverse'] },
    { name: '形状', key: ['InShapeAttr', 'ShapeNo','ShapeNoWheel'] },
    { name: '路段点', key: ['CrossPointNo'] },
  ]

  scaleFn = async (num)=>{
    const scaleNum = this.scaleNum
    console.info('surenjun getScaleNum',scaleNum)
    if(scaleNum >0 && scaleNum < 5000){
      this.scaleNum += num;
    }
    if(scaleNum === 0 && num > 0){
      this.scaleNum += num;
    }
    if(scaleNum > 5000 && num < 0){
      this.scaleNum += num;
    }
    await examJudgeMapSetScaling(this.scaleNum);
  }

}