Sfoglia il codice sorgente

[update]

再描画処理
poohr 3 settimane fa
parent
commit
b1ef54657b

+ 6
- 6
src/app/pages/dashboard/dashboard.html Vedi File

52
 
52
 
53
         <div class="recent-table" role="table" aria-label="最近開いた檀家">
53
         <div class="recent-table" role="table" aria-label="最近開いた檀家">
54
           <div class="recent-row recent-row-head" role="row">
54
           <div class="recent-row recent-row-head" role="row">
55
-            <div class="cell" role="columnheader">施主名</div>
56
-            <div class="cell" role="columnheader">ふりがな</div>
55
+            <div class="cell" role="columnheader">施主名・ふりがな</div>
57
             <div class="cell" role="columnheader">住所</div>
56
             <div class="cell" role="columnheader">住所</div>
58
             <div class="cell" role="columnheader">次の法要</div>
57
             <div class="cell" role="columnheader">次の法要</div>
59
             <div class="cell" role="columnheader">最終更新</div>
58
             <div class="cell" role="columnheader">最終更新</div>
62
           @if (recentDankaList.length > 0) {
61
           @if (recentDankaList.length > 0) {
63
             @for (recent of recentDankaList; track recent.danka.id) {
62
             @for (recent of recentDankaList; track recent.danka.id) {
64
               <a class="recent-row" [routerLink]="['/danka-detail', recent.danka.id]" role="row">
63
               <a class="recent-row" [routerLink]="['/danka-detail', recent.danka.id]" role="row">
65
-                <div class="cell" role="cell">{{ recent.danka.householder }}</div>
66
-                <div class="cell muted" role="cell">{{ recent.danka.householderFurigana }}</div>
64
+                <div class="cell" role="cell">
65
+                  <p class="recent-name">{{ recent.danka.householder }}</p>
66
+                  <p class="recent-sub">{{ recent.danka.householderFurigana || 'ふりがな未登録' }}</p>
67
+                </div>
67
                 <div class="cell" role="cell">{{ recent.danka.address }}</div>
68
                 <div class="cell" role="cell">{{ recent.danka.address }}</div>
68
                 <div class="cell" role="cell">{{ recent.nextMemorialLabel }}</div>
69
                 <div class="cell" role="cell">{{ recent.nextMemorialLabel }}</div>
69
-                <div class="cell muted" role="cell">{{ recent.updatedAtLabel }}</div>
70
+                <div class="cell" role="cell">{{ recent.updatedAtLabel }}</div>
70
               </a>
71
               </a>
71
             }
72
             }
72
           } @else {
73
           } @else {
75
               <div class="cell muted" role="cell">-</div>
76
               <div class="cell muted" role="cell">-</div>
76
               <div class="cell muted" role="cell">-</div>
77
               <div class="cell muted" role="cell">-</div>
77
               <div class="cell muted" role="cell">-</div>
78
               <div class="cell muted" role="cell">-</div>
78
-              <div class="cell muted" role="cell">-</div>
79
             </div>
79
             </div>
80
           }
80
           }
81
         </div>
81
         </div>

+ 8
- 12
src/app/pages/dashboard/dashboard.scss Vedi File

104
   background: #fff8ed;
104
   background: #fff8ed;
105
 }
105
 }
106
 
106
 
107
-.card.primary {
108
-  background: var(--focus);
109
-  border-color: var(--accent);
110
-}
111
-
112
 .card-label,
107
 .card-label,
113
 .search-label {
108
 .search-label {
114
   color: var(--muted);
109
   color: var(--muted);
203
   font-size: 14px;
198
   font-size: 14px;
204
 }
199
 }
205
 
200
 
206
-.text-link {
207
-  color: var(--brown-dark);
208
-  font-weight: 900;
209
-  white-space: nowrap;
210
-}
211
-
212
 .recent-table {
201
 .recent-table {
213
   overflow: hidden;
202
   overflow: hidden;
214
   border: 2px solid var(--line);
203
   border: 2px solid var(--line);
218
 
207
 
219
 .recent-row {
208
 .recent-row {
220
   display: grid;
209
   display: grid;
221
-  grid-template-columns: 1.2fr 1fr 1.4fr 0.95fr 0.85fr;
210
+  grid-template-columns: 1.4fr 1.6fr 0.95fr 0.85fr;
222
   min-height: 52px;
211
   min-height: 52px;
223
   border-top: 1px solid var(--line);
212
   border-top: 1px solid var(--line);
224
   align-items: center;
213
   align-items: center;
242
   color: var(--muted);
231
   color: var(--muted);
243
 }
232
 }
244
 
233
 
234
+.recent-sub {
235
+  margin-top: 4px;
236
+  color: var(--text);
237
+  font-size: 13px;
238
+  line-height: 1.35;
239
+}
240
+
245
 .upcoming-list {
241
 .upcoming-list {
246
   display: grid;
242
   display: grid;
247
   gap: 10px;
243
   gap: 10px;

+ 24
- 3
src/app/pages/dashboard/dashboard.ts Vedi File

1
-import { Component } from '@angular/core';
1
+import { ChangeDetectorRef, Component } from '@angular/core';
2
 import { Router, RouterLink } from '@angular/router';
2
 import { Router, RouterLink } from '@angular/router';
3
 import { KakochoService } from '../../services/kakocho-service';
3
 import { KakochoService } from '../../services/kakocho-service';
4
 import { DankaService } from '../../services/dankaService';
4
 import { DankaService } from '../../services/dankaService';
46
     private kakochoService: KakochoService,
46
     private kakochoService: KakochoService,
47
     private dankaService: DankaService,
47
     private dankaService: DankaService,
48
     private router: Router,
48
     private router: Router,
49
+    private cdr: ChangeDetectorRef,
49
   ) {
50
   ) {
50
     this.setWeeklyMemorialSummary();
51
     this.setWeeklyMemorialSummary();
51
     this.setMonthlyMemorialSummary();
52
     this.setMonthlyMemorialSummary();
71
         updatedAtLabel: this.formatUpdatedAt(danka.updatedAt),
72
         updatedAtLabel: this.formatUpdatedAt(danka.updatedAt),
72
       })),
73
       })),
73
     );
74
     );
75
+    this.cdr.detectChanges();
74
   }
76
   }
75
 
77
 
76
   private async setWeeklyMemorialSummary(): Promise<void> {
78
   private async setWeeklyMemorialSummary(): Promise<void> {
97
       return deathDate?.getMonth() === today.getMonth() && deathDate.getDate() === today.getDate();
99
       return deathDate?.getMonth() === today.getMonth() && deathDate.getDate() === today.getDate();
98
     }).length;
100
     }).length;
99
     this.upcomingWeeklyMemorialCount = this.weeklyMemorialCount - this.todayMemorialCount;
101
     this.upcomingWeeklyMemorialCount = this.weeklyMemorialCount - this.todayMemorialCount;
102
+    this.cdr.detectChanges();
100
   }
103
   }
101
 
104
 
102
   private async setMonthlyMemorialSummary(): Promise<void> {
105
   private async setMonthlyMemorialSummary(): Promise<void> {
110
 
113
 
111
       return deathDate.getMonth() === today.getMonth();
114
       return deathDate.getMonth() === today.getMonth();
112
     }).length;
115
     }).length;
116
+    this.cdr.detectChanges();
113
   }
117
   }
114
 
118
 
115
   private async setUpcomingMemorials(): Promise<void> {
119
   private async setUpcomingMemorials(): Promise<void> {
150
       .filter((memorial): memorial is UpcomingMemorial => memorial !== null)
154
       .filter((memorial): memorial is UpcomingMemorial => memorial !== null)
151
       .sort((a, b) => a.date.getTime() - b.date.getTime() || a.title.localeCompare(b.title, 'ja'))
155
       .sort((a, b) => a.date.getTime() - b.date.getTime() || a.title.localeCompare(b.title, 'ja'))
152
       .slice(0, 3);
156
       .slice(0, 3);
157
+    this.cdr.detectChanges();
153
   }
158
   }
154
 
159
 
155
   private isMemorialTarget(deathDate: Date): boolean {
160
   private isMemorialTarget(deathDate: Date): boolean {
207
     return nextMemorial ? this.formatDateLabel(nextMemorial, today) : '未設定';
212
     return nextMemorial ? this.formatDateLabel(nextMemorial, today) : '未設定';
208
   }
213
   }
209
 
214
 
210
-  private formatUpdatedAt(updatedAt: string): string {
215
+  private formatUpdatedAt(updatedAt: unknown): string {
211
     const updatedDate = this.parseDate(updatedAt);
216
     const updatedDate = this.parseDate(updatedAt);
212
     const today = this.toDateOnly(new Date());
217
     const today = this.toDateOnly(new Date());
213
 
218
 
253
     return new Date(date.getFullYear(), date.getMonth(), date.getDate());
258
     return new Date(date.getFullYear(), date.getMonth(), date.getDate());
254
   }
259
   }
255
 
260
 
256
-  private parseDate(value: string): Date | null {
261
+  private parseDate(value: unknown): Date | null {
262
+    if (!value) {
263
+      return null;
264
+    }
265
+
266
+    if (value instanceof Date) {
267
+      return value;
268
+    }
269
+
270
+    if (typeof value === 'object' && 'toDate' in value && typeof value.toDate === 'function') {
271
+      return value.toDate();
272
+    }
273
+
274
+    if (typeof value !== 'string') {
275
+      return null;
276
+    }
277
+
257
     const [year, month, day] = value.split('-').map(Number);
278
     const [year, month, day] = value.split('-').map(Number);
258
     if (!year || !month || !day) {
279
     if (!year || !month || !day) {
259
       return null;
280
       return null;

+ 2
- 1
src/app/share/side-menu/app-side-menu.scss Vedi File

18
 
18
 
19
 .menu-title {
19
 .menu-title {
20
   margin: 0 0 14px;
20
   margin: 0 0 14px;
21
-  padding-left: 10px;
21
+  padding-left: 0;
22
   font-size: 15px;
22
   font-size: 15px;
23
   font-weight: 700;
23
   font-weight: 700;
24
   color: #5a4a3c;
24
   color: #5a4a3c;
25
+  text-align: center;
25
 }
26
 }
26
 
27
 
27
 .menu-list {
28
 .menu-list {

Loading…
Annulla
Salva