<template>
	<view class="fullHeight bgLightBlue">
		<scroll-view scroll-y="true" class="pageContent">
			<view class="title flex">
				<uni-icons2 @click="goback" class="forwardImg" style="font-weight: 700;" type="arrowleft" size="22"></uni-icons2>
				<text style="margin-left:-24rpx">{{title}}-现场班组</text>
				<text></text>
			</view>
			<view class="blockBox">
				<view class="blockTitle">
					<view class="titleName">
						班组分布
					</view>
				</view>
				<view class="blockContent">
					<u-charts class="ucharts" :cWidth="355" :cHeight="160" canvas-id=" attendanceRate" chartType="line" :opts="attendanceChartData"
					 ref="attendanceRate" />
				</view>
			</view>
			<view class="blockBox">
				<view class="blockTitle">
					<view class="titleName">
						施工人员分布
					</view>
				</view>
				<view class="blockContent">
					<u-charts class="ucharts" :cWidth="355" :cHeight="160" canvas-id=" attendanceRate" chartType="line" :opts="attendanceChartData"
					 ref="attendanceRate" />
				</view>
			</view>
		</scroll-view>
		<footers :activeTab="'personManage'"></footers>
	</view>
</template>

<script>
	import footers from '../../components/footers/footers.vue'
	import uCharts from '@/components/u-charts/component.vue';
	import uniIcons from "@/components/uni-icons/uni-icons.vue"
	export default {
		components: {
			footers,
			uCharts,
			uniIcons
		},
		data() {
			return {
				title: '',
				searchsn: '',
				attendanceChartData: {
					categories: [
						
					],
					series: [
					]
				},
			}
		},

		onLoad(options) {
			this.title = options.title;
			this.searchsn = options.sn;
		},


		methods: {
			//返回上一页
			goback() {
				uni.navigateBack({})
			},
		
	},
}
</script>

<style scoped>
	.fullHeight {
		height: 100%;
		width: 100%;
	}

	.flex {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.flex2 {
		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.title {
		text-align: center;
		font-size: 36rpx;
		line-height: 48px;
		background-color: #FFFFFF;
		padding: 0 20rpx;
		box-sizing: border-box;
	}


	.type {
		width: 50%;
		text-align: center;
		font-size: 60rpx;
		color: #fff;
		font-weight: 700;
		position: relative;
	}

	.type_name {
		font-size: 24rpx;
		font-weight: initial
	}

	.statistics1 {
		background-color: #FFFFFF;
		padding: 20rpx 0;
	}

	.wake {
		padding: 8px 0;

	}

	.locationImg {
		position: absolute;
		top: calc(50% - 11px);
		right: 50rpx;
	}

	.color1 {
		color: #4396e7;
	}

	.color2 {
		color: #919191;
	}

	.color3 {
		color: #0bb67d;
	}
	.color4{
		color: #ffb71b;
	}

	.font_24 {
		font-size: 48rpx;
		font-weight: initial;
	}

	.workType {
		margin: 20rpx 0;
		box-sizing: border-box;
		padding: 20rpx 30rpx;
		background-color: #FFFFFF
	}
	
	.blockBox .blockTitle .titleName::before {
		height: 75%;
		top: 16%;
	}
	
</style>
