jiashicang-front.git

			@@ -296,7 +296,7 @@
			</div>

			</div>
			<div class="shuju-echarts"></div>
			<div class="shuju-echarts" id="jiuyeshujuEcharts"></div>
			</div>

			</div>
			@@ -435,7 +435,7 @@
			</div>
			</div>
			</div>
			<div class="shuju-echarts"></div>
			<div class="shuju-echarts" id="chengzhenZhigongYanglaoEcharts"></div>
			</div>

			</div>
			@@ -443,7 +443,7 @@
			<div class="index-line-box2">
			<div class="shu-ju-box">
			<div class="shuju-title-box">
			<h1>工伤保险</h1>
			<h1>失业保险</h1>
			</div>
			<div class="shuju-main-box">
			<div class="shuju-table">
			@@ -582,7 +582,7 @@
			</div>

			</div>
			<div class="shuju-echarts"></div>
			<div class="shuju-echarts" id="shiyeBaoxianEcharts"></div>
			</div>

			</div>
			@@ -726,7 +726,8 @@
			</div>

			</div>
			<div class="shuju-echarts"></div>
			<div class="shuju-echarts" id="gongshangBaoxianEcharts"></div>
			</div>></div>
			</div>

			</div>
			@@ -734,7 +735,396 @@
			</div>
			</template>
			<script>
			export default {};
			import echarts from "echarts/lib/echarts";
			import nowSize from "../../../libs/nowSize";
			export default {
			name: "index",
			data() {
			return {

			}
			},
			mounted() {
			this.jiuyeshujuEcharts()
			this.chengzhenZhigongYanglaoEcharts()
			this.shiyeBaoxianEcharts()
			this.gongshangBaoxianEcharts()
			},
			methods: {
			/就业数据/
			jiuyeshujuEcharts() {
			let myEchart = this.$echarts.init(document.getElementById('jiuyeshujuEcharts'))
			let option = {
			color : ['#FF5151','#51FF5D','#FFD151'],
			tooltip: {
			show: true,
			trigger: 'axis'
			},
			legend: {
			data: ['总数', '在职职工', '离退休'],
			itemWidth: nowSize(24),
			itemHeight: nowSize(4),
			itemGap: nowSize(10),
			right:'0%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '20%',
			left: '1%',
			right: '5%',
			bottom: '3%',
			containLabel: true
			},
			xAxis: {
			type: 'category',
			boundaryGap: false,
			data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			yAxis: {
			type: 'value',
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			series: [
			{
			name: '总数',
			type: 'line',
			data: [370, 332, 401, 534, 490, 530, 910]
			},
			{
			name: '在职职工',
			type: 'line',
			data: [220, 182, 191, 234, 290, 330, 310]
			},
			{
			name: '离退休',
			type: 'line',
			data: [150, 132, 201, 154, 190, 330, 410]
			}
			]
			};
			myEchart.setOption(option)
			window.addEventListener('resize',function () {
			myEchart.resize()
			})
			},
			/城镇职工养老/
			chengzhenZhigongYanglaoEcharts() {
			let myEchart = this.$echarts.init(document.getElementById('chengzhenZhigongYanglaoEcharts'))
			let option = {
			color : ['#FF5151','#51FF5D','#FFD151'],
			tooltip: {
			show: true,
			trigger: 'axis'
			},
			legend: {
			data: ['总数', '在职职工', '离退休'],
			itemWidth: nowSize(24),
			itemHeight: nowSize(4),
			itemGap: nowSize(10),
			right:'0%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '20%',
			left: '1%',
			right: '5%',
			bottom: '3%',
			containLabel: true
			},
			xAxis: {
			type: 'category',
			boundaryGap: false,
			data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			yAxis: {
			type: 'value',
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			series: [
			{
			name: '总数',
			type: 'line',
			data: [370, 332, 401, 534, 490, 530, 910]
			},
			{
			name: '在职职工',
			type: 'line',
			data: [220, 182, 191, 234, 290, 330, 310]
			},
			{
			name: '离退休',
			type: 'line',
			data: [150, 132, 201, 154, 190, 330, 410]
			}
			]
			};
			myEchart.setOption(option)
			window.addEventListener('resize',function () {
			myEchart.resize()
			})
			},
			/失业保险/
			shiyeBaoxianEcharts() {
			let myEchart = this.$echarts.init(document.getElementById('shiyeBaoxianEcharts'))
			let option = {
			color : ['#FF5151','#51FF5D','#FFD151'],
			tooltip: {
			show: true,
			trigger: 'axis'
			},
			legend: {
			data: ['总数', '在职职工', '离退休'],
			itemWidth: nowSize(24),
			itemHeight: nowSize(4),
			itemGap: nowSize(1),
			right:'0%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '20%',
			left: '1%',
			right: '5%',
			bottom: '3%',
			containLabel: true
			},
			xAxis: {
			type: 'category',
			boundaryGap: false,
			data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			yAxis: {
			type: 'value',
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			series: [
			{
			name: '总数',
			type: 'line',
			data: [370, 332, 401, 534, 490, 530, 910]
			},
			{
			name: '在职职工',
			type: 'line',
			data: [220, 182, 191, 234, 290, 330, 310]
			},
			{
			name: '离退休',
			type: 'line',
			data: [150, 132, 201, 154, 190, 330, 410]
			}
			]
			};
			myEchart.setOption(option)
			window.addEventListener('resize',function () {
			myEchart.resize()
			})
			},
			/工伤保险/
			gongshangBaoxianEcharts() {
			let myEchart = this.$echarts.init(document.getElementById('gongshangBaoxianEcharts'))
			let option = {
			color : ['#FF5151','#51FF5D','#FFD151'],
			tooltip: {
			show: true,
			trigger: 'axis'
			},
			legend: {
			data: ['总数', '在职职工', '离退休'],
			itemWidth: nowSize(24),
			itemHeight: nowSize(4),
			itemGap: nowSize(10),
			right:'0%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '20%',
			left: '1%',
			right: '5%',
			bottom: '3%',
			containLabel: true
			},
			xAxis: {
			type: 'category',
			boundaryGap: false,
			data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'],
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			yAxis: {
			type: 'value',
			axisLabel: {
			show: true,
			textStyle: {
			color: "#fff",
			fontSize:nowSize(20)
			}
			},
			axisLine: {
			lineStyle: {
			color: "#999999",
			width: 1,
			type: "solid"
			}
			},
			splitLine: {
			show: false
			}
			},
			series: [
			{
			name: '总数',
			type: 'line',
			data: [370, 332, 401, 534, 490, 530, 910]
			},
			{
			name: '在职职工',
			type: 'line',
			data: [220, 182, 191, 234, 290, 330, 310]
			},
			{
			name: '离退休',
			type: 'line',
			data: [150, 132, 201, 154, 190, 330, 410]
			}
			]
			};
			myEchart.setOption(option)
			window.addEventListener('resize',function () {
			myEchart.resize()
			})
			}
			}
			};
			</script>
			<style lang="scss" scoped>
			@import "../../../assets/css/base";
			@@ -786,6 +1176,7 @@
			display: flex;
			flex: 1;
			justify-content: right;
			margin-left: 0.15625rem /* 40/256 */;
			}
			.inside-right{
			display: flex;
			@@ -964,7 +1355,8 @@

			}
			.shuju-scroll{
			@include overflow-y(280)
			max-height: 1.09375rem /* 280/256 */;
			@include overflow-y()
			}
			.shuju-table-line2{
			width: 100%;