diff --git a/src/client/app/css/app.css b/src/client/app/css/app.css index dbabb8d..e9f1909 100644 --- a/src/client/app/css/app.css +++ b/src/client/app/css/app.css @@ -81,14 +81,14 @@ body.body-content { } .content { - /*margin-top: 72px;*/ - margin-top: 20px; - margin-bottom: 20px; + margin-top: 72px; + /*margin-top: 20px; + margin-bottom: 20px;*/ } -.dropdown-menu { +/*.dropdown-menu { top: auto; bottom: 100%; -} +}*/ .c-offcanvas--right { z-index: 1080; @@ -465,8 +465,8 @@ body.body-auth .action-button { position: fixed; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); - /*bottom: 20px;*/ - bottom: 76px; + bottom: 20px; + /*bottom: 76px;*/ right: 20px; text-align: center; font-size: 20px; @@ -481,7 +481,7 @@ body.body-auth .action-button { z-index: 100; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); overflow: auto; - max-height: calc(100% - 85px); + max-height: calc(100vh - 85px); } .action-list { @@ -494,11 +494,13 @@ body.body-auth .action-button { right: 0; opacity: 0; background-color: #fff; + max-height: calc(100vh - 85px); } .action-list-item { padding: 20px; white-space: nowrap; + background-color: #fff; } .action-list-item a { text-decoration: none; @@ -1235,4 +1237,24 @@ h6.calendar-week { .btn-primary.disabled, .btn-primary:disabled { background-color: #2B2D42; border-color: #2B2D42; +} + +.radio-icons { + border: 1px solid #ced4da; + border-radius: .25rem; + padding: .375rem .75rem; +} +.radio-icons p { + margin: 0; + cursor: pointer; +} +.radio-icons p i { + font-size: 0.65rem; +} +.radio-icons label { + width: 65px; +} +.radio-icons-inner { + display: none; + padding-top: 1rem; } \ No newline at end of file diff --git a/src/client/app/js/app/state/AppointmentCreate.js b/src/client/app/js/app/state/AppointmentCreate.js index 60c6b2e..5e7496f 100644 --- a/src/client/app/js/app/state/AppointmentCreate.js +++ b/src/client/app/js/app/state/AppointmentCreate.js @@ -18,6 +18,25 @@ app.state.AppointmentCreate = function() $content = app.core.View.getContent(); + function radioIcons() { + var radioIcons = document.getElementById('radio-icons'); + if (radioIcons) { + var toggleButton = radioIcons.querySelector('p'); + var radioIconsInner = radioIcons.querySelector('.radio-icons-inner'); + + if (toggleButton && radioIconsInner) { + toggleButton.addEventListener('click', function(event) { + event.stopPropagation(); // Verhindert Bubble-Up zum parent div + if (radioIconsInner.style.display === 'none' || radioIconsInner.style.display === '') { + radioIconsInner.style.display = 'block'; + } else { + radioIconsInner.style.display = 'none'; + } + }); + } + } + } + function checkCategories() { var teamId = $content.find( '[data-id="select-team-id"]' ).first().val(), @@ -162,6 +181,8 @@ app.state.AppointmentCreate = function() app.core.View.getTemplate( 'appointment-form', { teams : res.teams, groups : groups, currentProfile : app.model.SessionUser.getUserProfile() } ) ); + radioIcons(); + activeGroupId = $content.find( '[data-id="select-team-id"]' ).first().val(); $content.find( '[data-id="input-subject"]' ).first().autocomplete({ @@ -192,7 +213,7 @@ app.state.AppointmentCreate = function() { app.gui.PageLoader.show(); teamId = $form.find( '[data-id="select-team-id"]' ).first().val(); - icon = $('#input-subject-icon option:selected').val(); + icon = $('input[name="categoryicon"]:checked').val(); //console.log(icon); app.core.Rpc.call( diff --git a/src/client/app/js/app/state/AppointmentEdit.js b/src/client/app/js/app/state/AppointmentEdit.js index ced913a..388e44a 100644 --- a/src/client/app/js/app/state/AppointmentEdit.js +++ b/src/client/app/js/app/state/AppointmentEdit.js @@ -23,6 +23,25 @@ app.state.AppointmentEdit= function() $content = app.core.View.getContent(); + function radioIcons() { + var radioIcons = document.getElementById('radio-icons'); + if (radioIcons) { + var toggleButton = radioIcons.querySelector('p'); + var radioIconsInner = radioIcons.querySelector('.radio-icons-inner'); + + if (toggleButton && radioIconsInner) { + toggleButton.addEventListener('click', function(event) { + event.stopPropagation(); // Verhindert Bubble-Up zum parent div + if (radioIconsInner.style.display === 'none' || radioIconsInner.style.display === '') { + radioIconsInner.style.display = 'block'; + } else { + radioIconsInner.style.display = 'none'; + } + }); + } + } + } + function autocompleteSubjectLookup() { return acData.hasOwnProperty( 'subjects_' + group.getId() ) ? acData[ 'subjects_' + group.getId() ] : []; @@ -138,6 +157,8 @@ app.state.AppointmentEdit= function() ) ); + radioIcons(); + $content.find( '[data-id="input-subject"]' ).first().autocomplete( { lookup: autocompleteSubjectLookup() }); @@ -168,7 +189,7 @@ app.state.AppointmentEdit= function() 'Appointment', 'update', { - icon: $('#input-subject-icon option:selected').val(), + icon: $('input[name="categoryicon"]:checked').val(), processSerial : isSerial, appointmentId : appointmentId, categoryIds : $form.find( '[data-id="select-category-' + appointment.getTeamId() + '"]' ).first().val(), diff --git a/src/client/app/tmpl/appointment-form-edit.html b/src/client/app/tmpl/appointment-form-edit.html index 64669bc..5598f33 100644 --- a/src/client/app/tmpl/appointment-form-edit.html +++ b/src/client/app/tmpl/appointment-form-edit.html @@ -22,29 +22,403 @@ name="team-id" data-id="select-team-id" value="<%= mTeam.getId() %>" /> -
-
- - +
+
+

+ <%= _lc( 'APPOINTMENT_ICON' ) %> + +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
-
+
+
+
+
+
diff --git a/src/client/app/tmpl/appointment-form.html b/src/client/app/tmpl/appointment-form.html index bc20a2a..0daa5f4 100644 --- a/src/client/app/tmpl/appointment-form.html +++ b/src/client/app/tmpl/appointment-form.html @@ -36,30 +36,403 @@
-
-
- - +
+
+

+ <%= _lc( 'APPOINTMENT_ICON' ) %> + +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
-
+
+
+
+
+
diff --git a/src/client/app/tmpl/gui-navbar.html b/src/client/app/tmpl/gui-navbar.html index d11dd1e..6df1eae 100644 --- a/src/client/app/tmpl/gui-navbar.html +++ b/src/client/app/tmpl/gui-navbar.html @@ -1,4 +1,4 @@ -