]> git.openstreetmap.org Git - nominatim-ui.git/blob - src/pages/PolygonsPage.svelte
svelte 4.x => 5.0
[nominatim-ui.git] / src / pages / PolygonsPage.svelte
1 <script>
2   import { onMount } from 'svelte';
3   import { fetch_from_api, update_html_title } from '../lib/api_utils.js';
4   import { formatOSMType, osmLink } from '../lib/helpers.js';
5
6   import Header from '../components/Header.svelte';
7
8   let aPolygons = [];
9
10   function loaddata() {
11     fetch_from_api('polygons', { format: 'json' }, function (data) {
12       aPolygons = data;
13     });
14     update_html_title('Broken polygons');
15   }
16   onMount(loaddata);
17 </script>
18
19 <Header/>
20 <div class="container">
21   <div class="row">
22     <div class="col-sm-12">
23       <h1>Broken polygons</h1>
24
25       <p>
26         Total number of broken polygons: {aPolygons.length}.
27       </p>
28
29       <table class="table table-striped table-hover">
30         <thead>
31           <tr>
32             <th>OSM object</th>
33             <th>Class</th>
34             <th>Type</th>
35             <th>Name</th>
36             <th>Country Code</th>
37             <th>Error message</th>
38             <th>Updated</th>
39             <th></th>
40           </tr>
41         </thead>
42         <tbody>
43           {#each aPolygons as polygon}
44             <tr>
45               <!-- eslint-disable-next-line svelte/no-at-html-tags -->
46               <td>{@html osmLink(polygon)}</td>
47               <td>{polygon.class}</td>
48               <td>{polygon.type}</td>
49               <td>{polygon.name}</td>
50               <td>{polygon.country_code || ''}</td>
51               <td>{polygon.errormessage}</td>
52               <td>{polygon.updated}</td>
53               <td>
54                 <a href="http://localhost:8111/import?url=https://www.openstreetmap.org/api/0.6/{formatOSMType(polygon.osm_type)}/{polygon.osm_id}/full" target="josm">josm</a>
55               </td>
56             </tr>
57           {/each}
58         </tbody>
59       </table>
60     </div>
61   </div>
62 </div>