TV.kanbanUI.git

			@@ -8,11 +8,13 @@
			<title>韩电流水线看板</title>
			<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
			<link rel="stylesheet" type="text/css" href="css/bootstrap-table.min.css">
			<link rel="stylesheet" type="text/css" href="css/bootstrap-select.min.css">
			<link rel="stylesheet" type="text/css" href="css/index.css">
			<script src="js/jquery.min.js"></script>
			<script src='js/echarts.min.js'></script>
			<script src="js/bootstrap.min.js"></script>
			<script src='js/bootstrap-table.min.js'></script>
			<script src='js/bootstrap-select.min.js'></script>
			<script src='js/bootstrap-table-zh-CN.min.js'></script>
			<script src="js/jquery.SuperSlide.2.1.3.js"></script>
			<script src='js/template.js'></script>
			@@ -137,8 +139,14 @@

			#cList li {
			margin: 26px auto;
			white-space:nowrap;
			overflow: hidden;
			text-overflow:ellipsis;
			}

			#cList li span{
			word-wrap: break-word;word-break: break-all;overflow: hidden;

			}
			#cList0 {
			height: 450px;
			width: 3%;
			@@ -254,25 +262,92 @@
			#tb_order tr:nth-child(even) {
			background: #000000;
			}
			.pull-right {
			display:none;

			.pull-right,.fixed-table-pagination .pagination-detail, .fixed-table-pagination div.pagination {
			display: none;
			}
			.col-sm-3{
			width:20%;

			.col-sm-3 {
			width: 20%;
			}
			.bootstrap-select.form-control:not([class*=col-]) {
			width: 220px;
			/* float: right; */
			}
			.bootstrap-select>.dropdown-toggle.bs-placeholder,
			.bootstrap-select>.dropdown-toggle.bs-placeholder:active,
			.bootstrap-select>.dropdown-toggle.bs-placeholder:focus,
			.bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
			border-color: #080E2D!important;
			background-color: #000!important;
			color: #09d1ea!important;
			}

			.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
			color: #09d1ea!important;
			}

			.bootstrap-select.btn-group .dropdown-menu {
			background-color: #000!important;
			}

			.form-control {
			background-color: #000!important;
			}

			.form-control:focus {
			border-color: #09d1ea!important;
			}

			.form-control:hover {
			border-color: #000!important;
			}

			.btn-default:hover {
			border-color: #09d1ea!important;
			}

			.bootstrap-select.btn-group .dropdown-menu li a:hover {
			background-color:rgba(255, 255, 255, 0.3)!important;
			}

			.btn-default {
			border-color: #09d1ea!important;
			color: #09d1ea!important;
			background-color: #000!important;
			}

			.bootstrap-select.form-control:hover {
			background-color: #000!important;
			}

			.btn-default:hover {
			background-color: #000!important;
			border-color: #09d1ea!important;
			color: #09d1ea!important;
			}
			.dropdown-menu > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .active > a:hover{
			background-color:rgba(255, 255, 255, 0.3)!important;
			}
			</style>
			<script type="text/javascript">
			//配置参数
			var LineCode=''//流水线编码
			var LineCodeList='509'+','+'510'+','+'511'+','+'512'+','+'513'+','+'514';//流水线看板今日全部流水线编码:产线1、产线2、产线3、产线4、产线5、产线6



			var interval;//计时器
			var interval1;//计时器
			var num = 0;
			var hours=[];
			var hoursqty=[];
			var CloseProgress=0; //完工率
			var LineName=[]; //流水线数组
			var LineOrderQty=[]; //流水线当天订单总任务数量数组
			var LineOrderCloseQty=[]; //流水线当天订单总完成数量数组
			var Week=0; //本周分析
			var Month=0; //本月分析
			var hours = [];
			var hoursqty = [];
			var CloseProgress = 0; //完工率
			var LineName = []; //流水线数组
			var LineOrderQty = []; //流水线当天订单总任务数量数组
			var LineOrderCloseQty = []; //流水线当天订单总完成数量数组
			var Week = 0; //本周分析
			var Month = 0; //本月分析
			$(document).ready(function () {
			// 创建两个变量，一个数组中的月和日的名称
			var monthNames = ["1 月", "2 月", "3 月", "4 月", "5 月", "6 月", "7 月", "8 月", "9 月", "10 月", "11 月", "12 月"];
			@@ -297,6 +372,7 @@

			});
			$(function () {
			LineCode=$(".selectpicker").val();
			var mychart1 = echarts.init(document.getElementById('mychart1'));
			var mychart2 = echarts.init(document.getElementById('mychart2'));
			var mychart3 = echarts.init(document.getElementById('mychart3'));
			@@ -306,11 +382,23 @@
			DataTable();
			// 定时器
			interval = setInterval(function () {
			LineCode=$(".selectpicker").val();
			hours = [];
			hoursqty = [];
			CloseProgress = 0; //完工率
			LineName = []; //流水线数组
			LineOrderQty = []; //流水线当天订单总任务数量数组
			LineOrderCloseQty = []; //流水线当天订单总完成数量数组
			Week = 0; //本周分析
			Month = 0; //本月分析
			Chart(mychart1, mychart2, mychart3, mychart4, mychart5);
			}, 120000);
			interval1 = setInterval(function () {
			DataTable();
			}, 120000);
			}, 20000);
			setInterval(function () {
			LineCode=$(".selectpicker").val();
			//num+=1;
			//$("#tb_order").bootstrapTable('refreshOptions',{offset:num}); // pageNumber:1, 指定页码为第1页
			$("#tb_order").bootstrapTable('refresh');
			}, 10000);
			//根据窗口的大小变动图表 --- 重点
			window.onresize = function () {
			myChart1.resize();
			@@ -322,583 +410,640 @@
			})

			function Chart(mychart1, mychart2, mychart3, mychart4, mychart5) {
			$.ajax({
			url: "http://localhost:12298/api/loaddata/LineData",
			dataType: "JSON",
			async: false,//使用同步的方式,true为异步方式
			type: "Get",
			success: function (data) {
			console.log(data);
			$.each(data.data[0], function(index, val) {
			hours.push(val.hour+'点');
			hoursqty.push(parseFloat(val.Count).toFixed(2));
			// $.ajax({
			// url: "http://localhost:53860/api/loaddata/LineData",
			// dataType: "JSON",
			// async: false,//使用同步的方式,true为异步方式
			// type: "Get",
			// data:{"LineCode":LineCode,"LineCodeList":LineCodeList},
			// success: function (data) {
			var data= {"code":200,"data":[[{"hour":7,"Count":29.0000000000},{"hour":8,"Count":67.0000000000},{"hour":9,"Count":49.0000000000},{"hour":10,"Count":95.0000000000},{"hour":11,"Count":18.0000000000},{"hour":12,"Count":51.0000000000},{"hour":13,"Count":66.0000000000},{"hour":14,"Count":0.0000000000},{"hour":15,"Count":0.0000000000},{"hour":16,"Count":0.0000000000},{"hour":17,"Count":0.0000000000},{"hour":18,"Count":0.0000000000},{"hour":19,"Count":0.0000000000}],[{"qty":25608.0000000000,"FNAME":"","FSPECIFICATION":""},{"qty":5227.0000000000,"FNAME":"","FSPECIFICATION":""},{"qty":15922.0000000000,"FNAME":"","FSPECIFICATION":""},{"qty":375.0000000000,"FNAME":"","FSPECIFICATION":""}],[{"FBILLNO":"SCHBD00004252","FNAME":"商标KEG\\BCD315W\\莫兰灰","FSPECIFICATION":"BCD276WCP\\莫兰灰(GS-0012)\\深灰色\\韩电\\CCC","FSTATUS":"6"}],[{"FNAME":"一线","qty":30.0000000000,"inqty":0.0000000000},{"FNAME":"二线","qty":271.0000000000,"inqty":0.0000000000},{"FNAME":"三线","qty":100.0000000000,"inqty":0.0000000000},{"FNAME":"五线","qty":8.0000000000,"inqty":0.0000000000},{"FNAME":"六线","qty":20.0000000000,"inqty":0.0000000000}],[{"weekqty":3828.0000000000},{"weekqty":4063.0000000000},{"weekqty":25226.0000000000},{"weekqty":14099.0000000000}]]}
			$.each(data.data[0], function (index, val) {
			hours.push(val.hour + '点');
			hoursqty.push(parseFloat(val.Count).toFixed(2));

			});
			if(data.data[1].length>0){
			if (data.data[1].length > 0) {
			$("#OrderQty").html(parseFloat(data.data[1][0].qty).toFixed(2)); //总订单
			$("#OrderInQty").html(parseFloat(data.data[1][1].qty).toFixed(2));//已入库
			$("#FGQty").html(parseFloat(data.data[1][2].qty).toFixed(2)); //返工数
			$("#FBprogress").html(parseFloat((data.data[1][2].qty/data.data[1][0].qty)*100).toFixed(2)+"%"); //翻包率
			$("#FBprogress").html(parseFloat((data.data[1][2].qty / data.data[1][0].qty) * 100).toFixed(2) + "%"); //翻包率
			$("#OrderWork").html();//当前订单
			$("#PartName").html();
			$("#PartSpec").html();
			$("#SumDay").html(data.data[1][3].qty.toFixed(2)); //今日订单汇总
			}
			if(data.data[2].length>0){
			if (data.data[2].length > 0) {
			if(data.data[2][0].FSTATUS==1){
			$("#LineStus").html("计划");
			}if(data.data[2][0].FSTATUS==2){
			$("#LineStus").html("计划确认");
			}if(data.data[2][0].FSTATUS==3){
			$("#LineStus").html("下达");
			}if(data.data[2][0].FSTATUS==4){
			$("#LineStus").html("开工");
			}if(data.data[2][0].FSTATUS==5){
			$("#LineStus").html("完工");
			}if(data.data[2][0].FSTATUS==6){
			$("#LineStus").html("结案");
			}
			if(data.data[2][0].FSTATUS==7){
			$("#LineStus").html("结算");
			}
			$("#OrderWork").html(data.data[2][0].FBILLNO);//当前订单
			$("#PartName").html(data.data[2][0].FNAME); //当前物料名称
			$("#PartSpec").html(data.data[2][0].FSPECIFICATION);//当前物料规格

			}
			CloseProgress=parseFloat(data.data[1][1].qty/data.data[1][0].qty).toFixed(2); //完成率

			//今日全部流水线产量对比
			$.each(data.data[3], function(index, val) {
			LineName.push(val.FNAME);
			LineOrderQty.push(parseFloat(val.qty).toFixed(2));
			LineOrderCloseQty.push(parseFloat(val.inqty).toFixed(2));

			});

			//本周分析
			Week=parseFloat(25000/data.data[4][0].weekqty).toFixed(2);
			//本月分析
			Month=parseFloat(20000/data.data[4][2].weekqty).toFixed(2);
			},
			error: function (data) {

			}
			})


			option1 = {
			tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b}月 : {c}万"
			},
			xAxis: {
			type: 'category',
			boundaryGap: false,
			data: hours, //时间点数据
			axisLine: {
			show: true,
			lineStyle: {
			color: '#00c6ff',
			},
			},
			axisTick: {
			show: true,
			},
			axisLabel: {
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			}
			},
			yAxis: [{
			type: 'value',
			axisLine: {
			show: true,
			lineStyle: {
			color: '#00c6ff',
			width: 0, //隐藏y轴
			}
			},
			splitLine: { //网格线
			lineStyle: {
			type: 'dotted', //设置网格线类型 dotted：虚线 solid:实线
			},
			show: false //隐藏或显示
			},
			axisTick: {
			show: false,
			},
			axisLabel: {
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			},
			splitNumber: 5
			}],
			title: {
			show: true,
			text: '生产效率分析',
			x: 'left',
			textStyle: {
			color: '#00c6ff',
			fontSize: 18,
			fotweight: 'normal',
			fontFamily: "微软雅黑"
			}
			},
			legend: {
			icon: 'line',
			data: ['小时产能'],
			textStyle: {
			color: '#00c6ff',
			fontSize: 20,
			fontFamily: "微软雅黑"
			}
			},
			series: [
			{
			name: '小时产能',
			data: hoursqty, //时间点值
			type: 'line',
			smooth: true,
			itemStyle: {
			normal: {
			color: 'orange',
			lineStyle: {
			width: 4, //设置线条粗细
			shadowColor: 'rgba(255, 94, 91,.1)',
			shadowOffsetX: 3,
			shadowOffsetY: 5,
			// $("#PartName").each(function() {
			// var maxwidth =36;//显示多少字符
			// if ($(this).text().length > maxwidth) {
			// $(this).text($(this).text().substring(0, maxwidth));
			// $(this).html($(this).html() + '...');
			// }
			// });

			}
			},
			},
			textStyle: {
			fontFamily: "微软雅黑"
			}
			},
			]
			}

			const colorList = ['#47A2FF ', '#FBD444']

			option2 = {
			title: {
			text: '总完工率',
			subtext: CloseProgress*100+'%',
			textStyle: {
			fontSize: 20,
			color: '#00c6ff',
			lineHeight: 20,
			fontFamily: "微软雅黑"
			},
			subtextStyle: {
			fontSize: 18,
			color: '#00c6ff'
			},
			textAlign: 'center',
			left: '50%',
			top: '70%'
			},
			tooltip: {
			trigger: 'item',
			},
			legend: {
			type: 'scroll',
			icon: 'pin',
			show: false
			},
			color: colorList,
			series: [
			{
			name: '占比',
			type: 'pie',
			radius: [50, 80],
			center: ['50%', '50%'],
			label: {
			show: false
			},
			labelLine: {
			show: true
			},
			itemStyle: {
			borderWidth: 3,
			borderColor: '#000000'
			},
			data: [
			{ name: '总完工率', value: CloseProgress },
			{ name: '未完工率', value: 1-CloseProgress }
			],
			}
			]
			};

			option3 = {
			title: {
			text: '今日全部流水线产量对比',
			left: '0',
			top: 2,
			textStyle: {
			fontSize: 20,
			color: '#00c6ff',
			fontFamily: "微软雅黑"
			},
			},
			color: ['#5b9bd5', '#ed7d31', '#a9d18e', '#ffc000'],
			tooltip: {

			},
			grid: {
			left: '3%',
			right: '4%',
			bottom: '10%',
			containLabel: true
			},
			legend: {
			left: 'right',
			data: ['任务数', '完成数'],
			textStyle: {
			color: '#00c6ff',
			fontSize: 16,
			fontFamily: "微软雅黑"
			}

			},
			xAxis: [
			{
			type: 'category',
			data: LineName,
			axisTick: {
			alignWithLabel: true
			},

			axisLine: {
			show: true,
			lineStyle: {
			color: '#00c6ff',
			type: 'solid', //设置网格线类型 dotted：虚线 solid:实线
			width: 1, //隐藏y轴
			}
			},
			axisLabel: {
			show: true,
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			}
			}
			],
			yAxis: [
			{
			type: 'value',
			axisLine: {
			show: false,

			},
			splitLine: { //网格线
			lineStyle: {
			color: '#00c6ff',
			CloseProgress = parseFloat(data.data[1][1].qty / data.data[1][0].qty).toFixed(2); //完成率

			},
			show: true //隐藏或显示
			},
			axisLabel: {
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			}
			}
			],
			series: [
			{
			name: '任务数',
			type: 'bar',
			data: LineOrderQty
			},
			{
			name: '完成数',
			type: 'bar',
			data: LineOrderCloseQty
			}
			]
			};

			option4 = {
			title: [
			{
			text: '达成率',
			subtext: Week*100+'%',
			textStyle: {
			fontSize: 16,
			color: '#999',
			lineHeight: 20
			},
			subtextStyle: {
			fontSize: 28,
			color: '#00c6ff'
			},
			textAlign: 'center',
			left: '50%',
			top: '70%'
			},
			{
			show: true,
			text: '本周分析',
			textStyle: {
			color: '#00c6ff',
			fontSize: '16',
			},
			textAlign: 'center',
			left: '50%',
			top: '5%'
			}
			],
			tooltip: {
			trigger: 'item',
			},
			legend: {
			type: 'scroll',
			icon: 'pin',
			show: false
			},
			color: colorList,
			series: [
			{
			name: '姓名',
			type: 'pie',
			radius: [50, 80],
			center: ['50%', '50%'],
			label: {
			show: false
			},
			labelLine: {
			show: true
			},
			itemStyle: {
			borderWidth: 3,
			borderColor: '#000000'
			},
			data: [
			{ name: '达成率', value: Week },
			{ name: '未达成率', value: 1-Week }
			],
			}
			]
			};

			option5 = {
			title: [
			{
			text: '达成率',
			subtext: Month*100+'%',
			textStyle: {
			fontSize: 16,
			color: '#999',
			lineHeight: 20
			},
			subtextStyle: {
			fontSize: 28,
			color: '#00c6ff'
			},
			textAlign: 'center',
			left: '50%',
			top: '70%'
			},
			{
			show: true,
			text: '本月分析',
			textStyle: {
			color: '#00c6ff',
			fontSize: '16',
			},
			textAlign: 'center',
			left: '50%',
			top: '5%'
			}
			],
			tooltip: {
			trigger: 'item',
			},
			legend: {
			type: 'scroll',
			icon: 'pin',
			show: false
			},
			color: colorList,
			series: [
			{
			name: '姓名',
			type: 'pie',
			radius: [50, 80],
			center: ['50%', '50%'],
			label: {
			show: false
			},
			labelLine: {
			show: true
			},
			itemStyle: {
			borderWidth: 3,
			borderColor: '#000000'
			},
			data: [
			{ name: '达成率', value: Month },
			{ name: '未达成率', value: 1-Month }
			],
			}
			]
			};


			mychart1.setOption(option1);
			mychart2.setOption(option2);
			mychart3.setOption(option3);
			mychart4.setOption(option4);
			mychart5.setOption(option5);

			}

			function DataTable(){
			$('#tb_order').bootstrapTable({
			url: 'http://localhost:12298/api/loaddata/LineTableData',
			//data: dataJson,
			method: 'get', //请求方式（*）
			dataType: "json",
			queryParams: queryParams,//传递参数（*）
			striped: false, //是否显示行间隔色
			cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
			pagination: true, //是否显示分页（*）
			sortable: false, //是否启用排序
			sortable: false, //是否启用排序
			search: false, //是否启用搜索框
			sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
			pageNumber: 1, //初始化加载第一页，默认第一页
			pageSize: 8, //每页的记录行数（*）
			pageList: [8], //可供选择的每页的行数（*）
			strictSearch: false, //设置为 true启用全匹配搜索，否则为模糊搜索
			clickToSelect: true, //是否启用点击选中行
			singleSelect: true, //设置True 将禁止多选
			uniqueId: "ID", //每一行的唯一标识，一般为主键列
			cardView: false, //是否显示详细视图
			detailView: false, //是否显示父子表

			columns: [
			{ field: 'FBILLNO', title: '生产订单号', align: "left" },
			{ field: 'FNUMBER', title: '产品编码', align: "left" },
			{ field: 'FNAME', title: '产品名称', align: "left" },
			{ field: 'FQTY', title: '任务数量', align: "left",width:100 ,formatter:function(value, row, index){
			return parseFloat(value).toFixed(2);
			}},
			{ field: 'FRepQuaAuxQty', title: '完成数量', align: "left",width:100,formatter:function(value, row, index){
			return parseFloat(value).toFixed(2);
			} },
			{ field: 'FSTOCKINQUAAUXQTY', title: '入库数量', align: "left",width:100,formatter:function(value, row, index){
			return parseFloat(value).toFixed(2);
			} },
			{
			field: 'FSTATUS', title: '状态', align: "left",width:100,formatter:function(value, row, index) {
			switch(value) {
			case '1':
			return "计划";
			break;
			case '2':
			return "计划确认";
			break;
			case '3':
			return "下达";
			break;
			case '4':
			return "开工";
			break;
			case '5':
			return "完工";
			break;
			case '6':
			return "结案";
			default:

			}
			}
			},
			{
			field: 'Progress', title: '进度', align: "left", formatter: function (value, row, index) {
			var res = 100 * row.FRepQuaAuxQty / row.FQTY;
			//return ["<div class='progress'> <div class='progress-bar' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%'>" + res.toFixed(2) + "</div> </div>"];
			return "<div class='w40 div_co pw'><div class='PA' style='text-align:right;color:#4b2dba;float:right;height:20px;line-height:25px'>" + res.toFixed(2) + "%</div><div class='progress' style='margin-top:4px;'><div class='progress-bar progress-diy-info' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%';text-align:center;'></div></div></div>";
			}
			}
			],
			onClickRow: function (row, $element) {
			//今日全部流水线产量对比
			$.each(data.data[3], function (index, val) {
			LineName.push(val.FNAME);
			LineOrderQty.push(parseFloat(val.qty).toFixed(2));
			LineOrderCloseQty.push(parseFloat(val.inqty).toFixed(2));

			});

			//本周分析
			Week = parseFloat(data.data[4][1].weekqty / data.data[4][0].weekqty).toFixed(2);
			console.log(Week);
			//本月分析
			Month = parseFloat(data.data[4][3].weekqty / data.data[4][2].weekqty).toFixed(2);
			console.log(Month);
			// },
			// error: function (data) {

			// }
			// })


			option1 = {
			tooltip: {
			trigger: 'item',
			formatter: "{a} <br/>{b}月 : {c}万"
			},
			xAxis: {
			type: 'category',
			boundaryGap: false,
			data: hours, //时间点数据
			axisLine: {
			show: true,
			lineStyle: {
			color: '#00c6ff',
			},
			},
			axisTick: {
			show: true,
			},
			axisLabel: {
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			}
			},
			yAxis: [{
			type: 'value',
			axisLine: {
			show: true,
			lineStyle: {
			color: '#00c6ff',
			width: 0, //隐藏y轴
			}
			},
			splitLine: { //网格线
			lineStyle: {
			type: 'dotted', //设置网格线类型 dotted：虚线 solid:实线
			},
			show: false //隐藏或显示
			},
			axisTick: {
			show: false,
			},
			axisLabel: {
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			},
			splitNumber: 5
			}],
			title: {
			show: true,
			text: '生产效率分析',
			x: 'left',
			textStyle: {
			color: '#00c6ff',
			fontSize: 18,
			fotweight: 'normal',
			fontFamily: "微软雅黑"
			}
			},
			legend: {
			icon: 'line',
			data: ['小时产能'],
			textStyle: {
			color: '#00c6ff',
			fontSize: 20,
			fontFamily: "微软雅黑"
			}
			},
			series: [
			{
			name: '小时产能',
			data: hoursqty, //时间点值
			type: 'line',
			smooth: true,
			itemStyle: {
			normal: {
			color: 'orange',
			lineStyle: {
			width: 4, //设置线条粗细
			shadowColor: 'rgba(255, 94, 91,.1)',
			shadowOffsetX: 3,
			shadowOffsetY: 5,
			}
			},
			},
			textStyle: {
			fontFamily: "微软雅黑"
			}
			},
			]
			}

			const colorList = ['#47A2FF ', '#FBD444']

			option2 = {
			title: {
			text: '总完工率',
			subtext: (CloseProgress * 100).toFixed(0) + '%',
			textStyle: {
			fontSize: 20,
			color: '#00c6ff',
			lineHeight: 20,
			fontFamily: "微软雅黑"
			},
			subtextStyle: {
			fontSize: 18,
			color: '#00c6ff'
			},
			textAlign: 'center',
			left: '50%',
			top: '70%'
			},
			tooltip: {
			trigger: 'item',
			},
			legend: {
			type: 'scroll',
			icon: 'pin',
			show: false
			},
			color: colorList,
			series: [
			{
			name: '占比',
			type: 'pie',
			radius: [50, 80],
			center: ['50%', '50%'],
			label: {
			show: false
			},
			labelLine: {
			show: false
			},
			itemStyle: {
			borderWidth: 3,
			borderColor: '#000000'
			},
			data: [
			{ name: '总完工率', value: CloseProgress >1?1:CloseProgress},
			{ name: '未完工率', value: CloseProgress>1?0:1-CloseProgress }
			],
			}
			]
			};

			option3 = {
			title: {
			text: '今日全部流水线产量对比',
			left: '0',
			top: 2,
			textStyle: {
			fontSize: 20,
			color: '#00c6ff',
			fontFamily: "微软雅黑"
			},
			},
			color: ['#5b9bd5', '#ed7d31', '#a9d18e', '#ffc000'],
			tooltip: {

			},
			grid: {
			left: '3%',
			right: '4%',
			bottom: '10%',
			containLabel: true
			},
			legend: {
			left: 'right',
			data: ['任务数', '完成数'],
			textStyle: {
			color: '#00c6ff',
			fontSize: 16,
			fontFamily: "微软雅黑"
			}

			},
			xAxis: [
			{
			type: 'category',
			data: LineName,
			axisTick: {
			alignWithLabel: true
			},

			axisLine: {
			show: true,
			lineStyle: {
			color: '#00c6ff',
			type: 'solid', //设置网格线类型 dotted：虚线 solid:实线
			width: 1, //隐藏y轴
			}
			},
			axisLabel: {
			show: true,
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			}
			}
			],
			yAxis: [
			{
			type: 'value',
			axisLine: {
			show: false,

			},
			splitLine: { //网格线
			lineStyle: {
			color: '#00c6ff',

			},
			show: true //隐藏或显示
			},
			axisLabel: {
			textStyle: {
			color: '#00c6ff', //坐标值得具体的颜色
			fontSize: '16'
			}
			}
			}
			],
			series: [
			{
			name: '任务数',
			type: 'bar',
			data: LineOrderQty
			},
			{
			name: '完成数',
			type: 'bar',
			data: LineOrderCloseQty
			}
			]
			};

			option4 = {
			title: [
			{
			text: '达成率',
			subtext: (Week * 100).toFixed(0) + '%',
			textStyle: {
			fontSize: 16,
			color: '#999',
			lineHeight: 20
			},
			subtextStyle: {
			fontSize: 28,
			color: '#00c6ff'
			},
			textAlign: 'center',
			left: '50%',
			top: '70%'
			},
			{
			show: true,
			text: '本周分析',
			textStyle: {
			color: '#00c6ff',
			fontSize: '16',
			},
			textAlign: 'center',
			left: '50%',
			top: '5%'
			}
			],
			tooltip: {
			trigger: 'item',
			},
			legend: {
			type: 'scroll',
			icon: 'pin',
			show: false
			},
			color: colorList,
			series: [
			{
			name: '姓名',
			type: 'pie',
			radius: [50, 80],
			center: ['50%', '50%'],
			label: {
			show: false
			},
			labelLine: {
			show: false
			},
			itemStyle: {
			borderWidth: 3,
			borderColor: '#000000'
			},
			data: [
			{ name: '达成率', value: Week>1?1:Week },
			{ name: '未达成率', value: Week>1?0:1-Week }
			],
			}
			]
			};

			option5 = {
			title: [
			{
			text: '达成率',
			subtext: (Month * 100).toFixed(0) + '%',
			textStyle: {
			fontSize: 16,
			color: '#999',
			lineHeight: 20
			},
			subtextStyle: {
			fontSize: 28,
			color: '#00c6ff'
			},
			textAlign: 'center',
			left: '50%',
			top: '70%'
			},
			{
			show: true,
			text: '本月分析',
			textStyle: {
			color: '#00c6ff',
			fontSize: '16',
			},
			textAlign: 'center',
			left: '50%',
			top: '5%'
			}
			],
			tooltip: {
			trigger: 'item',
			},
			legend: {
			type: 'scroll',
			icon: 'pin',
			show: false
			},
			color: colorList,
			series: [
			{
			name: '姓名',
			type: 'pie',
			radius: [50, 80],
			center: ['50%', '50%'],
			label: {
			show: false
			},
			labelLine: {
			show: false
			},
			itemStyle: {
			borderWidth: 3,
			borderColor: '#000000'
			},
			data: [
			{ name: '达成率', value: Month>1?1:Month},
			{ name: '未达成率', value: Month>1?0:1-WeeMonthk}
			],
			}
			]
			};


			mychart1.setOption(option1);
			mychart2.setOption(option2);
			mychart3.setOption(option3);
			mychart4.setOption(option4);
			mychart5.setOption(option5);

			}

			function DataTable() {
			$('#tb_order').bootstrapTable({
			url: 'http://localhost:12298/api/loaddata/LineTableData',
			//data: dataJson,
			method: 'get', //请求方式（*）
			dataType: "json",
			queryParams :queryParams,
			striped: false, //是否显示行间隔色
			cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
			pagination: true, //是否显示分页（*）
			sortable: false, //是否启用排序
			sortable: false, //是否启用排序
			search: false, //是否启用搜索框
			sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
			pageNumber: 1, //初始化加载第一页，默认第一页
			pageSize: 10, //每页的记录行数（*）
			pageList: [10], //可供选择的每页的行数（*）
			strictSearch: false, //设置为 true启用全匹配搜索，否则为模糊搜索
			clickToSelect: true, //是否启用点击选中行
			singleSelect: true, //设置True 将禁止多选
			uniqueId: "ID", //每一行的唯一标识，一般为主键列
			cardView: false, //是否显示详细视图
			detailView: false, //是否显示父子表

			columns: [
			{ field: 'FBILLNO', title: '生产订单号', align: "left" },
			{ field: 'FNUMBER', title: '产品编码', align: "left" },
			{ field: 'FNAME', title: '产品名称', align: "left" },
			{
			field: 'FQTY', title: '任务数量', align: "left", width: 100, formatter: function (value, row, index) {
			return parseFloat(value).toFixed(2);
			}
			},
			{
			field: 'FRepQuaAuxQty', title: '完成数量', align: "left", width: 100, formatter: function (value, row, index) {
			return parseFloat(value).toFixed(2);
			}
			},
			{
			field: 'FSTOCKINQUAAUXQTY', title: '入库数量', align: "left", width: 100, formatter: function (value, row, index) {
			return parseFloat(value).toFixed(2);
			}
			},
			{
			field: 'FSTATUS', title: '状态', align: "left", width: 100, formatter: function (value, row, index) {
			switch (value) {
			case '1':
			"计划";
			break;
			case '2':
			"计划确认";
			break;
			case '3':
			"下达";
			break;
			case '4':
			"开工";
			break;
			case '5':
			"完工";
			break;
			case '6':
			"结案";
			break;
			case '7':
			"结算";
			default:

			}
			}
			},
			{
			field: 'Progress', title: '进度', align: "left", formatter: function (value, row, index) {
			var res = 100 * row.FRepQuaAuxQty / row.FQTY;
			//return ["<div class='progress'> <div class='progress-bar' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%'>" + res.toFixed(2) + "</div> </div>"];
			return "<div class='w40 div_co pw'><div class='PA' style='text-align:right;color:#4b2dba;float:right;height:20px;line-height:25px'>" + res.toFixed(2) + "%</div><div class='progress' style='margin-top:4px;'><div class='progress-bar progress-diy-info' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%';text-align:center;'></div></div></div>";
			}
			}
			],
			onClickRow: function (row, $element) {

			},
			onCheck: function (row, $element) {

			},
			onLoadSuccess: function (row) {
			var num_total = (row.total)/ 10
			if (num >= num_total) {
			num = 0
			}
			//var a = $('#tb_order').bootstrapTable('getSelections');
			}

			})
			}
			//得到查询的参数
			function queryParams(params) {
			num += 1;
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
			LineCode:LineCode,
			limit: params.limit, //页面大小
			offset: num, //页码
			};
			return temp;
			}
			//选择事件
			function selectOnchang(obj) {
			LineCode=obj.options[obj.selectedIndex].value;
			Chart(mychart1, mychart2, mychart3, mychart4, mychart5)
			//DataTable();
			$('#tb_order').bootstrapTable('refresh');
			}
			</script>
			</head>

			},
			onCheck: function (row, $element) {
			<body>
			<div class='title'>韩电流水线看板</div>
			<div class="clock0">
			<select class="selectpicker show-tick form-control" data-live-search="true" title="搜索或选择流水线" style="float: left;" onchange="selectOnchang(this)">
			<option value='509' selected="selected">1#流水线</option>
			<option value='510'>2#流水线</option>
			<option value='511'>3#流水线</option>
			<option value='512'>4#流水线</option>
			<option value='513'>5#流水线</option>
			<option value='514'>6#流水线</option>
			</select>
			</div>
			<div class="clock">
			<ul>
			<li id="Date"></li>
			<li id="hours"> </li>
			<li id="point">:</li>
			<li id="min"> </li>
			<li id="point">:</li>
			<li id="sec"> </li>
			</ul>

			</div>
			<div class="col-sm-8">
			<div class="col-sm-7">
			<div id="mychart1"></div>
			</div>
			<div class="col-sm-3">
			<ul id="cList">
			<li><span>本线状态：</span><span id="LineStus"></span></li>
			<li><span>总订单：</span><span id="OrderQty">0</span></li>
			<li><span>已完工：</span><span id="OrderInQty">0</span></li>
			<li><span>返工数：</span><span id="FGQty">0</span></li>
			<li><span>翻包率：</span><span id="FBprogress">0%</span></li>
			<li><span>当前订单：</span><span id="OrderWork"></span></li>
			<li><span>当前物料名称：</span><span id="PartName"></span></li>
			<li><span>当前规格：</span><span id="PartSpec"></span></li>
			<li><span>今日总汇报：</span><span id="SumDay">0</span></li>



			</ul>
			</div>
			<div class="col-sm-2">
			<div id="mychart2"></div>
			</div>
			</div>
			<div class="col-sm-4">
			<div id="mychart3"></div>
			</div>
			<div class="col-sm-8">
			<div id="cList0">
			<ul id="cList1">
			<li><span>本线当日全部订单</span></li>
			</ul>
			</div>
			<div id="cList2">
			<table id="tb_order" class="table-condensed table-responsive tb_order" data-filter-control="true"></table>
			</div>
			</div>
			<div class="col-sm-4">
			<div class="col-sm-6">
			<div id="mychart4"></div>
			</div>
			<div class="col-sm-6">
			<div id="mychart5"></div>
			</div>
			</div>
			</body>

			},
			onLoadSuccess: function (row) {
			var a = $('#tb_order').bootstrapTable('getSelections');
			}

			})
			}
			//得到查询的参数
			function queryParams(params) {
			num += 1;
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
			limit: params.limit, //页面大小
			offset: num, //页码
			};
			return temp;
			}
			</script>
			</head>

			<body>
			<div class='title'>韩电流水线看板</div>
			<div class="clock0">1#流水线</div>
			<div class="clock">
			<ul>
			<li id="Date"></li>
			<li id="hours"> </li>
			<li id="point">:</li>
			<li id="min"> </li>
			<li id="point">:</li>
			<li id="sec"> </li>
			</ul>

			</div>
			<div class="col-sm-8">
			<div class="col-sm-7">
			<div id="mychart1"></div>
			</div>
			<div class="col-sm-3">
			<ul id="cList">
			<li>本线状态：<span id="LineStus">执行中</span></li>
			<li>总订单：<span id="OrderQty">0</span></li>
			<li>已入库：<span id="OrderInQty">0</span></li>
			<li>返工数：<span id="FGQty">0</span></li>
			<li>翻包率：<span id="FBprogress">0%</span></li>
			<li>当前订单：<span id="OrderWork"></span></li>
			<li>当前物料名称：<span id="PartName"></span></li>
			<li>当前规格：<span id="PartSpec"></span></li>
			<li>今日总汇报：<span id="SumDay">0</span></li>



			</ul>
			</div>
			<div class="col-sm-2">
			<div id="mychart2"></div>
			</div>
			</div>
			<div class="col-sm-4">
			<div id="mychart3"></div>
			</div>
			<div class="col-sm-8">
			<div id="cList0">
			<ul id="cList1">
			<li><span>本线当日全部订单</span></li>
			</ul>
			</div>
			<div id="cList2">
			<table id="tb_order" class="table-condensed table-responsive tb_order" data-filter-control="true"></table>
			</div>
			</div>
			<div class="col-sm-4">
			<div class="col-sm-6">
			<div id="mychart4"></div>
			</div>
			<div class="col-sm-6">
			<div id="mychart5"></div>
			</div>
			</div>
			</body>

			</html>
			</html>