使用复选框显示和隐藏事件 Fullcalendar6

Question

我的活动有一个 extendedProps，“nomeUtente”，它表示保存活动的用户，在我的日历中我有这两个复选框： 当第一个被选中时，它应该只显示与当前会话用户具有相同 nomeUtente（名称事件旁边的那个：“domizianaD”，“raffaellaA”）的事件，当第二个被选中时它会显示所有事件（即使是具有不同 nomeUtente 的那个），反之亦然，当他们没有被检查时。

此外，事件根据类型（“Normali”、“Malattia”、“Ferie”）具有不同的颜色，如您在上面的屏幕截图中所见

我是这样做的：

eventDidMount: function(info) {
            const title = info.event.title;
            const nomeUtente = info.event.extendedProps.nomeUtente;
            const sessionUser = $("#nomeUtente").data('value');
            if (nomeUtente){
                if (title == "Normali") {
                    info.event.setProp("backgroundColor", "#FB6B4C");
                } else if (title == "Straordinarie") {
                   info.event.setProp("backgroundColor", "#C8FC0C");
                } else if (title == "Ferie") {
                    info.event.setProp("backgroundColor", "#EC1C28");
                } else if (title == "Malattia") {
                    info.event.setProp("backgroundColor", "#FFB404");;
                } else if (title == "Permesso") {
                    info.event.setProp("backgroundColor", "#A0ACDC");
                } else if (title == "Smart Working") {
                    info.event.setProp("backgroundColor", "#08ACC4");
                } else if (title == "Trasferta") {
                    info.event.setProp("backgroundColor", "#00897B");
                } else if (title == "Assenza non retribuita") {
                    info.event.setProp("backgroundColor", "#F8D2D7");
                } else if (title == "Altro") {
                    info.event.setProp("backgroundColor", "#5E35B1");
                };
                cs.forEach(function(v) {
                    if(v.defaultValue == "Ore Personali"){
                        if(v.checked){  
                            if(nomeUtente != sessionUser) 
                                info.event.setProp("display", "none");                 
                        } else{                            
                            if(nomeUtente == sessionUser) 
                                info.event.setProp("display", "none"); 
                        }
                    } else if(v.defaultValue == "Assenze"){
                        if(v.checked){  
                            if(nomeUtente != sessionUser) 
                                info.event.setProp("display", "block ruby");
                        }else {
                            if(nomeUtente != sessionUser) 
                                info.event.setProp("display", "none");
                        }
                    }                
                })
            }
        }

如您现在所见：（并与上面的屏幕截图进行比较）它有效，因为我选中了两个复选框，但 nomeUtente 的事件不同于“domizianaD”（我在此会话中使用的同一用户）是蓝色的（fullcalendar 的标准颜色）而不是上面的不同颜色。

会是什么？

---

这是我的事件加载方式（从 PHP 文件）：

events: [
{
    title: 'Normali',
    start":'2023-02-14T08:00',
    end: '2023-02-14T17:30'
    extendedProps: {
        nomeUtente: 'domizianaD',
    }
}
{
    title: 'Normali',
    start":'2023-02-05T08:00',
    end: '2023-02-05T17:30'
    extendedProps: {
        nomeUtente: 'raffaellaA',
    }
}
{
    title: 'Ferie',
    start":'2023-02-07T08:00',
    end: '2023-02-07T17:30'
    extendedProps: {
        nomeUtente: 'domizianaD',
    }
}
{
    title: 'Malattia',
    start":'2023-02-26T08:00',
    end: '2023-02-26T17:30'
    extendedProps: {
        nomeUtente: 'tizianaV',
    }
}{
    title: 'Normali',
    start":'2023-02-01T08:00',
    end: '2023-02-01T17:30'
    extendedProps: {
        nomeUtente: 'domizianaD',
    }
}
{
    title: 'Normali',
    start":'2023-02-04T08:00',
    end: '2023-02-04T17:30'
    extendedProps: {
        nomeUtente: 'raffaellaA',
    }
}

Answer 1

我要更新我终于找到怎么做的方法：

eventDidMount: function(info) {
   cs.forEach(function(v) {
        if(v.defaultValue == "Ore Personali"){
            if(nomeUtente != sessionUser) 
                info.event.setProp("display", "none"); 
            if(v.checked)
                  console.log("Checked")                 
            else{ 
               if(nomeUtente == sessionUser) 
                   info.event.setProp("display", "none");                             
           }
        } else if(v.defaultValue == "Assenze"){
               if(v.checked)   
                    info.event.setProp("display", "inherit");
              else {
                   if(nomeUtente != sessionUser ) 
                       info.event.setProp("display", "none");
             }
       }                
   })
}

基本上对于每个复选框（“OrePersonali”和“Assenze”），它控制保存事件的人并在未选中该特定复选框时隐藏它