<template>
  <div class="BOx">
    <div class="ditu">地图</div>
    <el-table v-loading="tableLoading" :data="tableData" max-height="650" style="margin-top: 5px">
      <el-table-column label="巡查名称" prop="nickName" />
      <el-table-column label="巡查项目名称" prop="openId1" />
      <el-table-column label="巡查人" prop="nickName2" />
      <el-table-column label="巡查里程" prop="openId" />
      <el-table-column label="巡查状态" prop="nickName1" />
      <el-table-column label="巡查时段" prop="nickName" />
      <el-table-column label="巡查位置" prop="openId" />
      <el-table-column label="巡查描述" prop="openId" />
    </el-table>
    <div style="width: 100%; display: flex; margin-top: 5px">
      <div>
        <div class="detail-title1">问题图片</div>
        <div style="flex-wrap: wrap; width: 100%">
          <el-image :src="url" :preview-src-list="[url]" style="width: 240px; height: 120px; margin-top: 5px"> </el-image>
        </div>
        <!-- <el-empty v-else description="暂无图片" :image-size="50" /> -->
      </div>

      <!-- <Empty :width="220" :height="120" :emptyText="'暂无数据...'" style="margin-top: 5px"></Empty> -->
    </div>
    <el-table v-loading="tableLoading" :data="tableData1" max-height="650" style="margin-top: 5px">
      <el-table-column label="案件名称" prop="a" />
      <el-table-column label="案件等级" prop="b" />
      <el-table-column label="问题类型" prop="c" />
      <el-table-column label="上报人" prop="openId" />
      <el-table-column label="上报时间" prop="t" />
      <el-table-column label="截止时间" prop="y" />
      <el-table-column label="状态" prop="openId" />
      <el-table-column label="操作" prop="openId" />
    </el-table>
  </div>
</template>

<script setup>
const url = 'https://server1.wh-nf.cn:9000/newfiber-standard/2024/03/02/微信图片_20240302202056_20240302202204A004.jpg';
const tableData = ref([
  {
    openId1: '海绵项目1',
    nickName1: '正在巡查',
    nickName2: '李强',
  },
]);
const tableData1 = ref([
  {
    a: '巡查',
    b: 'I',
    c: '管网',
    t: '2024-06-26',
    y: '2024-06-30',
  },
]);
// const tableLoading = ref(true);
</script>
<style scoped lang="scss">
.BOx {
  padding-bottom: 20px;
}
.ditu {
  width: 100%;
  height: 300px;
  border: 1px solid #c6c6c6;
}
.detail-title1 {
  color: #c6c6c6;
}
</style>