Improve Layout of BudgetSettings

This commit is contained in:
Jan Bader 2022-01-28 09:42:25 +00:00
parent b52c4cb787
commit 0334b35041

View File

@ -9,8 +9,8 @@ export default {
}
},
computed: {
hasFiles() {
return this.$data.transactionsFile != null && this.$data.assignmentsFile != null;
filesIncomplete() {
return this.$data.transactionsFile == null || this.$data.assignmentsFile == null;
}
},
mounted() {
@ -49,7 +49,7 @@ export default {
<v-container>
<h1>Danger Zone</h1>
<v-row>
<v-col>
<v-col cols="12" md="6" xl="3">
<v-card>
<v-card-header>
<v-card-header-text>
@ -61,12 +61,12 @@ export default {
</v-card-subtitle>
</v-card-header-text>
</v-card-header>
<v-card-actions>
<v-btn @click="clearBudget">Clear budget</v-btn>
<v-card-actions class="justify-center">
<v-btn @click="clearBudget" color="error">Clear budget</v-btn>
</v-card-actions>
</v-card>
</v-col>
<v-col>
<v-col cols="12" md="6" xl="3">
<v-card>
<v-card-header>
<v-card-header-text>
@ -78,33 +78,33 @@ export default {
</v-card-subtitle>
</v-card-header-text>
</v-card-header>
<v-card-actions>
<v-btn @click="cleanNegative">Fix negative</v-btn>
<v-card-actions class="justify-center">
<v-btn @click="cleanNegative" color="primary">Fix negative</v-btn>
</v-card-actions>
</v-card>
</v-col>
<v-col>
<v-col cols="12" xl="6">
<v-card>
<v-card-header>
<v-card-header-text>
<v-card-title>
Import YNAB Budget
</v-card-title>
<v-card-content>
<label for="transactions_file">
Transaktionen:
<input type="file" @change="gotTransactions" accept="text/*" />
</label>
<br />
<label for="assignments_file">
Budget:
<input type="file" @change="gotAssignments" accept="text/*" />
</label>
</v-card-content>
</v-card-header-text>
</v-card-header>
<v-card-actions>
<button v-if="hasFiles" @click="ynabImport">Importieren</button>
<label for="transactions_file">
Transaktionen:
<input type="file" @change="gotTransactions" accept="text/*" />
</label>
<br />
<label for="assignments_file">
Budget:
<input type="file" @change="gotAssignments" accept="text/*" />
</label>
<v-card-actions class="justify-center">
<v-btn :disabled="filesIncomplete" @click="ynabImport" color="primary">Importieren</v-btn>
</v-card-actions>
</v-card>
</v-col>