class Notes{
    constructor(){
      this.name = "notes";
    }  

    static allowAddNew(){
      return userrights.has("notes.edit");
    }
    static allowEdit(){
      return userrights.has("notes.edit");
    }
    static allowDelete(){
      return userrights.has("notes.delete");
    }

  
    static isCustom(){
      return true;
    }

    static GetEdit(data={}){
      return {
        "note_headline": {
          "val" : data.note_headline ?? ""
          ,"type" : "text"
          ,"mandatory":true
          ,"isRow":true
        },
        "note": {
          "val" : data.note ?? ""
          ,"type" : "textarea"
          ,"isRow": true
          ,"mandatory":true
          ,autogrow: true
          ,rows:3
        }
        ,"is_important_note": {
          "val" : data.is_important_note ?? ""
          ,"type" : "dropdown"
          ,"isRow": true
          ,"mandatory":true
          ,"options":System.GetBooleanOptions()
        }
      }
    }

  
    static CreateCustom(data){

      document.getElementById("currentpage-content").innerHTML = Form.overviewHeadline(this.name.toLowerCase() + ".add", false, this.allowAddNew());

      let statsHTML = ``;

      if(data.data.important_notes.length > 0 || data.data.notes.length > 0){
        let badges = ``;

        if(data.data.important_notes.length > 0){
          let gridCols = data.data.important_notes.length;

          if(data.data.important_notes.length > 4){
            gridCols = 4;
          }

          statsHTML += `<div class="grid pt-8 md:grid-cols-${gridCols} grid-cols-1 gap-6">`
          for(let i = 0; i<data.data.important_notes.length; i++){
            let row = data.data.important_notes[i];
            badges = `<div class="badge badge-error gap-2 font-bold">${getTranslation("stat.is_important_note")}</div>`;

            let buttons = ``;
            if(this.allowEdit()){
              buttons += `<button onclick="loadPage('notes.edit','${row.id}')" class="btn btn-primary btn-sm">${getTranslation("edit")}</button>`;
            }
  
            if(this.allowDelete()){
              buttons += `<button onclick="Form.openDeleteModal('${row.id}','notes')" class="btn btn-sm btn-error">${getTranslation("delete")}</button>`;
            }

  
             statsHTML += `
              <div class="card w-full bg-warning text-warning-content">
                <div class="card-body">
                  <h2 class="card-title uppercase font-bold">${row.note_headline}</h2>
                  <h2>${badges}</h2>
                  <p><strong>${System.buildEmployeeName(row.creator)} - ${System.formatTimestamp(row.creationdate)}</strong></p>
                  <p class="border border-current rounded-xl p-1 break-all">${row.note.replace(/\n/g, "<br>")}</p>
                  <div class="card-actions justify-start">
                    ${buttons}
                  </div>
                </div>
              </div>
             `;
          }
          statsHTML += `</div>`;
        }

        if(data.data.notes.length > 0){
          statsHTML += `<div class="grid pt-8 md:grid-cols-4 grid-cols-1 gap-6">`

          for(let i = 0; i<data.data.notes.length; i++){
            let row = data.data.notes[i];
            
            let buttons = ``;
            if(this.allowEdit()){
              buttons += `<button onclick="loadPage('notes.edit','${row.id}')" class="btn btn-primary btn-sm">${getTranslation("edit")}</button>`;
            }
  
            if(this.allowDelete()){
              buttons += `<button onclick="Form.openDeleteModal('${row.id}','notes')" class="btn btn-sm btn-error">${getTranslation("delete")}</button>`;
            }

             statsHTML += `
              <div class="card w-full bg-neutral text-neutral-content">
                <div class="card-body">
                  <h2 class="card-title uppercase font-bold">${row.note_headline}</h2>
                  <p><strong>${System.buildEmployeeName(row.creator)} - ${System.formatTimestamp(row.creationdate)}</strong></p>
                  <p class="border border-current rounded-xl p-1 break-all">${row.note.replace(/\n/g, "<br>")}</p>
                  <div class="card-actions justify-start">
                    ${buttons}
                  </div>
                </div>
              </div>
             `;
          }
          statsHTML += `</div>`;
        }


        document.getElementById("currentpage-content").innerHTML += statsHTML;
      }

      Form.initTableButtons();
    }
  }