import TopLogo from './compontents/TopLogo';
import MA_SYSTEMPARM from '../common/constants/MA_SYSTEMPARM';
import AccountTable from '../common/database/tables/AccountTable';
import { getSyncData } from '../common/service/initable';
import router from '@ohos.router';

const cBg = $rawfile('judge/km3/road/luxian_pre.png');
const lBg = $rawfile('judge/km3/road/luxian_nor.png');
const ctBg = $rawfile('judge/km3/road/luxian_pre.png');
const ltBg = $rawfile('judge/km3/road/luxian_nor.png');

//单机模式才选线路
@Entry
@Component
export default struct Index {
  @State @Watch('outClick') outFlag: boolean = false;
  @State roadObj: any = {}

  async aboutToAppear() {
    //读取systemparam表的no1等于4的
    const systemParms: any = await getSyncData('MA_SYSTEMPARM')
    systemParms.forEach((systemParm) => {
      //TODO 字段名称待修改
      const {no1,no2,no3,txt1,txt2} = systemParm;
      if (no1 == 4) {
        const temp = { no2, no3, txt1: decodeURI(txt1), txt2 }
        this.roadObj[no2] = no2
      }
    })
  }

  build() {
    Column() {
      TopLogo({ outFlag: $outFlag })
      Flex({wrap:FlexWrap.Wrap,direction:FlexDirection.Row,justifyContent:FlexAlign.Start}){
        List({}) {
          ListItem() {
            Column() {
              Row() {
              }
              .backgroundImage(lBg, ImageRepeat.NoRepeat)
              .backgroundImageSize({ width: '100%', height: '100%' })
              .width(90)
              .height(80)

              Text(`随机`) {
              }.fontColor('#FFF2D9').fontSize(24).padding({ top: 10 })
            }
          }
          .backgroundImage(cBg, ImageRepeat.NoRepeat)
          .backgroundImageSize({ width: '100%', height: '100%' })
          .width(180)
          .height(220)
          .margin({ left: 5, bottom: 10 })
          .onClick(async () => {
            const roadArr = Reflect.ownKeys(this.roadObj).map((roadKey) => {
              return this.roadObj[roadKey]
            });
            const wayno = roadArr[Math.floor(Math.random()*roadArr.length)];
            this.goJudge(wayno)
          })
          ForEach(Reflect.ownKeys(this.roadObj), (roadIndex) => {
            ListItem() {
              Column() {
                Row() {
                }
                .backgroundImage(lBg, ImageRepeat.NoRepeat)
                .backgroundImageSize({ width: '100%', height: '100%' })
                .width(90)
                .height(80)
                Text(`线路${this.roadObj[roadIndex] + ''}`) {
                }.fontColor('#FFF2D9').fontSize(24).padding({ top: 10 })
              }
            }
            .backgroundImage(cBg, ImageRepeat.NoRepeat)
            .backgroundImageSize({ width: '100%', height: '100%' })
            .width(180)
            .height(220)
            .margin({ left: 5, bottom: 10 })
            .onClick(async () => {
              this.goJudge(this.roadObj[roadIndex])
            })
          })
        }.lanes(8).margin({ top: 50, left: 15 })
      }
    }.width('100%')
    .height('100%')
    .backgroundColor('#1A1A1A')

  }

  goJudge(wayno) {
    let currentParams: any = router.getParams() || {};
    const {sczb,kfdm} = currentParams;
    router.replaceUrl({
      url: 'pages/Judge',
      params:{
        sczb,
        kfdm,
        wayno,
      }
    }, router.RouterMode.Single);

  }
  outClick(){}
}