UI

src/assets/styles/base.scss

@@ -923,7 +923,11 @@ div::-webkit-scrollbar {
 						color: $fListTitle;
 						margin-top: .5rem;
 					}
-					
+					.personnel-name{
+						h6{
+							font-size: 1rem !important;
+						}
+					}
 					.icon-text {
 						display: flex;
 						flex-direction: column;
@@ -1167,6 +1171,11 @@ div::-webkit-scrollbar {
 						color: $fListTitle;
 						margin-top: .5rem;
 					}
+					.personnel-name{
+						h6{
+							font-size: 1rem !important;
+						}
+					}
 					
 					.icon-text {
 						display: flex;

src/views/leader.vue

@@ -1,112 +1,165 @@
 <template>
 	<div class="visual-con">
-			<!--头部-->
-			<vheader></vheader>
-			<!--主体-->
-			<div class="visual-body">
-				<!-- 左侧 -->
-				<div class="leftbar" :class="indentleft" ref="left">
-					
-					<div class="forthis">
-						<div class="this-title">
-							<span>人员分布</span>
-							<!-- <span>45</span> -->
-						</div>
-						<div class="i-list-con h-25">
-							<div id="personnel-chart" style="width: 100%;height:12vh;"></div>
-							<div class="d-l-con-icon">
-								<div class="icon-con w-50"  v-for="(item,index) in allPeople">
-									<div class="icon icon-mid el-icon-user"></div>
-									<div class="icon-text">
-										<h5>{{item.job}}</h5>
-										<h6>{{item.number}}</h6>
-									</div>
+		<!--头部-->
+		<vheader></vheader>
+		<!--主体-->
+		<div class="visual-body">
+			<!-- 左侧 -->
+			<div class="leftbar" :class="indentleft" ref="left">
+
+				<div class="forthis">
+					<div class="this-title">
+						<span>人员分布</span>
+						<!-- <span>45</span> -->
+					</div>
+					<div class="i-list-con h-25">
+						<div id="personnel-chart" style="width: 100%;height:12vh;"></div>
+						<div class="d-l-con-icon">
+							<div class="icon-con w-50" v-for="(item,index) in allPeople">
+								<div class="icon icon-mid el-icon-user"></div>
+								<div class="icon-text">
+									<h5>{{item.job}}</h5>
+									<h6>{{item.number}}</h6>
 								</div>
-								<div class="icon-con w-50  m-btm-no"  v-for="(item,index) in allPeople" >
-									<div class="icon icon-mid el-icon-user"></div>
-									<div class="icon-text">
-									  <h5>{{item.job}}</h5>
-									  <h6>{{item.number}}</h6>
-									</div>
+							</div>
+							<div class="icon-con w-50  m-btm-no" v-for="(item,index) in allPeople">
+								<div class="icon icon-mid el-icon-user"></div>
+								<div class="icon-text">
+									<h5>{{item.job}}</h5>
+									<h6>{{item.number}}</h6>
 								</div>
 							</div>
 						</div>
 					</div>
-					<div class="forthis">
-						<div class="i-list-con h-27">
-							<div class="d-l-con-icon">
-								<div class="icon-con" v-for="(item,index) in peopleList">
-									<div class="icon icon-mid el-icon-user"></div>
-									<div class="icon-text">
-										<h6>{{item.count}}</h6>
-										<h5>{{item.resourceName}}</h5>
-									</div>
+				</div>
+				<div class="forthis">
+					<div class="i-list-con h-27">
+						<div class="d-l-con-icon">
+							<div class="icon-con" v-for="(item,index) in peopleList">
+								<div class="icon icon-mid el-icon-user"></div>
+								<div class="icon-text personnel-name">
+									<h6>{{item.count}}</h6>
+									<h5>{{item.resourceName}}</h5>
 								</div>
 							</div>
 						</div>
 					</div>
 				</div>
-				<!-- 地图 -->
-				<supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'forestMap'" :mapSite="{doubleClickZoom:false}"
-					:codes="['9fa5']" :isSideBySide="false" @preview="preview" @showEventInfo_notProcessed="showEventInfo_notProcessed" @showEventInfo_Processed="showEventInfo_Processed"></supermap>
-				<!-- 右侧 -->
-				<div class="rightbar" :class="indentright" ref="right">
-					<div class="forthis">
-						<div class="this-title">
-							<span>巡林计划</span>
-							<!-- <span>23</span> -->
-						</div>
-						<div class="i-list-con h-73">
-							
-							<div class="h-19 overflow-y">
-								<div class="d-l-con" v-for="(item,index) in xunLinListOne">
-									<div class="d-l-l-text">
-										<i class="i-small"></i>
-										<h4>{{item.name}}</h4>
-									</div>
+			</div>
+			<!-- 地图 -->
+			<supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'forestMap'"
+				:mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false" @preview="preview"
+				@showEventInfo_notProcessed="showEventInfo_notProcessed"
+				@showEventInfo_Processed="showEventInfo_Processed"></supermap>
+			<!-- 右侧 -->
+			<div class="rightbar" :class="indentright" ref="right">
+				<div class="forthis">
+					<div class="this-title">
+						<span>巡林计划</span>
+						<!-- <span>23</span> -->
+					</div>
+					<div class="i-list-con h-73">
+
+						<div class="h-19 overflow-y">
+							<div class="d-l-con" v-for="(item,index) in xunLinListOne">
+								<div class="d-l-l-text">
+									<i class="i-small"></i>
+									<h4>{{item.name}}</h4>
 								</div>
 							</div>
 						</div>
-	
 					</div>
-	
-					
+
 				</div>
-				<vBottomMenu ref="bottomMenu"></vBottomMenu>
-				<el-tooltip :content="indentText" placement="top" :disabled="indentdisabled">
-					<div class="mascot" ref="mascot" :class="indentStyle" @click="indent">
-						<img src="@/assets/images/mascot.png" /></div>
-				</el-tooltip>
+
+
 			</div>
-			
-			
-	    <eventLocation ref="eventLocation"></eventLocation>
+			<vBottomMenu ref="bottomMenu"></vBottomMenu>
+			<el-tooltip :content="indentText" placement="top" :disabled="indentdisabled">
+				<div class="mascot" ref="mascot" :class="indentStyle" @click="indent">
+					<img src="@/assets/images/mascot.png" />
+				</div>
+			</el-tooltip>
 		</div>
+
+
+		<eventLocation ref="eventLocation"></eventLocation>
+	</div>
 </template>
 
 <script>
+	import supermap from '@/components/supermap' //超图
+	import vheader from '@/components/v-header.vue' //一体化共用头部
+	import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
+
 	let echarts = require('echarts')
 	export default {
-		
+		components: {
+			supermap,
+			vheader,
+			vBottomMenu,
+		},
 		data() {
 			return {
-				allPeople:[ 
-					{ job:'网格长', number:'12345'},
-					{ job:'网格长', number:'12345'},
-					],
-				peopleList:[ 
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					{ count:'姓名', resourceName:'部门'},
-					],
-				xunLinListOne:[{name:'第一计划'},{name:'第二计划'},{name:'第三计划'},{name:'第四计划'}]
+				allPeople: [{
+						job: '网格长',
+						number: '12345'
+					},
+					{
+						job: '网格长',
+						number: '12345'
+					},
+				],
+				peopleList: [{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+					{
+						count: '姓名',
+						resourceName: '部门'
+					},
+				],
+				xunLinListOne: [{
+					name: '第一计划'
+				}, {
+					name: '第二计划'
+				}, {
+					name: '第三计划'
+				}, {
+					name: '第四计划'
+				}]
 			}
 		}
 	}
@@ -114,6 +167,8 @@
 
 <style rel="stylesheet/scss" lang="scss" scoped>
 	@import '@/assets/styles/base.scss';
-	.h-27{ height: 27rem;}
-	
-</style>
+
+	.h-27 {
+		height: 27rem;
+	}
+</style>