fraport/fradrive
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/455-datepicker-interagieren-schlecht-mit-modals'

Browse Source
This commit is contained in:
Gregor Kleen 2019-10-09 16:52:40 +02:00
commit ed846df453
4 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/utils/form/datepicker.js
View File

@ -3,6 +3,7 @@ import { Utility } from '../../core/utility';
import moment from 'moment';
const KEYCODE_ESCAPE = 27;
const Z_INDEX_MODAL = 9999;
// INTERNAL (Uni2work specific) formats for formatting dates and/or times
const FORM_DATE_FORMAT = {
@ -42,9 +43,6 @@ const DATEPICKER_INITIALIZED_CLASS = 'datepicker--initialized';
const DATEPICKER_CONFIG = {
'global': {
// minimize overlaps with other date inputs
position: 'right',
// set default time to 00:00:00
timeHours: 0,
timeMinutes: 0,
@ -131,6 +129,14 @@ export class Datepicker {
// initialize tail.datetime (datepicker) instance
this.datepickerInstance = datetime(this._element, { ...datepickerGlobalConfig, ...datepickerConfig });
// insert the datepicker element (dt) after the form
this._element.form.parentNode.insertBefore(this.datepickerInstance.dt, this._element.form.nextSibling);
// if the input element is in any open modal, increase the z-index of the datepicker
if (this._element.closest('.modal--open')) {
this.datepickerInstance.dt.style.zIndex = Z_INDEX_MODAL;
}
// register this datepicker instance with the formID of the given element in the datepicker collection
const formID = this._element.form.id;
const elemID = this._element.id;
@ -233,4 +239,4 @@ export class Datepicker {
// return the (possibly changed) FormData
return formData;
}
}
}

3
frontend/src/utils/modal/modal.scss
View File

@ -27,7 +27,6 @@
border-radius: 2px;
z-index: -1;
color: var(--color-font);
padding: 0 40px;
overflow: auto;
overscroll-behavior: contain;
pointer-events: none;
@ -114,6 +113,6 @@ div.modal__trigger {
}
.modal__content {
margin: 20px 0;
margin: 20px 40px;
width: 100%;
}

2
package-lock.json generated
View File

@ -15317,7 +15317,7 @@
}
},
"tail.datetime": {
"version": "git+https://github.com/uni2work/tail.DateTime.git#d3256920fcedbf32c84b8065e77628097c7f2410",
"version": "git+https://github.com/uni2work/tail.DateTime.git#57e4feb2d6a53c7e1d3630a2da7eb9a213fa288d",
"from": "git+https://github.com/uni2work/tail.DateTime.git#master"
},
"tapable": {

4
src/Handler/Exam/Form.hs
View File

@ -163,8 +163,8 @@ examOccurrenceForm prev = wFormToAForm $ do
(eofNameRes, eofNameView) <- mpreq (textField & cfStrip & cfCI) ("" & addName (nudge "name")) (eofName <$> mPrev)
(eofRoomRes, eofRoomView) <- mpreq (textField & cfStrip) ("" & addName (nudge "room")) (eofRoom <$> mPrev)
(eofCapacityRes, eofCapacityView) <- mpreq (natFieldI MsgExamRoomCapacityNegative) ("" & addName (nudge "capacity")) (eofCapacity <$> mPrev)
(eofStartRes, eofStartView) <- mpreq utcTimeField ("" & addName (nudge "start") & addDatepickerPositionAttr DPBottom) (eofStart <$> mPrev)
(eofEndRes, eofEndView) <- mopt utcTimeField ("" & addName (nudge "end") & addDatepickerPositionAttr DPBottom) (eofEnd <$> mPrev)
(eofStartRes, eofStartView) <- mpreq utcTimeField ("" & addName (nudge "start")) (eofStart <$> mPrev)
(eofEndRes, eofEndView) <- mopt utcTimeField ("" & addName (nudge "end")) (eofEnd <$> mPrev)
(eofDescRes, eofDescView) <- mopt htmlFieldSmall ("" & addName (nudge "description")) (eofDescription <$> mPrev)
return ( ExamOccurrenceForm