- add methods for releasing datasets from submitter

- npm updates
- side menu with child items
- flash messages via HttpContext response (extended via macro)
This commit is contained in:
Kaimbacher 2023-06-27 18:23:18 +02:00
parent e0ff71b117
commit f403c3109f
37 changed files with 1020 additions and 482 deletions

View file

@ -31,7 +31,7 @@ const hasColor = computed(() => props.item && props.item.color);
const isDropdownActive = ref(false);
const componentClass = computed(() => [
props.isDropdownList ? 'py-3 px-6 text-sm' : 'py-3 px-6',
props.isDropdownList ? 'py-3 px-6 text-sm font-semibold' : 'py-3 px-6',
hasColor.value ? getButtonColor(props.item.color, false, true) : styleService.asideMenuItemStyle,
]);
@ -76,18 +76,19 @@ const is = computed(() => {
<!-- <component :is="itemHref ? 'div' : Link" :href="itemHref ? itemHref : itemRoute" -->
<component :is="is" :href="itemRoute ? stardust.route(props.item.route) : props.item.href"
class="flex cursor-pointer dark:text-slate-300 dark:hover:text-white" :class="componentClass"
@click="menuClick" v-bind:target="props.item.target ?? null">
@click.prevent="menuClick" v-bind:target="props.item.target ?? null">
<BaseIcon v-if="item.icon" :path="item.icon" class="flex-none" :class="activeInactiveStyle" w="w-16"
:size="18" />
<span class="grow text-ellipsis line-clamp-1" :class="activeInactiveStyle">
{{ item.label }}
</span>
<!-- <BaseIcon v-if="hasDropdown" :path="isDropdownActive ? mdiMinus : mdiPlus" class="flex-none"
:class="activeInactiveStyle" w="w-12" /> -->
<!-- plus icon for expanding sub menu -->
<BaseIcon v-if="hasDropdown" :path="isDropdownActive ? mdiMinus : mdiPlus" class="flex-none"
:class="activeInactiveStyle" w="w-12" @click.prevent="menuClick"/>
</component>
<!-- <AsideMenuList v-if="hasDropdown" :menu="item.children" :class="[
<AsideMenuList v-if="hasDropdown" :menu="item.children" :class="[
styleService.asideMenuDropdownStyle,
isDropdownActive ? 'block dark:bg-slate-800/50' : 'hidden',
]" is-dropdown-list /> -->
]" is-dropdown-list />
</li>
</template>

View file

@ -55,7 +55,7 @@ const menuClick = (event, item) => {
</div>
<div :class="styleStore.darkMode ? 'aside-scrollbars-[slate]' : styleStore.asideScrollbarsStyle"
class="flex-1 overflow-y-auto overflow-x-hidden">
<AsideMenuList v-bind:menu="menu" @menu-click="menuClick" />
<AsideMenuList v-bind:menu="menu" @menu-click="menuClick" />
</div>
<!-- <p class="menu-label">About</p>> -->
<ul class="menu-list">

View file

@ -1,4 +1,4 @@
<script setup>
<script setup lang="ts">
import AsideMenuItem from '@/Components/AsideMenuItem.vue';
defineProps({
@ -22,7 +22,7 @@ const menuClick = (event, item) => {
v-for="(item, index) in menu"
:key="index"
v-bind:item="item"
:is-dropdown-list="isDropdownList"
:is-dropdown-list="item.children?.length > 0"
@menu-click="menuClick"
/>
</ul>

View file

@ -1,54 +1,50 @@
export const chartColors = {
default: {
primary: '#00D1B2',
info: '#209CEE',
danger: '#FF3860'
}
}
default: {
primary: '#00D1B2',
info: '#209CEE',
danger: '#FF3860',
},
};
const randomChartData = n => {
const data = []
const randomChartData = (n) => {
const data = [];
for (let i = 0; i < n; i++) {
data.push(Math.round(Math.random() * 200))
}
for (let i = 0; i < n; i++) {
data.push(Math.round(Math.random() * 200));
}
return data
}
return data;
};
const datasetObject = (color, points) => {
return {
fill: false,
borderColor: chartColors.default[color],
borderWidth: 2,
borderDash: [],
borderDashOffset: 0.0,
pointBackgroundColor: chartColors.default[color],
pointBorderColor: 'rgba(255,255,255,0)',
pointHoverBackgroundColor: chartColors.default[color],
pointBorderWidth: 20,
pointHoverRadius: 4,
pointHoverBorderWidth: 15,
pointRadius: 4,
data: randomChartData(points),
tension: 0.5,
cubicInterpolationMode: 'default'
}
}
return {
fill: false,
borderColor: chartColors.default[color],
borderWidth: 2,
borderDash: [],
borderDashOffset: 0.0,
pointBackgroundColor: chartColors.default[color],
pointBorderColor: 'rgba(255,255,255,0)',
pointHoverBackgroundColor: chartColors.default[color],
pointBorderWidth: 20,
pointHoverRadius: 4,
pointHoverBorderWidth: 15,
pointRadius: 4,
data: randomChartData(points),
tension: 0.5,
cubicInterpolationMode: 'default',
};
};
export const sampleChartData = (points = 9) => {
const labels = []
const labels = [];
for (let i = 1; i <= points; i++) {
labels.push(`0${i}`)
}
for (let i = 1; i <= points; i++) {
labels.push(`0${i}`);
}
return {
labels,
datasets: [
datasetObject('primary', points),
datasetObject('info', points),
datasetObject('danger', points)
]
}
}
return {
labels,
datasets: [datasetObject('primary', points), datasetObject('info', points), datasetObject('danger', points)],
};
};

View file

@ -3,7 +3,6 @@ import { EventEmitter } from './EventEmitter';
import type { Map } from 'leaflet/src/map/index';
export abstract class Control<T> extends EventEmitter<T> {
// @section
// @aka Control options
options = {
@ -16,8 +15,8 @@ export abstract class Control<T> extends EventEmitter<T> {
// super();
// if (!(this instanceof Control)) {
// throw new TypeError("Control constructor cannot be called as a function.");
// }
// // properties
// }
// // properties
// // util.setOptions(this, defaults);
// }
@ -30,23 +29,22 @@ export abstract class Control<T> extends EventEmitter<T> {
}
abstract onRemove(map): void;
abstract onAdd(map: any) : HTMLElement;
abstract onAdd(map: any): HTMLElement;
addTo(map: Map): Control<T> {
this._map = map;
let container = this._container = this.onAdd(map);
let pos = this.getPosition();//"topright"
let container = (this._container = this.onAdd(map));
let pos = this.getPosition(); //"topright"
let corner = map.controlCorners[pos];
if (container) {
// $(container).addClass('gba-control');
container.classList.add("gba-control");
container.classList.add('gba-control');
if (pos.indexOf('bottom') !== -1) {
corner.insertBefore(container, corner.firstChild);
}
else {
} else {
corner.appendChild(container);
}
}
@ -65,6 +63,4 @@ export abstract class Control<T> extends EventEmitter<T> {
}
return this;
}
}

View file

@ -10,5 +10,4 @@ export interface LayerOptions {
// export type LayerMap = Map<string, LayerOptions>;
export class LayerMap extends Map<string, LayerOptions> {
}
export class LayerMap extends Map<string, LayerOptions> {}

View file

@ -1,12 +1,12 @@
// extend an object with properties of one or more other objects
export function extend(dest) {
var i, j, len, src;
var i, j, len, src;
for (j = 1, len = arguments.length; j < len; j++) {
src = arguments[j];
for (i in src) {
dest[i] = src[i];
}
}
return dest;
}
for (j = 1, len = arguments.length; j < len; j++) {
src = arguments[j];
for (i in src) {
dest[i] = src[i];
}
}
return dest;
}

View file

@ -32,9 +32,9 @@ const items = computed({
// setter
set(value) {
// Note: we are using destructuring assignment syntax here.
props.persons.length = 0;
props.persons.push(...value);
props.persons.length = 0;
props.persons.push(...value);
},
});
@ -51,9 +51,9 @@ const itemsPaginated = computed({
// setter
set(value) {
// Note: we are using destructuring assignment syntax here.
props.persons.length = 0;
props.persons.push(...value);
props.persons.length = 0;
props.persons.push(...value);
},
});
@ -118,13 +118,13 @@ const removeAuthor = (key) => {
<thead>
<tr>
<!-- <th v-if="checkable" /> -->
<th scope="col">ID</th>
<th scope="col">Sort</th>
<th class="hidden lg:table-cell"></th>
<th>Name</th>
<th>Email</th>
<!-- <th>Name Type</th> -->
<!-- <th>Progress</th> -->
<th>Created</th>
<!-- <th>Created</th> -->
<th />
</tr>
</thead>
@ -155,9 +155,6 @@ const removeAuthor = (key) => {
{{ client.progress }}
</progress>
</td> -->
<td data-label="Created" class="lg:w-1 whitespace-nowrap">
<small class="text-gray-500 dark:text-slate-400" :title="element.created_at">{{ element.created_at }}</small>
</td>
<td class="before:hidden lg:w-1 whitespace-nowrap">
<BaseButtons type="justify-start lg:justify-end" no-wrap>
<!-- <BaseButton color="info" :icon="mdiEye" small @click="isModalActive = true" /> -->