请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

潘嗒嗒

注册会员

1

主题

6

帖子

17

积分

注册会员

积分
17
  • 71

    金币

  • 1

    主题

  • 6

    帖子

最新发帖
潘嗒嗒
注册会员   /  发表于:2025-1-27 19:04  /   查看:124  /  回复:11
1金币
本帖最后由 Joestar.Xu 于 2025-2-8 14:12 编辑


调研编号:SJS-28186

我有一个spreadjs分组折叠的联动需求,页面上并排有两个excel,用的同一个模板加载不同数据,模板自带分组折叠的工作,现在我需要点击左边excel的分组折叠按钮,右边的excel同时进行折叠动作,页面如下:
image.png218828124.png
这是我实现的代码,通过打印日志查看,其中标红处的部分有时候生效,有时候不生效:

image.png322426451.png


能帮忙看下原因吗?

11 个回复

倒序浏览
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:2025-1-28 11:40:29
沙发
您好,请问您当前使用的是SpreadJS的哪个版本?
回复 使用道具 举报
潘嗒嗒
注册会员   /  发表于:2025-1-28 12:15:53
板凳
SpreadJS17
回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:2025-1-28 23:43:17
地板
您好,您可以试试在repaint接口下面调用对应workBook上的refresh接口,我这边测试了一下可以按照预期联动。

image.png173177184.png
回复 使用道具 举报
潘嗒嗒
注册会员   /  发表于:2025-2-5 09:43:32
5#
Joestar.Xu 发表于 2025-1-28 23:43
您好,您可以试试在repaint接口下面调用对应workBook上的refresh接口,我这边测试了一下可以按照预期联动。 ...

你好,改成了refresh()还是时而生效时而不生效,和之前的效果一样,以下是完整代码
  1. async downloadLeftTemplateFun(templateName) {
  2.             let that = this
  3.             await downloadExcelTemplate({
  4.                 templateName: templateName
  5.             }).then(res => {
  6.                 this.$store.dispatch('comLoadingDisableFun', true);

  7.                 const blob = new Blob([res.data]);
  8.                 let excelIO = new IO();
  9.                 excelIO.open(blob, ((json) => {
  10.                     this.LeftExcelSpread.fromJSON(json);
  11.                     // 设置移动端滚动条样式
  12.                     this.LeftExcelSpread.options.showHorizontalScrollbar = true;
  13.                     // this.LeftExcelSpread.options.scrollbarAppearance = GC.Spread.Sheets.ScrollbarAppearance.mobile;
  14.                     // 控制滚动区域
  15.                     this.LeftExcelSpread.options.scrollbarMaxAlign = true;

  16.                     var activeSheet = this.LeftExcelSpread.getActiveSheet()
  17.                     activeSheet.name(this.categoryType)
  18.                     activeSheet.zoom(0.6);

  19.                     activeSheet.bind(GC.Spread.Sheets.Events.TopRowChanged, function (sender, args) {
  20.                         //垂直滚动同步
  21.                         that.newTopRow = args.newTopRow
  22.                         let rsheet = that.RightExcelSpread.getSheet(0)
  23.                         rsheet.showRow(args.newTopRow, GC.Spread.Sheets.VerticalPosition.top);
  24.                     });
  25.                     activeSheet.bind(GC.Spread.Sheets.Events.LeftColumnChanged, function (sender, args) {
  26.                         //水平滚动同步
  27.                         that.newLeftCol = args.newLeftCol
  28.                         let rsheet = that.RightExcelSpread.getSheet(0)
  29.                         rsheet.showColumn(args.newLeftCol, GC.Spread.Sheets.HorizontalPosition.left);
  30.                     });

  31.                     activeSheet.bind(GC.Spread.Sheets.Events.RangeGroupStateChanged, function (e, info) {
  32.                         console.log('range group state changed', e, info)
  33.                         console.log(activeSheet.rowOutlines.isCollapsed(info.index));
  34.                         let collapse = activeSheet.rowOutlines.isCollapsed(info.index)
  35.                         let rsheet = that.RightExcelSpread.getSheet(0)
  36.                         rsheet.rowOutlines.setCollapsed(info.index, collapse);
  37.                     });

  38.                     activeSheet.bind(GC.Spread.Sheets.Events.RangeGroupStateChanged, function (e, args) {
  39.                         let rsheet = that.RightExcelSpread.getActiveSheet()
  40.                         let lsheet = that.LeftExcelSpread.getActiveSheet()
  41.                         // 判断是行分组还是列分组,行/列分组要分开处理
  42.                         if (!args.isRowGroup) {
  43.                             // 判断展开列还是折叠列,另外一个Excel要跟着联动
  44.                             var groupIndex = lsheet.columnOutlines.direction() === 0 ? args.index - 1 : args.index;
  45.                             rsheet.columnOutlines.setCollapsed(groupIndex, lsheet.columnOutlines.isCollapsed(args.index));

  46.                             let leftColumn = lsheet.getViewportLeftColumn(1)
  47.                             rsheet.showColumn(leftColumn, GC.Spread.Sheets.HorizontalPosition.left);

  48.                             that.RightExcelSpread.refresh()
  49.                         }
  50.                     });

  51.                     // NOTE: 隐藏行/列号
  52.                     activeSheet.options.rowHeaderVisible = false;
  53.                     activeSheet.options.colHeaderVisible = false;

  54.                     this.LeftExcelSpread.suspendEvent();
  55.                     this.LeftExcelSpread.suspendPaint();

  56.                     // NOTE: 启用表单保护
  57.                     this.ProtectedFun(true, 'left');
  58.                     sheetEdit(this.LeftExcelSpread);
  59.                     for (var i = 0; i < this.LeftExcelSpread.getSheetCount(); i++) {
  60.                         this.LeftExcelSpread.getSheet(i).options.protectionOptions = {
  61.                             allowResizeRows: true, // 用户是否可以改变行高
  62.                             allowResizeColumns: true, // 用户是否可以改变列宽
  63.                             allowFilter: true,
  64.                             allowInsertColumns: false, // 用户是否可以插入列
  65.                             allowInsertRows: true, // 用户是否可以插入行
  66.                             allowOutlineRows: true,   // 开启保护后,允许分组行折叠展开
  67.                             allowOutlineColumns: true, // 开启保护后,允许分组列折叠展开
  68.                             allowDeleteRows: true, // 用户是否可以删除行
  69.                             allowDeleteColumns: true, // 用户是否可以删除列
  70.                         }
  71.                     }

  72.                     // this.initFillLeftSheetData()
  73.                     this.initFillLeftDrillDownData()

  74.                     this.LeftExcelSpread.resumeEvent();
  75.                     this.LeftExcelSpread.resumePaint();
  76.                     this.LeftExcelSpread.repaint()

  77.                     this.$store.dispatch('comLoadingDisableFun', false);
  78.                 }))
  79.             })
  80.         },

复制代码

回复 使用道具 举报
潘嗒嗒
注册会员   /  发表于:2025-2-5 10:17:48
6#
Joestar.Xu 发表于 2025-1-28 23:43
您好,您可以试试在repaint接口下面调用对应workBook上的refresh接口,我这边测试了一下可以按照预期联动。 ...

image.png978579406.png
如上我加了两段日志,打印结果如下:
image.png775340575.png

image.png576422118.png
回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:2025-2-5 17:26:08
7#
您好,根据您提供的信息我无法复现出您的问题,我这边整理了一个Demo,您可以先参考看看,也可以在这个Demo的基础上来尝试复现出此问题。

如果成功复现,请您将Demo发到论坛中,我们这边调研看看。

temp.zip

1.74 KB, 下载次数: 2

回复 使用道具 举报
潘嗒嗒
注册会员   /  发表于:7 天前
8#
Joestar.Xu 发表于 2025-2-5 17:26
您好,根据您提供的信息我无法复现出您的问题,我这边整理了一个Demo,您可以先参考看看,也可以在这个Demo ...

你好,能根据我们的开发场景复现吗?
我的spreadjs版本用的17.0.2,vue版本用的2.5.2,以下是具体依赖版本细节
  1. "dependencies": {
  2.     "@grapecity-software/spread-excelio": "17.0.2",
  3.     "@grapecity-software/spread-sheets": "17.0.2",
  4.     "@grapecity-software/spread-sheets-charts": "17.0.2",
  5.     "@grapecity-software/spread-sheets-io": "17.0.2",
  6.     "@grapecity-software/spread-sheets-print": "17.0.2",
  7.     "@grapecity-software/spread-sheets-resources-zh": "17.0.2",
  8.     "@grapecity-software/spread-sheets-vue": "17.0.2",
  9.     "@riophae/vue-treeselect": "^0.4.0",
  10.     "axios": "0.18.1",
  11.     "echarts": "^5.4.1",
  12.     "element-ui": "^2.15.3",
  13.     "file-saver": "^2.0.2",
  14.     "jszip": "^3.2.2",
  15.     "sjs-globalization": "./local_modules/sjs-globalization",
  16.     "vue": "^2.5.2",
  17.     "vue-router": "^3.0.1",
  18.     "vuex": "^3.6.2",
  19.     "wijmo": "5.20231.888"
  20.   },
复制代码
附件是我用的模板文件和完整代码,麻烦再帮忙看看。

Comparison_Drilldown.zip

24.78 KB, 下载次数: 1

回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:7 天前
9#
收到,这边尝试根据您提供的文件复现一下看看。
回复 使用道具 举报
Joestar.XuSpreadJS 开发认证
超级版主   /  发表于:6 天前
10#
您好,您的文件中有通过接口获取数据的代码,我没有相关的数据,无法复现,能否请您提供一个完整的可以复现此问题的Demo,这边复现后调研看看。

image.png292365111.png
回复 使用道具 举报
12下一页
您需要登录后才可以回帖 登录 | 立即注册
返回顶部