562 lines
22 KiB
Plaintext
562 lines
22 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="main_new1.aspx.cs" Inherits="FineUIPro.Web.common.main_new1" %>
|
|
|
|
<!DOCTYPE html>
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head runat="server">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
|
<title>质量管理</title>
|
|
<script src="lib/flex.js"></script>
|
|
|
|
<link rel="stylesheet" href="css/base.css"/>
|
|
<link rel="stylesheet" href="css/quality.css"/>
|
|
<link rel="stylesheet" href="css/swiper-bundle.min.css" />
|
|
<link rel="stylesheet" href="../res/assets/css/xfk.css"/>
|
|
|
|
<script src="lib/jquery.js"></script>
|
|
<style>
|
|
.swiper-box {
|
|
height: calc(100% - 3.7rem);
|
|
width: 100%;
|
|
padding-top:.75rem;
|
|
/* padding-top: .375rem; */
|
|
|
|
position: relative;
|
|
}
|
|
|
|
.img-select {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
height: .5rem;
|
|
width: 50%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body style="height:11.8rem;background-color:#040031;">
|
|
<form id="form1" runat="server" style="height:100%;">
|
|
<f:PageManager ID="PageManager1" runat="server"></f:PageManager>
|
|
<div class="y_body y_row" style="height:100%;">
|
|
<div class="site y_column">
|
|
<div class="y_box js-hover" data-type="ManagerData">
|
|
<div class="y_box_label y_image_default">质量管理人员数据</div>
|
|
<div class="y_box_main zlgl-box y_row">
|
|
<div class="y_column">
|
|
<div class="zlgl-number y_image_default">
|
|
<p><%=GetCompanyPersonNum() %></p>
|
|
</div>
|
|
<div class="zlgl-label">企业总部人数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="zlgl-number y_image_default">
|
|
<p><%=GetBranchPersonNum() %></p>
|
|
</div>
|
|
<div class="zlgl-label">分支机构人数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="zlgl-number y_image_default">
|
|
<p><%=GetProjectPersonNum() %></p>
|
|
</div>
|
|
<div class="zlgl-label">项目部人数</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="y_box js-hover" data-type="MeasuringInstrumentsData">
|
|
<div class="y_box_label y_image_default">计量器具数据</div>
|
|
<div class="y_box_main " style="padding: .375rem .75rem;">
|
|
<div class="jlq-box y_image_default">
|
|
<div>
|
|
<div class="jlq-number">
|
|
<p style="color: #00FFFF;"><%=GetUseNum() %><span>台</span></p>
|
|
<p>在用计量器具</p>
|
|
</div>
|
|
</div>
|
|
<div class="y_column" style="margin-left: .5rem;">
|
|
<div class="jlq-number">
|
|
<p style="color: #12CDA2;"><%=GetOKNum() %><span style="color: #12CDA2;">台</span></p>
|
|
<p>校准合格</p>
|
|
</div>
|
|
</div>
|
|
<div class="y_column" style="justify-content: flex-end;">
|
|
<div class="jlq-number">
|
|
<p style="color: #E9E931;" runat="server" id="spanQualityChartAnalysis">7</p>
|
|
<p>资质预警</p>
|
|
</div>
|
|
</div>
|
|
<div class="y_column" style="justify-content: flex-end;margin-left: .5rem;">
|
|
<div class="jlq-number">
|
|
<p style="color: #FF7474;"><%=GetJxyjNum() %></p>
|
|
<p>机械预警</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="y_box js-hover" data-type="QualityTrainingData">
|
|
<div class="y_box_label y_image_default">质量培训数据</div>
|
|
<div class="y_box_main zlpx-box y_image_default y_row">
|
|
<div class="zlpx-item y_column" style="padding-right: 1.5rem;margin-top: 1.25rem;">
|
|
<div class="zlpx-number"><%=GetTrainPersonNum() %></div>
|
|
<div class="zlpx-label">质量培训人次数</div>
|
|
</div>
|
|
<div class="zlpx-item y_column"
|
|
style="align-items: flex-start;padding-left: 1.5rem;margin-top: .5rem;">
|
|
<div class="zlpx-number"><%=GetTechnicalDisclosePersonNum() %></div>
|
|
<div class="zlpx-label">技术交底人次数</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="site y_column">
|
|
|
|
<div class="swiper-box">
|
|
<div class="img-select">
|
|
<f:DropDownList runat="server" Width="300px" ID="drpProject" OnSelectedIndexChanged="drpProject_SelectedIndexChanged"
|
|
AutoPostBack="true" EnableEdit="true" CssClass="" >
|
|
</f:DropDownList>
|
|
</div>
|
|
<div class="swiper">
|
|
<div class="swiper-wrapper" id="swiper-wrapper">
|
|
<%=divProjectImg %>
|
|
</div>
|
|
<!-- 如果需要分页器 -->
|
|
<div class="swiper-pagination"></div>
|
|
|
|
<!-- 如果需要导航按钮 -->
|
|
<div class="swiper-button-prev"></div>
|
|
<div class="swiper-button-next"></div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="y_box js-hover" data-type="QualityInspection" style="width: 100%;">
|
|
<div class="y_box_label y_image_default">质量验收数据</div>
|
|
<div class="y_box_main">
|
|
<div class="zl-card y_row">
|
|
<div class="y_image_default y_column" style="width: 2.7625rem;">
|
|
<div class="zl-label">共检总数</div>
|
|
<div class="zl-number" style="color: #2BFAFF;"><%=getAllInspectionManagement() %></div>
|
|
</div>
|
|
<div class="y_image_default y_column" style="width: 2.7625rem;">
|
|
<div class="zl-label">-次合格数量</div>
|
|
<div class="zl-number" style="color: #FF7474;"><%=getIsOnceInspectionManagement() %></div>
|
|
</div>
|
|
<div class="y_image_default y_column" style="width: 2.7625rem;">
|
|
<div class="zl-label">-次验收合格率</div>
|
|
<div class="zl-number" style="color: #FFA602;"><%=GetInspectionManagementZgl() %></div>
|
|
</div>
|
|
</div>
|
|
<div id="zlysmap"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="site y_column">
|
|
<div class="y_box js-hover" data-type="HjData">
|
|
<div class="y_box_label y_image_default">焊接数据</div>
|
|
<div class="y_box_main hj-box" style="padding: .125rem;">
|
|
<div class="y_column">
|
|
<div class="hj-box_number"><%=GetWelderNum() %></div>
|
|
<div class="hj-box_label">焊工总数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="hj-box_number"><%=GetTotalDineNum() %></div>
|
|
<div class="hj-box_label">总达因数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="hj-box_number" style="color: #12CDA2;"><%=GetCompleteDineNum() %></div>
|
|
<div class="hj-box_label">完成达因数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="hj-box_number"><%=GetTotalFilmNum() %></div>
|
|
<div class="hj-box_label">拍片总数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="hj-box_number" style="color: #12CDA2;"><%=GetOKFilmNum() %></div>
|
|
<div class="hj-box_label">合格片数</div>
|
|
</div>
|
|
<div class="y_column">
|
|
<div class="hj-box_number" style="color: #FFA602;"><%=GetOKFilmHgl() %></div>
|
|
<div class="hj-box_label">一次拍片合格率</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="y_box js-hover" data-type="QualityProblem">
|
|
<div class="y_box_label y_image_default">质量问题治理数据</div>
|
|
<div class="y_box_main">
|
|
<div class="zl-card y_row">
|
|
<div class="y_image_default y_column">
|
|
<div class="zl-label">整改闭环项</div>
|
|
<div class="zl-number" style="color: #2BFAFF;"><%=GetProblemCompletedNum() %></div>
|
|
</div>
|
|
<div class="y_image_default y_column">
|
|
<div class="zl-label">未整改完成项</div>
|
|
<div class="zl-number" style="color: #FF7474;"><%=GetProblemNotCompletedNum() %></div>
|
|
</div>
|
|
<div class="y_image_default y_column">
|
|
<div class="zl-label">整改率</div>
|
|
<div class="zl-number" style="color: #FFA602;"><%=GetProblemZgl() %></div>
|
|
</div>
|
|
</div>
|
|
<div id="zlmap"></div>
|
|
</div>
|
|
</div>
|
|
<div class="y_box js-hover" data-type="NCRData">
|
|
<div class="y_box_label y_image_default">NCR数据</div>
|
|
<div class="y_box_main">
|
|
<div class="zl-card y_row">
|
|
<div class="y_image_default y_column">
|
|
<div class="zl-label">整改闭环项</div>
|
|
<div class="zl-number" style="color: #2BFAFF;"><%=ncrZgbhx %></div>
|
|
</div>
|
|
<div class="y_image_default y_column">
|
|
<div class="zl-label">未整改完成项</div>
|
|
<div class="zl-number" style="color: #FF7474;"><%=ncrwZgbhx %></div>
|
|
</div>
|
|
<div class="y_image_default y_column">
|
|
<div class="zl-label">整改率</div>
|
|
<div class="zl-number" style="color: #FFA602;"><%=ncrZgl %></div>
|
|
</div>
|
|
</div>
|
|
<div id="ncrmap"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="click-wrap" style="height: 75%; top: 10%;">
|
|
<div class="click-close"></div>
|
|
<div class="click-item">
|
|
<%-- <iframe src="../SysManage/Unit.aspx" width="100%" height="450"></iframe>--%>
|
|
<iframe src="" id="iframe" width="100%" height="450"></iframe>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</body>
|
|
</html>
|
|
|
|
<script src="lib/echarts.min.js"></script>
|
|
<script src="lib/swiper-bundle.min.js"></script>
|
|
<script>
|
|
function createSwiper() {
|
|
var mySwiper = null
|
|
// 轮播
|
|
mySwiper = new Swiper('.swiper', {
|
|
direction: 'horizontal', // 垂直切换选项
|
|
loop: true, // 循环模式选项
|
|
autoplay: true,
|
|
autoplay: {
|
|
delay: 8000,
|
|
stopOnLastSlide: false,
|
|
disableOnInteraction: true,
|
|
},
|
|
// 如果需要分页器
|
|
pagination: {
|
|
el: '.swiper-pagination',
|
|
},
|
|
|
|
// 如果需要前进后退按钮
|
|
navigation: {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
},
|
|
|
|
// 如果需要滚动条
|
|
scrollbar: {
|
|
el: '.swiper-scrollbar',
|
|
},
|
|
})
|
|
}
|
|
createSwiper()
|
|
|
|
// 质量问题治理数据
|
|
zlmap()
|
|
function zlmap() {
|
|
let value = [<%=ProblemNum%>]
|
|
let label = ['问题个数', '整改完成数', '未整改数', '整改率']
|
|
let opt = {
|
|
grid: {
|
|
top: fontSize(30),
|
|
bottom: fontSize(30)
|
|
},
|
|
xAxis: {
|
|
type: 'category',
|
|
data: label,
|
|
axisLabel: {
|
|
|
|
color: '#3FB0FF'
|
|
},
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#84D7FE'
|
|
}
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
}
|
|
},
|
|
yAxis: {
|
|
type: 'value',
|
|
axisLabel: {
|
|
color: '#3FB0FF'
|
|
},
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#1B538B',
|
|
type: 'dashed'
|
|
}
|
|
}
|
|
},
|
|
series: [
|
|
{
|
|
name: '',
|
|
data: value,
|
|
type: 'bar',
|
|
barWidth: fontSize(20),
|
|
itemStyle: {
|
|
color: '#3A7EF9'
|
|
},
|
|
label: {
|
|
// 柱图头部显示值
|
|
show: true,
|
|
position: "top",
|
|
color: "#ffffff",
|
|
fontSize: fontSize(10),
|
|
formatter: (params) => {
|
|
let str = params.value;
|
|
console.log(params)
|
|
if (params.name === '整改率') {
|
|
str = str + '%'
|
|
}
|
|
return str
|
|
},
|
|
},
|
|
}
|
|
]
|
|
};
|
|
var aPassChart = echarts.init(document.getElementById('zlmap'));
|
|
aPassChart.setOption(opt);
|
|
}
|
|
// NCR数据
|
|
|
|
|
|
ncrmap()
|
|
function ncrmap() {
|
|
let value = [<%=ncrCount %>]
|
|
let label = [<%=ncrZy %>]
|
|
let opt = {
|
|
grid: {
|
|
top: fontSize(30),
|
|
bottom: fontSize(30)
|
|
},
|
|
xAxis: {
|
|
type: 'category',
|
|
data: label,
|
|
axisLabel: {
|
|
|
|
color: '#3FB0FF'
|
|
},
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#84D7FE'
|
|
}
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
}
|
|
},
|
|
yAxis: {
|
|
type: 'value',
|
|
axisLabel: {
|
|
color: '#3FB0FF'
|
|
},
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#1B538B',
|
|
type: 'dashed'
|
|
}
|
|
}
|
|
},
|
|
series: [
|
|
{
|
|
name: '',
|
|
data: value,
|
|
type: 'bar',
|
|
barWidth: fontSize(40),
|
|
itemStyle: {
|
|
color: '#3A7EF9'
|
|
},
|
|
label: {
|
|
// 柱图头部显示值
|
|
show: true,
|
|
position: "top",
|
|
color: "#ffffff",
|
|
fontSize: fontSize(10),
|
|
formatter: (params) => {
|
|
let str = params.value;
|
|
console.log(params.name)
|
|
if (params.name == '整改率') {
|
|
str = str + '%'
|
|
}
|
|
return str
|
|
},
|
|
},
|
|
}
|
|
]
|
|
};
|
|
var aPassChart = echarts.init(document.getElementById('ncrmap'));
|
|
aPassChart.setOption(opt);
|
|
}
|
|
// 质量验收数据
|
|
zlysmap()
|
|
function zlysmap() {
|
|
//总计
|
|
let value = [<%=InspectionManagementSumCount%>]
|
|
//合格
|
|
let value1 = [<%=InspectionManagementOkCount%>]
|
|
//一次验收合格率
|
|
let value2 = [<%=InspectionManagementOneOkCount%>]
|
|
//专业
|
|
let label = [<%=InspectionManagementZy%>]
|
|
|
|
let opt = {
|
|
grid: {
|
|
top: fontSize(60),
|
|
bottom: fontSize(30)
|
|
},
|
|
legend: {
|
|
top: fontSize(10),
|
|
left: 'center',
|
|
data: [{ name: '总计', textStyle: { color: '#20AFFF' } }, { name: '合格', textStyle: { color: '#12CDA2' } }, { name: '一次验收合格率', textStyle: { color: '#FFA602' } }]
|
|
},
|
|
xAxis: {
|
|
type: 'category',
|
|
data: label,
|
|
axisLabel: {
|
|
|
|
color: '#3FB0FF'
|
|
},
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#84D7FE'
|
|
}
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
}
|
|
},
|
|
yAxis: {
|
|
type: 'value',
|
|
axisLabel: {
|
|
color: '#3FB0FF'
|
|
},
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#1B538B',
|
|
type: 'dashed'
|
|
}
|
|
}
|
|
},
|
|
series: [
|
|
{
|
|
name: '总计',
|
|
data: value,
|
|
type: 'bar',
|
|
barWidth: fontSize(20),
|
|
itemStyle: {
|
|
color: '#20AFFF'
|
|
},
|
|
label: {
|
|
// 柱图头部显示值
|
|
show: true,
|
|
position: "top",
|
|
color: "#ffffff",
|
|
fontSize: fontSize(10),
|
|
formatter: (params) => {
|
|
let str = params.value;
|
|
console.log(params.name)
|
|
if (params.name == '整改率') {
|
|
str = str + '%'
|
|
}
|
|
return str
|
|
},
|
|
},
|
|
},
|
|
{
|
|
name: '合格',
|
|
data: value1,
|
|
type: 'bar',
|
|
barWidth: fontSize(20),
|
|
itemStyle: {
|
|
color: '#12CDA2'
|
|
},
|
|
label: {
|
|
// 柱图头部显示值
|
|
show: true,
|
|
position: "top",
|
|
color: "#ffffff",
|
|
fontSize: fontSize(10),
|
|
formatter: (params) => {
|
|
let str = params.value;
|
|
console.log(params.name)
|
|
if (params.name == '整改率') {
|
|
str = str + '%'
|
|
}
|
|
return str
|
|
},
|
|
},
|
|
},
|
|
{
|
|
name: '一次验收合格率',
|
|
data: value2,
|
|
type: 'line',
|
|
itemStyle: {
|
|
color: '#FFA602'
|
|
},
|
|
showSymbol: false,
|
|
areaStyle: {
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
{
|
|
offset: 0,
|
|
color: '#FFA602'
|
|
}, // %0的颜色值
|
|
{
|
|
offset: 1,
|
|
color: 'rgba(255, 166, 2, 0)'
|
|
} // 100%的颜色值
|
|
])
|
|
|
|
},
|
|
}
|
|
]
|
|
};
|
|
var aPassChart = echarts.init(document.getElementById('zlysmap'));
|
|
aPassChart.setOption(opt);
|
|
|
|
}
|
|
|
|
|
|
|
|
initClick();
|
|
function initClick() {
|
|
// 设置iframe高度
|
|
$('.click-wrap .click-item iframe').height($('.click-wrap').height())
|
|
$(".js-hover").click(function () {
|
|
var htmlContent = GetClickHtml(this)
|
|
//$('.click-wrap').show()
|
|
//$(".hover-wrap").hide()
|
|
})
|
|
$('.click-close').click(function () {
|
|
$('.click-wrap').hide()
|
|
})
|
|
}
|
|
</script> |