拼了个HtmlLayout的grid库,大数据不适用
By
onething576
at 2022-04-14 • 0人收藏 • 1067人看过
htgrid.aardio 库代码如下:
//htgrid 表格 import web.layout; import web.layout.behavior.grid; class htgrid { ctor(winform){ this.wbwin=..web.layout( winform ); this.dwt={}; this.wbwin.html = /* <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <widget type="select" id="report"> <table .layout-grid fixedrows=1 fixedlayout #table> <thead/><tbody/> </table> </widget> </body> </html> */ this.mcss= /* html { background-color: white white white white; } #report { width:*; height:*; padding:-6px; margin:-2px; line-height:100%; } body,table,th,td{ font-family:"宋体","Verdana"; font-size:9pt; } table.layout-grid{ background:white; border:1px solid #999; width:*; height:*; behavior: grid column-resizer; overflow:auto; flow: table-fixed; font-size:9pt; //font-size:62.5%; border-spacing:0; border-top:1px solid black; border-left:1px solid black; } table.layout-grid th{ color: black; background-color: #F1F5F9 white white #F4F3F9; font-size:9pt; border-right:1px solid #DDD; border-bottom:1px solid #EEE; border-right:1px solid black; border-bottom:1px solid black; padding:1px; font-weight:normal; line-height:1.6em; text-align:center; } table.layout-grid th:hover { border-bottom-color: orange; } table.layout-grid tbody tr{ height:1.4em; border-bottom:1px solid #EEE; } table.layout-grid tbody tr:hover{ background:blue; color:white; } table.layout-grid td { display:block; //context-menu: selector(menu#menuId); white-space:nowrap; padding:2px; border-right:1px solid #EEE; border-right:1px solid black; border-bottom:1px solid black; vertical-align: middle; } */ this.wbwin.css =this.mcss }; sethead=function(col_w,col_m){ this.col_w=col_w this.wbwin.$1("thead").innerText="";this.wbwin.$1("thead").updateHTML(); var tr="<tr>"; for(i=1;#col_m;1){ if (!col_w){tr+="<th style='width: 60px;'>"++col_m[i]++"</th>";}else { tr+="<th style='width: "+col_w[i]+"px;'>"++col_m[i]++"</th>" } } tr+="</tr>" this.wbwin.$1("thead").insertAdjacentHTML("beforeEnd",tr) } setTable=function(dt){ this.dwt=dt; } showTable=function(){ this.wbwin.$1("tbody").innerText="";this.wbwin.$1("tbody").updateHTML(); if !( #this.dwt) return; var dbTable=this.dwt var fields = this.dwt.fields; var tr=""; for(i=1;#dbTable;1){ tr="<tr role='option' value='"+i+"'>"; for (c=1;#fields;1){ if (dbTable[i][fields[c]]=null or dbTable[i][fields[c]]=0){tr+="<td/>"}else { tr+="<td>"++tostring(dbTable[i][fields[c]])++"</td>" } } tr+="</tr>" this.wbwin.$1("tbody").insertAdjacentHTML("beforeEnd",tr); } } toxlsx=function(fn){ var ht_h=this.wbwin.$1("thead") import com.excel; var excel = com.excel() excel.alerts = false; //关闭所有操作提示 //excel.createFile(fn); //创建指定文件名的excel文件 var book = excel.WorkBooks.Add(); //创建工作簿excel.ActiveWorkbook;//excel.WorkBooks.Add() var sheet = book.Sheets(1); sheet.Name="导出数据"; var dt=this.dwt var rows=#dt;//表体行数 var cols=#dt.fields;//表头列数 for (i=1;cols;1){ sheet.Cells(1,i).Value2=ht_h.child(1).child(i).innerText; } for (i=1;rows;1){ for (j=1;cols;1){ sheet.Cells(i+1,j).Value2=dt[i][dt.fields[j]]:""; } } //字体9,细框线,黑色 with sheet.range("A1").reSize(rows+1,cols){ with Font { Size = 9 } with Borders{ ColorIndex = 1 LineStyle = 1 } //BorderAround(1,2,1) Columns.AutoFit() } //标题居中,背景改色 with sheet.range("A1").reSize(1,cols){ HorizontalAlignment = xlCenter VerticalAlignment = xlCenter with Font { Bold = true } with Interior { ColorIndex = 15 Pattern = xlSolid PatternColorIndex = xlAutomatic } } excel.SaveAs(fn); //指定文件名保存 excel.Quit(); //退出 book = null;sheet = null;excel = null;//释放所有对excel对象的引用 collectgarbage("collect");//内存回收,确保excel完全退出 ..win.msgbox("已保存为"+fn); } } /*intellisense() htgrid.sethead(宽度,标题) = 加载列名,指定宽度数组,标题数组 htgrid.setTable(dt) = 加载数据源 htgrid.showTable() = 显示数据,有局限性,未分页 htgrid.toxlsx(fn) = 导出到Execl,参数:文件名fn end intellisense*/
使用代码, mainForm.aardio 代码如下:
import win.ui; /*DSG{{*/ mainForm = win.form(text="aardio工程3";right=679;bottom=474) mainForm.add( button={cls="button";text="导出XLSX";left=536;top=435;right=676;bottom=469;db=1;dr=1;z=2}; static={cls="static";left=0;top=0;right=339;bottom=431;bgcolor=12639424;db=1;dl=1;dr=1;dt=1;z=1}; static2={cls="static";left=341;top=0;right=680;bottom=434;bgcolor=12639424;db=1;dl=1;dr=1;dt=1;z=3}) /*}}*/ //创建测试数据库 import sqlite; var db = sqlite("/test-sqlite.db"); if( not db.existsTable("each-tab") ){ db.exec( "CREATE TABLE [each-tab](text, number, cid);"); //添加测试数据 var cmd = db.prepare("INSERT INTO [each-tab] VALUES (@text, @number , @cid );") for(i=1;15;1){ cmd.step(number = i;text = "测试数据" + i;cid = string.random(8); ) } } import htgrid; var dw1=htgrid(mainForm.static) var mcss= dw1.mcss var lcss=/** table tbody td:nth-child(1), table tbody td:nth-child(4) { text-align:center;} //第1列,第四列内容居中 table tbody td:nth-child(2) { text-align:left;} //第2列,第二列内容居左 **/ dw1.wbwin.setCss(mcss+lcss) dw1.sethead({60;100;80;90},{"编码";"物料名称";"规格型号";"id"}) dw1.setTable(db.getTable("SELECT rowid,text,number,cid FROM [each-tab]")) dw1.showTable() dw2.wbwin.setCss(mcss+lcss2) dw2.sethead({50;80;100},{"编码";"规格型号";"id"}) //取光标行数据 var ltb=dw1.wbwin.$1("#report table") ltb.onTableRowClick = function (ltTarget,ltOwner,rowIndex,behaviorParams) { var index=dw1.wbwin.$1("#report").value;//光标行 if (index>0 and rowIndex>0) { dwmc=ltTarget.child(index).child(2).innerText;//取index行的第四个字段 dw2.setTable(db.getTable("SELECT rowid,number,cid FROM [each-tab] where text='"+dwmc+"'")) dw2.showTable() } } ltb.attachEventHandler(); //导出excel文件 import fsys.dlg; mainForm.button.oncommand = function(id,event){ var fn= fsys.dlg.save("xlsx文件|*.xlsx|"); if(fn){dw1.toxlsx(fn)} } mainForm.show(); return win.loopMessage();
工程下载:
5 个回复 | 最后更新于 2022-04-17
登录后方可回帖
感谢分享.
贴代码可以选[代码语言里面的aardio] ,然后将代码黏贴到里面就行了,
我发现你有一个函数名写错了 ,另外少了数据库 , 我给你稍微修改了下,![](/static/editor/dialogs/emotion/images/pp/i_f02.png)