【v15-vue】根据超期显示不同图标

沉沉

想实现效果类似这种， image.png432490233.png

日期超过一天显示！

，超过三天显示

沉沉 · 沉沉

本帖最后由沉沉于 2022-8-10 11:50 编辑

可以参考这篇文章https://demo.grapecity.com.cn/spreadjs/help/api/GC.Spread.Sheets.ConditionalFormatting.ConditionalFormats.html#addDateOccurringRule设置日期发生规则

var activeSheet = spread.getSheet(0);
activeSheet.suspendPaint();
activeSheet.setColumnWidth(0, 300);
var style1 = new GC.Spread.Sheets.Style();
style1.backgroundImage='./circle.png'; //设置背景图片
style1.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.zoom;
var style2 = new GC.Spread.Sheets.Style();
style2.backgroundImage='./gantan.png'; //设置背景图片
style2.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.zoom;
var d = new Date();
activeSheet.setValue(0, 0, d);
activeSheet.setValue(1, 0, new Date(d.setDate(d.getDate()+1)));
activeSheet.setValue(2, 0, new Date(d.setDate(d.getDate()-1)));
activeSheet.setValue(3, 0,new Date(d.setDate(d.getDate()+6)));
activeSheet.setValue(4, 0,new Date(d.setDate(d.getDate()+7)));
activeSheet.setValue(5, 0, new Date(d.setDate(d.getDate()+8)));
activeSheet.conditionalFormats.addDateOccurringRule(
GC.Spread.Sheets.ConditionalFormatting.DateOccurringType.tomorrow, style1, [new GC.Spread.Sheets.Range(0,0,10,1)]); activeSheet.conditionalFormats.addDateOccurringRule(
GC.Spread.Sheets.ConditionalFormatting.DateOccurringType.nextWeek, style2, [new GC.Spread.Sheets.Range(0,0,10,1)]);
activeSheet.resumePaint();