submit on enter

This commit is contained in:
hay-kot 2021-03-27 12:55:46 -08:00
commit 4795281938
6 changed files with 144 additions and 129 deletions

View file

@ -24,7 +24,7 @@
v-bind="attrs" v-bind="attrs"
v-on="on" v-on="on"
> >
{{ $t('user.create-group') }} {{ $t("user.create-group") }}
</v-btn> </v-btn>
</template> </template>
<v-card> <v-card>
@ -34,31 +34,30 @@
</v-icon> </v-icon>
<v-toolbar-title class="headline"> <v-toolbar-title class="headline">
{{ $t('user.create-group') }} {{ $t("user.create-group") }}
</v-toolbar-title> </v-toolbar-title>
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-app-bar> </v-app-bar>
<v-form ref="newGroup" @submit="createGroup">
<v-card-text> <v-card-text>
<v-form ref="newGroup">
<v-text-field <v-text-field
v-model="newGroupName" v-model="newGroupName"
:label="$t('user.group-name')" :label="$t('user.group-name')"
:rules="[existsRule]" :rules="[existsRule]"
></v-text-field> ></v-text-field>
</v-form> </v-card-text>
</v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn color="grey" text @click="groupDialog = false"> <v-btn color="grey" text @click="groupDialog = false">
{{ $t('general.cancel') }} {{ $t("general.cancel") }}
</v-btn> </v-btn>
<v-btn color="primary" @click="createGroup"> <v-btn color="primary" type="submit" @click.prevent="createGroup">
{{ $t('general.create') }} {{ $t("general.create") }}
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-form>
</v-card> </v-card>
</v-dialog> </v-dialog>
</v-card-actions> </v-card-actions>

View file

@ -3,7 +3,11 @@
<Confirmation <Confirmation
ref="deleteUserDialog" ref="deleteUserDialog"
:title="$t('user.confirm-link-deletion')" :title="$t('user.confirm-link-deletion')"
:message="$t('user.are-you-sure-you-want-to-delete-the-link', {link: activeName })" :message="
$t('user.are-you-sure-you-want-to-delete-the-link', {
link: activeName,
})
"
icon="mdi-alert" icon="mdi-alert"
@confirm="deleteUser" @confirm="deleteUser"
:width="450" :width="450"
@ -14,14 +18,14 @@
mdi-link-variant mdi-link-variant
</v-icon> </v-icon>
<v-toolbar-title class="headine"> <v-toolbar-title class="headine">
{{ $t('user.sign-up-links') }} {{ $t("user.sign-up-links") }}
</v-toolbar-title> </v-toolbar-title>
<v-spacer> </v-spacer> <v-spacer> </v-spacer>
<v-dialog v-model="dialog" max-width="600px"> <v-dialog v-model="dialog" max-width="600px">
<template v-slot:activator="{ on, attrs }"> <template v-slot:activator="{ on, attrs }">
<v-btn small color="success" dark v-bind="attrs" v-on="on"> <v-btn small color="success" dark v-bind="attrs" v-on="on">
{{ $t('user.create-link') }} {{ $t("user.create-link") }}
</v-btn> </v-btn>
</template> </template>
<v-card> <v-card>
@ -31,14 +35,13 @@
</v-icon> </v-icon>
<v-toolbar-title class="headline"> <v-toolbar-title class="headline">
{{ $t('user.create-link') }} {{ $t("user.create-link") }}
</v-toolbar-title> </v-toolbar-title>
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-app-bar> </v-app-bar>
<v-form ref="newUser" @submit="save">
<v-card-text> <v-card-text>
<v-form ref="newUser">
<v-row class="justify-center mt-3"> <v-row class="justify-center mt-3">
<v-text-field <v-text-field
class="mr-2" class="mr-2"
@ -52,18 +55,18 @@
:label="$t('user.admin')" :label="$t('user.admin')"
></v-checkbox> ></v-checkbox>
</v-row> </v-row>
</v-form> </v-card-text>
</v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn color="grey" text @click="close"> <v-btn color="grey" text @click="close">
{{ $t('general.cancel') }} {{ $t("general.cancel") }}
</v-btn> </v-btn>
<v-btn color="primary" @click="save"> <v-btn color="primary" type="submit" @click.prevent="save">
{{ $t('general.save') }} {{ $t("general.save") }}
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-form>
</v-card> </v-card>
</v-dialog> </v-dialog>
</v-toolbar> </v-toolbar>
@ -90,7 +93,7 @@
<v-icon small left> <v-icon small left>
mdi-account-cog mdi-account-cog
</v-icon> </v-icon>
{{ item.admin ? $t('general.yes') : $t('general.no') }} {{ item.admin ? $t("general.yes") : $t("general.no") }}
</v-btn> </v-btn>
</template> </template>
<template v-slot:item.actions="{ item }"> <template v-slot:item.actions="{ item }">
@ -98,7 +101,7 @@
<v-icon small left> <v-icon small left>
mdi-delete mdi-delete
</v-icon> </v-icon>
{{ $t('general.delete') }} {{ $t("general.delete") }}
</v-btn> </v-btn>
</template> </template>
</v-data-table> </v-data-table>
@ -120,14 +123,14 @@ export default {
activeName: null, activeName: null,
headers: [ headers: [
{ {
text: this.$t('user.link-id'), text: this.$t("user.link-id"),
align: "start", align: "start",
sortable: false, sortable: false,
value: "id", value: "id",
}, },
{ text: this.$t('general.name'), value: "name" }, { text: this.$t("general.name"), value: "name" },
{ text: this.$t('general.token'), value: "token" }, { text: this.$t("general.token"), value: "token" },
{ text: this.$t('user.admin'), value: "admin", align: "center" }, { text: this.$t("user.admin"), value: "admin", align: "center" },
{ text: "", value: "actions", sortable: false, align: "center" }, { text: "", value: "actions", sortable: false, align: "center" },
], ],
links: [], links: [],
@ -144,7 +147,7 @@ export default {
admin: false, admin: false,
id: 0, id: 0,
}, },
} };
}, },
computed: { computed: {

View file

@ -3,7 +3,12 @@
<Confirmation <Confirmation
ref="deleteUserDialog" ref="deleteUserDialog"
:title="$t('user.confirm-user-deletion')" :title="$t('user.confirm-user-deletion')"
:message="$t('user.are-you-sure-you-want-to-delete-the-user', { activeName, activeId })" :message="
$t('user.are-you-sure-you-want-to-delete-the-user', {
activeName,
activeId,
})
"
icon="mdi-alert" icon="mdi-alert"
@confirm="deleteUser" @confirm="deleteUser"
:width="450" :width="450"
@ -25,7 +30,7 @@
<v-dialog v-model="dialog" max-width="600px"> <v-dialog v-model="dialog" max-width="600px">
<template v-slot:activator="{ on, attrs }"> <template v-slot:activator="{ on, attrs }">
<v-btn small color="success" dark v-bind="attrs" v-on="on"> <v-btn small color="success" dark v-bind="attrs" v-on="on">
{{$t('user.create-user')}} {{ $t("user.create-user") }}
</v-btn> </v-btn>
</template> </template>
<v-card> <v-card>
@ -40,12 +45,11 @@
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-toolbar-title class="headline"> <v-toolbar-title class="headline">
{{$t('user.user-id-with-value', {id: editedItem.id }) }} {{ $t("user.user-id-with-value", { id: editedItem.id }) }}
</v-toolbar-title> </v-toolbar-title>
</v-app-bar> </v-app-bar>
<v-form ref="newUser" @submit="save">
<v-card-text> <v-card-text>
<v-form ref="newUser">
<v-row> <v-row>
<v-col cols="12" sm="12" md="6"> <v-col cols="12" sm="12" md="6">
<v-text-field <v-text-field
@ -80,21 +84,24 @@
></v-text-field> ></v-text-field>
</v-col> </v-col>
<v-col cols="12" sm="12" md="3"> <v-col cols="12" sm="12" md="3">
<v-switch v-model="editedItem.admin" :label="$t('user.admin')"></v-switch> <v-switch
v-model="editedItem.admin"
:label="$t('user.admin')"
></v-switch>
</v-col> </v-col>
</v-row> </v-row>
</v-form> </v-card-text>
</v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn color="grey" text @click="close"> <v-btn color="grey" text @click="close">
{{$t('general.cancel')}} {{ $t("general.cancel") }}
</v-btn> </v-btn>
<v-btn color="primary" @click="save"> <v-btn color="primary" type="submit" @click.prevent="save">
{{$t('general.save')}} {{ $t("general.save") }}
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-form>
</v-card> </v-card>
</v-dialog> </v-dialog>
</v-toolbar> </v-toolbar>
@ -111,13 +118,13 @@
<v-icon small left> <v-icon small left>
mdi-delete mdi-delete
</v-icon> </v-icon>
{{$t('general.delete')}} {{ $t("general.delete") }}
</v-btn> </v-btn>
<v-btn small color="success" @click="editItem(item)"> <v-btn small color="success" @click="editItem(item)">
<v-icon small left class="mr-2"> <v-icon small left class="mr-2">
mdi-pencil mdi-pencil
</v-icon> </v-icon>
{{$t('general.edit')}} {{ $t("general.edit") }}
</v-btn> </v-btn>
</template> </template>
<template v-slot:item.admin="{ item }"> <template v-slot:item.admin="{ item }">
@ -125,7 +132,7 @@
</template> </template>
<template v-slot:no-data> <template v-slot:no-data>
<v-btn color="primary" @click="initialize"> <v-btn color="primary" @click="initialize">
{{$t('general.reset')}} {{ $t("general.reset") }}
</v-btn> </v-btn>
</template> </template>
</v-data-table> </v-data-table>
@ -153,10 +160,10 @@ export default {
sortable: false, sortable: false,
value: "id", value: "id",
}, },
{ text: this.$t('user.full-name'), value: "fullName" }, { text: this.$t("user.full-name"), value: "fullName" },
{ text: this.$t('user.email'), value: "email" }, { text: this.$t("user.email"), value: "email" },
{ text: this.$t('user.group'), value: "group" }, { text: this.$t("user.group"), value: "group" },
{ text: this.$t('user.admin'), value: "admin" }, { text: this.$t("user.admin"), value: "admin" },
{ text: "", value: "actions", sortable: false, align: "center" }, { text: "", value: "actions", sortable: false, align: "center" },
], ],
users: [], users: [],
@ -177,12 +184,14 @@ export default {
group: "", group: "",
admin: false, admin: false,
}, },
} };
}, },
computed: { computed: {
formTitle() { formTitle() {
return this.editedIndex === -1 ? this.$t('user.new-user') : this.$t('user.edit-user'); return this.editedIndex === -1
? this.$t("user.new-user")
: this.$t("user.edit-user");
}, },
showPassword() { showPassword() {
return this.editedIndex === -1 ? true : false; return this.editedIndex === -1 ? true : false;

View file

@ -17,22 +17,24 @@
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-app-bar> </v-app-bar>
<v-card-title> </v-card-title> <v-card-title> </v-card-title>
<v-card-text> <v-form @submit="select">
<v-text-field <v-card-text>
:label="$t('settings.theme.theme-name')" <v-text-field
v-model="themeName" :label="$t('settings.theme.theme-name')"
:rules="[rules.required]" v-model="themeName"
></v-text-field> :rules="[rules.required]"
</v-card-text> ></v-text-field>
<v-card-actions> </v-card-text>
<v-spacer></v-spacer> <v-card-actions>
<v-btn color="grey" text @click="dialog = false"> <v-spacer></v-spacer>
{{ $t("general.cancel") }} <v-btn color="grey" text @click="dialog = false">
</v-btn> {{ $t("general.cancel") }}
<v-btn color="success" text @click="Select" :disabled="!themeName"> </v-btn>
{{ $t("general.create") }} <v-btn color="success" text type="submit" @click.prevent="select" :disabled="!themeName">
</v-btn> {{ $t("general.create") }}
</v-card-actions> </v-btn>
</v-card-actions>
</v-form>
</v-card> </v-card>
</v-dialog> </v-dialog>
</div> </div>
@ -64,7 +66,7 @@ export default {
randomColor() { randomColor() {
return "#" + Math.floor(Math.random() * 16777215).toString(16); return "#" + Math.floor(Math.random() * 16777215).toString(16);
}, },
Select() { select() {
const newTheme = { const newTheme = {
name: this.themeName, name: this.themeName,
colors: { colors: {

View file

@ -13,11 +13,12 @@
class="mr-2" class="mr-2"
> >
</v-progress-circular> </v-progress-circular>
<v-toolbar-title class="headline">{{$t('user.login')}}</v-toolbar-title> <v-toolbar-title class="headline">{{ $t("user.login") }}</v-toolbar-title>
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-app-bar> </v-app-bar>
<v-card-text>
<v-form> <v-form @submit="login">
<v-card-text>
<v-text-field <v-text-field
v-if="!options.isLoggingIn" v-if="!options.isLoggingIn"
v-model="user.name" v-model="user.name"
@ -43,22 +44,24 @@
:append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'" :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showPassword = !showPassword" @click:append="showPassword = !showPassword"
></v-text-field> ></v-text-field>
</v-form> <v-card-actions>
<v-card-actions> <v-btn
<v-btn v-if="options.isLoggingIn"
v-if="options.isLoggingIn" @click.prevent="login"
@click.prevent="login" dark
dark color="primary"
color="primary" block="block"
block="block" type="submit"
type="submit" >{{ $t("user.sign-in") }}
>{{ $t("user.sign-in") }}</v-btn </v-btn
> >
</v-card-actions> </v-card-actions>
<v-alert v-if="error" outlined class="mt-3 mb-0" type="error">
{{$t('user.could-not-validate-credentials')}} <v-alert v-if="error" outlined class="mt-3 mb-0" type="error">
</v-alert> {{ $t("user.could-not-validate-credentials") }}
</v-card-text> </v-alert>
</v-card-text>
</v-form>
</v-card> </v-card>
</template> </template>

View file

@ -21,9 +21,8 @@
<v-spacer></v-spacer> <v-spacer></v-spacer>
</v-app-bar> </v-app-bar>
<v-form ref="urlForm" @submit="createRecipe">
<v-card-text> <v-card-text>
<v-form ref="urlForm">
<v-text-field <v-text-field
v-model="recipeURL" v-model="recipeURL"
:label="$t('new-recipe.recipe-url')" :label="$t('new-recipe.recipe-url')"
@ -35,29 +34,29 @@
:hint="$t('new-recipe.url-form-hint')" :hint="$t('new-recipe.url-form-hint')"
persistent-hint persistent-hint
></v-text-field> ></v-text-field>
</v-form>
<v-alert v-if="error" color="red" outlined type="success"> <v-alert v-if="error" color="red" outlined type="success">
{{ $t("new-recipe.error-message") }} {{ $t("new-recipe.error-message") }}
</v-alert> </v-alert>
</v-card-text> </v-card-text>
<v-divider></v-divider> <v-divider></v-divider>
<v-card-actions> <v-card-actions>
<v-spacer></v-spacer> <v-spacer></v-spacer>
<v-btn color="grey" text @click="reset"> <v-btn color="grey" text @click="reset">
{{ $t("general.close") }} {{ $t("general.close") }}
</v-btn> </v-btn>
<v-btn <v-btn
color="success" color="success"
text text
@click="createRecipe" @click.prevent="createRecipe"
:loading="processing" :loading="processing"
> >
{{ $t("general.submit") }} {{ $t("general.submit") }}
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-form>
</v-card> </v-card>
</v-dialog> </v-dialog>
<v-speed-dial v-model="fab" fixed right bottom open-on-hover> <v-speed-dial v-model="fab" fixed right bottom open-on-hover>