xuli
/
JinHaoPanel
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

进度看板

master
fyw 2 years ago
parent
89b462f674
commit
ab75684665
4 changed files with 2672 additions and 1732 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3465
      NFine.Application/SRM/WatchPanelApp.cs
  2. 4
      NFine.Web/Areas/SRM/Controllers/WatchPanel/WatchPanelController.cs
  3. 927
      NFine.Web/Areas/SRM/Views/WatchPanel/PanelWIPZhiXingDa3.cshtml
  4. 8
      NFine.Web/Views/Login/Index.cshtml

3465
NFine.Application/SRM/WatchPanelApp.cs
File diff suppressed because it is too large
View File

4
NFine.Web/Areas/SRM/Controllers/WatchPanel/WatchPanelController.cs
View File

@ -398,6 +398,10 @@ namespace NFine.Web.Areas.SRM.Controllers
{
return View();
}
public virtual ActionResult PanelWIPZhiXingDa3()
{
return View();
}
public virtual ActionResult PanelCK()
{
return View();

927
NFine.Web/Areas/SRM/Views/WatchPanel/PanelWIPZhiXingDa3.cshtml
View File

@ -0,0 +1,927 @@

<!DOCTYPE html>
<html>
<head>
<!--更多资源： -->
<meta charset="utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>执行看板</title>
<!--大屏-->
<link type="text/css" href="~/Content/Cust003/css/public.css" rel="stylesheet" />
<link type="text/css" href="~/Content/Cust003/css/icon.css" rel="stylesheet" />
<link type="text/css" href="~/Content/Cust003/css/index.css" rel="stylesheet" />
<link rel="stylesheet" href="~/Content/Cust069/fonts/icomoon.css">
<script src="~/Content/js/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
@*<script src="~/Content/Cust003/js/jquery-1.11.0.min.js" type="text/javascript"></script>*@
<script src="~/Content/Cust003/js/jquery.numscroll.js"
type="text/javascript"
charset="utf-8"></script>
<script src="~/Content/js/echarts/echarts5.3.3.js"></script>
<script src="~/Content/js/echarts4.8/echarts-liquidfill.js"></script>
<style>
h3 {
color: #FFFFFF;
text-shadow: #05d1fc 0px 1px 3px, #05d1fc 1px 0px 3px,#05d1fc 0px -1px 3px, #05d1fc -1px 0px 3px;
filter: glow(color=#00FFCC,strength=3);
}
.rightMain_top {
width: 100%;
padding-bottom: 0.1rem;
}
.animationNone {
animation: none !important;
}
.CustDiv1 ul li:nth-child(1), .CustDiv1 div div ul li:nth-child(1) {
width: 5% !important;
}
.CustDiv1 ul li:nth-child(2), .CustDiv1 div div ul li:nth-child(2) {
/* width: 28% !important; */
}
.CustDiv1 ul li:nth-child(3), .CustDiv1 div div ul li:nth-child(3) {
width: 11% !important;
}
.CustDiv1 ul li:nth-child(4), .CustDiv1 div div ul li:nth-child(4) {
width: 11% !important;
}
.CustDiv1 ul li:nth-child(5), .CustDiv1 div div ul li:nth-child(5) {
width: 19% !important;
}
.CustDiv1 ul li:nth-child(6), .CustDiv1 div div ul li:nth-child(6) {
width: 11% !important;
}
.CustDiv4 ul li:nth-child(1), .CustDiv4 div div ul li:nth-child(1) {
width: 5% !important;
}
.CustDiv4 ul li:nth-child(2), .CustDiv4 div div ul li:nth-child(2) {
width: 18% !important;
}
.CustDiv4 ul li:nth-child(3), .CustDiv4 div div ul li:nth-child(3) {
width: 26% !important;
}
.CustDiv4 ul li:nth-child(4), .CustDiv4 div div ul li:nth-child(4) {
width: 11% !important;
}
.CustDiv4 ul li:nth-child(5), .CustDiv4 div div ul li:nth-child(5) {
width: 11% !important;
}
.CustDiv4 ul li:nth-child(6), .CustDiv4 div div ul li:nth-child(6) {
width: 18% !important;
}
.CustDiv4 ul li:nth-child(7), .CustDiv4 div div ul li:nth-child(7) {
width: 11% !important;
}
.CustDiv2 ul li:nth-child(1), .CustDiv2 div div ul li:nth-child(1) {
width: 22% !important;
}
.CustDiv2 ul li:nth-child(2), .CustDiv2 div div ul li:nth-child(2) {
width: 15% !important;
}
.CustDiv2 ul li:nth-child(3), .CustDiv2 div div ul li:nth-child(3) {
width: 15% !important;
}
.CustDiv2 ul li:nth-child(4), .CustDiv2 div div ul li:nth-child(4) {
width: 15% !important;
}
.CustDiv2 ul li:nth-child(5), .CustDiv2 div div ul li:nth-child(5) {
width: 15% !important;
}
.CustDiv2 ul li:nth-child(6), .CustDiv2 div div ul li:nth-child(6) {
width: 8% !important;
}
.CustDiv2 ul li:nth-child(7), .CustDiv2 div div ul li:nth-child(7) {
width: 10% !important;
}
.leftMain_top, .leftMain_bottom {
height: calc(46.5%);
}
.leftMain_topIn, .leftMain_bottomIn, .leftMain_topIn ul:nth-child(1),
.leftMain_bottomIn ul:nth-child(1), .rightMain_bottom, .rightMain_bottomIn {
height: 100%;
}
img {
height: 0.2rem;
width: 0.5rem;
padding-top: 0.05rem;
}
.bg {
padding-top: 0.01rem;
}
.title {
height: 8%;
text-shadow: #01db78 0px 2px 3px, #01db78 1px 0px 3px, #05d1fc 0px -2px 3px, #05d1fc -1px 0px 3px;
}
.TopName {
vertical-align: middle;
text-align: center;
font-size: 30px;
font-weight: 700;
color: white;
}
.TopNameTime {
vertical-align: middle;
text-align: right;
font-size: 10px;
font-weight: 700;
color: white;
}
/*td {
box-sizing:inherit;
}*/
.rightMain_bottomIn .biaoge_list ul li {
overflow: hidden;
padding-right: 0px;
}
#div1 {
display: flex;
}
#div1-C1 {
font-size: 18px;
margin-left: 115px;
margin-top: 50px;
}
#div1-C1 div {
margin-top: 20px;
color: white;
text-align: center;
width: 130px;
}
#div1-C2 {
font-size: 18px;
margin-left: 15px;
margin-top: 50px;
}
#div1-C2 div {
margin-top: 23px;
width: 200px;
height: 20px;
background-color: #0000CD;
text-align: center;
}
#div1-C3 {
font-size: 18px;
margin-left: 15px;
margin-top: 50px;
}
#div1-C3 div {
margin-top: 20px;
color: white;
/*border-left:solid 1px #AFEEEE;
border-right:solid 1px #AFEEEE;
border-radius:25px;*/
text-align: center;
width: 30px;
}
#div3 {
display: flex;
color: white;
}
#div3-C1 {
width: 50%;
}
#div3-C2 {
width: 50%;
}
#div3-C1-C1 {
text-align: center;
width: 100%;
font-size: 25px;
background-color: #6495ED;
}
#div3-C1-C2 {
margin-top: 10px;
display: flex;
}
#div3-C1-C2-div1 {
width: 25px;
margin-left: 20px;
}
#div3-C1-C2-div2 {
width: 25px;
margin-left: 20px;
}
#div3-C2-C1 {
text-align: center;
width: 97%;
font-size: 25px;
background-color: #6495ED;
}
#div3-C2-C2 {
margin-top: 10px;
display: flex;
}
#div3-C2-C2-div1 {
width: 25px;
}
#div3-C2-C2-div2 {
width: 20px;
}
#div3-C1-C2 span {
margin-left: 20px;
text-align: center;
}
#div3-C2-C2 span {
margin-left: 20px;
text-align: center;
}
#div1-C2 {
color: white;
text-align: center;
}
</style>
<script type="text/javascript">
document.documentElement.style.fontSize =
(document.documentElement.clientWidth / 768) * 100 + 'px'
</script>
</head>
<body>
<div class="bg">
<table class="title">
<tr>
<td style="width:20%">
<div class="TopNamelogo" id="TopNamelogo">
<img src="~/Content/img/zhenxiang.png" border="0" class="logoclass" />
@*<img src="~/Content/img/wechat.jpg" border="0" class="logoclass" />*@
</div>
</td>
<td style="width:60%">
<div class="TopName" id="TopName">进度看板</div>
</td>
<td style="width:20%">
<div class="TopNameTime" id="TopNameTime"></div>
</td>
</tr>
</table>
@*<div class="title">执行看板</div>*@
<div class="leftMain_top" style="height:90%">
<div class="leftMain_topIn">
<ul>
<li class="LineLi" style="width:100%">
<div class="rightMain_bottom">
<div class="rightMain_bottomIn">
@*<h3> 插件车间生产加工数据</h3>*@
<div class="biaoge biaoge_list" id="marqueelist2"
style="width: 100%; ">
<div class="biaoge_listIn CustDiv1">
<ul class="ul_title">
<li>序号</li>
<li>生产编号</li>
<li>产品名称</li>
<li>用户单位</li>
<li>客户交货期</li>
<li>生产状态</li>
<li>进度</li>
</ul>
<div class="ul_list" id="marqueeCust2">
<div class="ul_listIn ul_listInCust" id="marqueeCustCH2">
</div>
</div>
</div>
</div>
<span class="border_bg_leftTop"></span>
<span class="border_bg_rightTop"></span>
<span class="border_bg_leftBottom"></span>
<span class="border_bg_rightBottom"></span>
</div>
</div>
</li>
</ul>
</div>
</div>
@*</div>*@
<div style="clear: both"></div>
</div>
<script>
var DataF = 30;// 300;//单位秒 //刷新数据时间
var _BarWidth = "25%";
var _barBorderRadius_M = 2;
$(function () {
getTime();
GetDataZong();
//刷新数据
timer = setInterval(function () {
GetDataZong();
}, DataF * 1000);
});
function getTime() {
var days = new Array("日", "一", "二", "三", "四", "五", "六");
var currentDT = new Date();
var y, m, date, day, hs, ms, ss, theDateStr;
y = currentDT.getFullYear(); //四位整数表示的年份
m = currentDT.getMonth() < 10 ? '0' + (currentDT.getMonth() + 1) : (currentDT.getMonth() + 1); //月
date = currentDT.getDate() < 10 ? '0' + currentDT.getDate() : currentDT.getDate(); //日
day = currentDT.getDay(); //星期
hs = currentDT.getHours() < 10 ? '0' + currentDT.getHours() : currentDT.getHours(); //时
ms = currentDT.getMinutes() < 10 ? '0' + currentDT.getMinutes() : currentDT.getMinutes(); //分
ss = currentDT.getSeconds() < 10 ? '0' + currentDT.getSeconds() : currentDT.getSeconds(); //秒
theDateStr = y + "-" + m + "-" + date + " " + hs + ":" + ms + ":" + ss;
//填充到组件中
$("#TopNameTime").text(theDateStr);
// setTimeout 在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次
window.setTimeout(getTime, 1000);
}
function GetDataZong() {
//echart1_1();
GetArea1();
GetArea2('marqueeCustCH2', 1);
//GetZhiXing_MO("marqueeCustCH1", "30");
//GetZhiXing_MO("marqueeCustCH2", "60");
//GetZhiXing_MO("marqueeCustCH3", "90");
//GetZhiXing_RCVUnInWare();
// SetIfGo("marqueeCust1", "marqueeCustCH1", "marqueelist1");//判断是否需要滚动
// SetIfGo("marqueeCust2", "marqueeCustCH2", "marqueelist2");//判断是否需要滚动
// SetIfGo("marqueeCust3", "marqueeCustCH3", "marqueelist3");//判断是否需要滚动
//SetIfGo("RCVUNINView", "RCVUNIN", "marqueelist4");//判断是否需要滚动
}
function SetIfGo(DivID, DivCHID, listID) {
var ListDIV = $("#" + listID)[0].clientHeight;
var H_marqueediv = $("#" + DivCHID)[0];
//var H_marquee= H_marqueediv.clientHeight;
var H_marqueeView = $("#" + DivID)[0].clientHeight;
if ((ListDIV - 40) > H_marqueeView) {
if (!$("#" + DivID).hasClass("animationNone")) {
$("#" + DivID).addClass("animationNone");
}
if (!$("#" + DivCHID).hasClass("animationNone")) {
$("#" + DivCHID).addClass("animationNone");
}
}
else {
if ($("#" + DivID).hasClass("animationNone")) {
$("#" + DivID).removeClass("animationNone");
}
if ($("#" + DivCHID).hasClass("animationNone")) {
$("#" + DivCHID).removeClass("animationNone");
}
}
}
//function echart1_1() {
// // 基于准备好的dom，初始化echarts实例
// var myChart = echarts.init(document.getElementById('echart1_1'));
// var MonthArray = new Array();
// var MonthPercent = new Array();
// var MonthPercent_BZ = new Array();
// $.ajax({
// url: "/SRM/WatchPanel/GetZhiXing_OQC?XX=XX&" + Math.random(),
// dataType: "json",
// async: false,
// success: function (data) {
// if (data != false && data != null && data.length > 0) {
// for (var i = 0; i < data.length; i++) {
// MonthArray.push(data[i].月份);
// MonthPercent.push(data[i].PercentNum);
// MonthPercent_BZ.push(99.5);
// }
// //MonthPercent = [80, 75.23, 98, 40, 60,53];//测试
// var colors = ['#9c90e7', '#4ff494', '#f2c290', '#FFD700', '#f3aaf5', '#fcfb68']
// var colors2 = ['#6A5ACD', '#3D9140', '#ED9121', '#DAA569', '#A066D3', '#E3CF57'];
// option = {
// color: colors,
// tooltip: {
// trigger: 'axis',
// axisPointer: { type: 'shadow' },
// formatter: function (params) {
// var showHtm = "";
// showHtm = params[0].name + "月:" + '<br>' +
// params[0].seriesName + ':' + params[0].data + "%" + '<br>' +
// params[2].seriesName + ':' + params[2].data + "%";
// return showHtm;
// }
// },
// grid: {
// "top": "15",
// "right": "20",
// "bottom": "20",
// "left": "40",
// },
// legend: {
// show: false,
// },
// "xAxis": [
// {
// data: MonthArray,
// axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.9)", } },
// axisTick: { show: true, },
// axisLabel: {
// textStyle: {
// show: true,
// //fontSize: 9,
// color: "rgba(255,255,255,.9)",
// },
// },
// },
// ],
// "yAxis": [
// {
// max: 100,
// "type": "value",
// axisTick: {
// show: true,
// lineStyle: {
// show: true,
// color: "rgba(255,255,255,.9)",
// },
// },
// splitLine: { show: false, },
// axisLine: {
// show: true,
// lineStyle: {
// show: true,
// //fontSize: 9,
// color: "rgba(255,255,255,.9)",
// },
// },
// axisLabel: {
// show: true,
// color: "rgba(255,255,255,.9)"
// },
// axisLine: {
// show: true,
// lineStyle: {
// show: true,
// color: "rgba(255,255,255,.9)",
// },
// },
// }
// ],
// "series": [
// {
// "name": "合格率",
// "type": "bar",
// "data": MonthPercent,
// barWidth: _BarWidth,
// "itemStyle": {
// "normal": {
// barBorderRadius: _barBorderRadius_M,
// //color: function (params)
// //{
// // return colors[params.dataIndex];
// //},
// color: function (params) {
// return new echarts.graphic.LinearGradient(
// 0,
// 0,
// 0,
// 1,
// [
// { offset: 0, color: colors[params.dataIndex] },
// { offset: 1, color: colors2[params.dataIndex] }
// ]
// )
// },
// barBorderRadius: [3, 3, 3, 3],
// }
// },
// animation: false,
// barGap: '-100%',
// barCategoryGap: '40%',
// label: {
// show: true,
// formatter: '{c}%',
// },
// }
// ,
// {
// "name": "合格率",
// "type": "line",
// "data": MonthPercent,
// barWidth: _BarWidth,
// "itemStyle": {
// "normal": {
// color: "#96aef1",
// }
// },
// label: {
// show: false,
// //position: 'outside',
// formatter: '{c}%',
// },
// }
// ,
// {
// "name": "标准值",
// "type": "line",
// "data": MonthPercent_BZ,
// "itemStyle": {
// "normal": {
// }
// },
// label: {
// show: false,
// //position: 'outside',
// formatter: '{c}%',
// }
// },
// ]
// };
// myChart.setOption(option);
// }
// else {
// return null;
// }
// },
// error: function (aa) {
// return null;
// }
// });
//}
//区域一
function GetArea1() {
$.ajax({
url: "/SRM/WatchPanel/GetAreal1",
dataType: "json",
async: false,
success: function (data) {
if (data != false && data != null) {
//月度生产 月度发车 上月实际生产 月度实际发车 上月完成数量 上上月完成数量
$("#mothPlan").html(data[0].月度生产);
$("#motnSales").html(data[0].月度发车);
$("#lastMothSales").html(data[0].上月度发车);
$("#yearSales").html(data[0].年度发车);
} else {
$("#" + marqueeID).html("");
}
},
error: function (aa) {
}
});
}
function GetArea3() {
// 基于准备好的dom，初始化echarts实例
//var MonthArray = new Array();
//var MonthPercent = new Array();
//var MonthPercent_BZ = new Array();
$.ajax({
url: "/SRM/WatchPanel/GetOutput?XX=XX&" + Math.random(),
dataType: "json",
async: false,
success: function (data) {
console.log(data);
if (data != false && data != null && data.length > 0) {
var value = 0;
var value1 = 0;
var value2 = 0;
var value3 = 0;
var value4 = 0;
var value5 = 0;
var value6 = 0;
var value7 = 0;
for (var i = 0; i < data.length; i++) {
value = data[i].上月度生产;
value1 = data[i].上月完成;
value2 = data[i].前月度生产;
value3 = data[i].前月完成;
value4 = data[i].上月比;
value5 = data[i].前月比;
value6 = data[0].前月;
value7 = data[0].上月;
}
$("#div3-C1-C1").html(value7 + "月完成率");
$("#div3-C2-C1").html(value6 + "月完成率");
$("#div3-C1-C2-div1").html(value3);
$("#lastMothPlan").html(value3);
$("#yearProduct").html(data[0].年度生产);
$("#div3-C1-C2-div2").html(value2);
$("#div3-C2-C2-div1").html(value1);
$("#div3-C2-C2-div2").html(value);
//MonthPercent = [80, 75.23, 98, 40, 60,53];//测试
var data = [value5, value5, value5];
var option3 = {
title: [
{
text: value7 + '月完成率',
x: '22%',
y: '90%',
textStyle: {
fontSize: 14,
fontWeight: '100',
color: '#5dc3ea',
lineHeight: 16,
textAlign: 'center',
},
},
{
text: value6 + '月完成率',
x: '76%',
y: '90%',
textStyle: {
fontSize: 14,
fontWeight: '100',
color: '#5dc3ea',
lineHeight: 16,
textAlign: 'center',
},
},
],
series: [
{
type: 'liquidFill',
radius: '85%',
center: ['30%', '48%'],
color: [
{
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: '#446bf5',
},
{
offset: 1,
color: '#0000FF',
},
],
globalCoord: false,
},
],
data: [value5, value5, value5], // data个数代表波浪数
backgroundStyle: {
borderWidth: 1,
color: 'RGBA(51, 66, 127, 0.7)',
},
label: {
normal: {
textStyle: {
fontSize: 14,
color: '#fff',
},
},
},
outline: {
// show: false
borderDistance: 0,
itemStyle: {
borderWidth: 6,
borderColor: '#0000FF',
},
},
},
{ //第二个球的填充
type: 'liquidFill',
radius: '85%',
center: ['84%', '45%'],
color: [
{
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: '#2aa1e3',
},
{
offset: 1,
color: '#08bbc9',
},
],
globalCoord: false,
},
],
data: [value4, value4, value4], // data个数代表波浪数
backgroundStyle: {
borderWidth: 1,
color: 'RGBA(51, 66, 127, 0.7)',
},
label: {
normal: {
textStyle: {
fontSize: 28,
color: '#fff',
},
},
},
outline: {
// show: false
borderDistance: 0,
itemStyle: {
borderWidth: 6,
borderColor: '#08bbc9',
},
},
},
],
};
myChartArea3.setOption(option3);
}
else {
return null;
}
},
error: function (aa) {
return null;
}
});
}
function GetArea2(marqueeID, ItemNumber) {
$.ajax({
url: "/SRM/WatchPanel/GetProductProgress?ItemNumber=" + ItemNumber + "&" + Math.random(),
dataType: "json",
async: false,
success: function (data) {
if (data != false && data != null) {
var html = "";
for (var i = 0; i < data.length; i++) {
html += '<ul class="ul_con">';
html += '<li>' + data[i].序号 + '</li>';
html += '<li>' + data[i].销售车辆号 + '</li><li>' + data[i].产品名称 + '</li><li>' + data[i].用户单位 + '</li>';
html += '<li>' + data[i].客户交货期 + '</li><li>' + data[i].生产状态 + '</li>';
html += '<li>' + data[i].进度 + '</li></ul>';
}
$(".ul_listInCust").css("animation-duration", data.length * 1.3 + "s");
$("#" + marqueeID).html(html);
// Set background color of odd-indexed ul elements to black
$("#" + marqueeID + " ul:nth-child(odd)").css("background-color", "rgba(0, 1, 0, 0.1)");
} else {
$("#" + marqueeID).html("");
}
},
error: function (aa) {
// Handle error
}
});
}
function GetZhiXing_RCVUnInWare() {
$.ajax({
url: "/SRM/WatchPanel/GetZhiXing_RCVUnInWare?XX=XX&" + Math.random(),
dataType: "json",
async: false,
success: function (data) {
if (data != false && data != null && data.length > 0) {
var html = "";
for (var i = 0; i < data.length; i++) {
html += ' <ul class="ul_con"> <li >' + data[i].LOTNO + '</li> <li >' +
data[i].送货单号 + '</li>';
html += ' <li >' + data[i].采购订单号 + '</li> <li >' + data[i].物料编码 + '</li>';
html += ' <li >' + data[i].物料名称 + '</li> <li >' + data[i].数量 + '</li> ';
html += ' <li >' + data[i].检验人 + '</li> </ul> ';
}
html += "</ul>";
$("#RCVUNIN").html(html);
}
else {
$("#RCVUNIN").html("");
}
},
error: function (aa) {
}
});
}
</script>
</body>
</html>

8
NFine.Web/Views/Login/Index.cshtml
View File

@ -48,7 +48,9 @@
<div class="row ButClassRow">
<a id="NF-WatchPanel1" authorize="yes" class="btn btn-primary dropdown-text ButClass" onclick="btn_WIP3()">产品质量控制</a>
</div>
<div class="row ButClassRow">
<a id="NF-WatchPanel1" authorize="yes" class="btn btn-primary dropdown-text ButClass" onclick="btn_WIP4()">生产看板</a>
</div>
<div class="login_tips"></div>
</div>
@ -90,6 +92,10 @@
var cc = window.location.href.replace("/Login/Index", "");
window.open(cc + "SRM/WatchPanel/PanelCK?&" + Math.random());
}
function btn_WIP4() {
window.open("/SRM/WatchPanel/PanelWIPZhiXingDa3?&" + Math.random());
}
</script>
</body>
</html>

Write Preview
Loading…
Cancel
Save