- default routing to "/app/dashboard"

- default route after login "/app/dashboard" in AuthController.ts
- npm updates
- corrected route in menu.ts
- better styling for listing datasets for editor and submitter in Index.vue
- personal setting to route "/settings/user"
This commit is contained in:
Kaimbacher 2023-12-01 10:44:19 +01:00
parent 6fef581dd0
commit 0d51002903
10 changed files with 117 additions and 103 deletions

View File

@ -27,7 +27,7 @@ export default class AuthController {
} }
// otherwise, redirect todashboard // otherwise, redirect todashboard
response.redirect('/dashboard'); response.redirect('/app/dashboard');
} }
// logout function // logout function

View File

@ -55,7 +55,8 @@ export default class DatasetsController {
.orWhere((dQuery) => { .orWhere((dQuery) => {
dQuery dQuery
.whereIn('server_state', ['editor_accepted', 'rejected_reviewer', 'reviewed', 'published']) .whereIn('server_state', ['editor_accepted', 'rejected_reviewer', 'reviewed', 'published'])
.where('editor_id', user.id); .where('editor_id', user.id)
.doesntHave('identifier', 'and');
}) })
.preload('titles') .preload('titles')
.preload('user', (query) => query.select('id', 'login')) .preload('user', (query) => query.select('id', 'login'))

24
package-lock.json generated
View File

@ -4144,9 +4144,9 @@
} }
}, },
"node_modules/@types/luxon": { "node_modules/@types/luxon": {
"version": "3.3.5", "version": "3.3.6",
"resolved": "https://registry.npmjs.org/@types/luxon/-/luxon-3.3.5.tgz", "resolved": "https://registry.npmjs.org/@types/luxon/-/luxon-3.3.6.tgz",
"integrity": "sha512-1cyf6Ge/94zlaWIZA2ei1pE6SZ8xpad2hXaYa5JEFiaUH0YS494CZwyi4MXNpXD9oEuv6ZH0Bmh0e7F9sPhmZA==" "integrity": "sha512-LblarKeI26YsMLxHDIQ0295wPSLjkl98eNwDcVhz3zbo1H+kfnkzR01H5Ai5LBzSeddX0ZJSpGwKEZihGb5diw=="
}, },
"node_modules/@types/md5": { "node_modules/@types/md5": {
"version": "2.3.5", "version": "2.3.5",
@ -8194,9 +8194,9 @@
"integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==" "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.4.597", "version": "1.4.600",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.597.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.600.tgz",
"integrity": "sha512-0XOQNqHhg2YgRVRUrS4M4vWjFCFIP2ETXcXe/0KIQBjXE9Cpy+tgzzYfuq6HGai3hWq0YywtG+5XK8fyG08EjA==", "integrity": "sha512-KD6CWjf1BnQG+NsXuyiTDDT1eV13sKuYsOUioXkQweYTQIbgHkXPry9K7M+7cKtYHnSUPitVaLrXYB1jTkkYrw==",
"dev": true "dev": true
}, },
"node_modules/emittery": { "node_modules/emittery": {
@ -12309,9 +12309,9 @@
} }
}, },
"node_modules/node-releases": { "node_modules/node-releases": {
"version": "2.0.13", "version": "2.0.14",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.13.tgz", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
"integrity": "sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==", "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
"dev": true "dev": true
}, },
"node_modules/node-repl-await": { "node_modules/node-repl-await": {
@ -15930,9 +15930,9 @@
} }
}, },
"node_modules/svgo": { "node_modules/svgo": {
"version": "3.0.4", "version": "3.0.5",
"resolved": "https://registry.npmjs.org/svgo/-/svgo-3.0.4.tgz", "resolved": "https://registry.npmjs.org/svgo/-/svgo-3.0.5.tgz",
"integrity": "sha512-T+Xul3JwuJ6VGXKo/p2ndqx1ibxNKnLTvRc1ZTWKCfyKS/GgNjRZcYsK84fxTsy/izr91g/Rwx6fGnVgaFSI5g==", "integrity": "sha512-HQKHEo73pMNOlDlBcLgZRcHW2+1wo7bFYayAXkGN0l/2+h68KjlfZyMRhdhaGvoHV2eApOovl12zoFz42sT6rQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@trysound/sax": "0.2.0", "@trysound/sax": "0.2.0",

View File

@ -32,9 +32,9 @@ table {
@apply border-b-0; @apply border-b-0;
} }
tbody tr, tbody tr:nth-child(odd) { /* tbody tr, tbody tr:nth-child(odd) {
@apply lg:hover:bg-gray-100 lg:dark:hover:bg-slate-700/70; @apply lg:hover:bg-gray-100 lg:dark:hover:bg-slate-700/70;
} } */
tbody tr:nth-child(odd) { tbody tr:nth-child(odd) {
@apply lg:bg-gray-50 lg:dark:bg-slate-800; @apply lg:bg-gray-50 lg:dark:bg-slate-800;

View File

@ -133,7 +133,7 @@ const logout = async () => {
<template #dropdown> <template #dropdown>
<!-- <NavBarItem> --> <!-- <NavBarItem> -->
<!-- <NavBarItem route-name="admin.account.info"> --> <!-- <NavBarItem route-name="admin.account.info"> -->
<NavBarItem :route-name="'admin.account.info'"> <NavBarItem :route-name="'settings.user'">
<NavBarItemLabel :icon="mdiAccount" label="My Profile" /> <NavBarItemLabel :icon="mdiAccount" label="My Profile" />
</NavBarItem> </NavBarItem>
<NavBarItem v-if="userHasRoles(['moderator', 'administrator'])" :route-name="'settings'"> <NavBarItem v-if="userHasRoles(['moderator', 'administrator'])" :route-name="'settings'">

View File

@ -2,7 +2,7 @@
// import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3'; // import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3';
import { Head, usePage } from '@inertiajs/vue3'; import { Head, usePage } from '@inertiajs/vue3';
import { ComputedRef } from 'vue'; import { ComputedRef } from 'vue';
import { mdiSquareEditOutline, mdiTrashCan, mdiAlertBoxOutline, mdiLockOpen } from '@mdi/js'; import { mdiSquareEditOutline, mdiAlertBoxOutline } from '@mdi/js';
import { computed } from 'vue'; import { computed } from 'vue';
import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue'; import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
import SectionMain from '@/Components/SectionMain.vue'; import SectionMain from '@/Components/SectionMain.vue';
@ -38,7 +38,6 @@ const flash: ComputedRef<any> = computed(() => {
return usePage().props.flash; return usePage().props.flash;
}); });
const validStates = ['inprogress', 'rejected_editor'];
const getRowClass = (dataset) => { const getRowClass = (dataset) => {
// (props.options ? 'select' : props.type) // (props.options ? 'select' : props.type)
@ -80,80 +79,83 @@ const getRowClass = (dataset) => {
<table class="pure-table"> <table class="pure-table">
<thead> <thead>
<tr> <tr>
<th> <th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
<!-- <Sort label="Dataset Title" attribute="title" :search="form.search" /> --> <!-- <Sort label="Dataset Title" attribute="title" :search="form.search" /> -->
Dataset Title Title
</th> </th>
<th>Submitter</th> <th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
<th> Submitter
</th>
<th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
<!-- <Sort label="Email" attribute="email" :search="form.search" /> --> <!-- <Sort label="Email" attribute="email" :search="form.search" /> -->
<th>Server State</th> State
</th>
<th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
Editor
</th>
<th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
Date of last modification
</th>
<th scope="col" class="relative px-6 py-3" v-if="can.edit || can.delete">
<span class="sr-only">Actions</span>
</th> </th>
<th>Editor</th>
<th>Date of last modification</th>
<th v-if="can.edit || can.delete">Actions</th>
</tr> </tr>
</thead> </thead>
<!-- <th>Dataset Title</th> <tbody class="bg-white divide-y divide-gray-200">
<th>ID</th> <tr v-for="dataset in props.datasets.data" :key="dataset.id"
<th>Server State</th> :class="[getRowClass(dataset)]">
<th>Editor</th> <td data-label="Login" class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
<th>Date of last modification</th>
<th></th> -->
<tbody>
<tr v-for="dataset in props.datasets.data" :key="dataset.id" :class="getRowClass(dataset)">
<td data-label="Login">
<!-- <Link v-bind:href="stardust.route('user.show', [user.id])" <!-- <Link v-bind:href="stardust.route('user.show', [user.id])"
class="no-underline hover:underline text-cyan-600 dark:text-cyan-400"> class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">
{{ user.login }} {{ user.login }}
</Link> --> </Link> -->
<!-- {{ user.id }} --> <div class="text-sm font-medium">{{ dataset.main_title }}</div>
{{ dataset.main_title }}
</td> </td>
<td> {{ dataset.user.login }} </td> <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
<td> <div class="text-sm">{{ dataset.user.login }}</div>
{{ dataset.server_state }} </td>
<td class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
<div class="text-sm">{{ dataset.server_state }}</div>
</td> </td>
<td v-if="dataset.server_state === 'released'"> <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white"
<small class="text-gray-500 dark:text-slate-400" :title="dataset.server_date_modified"> v-if="dataset.server_state === 'released'">
<div class="text-sm" :title="dataset.server_date_modified">
Preferred reviewer: {{ dataset.preferred_reviewer }} Preferred reviewer: {{ dataset.preferred_reviewer }}
</small> </div>
</td> </td>
<td <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white"
v-else-if="dataset.server_state === 'editor_accepted' || dataset.server_state === 'rejected_reviewer'"> v-else-if="dataset.server_state === 'editor_accepted' || dataset.server_state === 'rejected_reviewer'">
<small class="text-gray-500 dark:text-slate-400" :title="dataset.server_date_modified"> <div class="text-sm" :title="dataset.server_date_modified">
In approval by: {{ dataset.editor?.login }} In approval by: {{ dataset.editor?.login }}
</small> </div>
</td>
<td class="py-4 whitespace-nowrap text-gray-700 dark:text-white" v-else>
<div class="text-sm">{{ dataset.editor?.login }}</div>
</td> </td>
<td v-else> <td data-label="modified" class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
{{ dataset.editor?.login }} <div class="text-sm" :title="dataset.server_date_modified">
</td>
<td data-label="Created" class="lg:w-1 whitespace-nowrap">
<small class="text-gray-500 dark:text-slate-400" :title="dataset.server_date_modified">
{{ dataset.server_date_modified }} {{ dataset.server_date_modified }}
</small> </div>
</td> </td>
<td class="before:hidden lg:w-1 whitespace-nowrap"> <td class="py-4 whitespace-nowrap text-right text-sm font-medium text-gray-700 dark:text-white">
<BaseButtons type="justify-start lg:justify-end" no-wrap> <BaseButtons type="justify-start lg:justify-end" no-wrap>
<BaseButton <BaseButton v-if="can.receive && (dataset.server_state == 'released')"
v-if="can.receive && (dataset.server_state == 'released')"
:route-name="stardust.route('editor.dataset.receive', [dataset.id])" color="info" :route-name="stardust.route('editor.dataset.receive', [dataset.id])" color="info"
:icon="mdiSquareEditOutline" :label="'Receive task'" small /> :icon="mdiSquareEditOutline" :label="'Receive task'" small />
<!-- <BaseButton
v-if="can.edit && (dataset.server_state == 'editor_accepted' || dataset.server_state == 'rejected_reviewer')"
:route-name="stardust.route('editor.dataset.edit', [dataset.id])" color="info"
:icon="mdiSquareEditOutline" :label="'Edit'" small /> -->
</BaseButtons> </BaseButtons>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<!-- <BaseButton
v-if="can.edit && (dataset.server_state == 'editor_accepted' || dataset.server_state == 'rejected_reviewer')"
:route-name="stardust.route('editor.dataset.edit', [dataset.id])" color="info"
:icon="mdiSquareEditOutline" :label="'Edit'" small /> -->
<div class="py-4"> <div class="py-4">
<Pagination v-bind:data="datasets.meta" /> <Pagination v-bind:data="datasets.meta" />
@ -165,24 +167,23 @@ const getRowClass = (dataset) => {
<style scoped> <style scoped>
.pure-table tr.released { .pure-table tr.released {
background-color: greenyellow; /* background-color: greenyellow; */
background-color: rgb(52 211 153);
color: gray; color: gray;
} }
.pure-table tr.editor_accepted { .pure-table tr.editor_accepted {
padding: 0.8em; /* background-color: lightblue; */
background-color: lightblue; background-color: rgb(125 211 252);
color: gray; color: gray;
} }
.pure-table tr.rejected_reviewer { .pure-table tr.rejected_reviewer {
padding: 0.8em;
background-color: orange; background-color: orange;
color: gray; color: gray;
} }
.pure-table tr.reviewed { .pure-table tr.reviewed {
/* padding: 0.8em; */
background-color: yellow; background-color: yellow;
color: gray; color: gray;
} }

View File

@ -81,22 +81,26 @@ const getRowClass = (dataset) => {
<table class="pure-table"> <table class="pure-table">
<thead> <thead>
<tr> <tr>
<th> <th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
<!-- <Sort label="Dataset Title" attribute="title" :search="form.search" /> --> <!-- <Sort label="Dataset Title" attribute="title" :search="form.search" /> -->
Dataset Title Dataset Title
</th> </th>
<th> <th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
<!-- <Sort label="Email" attribute="email" :search="form.search" /> --> <!-- <Sort label="Email" attribute="email" :search="form.search" /> -->
<th>Server State</th> Server State
</th>
<th scope="col" class="py-3 text-left text-xs font-medium uppercase tracking-wider">
Date of last modification
</th>
<th scope="col" class="relative px-6 py-3" v-if="can.edit || can.delete">
<span class="sr-only">Actions</span>
</th> </th>
<th>Date of last modification</th>
<th v-if="can.edit || can.delete">Actions</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody class="bg-white divide-y divide-gray-200">
<tr v-for="dataset in props.datasets.data" :key="dataset.id" :class="getRowClass(dataset)"> <tr v-for="dataset in props.datasets.data" :key="dataset.id" :class="getRowClass(dataset)">
<td data-label="Login"> <td data-label="Login" class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
<!-- <Link v-bind:href="stardust.route('user.show', [user.id])" <!-- <Link v-bind:href="stardust.route('user.show', [user.id])"
class="no-underline hover:underline text-cyan-600 dark:text-cyan-400"> class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">
{{ user.login }} {{ user.login }}
@ -104,16 +108,16 @@ const getRowClass = (dataset) => {
<!-- {{ user.id }} --> <!-- {{ user.id }} -->
{{ dataset.main_title }} {{ dataset.main_title }}
</td> </td>
<td> <td class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
{{ dataset.server_state }} {{ dataset.server_state }}
</td> </td>
<td data-label="Created" class="lg:w-1 whitespace-nowrap"> <td data-label="modified" class="py-4 whitespace-nowrap text-gray-700 dark:text-white">
<small class="text-gray-500 dark:text-slate-400" :title="dataset.server_date_modified"> <div class="text-sm" :title="dataset.server_date_modified">
{{ dataset.server_date_modified }} {{ dataset.server_date_modified }}
</small> </div>
</td> </td>
<td class="before:hidden lg:w-1 whitespace-nowrap"> <td class="py-4 whitespace-nowrap text-right text-sm font-medium text-gray-700 dark:text-white">
<BaseButtons v-if="validStates.includes(dataset.server_state)" <BaseButtons v-if="validStates.includes(dataset.server_state)"
type="justify-start lg:justify-end" no-wrap> type="justify-start lg:justify-end" no-wrap>
<!-- release created dataset --> <!-- release created dataset -->
@ -152,20 +156,22 @@ const getRowClass = (dataset) => {
</template> </template>
<style scoped> <style scoped>
.pure-table tr.inprogress { .pure-table tr.released {
padding: 0.8em; /* background-color: greenyellow; */
background-color: paleturquoise; background-color: rgb(52 211 153);
color: gray; color: gray;
} }
.pure-table tr.released { .pure-table tr.inprogress {
background-color: greenyellow; padding: 0.8em;
/* bg-teal-300 */
background-color: rgb(94 234 212);
color: gray; color: gray;
} }
.pure-table tr.editor_accepted { .pure-table tr.editor_accepted {
padding: 0.8em; /* background-color: lightblue; */
background-color: lightblue; background-color: rgb(125 211 252);
color: gray; color: gray;
} }

View File

@ -88,7 +88,7 @@ export const MainService = defineStore('main', {
fetch(sampleDataKey) { fetch(sampleDataKey) {
// sampleDataKey= clients or history // sampleDataKey= clients or history
axios axios
.get(`data-sources/${sampleDataKey}.json`) .get(`/data-sources/${sampleDataKey}.json`)
.then((r) => { .then((r) => {
if (r.data && r.data.data) { if (r.data && r.data.data) {
this[sampleDataKey] = r.data.data; this[sampleDataKey] = r.data.data;
@ -102,7 +102,7 @@ export const MainService = defineStore('main', {
fetchApi(sampleDataKey) { fetchApi(sampleDataKey) {
// sampleDataKey= authors or datasets // sampleDataKey= authors or datasets
axios axios
.get(`api/${sampleDataKey}`) .get(`/api/${sampleDataKey}`)
.then((r) => { .then((r) => {
if (r.data) { if (r.data) {
this[sampleDataKey] = r.data; this[sampleDataKey] = r.data;

View File

@ -11,7 +11,7 @@ import {
export default [ export default [
{ {
route: 'dashboard', route: 'app.dashboard',
icon: mdiMonitor, icon: mdiMonitor,
label: 'Dashboard', label: 'Dashboard',
}, },

View File

@ -31,10 +31,8 @@ Route.get('health', async ({ response }) => {
return report.healthy ? response.ok(report) : response.badRequest(report); return report.healthy ? response.ok(report) : response.badRequest(report);
}); });
Route.get('/', async ({ view }) => {
return view.render('welcome');
}).as('dashboard2');
//oai:
// Route.get( '/oai', 'Oai/RequestController.index').as('oai'); // Route.get( '/oai', 'Oai/RequestController.index').as('oai');
Route.group(() => { Route.group(() => {
Route.get('/oai', 'Oai/OaiController.index').as('get'); Route.get('/oai', 'Oai/OaiController.index').as('get');
@ -42,7 +40,20 @@ Route.group(() => {
}).as('oai'); }).as('oai');
// Route.inertia('/about', 'App'); // Route.inertia('/about', 'App');
//old solution:
// Route.get('/', async ({ view }) => {
// return view.render('welcome');
// }).as('dashboard2');
Route.get('/', async ({ response }) => {
return response.redirect().toRoute('app.dashboard');
}).as('dashboard');
Route.group(() => { Route.group(() => {
Route.get('/dashboard', async ({ inertia }) => {
return inertia.render('Dashboard');
}).as('dashboard');
Route.get('/', async ({ inertia }) => { Route.get('/', async ({ inertia }) => {
const users = await User.query().orderBy('login'); const users = await User.query().orderBy('login');
return inertia.render('App', { return inertia.render('App', {
@ -71,12 +82,7 @@ Route.group(() => {
}).as('register.store'); }).as('register.store');
}) })
.prefix('app') .prefix('app')
.as('app'); .as('app')
Route.get('/dashboard', async ({ inertia }) => {
return inertia.render('Dashboard');
})
.as('dashboard')
.middleware('auth'); .middleware('auth');
Route.get('/map', async ({ inertia }) => { Route.get('/map', async ({ inertia }) => {
@ -134,8 +140,8 @@ Route.group(() => {
// .middleware(['auth', 'can:dataset-list,dataset-publish']); // .middleware(['auth', 'can:dataset-list,dataset-publish']);
.middleware(['auth', 'is:administrator,moderator']); .middleware(['auth', 'is:administrator,moderator']);
Route.get('/edit-account-info', 'UsersController.accountInfo') Route.get('/settings/user', 'UsersController.accountInfo')
.as('admin.account.info') .as('settings.user')
.namespace('App/Controllers/Http/Admin') .namespace('App/Controllers/Http/Admin')
.middleware(['auth']); .middleware(['auth']);