Pārlūkot izejas kodu

完善设计器中Table显示问题

master
jacky6024 pirms 7 gadiem
vecāks
revīzija
f584cf399b
  1. 20
      ureport2-console/src/main/resources/asserts/js/designer.bundle.js
  2. 53
      ureport2-js/src/designer.js
  3. 6
      ureport2-js/src/dialog/BuildinDatasourceSelectDialog.js
  4. 6
      ureport2-js/src/dialog/MethodSelectDialog.js
  5. 16
      ureport2-js/src/dialog/OpenDialog.js
  6. 6
      ureport2-js/src/dialog/ParameterTable.js
  7. 10
      ureport2-js/src/dialog/SaveDialog.js
  8. 59
      ureport2-js/src/tools/AlignLeftTool.js
  9. 57
      ureport2-js/src/tools/AlignTopTool.js
  10. 64
      ureport2-js/src/tools/BgcolorTool.js
  11. 63
      ureport2-js/src/tools/FontFamilyTool.js
  12. 54
      ureport2-js/src/tools/FontSizeTool.js
  13. 64
      ureport2-js/src/tools/ForecolorTool.js

20
ureport2-console/src/main/resources/asserts/js/designer.bundle.js

Faila izmaiņas netiek rādītas, jo viena vai vairākas līnijas ir pārāk garas

53
ureport2-js/src/designer.js

@ -50,6 +50,11 @@ export default class UReportDesigner{
_this.buildPropertyPanel();
this.bindSelectionEvent(function(rowIndex, colIndex, row2Index, col2Index){
_this.propertyPanel.refresh(rowIndex,colIndex,row2Index,col2Index);
for(let tool of _this.tools){
if(tool.refresh){
tool.refresh(rowIndex,colIndex,row2Index,col2Index);
}
}
});
_this.printLine=new PrintLine(_this.context);
const rows=_this.context.reportDef.rows;
@ -112,30 +117,30 @@ export default class UReportDesigner{
buildTools(context){
const toolbar=$(`<div class="btn-group ud-toolbar"></div>`);
this.container.prepend(toolbar);
const tools=[];
tools.push(new PreviewTool(context));
tools.push(new SaveTool(context));
tools.push(new OpenTool(context));
tools.push(new ImportTool(context));
tools.push(new RedoTool(context));
tools.push(new UndoTool(context));
tools.push(new MergeTool(context));
tools.push(new AlignLeftTool(context));
tools.push(new AlignTopTool(context));
tools.push(new BorderTool(context));
tools.push(new FontFamilyTool(context));
tools.push(new FontSizeTool(context));
tools.push(new BoldTool(context));
tools.push(new ItalicTool(context));
tools.push(new UnderlineTool(context));
tools.push(new BgcolorTool(context));
tools.push(new ForecolorTool(context));
tools.push(new CrosstabTool(context));
tools.push(new ImageTool(context));
tools.push(new ZxingTool(context));
//tools.push(new ChartTool(context));
tools.push(new SettingsTool(context));
for(const tool of tools){
this.tools=[];
this.tools.push(new PreviewTool(context));
this.tools.push(new SaveTool(context));
this.tools.push(new OpenTool(context));
this.tools.push(new ImportTool(context));
this.tools.push(new RedoTool(context));
this.tools.push(new UndoTool(context));
this.tools.push(new MergeTool(context));
this.tools.push(new AlignLeftTool(context));
this.tools.push(new AlignTopTool(context));
this.tools.push(new BorderTool(context));
this.tools.push(new FontFamilyTool(context));
this.tools.push(new FontSizeTool(context));
this.tools.push(new BoldTool(context));
this.tools.push(new ItalicTool(context));
this.tools.push(new UnderlineTool(context));
this.tools.push(new BgcolorTool(context));
this.tools.push(new ForecolorTool(context));
this.tools.push(new CrosstabTool(context));
this.tools.push(new ImageTool(context));
this.tools.push(new ZxingTool(context));
//this.tools.push(new ChartTool(context));
this.tools.push(new SettingsTool(context));
for(const tool of this.tools){
toolbar.append(tool.buildButton());
}
}

6
ureport2-js/src/dialog/BuildinDatasourceSelectDialog.js

@ -29,7 +29,7 @@ export default class BuildinDatasourceSelectDialog{
}
initBody(body,footer){
const table=$(`<table class="table table-bordered">
<thead><tr style="background: #f4f4f4"><td>数据源名称</td><td></td></tr></thead>
<thead><tr style="background: #f4f4f4;height: 30px;"><td style="vertical-align: middle">数据源名称</td><td style="vertical-align: middle"></td></tr></thead>
</table>`);
this.tbody=$(`<tbody></tbody>`);
table.append(this.tbody);
@ -43,8 +43,8 @@ export default class BuildinDatasourceSelectDialog{
url:window._server+"/datasource/loadBuildinDatasources",
success:function(result){
for(let name of result){
const tr=$(`<tr><td>${name}</td></tr>`);
const selectTD=$(`<td></td>`);
const tr=$(`<tr style="height: 35px;"><td style="vertical-align: middle">${name}</td></tr>`);
const selectTD=$(`<td style="vertical-align: middle"></td>`);
tr.append(selectTD);
const selector=$(`<a href="###"><i class="glyphicon glyphicon-hand-up" style="font-size: 13pt"></i></a>`);
selector.click(function(){

6
ureport2-js/src/dialog/MethodSelectDialog.js

@ -26,7 +26,7 @@ export default class MethodSelectDialog{
}
initBody(body,footer){
const table=$(`<table class="table table-bordered">
<thead><tr style="background: #f4f4f4"><td>方法名</td><td></td></tr></thead>
<thead><tr style="background: #f4f4f4;height: 30px;"><td style="vertical-align: middle">方法名</td><td style="vertical-align: middle"></td></tr></thead>
</table>`);
this.tbody=$(`<tbody></tbody>`);
table.append(this.tbody);
@ -41,8 +41,8 @@ export default class MethodSelectDialog{
data:{beanId},
success:function(result){
for(let method of result){
const tr=$(`<tr><td>${method}</td></tr>`);
const selectTD=$(`<td></td>`);
const tr=$(`<tr style="height: 35px;"><td style="vertical-align: middle">${method}</td></tr>`);
const selectTD=$(`<td style="vertical-align: middle"></td>`);
tr.append(selectTD);
const selector=$(`<a href="###"><i class="glyphicon glyphicon-hand-up" style="font-size: 13pt"></i></a>`);
selector.click(function(){

16
ureport2-js/src/dialog/OpenDialog.js

@ -34,7 +34,11 @@ export default class OpenDialog{
body.append(providerGroup);
const tableContainer=$(`<div style="height:350px;overflow: auto"></div>`);
body.append(tableContainer);
const fileTable=$(`<table class="table table-bordered"><thead><tr style="background: #f4f4f4"><td>文件名</td><td style="width: 150px">修改日期</td><td style="width:50px">打开</td><td style="width:50px">删除</td></tr></thead></table>`);
const fileTable=$(`<table class="table table-bordered"><thead><tr style="background: #f4f4f4;height: 30px;">
<td style="vertical-align: middle">文件名</td>
<td style="width: 150px;vertical-align: middle">修改日期</td>
<td style="width:50px;vertical-align: middle">打开</td>
<td style="width:50px;vertical-align: middle">删除</td></tr></thead></table>`);
this.fileTableBody=$(`<tbody></tbody>`);
fileTable.append(this.fileTableBody);
tableContainer.append(fileTable);
@ -50,12 +54,12 @@ export default class OpenDialog{
return;
}
for(let file of reportFiles){
let tr=$(`<tr></tr>`);
let tr=$(`<tr style="height: 35px;"></tr>`);
_this.fileTableBody.append(tr);
tr.append(`<td>${file.name}</td>`);
tr.append(`<td>${formatDate(file.updateDate)}</td>`);
tr.append(`<td style="vertical-align: middle;">${file.name}</td>`);
tr.append(`<td style="vertical-align: middle;">${formatDate(file.updateDate)}</td>`);
let openCol=$(`<td></td>`);
let openCol=$(`<td style="vertical-align: middle;"></td>`);
tr.append(openCol);
let openIcon=$(`<a href="###"><i class="glyphicon glyphicon-folder-open" style="color: #008ed3;font-size: 14pt"></i></a>`);
openCol.append(openIcon);
@ -67,7 +71,7 @@ export default class OpenDialog{
});
});
let deleteCol=$(`<td></td>`);
let deleteCol=$(`<td style="vertical-align: middle;"></td>`);
tr.append(deleteCol);
let deleteIcon=$(`<a href="###"><i class="glyphicon glyphicon-trash" style="color: red;font-size: 14pt"></i></a>`);
deleteCol.append(deleteIcon);

6
ureport2-js/src/dialog/ParameterTable.js

@ -11,7 +11,7 @@ export default class ParameterTable{
const _this=this;
const table=$(`<table class="table table-bordered">
<thead>
<tr style="background: #f4f4f4"><td>参数名</td><td></td><td></td><td></td></tr>
<tr style="background: #f4f4f4;height: 30px;"><td style="vertical-align: middle">参数名</td><td style="vertical-align: middle"></td><td style="vertical-align: middle"></td><td style="vertical-align: middle"></td></tr>
</thead>
</table>`);
this.body=$(`<tbody></tbody>`);
@ -23,8 +23,8 @@ export default class ParameterTable{
parameterDialog.show(function(name,type,defaultValue){
const obj={name,type,defaultValue};
data.push(obj);
const newTr=$(`<tr><td>${name}</td><td>${type}</td><td>${defaultValue}</td></tr>`);
const removeTd=$(`<td></td>`);
const newTr=$(`<tr style="height: 35px;"><td style="vertical-align: middle">${name}</td><td style="vertical-align: middle">${type}</td><td style="vertical-align: middle">${defaultValue}</td></tr>`);
const removeTd=$(`<td style="vertical-align: middle"></td>`);
const removeSpan=$(`<span><a href="###"><i class="glyphicon glyphicon-trash" style="font-size: 12pt;color: #d30a16;"></a></span>`);
removeTd.append(removeSpan);
newTr.append(removeTd);

10
ureport2-js/src/dialog/SaveDialog.js

@ -38,7 +38,7 @@ export default class SaveDialog{
body.append(providerGroup);
const tableContainer=$(`<div style="height:350px;overflow: auto"></div>`);
body.append(tableContainer);
const fileTable=$(`<table class="table table-bordered"><thead><tr style="background: #f4f4f4"><td>文件名</td><td style="width: 150px">修改日期</td><td style="width:50px">删除</td></tr></thead></table>`);
const fileTable=$(`<table class="table table-bordered"><thead><tr style="background: #f4f4f4;height: 30px;"><td style="vertical-align: middle">文件名</td><td style="width: 150px;vertical-align: middle">修改日期</td><td style="width:50px;vertical-align: middle">删除</td></tr></thead></table>`);
this.fileTableBody=$(`<tbody></tbody>`);
fileTable.append(this.fileTableBody);
tableContainer.append(fileTable);
@ -54,11 +54,11 @@ export default class SaveDialog{
return;
}
for(let file of reportFiles){
let tr=$(`<tr></tr>`);
let tr=$(`<tr style="height: 35px;"></tr>`);
_this.fileTableBody.append(tr);
tr.append(`<td>${file.name}</td>`);
tr.append(`<td>${formatDate(file.updateDate)}</td>`);
let deleteCol=$(`<td></td>`);
tr.append(`<td style="vertical-align: middle">${file.name}</td>`);
tr.append(`<td style="vertical-align: middle">${formatDate(file.updateDate)}</td>`);
let deleteCol=$(`<td style="vertical-align: middle"></td>`);
tr.append(deleteCol);
let deleteIcon=$(`<a href="###"><i class="glyphicon glyphicon-trash" style="color: red;font-size: 14pt"></i></a>`);
deleteCol.append(deleteIcon);

59
ureport2-js/src/tools/AlignLeftTool.js

@ -21,10 +21,16 @@ export default class AlignLeftTool extends Tool{
buildButton(){
const _this=this;
this.align="left";
const group=$(`<div class="btn-group"></div>`);
const nameButton=$(`<button type="button" class="btn btn-default"
style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 1px 6px 5px;color: #0e90d2;font-size: 12pt;" title="上下对齐">
<i class="ureport ureport-alignleft" id="align_button" style="color: #0e90d2;"></i>
</button>`);
group.append(nameButton);
const mainBtn=$(`<button type="button" class="btn btn-default dropdown-toggle" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px;" data-toggle="dropdown" title="左右对齐">
<i class="ureport ureport-alignleft" style="color: #0e90d2;"></i>
<span class="caret"></span>
<span class="sr-only">切换下拉菜单</span>
</button>`);
const ul=$(`<ul class="dropdown-menu" role="menu"></ul>`);
const left=$(`<li>
@ -33,6 +39,26 @@ export default class AlignLeftTool extends Tool{
</a>
</li>`);
ul.append(left);
nameButton.click(function(){
const selectedCells=_this.context.hot.getSelected();
if(!selectedCells || selectedCells.length===0){
alert("请先选择单元格!");
return;
}
const align=_this.align;
let oldAligns=_this._buildCellAlign(_this.context,_this.align);
undoManager.add({
undo:function(){
oldAligns=_this._buildCellAlign(_this.context,null,oldAligns);
setDirty();
},
redo:function(){
oldAligns=_this._buildCellAlign(_this.context,align);
setDirty();
}
});
setDirty();
});
left.click(function(){
const selectedCells=_this.context.hot.getSelected();
if(!selectedCells || selectedCells.length===0){
@ -107,6 +133,35 @@ export default class AlignLeftTool extends Tool{
return group;
}
refresh(startRow,startCol,endRow,endCol){
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
for(let i=startRow;i<=endRow;i++) {
for (let j = startCol; j <= endCol; j++) {
let cellDef = this.context.getCell(i, j);
if (!cellDef) {
continue;
}
let cellStyle=cellDef.cellStyle;
const align=cellStyle.align || "left";
$("#align_button").removeClass().addClass("ureport ureport-align"+align);
this.align=align;
break;
}
break;
}
}
_buildCellAlign(context,align,prevAligns){
const oldAligns={},selected=context.hot.getSelected();
let startRow=selected[0],startCol=selected[1],endRow=selected[2],endCol=selected[3];
@ -134,6 +189,8 @@ export default class AlignLeftTool extends Tool{
}
$(td).css("text-align",align);
cellStyle.align=align;
$("#align_button").removeClass().addClass("ureport ureport-align"+align);
this.align=align;
}
}
return oldAligns;

57
ureport2-js/src/tools/AlignTopTool.js

@ -11,11 +11,37 @@ export default class AlignTopTool extends Tool{
buildButton(){
const _this=this;
this.align="middle";
const group=$(`<div class="btn-group"></div>`);
const nameButton=$(`<button type="button" class="btn btn-default"
style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 1px 6px 5px;color: #0e90d2;font-size: 12pt;" title="上下对齐">
<i class="ureport ureport-alignmiddle" id="valign_button" style="color: #0e90d2;"></i>
</button>`);
group.append(nameButton);
const mainBtn=$(`<button type="button" class="btn btn-default dropdown-toggle" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px" data-toggle="dropdown" title="上下对齐">
<i class="ureport ureport-aligntop" style="color: #0e90d2;"></i>
<span class="caret"></span>
<span class="sr-only">切换下拉菜单</span>
</button>`);
nameButton.click(function(){
const selectedCells=_this.context.hot.getSelected();
if(!selectedCells || selectedCells.length===0){
alert("请先选择单元格!");
return;
}
const align=_this.align;
let oldAligns=_this._buildCellAlign(_this.context,_this.align);
undoManager.add({
undo:function(){
oldAligns=_this._buildCellAlign(_this.context,null,oldAligns);
setDirty();
},
redo:function(){
oldAligns=_this._buildCellAlign(_this.context,align);
setDirty();
}
});
setDirty();
});
const ul=$(`<ul class="dropdown-menu" role="menu"></ul>`);
const top=$(`<li>
<a href="###">
@ -97,6 +123,33 @@ export default class AlignTopTool extends Tool{
return group;
}
refresh(startRow,startCol,endRow,endCol){
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
for(let i=startRow;i<=endRow;i++) {
for (let j = startCol; j <= endCol; j++) {
let cellDef = this.context.getCell(i, j);
if (!cellDef) {
continue;
}
let cellStyle=cellDef.cellStyle;
const valign=cellStyle.valign || "top";
$("#valign_button").removeClass().addClass("ureport ureport-align"+valign);
this.align=valign;
break;
}
break;
}
}
_buildCellAlign(context,align,prevAligns){
const oldAligns={},selected=context.hot.getSelected();
let startRow=selected[0],startCol=selected[1],endRow=selected[2],endCol=selected[3];
@ -124,6 +177,8 @@ export default class AlignTopTool extends Tool{
}
$(td).css("vertical-align",align);
cellStyle.valign=align;
$("#valign_button").removeClass().addClass("ureport ureport-align"+align);
this.align=align;
}
}
return oldAligns;

64
ureport2-js/src/tools/BgcolorTool.js

@ -8,10 +8,17 @@ export default class BgcolorTool extends Tool{
execute(){
}
buildButton(){
this.bgcolor="255,255,255";
const group=$(`<div class="btn-group"></div>`);
this.nameButton=$(`<button type="button" class="btn btn-default"
style="border:none;border-radius:0;background: #f8f8f8;padding: 2px 1px 6px 5px;color: #0e90d2;" title="背景颜色">
<span class="ureport ureport-bgcolor" style="color: #0e90d2;font-size: 13px"></span>
<span class="ud-select-bgcolor"></span>
</button>`);
group.append(this.nameButton);
const mainBtn=$(`<button type="button" class="btn btn-default dropdown-toggle" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px;" data-toggle="dropdown" title="背景颜色">
<i class="ureport ureport-bgcolor" style="color: #0e90d2;"></i>
<span class="caret"></span>
<span class="sr-only">切换下拉菜单</span>
</button>`);
const ul=$(`<ul class="dropdown-menu" role="menu" style="padding: 1px;"></ul>`);
const colorContainer=$(`<li></li>`);
@ -54,10 +61,10 @@ export default class BgcolorTool extends Tool{
endCol=startCol;
startCol=tmp;
}
let oldForecolorStyle=updateCellsBgcolorStyle(_this.context,startRow,startCol,endRow,endCol,color);
let oldForecolorStyle=updateCellsBgcolorStyle(_this.context,startRow,startCol,endRow,endCol,color,_this);
undoManager.add({
redo:function(){
oldForecolorStyle=updateCellsBgcolorStyle(_this.context,startRow,startCol,endRow,endCol,color);
oldForecolorStyle=updateCellsBgcolorStyle(_this.context,startRow,startCol,endRow,endCol,color,_this);
setDirty();
},
undo:function(){
@ -70,6 +77,8 @@ export default class BgcolorTool extends Tool{
let cellStyle=cellDef.cellStyle;
let bgcolor=oldForecolorStyle[i+","+j];
cellStyle.bgcolor=bgcolor;
$('.ud-select-bgcolor').css("background-color","rgb("+bgcolor+")");
_this.bgcolor=bgcolor;
}
}
table.render();
@ -78,13 +87,58 @@ export default class BgcolorTool extends Tool{
});
setDirty();
});
this.nameButton.click(function(){
if(!_this.checkSelection()){
return;
}
const table=_this.context.hot;
const selected=table.getSelected();
let startRow=selected[0],startCol=selected[1],endRow=selected[2],endCol=selected[3];
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
updateCellsBgcolorStyle(_this.context,startRow,startCol,endRow,endCol,_this.bgcolor,_this);
});
group.append(mainBtn);
group.append(ul);
return group;
}
refresh(startRow,startCol,endRow,endCol){
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
for(let i=startRow;i<=endRow;i++) {
for (let j = startCol; j <= endCol; j++) {
let cellDef = this.context.getCell(i, j);
if (!cellDef) {
continue;
}
let cellStyle=cellDef.cellStyle;
const bgcolor=cellStyle.bgcolor || "255,255,255";
$('.ud-select-bgcolor').css("background-color","rgb("+bgcolor+")");
this.bgcolor=bgcolor;
break;
}
break;
}
}
}
function updateCellsBgcolorStyle(context,startRow,startCol,endRow,endCol,color){
function updateCellsBgcolorStyle(context,startRow,startCol,endRow,endCol,color,_this){
let hot=context.hot;
const oldForecolorStyle={};
for(let i=startRow;i<=endRow;i++){
@ -97,6 +151,8 @@ function updateCellsBgcolorStyle(context,startRow,startCol,endRow,endCol,color){
let cellStyle=cellDef.cellStyle;
oldForecolorStyle[i+","+j]=cellStyle.bgcolor;
cellStyle.bgcolor=color;
$('.ud-select-bgcolor').css("background-color","rgb("+color+")");
_this.bgcolor=color;
}
}
hot.render();

63
ureport2-js/src/tools/FontFamilyTool.js

@ -9,10 +9,16 @@ export default class FontFamilyTool extends Tool{
}
buildButton(){
const _this=this;
this.fontFamily="宋体";
const group=$(`<div class="btn-group"></div>`);
const mainBtn=$(`<button type="button" class="btn btn-default" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px;" data-toggle="dropdown" title="字体">
<i class="ureport ureport-fontfamily" style="color: #0e90d2;"></i>
<span class="caret dropdown-toggle"></span>
this.nameButton=$(`<button type="button" class="btn btn-default"
style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 1px 6px 5px;color: #0e90d2;" title="字体">
宋体
</button>`);
group.append(this.nameButton);
const mainBtn=$(`<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px;" title="字体">
<span class="caret"></span>
<span class="sr-only">切换下拉菜单</span>
</button>`);
const ul=$(`<ul class="dropdown-menu" role="menu" style="padding: 1px;"></ul>`);
const fonts=[];
@ -34,20 +40,52 @@ export default class FontFamilyTool extends Tool{
if(!_this.checkSelection()){
return;
}
triggerFontFamily.call(this,_this.context,family);
triggerFontFamily.call(_this,_this.context,family.attr("data"),_this.nameButton);
setDirty();
});
}
this.nameButton.click(function(){
if(!_this.checkSelection()){
return;
}
triggerFontFamily.call(_this,_this.context,_this.fontFamily,_this.nameButton);
setDirty();
});
group.append(mainBtn);
group.append(ul);
return group;
}
refresh(startRow,startCol,endRow,endCol){
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
for(let i=startRow;i<=endRow;i++) {
for (let j = startCol; j <= endCol; j++) {
let cellDef = this.context.getCell(i, j);
if (!cellDef) {
continue;
}
let cellStyle=cellDef.cellStyle;
const fontFamily=cellStyle.fontFamily || "宋体";
this.nameButton.html(fontFamily);
this.fontFamily=fontFamily;
break;
}
break;
}
}
}
function triggerFontFamily(context,li){
function triggerFontFamily(context,fontfamily,nameButton){
let hot=context.hot;
let fontfamily=li.attr("data");
let selected=hot.getSelected();
let startRow=selected[0],startCol=selected[1],endRow=selected[2],endCol=selected[3];
let tmp=endRow;
@ -60,10 +98,11 @@ function triggerFontFamily(context,li){
endCol=startCol;
startCol=tmp;
}
let oldFontFamily=updateFontFamily(context,startRow,startCol,endRow,endCol,fontfamily);
const _this=this;
let oldFontFamily=updateFontFamily(context,startRow,startCol,endRow,endCol,fontfamily,nameButton,_this);
undoManager.add({
redo:function(){
oldFontFamily=updateFontFamily(context,startRow,startCol,endRow,endCol,fontfamily);
oldFontFamily=updateFontFamily(context,startRow,startCol,endRow,endCol,fontfamily,nameButton,_this);
setDirty();
},
undo:function(){
@ -75,6 +114,8 @@ function triggerFontFamily(context,li){
}
let cellStyle=cellDef.cellStyle;
cellStyle.fontFamily=oldFontFamily[i+','+j];
nameButton.html(cellStyle.fontFamily);
_this.fontFamily=cellStyle.fontFamily;
}
}
hot.render();
@ -84,7 +125,7 @@ function triggerFontFamily(context,li){
setDirty();
}
function updateFontFamily(context,startRow,startCol,endRow,endCol,fontfamily){
function updateFontFamily(context,startRow,startCol,endRow,endCol,fontFamily,nameButton,_this){
let hot=context.hot;
const oldFontFamily={};
for(let i=startRow;i<=endRow;i++) {
@ -95,7 +136,9 @@ function updateFontFamily(context,startRow,startCol,endRow,endCol,fontfamily){
}
let cellStyle=cellDef.cellStyle;
oldFontFamily[i+','+j]=cellStyle.fontFamily;
cellStyle.fontFamily=fontfamily;
cellStyle.fontFamily=fontFamily;
nameButton.html(fontFamily);
_this.fontFamily=fontFamily;
}
}
hot.render();

54
ureport2-js/src/tools/FontSizeTool.js

@ -9,10 +9,14 @@ export default class FontSizeTool extends Tool{
}
buildButton(){
const _this=this;
this.fontSize=10;
const group=$(`<div class="btn-group"></div>`);
this.nameButton=$(`<button type="button" class="btn btn-default"
style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 1px 6px 5px;color: #0e90d2;font-size: 12pt;" title="字体尺寸">10</button>`);
group.append(this.nameButton);
const mainBtn=$(`<button type="button" class="btn btn-default dropdown-toggle" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px;" data-toggle="dropdown" title="字体尺寸">
<i class="ureport ureport-fontsize" style="color: #0e90d2;"></i>
<span class="caret"></span>
<span class="sr-only">切换下拉菜单</span>
</button>`);
const ul=$(`<ul class="dropdown-menu" role="menu" style="padding: 1px;"></ul>`);
for(let i=1;i<=100;i++){
@ -22,18 +26,50 @@ export default class FontSizeTool extends Tool{
if(!_this.checkSelection()){
return;
}
triggerFontSize.call(this,_this.context,size);
triggerFontSize.call(this,_this.context,size.attr("data"),_this.nameButton,_this);
});
}
this.nameButton.click(function(){
if(!_this.checkSelection()){
return;
}
triggerFontSize.call(this,_this.context,this.fontSize,_this.nameButton,_this);
});
group.append(mainBtn);
group.append(ul);
return group;
}
refresh(startRow,startCol,endRow,endCol){
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
for(let i=startRow;i<=endRow;i++) {
for (let j = startCol; j <= endCol; j++) {
let cellDef = this.context.getCell(i, j);
if (!cellDef) {
continue;
}
let cellStyle=cellDef.cellStyle;
const fontSize=cellStyle.fontSize || 10;
this.nameButton.html(fontSize);
this.fontSize=fontSize;
break;
}
break;
}
}
}
function triggerFontSize(context,li){
function triggerFontSize(context,fontsize,nameButton,_this){
let hot=context.hot;
let fontsize=li.attr("data");
let selected=hot.getSelected();
let startRow=selected[0],startCol=selected[1],endRow=selected[2],endCol=selected[3];
let tmp=endRow;
@ -46,10 +82,10 @@ function triggerFontSize(context,li){
endCol=startCol;
startCol=tmp;
}
let oldFontSize=updateFontSize(context,startRow,startCol,endRow,endCol,fontsize);
let oldFontSize=updateFontSize(context,startRow,startCol,endRow,endCol,fontsize,nameButton,_this);
undoManager.add({
redo:function(){
oldFontSize=updateFontSize(context,startRow,startCol,endRow,endCol,fontsize);
oldFontSize=updateFontSize(context,startRow,startCol,endRow,endCol,fontsize,nameButton,_this);
setDirty();
},
undo:function(){
@ -61,6 +97,8 @@ function triggerFontSize(context,li){
}
let cellStyle=cellDef.cellStyle;
cellStyle.fontSize=oldFontSize[i+','+j];
nameButton.html(cellStyle.fontSize);
_this.fontSize=cellStyle.fontSize;
}
}
hot.render();
@ -70,7 +108,7 @@ function triggerFontSize(context,li){
setDirty();
}
function updateFontSize(context,startRow,startCol,endRow,endCol,size){
function updateFontSize(context,startRow,startCol,endRow,endCol,size,nameButton,_this){
let hot=context.hot;
const oldFontSize={};
for(let i=startRow;i<=endRow;i++) {
@ -82,6 +120,8 @@ function updateFontSize(context,startRow,startCol,endRow,endCol,size){
let cellStyle=cellDef.cellStyle;
oldFontSize[i+','+j]=cellStyle.fontSize;
cellStyle.fontSize=size;
nameButton.html(size);
_this.fontSize=size;
}
}
hot.render();

64
ureport2-js/src/tools/ForecolorTool.js

@ -8,10 +8,17 @@ export default class ForecolorTool extends Tool{
execute(){
}
buildButton(){
this.forecolor="0,0,0";
const group=$(`<div class="btn-group"></div>`);
this.nameButton=$(`<button type="button" class="btn btn-default"
style="border:none;border-radius:0;background: #f8f8f8;padding: 2px 1px 6px 5px;color: #0e90d2;" title="填充颜色">
<i class="ureport ureport-forecolor" style="color: #0e90d2;font-size: 14px"></i>
<span class="ud-select-color"></span>
</button>`);
group.append(this.nameButton);
const mainBtn=$(`<button type="button" class="btn btn-default dropdown-toggle" style="border:none;border-radius:0;background: #f8f8f8;padding: 6px 5px;" data-toggle="dropdown" title="填充颜色">
<i class="ureport ureport-forecolor" style="color: #0e90d2;"></i>
<span class="caret"></span>
<span class="sr-only">切换下拉菜单</span>
</button>`);
const ul=$(`<ul class="dropdown-menu" role="menu" style="padding: 1px;"></ul>`);
const colorContainer=$(`<li></li>`);
@ -54,10 +61,10 @@ export default class ForecolorTool extends Tool{
endCol=startCol;
startCol=tmp;
}
let oldForecolorStyle=updateCellsForecolorStyle(_this.context,startRow,startCol,endRow,endCol,color);
let oldForecolorStyle=updateCellsForecolorStyle(_this.context,startRow,startCol,endRow,endCol,color,_this);
undoManager.add({
redo:function(){
oldForecolorStyle=updateCellsForecolorStyle(_this.context,startRow,startCol,endRow,endCol,color);
oldForecolorStyle=updateCellsForecolorStyle(_this.context,startRow,startCol,endRow,endCol,color,_this);
setDirty();
},
undo:function(){
@ -70,6 +77,8 @@ export default class ForecolorTool extends Tool{
let cellStyle=cellDef.cellStyle;
let forecolor=oldForecolorStyle[i+","+j];
cellStyle.forecolor=forecolor;
$('.ud-select-color').css("background-color","rgb("+forecolor+")");
_this.forecolor=forecolor;
}
}
hot.render();
@ -78,13 +87,58 @@ export default class ForecolorTool extends Tool{
});
setDirty();
});
this.nameButton.click(function(){
if(!_this.checkSelection()){
return;
}
const table=_this.context.hot;
const selected=table.getSelected();
let startRow=selected[0],startCol=selected[1],endRow=selected[2],endCol=selected[3];
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
updateCellsForecolorStyle(_this.context,startRow,startCol,endRow,endCol,_this.forecolor,_this);
});
group.append(mainBtn);
group.append(ul);
return group;
}
refresh(startRow,startCol,endRow,endCol){
let tmp=endRow;
if(startRow>endRow){
endRow=startRow;
startRow=tmp;
}
tmp=endCol;
if(startCol>endCol){
endCol=startCol;
startCol=tmp;
}
for(let i=startRow;i<=endRow;i++) {
for (let j = startCol; j <= endCol; j++) {
let cellDef = this.context.getCell(i, j);
if (!cellDef) {
continue;
}
let cellStyle=cellDef.cellStyle;
const forecolor=cellStyle.forecolor || "0,0,0";
$('.ud-select-color').css("background-color","rgb("+forecolor+")");
this.forecolor=forecolor;
break;
}
break;
}
}
}
function updateCellsForecolorStyle(context,startRow,startCol,endRow,endCol,color){
function updateCellsForecolorStyle(context,startRow,startCol,endRow,endCol,color,_this){
let hot=context.hot;
const oldForecolorStyle={};
for(let i=startRow;i<=endRow;i++){
@ -96,6 +150,8 @@ function updateCellsForecolorStyle(context,startRow,startCol,endRow,endCol,color
let cellStyle=cellDef.cellStyle;
oldForecolorStyle[i+","+j]=cellStyle.forecolor;
cellStyle.forecolor=color;
$('.ud-select-color').css("background-color","rgb("+color+")");
_this.forecolor=color;
}
}
hot.render();

Notiek ielāde…
Atcelt
Saglabāt