jacob1123/budgeteer
1
1
Fork 0
Code Issues 12 Pull Requests 1 Packages Releases 1 Wiki Activity

Try to use tailwind

Browse Source
This commit is contained in:
Jan Bader
2022-02-04 16:34:16 +00:00
parent f7dfc7b455
commit d825379a01
9 changed files with 78 additions and 136 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/pages/Dashboard.vue
View File

@ -10,13 +10,13 @@ export default defineComponent({
<template>
<h1>Budgets</h1>
<v-container>
<v-card v-for="budget in $store.getters.Budgets" class="budget-item">
<v-card-title class="text-h5 grey lighten-2">
<div>
<div v-for="budget in $store.getters.Budgets" class="budget-item">
<div class="text-h5 grey lighten-2">
<router-link v-bind:to="'/budget/'+budget.ID">{{budget.Name}}{{budget.ID == budgetid ? " *" : ""}}</router-link>
</v-card-title>
</div>
<v-card-text><span class="time"></span></v-card-text>
</v-card>
</div>
<NewBudget />
</v-container>
</div>
</template>

16
web/src/pages/Index.vue
View File

@ -7,12 +7,12 @@ export default defineComponent({
</script>
<template>
<v-container>
<div class="container col-md-8 col-ld-8" id="content">
Willkommen bei Budgeteer, der neuen App für's Budget!
</div>
<div class="container col-md-4" id="login">
<a href="/login">Login</a> or <a href="/login">register</a>
</div>
</v-container>
<div>
<div class="font-bold" id="content">
Willkommen bei Budgeteer, der neuen App für's Budget!
</div>
<div class="container col-md-4" id="login">
<router-link to="/login">Login</router-link> or <router-link to="/login">register</router-link>
</div>
</div>
</template>

33
web/src/pages/Login.vue
View File

@ -6,7 +6,7 @@ import { defineComponent } from "vue";
export default defineComponent({
data() {
return {
error: [],
error: "",
login: {
user: "",
password: ""
@ -18,14 +18,14 @@ export default defineComponent({
this.$store.commit(TITLE, "Login");
},
methods: {
formSubmit(e) {
formSubmit(e : MouseEvent) {
e.preventDefault();
this.$store.dispatch(LOGIN, this.$data.login)
.then(x => {
this.$data.error = "";
this.$router.replace("/dashboard");
})
.catch(x => this.$data.error = ["The entered credentials are invalid!"]);
.catch(x => this.$data.error = "The entered credentials are invalid!");
// TODO display invalidCredentials
// TODO redirect to dashboard on success
@ -35,29 +35,14 @@ export default defineComponent({
</script>
<template>
<v-container>
<v-row>
<v-col cols="12">
<v-text-field v-model="login.user" type="text" label="Username" />
</v-col>
<v-col cols="12">
<v-text-field
v-model="login.password"
label="Password"
:append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
:type="showPassword ? 'text' : 'password'"
@click:append="showPassword = showPassword"
:error-message="error"
error-count="2"
error
/>
</v-col>
</v-row>
<div class="form-group">{{ error }}</div>
<v-btn type="submit" @click="formSubmit">Login</v-btn>
<div>
<input type="text" v-model="login.user" label="Username" />
<input type="password" v-model="login.password" label="Password" />
</div>
<div>{{ error }}</div>
<button type="submit" @click="formSubmit">Login</button>
<p>
New user?
<router-link to="/register">Register</router-link>instead!
</p>
</v-container>
</template>