From 88998b8c426538186215a75eaf0427dc78231b5a Mon Sep 17 00:00:00 2001
From: vhande <78013271+vhande@users.noreply.github.com>
Date: Tue, 5 Nov 2024 14:07:09 +0100
Subject: [PATCH] Update organization search

---
 .../search/organization-search-item.html      | 29 +++++---------
 .../search/organization-search.html           | 38 +++++++------------
 src/styles/query-search-bar.less              |  1 +
 3 files changed, 25 insertions(+), 43 deletions(-)

diff --git a/src/management/organizers/search/organization-search-item.html b/src/management/organizers/search/organization-search-item.html
index 971c2236b..c2063fec6 100644
--- a/src/management/organizers/search/organization-search-item.html
+++ b/src/management/organizers/search/organization-search-item.html
@@ -1,28 +1,19 @@
 <tr class="organization-search-item" ng-class="{'deleted': osic.organizationDeleted}" ng-if="::osic.organization">
-    <td><strong><a ng-bind="::osic.organization.name" ui-sref="split.organizerDetail({id: osic.organization.id})"></a></strong></td>
-    <td>
+    <td style="padding-left: 30px"><strong><a ng-bind="::osic.organization.name" ui-sref="split.organizerDetail({id: osic.organization.id})"></a></strong></td>
+    <td ng-if="::osic.organization.address.addressLocality">
         <span ng-bind="::osic.organization.address.streetAddress"></span>
         <br>
         <span ng-bind="::osic.organization.address.addressLocality"></span>
     </td>
-    <td>
-        <span ng-bind="::osic.organization.created | amDateFormat:'DD/MM/YYYY HH:mm'"></span>
-        <span class="organization-search-item-email" ng-if="::osic.organization.email">
-            <br><span ng-bind="::osic.organization.email"></span>
-        </span>
-        <span class="organization-search-item-url" ng-if="::osic.organization.url">
-            <br><a ng-href="{{::osic.organization.url}}" target="_blank" ng-bind="::osic.organization.url"></a>
-        </span>
+    <td ng-if="::!osic.organization.address.addressLocality">
+        <span translate-once="search.organization.noAddress"></span>
     </td>
-    <td class="text-right">
-        <div class="pull-right btn-group" uib-dropdown>
-            <a class="btn btn-default" ui-sref="split.organizerEdit({id: osic.organization.id})">Bewerken</a>
-            <button type="button" class="btn btn-default" uib-dropdown-toggle><span class="caret"></span></button>
-            <ul uib-dropdown-menu role="menu">
-                <li role="menuitem">
-                    <a ui-sref="management.organizers.search.delete({id: osic.organization.id})">Verwijderen</a>
-                </li>
-            </ul>
+    <td style="padding-right: 30px">
+        <div ng-if="::osic.organization.created">
+            <i class="fa fa-clock"></i> <span ng-bind="::osic.organization.created | amDateFormat:'DD/MM/YYYY HH:mm'"></span>
+        </div>
+        <div ng-if="::osic.organization.creator">
+            <i class="fa fa-user"></i> <span ng-bind="::osic.organization.creator"></span>
         </div>
     </td>
 </tr>
diff --git a/src/management/organizers/search/organization-search.html b/src/management/organizers/search/organization-search.html
index bf9b3609f..9220afa46 100644
--- a/src/management/organizers/search/organization-search.html
+++ b/src/management/organizers/search/organization-search.html
@@ -1,48 +1,38 @@
-<h1 class="title">Organisaties</h1>
-
-<div class="row">
-    <div class="col-md-12">
-        <udb-query-search-bar search-label="Zoeken op organisatie"
-                              help-link="https://documentatie.uitdatabank.be/content/search_api_3/latest/searching-organizers.html"
-                              help-label="via geavanceerde zoekopdracht"
+<div class="row" style="margin-top: 2rem">
+        <div class="col-md-9"> 
+        <udb-query-search-bar search-label="search.organization.searchOrganization"
                               on-change="$ctrl.queryChanged(query)"></udb-query-search-bar>
-    </div>
-    <div class="col-md-2">
+        </div>
+    <div class="col-md-1">
         <i ng-show="$ctrl.loading" class="fa fa-circle-o-notch fa-spin"></i>
     </div>
-    <div class="col-md-12 text-right">
-        <a class="btn btn-primary" ui-sref="split.organizer">
-            <i class="fa fa-plus-circle"></i> Organisatie toevoegen
+    <div class="col-md-2 text-right">
+        <a class="btn btn-primary pull-right" ui-sref="split.organizer">
+            <i class="fa fa-plus-circle"></i> <span translate-once="search.organization.addOrganizer"></span>
         </a>
     </div>
 </div>
-
 <div class="row search-result-block" ng-cloak>
     <div class="col-md-12">
-        <div class="alert alert-info" role="alert" ng-show="$ctrl.query.length < $ctrl.minQueryLength">
-            <p>Schrijf een zoekopdracht van minstens 3 karakters in het veld hierboven om organisaties te zoeken.</p>
-            <p>Laat het veld leeg om alle organisaties op te vragen in alfabetische volgorde.</p>
-        </div>
         <div ng-show="$ctrl.query.length >= $ctrl.minQueryLength && $ctrl.searchResult.totalItems === 0"
              class="alert alert-warning" role="alert">
-            <p>Geen organisaties gevonden.</p>
+            <p translate-once="search.organization.notFound"></p>
         </div>
         <div ng-show="$ctrl.problem" class="alert alert-warning" role="alert">
-            <span>Er ging iets mis tijdens het zoeken:</span>
+            <span translate-once="search.organization.error"></span>
             <br>
             <strong ng-bind="$ctrl.problem.title"></strong>
         </div>
         <div class="query-search-result organization-search-results"
              ng-class="{'loading-search-result': $ctrl.loading}"
              ng-show="$ctrl.searchResult.totalItems > 0">
-          <div class="panel panel-default">
+          <div class="table-responsive">
             <table class="table">
                 <thead>
                 <tr>
-                    <th>Naam</th>
-                    <th>Adres</th>
-                    <th></th>
-                    <th class="text-right">Opties</th>
+                    <th class="col-md-5" style="padding-left: 30px" translate-once="search.organization.name"></th>
+                    <th class="col-md-3" translate-once="search.organization.address"></th>
+                    <th class="col-md-4" style="padding-right: 30px" translate-once="search.organization.info"></th>
                 </tr>
                 </thead>
                 <tbody udb-organization-search-item="organization" ng-repeat="organization in $ctrl.searchResult.member">
diff --git a/src/styles/query-search-bar.less b/src/styles/query-search-bar.less
index 54893ab4c..4ea84bc42 100644
--- a/src/styles/query-search-bar.less
+++ b/src/styles/query-search-bar.less
@@ -2,6 +2,7 @@
   .form-group {
     width: 100%;
     display: flex;
+    align-items: center;
   }
 
   #user-search-input {