[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 /> | ||||
|  |  | |||
|  | @ -3,12 +3,12 @@ | |||
|   <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