拼了个HtmlLayout的grid库,大数据不适用
By
onething576
at 2022-04-14 • 0人收藏 • 1315人看过

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] ,然后将代码黏贴到里面就行了,
我发现你有一个函数名写错了 ,另外少了数据库 , 我给你稍微修改了下,