663 lines
18 KiB
Plaintext
663 lines
18 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8"%>
|
|
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
|
|
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
|
|
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
|
|
<%@ page import="com.sipai.entity.base.ServerObject"%>
|
|
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security"%>
|
|
<!DOCTYPE html>
|
|
<!-- <html lang="zh-CN"> -->
|
|
<!-- BEGIN HEAD -->
|
|
|
|
<head>
|
|
<title>
|
|
<%= ServerObject.atttable.get("TOPTITLE")%>
|
|
</title>
|
|
<!-- 引用页头及CSS页-->
|
|
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
|
<!-- bootstrap switch -->
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css" />
|
|
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
|
|
charset="utf-8"></script>
|
|
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/echarts/echarts.js" charset="utf-8"></script>
|
|
|
|
|
|
<style type="text/css">
|
|
/*
|
|
app
|
|
*/
|
|
.main-header{display:none;}
|
|
.content-header{display:none;}
|
|
.main-footer{display:none;}
|
|
/*
|
|
顶部div
|
|
*/
|
|
.top_div {
|
|
width: 98%;
|
|
height: 35px;
|
|
margin-left:1%;
|
|
margin-top:5px;
|
|
/* background: yellow; */
|
|
/* border:1px solid #8B8386; */
|
|
float: left;
|
|
}
|
|
/*
|
|
搜索div
|
|
*/
|
|
.center_div {
|
|
width: 98%;
|
|
height: 18%;
|
|
margin-left:1%;
|
|
margin-top:5px;
|
|
background: #FFFFFF;
|
|
/* border:1px solid #8B8386; */
|
|
float: left;
|
|
}
|
|
/*
|
|
管理中心显示结果div
|
|
*/
|
|
.bottom_div {
|
|
width: 32%;
|
|
height: 33%;
|
|
margin-left:1%;
|
|
margin-top:10px;
|
|
/* background: red; */
|
|
/* border:1px solid #8B8386; */
|
|
float: left;
|
|
}
|
|
/*
|
|
中间的筛选div
|
|
*/
|
|
.searchDiv {
|
|
width: 100%;
|
|
height: 22%;
|
|
margin-left:1%;
|
|
border-bottom: 1px solid #E5E5E5;
|
|
/* color: #6F6F6F; */
|
|
float: left;
|
|
}
|
|
|
|
.tabletitle{
|
|
font-family: "Source Sans Pro","Helvetica Neue",Helvetica,Arial,sans-serif;
|
|
color:#838B8B;
|
|
font-weight:800;
|
|
}
|
|
|
|
.table td {
|
|
/* text-align: center; */
|
|
vertical-align: middle!important;
|
|
}
|
|
|
|
.bottom_div_1{
|
|
width: 100%;
|
|
height: 10%;
|
|
/* background: red; */
|
|
}
|
|
.bottom_div_2{
|
|
width: 100%;
|
|
height: 12%;
|
|
/* background: blue; */
|
|
}
|
|
.bottom_div_3{
|
|
width: 100%;
|
|
height: 78%;
|
|
/* background: #E0FFFF; */
|
|
}
|
|
.selectText{
|
|
cursor:pointer;
|
|
color:#000000;
|
|
}
|
|
|
|
/*
|
|
根据不同分辨率显示不同px的文字大小
|
|
*/
|
|
@media (min-width: 400px) and (min-height: 300px) {
|
|
.manageName{
|
|
font-size:8px;
|
|
font-weight: bold;
|
|
margin-left:3%;
|
|
}
|
|
.equNumName{
|
|
font-size:6px;
|
|
margin-left:8%;
|
|
font-weight: bold;
|
|
float:left;
|
|
}
|
|
.equNum{
|
|
font-size:14px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 768px) and (min-height: 432px) {
|
|
.manageName{
|
|
font-size:10px;
|
|
font-weight: bold;
|
|
margin-left:3%;
|
|
}
|
|
.equNumName{
|
|
font-size:8px;
|
|
margin-left:8%;
|
|
font-weight: bold;
|
|
float:left;
|
|
}
|
|
.equNum{
|
|
font-size:18px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 992px) and (min-height: 558px) {
|
|
.manageName{
|
|
font-size:12px;
|
|
font-weight: bold;
|
|
margin-left:3%;
|
|
}
|
|
.equNumName{
|
|
font-size:10px;
|
|
margin-left:8%;
|
|
font-weight: bold;
|
|
float:left;
|
|
}
|
|
.equNum{
|
|
font-size:20px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1200px) and (min-height: 675px) {
|
|
.manageName{
|
|
font-size:14px;
|
|
font-weight: bold;
|
|
margin-left:3%;
|
|
}
|
|
.equNumName{
|
|
font-size:12px;
|
|
margin-left:8%;
|
|
font-weight: bold;
|
|
float:left;
|
|
}
|
|
.equNum{
|
|
font-size:22px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1400px) and (min-height: 875px) {
|
|
.manageName{
|
|
font-size:14px;
|
|
font-weight: bold;
|
|
margin-left:3%;
|
|
}
|
|
.equNumName{
|
|
font-size:12px;
|
|
margin-left:8%;
|
|
font-weight: bold;
|
|
float:left;
|
|
}
|
|
.equNum{
|
|
font-size:24px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
<script type="text/javascript">
|
|
|
|
var dosearch = function() {
|
|
$("#table").bootstrapTable('refresh');
|
|
};
|
|
|
|
function IsApp() {
|
|
var u=navigator.userAgent;
|
|
|
|
var flag=false;
|
|
var Agents = ["Android", "iPhone",
|
|
"SymbianOS", "Windows Phone",
|
|
"iPad", "iPod"];
|
|
for (var v = 0; v < Agents.length; v++) {
|
|
if (u.indexOf('iPhone') > -1 && u.indexOf('Safari')<0) {
|
|
flag = true;
|
|
break;
|
|
}else if (u.indexOf('Android') > -1 && u.indexOf('wv')>-1) {
|
|
flag = true;
|
|
break;
|
|
}else{
|
|
|
|
}
|
|
}
|
|
//alert(flag);
|
|
return flag;
|
|
}
|
|
|
|
/*
|
|
js预加载
|
|
*/
|
|
$(function(){
|
|
var flag = IsApp();
|
|
if (flag==true){
|
|
|
|
}else{
|
|
$(".main-header").show();
|
|
$(".content-header").show();
|
|
$(".main-footer").show();
|
|
}
|
|
|
|
|
|
var windowghight=document.body.clientHeight;
|
|
var topheight=$("#topdiv").outerHeight(true);
|
|
windowghight=windowghight-topheight-10;
|
|
$('#centerdiv').attr("style","height:"+windowghight+"px;");
|
|
|
|
//环形图形数据
|
|
echartData();
|
|
//获取设备数量
|
|
//getEquData();
|
|
//获取设备大类与设备小类内容
|
|
getEquipmentType();
|
|
});
|
|
|
|
/*
|
|
改变屏幕分辨率
|
|
*/
|
|
window.onresize = function(){
|
|
refreshPage('/BKYWQ/command/materialDeploy/showlistOverview.do');
|
|
}
|
|
|
|
//物资
|
|
var domaterial = function() {
|
|
$.post(ext.contextPath + '/command/materialDeploy/add.do', {} , function(data) {
|
|
$("#subDiv").html(data);
|
|
openModal('subModal');
|
|
});
|
|
};
|
|
//设备筛选页面
|
|
var domateriallist = function() {
|
|
var typeId = $("#typeId").val();
|
|
var typeIdDetail = $("#typeIdDetail").val();
|
|
$.post(ext.contextPath + '/command/materialDeploy/materialSelectList.do', {
|
|
typeId:typeId,typeIdDetail:typeIdDetail
|
|
} , function(data) {
|
|
$("#subDiv").html(data);
|
|
openModal('subModallist');
|
|
});
|
|
};
|
|
|
|
/*
|
|
筛选按钮
|
|
*/
|
|
function selectFunction(){
|
|
var typeId = $("#typeId").val();
|
|
var typeIdDetail = $("#typeIdDetail").val();
|
|
var search_name = $("#search_name").val();
|
|
//getEquData(typeId,typeIdDetail,search_name);
|
|
echartData(typeId,typeIdDetail,search_name);
|
|
}
|
|
|
|
/*
|
|
获取设备大类内容
|
|
*/
|
|
function getEquipmentType(){
|
|
$.ajax({
|
|
type:'post',
|
|
url:ext.contextPath + '/command/materialDeploy/getStockType.do',
|
|
async: true,
|
|
globle:false,
|
|
error: function(){
|
|
return false;
|
|
},
|
|
success: function(data){
|
|
var data=eval('(' + data + ')');
|
|
|
|
$("#table1").empty();
|
|
var tr = '<td style="width:120px;color:#6F6F6F;">物资类别</td><td><span id="bx1" class="selectText" onclick="updateColor(\'bx1\')">不限</span></td>';
|
|
for (var i = 0; i < data.length; i++) {
|
|
tr += '<td><span id='+data[i].stockTypeId+' class="selectText" onclick="updateColor('+data[i].stockTypeId+')">'+data[i].stockTypeName+'</span></td>';
|
|
}
|
|
$("#table1").append('<tr>'+tr+'</tr>');
|
|
|
|
$("#table2").append('<tr><td style="width:120px;color:#6F6F6F;">物资小类</td><td><span id="bx2" class="selectText" onclick="updateColor2(\'bx2\')">不限</span></td></tr>');
|
|
}
|
|
});
|
|
}
|
|
|
|
/*
|
|
点击改变颜色
|
|
*/
|
|
function updateColor(id){
|
|
/*
|
|
下面几行为操作设备大类
|
|
*/
|
|
var typeId = $('#typeId').val();//获取原有颜色
|
|
if(typeId!=null && typeId!=''){
|
|
document.getElementById(typeId).style.color="#000000";//将原有td颜色恢复
|
|
}
|
|
document.getElementById(id).style.color="red";//将点击类型改变颜色
|
|
$('#typeId').val(id);//给新Id赋值
|
|
|
|
if(id=='bx1'){
|
|
var typeIdDetail = $('#typeIdDetail').val();//获取原有颜色
|
|
if(typeIdDetail!=null && typeIdDetail!=''){
|
|
document.getElementById(typeIdDetail).style.color="#000000";//将原有td颜色恢复
|
|
}
|
|
document.getElementById('bx2').style.color="red";//将原有td颜色恢复
|
|
$('#typeIdDetail').val('bx2');//给新Id赋值
|
|
}else{
|
|
$.ajax({
|
|
type:'post',
|
|
url:ext.contextPath + '/command/materialDeploy/getStockDetail.do?id='+id,
|
|
async: true,
|
|
globle:false,
|
|
error: function(){
|
|
return false;
|
|
},
|
|
success: function(data){
|
|
var data=eval('(' + data + ')');
|
|
|
|
$("#table2").empty();
|
|
var tr = '<td style="width:120px;color:#6F6F6F;">设备小类</td><td><span id="bx2" class="selectText" onclick="updateColor2(\'bx2\')">不限</span></td>';
|
|
for (var i = 0; i < data.length; i++) {
|
|
tr += '<td><span id='+data[i].stockTypeId+' class="selectText" onclick="updateColor2('+data[i].stockTypeId+')">'+data[i].stockTypeName+'</span></td>';
|
|
}
|
|
$("#table2").append('<tr>'+tr+'</tr>');
|
|
|
|
document.getElementById('bx2').style.color="red";//将点击类型改变颜色
|
|
$('#typeIdDetail').val('bx2');//给新Id赋值
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
/*
|
|
点击改变颜色
|
|
*/
|
|
function updateColor2(id){
|
|
/*
|
|
下面几行为操作设备大类
|
|
*/
|
|
var typeIdDetail = $('#typeIdDetail').val();//获取原有颜色
|
|
if(typeIdDetail!=null && typeIdDetail!=''){
|
|
document.getElementById(typeIdDetail).style.color="#000000";//将原有td颜色恢复
|
|
}
|
|
document.getElementById(id).style.color="red";//将点击类型改变颜色
|
|
$('#typeIdDetail').val(id);//给新Id赋值
|
|
}
|
|
|
|
/*
|
|
获取管理中心及区控中心的数量
|
|
*/
|
|
/*function getEquData(typeId,typeIdDetail,searchName){
|
|
$.ajax({
|
|
type:'post',
|
|
url:ext.contextPath + '/command/materialDeploy/getMaterialData.do?typeId='+typeId+'&typeIdDetail='+typeIdDetail+'&searchName='+encodeURI(encodeURI(searchName)),
|
|
async: true,
|
|
globle:false,
|
|
error: function(){
|
|
return false;
|
|
},
|
|
success: function(data){
|
|
var data=eval('(' + data + ')');
|
|
for (var i = 0; i < data.length; i++) {
|
|
$('#equNum'+i).text(data[i].Msize);//赋值管理中心设备数量
|
|
for (var j = 0; j < data[i].Rnum.length; j++) {
|
|
$('#equNum'+i+j).text(data[i].Rnum[j].Rsize);//赋值区控中心设备数量
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}*/
|
|
|
|
function echartData(typeId,typeIdDetail,searchName){
|
|
//根据分辨率自适应
|
|
var wid = document.body.clientWidth;
|
|
var hei = document.body.clientHeight;
|
|
|
|
//$('#divbottom').height(hei-30);//顶部工具栏固定30px 其余为下面div高度
|
|
|
|
var textSize1 = 0;//环形图里面的字大小
|
|
var textSize2 = 0;//标签类 的大小
|
|
if(wid>0 && hei>0){
|
|
textSize1 = 10;
|
|
textSize2 = 8;
|
|
}
|
|
if(wid>768 && hei>432){
|
|
textSize1 = 12;
|
|
textSize2 = 12;
|
|
}
|
|
if(wid>992 && hei>558){
|
|
textSize1 = 14;
|
|
textSize2 = 12;
|
|
}
|
|
if(wid>1200 && hei>675){
|
|
textSize1 = 16;
|
|
textSize2 = 14;
|
|
}
|
|
//循环所有echart数据
|
|
for (var i = 0; i < ${companyList}.length; i++) {
|
|
echart(i,'container'+i,${companyList}[i].companyId,textSize1,textSize2,typeId,typeIdDetail,searchName);//设备状态占比
|
|
}
|
|
}
|
|
|
|
var mychart;
|
|
function echart(morder,container,companyId,textSize1,textSize2,typeId,typeIdDetail,searchName){
|
|
var EleId = document.getElementById(container);
|
|
$.ajax({
|
|
type:'GET',
|
|
url:ext.contextPath + '/command/materialDeploy/getEchartData.do?id='+companyId+'&math='+Math.random()+'&typeId='+typeId+'&typeIdDetail='+typeIdDetail+'&searchName='+encodeURI(encodeURI(searchName)),
|
|
async: true,
|
|
globle:false,
|
|
error: function(){
|
|
return false;
|
|
},
|
|
success: function(data){
|
|
var data=eval('(' + data + ')');
|
|
mychart=echarts.init(EleId);
|
|
var colors = [ '#FFFFFF', '#439CFF'];//折线图颜色
|
|
var name = new Array()
|
|
var namenum = new Array()
|
|
var nameprice = new Array()
|
|
|
|
var totalNum = 0;//管理中心总物资数 各厂累加
|
|
var totalPrice = 0;//管理中心总价格 各厂累加
|
|
|
|
for (var i = 0; i < data.length; i++) {
|
|
name[i]=data[i].fname;//厂名
|
|
|
|
var nums = data[i].fnum/1;
|
|
var numfloat = nums.toFixed(2);
|
|
namenum[i]=numfloat;//厂物资数量
|
|
|
|
var price = data[i].fprice/10000;
|
|
var pricefloat = price.toFixed(2);
|
|
nameprice[i]=pricefloat;//厂总价
|
|
|
|
totalNum += numfloat/1;
|
|
totalPrice +=pricefloat/1;
|
|
}
|
|
|
|
$('#totalNum'+morder).text(totalNum);
|
|
$('#totalPrice'+morder).text(totalPrice);
|
|
|
|
var option = {
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
axisPointer: {
|
|
type: 'cross',
|
|
crossStyle: {
|
|
color: '#999'
|
|
}
|
|
}
|
|
},
|
|
toolbox: {
|
|
feature: {
|
|
dataView: {show: false, readOnly: false},
|
|
magicType: {show: false, type: ['line', 'bar']},
|
|
restore: {show: false},
|
|
saveAsImage: {show: false}
|
|
}
|
|
},
|
|
legend: {
|
|
data:['数量','价格']
|
|
},
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
data: name,
|
|
axisLabel: {
|
|
interval:0,
|
|
rotate:40
|
|
},
|
|
axisPointer: {
|
|
type: 'shadow'
|
|
}
|
|
}
|
|
],
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
name: '数量',
|
|
min: 0,
|
|
//max: 250,
|
|
//interval: 50,
|
|
axisLabel: {
|
|
formatter: '{value}'
|
|
}
|
|
},
|
|
{
|
|
type: 'value',
|
|
name: '价格(万元)',
|
|
min: 0,
|
|
//max: 25,
|
|
//interval: 5,
|
|
axisLabel: {
|
|
formatter: '{value}'
|
|
}
|
|
}
|
|
],
|
|
/*grid:{
|
|
left:'10%',//组件距离容器左边的距离
|
|
right:'20%',
|
|
},*/
|
|
series: [
|
|
{
|
|
name:'数量',
|
|
type:'bar',
|
|
data:namenum
|
|
},
|
|
{
|
|
name:'价格',
|
|
type:'bar',
|
|
yAxisIndex: 1,
|
|
data:nameprice
|
|
}
|
|
]
|
|
|
|
};
|
|
mychart.clear();
|
|
mychart.setOption(option);
|
|
mychart.resize();//主动调用resize达到区域更新的效果,用于自动刷新区域大小
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
|
|
</head>
|
|
|
|
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
|
|
<input type="hidden" name="typeId" id="typeId" value="">
|
|
<input type="hidden" name="typeIdDetail" id="typeIdDetail" value="">
|
|
|
|
<div class="wrapper" style="overflow-y:hidden;">
|
|
<!-- 引用top -->
|
|
<%-- <jsp:include page="/jsp/top.jsp"></jsp:include> --%>
|
|
<!-- 菜单栏 -->
|
|
<%-- <jsp:include page="/jsp/left.jsp"></jsp:include> --%>
|
|
<!-- BEGIN CONTENT -->
|
|
<div class="content-wrapper">
|
|
<div id="subDiv" style="width: 350px;height:10px;line-height: 5px;"></div>
|
|
<div id="user4SelectDiv"></div>
|
|
<section class="content-header">
|
|
<h4 id ="head_title"></h4>
|
|
<ol class="breadcrumb">
|
|
<li><a id ='head_firstlevel' href="#"><i class="fa fa-dashboard"></i> </a></li>
|
|
</ol>
|
|
</section>
|
|
<div id="page-content" class="page-content" >
|
|
<!-- BEGIN CONTAINER -->
|
|
<div id="centerdiv" >
|
|
<div class="top_div" style="overflow:hidden;">
|
|
<button type="button" class="btn btn-primary btn-sm" style="background-color:#1790FF;" onclick="domateriallist();">物资资源查询</button>
|
|
<button type="button" class="btn btn-primary btn-sm" style="background-color:#1790FF;" onclick="domaterial();">调拨</button>
|
|
<div class="input-group input-group-sm pull-right" style="width: 250px;">
|
|
<input type="text" id="search_name" name="search_name" class="form-control pull-right" placeholder="物资名称">
|
|
<div class="input-group-btn">
|
|
<button class="btn btn-default" onclick="selectFunction();"><i class="fa fa-search"></i></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="center_div" style="overflow:hidden;">
|
|
<div class="searchDiv">
|
|
<table class="table table-condensed" id="table1">
|
|
|
|
</table>
|
|
</div>
|
|
<div class="searchDiv">
|
|
<table class="table table-condensed" id="table2">
|
|
|
|
</table>
|
|
</div>
|
|
<div class="searchDiv">
|
|
<table class="table table-condensed">
|
|
<tr>
|
|
<td style="width:120px;color:#6F6F6F;">单价</td>
|
|
<td style="color:#6F6F6F;">
|
|
单价范围
|
|
<input type="text" name="" value="" style="width:50px;height:20px"> 一
|
|
<input type="text" name="" value="" style="width:50px;height:20px">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div>
|
|
<table class="table table-condensed">
|
|
<tr>
|
|
<td style="color:#000000;">
|
|
<button type="button" class="btn btn-primary btn-sm" style="background-color:#1790FF;margin-left:1%;" onclick="selectFunction()">筛选</button>
|
|
<button type="button" class="btn btn-primary btn-sm" style="background-color:#C0C0C0;border-color:#C0C0C0;">重置</button>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<c:set var="rowcount" value="${0}" />
|
|
<c:forEach var="current" items="${companyList}">
|
|
<div class="bottom_div" style="overflow:hidden;background-color:#FFFFFF">
|
|
<div class="bottom_div_1">
|
|
<div style="height:15%;"></div>
|
|
<div class="manageName">${current.companyName}</div>
|
|
</div>
|
|
<div class="bottom_div_2">
|
|
<div class="equNumName">总物资数量:
|
|
<span class="equNum" id="totalNum${rowcount}">查询中..</span>
|
|
</div>
|
|
<div class="equNumName" style="margin-left:20%;">总价格:
|
|
<span class="equNum" id="totalPrice${rowcount}">查询中..</span>(万元)
|
|
</div>
|
|
</div>
|
|
<div class="bottom_div_3">
|
|
<div class="container" id="container${rowcount}" style="width:100%;height:100%;"></div>
|
|
</div>
|
|
</div>
|
|
<c:set var="rowcount" value="${rowcount+1}" />
|
|
</c:forEach>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |