From 1d9a107f0ff8eb77c8666b124fab471dd68c6bb1 Mon Sep 17 00:00:00 2001
From: Ron Lucke <lucke@elan-ev.de>
Date: Tue, 21 Feb 2023 08:37:17 +0000
Subject: [PATCH] fix #2108
Closes #2108
Merge request studip/studip!1368
---
.../assets/stylesheets/scss/courseware.scss | 15 ++++
.../courseware/CoursewareSharedItems.vue | 88 +++++++++++++++++++
.../courseware/CoursewareUnitItems.vue | 1 +
.../vue/components/courseware/ShelfApp.vue | 3 +
resources/vue/courseware-shelf-app.js | 2 +
5 files changed, 109 insertions(+)
create mode 100644 resources/vue/components/courseware/CoursewareSharedItems.vue
diff --git a/resources/assets/stylesheets/scss/courseware.scss b/resources/assets/stylesheets/scss/courseware.scss
index 4c8a8260011..4ebbdc0b38b 100644
--- a/resources/assets/stylesheets/scss/courseware.scss
+++ b/resources/assets/stylesheets/scss/courseware.scss
@@ -5362,3 +5362,18 @@ w i z a r d e l e m e n t s
/* * * * * * * * * * * * * * * * * *
w i z a r d e l e m e n t s e n d
* * * * * * * * * * * * * * * * * */
+
+
+/* * * * * * * * * * * * * * *
+s h e l f i t e m s
+* * * * * * * * * * * * * * */
+.cw-unit-items,
+.cw-shared-items {
+ margin-bottom: 10px;
+ h2 {
+ margin-top: 0;
+ }
+}
+/* * * * * * * * * * * * * * * * * *
+s h e l f i t e m s e n d
+* * * * * * * * * * * * * * * * * */
diff --git a/resources/vue/components/courseware/CoursewareSharedItems.vue b/resources/vue/components/courseware/CoursewareSharedItems.vue
new file mode 100644
index 00000000000..e68179c7153
--- /dev/null
+++ b/resources/vue/components/courseware/CoursewareSharedItems.vue
@@ -0,0 +1,88 @@
+<template>
+ <div class="cw-shared-items">
+ <h2 v-if="sharedElements.length > 0">{{ $gettext('Geteilte Lernmaterialien') }}</h2>
+ <ul class="cw-tiles">
+ <li
+ v-for="element in sharedElements"
+ :key="element.id"
+ class="tile"
+ :class="[element.attributes.payload.color, sharedElements.length > 3 ? '': 'cw-tile-margin']"
+ >
+ <a :href="getSharedElementUrl(element.id)" :title="element.attributes.title">
+ <div
+ class="preview-image"
+ :class="[hasImage(element) ? '' : 'default-image']"
+ :style="getChildStyle(element)"
+ >
+ <div class="overlay-text">{{ getOwnerName(element) }}</div>
+ </div>
+ <div class="description">
+ <header
+ :class="[element.attributes.purpose !== '' ? 'description-icon-' + element.attributes.purpose : '']"
+ >
+ {{ element.attributes.title }}
+ </header>
+ <div class="description-text-wrapper">
+ <p>{{ element.attributes.payload.description }}</p>
+ </div>
+ <footer>
+ {{ countChildren(element) + 1 }}
+ <translate
+ :translate-n="countChildren(element) + 1"
+ translate-plural="Seiten"
+ >
+ Seite
+ </translate>
+ </footer>
+ </div>
+ </a>
+ </li>
+ </ul>
+ </div>
+</template>
+<script>
+import { mapGetters } from 'vuex';
+
+export default {
+ name: 'courseware-shared-items',
+ computed: {
+ ...mapGetters({
+ sharedElements: 'courseware-structural-elements-shared/all',
+ userById: 'users/byId',
+ }),
+ },
+ methods: {
+ getChildStyle(child) {
+ let url = child.relationships?.image?.meta?.['download-url'];
+
+ if(url) {
+ return {'background-image': 'url(' + url + ')'};
+ } else {
+ return {};
+ }
+ },
+ hasImage(child) {
+ return child.relationships?.image?.data !== null;
+ },
+ getElementUrl(elementId) {
+ return STUDIP.URLHelper.base_url + 'dispatch.php/contents/courseware/courseware#/structural_element/' + elementId;
+ },
+ getSharedElementUrl(elementId) {
+ return STUDIP.URLHelper.base_url + 'dispatch.php/contents/courseware/shared_content_courseware/' + elementId;
+ },
+ getOwnerName(element) {
+ const ownerId = element.relationships.owner.data.id;
+ const owner = this.userById({ id: ownerId });
+
+ return owner.attributes['formatted-name'];
+ },
+ countChildren(element) {
+ let data = element.relationships.children.data;
+ if (data) {
+ return data.length;
+ }
+ return 0;
+ },
+ },
+}
+</script>
\ No newline at end of file
diff --git a/resources/vue/components/courseware/CoursewareUnitItems.vue b/resources/vue/components/courseware/CoursewareUnitItems.vue
index 1e8468f8a01..8aca4af56b1 100644
--- a/resources/vue/components/courseware/CoursewareUnitItems.vue
+++ b/resources/vue/components/courseware/CoursewareUnitItems.vue
@@ -1,5 +1,6 @@
<template>
<div class="cw-unit-items">
+ <h2 v-if="!inCourseContext && hasUnits">{{ $gettext('Persönliche Lernmaterialien') }}</h2>
<ul v-if="hasUnits" class="cw-tiles">
<courseware-unit-item v-for="unit in units" :key="unit.id" :unit="unit"/>
</ul>
diff --git a/resources/vue/components/courseware/ShelfApp.vue b/resources/vue/components/courseware/ShelfApp.vue
index e9f275d8d96..d9b37a448ed 100644
--- a/resources/vue/components/courseware/ShelfApp.vue
+++ b/resources/vue/components/courseware/ShelfApp.vue
@@ -2,6 +2,7 @@
<div>
<div class="cw-shelf">
<courseware-unit-items />
+ <courseware-shared-items v-if="!inCourseContext" />
</div>
<courseware-shelf-dialog-add v-if="showUnitAddDialog" />
<courseware-shelf-dialog-copy v-if="showUnitCopyDialog" />
@@ -23,6 +24,7 @@ import CoursewareShelfDialogAdd from './CoursewareShelfDialogAdd.vue';
import CoursewareShelfDialogCopy from './CoursewareShelfDialogCopy.vue';
import CoursewareShelfDialogImport from './CoursewareShelfDialogImport.vue';
import CoursewareUnitItems from './CoursewareUnitItems.vue';
+import CoursewareSharedItems from './CoursewareSharedItems.vue';
import CoursewareCompanionOverlay from './CoursewareCompanionOverlay.vue';
import { mapActions, mapGetters } from 'vuex';
@@ -35,6 +37,7 @@ export default {
CoursewareShelfDialogCopy,
CoursewareShelfDialogImport,
CoursewareUnitItems,
+ CoursewareSharedItems,
CoursewareCompanionOverlay,
},
computed: {
diff --git a/resources/vue/courseware-shelf-app.js b/resources/vue/courseware-shelf-app.js
index f175e587a6c..de8a438e416 100644
--- a/resources/vue/courseware-shelf-app.js
+++ b/resources/vue/courseware-shelf-app.js
@@ -50,6 +50,7 @@ const mountApp = async (STUDIP, createApp, element) => {
'courseware-user-data-fields',
'courseware-user-progresses',
'courseware-structural-elements',
+ 'courseware-structural-elements-shared',
'files',
'file-refs',
'folders',
@@ -79,6 +80,7 @@ const mountApp = async (STUDIP, createApp, element) => {
await store.dispatch('loadCourseUnits', entry_id);
} else {
await store.dispatch('loadUserUnits', entry_id);
+ await store.dispatch('courseware-structural-elements-shared/loadAll', { options: { include: 'owner' } });
}
const app = createApp({
--
GitLab