Refactor mass import page to use base list view instead of base edit view

Kitodo/src/main/webapp/WEB-INF/resources/css/kitodo.css

@@ -788,6 +788,7 @@ body .content-header > .ui-panel-content {
 
 .content-header .ui-panel-content > form,
 .content-header .ui-panel-content > button,
+#massImportButtonForm > button,
 .ui-menubutton,
 .ui-selectbooleanbutton {
     white-space: nowrap;
@@ -1921,134 +1922,177 @@ body .functional-metadata-wrapper .help-button .ui-button-text {
     float: unset;
 }
 
-#fileUploadForm .ui-fileupload .ui-fileupload-content,
-#fileUploadForm .ui-fileupload .ui-fileupload-content .ui-fileupload-files {
+#fileUploadForm\:uploadWrapper {
+    margin: 0;
+}
+
+#fileUploadForm\:uploadWrapper_content {
+    padding: 0;
+}
+
+#fileUploadForm .ui-fileupload .ui-fileupload-content {
     border: none;
 }
 
+#fileUploadForm .ui-fileupload .ui-fileupload-content .ui-fileupload-files .ui-fileupload-row {
+    border: 0 1px solid var(--focused-blue);
+}
+
+#fileUploadForm .ui-fileupload .ui-fileupload-content .ui-fileupload-files .ui-fileupload-row:first-child {
+    border-top: 1px solid var(--focused-blue);
+    border-top-radius: var(--default-border-radius);
+}
+
+#fileUploadForm .ui-fileupload .ui-fileupload-content .ui-fileupload-files .ui-fileupload-row:last-child {
+    border-bottom: 1px solid var(--focused-blue);
+    border-bottom-radius: var(--default-border-radius);
+}
+
 
 /*----------------------------------------------------------------------
 Mass import
 ----------------------------------------------------------------------*/
 
-#editForm\:fileUploadButtonWrapper {
+#massImportTab,
+#recordsForm\:recordsTableWrapper {
+    height: 100%;
+}
+
+#massImportTab #fileUploadForm {
+    height: 160px;
+    overflow-y: auto;
+}
+
+#massImportTab #recordsForm {
+    height: calc(100% - 160px);
+    overflow-y: hidden;
+}
+
+#massImportTab #recordsForm\:recordsTable {
+    height: calc(100% - 80px);
+}
+
+#massImportTab .ui-datatable-scrollable-body {
+    height: calc(100% - 50px);
+}
+
+#fileUploadForm\:fileUploadButtonWrapper {
     padding: 0;
 }
 
-#editForm\:recordsTable th span.metadata-record-id::after,
-#editForm\:recordsTable th span.metadata-doctype::after {
+#recordsForm\:recordsTable th span.metadata-record-id::after,
+#recordsForm\:recordsTable th span.metadata-doctype::after {
     color: var(--medium-gray);
     font-family: FontAwesome;
     margin-left: var(--default-half-size);
 }
 
-#editForm\:recordsTable th span.metadata-record-id::after {
+#recordsForm\:recordsTable th span.metadata-record-id::after {
     content: "\f2c2";
 }
 
-#editForm\:recordsTable th span.metadata-doctype::after {
+#recordsForm\:recordsTable th span.metadata-doctype::after {
     content: "\f02d";
 }
 
-#editForm\:recordsTable .ui-datatable-scrollable-theadclone {
+#recordsForm\:recordsTable .ui-datatable-scrollable-theadclone {
     display: none;
 }
 
-#editForm\:recordsTable_scrollableThead > tr > th:last-child span {
+#recordsForm\:recordsTable_scrollableThead > tr > th:last-child span {
     float: right;
 }
 
-#editForm\:recordsTable th.ui-state-default,
-#editForm\:recordsTable td.ui-editable-column,
-#editForm\:recordsTable td.remove-column,
-#editForm\:recordsTable tr.ui-datatable-empty-message {
+#recordsForm\:recordsTable th.ui-state-default,
+#recordsForm\:recordsTable td.ui-editable-column,
+#recordsForm\:recordsTable td.remove-column,
+#recordsForm\:recordsTable tr.ui-datatable-empty-message {
     border: 1px solid var(--carbon-blue);
 }
 
-#editForm\:addCsvRecord,
-#editForm\:catalogSelectionWrapper {
+#recordsForm\:addCsvRecord,
+#fileUploadForm\:catalogSelectionWrapper {
     margin-top: var(--default-half-size);
 }
 
-#editForm\:recordsTable th:has(> span.ui-column-title > span.invalid-configuration) {
+#recordsForm\:recordsTable th:has(> span.ui-column-title > span.invalid-configuration) {
     background-color: var(--orange);
 }
 
-#editForm\:recordsTable th:has(> span.ui-column-title > span.unknown-metadata) {
+#recordsForm\:recordsTable th:has(> span.ui-column-title > span.unknown-metadata) {
     background-color: var(--light-orange);
 }
 
-#editForm\:recordsTable td.ui-editable-column {
+#recordsForm\:recordsTable td.ui-editable-column {
     overflow-x: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }
 
-#editForm .ui-panelgrid-cell {
+#fileUploadForm .ui-panelgrid-cell {
     padding-left: var(--default-full-size);
 }
 
-#editForm .ui-fileupload-buttonbar {
+#fileUploadForm .ui-fileupload-buttonbar {
     padding: 0;
 }
 
-#editForm .ui-fileupload-buttonbar .ui-button {
+#fileUploadForm .ui-fileupload-buttonbar .ui-button {
     margin-right: var(--default-full-size);
 }
 
-#editForm\:fileUploadButtonWrapper .ui-fileupload-files:not(:has(div.ui-fileupload-row)) {
+#fileUploadForm\:fileUploadButtonWrapper .ui-fileupload-files:not(:has(div.ui-fileupload-row)) {
     border: none;
 }
 
-#editForm\:recordsTableWrapper {
+#recordsForm\:recordsTableWrapper {
     padding: 0 var(--default-full-size);
 }
 
-#editForm\:recordsTable tr {
+#recordsForm\:recordsTable tr {
     height: var(--input-height);
     overflow-y: hidden;
 }
 
-#editForm\:recordsTable .remove-column {
+#recordsForm\:recordsTable .remove-column {
     width: 50px;
 }
 
-#editForm\:recordsTable .remove-column button.secondary,
-#editForm\:recordsTable .remove-metadata-column {
+#recordsForm\:recordsTable .remove-column button.secondary,
+#recordsForm\:recordsTable .remove-metadata-column {
     border: none;
 }
 
-#editForm\:addCsvRecord,
-#editForm\:recordsTable .remove-column button.secondary {
+#recordsForm\:addCsvRecord,
+#recordsForm\:recordsTable .remove-column button.secondary {
     float: right;
 }
 
-#editForm\:recordsTable input.ui-inputtext {
+#recordsForm\:recordsTable input.ui-inputtext {
     width: 100%;
 }
 
-#editForm\:csvSeparator {
+#fileUploadForm\:csvSeparator {
     display: block;
     width: 60px;
 }
 
-#editForm\:separatorCharacterWrapper .separator-selection {
+#fileUploadForm\:separatorCharacterWrapper .separator-selection {
     display: inline-block;
     margin-right: var(--default-double-size);
-    width: 45%;
 }
 
-#editForm\:skipEmptyColumnsWrapper {
+#fileUploadForm\:skipEmptyColumnsWrapper {
     display: inline-block;
     vertical-align: top;
 }
 
-#editForm\:csvFileUpload {
+#fileUploadForm\:csvFileUpload {
     overflow-x: hidden;
     white-space: nowrap;
 }
 
-#editForm\:csvFileUpload .ui-fileupload-buttonbar {
+#fileUploadForm\:csvFileUpload .ui-fileupload-buttonbar {
     background: transparent;
     border: none;
 }
@@ -2062,26 +2106,26 @@ Mass import
     padding: 0;
 }
 
-#editForm\:recordsTable\:addMetadataColumn,
-#editForm\:recordsTable button.remove-metadata-column {
+#recordsForm\:recordsTable\:addMetadataColumn,
+#recordsForm\:recordsTable button.remove-metadata-column {
     background: transparent;
     overflow: hidden;
     height: inherit;
 }
 
-#editForm\:recordsTable span.ui-column-title {
+#recordsForm\:recordsTable span.ui-column-title {
     white-space: nowrap;
 }
 
-#editForm\:recordsTable span.ui-column-title span {
+#recordsForm\:recordsTable span.ui-column-title span {
     display: inline-block;
     overflow: hidden;
     text-overflow: ellipsis;
     vertical-align: middle;
     width: calc(100% - 20px);
 }
 
-#editForm\:recordsTable_data tr td {
+#recordsForm\:recordsTable_data tr td {
     box-sizing: content-box;
 }
 
@@ -2093,10 +2137,14 @@ Mass import
     padding-right: var(--default-half-size);
 }
 
-#fileUploadForm, #searchEditForm {
+#searchEditForm {
     padding: 0 var(--default-double-size);
 }
 
+#fileUploadForm\:csvParserOptions_content {
+    padding: 0;
+}
+
 #catalogSearchForm div.ui-panelgrid-cell {
     padding-right: var(--default-half-size);
 }

Kitodo/src/main/webapp/WEB-INF/templates/includes/massImport/dialogs/addMetadata.xhtml

@@ -124,7 +124,7 @@
                                   styleClass="dialogButtonWrapper">
                         <p:commandButton id="apply"
                                          action="#{MassImportForm.addMetadataDialog.addMetadata()}"
-                                         update="editForm:recordsTableWrapper"
+                                         update="recordsForm:recordsTableWrapper"
                                          oncomplete="PF('addMetadataDialog').hide();"
                                          value="#{msgs.apply}"
                                          styleClass="primary right"/>

Kitodo/src/main/webapp/WEB-INF/templates/includes/massImport/dialogs/massImportResults.xhtml

@@ -85,14 +85,16 @@
         <div class="select-selector">
             <p:panelGrid>
                 <p:row>
-                    <p:button id="goToProcesses"
-                              value="#{msgs['processes']}"
-                              styleClass="primary right"
-                              outcome="/pages/processes?tabId=processTab&amp;faces-redirect=true"/>
-                    <p:commandButton id="close"
-                                     value="#{msgs.close}"
-                                     styleClass="secondary right"
-                                     onclick="PF('massImportResultDialog').hide();"/>
+                    <h:form id="massImportResultDialogButtonForm">
+                        <p:button id="goToProcesses"
+                                  value="#{msgs['processes']}"
+                                  styleClass="primary right"
+                                  outcome="/pages/processes?tabId=processTab&amp;faces-redirect=true"/>
+                        <p:commandButton id="close"
+                                         value="#{msgs.close}"
+                                         styleClass="secondary right"
+                                         onclick="PF('massImportResultDialog').hide();"/>
+                    </h:form>
                 </p:row>
             </p:panelGrid>
         </div>