<template>
  <el-row :gutter="20"> 
    <el-col>
      <h1>DocumentAI</h1>
    </el-col> 
    <el-col>
      <h3>build version</h3>
    </el-col>
    <el-col>
      <p class="italic">{{ version }}</p>
    </el-col>
    <el-col>
      <h3>build tag</h3>
    </el-col>
    <el-col>
      <p class="italic">{{ build_tag }}</p>
    </el-col>
  
    <el-col>
      <h3>模型信息</h3>
    </el-col>
    <el-col>
      <p>模型个数：{{ model_num }}</p>
    </el-col>
    <el-table :data="model_data" style="width: 100%">
      <el-table-column prop="key" label="Key" width="auto" />
      <el-table-column prop="type" label="Type" width="auto" />
      <el-table-column prop="subtype" label="Subtype" width="auto" />
      <el-table-column prop="format" label="Format" width="auto" />
      <el-table-column prop="version" label="Version" width="auto" />
    </el-table>
  </el-row>
</template>

<script setup lang="ts">
import { onMounted, ref } from "vue";
import { GetBuildTag, GetModelInfo } from '../../../api/api'
import { storeToRefs } from 'pinia'
import { useVersionStore } from '../../../store/Version';
import { useServerStore } from '../../../store/Server';

const vr = useVersionStore();
const { build_tag, model_info, version } = storeToRefs(vr);
const si = useServerStore();
const { api_build_tag, api_model_info } = storeToRefs(si);

let model_num = ref(0)
let model_data: any = ref([])

onMounted(async () => {
  if (build_tag.value == "") {
    GetBuildTag(api_build_tag.value).then(res => {
      build_tag.value = res;
    })
  }
  if (model_info.value == "") {
    GetModelInfo(api_model_info.value).then(res => {
      model_info.value = res;
      const model = JSON.parse(model_info.value)
      model_num.value = model['model_num']
      console.log(model['model_num'])
      console.log(model['model_keys'])
      const model_array = model['model_keys']
      for (let i = 0; i < model_array.length; i++) {
        model_data.value.push({
          key: model_array[i]['model_key'],
          type: model_array[i]['model_type'],
          subtype: model_array[i]['model_sub_type'],
          format: model_array[i]['model_format'],
          version: model_array[i]['model_version'],
        })
      }
    })
  } else {
    const model = JSON.parse(model_info.value)
    model_num.value = model['model_num']
    console.log(model['model_num'])
    console.log(model['model_keys'])
    const model_array = model['model_keys']
    for (let i = 0; i < model_array.length; i++) {
      model_data.value.push({
        key: model_array[i]['model_key'],
        type: model_array[i]['model_type'],
        subtype: model_array[i]['model_sub_type'],
        format: model_array[i]['model_format'],
        version: model_array[i]['model_version'],
      })
    }
  }
})
</script>

<style scoped lang="less">
.italic {
  font-style: italic;
}
</style>