[Vue3] Fixed some eslint warnings on template part of vue files
This commit is contained in:
parent
6be07b1001
commit
152b86fb4f
|
@ -5,13 +5,13 @@
|
|||
:label="label"
|
||||
:value="getDateTime()"
|
||||
:placeholder="placeholder"
|
||||
v-on:input="dateTimeChanged"
|
||||
@input="dateTimeChanged"
|
||||
:rules="customRules"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer" v-if="type == 'date' || type == 'datetime'">
|
||||
<q-popup-proxy ref="qDateProxy" transition-show="scale" transition-hide="scale">
|
||||
<q-date :value="getDate()" mask="YYYY-MM-DD" v-on:input="dateChanged">
|
||||
<q-date :value="getDate()" mask="YYYY-MM-DD" @input="dateChanged">
|
||||
<div class="row items-center justify-end">
|
||||
<q-btn v-close-popup label="Schließen" color="primary" flat />
|
||||
</div>
|
||||
|
@ -24,7 +24,7 @@
|
|||
v-if="type == 'time' || type == 'datetime'"
|
||||
>
|
||||
<q-popup-proxy ref="qTimeProxy" transition-show="scale" transition-hide="scale">
|
||||
<q-time :value="getTime()" mask="HH:mm" v-on:input="timeChanged">
|
||||
<q-time :value="getTime()" mask="HH:mm" @input="timeChanged">
|
||||
<div class="row items-center justify-end">
|
||||
<q-btn v-close-popup label="Schließen" color="primary" flat />
|
||||
</div>
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
class="fit row justify-around items-start q-col-gutter-sm"
|
||||
>
|
||||
<div v-for="(item, index) in widgets" :key="index" class="col-4 full-height col-sm-6 col-xs-12">
|
||||
<component v-bind:is="item" />
|
||||
<component :is="item" />
|
||||
</div>
|
||||
</q-page>
|
||||
</template>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<q-card>
|
||||
<BalanceHeader
|
||||
@update:user="userUpdated"
|
||||
:showSelector="showSelector"
|
||||
:show-selector="showSelector"
|
||||
@open-history="openHistory"
|
||||
/>
|
||||
<q-separator />
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<q-card>
|
||||
<BalanceHeader
|
||||
@update:user="senderUpdated"
|
||||
:showSelector="showSelector"
|
||||
:show-selector="showSelector"
|
||||
@open-history="openHistory"
|
||||
/>
|
||||
<q-separator />
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<q-card flat square>
|
||||
<q-card-section class="row items-center justify-between" horizontal>
|
||||
<div class="col-5 text-left q-px-sm">
|
||||
<div v-bind:class="{ 'text-negative': isNegative() }" class="text-weight-bold text-h6">
|
||||
<div
|
||||
:class="{ 'text-negative': isNegative() }"
|
||||
class="text-weight-bold text-h6"
|
||||
>
|
||||
<span v-if="isNegative()">-</span>{{ transaction.amount.toFixed(2) }} €
|
||||
</div>
|
||||
<div class="text-caption">{{ text }}</div>
|
||||
<div class="text-caption">{{ timeStr }}</div>
|
||||
</div>
|
||||
<div class="col-5 q-px-sm text-center">
|
||||
<div class="text-subtitle1" v-if="isReversed">Storniert</div>
|
||||
</div>
|
||||
|
|
|
@ -32,9 +32,9 @@
|
|||
</q-item>
|
||||
</q-list>
|
||||
<q-list v-if="show">
|
||||
<div v-for="(transaction, index) in transactions" v-bind:key="index" class="col-sm-12">
|
||||
<div v-for="(transaction, index) in transactions" :key="index" class="col-sm-12">
|
||||
<!-- TODO: In Vue3 use v-model:transaction="..." -->
|
||||
<Transaction :transaction.sync="transactions[index]" />
|
||||
<Transaction v-model:transaction="transactions[index]" />
|
||||
</div>
|
||||
</q-list>
|
||||
</q-drawer>
|
||||
|
|
|
@ -12,16 +12,16 @@
|
|||
:data="data"
|
||||
:columns="columns"
|
||||
row-key="id"
|
||||
:pagination.sync="pagination"
|
||||
v-model:pagination="pagination"
|
||||
:loading="loading"
|
||||
@request="onRequest"
|
||||
binary-state-sort
|
||||
>
|
||||
<template v-slot:top>
|
||||
<template #top>
|
||||
<q-toggle v-model="showCancelled" label="Stornierte einblenden" />
|
||||
</template>
|
||||
<template v-slot:body-cell="props">
|
||||
<q-td :props="props" v-bind:class="{ 'bg-grey': props.row.reversal_id != null }">
|
||||
<template #body-cell="props">
|
||||
<q-td :props="props" :class="{ 'bg-grey': props.row.reversal_id != null }">
|
||||
{{ props.value }}
|
||||
</q-td>
|
||||
</template>
|
||||
|
|
|
@ -40,11 +40,11 @@
|
|||
<q-btn color="primary" label="Schicht hinzufügen" @click="addJob()" />
|
||||
</q-card-section>
|
||||
|
||||
<q-card-section v-for="(job, index) in event.jobs" v-bind:key="index">
|
||||
<q-card-section v-for="(job, index) in event.jobs" :key="index">
|
||||
<q-card class="q-my-auto">
|
||||
<job
|
||||
:job="job"
|
||||
:jobCanDelete="jobDeleteDisabled"
|
||||
:job-can-delete="jobDeleteDisabled"
|
||||
@set-start="setStart"
|
||||
@set-required="setRequired"
|
||||
@set-end="setEnd"
|
||||
|
|
|
@ -19,13 +19,13 @@
|
|||
<q-card>
|
||||
<q-card-section>
|
||||
<q-table title="Veranstaltungstypen" :data="rows" row-key="jobid" :columns="columns">
|
||||
<template v-slot:top-right>
|
||||
<template #top-right>
|
||||
<q-input dense v-model="newEventType" placeholder="Neuer Typ" />
|
||||
|
||||
<div></div>
|
||||
<q-btn color="primary" icon="mdi-plus" label="Hinzufügen" @click="addType" />
|
||||
</template>
|
||||
<template v-slot:body-cell-actions="props">
|
||||
<template #body-cell-actions="props">
|
||||
<!-- <q-btn :label="item"> -->
|
||||
<!-- {{ item.row.name }} -->
|
||||
<q-td :props="props" align="right" :auto-width="true">
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<IsoDateInput
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
:value="job.start"
|
||||
v-on:input="setStart"
|
||||
@input="setStart"
|
||||
label="Beginn"
|
||||
type="datetime"
|
||||
:rules="[noValidDate, notEmpty]"
|
||||
|
@ -13,7 +13,7 @@
|
|||
ref="bla"
|
||||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
:value="job.end"
|
||||
v-on:input="setEnd"
|
||||
@input="setEnd"
|
||||
label="Ende"
|
||||
type="datetime"
|
||||
:rules="[noValidDate, isAfterDate, notEmpty]"
|
||||
|
@ -29,7 +29,7 @@
|
|||
class="col-xs-12 col-sm-6 q-pa-sm"
|
||||
:value="job.type"
|
||||
:options="jobtypes"
|
||||
v-on:input="setJobType"
|
||||
@input="setJobType"
|
||||
option-label="name"
|
||||
option-value="name"
|
||||
map-options
|
||||
|
@ -52,7 +52,7 @@
|
|||
label="Beschreibung"
|
||||
type="textarea"
|
||||
:value="job.comment"
|
||||
v-on:input="setComment"
|
||||
@input="setComment"
|
||||
filled
|
||||
:rules="[notEmpty]"
|
||||
/>
|
||||
|
|
|
@ -19,13 +19,13 @@
|
|||
<q-card>
|
||||
<q-card-section>
|
||||
<q-table title="Diensttypen" :data="rows" row-key="jobid" :columns="columns">
|
||||
<template v-slot:top-right>
|
||||
<template #top-right>
|
||||
<q-input dense v-model="newJob" placeholder="Neuer Typ" />
|
||||
|
||||
<div></div>
|
||||
<q-btn color="primary" icon="mdi-plus" label="Hinzufügen" @click="addType" />
|
||||
</template>
|
||||
<template v-slot:body-cell-actions="props">
|
||||
<template #body-cell-actions="props">
|
||||
<!-- <q-btn :label="item"> -->
|
||||
<!-- {{ item.row.name }} -->
|
||||
<q-td :props="props" align="right" :auto-width="true">
|
||||
|
|
|
@ -50,8 +50,6 @@ import { computed, defineComponent, ref } from 'vue';
|
|||
import Eventtypes from '../components/management/Eventtypes.vue';
|
||||
import JobTypes from '../components/management/JobTypes.vue';
|
||||
import CreateEvent from '../components/management/CreateEvent.vue';
|
||||
import { Store } from 'vuex';
|
||||
import { StateInterface } from 'src/store';
|
||||
import { hasPermission } from 'src/utils/permission';
|
||||
import { PERMISSIONS } from '../permissions';
|
||||
import { Screen } from 'quasar';
|
||||
|
@ -59,10 +57,8 @@ import { Screen } from 'quasar';
|
|||
export default defineComponent({
|
||||
name: 'EventManagement',
|
||||
components: { CreateEvent, Eventtypes, JobTypes },
|
||||
setup(_, { root }) {
|
||||
const store = <Store<StateInterface>>root.$store;
|
||||
|
||||
const canEditRoles = computed(() => hasPermission(PERMISSIONS.ROLES_EDIT, store));
|
||||
setup() {
|
||||
const canEditRoles = computed(() => hasPermission(PERMISSIONS.ROLES_EDIT));
|
||||
|
||||
interface Tab {
|
||||
name: string;
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
filled
|
||||
:label="label"
|
||||
@input="updated"
|
||||
:value="user"
|
||||
:value="modelValue"
|
||||
:options="users"
|
||||
option-label="display_name"
|
||||
option-value="userid"
|
||||
|
@ -12,13 +12,17 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, onBeforeMount } from 'vue';
|
||||
import { computed, defineComponent, Prop, onBeforeMount } from 'vue';
|
||||
import { useStore } from 'vuex';
|
||||
import { UserSessionState } from '../store';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'UserSelector',
|
||||
props: { user: { required: true, type: Object }, label: { type: String, default: 'Benutzer' } },
|
||||
props: {
|
||||
label: { type: String, default: 'Benutzer' },
|
||||
modelValue: { required: true, type: Object } as Prop<FG.User>,
|
||||
},
|
||||
emits: { 'update:modelValue': (user: FG.User) => !!user },
|
||||
setup(_, { emit }) {
|
||||
const store = useStore<UserSessionState>();
|
||||
|
||||
|
@ -30,7 +34,7 @@ export default defineComponent({
|
|||
|
||||
const users = computed(() => store.state.users.users);
|
||||
const updated = (value: FG.User) => {
|
||||
emit('update:user', value);
|
||||
emit('update:modelValue', value);
|
||||
};
|
||||
|
||||
return {
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<span v-if="hasBirthday">Herzlichen Glückwunsch zum Geburtstag!<br /></span>
|
||||
<span v-if="birthday.length > 0"
|
||||
>Heute <span v-if="birthday.length === 1">hat </span><span v-else>haben </span
|
||||
><span v-for="(user, index) in birthday" v-bind:key="index"
|
||||
><span v-for="(user, index) in birthday" :key="index"
|
||||
>{{ user.display_name }}<span v-if="index < birthday.length - 1">, </span></span
|
||||
>
|
||||
Geburtstag.</span
|
||||
|
|
Loading…
Reference in New Issue