<!--
@ 作者: 秦东
@ 时间: 2023-11-06 13:39:13
@ 备注: 首页
-->
<script lang='ts' setup>
import * as echarts from 'echarts';	//引入图形界面

import { useUserStore } from "@/store/modules/user";


import { orgInfo } from '@/api/displayboardapi/types'
import { getOrgChiled,getCompanyDeparment,targetListForDepartment } from '@/api/displayboardapi/indexapi'

import UserInfo from "@/views/dashboard/components/userinfo.vue";
import SanLianpIng from "@/views/dashboard/components/sanlianping.vue";
import EducationChart from "@/views/dashboard/components/education.vue";
import AllOrgYear from "@/views/dashboard/components/allorgyear.vue";
import OrgUserAge from "@/views/dashboard/components/orguserage.vue"; 
import OrgEducation from "@/views/dashboard/components/orgeducation.vue"; 
import Application from "@/views/dashboard/components/application.vue";  
import HostNews from "@/views/dashboard/components/hostnews.vue";

const userStore = useUserStore();
const orgListCont = ref<orgInfo[]>([])
const educationOrgId = ref<number>(309)
const masterBody = ref<any>(null)
const drawerWidht = ref<any>()
/**
 * 获取行政组织
 */
function getOrgList(){
	getOrgChiled({id:313})
		.then(( {data} )=>{
			console.log("获取行政组织-2-->",data)
			orgListCont.value = data.list
			educationOrgId.value = data.current
		})
}



const orgAllYears = ref<any>()	//当前年

const oenOrg = ref<any>() //单一行政组织


//渲染完页面再执行
onMounted(() => {
	
	drawerWidht.value = masterBody.value?.clientWidth
	getOrgList();
	// console.log("热门新闻----100---->",drawerWidht.value)
})
</script>
<template>
		<div ref="masterBody" class="app_container">
			<el-row :gutter="10">
				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
					<AllOrgYear  :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
				</el-col>
				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
					<UserInfo :user-store="userStore" />
				</el-col>
			</el-row>
			<el-row :gutter="10" class="cart_top_juLi">
				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">

					<el-row :gutter="10">
						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
						
							<OrgUserAge :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
						
						</el-col>
						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
							
							<OrgEducation :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
						
						</el-col>
					</el-row>
					
					



				</el-col>
				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
				
					<HostNews v-model:drawer-widht="drawerWidht" />
				
				</el-col>
			</el-row>
			<el-row :gutter="10" class="cart_top_juLi">
				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
				
					<SanLianpIng />
				
				</el-col>
				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
					<Application :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
					
				</el-col>
			</el-row>
			
		</div>
</template>
<style  lang='scss' scoped>
.app_container{
	padding: 10px 20px 0px 20px;
	height: calc(100vh - 90px);
	overflow: hidden;
	overflow-y: auto;
}
.readback{
	// background-color:#FF0000;
	.allOrgAxisCares{
		display: block;
		width:100%;
		height:280px;
		overflow:auto;
	}
	
}
.orgAllMothsTitle{
	width:100%;
	display: flex;
	align-items: center;
	justify-content:space-between;
		
}
.greenColor{
	// background-color:#FFAC52;
	
	// padding:0 10px 0 10px;
}
.span_icon_left{
	margin-right:10px;
}
.cart_top_juLi{
	// margin-top:10px;
}
.titleInfo{
	font-size: 20px;
	font-weight: bold;
}
</style>
