diff --git a/entry/src/main/ets/pages/Index.ets b/entry/src/main/ets/pages/Index.ets index 3b00f1db4c0a07508d8dcc34ff29132720d6ba47..08ab13549a21a01b1a60aa71390fa5645e715ec9 100644 --- a/entry/src/main/ets/pages/Index.ets +++ b/entry/src/main/ets/pages/Index.ets @@ -14,7 +14,7 @@ import { DialogType, OptionDialog } from './Dialog'; struct Index { dialogController?: CustomDialogController @State vTableController: VTableController = new VTableController(); - columns: Record>[] = [ + columns: Record>[] = [ { "field": "A", "title": "工号", @@ -91,7 +91,7 @@ struct Index { "columns": [], "records": [], "autoWrapText": true, - "defaultRowHeight": "auto", + "defaultRowHeight": 30, "editor": "input", "editCellTrigger": "doubleclick", "resize": { @@ -111,18 +111,18 @@ struct Index { "text": "bbb" }, ] - imageColumns: Record>[] = [ + imageColumns: Record>[] = [ { "field": "A", "title": "icon", "width": "auto", "editor": "input", - "icon":{ - "type":"image", + "icon": { + "type": "image", "src": "https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/VTable/custom-render/flower.jpg", - "width":12, - "height":12, - "positionType":"left" + "width": 12, + "height": 12, + "positionType": "left" } }, { @@ -186,6 +186,7 @@ struct Index { break case DialogType.UNFREEZE_ROW: this.vTableController.frozenRow(1) + this.vTableController.renderWithRecreateCells() break case DialogType.UNFREEZE_COLUMN: this.vTableController.frozenToCol(0) @@ -516,19 +517,26 @@ struct Index { .onSelect((event) => { this.floatingWindowType = event }) - Button('取消选中') - .borderRadius(0) - .backgroundColor('#70949292') - .fontColor(Color.Black) - .onClick(() => { - console.log(`==========>this.isShow:`, JSON.stringify(this.isShow)) - this.vTableController.clearSelected() - }) + // Button('取消选中') + // .borderRadius(0) + // .backgroundColor('#70949292') + // .fontColor(Color.Black) + // .onClick(() => { + // console.log(`==========>this.isShow:`, JSON.stringify(this.isShow)) + // this.vTableController.clearSelected() + // }) Button('合并单元格') .borderRadius(0) .backgroundColor('#70949292') .fontColor(Color.Black) .onClick(() => { + this.vTableController.unmergeCells( + Math.min(this.mergeCellParams[0], this.mergeCellParams[2]), + Math.min(this.mergeCellParams[1], this.mergeCellParams[3]), + Math.max(this.mergeCellParams[0], this.mergeCellParams[2]), + Math.max(this.mergeCellParams[1], this.mergeCellParams[3]) + ); + this.vTableController.mergeCell( Math.min(this.mergeCellParams[0], this.mergeCellParams[2]), Math.min(this.mergeCellParams[1], this.mergeCellParams[3]), @@ -565,7 +573,8 @@ struct Index { .backgroundColor('#70949292') .fontColor(Color.Black) .onClick(() => { - this.vTableController.cancelCustomRender(this.mergeCellParams[0], this.mergeCellParams[1],this.mergeCellParams[2], this.mergeCellParams[3]) + this.vTableController.cancelCustomRender(this.mergeCellParams[0], this.mergeCellParams[1], + this.mergeCellParams[2], this.mergeCellParams[3]) }) } diff --git a/library/src/main/ets/util/VTableController.ets b/library/src/main/ets/util/VTableController.ets index 7405725ebcd26abba9caf7926d751dfbf9a68a90..15590c192c59f507b61b2a4fe643650b6326c4d1 100644 --- a/library/src/main/ets/util/VTableController.ets +++ b/library/src/main/ets/util/VTableController.ets @@ -144,23 +144,26 @@ export class VTableController { } // 自定义渲染 - customRender(startCol: number, startRow: number, endCol: number, endRow: number,id:string = 'default',style?:Record){ + customRender(startCol: number, startRow: number, endCol: number, endRow: number, id: string = 'default', + style?: Record) { if (!this.checkInitialized()) { return; } - const deStyle:Record = { - "borderColor":"red", - "borderLineWidth":4, - "fontSize":20, - "bgColor":"yellow", + const deStyle: Record = { + "borderColor": "red", + "borderLineWidth": 4, + "fontSize": 20, + "bgColor": "yellow", } const deStyleStr = JSON.stringify(deStyle) const styleStr = JSON.stringify(style) - this.controller!.runJavaScript(`customRender(${startCol},${startRow},${endCol},${endRow},${id},${deStyleStr})`) + this.controller!.runJavaScript(`customRender(${startCol},${startRow},${endCol},${endRow},"${id}",${deStyleStr})`) .catch((error: Error) => { console.error("Error customRender:", error); }) + this.renderWithRecreateCells() } + // 取消自定义渲染 cancelCustomRender(startCol: number, startRow: number, endCol: number, endRow: number) { if (!this.checkInitialized()) { @@ -250,7 +253,7 @@ export class VTableController { } // 更新表格参数 - updateOption(option: Record>){ + updateOption(option: Record>) { if (!this.checkInitialized()) { return; } @@ -270,6 +273,16 @@ export class VTableController { }) } + renderWithRecreateCells() { + if (!this.checkInitialized()) { + return; + } + this.controller!.runJavaScript(`renderWithRecreateCells()`) + .catch((error: Error) => { + console.error("Error renderWithRecreateCells:", error); + }) + } + release() { if (!this.checkInitialized()) { return; diff --git a/library/src/main/resources/rawfile/vtable_util.js b/library/src/main/resources/rawfile/vtable_util.js index 73e1a096a55620285bf33a241243dfafeff861b5..0e7ac10fde7ad8dc6862aa4abe7e0d28f1f0018b 100644 --- a/library/src/main/resources/rawfile/vtable_util.js +++ b/library/src/main/resources/rawfile/vtable_util.js @@ -238,12 +238,8 @@ function customRender(startCol, startRow, endCol, endRow, id, style) { } // 自定义渲染复原 function customRenderRestore(startCol, startRow, endCol, endRow) { - const style = { - borderColor:'', - borderLineWidth:0, - bgColor:'', - fontSize:null, - } + const style = window.tableInstance.theme.style + window.tableInstance.registerCustomCellStyle('none',style) const pos = { range:{ @@ -389,4 +385,8 @@ function clearSelected() { function updateOption(options) { window.tableInstance.updateOption(options); +} + +function renderWithRecreateCells(){ + window.tableInstance.renderWithRecreateCells(); } \ No newline at end of file