Blog/Components/Pages/Query.razor 1.8 K · 57 lines · raw · history

1 @page "/Query"
2 <PageTitle>Query</PageTitle>
3 <PageScript Src="./Components/Pages/Query.razor.js"/>
4
5 <main>
6 <div class="flex-row">
7 <label for="lang">Query language</label>
8 <select id="lang">
9 <option value="jsonql" selected>jsonql-js</option>
10 <option value="dactal">DACTAL</option>
11 </select>
12 <button id="favoriteButton" type="button">Save as favorite</button>
13 </div>
14 <textarea id="input" class="editor" autofocus>SELECT *
15 FROM personen AS p
16 WHERE 'EenhoofdigOuderlijkGezag' IN p.gezag[].type</textarea>
17 <div id="results">
18 </div>
19 <Log/>
20
21 <dialog id="favoriteNameDialog">
22 <Panel Legend="Save as favorite">
23 <form method="dialog" id="favoriteNameForm">
24 <p>
25 <input id="favoriteNameInput" type="text" placeholder="Name"/>
26 </p>
27 <div class="flex-row">
28 <button type="submit">Save</button>
29 <button id="cancelFavoriteNameButton" type="reset">Cancel</button>
30 </div>
31 </form>
32 </Panel>
33 </dialog>
34
35 <Panel Legend="Favorites">
36 <div id="favoritesList" class="grid-stores">
37 </div>
38 </Panel>
39
40 <Panel Legend="History">
41 <div id="historyList" class="grid-stores">
42 </div>
43 </Panel>
44
45 <Panel Legend="Credits">
46 <div>
47 jsonql-js, a pure-JS SQL-like query language for JSON
48 </div>
49 <div>
50 <a href="https://dactal.org">DACTAL</a> by <a href="https://furia.com">glenn mcdonald</a>
51 </div>
52 <div>
53 personen dataset from <a href="https://github.com/BRP-API/Haal-Centraal-BRP-bevragen">Haal-Centraal-BRP-bevragen
54 mock-data</a>
55 </div>
56 </Panel>
57 </main>