From a802fbdd0d0652bcab6da2dc72239b1375537b98 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 9 Feb 2024 22:33:53 -0500
Subject: [PATCH 01/22] added subtab HTML

---
 farmdata2/farmdata2_modules/fd2_school/fd2_school.module | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/farmdata2/farmdata2_modules/fd2_school/fd2_school.module b/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
index 167ca8ef..51187a45 100644
--- a/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
+++ b/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
@@ -62,6 +62,15 @@ function fd2_school_menu() {
 
   // Add items blocks for new sub-tabs here.
 
+  $items['farm/fd2-school/HTML'] = array(                 // Put the school in the farm menu
+    'title' => 'HTML',                         // Put FD2 School on the tab
+    'page callback' => 'fd2_school_view',            // The function that will provide the content
+    'page arguments' => array('HTML'),               // The html file with the default content for the tab
+    'access arguments' => array('view fd2 school'),  // permissions required to view the tab
+    'type' => MENU_LOCAL_TASK,                        // Put it on the menu
+    'weight' => 110,                                  // larger weights appear further right.
+  );
+
   return $items;
 };
 

From 7368dee7df011d5e886ab6adaea21d3f222f0d8f Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 9 Feb 2024 22:55:38 -0500
Subject: [PATCH 02/22] adding HTML file

---
 farmdata2/farmdata2_modules/fd2_school/fd2_school.module | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/fd2_school.module b/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
index 51187a45..167ca8ef 100644
--- a/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
+++ b/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
@@ -62,15 +62,6 @@ function fd2_school_menu() {
 
   // Add items blocks for new sub-tabs here.
 
-  $items['farm/fd2-school/HTML'] = array(                 // Put the school in the farm menu
-    'title' => 'HTML',                         // Put FD2 School on the tab
-    'page callback' => 'fd2_school_view',            // The function that will provide the content
-    'page arguments' => array('HTML'),               // The html file with the default content for the tab
-    'access arguments' => array('view fd2 school'),  // permissions required to view the tab
-    'type' => MENU_LOCAL_TASK,                        // Put it on the menu
-    'weight' => 110,                                  // larger weights appear further right.
-  );
-
   return $items;
 };
 

From b1758b3f0ce0d498ba2feaeac5e742d93822d0f2 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Mon, 19 Feb 2024 14:30:47 -0500
Subject: [PATCH 03/22] test commit from office hours

---
 farmdata2/farmdata2_modules/fd2_school/HTML/HTML.html | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 farmdata2/farmdata2_modules/fd2_school/HTML/HTML.html

diff --git a/farmdata2/farmdata2_modules/fd2_school/HTML/HTML.html b/farmdata2/farmdata2_modules/fd2_school/HTML/HTML.html
new file mode 100644
index 00000000..d2a15315
--- /dev/null
+++ b/farmdata2/farmdata2_modules/fd2_school/HTML/HTML.html
@@ -0,0 +1 @@
+<p>This is my subtab</p>
\ No newline at end of file

From f831967b604ada7a9fa949e89e8848c7f06f163d Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Mon, 15 Apr 2024 01:03:29 -0400
Subject: [PATCH 04/22] Added HTML sub-tab to FD2 School Tab

---
 .../farmdata2_modules/fd2_school/fd2_school.module    | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/fd2_school.module b/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
index 167ca8ef..08cc6ed9 100644
--- a/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
+++ b/farmdata2/farmdata2_modules/fd2_school/fd2_school.module
@@ -60,8 +60,15 @@ function fd2_school_menu() {
     'weight' => -100,
   );
 
-  // Add items blocks for new sub-tabs here.
-
+  $items['farm/fd2-school/html'] = array (
+    'title' => 'HTML',
+    'type' => MENU_LOCAL_TASK,
+    'page callback' => 'fd2_school_view',
+    'page arguments' => array('HTML'),
+    'access arguments' => array('view fd2 school'),
+    'weight' => 110
+  );
+   
   return $items;
 };
 

From fe36399e2daad682fea2008c5b6573dbcc1c5afe Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sun, 21 Apr 2024 16:52:52 -0400
Subject: [PATCH 05/22] Update Harvest Report

---
 .../farmdata2_modules/fd2_school/html.html    | 32 +++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 farmdata2/farmdata2_modules/fd2_school/html.html

diff --git a/farmdata2/farmdata2_modules/fd2_school/html.html b/farmdata2/farmdata2_modules/fd2_school/html.html
new file mode 100644
index 00000000..472a99ea
--- /dev/null
+++ b/farmdata2/farmdata2_modules/fd2_school/html.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Harvest Report</title>
+    <style>
+        
+        ul {
+            list-style-type: none;
+            padding-left: 0;
+        }
+        li::before {
+            content: "\2022"; 
+            font-weight: bold;
+            display: inline-block;
+            width: 1em;
+            margin-left: -1em;
+        }
+    </style>
+</head>
+<body>
+    <h1>Harvest Report</h1>
+    <h2>My Sample Harvest Report</h2>
+    <ul>
+        <li>Temperature: 75°F</li>
+        <li>Humidity: 60%</li>
+        <li>Soil Moisture: 40%</li>
+        <li>Precipitation: 0.25 inches</li>
+    </ul>
+</body>
+</html>

From fc548c296f3859788dead9bb578b096960f51e68 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sun, 21 Apr 2024 21:10:35 -0400
Subject: [PATCH 06/22] added breaks and fonts

---
 .../farmdata2_modules/fd2_school/html.html    | 29 ++++++++++++++-----
 1 file changed, 21 insertions(+), 8 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/html.html b/farmdata2/farmdata2_modules/fd2_school/html.html
index 472a99ea..57afcca5 100644
--- a/farmdata2/farmdata2_modules/fd2_school/html.html
+++ b/farmdata2/farmdata2_modules/fd2_school/html.html
@@ -1,3 +1,4 @@
+
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -5,7 +6,17 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Harvest Report</title>
     <style>
-        
+        body {
+            font-family: Arial, sans-serif; 
+        }
+        h1 {
+            font-style: italic; 
+            text-align: center; 
+        }
+        hr {
+            margin-top: 30px; 
+            margin-bottom: 30px; 
+        }
         ul {
             list-style-type: none;
             padding-left: 0;
@@ -21,12 +32,14 @@
 </head>
 <body>
     <h1>Harvest Report</h1>
-    <h2>My Sample Harvest Report</h2>
-    <ul>
-        <li>Temperature: 75°F</li>
-        <li>Humidity: 60%</li>
-        <li>Soil Moisture: 40%</li>
-        <li>Precipitation: 0.25 inches</li>
-    </ul>
+    <em>mockup</em> 
+    <hr> 
+    <h2>Harvest Report Form</h2>
+    
+    <br><br> 
+    <hr> 
+    <h2>Actual Report</h2>
+   
 </body>
 </html>
+

From 6a13d78dbb6e0c7256268af22572ca3c124b094b Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sun, 21 Apr 2024 21:15:47 -0400
Subject: [PATCH 07/22] added generate report button

---
 farmdata2/farmdata2_modules/fd2_school/html.html | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/html.html b/farmdata2/farmdata2_modules/fd2_school/html.html
index 57afcca5..fea2e7f2 100644
--- a/farmdata2/farmdata2_modules/fd2_school/html.html
+++ b/farmdata2/farmdata2_modules/fd2_school/html.html
@@ -1,4 +1,3 @@
-
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -35,11 +34,14 @@ <h1>Harvest Report</h1>
     <em>mockup</em> 
     <hr> 
     <h2>Harvest Report Form</h2>
-    
-    <br><br> 
+    <form>
+        <label for="title">Title:</label><br>
+        <input type="text" id="title" name="title"><br><br>
+        <input type="submit" value="Generate Report">
+    </form>
     <hr> 
     <h2>Actual Report</h2>
-   
 </body>
 </html>
 
+

From ade1f79793c26c89f149f481d86a7b46da36d72c Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sun, 21 Apr 2024 21:34:22 -0400
Subject: [PATCH 08/22] question 25 - added fields, dates, and crops

---
 .../farmdata2_modules/fd2_school/html.html      | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/html.html b/farmdata2/farmdata2_modules/fd2_school/html.html
index fea2e7f2..b843088a 100644
--- a/farmdata2/farmdata2_modules/fd2_school/html.html
+++ b/farmdata2/farmdata2_modules/fd2_school/html.html
@@ -35,6 +35,22 @@ <h1>Harvest Report</h1>
     <hr> 
     <h2>Harvest Report Form</h2>
     <form>
+        <label for="crop">Crop:</label>
+        <select id="crop" name="crop">
+            <option value="broccoli">Broccoli</option>
+            <option value="kale" selected>Kale</option>
+            <option value="peas">Peas</option>
+        </select><br><br>
+        <label for="field">Area:</label>
+        <select id="field" name="field">
+            <option value="all" selected>All</option>
+            <option value="chuau-1">Chuau-1</option>
+            <option value="sq7">SQ7</option>
+        </select><br><br>
+        <label for="startDate">Start Date:</label>
+        <input type="date" id="startDate" name="startDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
+        <label for="endDate">End Date:</label>
+        <input type="date" id="endDate" name="endDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
         <label for="title">Title:</label><br>
         <input type="text" id="title" name="title"><br><br>
         <input type="submit" value="Generate Report">
@@ -44,4 +60,3 @@ <h2>Actual Report</h2>
 </body>
 </html>
 
-

From 07fb71818ddc92e8d91706e0d92c2d03b8896f97 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sun, 21 Apr 2024 21:37:31 -0400
Subject: [PATCH 09/22] added a table #26

---
 .../farmdata2_modules/fd2_school/html.html    | 44 +++++++++++++++++++
 1 file changed, 44 insertions(+)

diff --git a/farmdata2/farmdata2_modules/fd2_school/html.html b/farmdata2/farmdata2_modules/fd2_school/html.html
index b843088a..fd6e1a49 100644
--- a/farmdata2/farmdata2_modules/fd2_school/html.html
+++ b/farmdata2/farmdata2_modules/fd2_school/html.html
@@ -27,6 +27,19 @@
             width: 1em;
             margin-left: -1em;
         }
+        table {
+            border: 1px solid black;
+            border-collapse: collapse;
+            width: 100%;
+        }
+        th, td {
+            border: 1px solid black;
+            padding: 8px;
+            text-align: left;
+        }
+        th {
+            background-color: #f2f2f2;
+        }
     </style>
 </head>
 <body>
@@ -57,6 +70,37 @@ <h2>Harvest Report Form</h2>
     </form>
     <hr> 
     <h2>Actual Report</h2>
+    <table>
+        <tr>
+            <th>Date</th>
+            <th>Field</th>
+            <th>Crop</th>
+            <th>Quantity (lbs)</th>
+            <th>Worker</th>
+        </tr>
+        <tr>
+            <td>2020-05-01</td>
+            <td>Chuau-1</td>
+            <td>Kale</td>
+            <td>50</td>
+            <td>John Doe</td>
+        </tr>
+        <tr>
+            <td>2020-05-05</td>
+            <td>SQ7</td>
+            <td>Broccoli</td>
+            <td>40</td>
+            <td>Jane Smith</td>
+        </tr>
+        <tr>
+            <td>2020-05-10</td>
+            <td>Chuau-1</td>
+            <td>Peas</td>
+            <td>30</td>
+            <td>Michael Johnson</td>
+        </tr>
+    </table>
 </body>
 </html>
 
+

From 9965157d4e10076a2c7617615447b51c4284ec35 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 00:11:04 -0400
Subject: [PATCH 10/22] added a new subtab vue1 to the school tab

---
 .../fd2_school/vue1/vue1.html                 | 106 ++++++++++++++++++
 1 file changed, 106 insertions(+)
 create mode 100644 farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
new file mode 100644
index 00000000..fd6e1a49
--- /dev/null
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Harvest Report</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif; 
+        }
+        h1 {
+            font-style: italic; 
+            text-align: center; 
+        }
+        hr {
+            margin-top: 30px; 
+            margin-bottom: 30px; 
+        }
+        ul {
+            list-style-type: none;
+            padding-left: 0;
+        }
+        li::before {
+            content: "\2022"; 
+            font-weight: bold;
+            display: inline-block;
+            width: 1em;
+            margin-left: -1em;
+        }
+        table {
+            border: 1px solid black;
+            border-collapse: collapse;
+            width: 100%;
+        }
+        th, td {
+            border: 1px solid black;
+            padding: 8px;
+            text-align: left;
+        }
+        th {
+            background-color: #f2f2f2;
+        }
+    </style>
+</head>
+<body>
+    <h1>Harvest Report</h1>
+    <em>mockup</em> 
+    <hr> 
+    <h2>Harvest Report Form</h2>
+    <form>
+        <label for="crop">Crop:</label>
+        <select id="crop" name="crop">
+            <option value="broccoli">Broccoli</option>
+            <option value="kale" selected>Kale</option>
+            <option value="peas">Peas</option>
+        </select><br><br>
+        <label for="field">Area:</label>
+        <select id="field" name="field">
+            <option value="all" selected>All</option>
+            <option value="chuau-1">Chuau-1</option>
+            <option value="sq7">SQ7</option>
+        </select><br><br>
+        <label for="startDate">Start Date:</label>
+        <input type="date" id="startDate" name="startDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
+        <label for="endDate">End Date:</label>
+        <input type="date" id="endDate" name="endDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
+        <label for="title">Title:</label><br>
+        <input type="text" id="title" name="title"><br><br>
+        <input type="submit" value="Generate Report">
+    </form>
+    <hr> 
+    <h2>Actual Report</h2>
+    <table>
+        <tr>
+            <th>Date</th>
+            <th>Field</th>
+            <th>Crop</th>
+            <th>Quantity (lbs)</th>
+            <th>Worker</th>
+        </tr>
+        <tr>
+            <td>2020-05-01</td>
+            <td>Chuau-1</td>
+            <td>Kale</td>
+            <td>50</td>
+            <td>John Doe</td>
+        </tr>
+        <tr>
+            <td>2020-05-05</td>
+            <td>SQ7</td>
+            <td>Broccoli</td>
+            <td>40</td>
+            <td>Jane Smith</td>
+        </tr>
+        <tr>
+            <td>2020-05-10</td>
+            <td>Chuau-1</td>
+            <td>Peas</td>
+            <td>30</td>
+            <td>Michael Johnson</td>
+        </tr>
+    </table>
+</body>
+</html>
+
+

From 3207415981daeccf630374ea89a0c9f54de6a542 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 00:19:19 -0400
Subject: [PATCH 11/22] Added basic Vue capabilities to vue1.html

---
 .../fd2_school/vue1/vue1.html                 | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
index fd6e1a49..51ed8835 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -1,5 +1,26 @@
 <!DOCTYPE html>
 <html lang="en">
+    <div id="app" v-cloak>
+        <input type="text" v-model="reportTitleInput">
+        <h1>{{ reportTitle }}</h1>
+      </div>
+      
+      <script>
+        var app = new Vue({
+          el: '#app',
+          data: {
+            reportTitle: 'My Sample Harvest Report', 
+            reportTitleInput: 'My Sample Harvest Report' 
+          },
+          watch: {
+            reportTitleInput: function(newValue) {
+              this.reportTitle = newValue;
+            }
+          }
+        });
+      </script>
+      
+      
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

From 93af8f614273e14148561915742f3599d42c6820 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 00:32:07 -0400
Subject: [PATCH 12/22] Added Vue bindings for report start date, end date, and
 selected crop

---
 .../fd2_school/vue1/vue1.html                 | 119 +++++++-----------
 1 file changed, 47 insertions(+), 72 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
index 51ed8835..ef036001 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -1,73 +1,34 @@
+
 <!DOCTYPE html>
-<html lang="en">
-    <div id="app" v-cloak>
-        <input type="text" v-model="reportTitleInput">
-        <h1>{{ reportTitle }}</h1>
-      </div>
-      
-      <script>
-        var app = new Vue({
-          el: '#app',
-          data: {
-            reportTitle: 'My Sample Harvest Report', 
-            reportTitleInput: 'My Sample Harvest Report' 
-          },
-          watch: {
-            reportTitleInput: function(newValue) {
-              this.reportTitle = newValue;
-            }
-          }
-        });
-      </script>
-      
-      
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Harvest Report</title>
-    <style>
-        body {
-            font-family: Arial, sans-serif; 
-        }
-        h1 {
-            font-style: italic; 
-            text-align: center; 
-        }
-        hr {
-            margin-top: 30px; 
-            margin-bottom: 30px; 
-        }
-        ul {
-            list-style-type: none;
-            padding-left: 0;
-        }
-        li::before {
-            content: "\2022"; 
-            font-weight: bold;
-            display: inline-block;
-            width: 1em;
-            margin-left: -1em;
-        }
-        table {
-            border: 1px solid black;
-            border-collapse: collapse;
-            width: 100%;
-        }
-        th, td {
-            border: 1px solid black;
-            padding: 8px;
-            text-align: left;
-        }
-        th {
-            background-color: #f2f2f2;
-        }
-    </style>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Vue1 Harvest Report</title>
+  <style>
+    [v-cloak] {
+      display: none;
+    }
+  </style>
 </head>
 <body>
-    <h1>Harvest Report</h1>
-    <em>mockup</em> 
-    <hr> 
-    <h2>Harvest Report Form</h2>
+ 
+  <div id="app" v-cloak>
+    <input type="date" v-model="reportStartDate">
+    <input type="date" v-model="reportEndDate">
+    <select v-model="selectedCrop">
+      <option value="broccoli">Broccoli</option>
+      <option value="kale">Kale</option>
+      <option value="peas">Peas</option>
+    </select>
+
+    <h3>Report Start Date: {{ reportStartDate }}</h3>
+    <h3>Report End Date: {{ reportEndDate }}</h3>
+    <h3>Selected Crop: {{ selectedCrop }}</h3>
+  </div>
+
+  
+  <h2>Harvest Report Form</h2>
+  <form>
     <form>
         <label for="crop">Crop:</label>
         <select id="crop" name="crop">
@@ -89,9 +50,12 @@ <h2>Harvest Report Form</h2>
         <input type="text" id="title" name="title"><br><br>
         <input type="submit" value="Generate Report">
     </form>
-    <hr> 
-    <h2>Actual Report</h2>
-    <table>
+  </form>
+
+  
+  <hr>
+  <h2>Actual Report</h2>
+  <table>
         <tr>
             <th>Date</th>
             <th>Field</th>
@@ -120,8 +84,19 @@ <h2>Actual Report</h2>
             <td>30</td>
             <td>Michael Johnson</td>
         </tr>
-    </table>
-</body>
-</html>
 
+  </table>
 
+  <script src="https://unpkg.com/vue@2"></script>
+  <script>
+    var app = new Vue({
+      el: '#app',
+      data: {
+        reportStartDate: '', 
+        reportEndDate: '', 
+        selectedCrop: '' 
+      }
+    });
+  </script>
+</body>
+</html>

From 39407c642aacaa3a72a9ede9c376c706084d0806 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 00:43:27 -0400
Subject: [PATCH 13/22] add terenary statements to set to mock harvest report

---
 farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
index ef036001..8f17749a 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -1,5 +1,5 @@
-
 <!DOCTYPE html>
+<html>
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -24,6 +24,10 @@
     <h3>Report Start Date: {{ reportStartDate }}</h3>
     <h3>Report End Date: {{ reportEndDate }}</h3>
     <h3>Selected Crop: {{ selectedCrop }}</h3>
+    
+    <label for="title">Title:</label>
+    <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
+    <h1>{{ reportTitle !== '' ? reportTitle : 'Mock Harvest Report' }}</h1>
   </div>
 
   
@@ -94,7 +98,8 @@ <h2>Actual Report</h2>
       data: {
         reportStartDate: '', 
         reportEndDate: '', 
-        selectedCrop: '' 
+        selectedCrop: '',
+        reportTitle: '' 
       }
     });
   </script>

From 60cd52254da55556838eda3ea756afe42a55ba3f Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 00:53:46 -0400
Subject: [PATCH 14/22] adding areas with drop down

---
 .../fd2_school/vue1/vue1.html                 | 25 +++++++++++--------
 1 file changed, 15 insertions(+), 10 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
index 8f17749a..b195a2b7 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -16,14 +16,16 @@
     <input type="date" v-model="reportStartDate">
     <input type="date" v-model="reportEndDate">
     <select v-model="selectedCrop">
-      <option value="broccoli">Broccoli</option>
-      <option value="kale">Kale</option>
-      <option value="peas">Peas</option>
+      <option v-for="crop in crops" :value="crop">{{ crop }}</option>
+    </select>
+    <select v-model="selectedArea">
+      <option v-for="area in areas" :value="area">{{ area }}</option>
     </select>
 
     <h3>Report Start Date: {{ reportStartDate }}</h3>
     <h3>Report End Date: {{ reportEndDate }}</h3>
     <h3>Selected Crop: {{ selectedCrop }}</h3>
+    <h3>Selected Area: {{ selectedArea }}</h3>
     
     <label for="title">Title:</label>
     <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
@@ -36,15 +38,12 @@ <h2>Harvest Report Form</h2>
     <form>
         <label for="crop">Crop:</label>
         <select id="crop" name="crop">
-            <option value="broccoli">Broccoli</option>
-            <option value="kale" selected>Kale</option>
-            <option value="peas">Peas</option>
+          <option v-for="crop in crops" :value="crop">{{ crop }}</option>
         </select><br><br>
         <label for="field">Area:</label>
+        <!-- Dropdown for the list of areas -->
         <select id="field" name="field">
-            <option value="all" selected>All</option>
-            <option value="chuau-1">Chuau-1</option>
-            <option value="sq7">SQ7</option>
+          <option v-for="area in areas" :value="area">{{ area }}</option>
         </select><br><br>
         <label for="startDate">Start Date:</label>
         <input type="date" id="startDate" name="startDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
@@ -53,7 +52,7 @@ <h2>Harvest Report Form</h2>
         <label for="title">Title:</label><br>
         <input type="text" id="title" name="title"><br><br>
         <input type="submit" value="Generate Report">
-    </form>
+      </form>
   </form>
 
   
@@ -105,3 +104,9 @@ <h2>Actual Report</h2>
   </script>
 </body>
 </html>
+
+
+
+
+
+

From 2b8e523fab30a9e0dc61957e48eefa09b4d3b608 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 01:00:49 -0400
Subject: [PATCH 15/22] added harvest log objects

---
 .../fd2_school/vue1/vue1.html                 | 47 ++++++++-----------
 1 file changed, 20 insertions(+), 27 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
index b195a2b7..756eca79 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -37,20 +37,20 @@ <h2>Harvest Report Form</h2>
   <form>
     <form>
         <label for="crop">Crop:</label>
-        <select id="crop" name="crop">
+        <select id="crop" name="crop" v-model="selectedCrop">
           <option v-for="crop in crops" :value="crop">{{ crop }}</option>
         </select><br><br>
         <label for="field">Area:</label>
         <!-- Dropdown for the list of areas -->
-        <select id="field" name="field">
+        <select id="field" name="field" v-model="selectedArea">
           <option v-for="area in areas" :value="area">{{ area }}</option>
         </select><br><br>
         <label for="startDate">Start Date:</label>
-        <input type="date" id="startDate" name="startDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
+        <input type="date" id="startDate" name="startDate" v-model="reportStartDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
         <label for="endDate">End Date:</label>
-        <input type="date" id="endDate" name="endDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
+        <input type="date" id="endDate" name="endDate" v-model="reportEndDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
         <label for="title">Title:</label><br>
-        <input type="text" id="title" name="title"><br><br>
+        <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
         <input type="submit" value="Generate Report">
       </form>
   </form>
@@ -66,28 +66,13 @@ <h2>Actual Report</h2>
             <th>Quantity (lbs)</th>
             <th>Worker</th>
         </tr>
-        <tr>
-            <td>2020-05-01</td>
-            <td>Chuau-1</td>
-            <td>Kale</td>
-            <td>50</td>
-            <td>John Doe</td>
-        </tr>
-        <tr>
-            <td>2020-05-05</td>
-            <td>SQ7</td>
-            <td>Broccoli</td>
-            <td>40</td>
-            <td>Jane Smith</td>
+        <tr v-for="log in harvestLogs">
+            <td>{{ log.date }}</td>
+            <td>{{ log.area }}</td>
+            <td>{{ log.crop }}</td>
+            <td>{{ log.quantity }}</td>
+            <td>{{ log.worker }}</td>
         </tr>
-        <tr>
-            <td>2020-05-10</td>
-            <td>Chuau-1</td>
-            <td>Peas</td>
-            <td>30</td>
-            <td>Michael Johnson</td>
-        </tr>
-
   </table>
 
   <script src="https://unpkg.com/vue@2"></script>
@@ -98,7 +83,15 @@ <h2>Actual Report</h2>
         reportStartDate: '', 
         reportEndDate: '', 
         selectedCrop: '',
-        reportTitle: '' 
+        selectedArea: '',
+        reportTitle: '',
+        crops: ["Broccoli", "Kale", "Peas"], 
+        areas: ["Chuau-1", "SQ7"], 
+        harvestLogs: [ 
+          { date: "2020-05-01", area: "Chuau-1", crop: "Kale", quantity: 50, worker: "John Doe" },
+          { date: "2020-05-05", area: "SQ7", crop: "Broccoli", quantity: 40, worker: "Jane Smith" },
+          { date: "2020-05-10", area: "Chuau-1", crop: "Peas", quantity: 30, worker: "Michael Johnson" }
+        ]
       }
     });
   </script>

From 22a0e6c5dd91939766590c5ba5e1e33edd02462f Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Fri, 26 Apr 2024 01:03:44 -0400
Subject: [PATCH 16/22] added vue dev tools

---
 farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
index 756eca79..2aff0d54 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue1/vue1.html
@@ -94,6 +94,8 @@ <h2>Actual Report</h2>
         ]
       }
     });
+    Vue.config.devtools = true;
+
   </script>
 </body>
 </html>

From 94c500396ac861a1682e4ab5f907ad2ac6a97c6a Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sat, 27 Apr 2024 19:24:20 -0400
Subject: [PATCH 17/22] added vue2 directory and vue2.html

---
 .../fd2_school/vue2/vue2.html                 | 101 ++++++++++++++++++
 1 file changed, 101 insertions(+)
 create mode 100644 farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
new file mode 100644
index 00000000..bc636f91
--- /dev/null
+++ b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Vue1 Harvest Report</title>
+  <style>
+    [v-cloak] {
+      display: none;
+    }
+  </style>
+</head>
+<body>
+ 
+  <div id="app" v-cloak>
+    <input type="date" v-model="reportStartDate">
+    <input type="date" v-model="reportEndDate">
+    <select v-model="selectedCrop">
+      <option v-for="crop in crops" :value="crop">{{ crop }}</option>
+    </select>
+    <select v-model="selectedArea">
+      <option v-for="area in areas" :value="area">{{ area }}</option>
+    </select>
+
+    <h3>Report Start Date: {{ reportStartDate }}</h3>
+    <h3>Report End Date: {{ reportEndDate }}</h3>
+    <h3>Selected Crop: {{ selectedCrop }}</h3>
+    <h3>Selected Area: {{ selectedArea }}</h3>
+    
+    <label for="title">Title:</label>
+    <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
+    <h1>{{ reportTitle !== '' ? reportTitle : 'Mock Harvest Report' }}</h1>
+  </div>
+
+  
+  <h2>Harvest Report Form</h2>
+  <form>
+    <form>
+        <label for="crop">Crop:</label>
+        <select id="crop" name="crop" v-model="selectedCrop">
+          <option v-for="crop in crops" :value="crop">{{ crop }}</option>
+        </select><br><br>
+        <label for="field">Area:</label>
+        <!-- Dropdown for the list of areas -->
+        <select id="field" name="field" v-model="selectedArea">
+          <option v-for="area in areas" :value="area">{{ area }}</option>
+        </select><br><br>
+        <label for="startDate">Start Date:</label>
+        <input type="date" id="startDate" name="startDate" v-model="reportStartDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
+        <label for="endDate">End Date:</label>
+        <input type="date" id="endDate" name="endDate" v-model="reportEndDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
+        <label for="title">Title:</label><br>
+        <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
+        <input type="submit" value="Generate Report">
+      </form>
+  </form>
+
+  
+  <hr>
+  <h2>Actual Report</h2>
+  <table>
+        <tr>
+            <th>Date</th>
+            <th>Field</th>
+            <th>Crop</th>
+            <th>Quantity (lbs)</th>
+            <th>Worker</th>
+        </tr>
+        <tr v-for="log in harvestLogs">
+            <td>{{ log.date }}</td>
+            <td>{{ log.area }}</td>
+            <td>{{ log.crop }}</td>
+            <td>{{ log.quantity }}</td>
+            <td>{{ log.worker }}</td>
+        </tr>
+  </table>
+
+  <script src="https://unpkg.com/vue@2"></script>
+  <script>
+    var app = new Vue({
+      el: '#app',
+      data: {
+        reportStartDate: '', 
+        reportEndDate: '', 
+        selectedCrop: '',
+        selectedArea: '',
+        reportTitle: '',
+        crops: ["Broccoli", "Kale", "Peas"], 
+        areas: ["Chuau-1", "SQ7"], 
+        harvestLogs: [ 
+          { date: "2020-05-01", area: "Chuau-1", crop: "Kale", quantity: 50, worker: "John Doe" },
+          { date: "2020-05-05", area: "SQ7", crop: "Broccoli", quantity: 40, worker: "Jane Smith" },
+          { date: "2020-05-10", area: "Chuau-1", crop: "Peas", quantity: 30, worker: "Michael Johnson" }
+        ]
+      }
+    });
+    Vue.config.devtools = true;
+
+  </script>
+</body>
+</html>

From 95858dc42fbcf0be5dc5ee12f4c022a3d7af0750 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sat, 27 Apr 2024 19:59:23 -0400
Subject: [PATCH 18/22] adds empty rows on click

---
 .../fd2_school/vue2/vue2.html                 | 78 ++++++++++---------
 1 file changed, 40 insertions(+), 38 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
index bc636f91..b2d5359b 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
@@ -35,44 +35,42 @@ <h1>{{ reportTitle !== '' ? reportTitle : 'Mock Harvest Report' }}</h1>
   
   <h2>Harvest Report Form</h2>
   <form>
-    <form>
-        <label for="crop">Crop:</label>
-        <select id="crop" name="crop" v-model="selectedCrop">
-          <option v-for="crop in crops" :value="crop">{{ crop }}</option>
-        </select><br><br>
-        <label for="field">Area:</label>
-        <!-- Dropdown for the list of areas -->
-        <select id="field" name="field" v-model="selectedArea">
-          <option v-for="area in areas" :value="area">{{ area }}</option>
-        </select><br><br>
-        <label for="startDate">Start Date:</label>
-        <input type="date" id="startDate" name="startDate" v-model="reportStartDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
-        <label for="endDate">End Date:</label>
-        <input type="date" id="endDate" name="endDate" v-model="reportEndDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
-        <label for="title">Title:</label><br>
-        <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
-        <input type="submit" value="Generate Report">
-      </form>
+    <label for="crop">Crop:</label>
+    <select id="crop" name="crop" v-model="selectedCrop">
+      <option v-for="crop in crops" :value="crop">{{ crop }}</option>
+    </select><br><br>
+    <label for="field">Area:</label>
+
+    <select id="field" name="field" v-model="selectedArea">
+      <option v-for="area in areas" :value="area">{{ area }}</option>
+    </select><br><br>
+    <label for="startDate">Start Date:</label>
+    <input type="date" id="startDate" name="startDate" v-model="reportStartDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
+    <label for="endDate">End Date:</label>
+    <input type="date" id="endDate" name="endDate" v-model="reportEndDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
+    <label for="title">Title:</label><br>
+    <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
+    <input type="button" value="Generate Report" onclick="addEmptyRow()">
   </form>
 
   
   <hr>
   <h2>Actual Report</h2>
   <table>
-        <tr>
-            <th>Date</th>
-            <th>Field</th>
-            <th>Crop</th>
-            <th>Quantity (lbs)</th>
-            <th>Worker</th>
-        </tr>
-        <tr v-for="log in harvestLogs">
-            <td>{{ log.date }}</td>
-            <td>{{ log.area }}</td>
-            <td>{{ log.crop }}</td>
-            <td>{{ log.quantity }}</td>
-            <td>{{ log.worker }}</td>
-        </tr>
+    <tr>
+      <th>Date</th>
+      <th>Field</th>
+      <th>Crop</th>
+      <th>Yields</th>
+      <th>Unit</th>
+    </tr>
+    <tr v-for="log in harvestLogs">
+      <td>{{ log.date }}</td>
+      <td>{{ log.area }}</td>
+      <td>{{ log.crop }}</td>
+      <td>{{ log.yields }}</td>
+      <td>{{ log.unit }}</td>
+    </tr>
   </table>
 
   <script src="https://unpkg.com/vue@2"></script>
@@ -87,15 +85,19 @@ <h2>Actual Report</h2>
         reportTitle: '',
         crops: ["Broccoli", "Kale", "Peas"], 
         areas: ["Chuau-1", "SQ7"], 
-        harvestLogs: [ 
-          { date: "2020-05-01", area: "Chuau-1", crop: "Kale", quantity: 50, worker: "John Doe" },
-          { date: "2020-05-05", area: "SQ7", crop: "Broccoli", quantity: 40, worker: "Jane Smith" },
-          { date: "2020-05-10", area: "Chuau-1", crop: "Peas", quantity: 30, worker: "Michael Johnson" }
-        ]
+        harvestLogs: []
       }
     });
-    Vue.config.devtools = true;
 
+    function addEmptyRow() {
+      app.harvestLogs.push({
+        date: '',
+        area: '',
+        crop: '',
+        yields: '',
+        unit: ''
+      });
+    }
   </script>
 </body>
 </html>

From 4240108da50e1c00d4bf3cd6d20c7002f93fe0f0 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sat, 27 Apr 2024 20:11:13 -0400
Subject: [PATCH 19/22] additional clicks do not do anything

---
 .../fd2_school/vue2/vue2.html                 | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
index b2d5359b..6676d585 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
@@ -50,7 +50,7 @@ <h2>Harvest Report Form</h2>
     <input type="date" id="endDate" name="endDate" v-model="reportEndDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
     <label for="title">Title:</label><br>
     <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
-    <input type="button" value="Generate Report" onclick="addEmptyRow()">
+    <input type="button" value="Generate Report" @click="generateReport">
   </form>
 
   
@@ -86,18 +86,19 @@ <h2>Actual Report</h2>
         crops: ["Broccoli", "Kale", "Peas"], 
         areas: ["Chuau-1", "SQ7"], 
         harvestLogs: []
+      },
+      methods: {
+        generateReport: function() {
+          this.harvestLogs.push({
+            date: '',
+            area: '',
+            crop: '',
+            yields: '',
+            unit: ''
+          });
+        }
       }
     });
-
-    function addEmptyRow() {
-      app.harvestLogs.push({
-        date: '',
-        area: '',
-        crop: '',
-        yields: '',
-        unit: ''
-      });
-    }
   </script>
 </body>
 </html>

From 0097ab8b7d73a1e692805c1807957a1204f989e3 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sat, 27 Apr 2024 20:46:26 -0400
Subject: [PATCH 20/22] adds indices

---
 .../fd2_school/vue2/vue2.html                 | 34 +++++++++++--------
 1 file changed, 20 insertions(+), 14 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
index 6676d585..a2e9254f 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
@@ -57,20 +57,26 @@ <h2>Harvest Report Form</h2>
   <hr>
   <h2>Actual Report</h2>
   <table>
-    <tr>
-      <th>Date</th>
-      <th>Field</th>
-      <th>Crop</th>
-      <th>Yields</th>
-      <th>Unit</th>
-    </tr>
-    <tr v-for="log in harvestLogs">
-      <td>{{ log.date }}</td>
-      <td>{{ log.area }}</td>
-      <td>{{ log.crop }}</td>
-      <td>{{ log.yields }}</td>
-      <td>{{ log.unit }}</td>
-    </tr>
+    <thead>
+      <tr>
+        <th>Row</th>
+        <th>Date</th>
+        <th>Field</th>
+        <th>Crop</th>
+        <th>Yields</th>
+        <th>Unit</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr v-for="(log, index) in harvestLogs">
+        <td>{{ index + 1 }}</td>
+        <td>{{ log.date }}</td>
+        <td>{{ log.area }}</td>
+        <td>{{ log.crop }}</td>
+        <td>{{ log.yields }}</td>
+        <td>{{ log.unit }}</td>
+      </tr>
+    </tbody>
   </table>
 
   <script src="https://unpkg.com/vue@2"></script>

From 664d6d4549ef3e64390a6985d5322a4760589a56 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sat, 27 Apr 2024 21:19:08 -0400
Subject: [PATCH 21/22] no matching records if there is nothing to be displayed

---
 .../fd2_school/vue2/vue2.html                 | 55 +++++++++++--------
 1 file changed, 31 insertions(+), 24 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
index a2e9254f..163f73cd 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
@@ -13,6 +13,7 @@
 <body>
  
   <div id="app" v-cloak>
+
     <input type="date" v-model="reportStartDate">
     <input type="date" v-model="reportEndDate">
     <select v-model="selectedCrop">
@@ -54,30 +55,35 @@ <h2>Harvest Report Form</h2>
   </form>
 
   
-  <hr>
-  <h2>Actual Report</h2>
-  <table>
-    <thead>
-      <tr>
-        <th>Row</th>
-        <th>Date</th>
-        <th>Field</th>
-        <th>Crop</th>
-        <th>Yields</th>
-        <th>Unit</th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr v-for="(log, index) in harvestLogs">
-        <td>{{ index + 1 }}</td>
-        <td>{{ log.date }}</td>
-        <td>{{ log.area }}</td>
-        <td>{{ log.crop }}</td>
-        <td>{{ log.yields }}</td>
-        <td>{{ log.unit }}</td>
-      </tr>
-    </tbody>
-  </table>
+    
+    <h2>Actual Report</h2>
+    <div v-if="harvestLogs.length > 0">
+      <table>
+        <thead>
+          <tr>
+            <th>Row</th>
+            <th>Date</th>
+            <th>Field</th>
+            <th>Crop</th>
+            <th>Yields</th>
+            <th>Unit</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(log, index) in harvestLogs">
+            <td>{{ index + 1 }}</td>
+            <td>{{ log.date }}</td>
+            <td>{{ log.area }}</td>
+            <td>{{ log.crop }}</td>
+            <td>{{ log.yields }}</td>
+            <td>{{ log.unit }}</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <div v-else>
+      <p>No matching records found.</p>
+    
 
   <script src="https://unpkg.com/vue@2"></script>
   <script>
@@ -108,3 +114,4 @@ <h2>Actual Report</h2>
   </script>
 </body>
 </html>
+

From 0990bdbce96c23560b694542338bc0ab3fb88af6 Mon Sep 17 00:00:00 2001
From: jadoont <tayyabajadoon11@gmail.com>
Date: Sat, 27 Apr 2024 21:23:00 -0400
Subject: [PATCH 22/22] binds to min and max dates

---
 .../fd2_school/vue2/vue2.html                 | 56 ++++++++-----------
 1 file changed, 22 insertions(+), 34 deletions(-)

diff --git a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
index 163f73cd..922ea492 100644
--- a/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
+++ b/farmdata2/farmdata2_modules/fd2_school/vue2/vue2.html
@@ -13,9 +13,8 @@
 <body>
  
   <div id="app" v-cloak>
-
-    <input type="date" v-model="reportStartDate">
-    <input type="date" v-model="reportEndDate">
+    <input type="date" v-model="reportStartDate" :max="reportEndDate">
+    <input type="date" v-model="reportEndDate" :min="reportStartDate">
     <select v-model="selectedCrop">
       <option v-for="crop in crops" :value="crop">{{ crop }}</option>
     </select>
@@ -46,44 +45,33 @@ <h2>Harvest Report Form</h2>
       <option v-for="area in areas" :value="area">{{ area }}</option>
     </select><br><br>
     <label for="startDate">Start Date:</label>
-    <input type="date" id="startDate" name="startDate" v-model="reportStartDate" min="2014-01-01" max="2022-01-01" value="2020-05-05"><br><br>
+    <input type="date" id="startDate" name="startDate" v-model="reportStartDate" :max="reportEndDate"><br><br>
     <label for="endDate">End Date:</label>
-    <input type="date" id="endDate" name="endDate" v-model="reportEndDate" min="2020-05-05" max="2022-01-01" value="2020-05-15"><br><br>
+    <input type="date" id="endDate" name="endDate" v-model="reportEndDate" :min="reportStartDate"><br><br>
     <label for="title">Title:</label><br>
     <input type="text" id="title" name="title" v-model="reportTitle"><br><br>
     <input type="button" value="Generate Report" @click="generateReport">
   </form>
 
   
-    
-    <h2>Actual Report</h2>
-    <div v-if="harvestLogs.length > 0">
-      <table>
-        <thead>
-          <tr>
-            <th>Row</th>
-            <th>Date</th>
-            <th>Field</th>
-            <th>Crop</th>
-            <th>Yields</th>
-            <th>Unit</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr v-for="(log, index) in harvestLogs">
-            <td>{{ index + 1 }}</td>
-            <td>{{ log.date }}</td>
-            <td>{{ log.area }}</td>
-            <td>{{ log.crop }}</td>
-            <td>{{ log.yields }}</td>
-            <td>{{ log.unit }}</td>
-          </tr>
-        </tbody>
-      </table>
-    </div>
-    <div v-else>
-      <p>No matching records found.</p>
-    
+  <hr>
+  <h2>Actual Report</h2>
+  <table>
+    <tr>
+      <th>Date</th>
+      <th>Field</th>
+      <th>Crop</th>
+      <th>Yields</th>
+      <th>Unit</th>
+    </tr>
+    <tr v-for="log in harvestLogs">
+      <td>{{ log.date }}</td>
+      <td>{{ log.area }}</td>
+      <td>{{ log.crop }}</td>
+      <td>{{ log.yields }}</td>
+      <td>{{ log.unit }}</td>
+    </tr>
+  </table>
 
   <script src="https://unpkg.com/vue@2"></script>
   <script>