Indicate unmatched species with ? icon #248

AtlasOfLivingAustralia · May 15, 2024 · 93834b5 · 93834b5
1 parent 6cb0e69
commit 93834b5
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 2 deletions.
diff --git a/grails-app/assets/javascripts/speciesModel.js b/grails-app/assets/javascripts/speciesModel.js
@@ -254,6 +254,9 @@ var SpeciesViewModel = function(data, options, context) {
     self.transients.bieUrl = ko.observable();
     self.transients.speciesInformation = ko.observable();
     self.transients.speciesTitle = ko.observable();
+    self.transients.matched = ko.computed(function() {
+        return self.guid() && self.guid() != "A_GUID" && self.listId != "unmatched";
+    });
     self.transients.editing = ko.observable(false);
     self.transients.textFieldValue = ko.observable();
     self.transients.bioProfileUrl =  ko.computed(function (){

diff --git a/src/main/groovy/au/org/ala/ecodata/forms/EditModelWidgetRenderer.groovy b/src/main/groovy/au/org/ala/ecodata/forms/EditModelWidgetRenderer.groovy
@@ -371,8 +371,8 @@ public class EditModelWidgetRenderer implements ModelWidgetRenderer {
         context.writer << """<div${context.attributes.toString()}>
                                 <div data-bind="with:${context.source}" class="input-group"">
                                 <select class="form-control form-control-sm" data-bind="speciesSelect2:\$data" ${context.validationAttr}></select>
-                                <div class="input-group-append">
-                                    <span class="input-group-text" data-bind="visible:name(), popover: {title: transients.speciesTitle, content: transients.speciesInformation}"><i class="fa fa-info-circle"></i></span>
+                                <div class="input-group-append"">
+                                    <span class="input-group-text" data-bind="visible:name(), popover: {title: transients.speciesTitle, content: transients.speciesInformation}, css:{'bg-warning':!transients.matched()}"><i class="fa" data-bind="css:{'fa-info-circle':transients.matched(), 'fa-question-circle':!transients.matched()}"></i></span>
                                 </div>
                              </div></div>"""
     }