<template>
  <div class="app-container">
    <el-card shadow="never">
      <template #header>
        <div class="card-header"><span>三维数据管理</span></div>
      </template>
      <el-tabs v-model="activeTab" @tab-change="loadTab">
        <el-tab-pane label="三维基础资料" name="info">
          <el-table :data="infoList" stripe v-loading="loading" border>
            <el-table-column type="index" label="序号" width="60" />
            <el-table-column v-for="col in infoCols" :key="col" :prop="col" :label="col" min-width="120" show-overflow-tooltip />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="三维建模数据" name="jm">
          <el-form :inline="true" size="small"><el-form-item label="站名"><el-input v-model="stnm" placeholder="请输入" clearable style="width:160px" /></el-form-item><el-form-item><el-button type="primary" @click="loadJm">查询</el-button></el-form-item></el-form>
          <el-table :data="jmList" stripe v-loading="loading" border>
            <el-table-column type="index" label="序号" width="60" />
            <el-table-column v-for="col in jmCols" :key="col" :prop="col" :label="col" min-width="120" show-overflow-tooltip />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="三维实景拍摄" name="sj">
          <el-form :inline="true" size="small"><el-form-item label="站名"><el-input v-model="stnm" placeholder="请输入" clearable style="width:160px" /></el-form-item><el-form-item><el-button type="primary" @click="loadSj">查询</el-button></el-form-item></el-form>
          <el-table :data="sjList" stripe v-loading="loading" border>
            <el-table-column type="index" label="序号" width="60" />
            <el-table-column v-for="col in sjCols" :key="col" :prop="col" :label="col" min-width="120" show-overflow-tooltip />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="现场图片" name="tp">
          <el-form :inline="true" size="small"><el-form-item label="站名"><el-input v-model="stnm" placeholder="请输入" clearable style="width:160px" /></el-form-item><el-form-item><el-button type="primary" @click="loadTp">查询</el-button></el-form-item></el-form>
          <el-table :data="tpList" stripe v-loading="loading" border>
            <el-table-column type="index" label="序号" width="60" />
            <el-table-column v-for="col in tpCols" :key="col" :prop="col" :label="col" min-width="120" show-overflow-tooltip />
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>
<script setup name="Sw">
import { getSwInfoList, getSwJmList, getSwSjList, getSwTpList } from '@/api/slgc/sw/index'
const activeTab = ref('info')
const loading = ref(false); const stnm = ref('')
const infoList = ref([]); const infoCols = ref([])
const jmList = ref([]); const jmCols = ref([])
const sjList = ref([]); const sjCols = ref([])
const tpList = ref([]); const tpCols = ref([])
function setCols(list, cols) { if (list.length > 0) cols.value = Object.keys(list[0]) }
function loadInfo() { loading.value = true; getSwInfoList().then(r => { const d = r.data || []; infoList.value = d; setCols(d, infoCols); loading.value = false }) }
function loadJm() { loading.value = true; getSwJmList({ stnm: stnm.value }).then(r => { const d = r.data || []; jmList.value = d; setCols(d, jmCols); loading.value = false }) }
function loadSj() { loading.value = true; getSwSjList({ stnm: stnm.value }).then(r => { const d = r.data || []; sjList.value = d; setCols(d, sjCols); loading.value = false }) }
function loadTp() { loading.value = true; getSwTpList({ stnm: stnm.value }).then(r => { const d = r.data || []; tpList.value = d; setCols(d, tpCols); loading.value = false }) }
function loadTab() { if (activeTab.value === 'info') loadInfo(); else if (!stnm.value) { ElMessage.warning('请先输入站名') } }
onMounted(() => loadInfo())
</script>
<style scoped>.card-header { font-weight:600;font-size:16px; }</style>
