<template>
	<div class="right_one">
    <CommonTitle title="桥梁类别" />
		<div class="content" id="chartTwo"  v-loading="isLoading"
         element-loading-background="rgba(0, 22, 52, 0.75)">
			
		</div>
	</div>
</template>

<script setup>
	import {
		ref,
		onMounted,
		nextTick
	} from 'vue'
	import {
		setEchartsBar,option2
	} from '../echarts/option.js'
  import CommonTitle from "@/views/c-cpns/CommonTitle.vue";
  import {getSelectQllbCount} from "@/service/http.js";
  const isLoading = ref(false);
	onMounted(() => {
    isLoading.value = true;
    getSelectQllbCount().then(res => {
      isLoading.value = false;
      let arr = res.data.data.Rows;
      setEchartsBar(document.getElementById("chartTwo"),arr)
    })
	})
</script>

<style scoped lang="scss">
	.center {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	
	.center_center{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.right_one {
		height: 20%;
		padding-top: 10px;
		box-sizing: border-box;
		.content {
			height: 80%;
			width: 90%;
			margin: 0 20px;
			box-sizing: border-box;
			
			
		}
	}
</style>