@osfarm/itineraire-technique 1.1.17 → 1.1.19

package/css/styles-editor.css

@@ -1 +1 @@
-.main-header{background-color:#6fa76f;color:#fff;height:3rem;display:flex;align-items:center}.main-header .btn.show,.main-header .btn:first-child:active,.main-header :not(.btn-check)+.btn:active{background-color:#026602}.editor-view{overflow-y:auto;height:calc(100vh - 4rem)}.rotation_item .step-edit{color:#878787;cursor:pointer;display:none;margin-left:10px;font-size:70%;vertical-align:super}.rotation_item:hover .step-edit{display:inline !important}.welcome-view{background-color:#6fa76f;color:#fff;padding:1rem;margin-top:1rem;border-radius:1rem}.welcome-view #cropsContainer{color:green}.card-white{background-color:#fff;padding:1rem;border-radius:1rem}.card-holder{background-color:#f5f5f5;padding:1rem;border-radius:1rem;margin:auto}.editable-row{background-color:#f7f7f7;min-height:3rem;display:flex;align-items:center;border-radius:.5rem}.editable-row .edit-buttons{visibility:hidden}.editable-row:hover>.edit-buttons{visibility:visible}.intervention-row{background:#e0e0e0}.primary-button{color:#fff;background-color:green;border:green}.primary-button:hover{background-color:#026602}.close-step-times{background:none;border:none;color:#878787;font-size:120%}.close-step-times:hover{color:#494949}#cropsContainer .drag-handle{color:#ccc;font-weight:normal;font-size:86%;margin-right:10px;vertical-align:middle;cursor:grab}.form-control.text-right{text-align:right}.modal .form-label{font-weight:600}#code-snippet{font-family:monospace;font-size:13px;text-align:left;border:1px inset;background-color:#f1f1f1}/*# sourceMappingURL=styles-editor.css.map */
+.main-header{background-color:#6fa76f;color:#fff;height:3rem;display:flex;align-items:center}.main-header .btn.show,.main-header .btn:first-child:active,.main-header :not(.btn-check)+.btn:active{background-color:#026602}.editor-view{overflow-y:auto;height:calc(100vh - 4rem)}.rotation_item .step-edit{color:#878787;cursor:pointer;display:none;margin-left:10px;font-size:70%;vertical-align:super}.rotation_item:hover .step-edit{display:inline !important}.welcome-view{background-color:#6fa76f;color:#fff;padding:1rem;margin-top:1rem;border-radius:1rem}.welcome-view #cropsContainer{color:green}.card-white{background-color:#fff;padding:1rem;border-radius:1rem}.card-holder{background-color:#f5f5f5;padding:1rem;border-radius:1rem;margin:auto}.editable-row{background-color:#f7f7f7;min-height:3rem;display:flex;align-items:center;border-radius:.5rem}.editable-row .edit-buttons{visibility:hidden}.editable-row:hover>.edit-buttons{visibility:visible}.intervention-row{background:#e0e0e0}.primary-button{color:#fff;background-color:green;border:green}.primary-button:hover{background-color:#026602}.close-step-times{background:none;border:none;color:#878787;font-size:120%}.close-step-times:hover{color:#494949}#cropsContainer .drag-handle{color:#ccc;font-weight:normal;font-size:86%;margin-right:10px;vertical-align:middle;cursor:grab}#cropsContainer div.col{cursor:pointer}.form-control.text-right{text-align:right}.modal .form-label{font-weight:600}#code-snippet{font-family:monospace;font-size:13px;text-align:left;border:1px inset;background-color:#f1f1f1}#attributeName,#interventionName{font-weight:bold}/*# sourceMappingURL=styles-editor.css.map */

package/css/styles-editor.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../scss/styles-editor.scss"],"names":[],"mappings":"AAKA,aACI,yBACA,WACA,OALiB,KAOjB,aACA,mBAEA,sGAGI,yBAIR,aACI,gBAGA,0BAKA,0BACI,cACA,eACA,aACA,iBACA,cACA,qBAGJ,gCACI,0BAIR,cACI,yBACA,WACA,aACA,gBACA,mBAEA,8BACI,YAIR,YACI,sBACA,aACA,mBAGJ,aACI,yBACA,aACA,mBACA,YAGJ,cACI,yBACA,gBAEA,aACA,mBAEA,oBAEA,4BACI,kBAGJ,kCACI,mBAIR,kBACI,mBAGJ,gBACI,MAzFiB,KA0FjB,iBA5FiB,MA6FjB,OA7FiB,MA+FjB,sBACI,iBA/Fa,QAmGrB,kBACI,gBACA,YACA,cACA,eAEA,wBACI,cAIR,6BACI,WACA,mBACA,cACA,kBACA,sBACA,YAIA,yBACI,iBAKJ,mBACI,gBAIR,cACI,sBACA,eACA,gBACA,iBACA","file":"styles-editor.css"}
+{"version":3,"sourceRoot":"","sources":["../scss/styles-editor.scss"],"names":[],"mappings":"AAKA,aACI,yBACA,WACA,OALiB,KAOjB,aACA,mBAEA,sGAGI,yBAIR,aACI,gBAGA,0BAKA,0BACI,cACA,eACA,aACA,iBACA,cACA,qBAGJ,gCACI,0BAIR,cACI,yBACA,WACA,aACA,gBACA,mBAEA,8BACI,YAIR,YACI,sBACA,aACA,mBAGJ,aACI,yBACA,aACA,mBACA,YAGJ,cACI,yBACA,gBAEA,aACA,mBAEA,oBAEA,4BACI,kBAGJ,kCACI,mBAIR,kBACI,mBAGJ,gBACI,MAzFiB,KA0FjB,iBA5FiB,MA6FjB,OA7FiB,MA+FjB,sBACI,iBA/Fa,QAmGrB,kBACI,gBACA,YACA,cACA,eAEA,wBACI,cAKJ,6BACI,WACA,mBACA,cACA,kBACA,sBACA,YAGJ,wBACI,eAKJ,yBACI,iBAKJ,mBACI,gBAIR,cACI,sBACA,eACA,gBACA,iBACA,yBAGJ,iCACI","file":"styles-editor.css"}

package/editor.html

@@ -52,7 +52,7 @@
                         </button>
                         <ul class="dropdown-menu">
                             <li><a class="dropdown-item" href="#" onclick="showSaveAsModal()"><i class="fa fa-save" aria-hidden="true"></i> Enregistrer sous</a></li>
-                            <li><a class="dropdown-item" href="#" onclick="exportToJsonFile()"><i class="fa fa-download" aria-hidden="true"></i> Exporter</a></li>
+                            <li><a class="dropdown-item" href="#" onclick="doExportToJsonFile()"><i class="fa fa-download" aria-hidden="true"></i> Exporter</a></li>
                         </ul>
                     </div>
                 </div>
@@ -65,7 +65,7 @@
                         <ul class="dropdown-menu">
                             <li><a class="dropdown-item" href="#" onclick="importFromTestJson()"><i class="fa fa-lightbulb-o" aria-hidden="true"></i> Charger un exemple</a></li>
                         </ul>
-                    </div><button type="button" onclick="exportToJsonFile()" class="btn btn-outline-primary primary-button me-2"><i class="fa fa-download" aria-hidden="true"></i> Exporter (JSON)</button>
+                    </div><button type="button" onclick="doExportToJsonFile()" class="btn btn-outline-primary primary-button me-2"><i class="fa fa-download" aria-hidden="true"></i> Exporter (JSON)</button>
                 </div> 
 
                 <button type="button" onclick="wipe(crops)" class="btn btn-outline-primary primary-button"><i class="fa fa-trash" aria-hidden="true"></i> Tout effacer</button>
@@ -946,27 +946,34 @@
         return latestEndDate;
     }
 
-    function addEditAndRemoveButtons(rowDiv, deleteId, editFunction, deleteFunction, duplicateFunction) {
+    function addEditAndRemoveButtons(rowDiv, deleteId, editFunction, deleteFunction, duplicateFunction, style="btn-group") {
         rowDiv = $(rowDiv);
 
-        let actionContainer = $('<div class="col-auto edit-buttons"></div>');
+        let actionContainer = $(`<div class="col-auto edit-buttons m-1 ${style}" role="group"></div>`);
 
-        actionContainer.append($('<button class="btn btn-outline-danger float-end"><i class="fa fa-trash"></i></button>').click(function (event) {
+        rowDiv.append(actionContainer);
+
+        actionContainer.append($('<button class="edit-button btn btn-outline-primary p-2"><i class="fa fa-pencil"></i></button>').click(function(event) {
             event.stopPropagation(); // Prevent other onclick events from triggering
-            deleteFunction(deleteId);
+            editFunction();
         }));
 
-        actionContainer.append($('<button class="edit-button btn btn-outline-primary float-end me-1"><i class="fa fa-pencil"></i></button>').click(function (event) {
+        rowDiv.find('.col').click(function(event) {
             event.stopPropagation(); // Prevent other onclick events from triggering
             editFunction();
-        }));
+        });
 
-        actionContainer.append($('<button class="btn btn-outline-secondary float-end me-1"><i class="fa fa-copy"></i></button>').click(function (event) {
+        if (duplicateFunction != null) {
+            actionContainer.append($('<button class="btn btn-outline-secondary p-2"><i class="fa fa-copy"></i></button>').click(function (event) {
+                event.stopPropagation(); // Prevent other onclick events from triggering
+                duplicateFunction(deleteId);
+            }));
+        }
+
+        actionContainer.append($('<button class="btn btn-outline-danger p-2"><i class="fa fa-trash"></i></button>').click(function (event) {
             event.stopPropagation(); // Prevent other onclick events from triggering
-            duplicateFunction(deleteId);
+            deleteFunction(deleteId);
         }));
-
-        rowDiv.append(actionContainer);
     }
 
     function getAndCleanElement(elementId) {
@@ -1089,4 +1096,8 @@
         });
     }
 
+    function doExportToJsonFile() {
+        let jsonName = crops.title.replace(/\s+/g, '-').toLowerCase() + ".json";
+        exportToJsonFile(crops, jsonName);
+    }
 </script>

package/js/editor-attributes.js

@@ -43,7 +43,10 @@ function createAttributeRow(attribute) {
         function(id) {
             selectedStep.removeAttribute(id);
             refreshAllTables();
-        });
+        },
+        null,        
+        'btn-group-vertical'
+    );
 
     return rowDiv;
 }

package/js/editor-crops.js

@@ -130,4 +130,7 @@ function SelectStep(crop) {
     selectedStep = crop;
     loadSelectedStepToEditor(selectedStep);
     displayCropDetailView();
+
+    refreshAttributesTable();
+    refreshInterventionsTable();
 }

package/js/editor-interventions.js

@@ -21,6 +21,9 @@ function refreshInterventionsTable() {
     let interventionsBottomContainer = getAndCleanElement("interventionsBottomContainer");
 
     if (selectedStep && selectedStep.getStep().interventions) {
+        // Sort all interventions by day
+        selectedStep.getStep().interventions = selectedStep.getStep().interventions.sort((a, b) => a.day - b.day);        
+        
         selectedStep.getStep().interventions.forEach((intervention) => {
             const rowDiv = createInterventionRow(intervention);
 
@@ -29,7 +32,6 @@ function refreshInterventionsTable() {
             } else {
                 interventionsBottomContainer.appendChild(rowDiv);
             }
-
         });
     }
 }
@@ -49,17 +51,35 @@ function createInterventionRow(intervention) {
         },
         function(id) {
             selectedStep.removeIntervention(id);
-            refreshAllTables();
-        }
+            refreshInterventionsTable();
+            renderChart();
+        },
+        function(id) {
+            duplicateIntervention(id);
+            refreshInterventionsTable();
+            renderChart();
+        },
+        'btn-group-vertical'
     );
 
     return rowDiv;
 }
 
 function createInterventionNameAndValueColumn(intervention) {
+    let absoluteDate = "";
+    if (selectedStep && selectedStep.getStep().startDate) {
+        const stepStartDate = new Date(selectedStep.getStep().startDate);
+        const interventionDate = new Date(stepStartDate);
+        interventionDate.setDate(stepStartDate.getDate() + parseInt(intervention.day));
+        absoluteDate = interventionDate.toLocaleDateString('fr-FR', {
+            month: "short",
+            day: "numeric",
+        });
+    }
+    
     let nameValueDiv = document.createElement("div");
     nameValueDiv.className = "col";
-    nameValueDiv.innerHTML = `<strong>${intervention.name}</strong></br> ${intervention.description}`;
+    nameValueDiv.innerHTML = `<strong>${intervention.name}</strong> (${absoluteDate})</br> ${intervention.description}`;
 
     return nameValueDiv;
 }
@@ -174,4 +194,24 @@ function updateRelativeDayFromAbsolute() {
         
         $("#interventionDay").val(dayDiff);
     }
+}
+
+function duplicateIntervention(interventionId) {
+    if (!selectedStep) return;
+
+    // Find the intervention to duplicate
+    let originalIntervention = selectedStep.getStep().interventions.find(interv => interv.id === interventionId);
+    if (!originalIntervention) return;
+
+    // Create a copy of the intervention
+    let newIntervention = {
+        id: crypto.randomUUID(),
+        day: Number(originalIntervention.day) + 15, // Offset by 15 days to avoid overlap
+        name: originalIntervention.name,
+        type: originalIntervention.type,
+        description: originalIntervention.description
+    };
+
+    // Add the duplicated intervention to the selected step
+    selectedStep.getStep().interventions.push(newIntervention);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@osfarm/itineraire-technique",
-  "version": "1.1.17",
+  "version": "1.1.19",
   "description": "A visualisation tool to show agricultural technical itineraries based on Echarts",
   "main": "editor.html",
   "scripts": {

package/scss/styles-editor.scss

@@ -109,13 +109,19 @@ $header-height     : 3rem;
     }
 }
 
-#cropsContainer .drag-handle {
-    color         : #CCC;
-    font-weight   : normal;
-    font-size     : 86%;
-    margin-right  : 10px;
-    vertical-align: middle;
-    cursor        : grab;
+#cropsContainer{
+    .drag-handle {
+        color         : #CCC;
+        font-weight   : normal;
+        font-size     : 86%;
+        margin-right  : 10px;
+        vertical-align: middle;
+        cursor        : grab;
+    }
+
+    div.col {
+        cursor: pointer;
+    }
 }
 
 .form-control {
@@ -136,4 +142,8 @@ $header-height     : 3rem;
     text-align      : left;
     border          : 1px inset;
     background-color: #f1f1f1;
+}
+
+#attributeName, #interventionName {
+    font-weight: bold;
 }