Skip to content

Commit 9e86efe

Browse files
committed
dynamic task list
1 parent 7292ac6 commit 9e86efe

File tree

6 files changed

+40
-144
lines changed

6 files changed

+40
-144
lines changed

app.js

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import express from "express";
22
import session from "express-session";
33
import bodyParser from "body-parser";
44
import { engine } from "express-handlebars";
5+
import * as helpers from "./helpers.js";
56

67
const app = express();
78
const port = Number.parseInt(process.env.PORT ?? "7070", 10);
@@ -12,7 +13,7 @@ app.locals.serviceUrl = "/";
1213

1314
app.use(express.static("public"));
1415

15-
app.engine(".html", engine({ extname: ".html" }));
16+
app.engine(".html", engine({ extname: ".html", helpers: helpers }));
1617
app.set("view engine", ".html");
1718
app.set("views", "./views");
1819

@@ -137,6 +138,12 @@ function treeForCurrentState(session, current) {
137138
name: "Umsätze",
138139
href: "/umsatz/start",
139140
active: current.startsWith("/umsatz"),
141+
started: session.umsatzDiesesJahr || session.ustDiesesJahr,
142+
done:
143+
session.umsatzDiesesJahr &&
144+
session.umsatzNaechstesJahr &&
145+
(session.kleinunternehmenBool === "ja" ||
146+
(session.ustDiesesJahr && session.ustNaechstesJahr)),
140147
items: [
141148
{
142149
name: "Vorraussichtliche Umsätze",
@@ -222,6 +229,7 @@ app.get("/", (req, res) => {
222229
res.render("index", {
223230
pageName: "Kombi-Antrag Steuer und Gewerbe",
224231
start: true,
232+
pageTree: treeForCurrentState(req.session, "/"),
225233
session: req.session,
226234
});
227235
});
@@ -230,13 +238,15 @@ app.get("/antrag", (req, res) => {
230238
res.render("antrag", {
231239
pageName: "Ihr Kombi-Antrag",
232240
start: true,
241+
pageTree: treeForCurrentState(req.session, "/antrag"),
233242
session: req.session,
234243
});
235244
});
236245

237246
app.get("/person/start", (req, res) => {
238247
res.render("person/start", {
239-
pageName: "Persönliche Daten",
248+
pageName: "Persönliche Angaben",
249+
pageTree: treeForCurrentState(req.session, "/person/start"),
240250
session: req.session,
241251
});
242252
});
@@ -278,8 +288,6 @@ app.post("/person/geburtstag", (req, res) => {
278288
req.session.tag = req.body.tag;
279289
req.session.monat = req.body.monat;
280290
req.session.jahr = req.body.jahr;
281-
282-
req.session.personalStarted = true;
283291
res.redirect("/person/geburtsort");
284292
});
285293

@@ -648,7 +656,7 @@ app.post("/umsatz/kleinunternehmerregelung", (req, res) => {
648656
}
649657

650658
if (kleinunternehmenVerwenden) {
651-
res.redirect("/umsatz/status");
659+
res.redirect("/gewinn/start");
652660
} else {
653661
res.redirect("/umsatz/umsatzsteuer");
654662
}

helpers.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export function printIndex(value) {
2+
return value + 1;
3+
}

views/antrag.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div class="kern-stack kern-gap-xl">
22
<div class="kern-stack">
33
<h2 class="kern-heading-x-large">Ihr Kombi-Antrag</h2>
4-
{{>tasklist interactive=true}}
4+
{{>tasklist items=pageTree interactive=true}}
55
</div>
66
</div>

views/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ <h2 class="kern-heading-x-large">
1111
Antrag für Steuernummer und Gewerbeanmeldung.
1212
</p>
1313
</div>
14-
{{>tasklist}}
14+
{{>tasklist items=pageTree }}
1515
<div class="kern-btn-wrapper">
1616
<a href="/person/bundid" class="kern-btn kern-btn--primary">
1717
<span class="kern-label">Jetzt Starten</span>

views/partials/status.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<div class="kern-stack kern-gap-xl">
22
<div class="kern-stack">
33
<h2 class="kern-heading-x-large">Ihr Kombi-Antrag</h2>
4-
{{>tasklist interactive=true}}
4+
{{>tasklist items=pageTree interactive=true}}
55
</div>
66
<div class="kern-btn-wrapper">
77
<a href="{{ href }}" class="kern-btn kern-btn--primary">

views/partials/tasklist.html

Lines changed: 21 additions & 136 deletions
Original file line numberDiff line numberDiff line change
@@ -1,122 +1,24 @@
1+
{{#if interactive}}
12
<div class="kern-task-list">
23
<ul class="kern-task-list__list">
4+
{{#each items}}
35
<li class="kern-task-list__item">
4-
<span class="kern-number">1</span>
6+
<span class="kern-number">{{printIndex @index}}</span>
57
<div class="kern-task-list__title" id="task1-title">
6-
{{#if interactive}}
78
<a
8-
href="/person/start"
9+
href="{{href}}"
910
class="kern-link kern-link--stretched"
1011
aria-describedby="task1-status"
1112
>
12-
Persönliche Angaben
13+
{{name}}
1314
</a>
14-
{{else}}
15-
<p class="kern-body">Persönliche Angaben</p>
16-
{{/if}} {{#if session.personalStarted}} {{#unless session.personalDone}}
15+
{{#if started }} {{#unless done }}
1716
<div class="kern-task-list__status" id="task2-status">
1817
<span class="kern-badge kern-badge--warning">
1918
<span class="kern-label kern-label--small">Unvollständig</span>
2019
</span>
2120
</div>
22-
{{/unless}} {{/if}} {{#if session.personalDone}}
23-
<div class="kern-task-list__status" id="task1-status">
24-
<span class="kern-badge kern-badge--success">
25-
<span
26-
class="kern-icon kern-icon--success kern-icon--sm"
27-
aria-hidden="true"
28-
></span>
29-
<span class="kern-label kern-label--small">Erledigt</span>
30-
</span>
31-
</div>
32-
{{/if}}
33-
</div>
34-
</li>
35-
<li class="kern-task-list__item">
36-
<span class="kern-number">2</span>
37-
<div class="kern-task-list__title" id="task2-title">
38-
{{#if interactive}}
39-
<a
40-
href="/unternehmen/start"
41-
class="kern-link kern-link--stretched"
42-
aria-describedby="task2-status"
43-
>
44-
Unternehmen und Tätigkeit
45-
</a>
46-
{{else}}
47-
<p class="kern-body">Unternehmen und Tätigkeit</p>
48-
{{/if}} {{#if session.unternehmenStarted}} {{#unless
49-
session.unternehmenDone}}
50-
<div class="kern-task-list__status" id="task2-status">
51-
<span class="kern-badge kern-badge--warning">
52-
<span class="kern-label kern-label--small">Unvollständig</span>
53-
</span>
54-
</div>
55-
{{/unless}} {{/if}} {{#if session.unternehmenDone}}
56-
<div class="kern-task-list__status" id="task1-status">
57-
<span class="kern-badge kern-badge--success">
58-
<span
59-
class="kern-icon kern-icon--success kern-icon--sm"
60-
aria-hidden="true"
61-
></span>
62-
<span class="kern-label kern-label--small">Erledigt</span>
63-
</span>
64-
</div>
65-
{{/if}}
66-
</div>
67-
</li>
68-
<li class="kern-task-list__item">
69-
<span class="kern-number">3</span>
70-
<div class="kern-task-list__title" id="task2-title">
71-
{{#if interactive}}
72-
<a
73-
href="/umsatz/start"
74-
class="kern-link kern-link--stretched"
75-
aria-describedby="task2-status"
76-
>
77-
Umsätze
78-
</a>
79-
{{else}}
80-
<p class="kern-body">Umsätze</p>
81-
{{/if}} {{#if session.umsatzStarted}} {{#unless session.umsatzDone}}
82-
<div class="kern-task-list__status" id="task2-status">
83-
<span class="kern-badge kern-badge--warning">
84-
<span class="kern-label kern-label--small">Unvollständig</span>
85-
</span>
86-
</div>
87-
{{/unless}} {{/if}} {{#if session.umsatzDone}}
88-
<div class="kern-task-list__status" id="task1-status">
89-
<span class="kern-badge kern-badge--success">
90-
<span
91-
class="kern-icon kern-icon--success kern-icon--sm"
92-
aria-hidden="true"
93-
></span>
94-
<span class="kern-label kern-label--small">Erledigt</span>
95-
</span>
96-
</div>
97-
{{/if}}
98-
</div>
99-
</li>
100-
<li class="kern-task-list__item">
101-
<span class="kern-number">4</span>
102-
<div class="kern-task-list__title" id="task2-title">
103-
{{#if interactive}}
104-
<a
105-
href="/gewinn/start"
106-
class="kern-link kern-link--stretched"
107-
aria-describedby="task2-status"
108-
>
109-
Gewinne und Einkünfte
110-
</a>
111-
{{else}}
112-
<p class="kern-body">Gewinne und Einkünfte</p>
113-
{{/if}} {{#if session.gewinnStarted}} {{#unless session.gewinnDone}}
114-
<div class="kern-task-list__status" id="task2-status">
115-
<span class="kern-badge kern-badge--warning">
116-
<span class="kern-label kern-label--small">Unvollständig</span>
117-
</span>
118-
</div>
119-
{{/unless}} {{/if}} {{#if session.gewinnDone}}
21+
{{/unless}} {{/if}} {{#if done}}
12022
<div class="kern-task-list__status" id="task1-status">
12123
<span class="kern-badge kern-badge--success">
12224
<span
@@ -129,26 +31,24 @@
12931
{{/if}}
13032
</div>
13133
</li>
34+
{{/each}}
35+
</ul>
36+
</div>
37+
{{else}}
38+
<div class="kern-task-list">
39+
<ul class="kern-task-list__list">
40+
{{#each items}}
13241
<li class="kern-task-list__item">
133-
<span class="kern-number">5</span>
134-
<div class="kern-task-list__title" id="task2-title">
135-
{{#if interactive}}
136-
<a
137-
href="/kontakt/start"
138-
class="kern-link kern-link--stretched"
139-
aria-describedby="task2-status"
140-
>
141-
Kontaktdaten
142-
</a>
143-
{{else}}
144-
<p class="kern-body">Kontaktdaten</p>
145-
{{/if}} {{#if session.kontaktStarted}} {{#unless session.kontaktDone}}
42+
<span class="kern-number">{{printIndex @index}}</span>
43+
<div class="kern-task-list__title" id="task1-title">
44+
<p class="kern-body">{{name}}</p>
45+
{{#if started }} {{#unless done }}
14646
<div class="kern-task-list__status" id="task2-status">
14747
<span class="kern-badge kern-badge--warning">
14848
<span class="kern-label kern-label--small">Unvollständig</span>
14949
</span>
15050
</div>
151-
{{/unless}} {{/if}} {{#if session.kontaktDone}}
51+
{{/unless}} {{/if}} {{#if done}}
15252
<div class="kern-task-list__status" id="task1-status">
15353
<span class="kern-badge kern-badge--success">
15454
<span
@@ -161,22 +61,7 @@
16161
{{/if}}
16262
</div>
16363
</li>
164-
<li class="kern-task-list__item">
165-
<span class="kern-number">6</span>
166-
167-
<div class="kern-task-list__title">
168-
{{#if interactive}}
169-
<a
170-
href="/antrag-ueberpruefen"
171-
class="kern-link kern-link--stretched"
172-
aria-describedby="task2-status"
173-
>
174-
Angaben überprüfen</a
175-
>
176-
{{else}}
177-
<p class="kern-body">Angaben überprüfen</p>
178-
{{/if}}
179-
</div>
180-
</li>
64+
{{/each}}
18165
</ul>
18266
</div>
67+
{{/if}}

0 commit comments

Comments
 (0)