<template>
    <!-- 底部导航栏 -->
    <div class="first-right l_Dialog tablebk"  v-show="threeshow">
      <el-aside width="340px" class="L_aside L_aside1 asideg asidegbg leftbgimg1" >
        <div class="demo-collapse jiancedian1 asideg1 jc_header collapseeion jianstyle">
          <el-collapse accordion v-model="towactiveNames">
            <el-collapse-item name="1" class="imgneon">
              <template #title>
                <el-icon class="iconimg Frame3" fit="contain"></el-icon>
                灾害信息展示
              </template>
              <div class="rg_content">
                <div class="rg-padding">
                <div class="zongji">
                  <div class="zongjili img1">1<span>个</span></div>
                  <div class="zongjili img2">12<span>个</span></div>
                </div>
                <div  v-for="(item, index) in listArray" :key="index" >
                    <el-image style="height: 100%" :src="item.img" fit="contain"></el-image>
                    <!-- <span  :class="'span'+item.id">{{ item.name }}</span> -->
                </div>
              
              
              </div>
            </div>
              <!-- <div class="mgsnoe" style="height: 200px"></div> -->
            </el-collapse-item>
          </el-collapse>
     
        </div>
      </el-aside>
  
    </div>
  </template>
  <script setup>
  import { ref, onMounted, reactive, } from "vue";
  import { RouterView, RouterLink } from "vue-router"
  import { request, uploadFile } from "@/utils/request";
  import { ElMessage, ElButton, ElDialog, ElSelect } from 'element-plus'
  import * as echarts from 'echarts'
  import bt1 from "@/assets/img/Group1365.png"
  import bt2 from "@/assets/img/Group1366.png"
let threeshow=ref(false);
let towactiveNames = ref('1');
let listArray = ref([
     { id: 0,name:'危险路径',img:bt1 },
     { id: 1,name:'安全路径',img:bt2},
   ]);
  defineExpose({});
  </script>
  <style scoped>
 
  
  </style>

  