From 55cb643f4a1cfd71d784e28396c70368163e3d3e Mon Sep 17 00:00:00 2001 From: Ron Lucke Date: Thu, 22 Jun 2023 09:03:10 +0000 Subject: =?UTF-8?q?Courseware=20-=20Vorlagen=20beim=20hinzuf=C3=BCgen=20ei?= =?UTF-8?q?ne=20Seite=20anbieten?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Closes #2021 Merge request studip/studip!1467 --- .../courseware/CoursewareStructuralElement.vue | 137 +------- .../CoursewareStructuralElementDialogAdd.vue | 380 +++++++++++++++++++++ resources/vue/mixins/courseware/wizard.js | 17 + 3 files changed, 407 insertions(+), 127 deletions(-) create mode 100644 resources/vue/components/courseware/CoursewareStructuralElementDialogAdd.vue create mode 100644 resources/vue/mixins/courseware/wizard.js diff --git a/resources/vue/components/courseware/CoursewareStructuralElement.vue b/resources/vue/components/courseware/CoursewareStructuralElement.vue index e472ee0..94d6ca7 100644 --- a/resources/vue/components/courseware/CoursewareStructuralElement.vue +++ b/resources/vue/components/courseware/CoursewareStructuralElement.vue @@ -367,62 +367,12 @@ - - - - - + :structuralElement="structuralElement" + :isRoot="isRoot" + :canEditParent="canEditParent" + /> import ContainerComponents from './container-components.js'; import CoursewarePluginComponents from './plugin-components.js'; +import CoursewareStructuralElementDialogAdd from './CoursewareStructuralElementDialogAdd.vue'; import CoursewareStructuralElementDialogCopy from './CoursewareStructuralElementDialogCopy.vue'; import CoursewareStructuralElementDialogImport from './CoursewareStructuralElementDialogImport.vue'; import CoursewareStructuralElementDialogLink from './CoursewareStructuralElementDialogLink.vue'; @@ -700,6 +651,7 @@ import CoursewareTab from './CoursewareTab.vue'; import CoursewareExport from '@/vue/mixins/courseware/export.js'; import CoursewareOerMessage from '@/vue/mixins/courseware/oermessage.js'; import colorMixin from '@/vue/mixins/courseware/colors.js'; +import wizardMixin from '@/vue/mixins/courseware/wizard.js'; import CoursewareDateInput from './CoursewareDateInput.vue'; import { FocusTrap } from 'focus-trap-vue'; import IsoDate from './IsoDate.vue'; @@ -710,6 +662,7 @@ import { mapActions, mapGetters } from 'vuex'; export default { name: 'courseware-structural-element', components: { + CoursewareStructuralElementDialogAdd, CoursewareStructuralElementDialogCopy, CoursewareStructuralElementDialogImport, CoursewareStructuralElementDialogLink, @@ -733,14 +686,10 @@ export default { }, props: ['canVisit', 'orderedStructuralElements', 'structuralElement'], - mixins: [CoursewareExport, CoursewareOerMessage, colorMixin], + mixins: [CoursewareExport, CoursewareOerMessage, colorMixin, wizardMixin], data() { return { - newChapterName: '', - newChapterParent: 'descendant', - newChapterPurpose: 'content', - newChapterTemplate: null, currentElement: '', uploadFileError: '', textCompanionWrongContext: this.$gettext('Die angeforderte Seite ist nicht Teil dieser Courseware.'), @@ -1231,11 +1180,6 @@ export default { ownerName() { return this.owner?.attributes['formatted-name'] ?? '?'; }, - selectableTemplates() { - return this.templates.filter(template => { - return template.attributes.purpose === this.newChapterPurpose - }); - }, complete() { return this.elementProgress === 100; }, @@ -1253,7 +1197,6 @@ export default { methods: { ...mapActions({ - createStructuralElementWithTemplate: 'createStructuralElementWithTemplate', updateStructuralElement: 'updateStructuralElement', deleteStructuralElement: 'deleteStructuralElement', lockObject: 'lockObject', @@ -1316,8 +1259,6 @@ export default { this.showElementEditDialog(true); break; case 'addElement': - this.newChapterName = ''; - this.newChapterParent = 'descendant'; this.errorEmptyChapterName = false; this.showElementAddDialog(true); break; @@ -1372,14 +1313,7 @@ export default { this.showElementAddDialog(false); }, checkUploadFile() { - const file = this.$refs?.upload_image?.files[0]; - if (file.size > 2097152) { - this.uploadFileError = this.$gettext('Diese Datei ist zu groß. Bitte wählen Sie eine kleinere Datei.'); - } else if (!file.type.includes('image')) { - this.uploadFileError = this.$gettext('Diese Datei ist kein Bild. Bitte wählen Sie ein Bild aus.'); - } else { - this.uploadFileError = ''; - } + this.uploadFileError = this.checkUploadImageFile(this.$refs?.upload_image?.files[0]); }, deleteImage() { if (!this.deletingPreviewImage) { @@ -1552,57 +1486,6 @@ export default { this.companionError({ info: this.$gettext('Die Seite konnte nicht gelöscht werden.') }); }); }, - async createElement() { - const title = this.newChapterName; // this is the title of the new element - const purpose = this.newChapterPurpose; - let parent_id = this.currentId; // new page is descandant as default - - this.errorEmptyChapterName = title.trim(); - if (this.errorEmptyChapterName === '') { - return; - } - if (this.newChapterParent === 'sibling') { - parent_id = this.structuralElement.relationships.parent.data.id; - } - this.showElementAddDialog(false); - this.createStructuralElementWithTemplate({ - attributes: { - title: title, - purpose: purpose, - }, - templateId: this.newChapterTemplate ? this.newChapterTemplate.id : null, - parentId: parent_id, - currentId: this.currentId, - }) - .then(() => { - let newElement = this.$store.getters['courseware-structural-elements/lastCreated']; - this.companionSuccess({ - info: - this.$gettextInterpolate( - this.$gettext('Die Seite %{ pageTitle } wurde erfolgreich angelegt.'), - { pageTitle: newElement.attributes.title } - ) - }); - this.$router.push(newElement.id); - }) - .catch(e => { - let errorMessage = this.$gettext('Es ist ein Fehler aufgetreten. Die Seite konnte nicht erstellt werden.'); - if (e.status === 403) { - errorMessage = this.$gettext('Die Seite konnte nicht erstellt werden. Sie haben nicht die notwendigen Schreibrechte.'); - } - - this.companionError({ info: errorMessage }); - }); - - let newElement = this.lastCreatedElement; - this.companionSuccess({ - info: this.$gettextInterpolate( - this.$gettext('Die Seite %{ pageTitle } wurde erfolgreich angelegt.'), - {pageTitle: newElement.attributes.title} - ) - }); - this.newChapterName = ''; - }, containerComponent(container) { return 'courseware-' + container.attributes['container-type'] + '-container'; }, diff --git a/resources/vue/components/courseware/CoursewareStructuralElementDialogAdd.vue b/resources/vue/components/courseware/CoursewareStructuralElementDialogAdd.vue new file mode 100644 index 0000000..d182495 --- /dev/null +++ b/resources/vue/components/courseware/CoursewareStructuralElementDialogAdd.vue @@ -0,0 +1,380 @@ +