8 through resource search (#9)

* intitial working version of though resource instance search, no paging, re #8 * don't set default search graphid, re #8 * removed unused functions, re #8
archesproject · Jan 11, 2025 · ec37810 · ec37810
1 parent 6a0a70d
commit ec37810
Show file tree

Hide file tree

Showing 7 changed files with 340 additions and 53 deletions.
diff --git a/afrc/settings.py b/afrc/settings.py
@@ -421,6 +421,8 @@
 # override this to permenantly display/hide the language switcher
 SHOW_LANGUAGE_SWITCH = len(LANGUAGES) > 1
 
+COLLECTIONS_GRAPHID = ""
+
 # Implement this class to associate custom documents to the ES resource index
 # See tests.views.search_tests.TestEsMappingModifier class for example
 # ES_MAPPING_MODIFIER_CLASSES = ["afrc.search.es_mapping_modifier.EsMappingModifier"]

diff --git a/afrc/src/afrc/Search/SearchPage.vue b/afrc/src/afrc/Search/SearchPage.vue
@@ -39,8 +39,7 @@ watch(queryString, () => {
 function updateFilter(componentName: string, value: object) {
     console.log(value);
     // Test for an empty object
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    function isEmpty(value: any) {
+    function isEmpty(value: unknown) {
         if (value === null || value === undefined) {
             return true;
         }
@@ -89,51 +88,14 @@ const doQuery = function () {
 
     const qs = new URLSearchParams(queryObj);
 
-    fetch(arches.urls.search_results + "?" + qs.toString())
+    fetch(arches.urls["api-search"] + "?" + qs.toString())
         .then((response) => response.json())
         .then((data) => {
             console.log(data);
             searchResults.value = data.results.hits.hits;
             resultsCount.value = data.total_results;
             resultsSelected.value = [];
         });
-
-    // self.updateRequest = $.ajax({
-    //     type: "GET",
-    //     url: arches.urls.search_results,
-    //     data: queryObj,
-    //     context: this,
-    //     success: function(response) {
-    //         _.each(this.sharedStateObject.searchResults, function(value, key, results) {
-    //             if (key !== "timestamp") {
-    //                 delete this.sharedStateObject.searchResults[key];
-    //             }
-    //         }, this);
-    //         _.each(response, function(value, key, response) {
-    //             if (key !== "timestamp") {
-    //                 this.sharedStateObject.searchResults[key] = value;
-    //             }
-    //         }, this);
-    //         this.sharedStateObject.searchResults.timestamp(response.timestamp);
-    //         this.sharedStateObject.userIsReviewer(response.reviewer);
-    //         this.sharedStateObject.userid(response.userid);
-    //         this.sharedStateObject.total(response.total_results);
-    //         this.sharedStateObject.hits(response.results.hits.hits.length);
-    //         this.sharedStateObject.alert(false);
-    //     },
-    //     error: function(response, status, error) {
-    //         const alert = new AlertViewModel("ep-alert-red", arches.translations.requestFailed.title, response.responseJSON?.message);
-    //         if(self.updateRequest.statusText !== "abort"){
-    //             this.alert(alert);
-    //         }
-    //         this.sharedStateObject.loading(false);
-    //     },
-    //     complete: function(request, status) {
-    //         self.updateRequest = undefined;
-    //         window.history.pushState({}, "", "?" + $.param(queryObj).split("+").join("%20"));
-    //         this.sharedStateObject.loading(false);
-    //     }
-    // });
 };
 
 async function fetchSystemMapData() {
@@ -321,13 +283,13 @@ aside {
     gap: 10px;
 }
 .facet-item {
-    font-size: 0.7rem;
+    font-size: 1rem;
     padding: 16px;
     border: 1px solid #ddd;
     text-align: center;
     cursor: pointer;
-    max-width: 11rem;
-    min-height: 11rem;
+    max-width: 15rem;
+    min-height: 15rem;
 }
 .facet-item.selected {
     background-color: #f0f8ff;

diff --git a/afrc/src/afrc/Search/components/SearchResultItem.vue b/afrc/src/afrc/Search/components/SearchResultItem.vue
@@ -39,26 +39,31 @@ function clearResult() {
             <img src="https://picsum.photos/160" />
         </div>
         <div class="result-content">
-            <h2>{{ props.searchResult._source.displayname }}</h2>
-            <p class="breadcrumb">
+            <div class="result-displayname">
+                {{ props.searchResult._source.displayname }}
+            </div>
+            <div class="breadcrumb">
                 (North and Central America &gt; United States &gt; Missouri &gt;
                 Greene)
-            </p>
-            <p class="scope-note">
+            </div>
+            <div class="scope-note">
                 {{ searchResult._source.displaydescription }}
-            </p>
+            </div>
             <div class="actions">
                 <Button
                     label="...show more"
                     severity="secondary"
                     text
+                    size="large"
                 />
                 <Button
                     label="edit"
                     severity="secondary"
                     text
                     as="a"
                     target="_blank"
+                    size="large"
+                    icon="pi pi-pen-to-square"
                     :href="'./' + arches.urls.resource + '/' + searchResult._id"
                 />
             </div>
@@ -81,22 +86,31 @@ function clearResult() {
     height: 16rem;
     overflow: hidden;
     padding-inline-start: 10px;
+    padding: 15px;
 }
 .result h2 {
     margin: 0 0 10px;
     font-size: 1.2rem;
 }
 .result .breadcrumb {
-    color: #888;
-    font-size: 0.9rem;
+    color: #415790;
+    font-size: 1.1rem;
     margin-bottom: 10px;
+    padding: unset;
 }
 .result .image-placeholder {
     width: 16rem;
     height: 16rem;
     min-width: 16rem;
     background-color: #eee;
 }
+.result-displayname {
+    font-size: 1.5rem;
+    font-weight: bold;
+}
+.scope-note {
+    font-size: 1.2rem;
+}
 .actions {
     display: flex;
     gap: 10px;

diff --git a/afrc/src/afrc/Search/components/SimpleSearchFilter.vue b/afrc/src/afrc/Search/components/SimpleSearchFilter.vue
@@ -113,6 +113,10 @@ const updateQuery = function () {
     background-color: lightgray;
     font-family: Arial, Helvetica, sans-serif;
 }
+.p-autocomplete-token-label {
+    font-size: 1.3rem;
+}
+
 :deep(.autocomplete-input) {
     height: 3rem;
     font-size: 1.5rem;

diff --git a/afrc/templates/arches_urls.htm b/afrc/templates/arches_urls.htm
@@ -7,6 +7,7 @@
 {% block arches_urls %}
 {{ block.super }}
 <div class="arches-urls"
+    api-search="{% url 'api-search' %}"
     api-settings="{% url 'api-settings' %}"
     api-map-data="{% url 'api-map-data' %}"
     api-feature-buffer="{% url 'api-feature-buffer' %}"

diff --git a/afrc/urls.py b/afrc/urls.py
@@ -3,17 +3,26 @@
 from django.conf.urls.i18n import i18n_patterns
 from django.urls import include, path, re_path
 from afrc.views.settings_api import SettingsAPI
-from afrc.views.map_api import MapDataAPI, FeatureBufferAPI, GeoJSONBoundsAPI, ReferenceCollectionMVT
+from afrc.views.search_api import SearchAPI
+from afrc.views.map_api import (
+    MapDataAPI,
+    FeatureBufferAPI,
+    GeoJSONBoundsAPI,
+    ReferenceCollectionMVT,
+)
 
 urlpatterns = [
     # project-level urls
+    path("api-search", SearchAPI.as_view(), name="api-search"),
     path("api-settings", SettingsAPI.as_view(), name="api-settings"),
     path("api-map-data", MapDataAPI.as_view(), name="api-map-data"),
     path("api-feature-buffer", FeatureBufferAPI.as_view(), name="api-feature-buffer"),
     path("api-geojson-bounds", GeoJSONBoundsAPI.as_view(), name="api-geojson-bounds"),
-    re_path(r"^api-reference-collection-mvt/(?P<zoom>[0-9]+|\{z\})/(?P<x>[0-9]+|\{x\})/(?P<y>[0-9]+|\{y\}).pbf$",
+    re_path(
+        r"^api-reference-collection-mvt/(?P<zoom>[0-9]+|\{z\})/(?P<x>[0-9]+|\{x\})/(?P<y>[0-9]+|\{y\}).pbf$",
         ReferenceCollectionMVT.as_view(),
-        name="api-reference-collection-mvt"),
+        name="api-reference-collection-mvt",
+    ),
 ]
 
 # Ensure Arches core urls are superseded by project-level urls