Verified Commit 76e3e6f8 authored by Sandro Lutz's avatar Sandro Lutz
Browse files

Update SelectTextField for studydocuments upload page

parent f16f29f5
......@@ -243,6 +243,8 @@ export default {
uploadLoadingError: 'Das Upload-Formular konnte nicht geladen werden.',
uploadError: 'Während dem Hochladen ist ein Fehler aufgetreten.',
uploading: 'lädt hoch...',
createNewEntry: 'Einen neuen Eintrag erstellen',
createNewEntryLabel: 'neuer Eintrag',
accessDenied: 'Studienunterlagen sind nur für ETH Studenten verfügbar.',
selectTextHelp: 'Kreuze «erstellen» an, um einen neuen Eintrag zu erstellen.',
rules: {
......
......@@ -243,6 +243,8 @@ export default {
uploadLoadingError: 'Could not load the upload form.',
uploadError: 'There was an error while uploading the documents.',
uploading: 'Uploading...',
createNewEntry: 'Create a new entry',
createNewEntryLabel: 'new entry',
accessDenied: 'Study documents are available only for ETH students.',
selectTextHelp: 'Tick «create» to create a new entry.',
rules: {
......
......@@ -83,9 +83,9 @@
grid-gap: 1em;
align-items: end;
.pe-checkbox-control {
.pe-checkbox-control,.pe-button {
position: relative;
bottom: 34px;
bottom: 26px;
}
}
......
......@@ -91,7 +91,8 @@ class SelectTextField {
dom.querySelector('input').setAttribute('autocomplete', 'off');
}
view({ attrs: { name, label, help = i18n('studydocs.selectTextHelp'), ...attrs } }) {
// view({ attrs: { name, label, help = i18n('studydocs.selectTextHelp'), ...attrs } }) {
view({ attrs: { name, label, help, ...attrs } }) {
return m('div.studydocs-upload-textfield', [
m('div.textfield', [
m(TextField, {
......@@ -139,34 +140,47 @@ class SelectTextField {
},
},
})
: m(Checkbox, {
label: i18n('button.create'),
onChange: ({ checked }) => {
this.addNew = checked;
this.notify();
},
: this.addNew &&
m(Button, {
className: 'flat-button',
label: i18n('studydocs.createNewEntryLabel'),
disabled: true,
}),
]),
this.showList && !this.selected && this.filteredOptions.length > 0
this.showList && !this.addNew && !this.selected
? m(Card, {
className: 'suggestions',
content: m(
'div',
m(List, {
style: { height: '400px', 'background-color': 'white' },
tiles: this.filteredOptions.map(option =>
style: { maxHeight: '400px', 'background-color': 'white' },
tiles: [
...this.filteredOptions.map(option =>
m(ListTile, {
title: option,
hoverable: true,
compactFront: true,
events: {
onclick: () => {
this.selected = option;
this.showList = false;
},
},
})
),
m(ListTile, {
title: option,
title: i18n('studydocs.createNewEntry'),
hoverable: true,
compactFront: true,
events: {
onclick: () => {
this.selected = option;
this.addNew = true;
this.showList = false;
this.validate();
},
},
})
),
}),
],
})
),
})
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment