Skip to content

Commit

Permalink
frontend: add simple part of vue/vue3-recommended rules
Browse files Browse the repository at this point in the history
Turn off the following rules for now:
"vue/no-deprecated-dollar-scopedslots-api": "off",
"vue/no-deprecated-slot-attribute": "off",
"vue/no-deprecated-slot-scope-attribute": "off",
because i could not get the new syntax to work.

That we are ready for vue3 as soon as the calendar works.
Issue: ecamp#5121
  • Loading branch information
BacLuc committed Jun 2, 2024
1 parent 690f237 commit 8507f39
Show file tree
Hide file tree
Showing 19 changed files with 49 additions and 36 deletions.
13 changes: 13 additions & 0 deletions frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -125,6 +125,7 @@
},
"extends": [
"plugin:vue/recommended",
"plugin:vue/vue3-recommended",
"eslint:recommended",
"plugin:prettier/recommended",
"@vue/eslint-config-prettier"
Expand All @@ -143,6 +144,18 @@
}
],
"vue/multi-word-component-names": "off",
"vue/no-deprecated-destroyed-lifecycle": "off",
"vue/no-deprecated-dollar-listeners-api": "warn",
"vue/no-deprecated-dollar-scopedslots-api": "off",
"vue/no-deprecated-filter": "warn",
"vue/no-deprecated-props-default-this": "warn",
"vue/no-deprecated-slot-attribute": "off",
"vue/no-deprecated-slot-scope-attribute": "off",
"vue/no-deprecated-v-bind-sync": "off",
"vue/no-deprecated-v-on-native-modifier": "warn",
"vue/no-v-for-template-key-on-child": "warn",
"vue/no-v-model-argument": "warn",
"vue/require-explicit-emits": "off",
"no-unused-vars": [
"error",
{
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/activity/DaySwitcher.vue
Original file line number Diff line number Diff line change
Expand Up @@ -109,7 +109,7 @@ export default {
},
methods: {
changeDay(value) {
this.$emit('changeDay', value)
this.$emit('change-day', value)
},
},
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
class="drag-and-drop-handle"
:disabled="isLastSection"
:aria-label="$tc('global.button.move')"
@keydown.down="$emit('moveDown', itemKey)"
@keydown.up="$emit('moveUp', itemKey)"
@keydown.down="$emit('move-down', itemKey)"
@keydown.up="$emit('move-up', itemKey)"
>
<v-icon>mdi-drag</v-icon>
</v-btn>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
class="drag-and-drop-handle"
:disabled="isLastSection"
:aria-label="$tc('global.button.move')"
@keydown.down="$emit('moveDown', itemKey)"
@keydown.up="$emit('moveUp', itemKey)"
@keydown.down="$emit('move-down', itemKey)"
@keydown.up="$emit('move-up', itemKey)"
>
<v-icon>mdi-drag</v-icon>
</v-btn>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@
:item-key="key"
:layout-mode="layoutMode"
@delete="deleteItem"
@moveDown="moveDown"
@moveUp="moveUp"
@move-down="moveDown"
@move-up="moveUp"
/>
<StoryboardRowDense
v-else-if="variant === 'dense'"
Expand All @@ -32,8 +32,8 @@
:item-key="key"
:layout-mode="layoutMode"
@delete="deleteItem"
@moveDown="moveDown"
@moveUp="moveUp"
@move-down="moveDown"
@move-up="moveUp"
/>
</template>
</draggable>
Expand Down
6 changes: 3 additions & 3 deletions frontend/src/components/dialog/DialogBottomSheet.vue
Original file line number Diff line number Diff line change
Expand Up @@ -113,14 +113,14 @@ export default {
methods: {
async doSubmit() {
this.isSaving = true
this.$emit('update:savingOverride', true)
this.$emit('update:saving-override', true)
await this.submitAction()
this.isSaving = false
this.$emit('update:savingOverride', false)
this.$emit('update:saving-override', false)
},
doCancel() {
this.isSaving = false
this.$emit('update:savingOverride', false)
this.$emit('update:saving-override', false)
if (this.cancelAction != null) {
this.cancelAction()
}
Expand Down
6 changes: 3 additions & 3 deletions frontend/src/components/dialog/DialogForm.vue
Original file line number Diff line number Diff line change
Expand Up @@ -111,14 +111,14 @@ export default {
methods: {
async doSubmit() {
this.isSaving = true
this.$emit('update:savingOverride', true)
this.$emit('update:saving-override', true)
await this.submitAction()
this.isSaving = false
this.$emit('update:savingOverride', false)
this.$emit('update:saving-override', false)
},
doCancel() {
this.isSaving = false
this.$emit('update:savingOverride', false)
this.$emit('update:saving-override', false)
if (this.cancelAction != null) {
this.cancelAction()
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
height="30"
:color="color"
:ripple="false"
@click="$emit('selectColor', color)"
@click="$emit('select-color', color)"
v-on="$listeners"
></v-btn>
</template>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/form/base/EColorPicker.vue
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ Displays a field as a color picker (can be used with v-model)
v-for="swatch in swatches"
:key="swatch"
:color="swatch"
@selectColor="picker.onInput"
@select-color="picker.onInput"
/>
</div>
</v-card>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/form/base/EDatePicker.vue
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ Displays a field as a date picker (can be used with v-model)
>
<template #default="picker">
<v-date-picker
:picker-date.sync="pickerMonth"
:value="picker.value || ''"
:locale="$i18n.locale"
first-day-of-week="1"
Expand All @@ -29,7 +30,6 @@ Displays a field as a date picker (can be used with v-model)
no-title
scrollable
show-adjacent-months
:picker-date.sync="pickerMonth"
@input="picker.onInput"
>
<v-spacer />
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/generic/DetailPane.vue
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,9 @@
</DialogBottomSheet>
<DialogForm
v-else
:saving-override.sync="isSaving"
content-class="ec-dialog-form"
eager
:saving-override.sync="isSaving"
:value="value"
v-bind="{ ...$props, ...$attrs }"
v-on="$listeners"
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/navigation/SideBar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@
<v-navigation-drawer
v-if="$vuetify.breakpoint.smAndUp"
v-model="drawer"
:mini-variant.sync="mini"
app
clipped
permanent
:temporary="!mini && !$vuetify.breakpoint.mdAndUp"
:mini-variant.sync="mini"
mini-variant-width="40"
:width="$vuetify.breakpoint.xl || (!mini && !$vuetify.breakpoint.mdAndUp) ? 350 : 256"
:color="!title || mini ? 'blue-grey lighten-4' : null"
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/program/DialogActivityCreate.vue
Original file line number Diff line number Diff line change
Expand Up @@ -313,7 +313,7 @@ export default {
},
onSuccess(activity) {
this.close()
this.$emit('activityCreated', activity)
this.$emit('activity-created', activity)
},
},
}
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/program/DialogActivityEdit.vue
Original file line number Diff line number Diff line change
Expand Up @@ -126,7 +126,7 @@ export default {
},
updatedSuccessful(data) {
this.close()
this.$emit('activityUpdated', data)
this.$emit('activity-updated', data)
},
scheduleEntryRoute,
},
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/program/ScheduleEntries.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
ref="dialogActivityCreate"
:period="period"
:schedule-entry="newScheduleEntry"
@activityCreated="afterCreateActivity($event)"
@activity-created="afterCreateActivity($event)"
/>

<v-btn
Expand Down
12 changes: 6 additions & 6 deletions frontend/src/components/program/picasso/Picasso.vue
Original file line number Diff line number Diff line change
Expand Up @@ -63,8 +63,8 @@ Listing all given activity schedule entries in a calendar view.
<PicassoEntry
:schedule-entry="event"
:editable="editable"
@startResize="startResize(event)"
@finishEdit="reloadScheduleEntries"
@start-resize="startResize(event)"
@finish-edit="reloadScheduleEntries"
/>
</template>
</v-calendar>
Expand Down Expand Up @@ -154,8 +154,8 @@ export default {
// emitted events
emits: [
'newEntry', // triggered once when a new entry was created via drag & drop (parameters: startTimestamp, endTimestamp)
'unlockReminder', // triggered when we think someone is trying to create/move in non-editable mode
'new-entry', // triggered once when a new entry was created via drag & drop (parameters: startTimestamp, endTimestamp)
'unlock-reminder', // triggered when we think someone is trying to create/move in non-editable mode
],
// composition API setup
Expand Down Expand Up @@ -198,11 +198,11 @@ export default {
const createEntry = (startTimestamp, endTimestamp) => {
const start = timestampToUtcString(startTimestamp)
const end = timestampToUtcString(endTimestamp)
emit('newEntry', start, end)
emit('new-entry', start, end)
}
const showReminder = (move) => {
emit('unlockReminder', move)
emit('unlock-reminder', move)
}
const calenderStartTimestamp = computed(() => utcStringToTimestamp(start.value))
Expand Down
8 changes: 4 additions & 4 deletions frontend/src/components/program/picasso/PicassoEntry.vue
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,8 @@
v-if="isEditable"
ref="editDialog"
:schedule-entry="scheduleEntry"
@activityUpdated="$emit('finishEdit')"
@error="$emit('finishEdit')"
@activity-updated="$emit('finish-edit')"
@error="$emit('finish-edit')"
>
<template #activator="{ on }">
<v-btn
Expand Down Expand Up @@ -81,7 +81,7 @@
<div
v-if="!scheduleEntry.tmpEvent"
class="e-picasso-entry__drag-bottom"
@mousedown.stop="$emit('startResize')"
@mousedown.stop="$emit('start-resize')"
/>

<!-- Duration Display -->
Expand Down Expand Up @@ -149,7 +149,7 @@ export default {
editable: { type: Boolean, required: true },
scheduleEntry: { type: Object, required: true },
},
emits: ['startResize', 'finishEdit'],
emits: ['start-resize', 'finish-edit'],
setup(props) {
const { editable, scheduleEntry } = toRefs(props)
const editDialog = ref(null)
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/views/activity/SideBarProgram.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
:camp="camp"
:day-selection="daySelection"
:loading="slotProps.loading"
@changeDay="selectedDay = $event"
@change-day="selectedDay = $event"
/>
<v-divider />
<v-skeleton-loader v-if="slotProps.loading" class="mx-1" type="list-item@6" />
Expand Down
4 changes: 2 additions & 2 deletions frontend/src/views/camp/CampProgram.vue
Original file line number Diff line number Diff line change
Expand Up @@ -110,8 +110,8 @@ Show all activity schedule entries of a single period.
:end="period.end"
:editable="editMode"
:is-filter-set="isFilterSet"
@newEntry="slotProps.on.newEntry"
@unlockReminder="showUnlockReminder"
@new-entry="slotProps.on.newEntry"
@unlock-reminder="showUnlockReminder"
/>
</template>
</ScheduleEntries>
Expand Down

0 comments on commit 8507f39

Please sign in to comment.