index.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>融裕行计划订单平衡概览</title>
<link rel="stylesheet" href="./eslydsj/css/base.css">
<link rel="stylesheet" href="./echart/css/bootstrap-4.2.1.css">
<style>
.pull-left{
float: left;
}
.pull-right{
float: right;
}
.title{
padding: 0;font-size: 1.8rem;color:
}
.border_t{
height: 164px;
border-bottom: 1px solid
}
</style>
</head>
<body class="con">
<!--顶部-->
<header class="header left">
<div class="left nav">
<ul>
<li class="@if(in_array(request()->path(),['/']) ) nav_active @endif"><i class="nav_1"></i><a href="{{ route('/') }}">生产数据概览</a> </li>
<li class="@if(in_array(request()->path(),['predict']) ) nav_active @endif"><i class="nav_3"></i><a href="{{ route('predict') }}">计划订单平衡概览</a> </li>
</ul>
</div>
<div class="header_center left">
<h1><strong>融裕行计划订单平衡概览</strong></h1>
</div>
<div class="right nav text_right">
<ul style="width: 100%;">
<li class="data" id="localtime" style="width: 100%;display: block;text-align: right;padding-right: 20px;"></li>
</ul>
</div>
</header>
<!--内容部分-->
<div class="con left">
<!--统计分析图-->
<div class="div_any">
<div class="left div_any01">
<div class="div_any_child">
<div class="div_any_title">各工厂接单比例 </div>
<div class="col-md-12 border_t">
<div class="col-md-4 pull-left title">融裕行</div>
<div class="col-md-8 pull-left" style="padding: 0"><div id="char0" class="p_chart" style="padding: 5px 0"></div></div>
<div style="clear: both"></div>
</div>
<div class="col-md-12 border_t">
<div class="col-md-4 pull-left title">源 盛</div>
<div class="col-md-8 pull-left" style="padding: 0"><div id="char1" class="p_chart" style="padding: 5px 0""></div></div>
<div style="clear: both"></div>
</div>
<div class="col-md-12 border_t">
<div class="col-md-4 pull-left title">茂 盛</div>
<div class="col-md-8 pull-left" style="padding: 0"><div id="char2" class="p_chart" style="padding: 5px 0""></div></div>
<div style="clear: both"></div>
</div>
<div class="col-md-12 border_t">
<div class="col-md-4 pull-left title">和 盛</div>
<div class="col-md-8 pull-left" style="padding: 0"><div id="char3" class="p_chart" style="padding: 5px 0""></div></div>
<div style="clear: both"></div>
</div>
<div class="col-md-12 border_t">
<div class="col-md-4 pull-left title">金 路</div>
<div class="col-md-8 pull-left" style="padding: 0"><div id="char4" class="p_chart" style="padding: 5px 0""></div></div>
<div style="clear: both"></div>
</div>
<div style="clear: both"></div>
</div>
</div>
<div class="div_any02 left">
<div class="div_any_child div_height">
<div class="table_p">
<table>
<thead>
<tr>
<th>{{ $ym }}计划</th>
<th>车工人数</th>
<th>产能工天</th>
<th>已排工天</th>
<th>剩余工天</th>
<th>比例</th>
<th>计划产值</th>
<th>平均台产</th>
<th>计划台产</th>
</tr>
</thead>
<tbody class="has-many-extra-forms">
</tbody>
<template class="extra-tpl">
<tr>
<td class="factory_name"></td>
<td class="group_people"></td>
<td class="sum_day"></td>
<td class="to_sum_day"></td>
<td class="sy_day"></td>
<td class="day_rate"></td>
<td class="pro_yield"></td>
<td class="turner_adam"></td>
<td class="plan_adam"></td>
</tr>
</template>
</table>
</div>
</div>
<div class="div_any_child" style="height: 540px">
<div class="div_any_title">各周工天平衡 </div>
<div style="height: 500px;overflow: hidden">
<div id="char6" class="map_div" style=""></div>
</div>
<div style="clear: both"></div>
</div>
</div>
<div class="right div_any01">
<div class="div_any_child div_height">
<div class="div_any_title">{{ $ym }}各业务部接单占比</div>
<p id="char7" class="div_height"></p>
</div>
<div class="div_any_child" style="height: 540px;overflow: hidden">
<div class="div_any_title">{{ $ym }}计划品类分布 </div>
<div >
<div id="char8" class="map_div" ></div>
</div>
</div>
</div>
</div>
</div>
<script src="./echart/js/jquery.min.js"></script>
<script src="./echart/js/echarts-4.2.1.min.js"></script>
<script src="./eslydsj/js/base.js"></script>
<script src="./eslydsj/js/index.js"></script>
<script src="./js/initTime.js"></script>
<script>
$(function () {
var index = 0;
var tpl = $('template.extra-tpl');
var now_month = '201912';
function init_extra(months){
$('.has-many-extra-forms').html('');
var data = {
'_token': "{{ csrf_token() }}",
'ym': months,
};
$.ajax({
url:'{{ route('getPredict') }}',
data:data,
type:'GET',
success:function(data) {
for (var i =0; i< data.facotry_rate.length;i++){
ryhChart(data.facotry_rate[i],i);
}
for (var i =0; i< data.list.length;i++){
addHtml(data.list[i])
}
ryhChart6(data.diff_day_list)
ryhChart7(data.branch_name_list)
ryhChart8(data.cate_name_list)
}
});
}
init_extra(now_month)
function addHtml(data){
index++;
var template = tpl.html().replace(/__LA_KEY__/g, index).replace(/factory_name/g, 'factory_name_'+index)
.replace(/__LA_KEY__/g, index).replace(/group_people/g, 'group_people_'+index)
.replace(/__LA_KEY__/g, index).replace(/sum_day/g, 'sum_day_'+index)
.replace(/__LA_KEY__/g, index).replace(/sy_day/g, 'sy_day_'+index)
.replace(/__LA_KEY__/g, index).replace(/day_rate/g, 'day_rate_'+index)
.replace(/__LA_KEY__/g, index).replace(/pro_yield/g, 'pro_yield_'+index)
.replace(/__LA_KEY__/g, index).replace(/turner_adam/g, 'turner_adam_'+index)
.replace(/__LA_KEY__/g, index).replace(/plan_adam/g, 'plan_adam_'+index);
$('.has-many-extra-forms').append(template);
$('.factory_name_'+index).html(data['factory_name'])
$('.group_people_'+index).html(data['group_people'])
$('.sum_day_'+index).html(data['sum_day'])
$('.to_sum_day_'+index).html(data['to_sum_day'])
$('.sy_day_'+index).html(data['sy_day'])
$('.day_rate_'+index).html(data['day_rate']+'%')
$('.pro_yield_'+index).html(data['pro_yield']+'万')
$('.turner_adam_'+index).html('¥'+data['turner_adam'])
$('.plan_adam_'+index).html('¥'+data['plan_adam'])
}
})
</script>
</body>
</html>