SpreadJS是否提供了弹出窗的api

收藏

本帖最后由 Richard.Huang 于 2023-11-7 12:12 编辑

产品：SpreadJS
版本：16.1.4

现在想重写合并单元格的默认行为，在用户操作合并单元格的时候给出一个弹窗提示，用户点击确定后才进行下一步操作，为了保持ui的一致，所以希望弹出如图所示风格的弹窗。想知道是否有api可以支持此操作。

image.png345267028.png

Joestar.Xu · Joestar.Xu

您好，可以参考这个链接中的内容来实现弹出对话框的功能：https://demo.grapecity.com.cn/sp ... gner#showmessagebox

搬砖小李 · 搬砖小李

Joestar.Xu 发表于 2023-11-1 17:30
您好，可以参考这个链接中的内容来实现弹出对话框的功能：https://demo.grapecity.com.cn/spreadjs/help/ap ...

好的我试试

Joestar.Xu · Joestar.Xu

搬砖小李 · 搬砖小李

本帖最后由搬砖小李于 2023-11-1 21:21 编辑

Joestar.Xu 发表于 2023-11-1 17:51

我现在重写合并单元格的逻辑，加入了一些确认操作，使用弹窗回调执行合并后，发现撤销操作导致单元格状态不对了

{
const oldAddSpan = GC.Spread.Sheets.Worksheet.prototype.addSpan
GC.Spread.Sheets.Worksheet.prototype.addSpan = function newAddSpan(...args) {
const [row, col, rowCount, colCount] = args
const sheet = spread.getActiveSheet()
// 保持和Excel行为一致，禁止表格区域合并
for(const table of sheet.tables.all()) {
if(isOverlapWithTable({ row, col, rowCount, colCount}, table)) {
GC.Spread.Sheets.Designer.showMessageBox('禁止表格内的单元格合并', 'SpreadJS 设计器', GC.Spread.Sheets.Designer.MessageBoxIcon.warning)
return
}
}
// 保持和Excel行为一致
// 合并前：[空][公式1][公式2] 合并后：[公式1]，取消合并后：[公式1][空][空]
// 合并前：[值1][公式1][公式2] 合并后：[值1]，取消合并后：[值1][空][空]
let firstFormula = null
let firstValue = null
let firstFind = false
let valueCellCount = 0 // 有值的单元格个数
for(let rowIndex = row; rowIndex <= row + rowCount - 1; rowIndex++) {
for(let colIndex = col; colIndex <= col + colCount - 1; colIndex++) {
const formula = sheet.getFormula(rowIndex, colIndex)
const value = sheet.getValue(rowIndex, colIndex)
if(!firstFind) {
if(formula) {
firstFormula = formula
firstFind = true
} else if(value !== null && value !== undefined) {
firstValue = value
firstFind = true
}
}
if(formula || value) {
valueCellCount++
}
}
}
function doSpan() {
for(let rowIndex = row; rowIndex <= row + rowCount - 1; rowIndex++) {
for(let colIndex = col; colIndex <= col + colCount - 1; colIndex++) {
sheet.setFormula(rowIndex, colIndex, null)
sheet.setValue(rowIndex, colIndex, null)
}
}
// sheet.clear(row, col, rowCount, colCount)
if(firstFormula) {
sheet.setFormula(row, col, firstFormula)
} else {
sheet.setValue(row, col, firstValue)
}
oldAddSpan.apply(sheet, args)
}
if(firstFind && valueCellCount > 1) {
GC.Spread.Sheets.Designer.showMessageBox(
'合并单元格时，仅保留左上角的值，而放弃其他值。',
'SpreadJS 设计器',
GC.Spread.Sheets.Designer.MessageBoxIcon.warning,
(action) => {
if(action === GC.Spread.Sheets.Designer.MessageBoxResult.ok) {
doSpan()
}
},
() => {},
GC.Spread.Sheets.Designer.MessageBoxButtons.okCancel
)
} else {
doSpan()
}
}

复制代码

Joestar.Xu · Joestar.Xu

您好，您说的“撤销操作导致单元格状态不对了”，具体指的是什么情况？

搬砖小李 · 搬砖小李

搬砖小李发表于 2023-11-1 21:19
我现在重写合并单元格的逻辑，加入了一些确认操作，使用弹窗回调执行合并后，发现撤销操作导致单元格状态 ...

我发现如果多个选区合并会弹多个窗，现在我考虑使用重写【MergeCells】、【MergeCenter】、【MergeAcross】方法来实现我的逻辑，正向功能实现了，但是当ctrl+z回退时，发现相当于只执行了取消合并的操作，单元格的状态无法恢复，代码如下：

export function rewriteMergeCell(commandName){
let newCommand=GC.Spread.Sheets.Designer.getCommand(commandName)
let oldExecute = newCommand.execute
newCommand.execute = function (context, options = {}, isMerge) {
console.log(context, options, isMerge)
if(!isMerge) {
return oldExecute.call(this, context, options, isMerge)
}
const sheet= context.Spread.getActiveSheet()
const selections=sheet.getSelections()
const ranges = []
function doSpan() {
// GC.Spread.Sheets.Command.startTransaction(context.Spread, options)
for (const range of ranges) {
const {row, rowCount, col, colCount, firstFormula, firstValue} = range
sheet.clear(row, col, rowCount, colCount, GC.Spread.Sheets.SheetArea.viewport,GC.Spread.Sheets.StorageType.data)
if(firstFormula) {
sheet.setFormula(row, col, firstFormula)
} else {
sheet.setValue(row, col, firstValue)
}
}
oldExecute.call(this, context, options, isMerge)
// GC.Spread.Sheets.Command.endTransaction(context.Spread, options)
}
for(const range of selections) {
const { row, col, rowCount, colCount } = range
// 保持和Excel行为一致，禁止表格区域合并
for(const table of sheet.tables.all()) {
if(isOverlapWithTable({ row, col, rowCount, colCount}, table)) {
GC.Spread.Sheets.Designer.showMessageBox('禁止表格内的单元格合并', 'SpreadJS 设计器', GC.Spread.Sheets.Designer.MessageBoxIcon.warning)
return
}
}
// 保持和Excel行为一致
// 合并前：[空][公式1][公式2] 合并后：[公式1]，取消合并后：[公式1][空][空]
// 合并前：[值1][公式1][公式2] 合并后：[值1]，取消合并后：[值1][空][空]
let firstFormula = null
let firstValue = null
let firstFind = false
let valueCellCount = 0 // 有值的单元格个数
for(let rowIndex = row; rowIndex <= row + rowCount - 1; rowIndex++) {
for(let colIndex = col; colIndex <= col + colCount - 1; colIndex++) {
const formula = sheet.getFormula(rowIndex, colIndex)
const value = sheet.getValue(rowIndex, colIndex)
if(!firstFind) {
if(formula) {
firstFormula = formula
firstFind = true
} else if(value !== null && value !== undefined) {
firstValue = value
firstFind = true
}
}
if(formula || value) {
valueCellCount++
}
}
}
ranges.push({row, rowCount, col, colCount, firstFormula, firstValue, valueCellCount, firstFind})
}
// 查询每个选区域，看看是否有的选区范围内有多个值
let valueCellCount = 0
for(const range of ranges) {
valueCellCount = Math.max(range.valueCellCount, valueCellCount)
}
if(valueCellCount > 1) {
GC.Spread.Sheets.Designer.showMessageBox(
'合并单元格时，仅保留左上角的值，而放弃其他值。',
'SpreadJS 设计器',
GC.Spread.Sheets.Designer.MessageBoxIcon.warning,
(action) => {
if(action === GC.Spread.Sheets.Designer.MessageBoxResult.ok) {
doSpan()
}
},
() => {},
GC.Spread.Sheets.Designer.MessageBoxButtons.okCancel
)
} else {
doSpan()
}
}
return newCommand
}

复制代码

搬砖小李 · 搬砖小李

Joestar.Xu 发表于 2023-11-2 11:20
您好，您说的“撤销操作导致单元格状态不对了”，具体指的是什么情况？

哈喽，我修改了逻辑，麻烦看下我下边的逻辑，然后执行结果是这样的
[空][公式1][空]       合并后       [公式1 _____________       crtl+z             [公式1][空][空]
[空][空][空]    ===========》  ___________________    ===========》 [空][空][空]
[空][公式2][空]                         __________________]                               [空][空][空]

搬砖小李 · 搬砖小李

Joestar.Xu · Joestar.Xu

您这边提供的代码我无法运行，缺少commandName变量，我尝试修改但仍然无法重现您的逻辑效果，请您提供一个完整的Demo，这边复现后调研一下。

		自动登录	找回密码
密码			立即注册

[已处理] SpreadJS是否提供了弹出窗的api

19 个回复

SpreadJS 认证

SpreadJS 高级认证