From 376c212bce531ad4411d8c64a1223a3a5c576535 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Michaela=20Br=C3=BCckner?= <brueckner@data-quest.de>
Date: Wed, 25 Jun 2025 17:29:35 +0200
Subject: re #5660

---
 app/controllers/admin/plugin.php           |   8 +-
 app/views/admin/plugin/unregistered.php    |  47 ----------
 resources/vue/apps/UnregisteredPlugins.vue | 140 +++++++++++++++++++++++++++++
 3 files changed, 146 insertions(+), 49 deletions(-)
 delete mode 100644 app/views/admin/plugin/unregistered.php
 create mode 100644 resources/vue/apps/UnregisteredPlugins.vue

diff --git a/app/controllers/admin/plugin.php b/app/controllers/admin/plugin.php
index 1be046d..b915f3b 100644
--- a/app/controllers/admin/plugin.php
+++ b/app/controllers/admin/plugin.php
@@ -509,8 +509,12 @@ class Admin_PluginController extends AuthenticatedController
 
     public function unregistered_action()
     {
-        $plugins = $this->plugin_admin->scanPluginDirectory(true);
-        $this->unknown_plugins = $plugins;
+        $this->render_vue_app(
+            Studip\VueApp::create('UnregisteredPlugins')
+                ->withProps([
+                    'plugins' => $this->plugin_admin->scanPluginDirectory(true),
+                ])
+        );
     }
 
     /**
diff --git a/app/views/admin/plugin/unregistered.php b/app/views/admin/plugin/unregistered.php
deleted file mode 100644
index 800d247..0000000
--- a/app/views/admin/plugin/unregistered.php
+++ /dev/null
@@ -1,47 +0,0 @@
-<?php
-/**
- * @var Admin_PluginController $controller
- * @var array $unknown_plugins
- */
-?>
-<table class="default sortable-table" data-sortlist="[[0, 0]]">
-    <caption>
-        <?= _('Im Pluginverzeichnis vorhandene Plugins registrieren') ?>
-    </caption>
-    <thead>
-        <tr>
-            <th data-sort="text"><?= _('Name') ?></th>
-            <th data-sort="text"><?= _('Pluginklasse') ?></th>
-            <th data-sort="digit"><?= _('Version') ?></th>
-            <th data-sort="text"><?= _('Ursprung') ?></th>
-            <th><?= _('Registrieren') ?></th>
-        </tr>
-    </thead>
-    <tbody>
-    <? if (!$unknown_plugins): ?>
-        <tr>
-            <td colspan="5">
-                <?= _('Es sind keine nicht registrierten Plugins vorhanden') ?>
-            </td>
-        </tr>
-    <? endif; ?>
-    <? foreach ($unknown_plugins as $n => $plugin): ?>
-        <tr>
-            <td><?= htmlReady($plugin['pluginname']) ?></td>
-            <td><?= htmlReady($plugin['pluginclassname']) ?></td>
-            <td><?= htmlReady($plugin['version']) ?></td>
-            <td><?= htmlReady($plugin['origin']) ?></td>
-            <td class="actions">
-                <form action="<?= $controller->link_for('admin/plugin/register/' . $n) ?>" method="post">
-                    <?= CSRFProtection::tokenTag() ?>
-                    <?= Icon::create('install')->asInput([
-                        'title' => _('Plugin registrieren'),
-                        'class' => 'middle',
-                        'name'  => 'install',
-                    ]) ?>
-                </form>
-            </td>
-        </tr>
-    <? endforeach ?>
-    </tbody>
-</table>
diff --git a/resources/vue/apps/UnregisteredPlugins.vue b/resources/vue/apps/UnregisteredPlugins.vue
new file mode 100644
index 0000000..bfa2ab5
--- /dev/null
+++ b/resources/vue/apps/UnregisteredPlugins.vue
@@ -0,0 +1,140 @@
+<template>
+
+    <table class="default">
+        <caption>
+            {{ $gettext('Im Pluginverzeichnis vorhandene Plugins registrieren') }}
+        </caption>
+        <thead>
+        <tr class="sortable">
+            <th :class="getSortClasses('name')">
+                <button class="as-link" @click.prevent="changeOrder('name')">
+                    {{ $gettext('Name') }}
+                </button>
+            </th>
+            <th :class="getSortClasses('classname')">
+                <button class="as-link" @click.prevent="changeOrder('classname')">
+                    {{ $gettext('Pluginklasse') }}
+                </button>
+            </th>
+            <th :class="getSortClasses('version')">
+                <button class="as-link" @click.prevent="changeOrder('version')">
+                    {{ $gettext('Version') }}
+                </button>
+            </th>
+            <th :class="getSortClasses('origin')">
+                <button class="as-link" @click.prevent="changeOrder('origin')">
+                    {{ $gettext('Ursprung') }}
+                </button>
+            </th>
+            <th class="actions">{{ $gettext('Aktionen') }}</th>
+        </tr>
+        </thead>
+        <tbody>
+            <tr v-for="(plugin, id) in sortedPlugins"
+                :key="id">
+                <td>{{ plugin.pluginname }}</td>
+                <td>{{ plugin.pluginclassname }}</td>
+                <td>{{ plugin.version }}</td>
+                <td>{{ plugin.origin }}</td>
+                <td>
+                    <form class="default" method="post" :action="registerUrl(id)">
+                        <input type="hidden" :name="csrf.name" :value="csrf.value" />
+                        <button class="undecorated">
+                        <StudipIcon
+                            name=""
+                            shape="install"
+                            :title="$gettext('Plugin registrieren')"
+                        />
+                        </button>
+                    </form>
+                </td>
+            </tr>
+
+        </tbody>
+    </table>
+
+</template>
+<script>
+
+import StudipActionMenu from "../components/StudipActionMenu.vue";
+import StudipIcon from "../components/StudipIcon.vue";
+
+export default {
+    name: 'UnregisteredPlugins',
+    components: {StudipIcon, StudipActionMenu},
+    props: {
+        plugins: {
+            type: Array,
+            required: true
+        },
+    },
+    data() {
+        return {
+            sort: {
+                by: 'name',
+                dir: 'asc'
+            }
+        }
+    },
+    computed: {
+        csrf() {
+            return STUDIP.CSRF_TOKEN;
+        },
+        sortedPlugins() {
+            let sortedPlugins = [...this.plugins ?? []];
+            return sortedPlugins.sort((a, b) => {
+                const sortFactor = this.sort.dir === 'asc' ? 1 : -1;
+                let sortValue = 0;
+
+                switch (this.sort.by) {
+                    case 'name':
+                        sortValue = a.pluginname.localeCompare(b.pluginname);
+                        break;
+
+                    case 'classname':
+                        sortValue = a.pluginclassname.localeCompare(b.pluginclassname);
+                        break;
+
+                    case 'version':
+                        sortValue = a.version < b.version;
+                        break;
+
+                    case 'origin':
+                        sortValue = a.origin.localeCompare(b.origin);
+                        break;
+                }
+
+                return sortValue * sortFactor;
+
+            });
+        },
+    },
+    methods: {
+        changeOrder(by) {
+            if (this.sort.by === by) {
+                this.sort.dir = this.sort.dir === 'asc' ? 'desc' : 'asc';
+            } else {
+                this.sort.by = by;
+                this.sort.dir = 'asc';
+            }
+        },
+        getSortClasses(by) {
+            return {
+                'sortasc': this.sort.by === by && this.sort.dir === 'asc',
+                'sortdesc': this.sort.by === by && this.sort.dir === 'desc'
+            }
+        },
+        registerUrl(plugin_id) {
+            return STUDIP.URLHelper.getURL(`dispatch.php/admin/plugin/register/${plugin_id}`);
+        }
+
+    }
+}
+
+</script>
+
+<style lang="scss" scoped>
+    table.default td:last-child {
+        text-align: right;
+    }
+</style>
-- 
cgit v1.0