<template>
<div>
  <el-container>
    <el-aside width="400px">

      <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>

    </el-aside>

    <el-main>

      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span style="font-size: xx-large"></span>
          <template>
            <el-descriptions class="margin-top" title="资产模型基本信息" :column="2"  border>
              <el-descriptions-item>
                <template slot="label">表名称</template>
                {{ tableBasic.tableName }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">表备注</template>
                {{ tableBasic.tableRemark }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">数据量</template>
                {{ tableBasic.dataNum }}
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">是否核心</template>
                <dict-tag :options="dict.type.sys_yes_no" :value="tableBasic.center"/>
              </el-descriptions-item>
            </el-descriptions>
          </template>
        </div>
      </el-card>
      <el-card class="box-card"  style="margin-top: 20px">
        <div slot="header" class="clearfix">
          <span>模型数据</span>
        </div>
        <el-row :gutter="20">
          <el-col :span="6" v-for="DataValue in  assetShowList" style="margin-top: 20px">
            <el-descriptions :title="tableBasic.tableRemark+'.'+tableBasic.tableName+'.'+DataValue.key" direction="vertical"
                             border :column="1">
              <el-descriptions-item label="Type">
                <el-tag size="small">{{ DataValue.type }}</el-tag>
              </el-descriptions-item>
              <el-descriptions-item label="Value">{{ DataValue.value }}</el-descriptions-item>
            </el-descriptions>
          </el-col>
        </el-row>
      </el-card>
    </el-main>
  </el-container>
</div>
</template>
<script setup>
import {findByTableName, findTableValueList} from "@/api/source/source";

export default {
  name: 'Show',
  dicts: ['sys_yes_no'],
  data() {
    return {
      data:[],
      defaultProps: {
        children: 'children',
        label: 'tableName'
      },
      tableBasic:{},
      tableStructure:[],
      assetShowList: [],
      kvtList: [],
      DataValue:[],

    };
  },
  created() {
   this.findByTableName();
  },
  methods: {
    findByTableName(){
      findByTableName().then(res=>{
        this.data=res.data
        console.log(res.data);
      })
    },
    handleNodeClick(data) {
      this.tableBasic = data
      if (data.children == null) {
        console.log(data);
        findTableValueList(data.basicId, data.tableName).then(res => {
          this.assetShowList = res.data;
          this.DataValue = res.data;
        })
      }
    }
    },
}
</script>

<style scoped lang="scss">

</style>
