Skip to content

Commit dfa6de5

Browse files
d-r-qd-r-q
committed
feat/qg-157: ux табов карточки клиента сделан более мобильным
1 parent 3b5173b commit dfa6de5

File tree

4 files changed

+37
-77
lines changed

4 files changed

+37
-77
lines changed

‎app/src/main/resources/static/styles/styles-qyoga.css‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -124,4 +124,14 @@ input[type=number] {
124124
.w-sm-auto {
125125
width: auto !important;
126126
}
127+
}
128+
129+
/* "мобилизация" табов в карточке клиента */
130+
.nav-tabs .nav-link.active {
131+
border: 0;
132+
border-bottom: 2px solid #20c997 !important;
133+
}
134+
135+
.nav-tabs .nav-link:hover {
136+
border-color: transparent;
127137
}

‎app/src/main/resources/templates/therapist/clients/client-edit.html‎

Lines changed: 22 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -18,83 +18,32 @@
1818
<div id="layoutSidenav_content">
1919
<main class="h-100">
2020

21+
<div class="row g-0 w-100 mb-4 d-sm-flex">
22+
23+
<ul class="nav nav-tabs nav-fill" id="cardTabs">
24+
<li class="nav-item">
25+
<a class="nav-link " id="journalLinkSm"
26+
th:classappend="${activeTab.name.contains('JOURNAL')} ? 'active'"
27+
th:href="@{/therapist/clients/{clientId}/journal(clientId=${clientId})}">Журнал</a>
28+
</li>
29+
<li class="nav-item">
30+
<a class="nav-link " id="cardLinkSm"
31+
th:classappend="${activeTab.name == 'CARD'} ? 'active'"
32+
th:href="@{/therapist/clients/{clientId}/card(clientId=${clientId})}">Карточка</a>
33+
</li>
34+
<li class="nav-item">
35+
<a class="nav-link"
36+
id="filesLinkSm"
37+
th:classappend="${activeTab.name == 'FILES'} ? 'active'"
38+
th:href="@{/therapist/clients/{clientId}/files(clientId=${clientId})}">Файлы</a>
39+
</li>
40+
</ul>
41+
</div>
2142
<section class="container px-4">
2243

23-
<div class="row g-0 w-100 mb-4 d-none d-sm-flex">
24-
<ul class="nav nav-tabs" id="cardTabs">
25-
<li class="nav-item">
26-
<a class="nav-link " id="journalLinkSm"
27-
th:classappend="${activeTab == 'journal'} ? 'active'"
28-
th:href="@{/therapist/clients/{clientId}/journal(clientId=${clientId})}">Журнал</a>
29-
</li>
30-
<li class="nav-item">
31-
<a class="nav-link disabled " href="#">Особенности</a>
32-
</li>
33-
<li class="nav-item">
34-
<a class="nav-link " id="cardLinkSm"
35-
th:classappend="${activeTab == 'card'} ? 'active'"
36-
th:href="@{/therapist/clients/{clientId}/card(clientId=${clientId})}">Карточка</a>
37-
</li>
38-
<li class="nav-item">
39-
<a class="nav-link disabled" href="#">Объём движений</a>
40-
</li>
41-
<li class="nav-item">
42-
<a class="nav-link"
43-
id=" filesLinkSm"
44-
th:classappend="${activeTab == 'card'} ? 'active'"
45-
th:href="@{/therapist/clients/{clientId}/files(clientId=${clientId})}">Файлы</a>
46-
</li>
47-
<li class="nav-item">
48-
<a class="nav-link disabled" href="#">Программы</a>
49-
</li>
50-
</ul>
51-
</div>
52-
53-
<div class="row d-flex d-sm-none pb-3 mb-4 border-bottom">
54-
<div class="btn-group">
55-
<button aria-expanded="false"
56-
class="btn btn-outline-primary dropdown-toggle nav-drop" id="clientPageTab"
57-
data-bs-toggle="dropdown"
58-
type="button">
59-
<span th:if="${activeTab.name.toLowerCase().contains('journal')}">Журнал</span>
60-
<span th:if="${activeTab.name.equalsIgnoreCase('card')}">Карточка</span>
61-
<span th:if="${activeTab.name.equalsIgnoreCase('files')}">Файлы</span>
62-
</button>
63-
64-
<ul class="dropdown-menu dropdown-menu-start nav-drop">
65-
<li>
66-
<a class="dropdown-item "
67-
id="journalLink"
68-
th:classappend="${activeTab.name.equalsIgnoreCase('journal')} ? 'active'"
69-
th:href="@{/therapist/clients/{clientId}/journal(clientId=${clientId})}">Журнал</a>
70-
</li>
71-
<li>
72-
<a class="dropdown-item disabled " href="#">Особенности</a>
73-
</li>
74-
<li>
75-
<a class="dropdown-item "
76-
id="cardLink"
77-
th:classappend="${activeTab.name.equalsIgnoreCase('card')} ? 'active'"
78-
th:href="@{/therapist/clients/{clientId}/card(clientId=${clientId})}">Карточка</a>
79-
</li>
80-
<li>
81-
<a class="dropdown-item disabled" href="#">Объём движений</a>
82-
</li>
83-
<li>
84-
<a class="dropdown-item"
85-
id="filesLink"
86-
th:classappend="${activeTab.name.equalsIgnoreCase('files')} ? 'active'"
87-
th:href="@{/therapist/clients/{clientId}/files(clientId=${clientId})}">Файлы</a>
88-
</li>
89-
<li>
90-
<a class="dropdown-item disabled" href="#">Программы</a>
91-
</li>
92-
</ul>
93-
</div>
94-
</div>
95-
9644
<div id="tabContent"
9745
th:insert="~{'therapist/clients/client-' + ${activeTab.name.toLowerCase()} + '-fragment.html'}"></div>
46+
9847
</section>
9948
</main>
10049
<footer th:insert="~{fragments/footer.html :: footer}"></footer>

‎app/src/testFixtures/kotlin/pro/qyoga/tests/pages/therapist/clients/ClientPageTabsFragment.kt‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,6 @@ object ClientPageTabsFragment : Component {
2828
haveComponent(filesLink)
2929
)
3030

31-
fun mobileTabName(element: Element): String =
32-
element.select("#clientPageTab").first()?.text() ?: ""
33-
3431
fun journalLinkClientId(element: Element): UUID? {
3532
return journalLink.pathParam(element, "clientId")?.let { UUID.fromString(it) }
3633
}
@@ -43,4 +40,8 @@ object ClientPageTabsFragment : Component {
4340
return filesLink.pathParam(element, "clientId")?.let { UUID.fromString(it) }
4441
}
4542

43+
fun activeTab(element: Element): String? {
44+
return element.select("#cardTabs li a.nav-link.active").firstOrNull()?.text()
45+
}
46+
4647
}

‎app/src/testFixtures/kotlin/pro/qyoga/tests/pages/therapist/clients/journal/entry/CreateJournalEntryPage.kt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ class CreateJournalEntryPage(
2323
override fun match(element: Element) {
2424
element shouldHaveComponent ClientPageTabsFragment
2525
element shouldHave CreateJournalEntryFragment(client.id, entryDate)
26-
ClientPageTabsFragment.mobileTabName(element) shouldBe "Журнал"
26+
ClientPageTabsFragment.activeTab(element) shouldBe "Журнал"
2727
}
2828

2929
}

0 commit comments

Comments
 (0)