Verbesserung Ablagedialog bei mehreren ausgewählten Dateien

ui/schritt.html

@@ -0,0 +1,98 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title data-i18n="stepTitle">In Paperless ablegen</title>
+  <link rel="stylesheet" href="gemeinsam.css">
+</head>
+<body>
+
+  <h1 id="kopf">In Paperless ablegen</h1>
+  <div id="quelle" class="hinweis"></div>
+
+  <div class="spalten">
+
+    <section class="kasten">
+      <h2 data-i18n="storeTarget">Ziel</h2>
+
+      <div class="wahl">
+        <input type="radio" name="ziel" id="zielNeu" value="neu" checked>
+        <label for="zielNeu" data-i18n="storeTargetNew">
+          Neues Dokument anlegen
+        </label>
+      </div>
+
+      <div class="wahl">
+        <input type="radio" name="ziel" id="zielVorhanden" value="vorhanden">
+        <label for="zielVorhanden" data-i18n="storeTargetExisting">
+          Als neue Version an ein bestehendes anhängen
+        </label>
+      </div>
+
+      <div class="zeile" style="margin-top:4px">
+        <input type="text" id="suche" disabled>
+        <button id="suchen" disabled data-i18n="btnSearch">Suchen</button>
+      </div>
+
+      <div class="liste">
+        <table>
+          <thead><tr>
+            <th class="zahl" data-i18n="colAsn">ASN</th>
+            <th data-i18n="colCreated">Erstellt</th>
+            <th data-i18n="colTitle">Titel</th>
+          </tr></thead>
+          <tbody id="treffer"></tbody>
+        </table>
+      </div>
+
+      <div class="hinweis" data-i18n="stepHintExisting">
+        Die Klassifizierung des Ziels wird übernommen und kann angepasst
+        werden.
+      </div>
+    </section>
+
+    <section class="kasten">
+      <h2 data-i18n="classifyTitle">Klassifizierung</h2>
+
+      <label for="titel" data-i18n="fieldTitle">Titel</label>
+      <input type="text" id="titel">
+
+      <div class="zeile">
+        <span class="mass">
+          <label for="erstellt" data-i18n="fieldCreated">Erstellt</label>
+          <input type="text" id="erstellt" placeholder="JJJJ-MM-TT"
+                 style="width:110px">
+        </span>
+      </div>
+
+      <label for="korr" data-i18n="fieldCorrespondent">Korrespondent</label>
+      <input type="text" id="korr" list="korrListe" autocomplete="off">
+      <datalist id="korrListe"></datalist>
+
+      <label for="typ" data-i18n="fieldDocType">Dokumenttyp</label>
+      <input type="text" id="typ" list="typListe" autocomplete="off">
+      <datalist id="typListe"></datalist>
+
+      <label for="tagSuche" data-i18n="fieldTags">Tags</label>
+      <input type="text" id="tagSuche"
+             data-i18n-placeholder="tagsFilterPlaceholder"
+             placeholder="Tippen zum Filtern …">
+
+      <div class="liste">
+        <div id="tags" style="padding:4px 8px"></div>
+      </div>
+    </section>
+
+  </div>
+
+  <div id="meldung" class="hinweis"></div>
+
+  <div class="fuss">
+    <button id="abbrechen" data-i18n="btnCancel">Abbrechen</button>
+    <button id="ueberspringen" data-i18n="btnSkip">Überspringen</button>
+    <button id="ablegen" class="haupt" data-i18n="btnStore">Ablegen</button>
+  </div>
+
+  <script type="module" src="schritt.js"></script>
+</body>
+</html>