format the dates

dainst · Dec 20, 2024 · 2d6eb66 · 2d6eb66
1 parent 1596d0c
commit 2d6eb66
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 11 deletions.
diff --git a/desktop/src/app.scss b/desktop/src/app.scss
@@ -324,13 +324,18 @@ select.form-control:not([size]):not([multiple]) {
   overflow: hidden;
 }
 
-.history-modal-content .modal-content{
+.history-modal-content .modal-content {
+  // max-height: 20%;
   user-select: none;
   width: fit-content;
-  max-height: 600px;
+  // max-height: 600px;
   // max-height: 800px;
 }
 
+// changes-history-dialog {
+//   height: 2000px;
+// }
+
 
 .modal-dialog:not(.modal-dialog-centered) {
   top: 14px;

diff --git a/desktop/src/app/components/widgets/changes-history-dialog.component.ts b/desktop/src/app/components/widgets/changes-history-dialog.component.ts
@@ -31,4 +31,10 @@ export class ChangesHistoryDialogComponent {
     }
 
 
+    public formatDateTime( date: string | Date, locale: string = 'de-DE' ) { 
+        return new Date(date).toLocaleString(locale);
+    }
+    // public formatDateTime( date: string | Date) { 
+    //     return new Date(date).toLocaleString();
+    // }
 }
diff --git a/desktop/src/app/components/widgets/changes-history-dialog.html b/desktop/src/app/components/widgets/changes-history-dialog.html
@@ -13,15 +13,15 @@ <h5  class="modal-title" i18n="@@widgets.saveModal.header">{{document.resource.i
                 </div>            
                 <div class="list-body">
                     <div *ngFor="let modification of document.modified.reverse()" 
-                         class = "list-row">
-                        <div class= "list-body-field">{{modification.date}} </div>
+                        class = "list-row">                    
+                        <div class= "list-body-field" [textContent]="formatDateTime(modification.date)"></div>
                         <div class= "list-body-field"> Modified </div>
-                        <div class= "list-body-field">{{modification.user}} </div>      
+                        <div class= "list-body-field" [textContent]="modification.user"></div>      
                     </div> 
                     <div class = "list-row">       
-                        <div class= "list-body-field">{{document.created.date}}  </div>
+                        <div class= "list-body-field" [textContent]="formatDateTime(document.created.date)"></div>
                         <div class= "list-body-field"> Created  </div>
-                        <div class= "list-body-field"> {{document.created.user}}  </div> 
+                        <div class= "list-body-field" [textContent]="document.created.user"></div> 
                     </div>
                 </div>
             </div>

diff --git a/desktop/src/app/components/widgets/changes-history-dialog.scss b/desktop/src/app/components/widgets/changes-history-dialog.scss
@@ -4,14 +4,12 @@
 
   #list-header {
     user-select: none;
-    margin-top: 2px;
     display: grid;
     grid-template-columns: 230px 100px 250px;
     font-size: 16px;
     font-weight: 500;    
 
     .list-header-field {
-      height: 34px;      
       padding: 5px 5px 5px 10px;
       color: rgb(73, 80, 87);
       border: solid 1px rgb(221, 221, 221);
@@ -25,14 +23,12 @@
 
   .list-row {
     user-select: none;
-    margin-top: 2px;
     display: grid;
     grid-template-columns: 230px 100px 250px;
     font-size: 16px;
     font-weight: 500;
 
     .list-body-field {
-      height: 80px;      
       padding: 5px 5px 0px 10px;
       color: rgb(73, 80, 87);
       border: solid 1px rgb(221, 221, 221);