374 lines
19 KiB
HTML
374 lines
19 KiB
HTML
<style type="text/css">
|
||
.top {
|
||
width: 80%;
|
||
margin: auto;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.top select {
|
||
width: 150px;
|
||
height: 30px;
|
||
margin-left: 10px;
|
||
}
|
||
|
||
.guanLi {
|
||
width: 93%;
|
||
margin: auto;
|
||
text-align: center;
|
||
}
|
||
|
||
.guanLi tr {
|
||
height: 30px;
|
||
}
|
||
|
||
.yanse {
|
||
background: #e4f4f8;
|
||
border: #c9ebf2 1px solid;
|
||
}
|
||
|
||
.btn {
|
||
width: 60px;
|
||
text-align: center;
|
||
height: 30px;
|
||
margin-left: 50px;
|
||
background: #e4e8e5f5;
|
||
border: none;
|
||
color: #fff;
|
||
border-radius: 5px;
|
||
}
|
||
|
||
.class_tabel {
|
||
/*position: absolute;*/
|
||
height: 40px;
|
||
text-align: center;
|
||
font-size: 15px;
|
||
line-height: 40px;
|
||
background: #e4f4f8;
|
||
border: #c9ebf2 1px solid;
|
||
}
|
||
|
||
#myModal .layui-table-cell {
|
||
height: auto;
|
||
overflow: visible;
|
||
text-overflow: inherit;
|
||
white-space: normal;
|
||
}
|
||
|
||
.Top i {
|
||
width: 10%;
|
||
}
|
||
|
||
.font_div {
|
||
width: 30px;
|
||
height: 100%;
|
||
margin-left: 30%;
|
||
color: #000000;
|
||
font-weight: 600;
|
||
}
|
||
</style>
|
||
|
||
|
||
<div class="container">
|
||
<div style="text-align: center;">
|
||
<h2>首次不合格风险监测 <span id="title">（食品小类）</span></h2>
|
||
<h3 style="margin-top: 10px;"><span style="margin-left: -40px;" id="time_show"></span></h3>
|
||
</div>
|
||
<div style="margin-top: 20px;">
|
||
<div style="display: flex;justify-content: space-around">
|
||
<div style=" margin-bottom: 20px;">
|
||
<span style="display: inline-block;width: 90px;padding-bottom: 20px;">食品类别：</span>
|
||
<select ng-model="SPLB" style="margin-right:10px;width: 100px; height: 25px; border: 1px solid #ccc;">
|
||
<option value="0">选择</option>
|
||
<option value="1">食品大类</option>
|
||
<option value="2">食品亚类</option>
|
||
<option value="3">食品品种</option>
|
||
<option value="4">食品小类</option>
|
||
</select>
|
||
<span style="display: inline-block;width: 90px">环节：</span>
|
||
<select ng-model="STAGE"
|
||
style="margin-right:10px;width: 100px; height: 25px; border: 1px solid #ccc;">
|
||
<option value="0">选择</option>
|
||
<option value="餐饮环节">餐饮环节</option>
|
||
<option value="流通环节">流通环节</option>
|
||
<option value="生产环节">生产环节</option>
|
||
</select>
|
||
</br>
|
||
<span style="display: inline-block;width: 90px">请选择年份：</span>
|
||
<select ng-model="year" style="margin-right:10px;width: 100px; height: 25px; border: 1px solid #ccc;">
|
||
<option value="0">选择</option>
|
||
<option value="2023">2023</option>
|
||
<option value="2022">2022</option>
|
||
<option value="2021">2021</option>
|
||
<option value="2020">2020</option>
|
||
<option value="2019">2019</option>
|
||
<option value="2018">2018</option>
|
||
<option value="2017">2017</option>
|
||
<option value="2016">2016</option>
|
||
<option value="2015">2015</option>
|
||
<option value="2014">2014</option>
|
||
<option value="2013">2013</option>
|
||
<option value="2012">2012</option>
|
||
<option value="2011">2011</option>
|
||
<option value="2010">2010</option>
|
||
<option value="2009">2009</option>
|
||
<option value="2008">2008</option>
|
||
<option value="2007">2007</option>
|
||
<option value="2006">2006</option>
|
||
</select>
|
||
<span style="display: inline-block;width: 90px">请选择月份：</span>
|
||
<select ng-model="month" style="margin-right:10px;width: 100px; height: 25px; border: 1px solid #ccc;">
|
||
<option value="0">选择</option>
|
||
<option value="1">1</option>
|
||
<option value="2">2</option>
|
||
<option value="3">3</option>
|
||
<option value="4">4</option>
|
||
<option value="5">5</option>
|
||
<option value="6">6</option>
|
||
<option value="7">7</option>
|
||
<option value="8">8</option>
|
||
<option value="9">9</option>
|
||
<option value="10">10</option>
|
||
<option value="11">11</option>
|
||
<option value="12">12</option>
|
||
</select>
|
||
|
||
<input type="button" style="background: #009688;width: 80px;margin-left: 10px" class="btn btn-success"
|
||
value="查询"
|
||
ng-click="btn_yujing2()"/>
|
||
</div>
|
||
<div style="display: flex; flex-direction:column; align-items: flex-end;">
|
||
<div style="display: flex;padding-bottom: 2px;">
|
||
<span style="width: 80px">半年内</span>
|
||
<div style=" width: 30px; height: 18px;background: #161617;"></div>
|
||
</div>
|
||
<div style="display: flex;padding-bottom: 2px;">
|
||
<span style="width: 80px">1年内</span>
|
||
<div style=" width: 30px; height: 18px;background: #606369;"></div>
|
||
</div>
|
||
<div style="display: flex;padding-bottom: 2px;">
|
||
<span style="width: 80px">2年内</span>
|
||
<div style="width: 30px; height: 18px;background: #b6babf;"></div>
|
||
</div>
|
||
<div style="display: flex;padding-bottom: 2px;align-items: baseline;">
|
||
<i class="fa fa-exclamation-circle" aria-hidden="true" style="color: #ff0000;"></i>
|
||
<a style="color: #0029ff;" data-toggle="modal" data-target="#myModal2">定义</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- <div style=" margin-left: 34%;">-->
|
||
<!-- <div style="float: left;">-->
|
||
<!-- <span style="float: left;">半年内</span>-->
|
||
<!-- <div style=" margin-left: 50px; width: 30px; height: 18px;background: #fff900;"></div>-->
|
||
<!-- </div>-->
|
||
<!-- <div style="float: left;">-->
|
||
<!-- <span style="float: left;margin-left: 15px;">1年内</span>-->
|
||
<!-- <div style=" margin-left: 60px; width: 30px; height: 18px;background: #ff8300;"></div>-->
|
||
<!-- </div>-->
|
||
<!-- <div style="float: left;">-->
|
||
<!-- <span style="margin-left: 10px;float: left;">2年内</span>-->
|
||
<!-- <div style=" margin-left: 55px; width: 30px; height: 18px;background: red;"></div>-->
|
||
<!-- </div>-->
|
||
<!-- <div style="float: left;margin-left: 30px;">-->
|
||
<!-- <i class="fa fa-exclamation-circle" aria-hidden="true" style="color: #ff0000;"></i>-->
|
||
<!-- <a style=" color: #0029ff;" data-toggle="modal" data-target="#myModal2">定义</a>-->
|
||
<!-- </div>-->
|
||
<!-- </div>-->
|
||
|
||
<div style="display: flex;justify-content: center;align-items: center;">
|
||
<table class="layui-hide" id="test" lay-filter="test" style="width: 100%"></table>
|
||
<script type="text/html" id="barDemo">
|
||
<button class="layui-btn layui-btn-xs" lay-event="edit">查看</button>
|
||
</script>
|
||
<script type="text/html" id="colorTpl">
|
||
<div id="div_ji" class="font_div"
|
||
style="width: 50px;text-align: center;background:{{ d.ji }};">
|
||
-
|
||
</div>
|
||
</script>
|
||
<!-- <table st-table="dispData2" st-safe-src="mydata2" class="table table-striped" id=""-->
|
||
<!-- style="margin: 0 auto;margin-top: 50px;width:80%;width: -0.34%;">-->
|
||
<!-- <thead>-->
|
||
<!-- <tr>-->
|
||
<!-- <th style="width: 10%;text-align: center;">序号</th>-->
|
||
<!-- <!–<th style="width: 10%;text-align: center;">编号</th>–>-->
|
||
<!-- <th style="width: 10%;text-align: center;">检测项目</th>-->
|
||
<!-- <th style="width: 8%;text-align: center;" id="SP_title">食品小类</th>-->
|
||
<!-- <th style="width: 20%;text-align: center;">被抽样单位名称</th>-->
|
||
<!-- <th style="width: 20%;text-align: center;">抽样时间</th>-->
|
||
<!-- <th style="width: 7%;text-align: center;cursor:pointer;">详情</th>-->
|
||
<!-- <th style="text-align: center;width: 14%;">等级</th>-->
|
||
<!-- </tr>-->
|
||
<!-- </thead>-->
|
||
<!-- <st-loading is-show="isShow" tip-show="正在加载请稍后!!"></st-loading>-->
|
||
<!-- <tbody>-->
|
||
<!-- <tr ng-repeat="item in dispData2" class="">-->
|
||
<!-- <td style="font-size: 16px;text-align: center;"> {{$index + 1}}</td>-->
|
||
<!-- <!–<td style="font-size: 16px;text-align: center;"> {{item.JC_id}}</td>–>-->
|
||
<!-- <td style="font-size: 16px;text-align: center;"> {{item.JCXM}}</td>-->
|
||
<!-- <td style="font-size: 16px;text-align: center;"> {{item.SP}}</td>-->
|
||
<!-- <td style="font-size: 16px;text-align: center;"> {{item.BCYRMC}}</td>-->
|
||
<!-- <td style="font-size: 16px;text-align: center;"> {{item.CYSJ | limitTo:10}}</td>-->
|
||
<!-- <!–<td style="font-size: 16px;text-align: center;" ng-click='YJ_All("{{item.SP}}","{{item.JCXM}}","{{item.JC_id}}")' data-toggle="modal" data-target="#myModalList"> 查看</td>–>-->
|
||
<!-- <!– 这块是有问题的,传的值多了<td style="font-size: 16px;text-align: center;" ng-click="getinfowithjcid('{{item.SP}}','{{item.JXCM}}')" data-toggle="modal" data-target="#myModalList"> 查看</td>–>-->
|
||
<!-- <td style="font-size: 16px;text-align: center;" ng-click="getinfowithjcid('{{item.JC_ID}}')"-->
|
||
<!-- data-toggle="modal" data-target="#myModalDetail"> 查看-->
|
||
<!-- </td>-->
|
||
<!-- <td>-->
|
||
<!-- <div id="div_ji" class="font_div"-->
|
||
<!-- style="width: 50px;float: left;text-align: center;background:{{item.ji}};">-->
|
||
<!-- - -->
|
||
<!-- </div>-->
|
||
<!-- </td>-->
|
||
<!-- </tr>-->
|
||
<!-- </tbody>-->
|
||
<!-- </table>-->
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<script>
|
||
|
||
$(function () {
|
||
$('.dept_select').chosen();
|
||
});
|
||
|
||
|
||
</script>
|
||
|
||
|
||
<div class="modal fade" id="myModalList" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
||
<div class="modal-dialog" style=" width: 90%;">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<h4 class="modal-title" id="myModalLabel">不合格预警</h4>
|
||
|
||
</div>
|
||
<div class="modal-body">
|
||
<div>
|
||
<table class="layui-hide" id="test2"></table>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- bumin不明不白的代码,暂时弃用 -->
|
||
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
|
||
<div class="modal-dialog" style=" width: 50%;margin-top:20%;">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<h4 class="modal-title" id="myModalLabel">定义</h4>
|
||
|
||
</div>
|
||
<div class="modal-body">
|
||
<h3 id="show_text_h" style="color: #ff000085;line-height: 33px;font-size: 20px;">
|
||
首次不合格预警指的是食品小类中某个检验项目在一段时间内首次出现不合格，根据预警需要食品类别可以切换为食品品种、食品亚类、食品大类。<br/> 预警分为3个等级：<br/> 1.
|
||
半年内首次出现不合格预警为黄色<br/> 2. 1年内首次出现不合格预警为橙色<br/> 3.
|
||
在2年内首次出现不合格预警为红色
|
||
</h3>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal fade" id="myModalDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
|
||
aria-hidden="true">
|
||
<div class="modal-dialog" style=" width: 80%;">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<h4 class="modal-title" id="myModalLabel">不合格预警详情</h4>
|
||
|
||
</div>
|
||
<div class="modal-body">
|
||
<div style="margin-left: 2%;">
|
||
<!--<table class="layui-hide" id="test2"></table>-->
|
||
<!--{{curDetail}}-->
|
||
<table class="table table-striped" id=""
|
||
style="margin: 0 auto;margin-top: 50px;width:80%;width: -0.34%;">
|
||
<thead>
|
||
<tr>
|
||
<th style="width: 50%;text-align: center;">名称</th>
|
||
<th style="width: 50%;text-align: center;">内容</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 食品大类</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.SP_DL}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 食品亚类</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.SP_YL}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 食品品种</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.SP_PZ}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 食品小类</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.SP_XL}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 样品名称</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.YPMC}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 抽样人签名日期</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.CYSJ}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 被抽样单位名称</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.BCYRMC}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 被抽样单位地址</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.BCYDWMC}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 生产企业</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.SCZMC}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 生产企业地址</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.SCZDZ}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 检验项目</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.JCXM}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 限量值</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.bzz}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 检测值</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.jczbz}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="font-size: 16px;text-align: center;"> 检测值单位</td>
|
||
<td style="font-size: 16px;text-align: center;"> {{curDetail.jczDW}}</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|