all: Display list of locally changed items in UI (fixes #5336) (#5337)

gui/default/syncthing/transfer/localChangedFilesModalView.html

@@ -0,0 +1,31 @@
+<modal id="localChanged" status="info" icon="fas fa-exclamation-circle" heading="{{'Locally Changed Items' | translate}}" large="yes" closeable="yes">
+  <div class="modal-body">
+    <p translate>
+      The following items were changed locally.
+    </p>
+    <table class="table table-striped">
+      <thead>
+        <tr>
+          <th translate>Path</th>
+          <th translate>Size</th>
+        </tr>
+      </thead>
+      <tr dir-paginate="file in localChanged.files | itemsPerPage: localChanged.perpage" current-page="localChanged.page" total-items="model[localChanged.folder].receiveOnlyTotalItems" pagination-id="localChanged">
+        <td>{{file.name}}</td>
+        <td><span ng-hide="file.type == 'DIRECTORY'">{{file.size | binary}}B</span></td>
+      </tr>
+    </table>
+    <dir-pagination-controls on-page-change="refreshLocalChanged(newPageNumber, localChanged.perpage)" pagination-id="localChanged"></dir-pagination-controls>
+    <ul class="pagination pull-right">
+      <li ng-repeat="option in [10, 25, 50]" ng-class="{ active: localChanged.page == option }">
+        <a href="#" ng-click="refreshLocalChanged(localChanged.page, option)">{{option}}</a>
+      </li>
+    </ul>
+    <div class="clearfix"></div>
+  </div>
+  <div class="modal-footer">
+    <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">
+      <span class="fas fa-times"></span>&nbsp;<span translate>Close</span>
+    </button>
+  </div>
+</modal>