Add tag functionality to reminders.

Controllers/VehicleController.cs

@@ -1683,7 +1683,8 @@ namespace CarCareTracker.Controllers
                 ReminderMileageInterval = result.ReminderMileageInterval,
                 ReminderMonthInterval = result.ReminderMonthInterval,
                 CustomMileageInterval = result.CustomMileageInterval,
-                CustomMonthInterval = result.CustomMonthInterval
+                CustomMonthInterval = result.CustomMonthInterval,
+                Tags = result.Tags
             };
             return PartialView("_ReminderRecordModal", convertedResult);
         }

Helper/ReminderHelper.cs

@@ -73,7 +73,8 @@ namespace CarCareTracker.Helper
                     Description = reminder.Description,
                     Notes = reminder.Notes,
                     Metric = reminder.Metric,
-                    IsRecurring = reminder.IsRecurring
+                    IsRecurring = reminder.IsRecurring,
+                    Tags = reminder.Tags
                 };
                 if (reminder.Metric == ReminderMetric.Both)
                 {

Models/Reminder/ReminderRecord.cs

@@ -14,5 +14,6 @@
         public ReminderMileageInterval ReminderMileageInterval { get; set; } = ReminderMileageInterval.FiveThousandMiles;
         public ReminderMonthInterval ReminderMonthInterval { get; set; } = ReminderMonthInterval.OneYear;
         public ReminderMetric Metric { get; set; } = ReminderMetric.Date;
+        public List<string> Tags { get; set; } = new List<string>();
     }
 }

Models/Reminder/ReminderRecordInput.cs

@@ -14,6 +14,7 @@
         public ReminderMileageInterval ReminderMileageInterval { get; set; } = ReminderMileageInterval.FiveThousandMiles;
         public ReminderMonthInterval ReminderMonthInterval { get; set; } = ReminderMonthInterval.OneYear;
         public ReminderMetric Metric { get; set; } = ReminderMetric.Date;
+        public List<string> Tags { get; set; } = new List<string>();
         public ReminderRecord ToReminderRecord()
         {
             return new ReminderRecord
@@ -29,7 +30,8 @@
                 ReminderMonthInterval = ReminderMonthInterval,
                 CustomMileageInterval = CustomMileageInterval,
                 CustomMonthInterval = CustomMonthInterval,
-                Notes = Notes
+                Notes = Notes,
+                Tags = Tags
             };
         }
     }

Models/Reminder/ReminderRecordViewModel.cs

@@ -17,5 +17,6 @@
         /// Recurring Reminders
         /// </summary>
         public bool IsRecurring { get; set; } = false;
+        public List<string> Tags { get; set; } = new List<string>();
     }
 }

Views/Vehicle/_ReminderRecordModal.cshtml

@@ -42,6 +42,14 @@
                         <input class="form-check-input" type="radio" name="reminderMetricOptions" id="reminderMetricBoth" value="@(ReminderMetric.Both)" checked="@(Model.Metric == ReminderMetric.Both)">
                         <label class="form-check-label" for="reminderMetricBoth">@translator.Translate(userLanguage,"Whichever comes first")</label>
                     </div>
+                    <div class="d-grid"></div>
+                    <label for="reminderRecordTag">@translator.Translate(userLanguage, "Tags(optional)")</label>
+                    <select multiple class="form-select" id="reminderRecordTag">
+                        @foreach (string tag in Model.Tags)
+                        {
+                            <!option value="@tag">@tag</!option>
+                        }
+                    </select>
                 </div>
                 <div class="col-md-6 col-12">
                     <label for="reminderNotes">@translator.Translate(userLanguage,"Notes(optional)")<a class="link-underline link-underline-opacity-0" onclick="showLinks(this)"><i class="bi bi-markdown ms-2"></i></a></label>

Views/Vehicle/_ReminderRecords.cshtml

@@ -6,6 +6,7 @@
     var userConfig = config.GetUserConfig(User);
     var userLanguage = userConfig.UserLanguage;
     var hasRefresh = Model.Where(x => (x.Urgency == ReminderUrgency.VeryUrgent || x.Urgency == ReminderUrgency.PastDue) && x.IsRecurring).Any();
+    var recordTags = Model.SelectMany(x => x.Tags).Distinct();
 }
 <div class="row">
     <div class="d-flex justify-content-between">
@@ -15,6 +16,16 @@
             <span class="ms-2 badge bg-danger">@($"{translator.Translate(userLanguage, "Very Urgent")}: {Model.Where(x=>x.Urgency == ReminderUrgency.VeryUrgent).Count()}")</span>
             <span class="ms-2 badge bg-warning">@($"{translator.Translate(userLanguage, "Urgent")}: {Model.Where(x => x.Urgency == ReminderUrgency.Urgent).Count()}")</span>
             <span class="ms-2 badge bg-success">@($"{translator.Translate(userLanguage, "Not Urgent")}: {Model.Where(x => x.Urgency == ReminderUrgency.NotUrgent).Count()}")</span>
+            @foreach (string recordTag in recordTags)
+            {
+                <span onclick="filterTable('reminder-tab-pane', this)" class="user-select-none ms-2 rounded-pill badge bg-secondary tagfilter" style="cursor:pointer;">@recordTag</span>
+            }
+            <datalist id="tagList">
+                @foreach (string recordTag in recordTags)
+                {
+                    <!option value="@recordTag"></!option>
+                }
+            </datalist>
         </div>
         <div>
             <button onclick="showAddReminderModal()" class="btn btn-primary btn-md mt-1 mb-1"><i class="bi bi-pencil-square me-2"></i>@translator.Translate(userLanguage, "Add Reminder")</button>
@@ -45,7 +56,7 @@
             <tbody>
                 @foreach (ReminderRecordViewModel reminderRecord in Model)
                 {
-                    <tr class="d-flex user-select-none" style="cursor:pointer;" onmouseup="stopEvent()" ontouchstart="detectRowLongTouch(this)" ontouchend="detectRowTouchEndPremature(this)" data-rowId="@reminderRecord.Id" oncontextmenu="showTableContextMenu(this)" onmousemove="rangeMouseMove(this)" onclick="handleTableRowClick(this, showEditReminderRecordModal,@reminderRecord.Id)">
+                    <tr class="d-flex user-select-none" style="cursor:pointer;" onmouseup="stopEvent()" ontouchstart="detectRowLongTouch(this)" ontouchend="detectRowTouchEndPremature(this)" data-rowId="@reminderRecord.Id" oncontextmenu="showTableContextMenu(this)" onmousemove="rangeMouseMove(this)" onclick="handleTableRowClick(this, showEditReminderRecordModal,@reminderRecord.Id)" data-tags='@string.Join(" ", reminderRecord.Tags)'>
                         @if (reminderRecord.Urgency == ReminderUrgency.VeryUrgent)
                         {
                             <td class="col-1"><span class="badge text-bg-danger">@translator.Translate(userLanguage, "Very Urgent")</span></td>

wwwroot/js/reminderrecord.js

@@ -3,6 +3,7 @@
         if (data) {
             $("#reminderRecordModalContent").html(data); 
             initDatePicker($('#reminderDate'), true);
+            initTagSelector($("#reminderRecordTag"));
             $("#reminderRecordModal").modal("show");
             $('#reminderRecordModal').off('shown.bs.modal').on('shown.bs.modal', function () {
                 if (getGlobalConfig().useMarkDown) {
@@ -166,6 +167,7 @@ function getAndValidateReminderRecordValues() {
     var reminderIsRecurring = $("#reminderIsRecurring").is(":checked");
     var reminderRecurringMonth = $("#reminderRecurringMonth").val();
     var reminderRecurringMileage = $("#reminderRecurringMileage").val();
+    var reminderTags = $("#reminderRecordTag").val();
     var reminderCustomMileageInterval = customMileageInterval;
     var vehicleId = GetVehicleId().vehicleId;
     var reminderId = getReminderRecordModelData().id;
@@ -215,7 +217,8 @@ function getAndValidateReminderRecordValues() {
         reminderMileageInterval: reminderRecurringMileage,
         reminderMonthInterval: reminderRecurringMonth,
         customMileageInterval: customMileageInterval,
-        customMonthInterval: customMonthInterval
+        customMonthInterval: customMonthInterval,
+        tags: reminderTags
     }
 }
 function createPlanRecordFromReminder(reminderRecordId) {

wwwroot/js/vehicle.js

@@ -246,12 +246,14 @@ function showAddReminderModal(reminderModalInput) {
         $.post('/Vehicle/GetAddReminderRecordPartialView', { reminderModel: reminderModalInput }, function (data) {
             $("#reminderRecordModalContent").html(data);
             initDatePicker($('#reminderDate'), true);
+            initTagSelector($("#reminderRecordTag"));
             $("#reminderRecordModal").modal("show");
         });
     } else {
         $.post('/Vehicle/GetAddReminderRecordPartialView', function (data) {
             $("#reminderRecordModalContent").html(data);
             initDatePicker($('#reminderDate'), true);
+            initTagSelector($("#reminderRecordTag"));
             $("#reminderRecordModal").modal("show");
         });
     }