Show tooltip with linked courses in link video dialog, ref elan-ev#794

dennis531 · Dec 20, 2023 · e73bde9 · e73bde9
1 parent 094d3a1
commit e73bde9
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 0 deletions.
diff --git a/lib/Models/Playlists.php b/lib/Models/Playlists.php
@@ -321,6 +321,15 @@ public function toSanitizedArray()
 
         $data['tags'] = $this->tags->toArray();
 
+        $data['courses'] = [];
+        if (!empty($this->courses)) {
+            $data['courses'] = PlaylistSeminars::getCoursesArray(
+                $this->courses->map(function ($course) {
+                    return $course->id;
+                })
+            );
+        }
+
         if (!is_null($data['allow_download'])) {
             $data['allow_download'] = filter_var(
                 $data['allow_download'],

diff --git a/vueapp/components/Videos/Actions/VideoLinkToPlaylists.vue b/vueapp/components/Videos/Actions/VideoLinkToPlaylists.vue
@@ -10,12 +10,18 @@
         >
             <template v-slot:dialogContent>
                 <table class="default" v-if="event.playlists.length > 0">
+                    <colgroup>
+                        <col>
+                        <col style="width: 32px">
+                        <col style="width: 32px">
+                    </colgroup>
                     <thead>
                         <tr>
                             <th>
                                 {{ $gettext('Wiedergabeliste') }}
                             </th>
                             <th></th>
+                            <th></th>
                         </tr>
                     </thead>
                     <tbody>
@@ -25,6 +31,12 @@
                                     {{ playlist.title }}
                                 </router-link>
                             </td>
+                            <td>
+                                <div data-tooltip class="tooltip" v-if="getPlaylistInfo(playlist)">
+                                    <span class="tooltip-content" v-html="getPlaylistInfo(playlist)"></span>
+                                    <studip-icon shape="info-circle" role="active" :size="18" />
+                                </div>
+                            </td>
                             <td>
                                 <studip-icon shape="trash" role="clickable" @click="removePlaylist(index)" style="cursor: pointer"/>
                             </td>
@@ -83,6 +95,20 @@ export default {
     },
 
     methods: {
+        getPlaylistInfo(playlist) {
+            let info = '';
+
+            if (playlist.courses) {
+                info += '<div>' + this.$gettext('Verknüpfte Kurse') + '<ul>';
+                for (const course of playlist.courses) {
+                    info += '<li>' + course.name + '</li>';
+                }
+                info += '</ul></div>';
+            }
+
+            return info;
+        },
+
         addPlaylist(playlist) {
             this.event.playlists.push(playlist);