找回密码
 立即注册

QQ登录

只需一步,快速开始

eyAndrew

金牌服务用户

72

主题

314

帖子

912

积分

金牌服务用户

积分
912
eyAndrew
金牌服务用户   /  发表于:2023-8-3 11:44  /   查看:2130  /  回复:22
image.png354179686.png

使用spreadjs画了个**,项目名称这一列,需要自定义图标放在右侧,点击去处理逻辑,填充项目名称,
新增一条,也能把自定义图标带过来。
有没有好的解决方案?

22 个回复

倒序浏览
Richard.HuangSpreadJS 开发认证
超级版主   /  发表于:2023-8-3 12:26:36
沙发
本帖最后由 Richard.Huang 于 2023-8-3 12:28 编辑

您好,您画的这个**可以添加到单元格的装饰中,然后通过监听表格新增事件实现style的复制以此就可以将自定义图标带过来了:
1. 添加装饰API:https://demo.grapecity.com.cn/spreadjs/SpreadJSTutorial/features/cells/cell-style-decoration-icons#timestamp


// 示例代码
var style;
function setIcon(row, col, style) {
    style.hAlign = GC.Spread.Sheets.HorizontalAlign.center;
    style.vAlign = GC.Spread.Sheets.VerticalAlign.center;
    sheet.setStyle(row, col, style);
    sheet.setText(row, col, 'Cell Text');
    sheet.getRange(row, col, 1, 1)
        .setBorder(new GC.Spread.Sheets.LineBorder("green", GC.Spread.Sheets.LineStyle.dashed)
            , { outline: true });
};
//left side in the cell
style = new GC.Spread.Sheets.Style();
style.decoration = {
    icons: [
        {
            src: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjEyIiBoZWlnaHQ9IjEyIiBmaWxsPSJ0cmFuc3BhcmVudCIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTcgOUg1TDUgNS45NjA0NmUtMDhIN0w3IDlaTTYgMTBDNi41NTIyOCAxMCA3IDEwLjQ0NzcgNyAxMUM3IDExLjU1MjMgNi41NTIyOCAxMiA2IDEyQzUuNDQ3NzIgMTIgNSAxMS41NTIzIDUgMTFDNSAxMC40NDc3IDUuNDQ3NzIgMTAgNiAxMFoiIGZpbGw9IiNFNjUyNDkiLz4KPC9zdmc+Cg==',
            position: GC.Spread.Sheets.IconPosition.left
        }
    ]
};
setIcon(1, 1, style);


2. 添加table新增行事件:https://demo.grapecity.com.cn/spreadjs/help/api/classes/GC.Spread.Sheets.Events#toprowchanged
// 监听表插入事件
sheet.bind(GC.Spread.Sheets.Events.TableRowsChanged, function (e, data) {
    var intIndex = sheet.getSelections()[0].row;
    console.log(intIndex)
    sheet.copyTo(intIndex - 1, 0, intIndex, 0, 1, sheet.getColumnCount(), GC.Spread.Sheets.CopyToOptions.style);
});





新增一行样式统一.rar

1.79 KB, 下载次数: 51

回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:2023-8-3 13:34:36
板凳
您好,您这个自定义图标是如何实现的呢?

如果是使用自定义单元格实现的话,那么只需要在增加的时候为下面那一行的指定单元格设置为带有图片的单元格即可。

如果不是的话还请您详细描述一下自定义图标的实现。
SpreadJS 17.0.8 | GcExcel 7.1.1 已发布~
回复 使用道具 举报
eyAndrew
金牌服务用户   /  发表于:2023-8-3 14:25:37
地板
Joestar.Xu 发表于 2023-8-3 13:34
您好,您这个自定义图标是如何实现的呢?

如果是使用自定义单元格实现的话,那么只需要在增加的时候为下 ...

自定义单元格的话,那这个单元格没法回写数据了把?  理想效果是,第一列的每一行单元格,右侧有一个操作图标按钮, 点击选中数据后,单元格回写数据。
回复 使用道具 举报
eyAndrew
金牌服务用户   /  发表于:2023-8-3 14:32:50
5#
本帖最后由 eyAndrew 于 2023-8-3 15:05 编辑
Richard.Huang 发表于 2023-8-3 12:26
您好,您画的这个**可以添加到单元格的装饰中,然后通过监听表格新增事件实现style的复制以此就可以将自定 ...

这个装饰,没办法触发点击事件吧? 而且不能设置两个图标吧?
回复 使用道具 举报
Richard.HuangSpreadJS 开发认证
超级版主   /  发表于:2023-8-3 16:50:57
6#
您好,请问可以给一个demo让我们可以精准解决您的需求吗
回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:2023-8-3 17:49:25
7#
您好,如上所述,请您提供一个可以复现的Demo,并准确描述一下您的需求,以便我们这边寻找合适的解决方案。
SpreadJS 17.0.8 | GcExcel 7.1.1 已发布~
回复 使用道具 举报
eyAndrew
金牌服务用户   /  发表于:2023-8-3 18:00:52
8#
Joestar.Xu 发表于 2023-8-3 17:49
您好,如上所述,请您提供一个可以复现的Demo,并准确描述一下您的需求,以便我们这边寻找合适的解决方案。

我还没开发,想提前请教下最佳实践, 只有**的模板ssjson, 需要么?
回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:2023-8-4 09:47:09
9#
eyAndrew 发表于 2023-8-3 18:00
我还没开发,想提前请教下最佳实践, 只有**的模板ssjson, 需要么?

可以的,您提供一下,我们这边在您提供的ssjson的基础上进行修改。
SpreadJS 17.0.8 | GcExcel 7.1.1 已发布~
回复 使用道具 举报
eyAndrew
金牌服务用户   /  发表于:2023-8-4 15:33:37
10#
invoice.ssjson (38.58 KB, 下载次数: 47)
回复 使用道具 举报
123下一页
您需要登录后才可以回帖 登录 | 立即注册
返回顶部