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(30),
			itemHeight: nowSize(4),
			itemGap: nowSize(20),
			right:'4%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '15%',
			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(30),
			itemHeight: nowSize(4),
			itemGap: nowSize(20),
			right:'4%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '15%',
			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(30),
			itemHeight: nowSize(4),
			itemGap: nowSize(20),
			right:'4%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '15%',
			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(30),
			itemHeight: nowSize(4),
			itemGap: nowSize(20),
			right:'4%',
			top: '0%',
			textStyle: {
			color: '#FFFFFF',
			fontSize: nowSize(18),
			}
			},
			grid: {
			top: '15%',
			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";

	src/assets/css/fonts/SOURCEHANSANSCN-LIGHT.ttf	补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/assets/css/main.css	6 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/pages/show/index/index.vue	402 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史

			@@ -1,8 +1,13 @@
			@font-face {
			font-family: 'sFont';
			src: url("fonts/SOURCEHANSANSCN-LIGHT.ttf");
			}
			* {
			margin: 0;
			padding: 0;
			font-size: .0938rem;
			font-weight: lighter;
			font-family: 'sFont';
			}

			html,
			@@ -14,6 +19,7 @@
			overflow: hidden;
			}


			body {
			font-family: 'Source Han Sans CN','PingFang SC', "Helvetica Neue", Helvetica, "microsoft yahei", arial, STHeiTi, sans-serif;
			}