CNCEC_SUBQHSE_WUHUAN/SGGL/FineUIPro.Web/common/main_new1.aspx

593 lines
24 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"/>
</head>
<body>
<form id="form1" runat="server">
<div class="y_body y_row">
<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="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="imags/16.png"/></div>
<div class="swiper-slide"><img src="imags/16.png"/></div>
<div class="swiper-slide"><img src="imags/16.png"/></div>
<div class="swiper-slide"><img src="imags/16.png"/></div>
</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="QualityProblem" 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;"><%=GetProblemCompletedNum() %></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;"><%=GetProblemNotCompletedNum() %></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;"><%=GetProblemZgl() %></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">
<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/jquery.js"></script>
<script src="lib/swiper-bundle.min.js"></script>
<script>
// 轮播
var 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',
},
})
// 质量问题治理数据
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);
}
function GetClickHtml(obj) {
var $this = $(obj), type = $this.attr('data-type'), tabType = $this.attr('data-tabType') || '';
var title = '';
if (tabType != '') {
tabType = $this.closest('.bb-item').find('.tab-wrap .tab .active').attr('data-type')
if (tabType == null) {
tabType = $this.closest('.str-bottom').find('.tab-wrap .tab .active').attr('data-type')
}
}
console.log(type)
if (type == 'QualityTrainingData') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/QualityTrainingData.aspx') //质量培训数据
window.open("../DataShow/QualityTraining.aspx")
}
else if (type == 'MeasuringInstrumentsData') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/MeasuringInstrumentsData.aspx') //计量器具数据
window.open("../DataShow/QualityInstruments.aspx")
title = '计量器具数据'
}
else if (type == 'ManagerData') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/ManagerData.aspx') //管理人员数据
window.open("../DataShow/QualityPerson.aspx")
title = '管理人员数据'
}
else if (type == 'QualityProblem') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/QualityProblem.aspx') //质量问题数据
window.open("../DataShow/QualityProblem.aspx")
}
else if (type == 'QualityControlPoint') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/QualityControlPoint.aspx') //质量控制点数据
window.open("../DataShow/QualityControlPoint.aspx")
}
else if (type == 'QualityAcceptance') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/QualityAcceptance.aspx') //质量验收数据
window.open("../DataShow/QualityAcceptance.aspx")
}
else if (type == 'ProjectDivision') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/ProjectDivision.aspx') //工程划分数据
window.open("../DataShow/ProjectDivision.aspx")
}
else if (type == 'HjData') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/HjData.aspx') //焊接数据
window.open("../DataShow/HJGLWelding.aspx")
}
else if (type == 'DefectAnalysis') {
// $('iframe').attr('src', '../InterfacePopup/CQMS/DefectAnalysis.aspx') //缺陷分析
window.open("../DataShow/HJGLDefect.aspx")
}
else {
// $('iframe').attr('src', '../SysManage/Unit.aspx')
//window.open("../DataShow/HJGLDefect.aspx")
console.log("通用")
}
}
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>