function CreateReportShow(x,y,width,height,pageHeight) { //列表控件 listView = new ht.widget.ListView(); //listView.setCheckMode(true); var SelectTime=""; listView.onDataClicked=function(data)//选择某个数据 { if(!data) return; SelectTime=data.a('Name'); } //布局控件 borderPaneDayReport = new ht.widget.BorderPane(); borderPaneDayReport.setLeftView(listView, 180); //表格控件 var ReportDiv=document.createElement("div"); var ReportDivChild=document.createElement("div"); ReportDiv.appendChild(ReportDivChild); ReportDivChild.className="sample-turtorial"; var reportWidth=width-180; var reportHeight=(height)*document.documentElement.clientHeight /pageHeight-28; ReportDivChild.style='width:'+reportWidth+'px; height:'+reportHeight+'px;border: 1px solid gray;'; ReportSpread =new GC.Spread.Sheets.Workbook(ReportDivChild, { sheetCount: 1 }); //表格加入布局 //borderPaneDayReport.setRightView(ReportDiv,width-180); borderPaneDayReport.setCenterView(ReportDiv); var NodeStartTimeDiv=document.createElement("div"); NodeStartTimeDiv.innerHTML = '
'; document.body.appendChild(NodeStartTimeDiv); var NodeEndTimeDiv=document.createElement("div"); NodeEndTimeDiv.innerHTML = '
'; document.body.appendChild(NodeEndTimeDiv); toolbar = new ht.widget.Toolbar(); borderPaneDayReport.setTopView(toolbar); //按钮 lookButton1=new ht.widget.Button(); lookButton1.setWidth(40); lookButton1.setLabel("查看"); lookButton1.setBorderColor("#4682B4"); lookButton1.setBackground("#4682B4"); lookButton1.setLabelColor("#FFFAF0"); lookButton1.onClicked= function(e) { SetTimeSelectDivValue(NodeStartTimeDiv,SelectTime,"date"); var tempEndTime1=new Date(Date.parse(SelectTime)); tempEndTime1.setDate(tempEndTime1.getDate()+1); SetTimeSelectDivValue(NodeEndTimeDiv,tempEndTime1.toString(),"date"); } downloadButton1=new ht.widget.Button(); downloadButton1.setWidth(40); downloadButton1.setLabel("导出"); downloadButton1.setBorderColor("#4682B4"); downloadButton1.setBackground("#4682B4"); downloadButton1.setLabelColor("#FFFAF0"); lookButton2=new ht.widget.Button(); lookButton2.setWidth(40); lookButton2.setLabel("查询"); lookButton2.setBorderColor("#4682B4"); lookButton2.setBackground("#4682B4"); lookButton2.setLabelColor("#FFFAF0"); downloadButton2=new ht.widget.Button(); downloadButton2.setWidth(40); downloadButton2.setLabel("导出"); downloadButton2.setBorderColor("#4682B4"); downloadButton2.setBackground("#4682B4"); downloadButton2.setLabelColor("#FFFAF0"); toolbar.getSelectBackground = function(item){ return '#3D97D0'; }; toolbar.setItems([ { id: 'text', label: '', icon: 'image/search.png', textField: { width: 80 } }, { label: '', element:lookButton1 }, { label: '', element:downloadButton1 }, { id: 'nation', label: '开始时间 ', }, { id: 'nation', label: ' ', element: NodeStartTimeDiv }, { id: 'nation', label: '结束时间 ', }, { id: 'nation', label: ' ', element: NodeEndTimeDiv }, { label: '', element:lookButton2 }, { label: '', element:downloadButton2 }, ]); toolbar.getItemById('text').element.getElement().onkeyup = function(e){ listView.invalidateModel(); }; //时间选择控件 初始化时间 (function (elem, timeValue, type) { timeValue = getRelativeDate(timeValue, type); laydate.render({ elem: elem, type: type, value: timeValue, done: function(value, date){ setTimeout(function () { ; }, 100) } }); ; })(NodeStartTimeDiv, '2017-09-21', 'date'); //时间选择控件 初始化时间 SetTimeSelectDivValue(NodeEndTimeDiv, '2017-01-01', 'date'); //建立一个websocket链接 var socket = new WebSocket('ws://localhost:10087/Command'); // 打开Socket socket.onopen = function(event) { console.log('web socket connceted!',event); //请求报表js数据 var obj=new CommandObj(); obj.method="GetReportJsFile"; obj.parm1="day"; var objStr=JSON.stringify(obj); socket.send(objStr); //请求报表生成日期列表 socket.send("{\"method\":\"GetHaveSaveDayList\"}"); }; // 监听消息 socket.onmessage = function(event) { console.log('Client received a message',event); var receiveObj=JSON.parse(event.data); if(receiveObj.method=="GetHaveSaveDayList") { var dayList=JSON.parse(receiveObj.obj); dayList.forEach(function(val,index,arr) { AddListViewElem(listView,val); }); } else if(receiveObj.method=="GetReportJsFile") { var jsObj=JSON.parse(receiveObj.obj); importJSON(ReportSpread,jsObj); } }; // 监听Socket的关闭 socket.onclose = function(event) { console.log('Client notified socket has closed',event); }; listView.setRowHeight(30); //添加列表中的数据 //AddListViewElem(listView); /*products.forEach(function(product){ var data = new ht.Data(); data.a(product); listView.dm().add(data); }); */ listView.enableToolTip(); listView.getLabel = function(data){ return data.a('ProductName') + ' - $' + data.a('UnitPrice').toFixed(2); }; ht.Default.setImage('productIcon', { width: 50, height: 50, clip: function(g, width, height) { g.beginPath(); g.arc(width/2, height/2, Math.min(width, height)/2-3, 0, Math.PI * 2, true); g.clip(); }, comps: [ { type: 'image', stretch: 'uniform', rect: [0, 0, 50, 50], name: {func: function(data){return data.a('ProductId');}} } ] }); listView.drawRowBackground = function(g, data, selected, xx, yy, widthb, heightb){ if(this.isSelected(data)){ g.fillStyle = '#87A6CB'; } else if(this.getRowIndex(data) % 2 === 0){ g.fillStyle = '#F1F4F7'; } else{ g.fillStyle = '#FAFAFA'; } g.beginPath(); g.rect(xx, yy, widthb, heightb); g.fill(); }; listView.setIndent(60); //listView.getIcon = function(data){ // return 'productIcon'; // }; listView.enableToolTip(); listView.getLabel = function(data){ return data.a('Name'); }; listView.getToolTip = function(e){ var data = this.getDataAt(e); if(data) { return 'ProductId: ' + data.a('ProductId') + '
' + 'ProductName: ' + data.a('ProductName') + '
' + 'QuantityPerUnit: ' + data.a('QuantityPerUnit') + '
' + 'Description: ' + data.a('Description'); } return null; }; sortFunc = function(d1, d2){ return d1.a('UnitPrice') - d2.a('UnitPrice'); }; listView.setSortFunc(sortFunc); listView.setVisibleFunc(function(data){ var text = toolbar.v('text'); if(text){ return data.a('Name').toLowerCase().indexOf(text.toLowerCase()) >= 0; } return true; }); var borderPaneRealNode = new ht.HtmlNode(); borderPaneRealNode.setScalable(false); borderPaneRealNode.s({ '2d.selectable': true, '2d.movable': false }); borderPaneRealNode.setHtml(borderPaneDayReport); borderPaneRealNode.setPosition({ x: x, y: y }); borderPaneRealNode.setWidth(width); borderPaneRealNode.setHeight(height); borderPaneRealNode.setPadding(0); /*startSubscribe();*/ /*getSnapshotCallback();*/ return borderPaneRealNode; }; //添加列表控件的数据 function AddListViewElem(listView,obj) { var data = new ht.Data(); data.a(obj); listView.dm().add(data); } //导入报表的json数据 function importJSON (spread,jsonData) { ApplyCustomFunc(spread); spread.fromJSON(jsonData); ApplyCustomFunc(spread); var json = spread.toJSON(); spread.fromJSON(json); var sheet = spread.getSheet(0); sheet.options.colHeaderVisible=false; sheet.options.rowHeaderVisible=false; spread.options.newTabVisible=false; spread.options.tabStripVisible=false; spread.options.showHorizontalScrollbar=true; ResetFormular(spread); } //设置时间选择控件的时间 function SetTimeSelectDivValue(elem, timeValue, type) { timeValue = getRelativeDate(timeValue, type); laydate.render({ elem: elem, type: type, value: timeValue, done: function(value, date){ setTimeout(function () { ; }, 100) } }); ; } function CommandObj() { var method=""; var parm1=""; } function ReceiveObj() { var method=""; var obj=""; }