mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-10-12 15:35:15 +00:00
Partial implementation of administration aware account auto complete
This commit is contained in:
35
frontend/src/api/v2/autocomplete/accounts.js
vendored
Normal file
35
frontend/src/api/v2/autocomplete/accounts.js
vendored
Normal file
@@ -0,0 +1,35 @@
|
||||
/*
|
||||
* get.js
|
||||
* Copyright (c) 2022 james@firefly-iii.org
|
||||
*
|
||||
* This file is part of Firefly III (https://github.com/firefly-iii).
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import {api} from "boot/axios";
|
||||
|
||||
export default class Accounts {
|
||||
|
||||
/**
|
||||
*
|
||||
* @param types
|
||||
* @returns {Promise<AxiosResponse<any>>}
|
||||
*/
|
||||
get(types) {
|
||||
let url = 'api/v2/autocomplete/accounts';
|
||||
return api.get(url, {params: {types: types}})
|
||||
}
|
||||
|
||||
}
|
2
frontend/src/boot/axios.js
vendored
2
frontend/src/boot/axios.js
vendored
@@ -34,7 +34,7 @@ const cache = setupCache({
|
||||
// "export default () => {}" function below (which runs individually
|
||||
// for each client)
|
||||
|
||||
const url = process.env.DEBUGGING ? 'https://firefly.sd.home' : '/';
|
||||
const url = process.env.DEBUGGING ? 'https://firefly.sd.local' : '/';
|
||||
const api = axios.create({baseURL: url, withCredentials: true, adapter: cache.adapter});
|
||||
|
||||
export default boot(({app}) => {
|
||||
|
316
frontend/src/components/transactions/Split.vue
Normal file
316
frontend/src/components/transactions/Split.vue
Normal file
@@ -0,0 +1,316 @@
|
||||
<!--
|
||||
- Split.vue
|
||||
- Copyright (c) 2023 james@firefly-iii.org
|
||||
-
|
||||
- This file is part of Firefly III (https://github.com/firefly-iii).
|
||||
-
|
||||
- This program is free software: you can redistribute it and/or modify
|
||||
- it under the terms of the GNU Affero General Public License as
|
||||
- published by the Free Software Foundation, either version 3 of the
|
||||
- License, or (at your option) any later version.
|
||||
-
|
||||
- This program is distributed in the hope that it will be useful,
|
||||
- but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
- GNU Affero General Public License for more details.
|
||||
-
|
||||
- You should have received a copy of the GNU Affero General Public License
|
||||
- along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="text-h6">Info for {{ $route.params.type }} {{ index }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col q-mb-xs q-pr-sm">
|
||||
<q-card bordered flat>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label><strong>Main info</strong></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator/>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col q-mb-md">
|
||||
<TransactionDescription
|
||||
:submission-error="submissionErrors.description"
|
||||
:has-submission-error="hasSubmissionErrors.description"
|
||||
:disabled-input="disabledInput"
|
||||
:description="transaction.description"
|
||||
@update:description="updateDescription"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 q-mb-xs q-pr-xs">
|
||||
<SourceAccount name="Test" :disabled-input="false" submission-error="" :has-submission-error="false" />
|
||||
</div>
|
||||
<div class="col-4 q-px-xs">
|
||||
<q-input
|
||||
v-model="transaction.amount"
|
||||
:disable="disabledInput" dense
|
||||
:error="hasSubmissionErrors.amount" :error-message="submissionErrors.amount"
|
||||
:label="$t('firefly.amount')" bottom-slots clearable fill-mask="0"
|
||||
hint="Expects #.##"
|
||||
mask="#.##"
|
||||
outlined reverse-fill-mask/>
|
||||
</div>
|
||||
<div class="col-4 q-pl-xs">
|
||||
<q-input dense
|
||||
v-model="transaction.destination"
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors.destination"
|
||||
:error-message="submissionErrors.destination" :label="$t('firefly.destination_account')"
|
||||
bottom-slots
|
||||
clearable
|
||||
outlined/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 q-pl-xs">
|
||||
Optional
|
||||
</div>
|
||||
<div class="col-4 q-pl-xs">
|
||||
Foreign amount
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col q-mb-xs q-pl-sm">
|
||||
<q-card bordered flat>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label><strong>More meta info</strong></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator/>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col q-mb-md">
|
||||
<q-input
|
||||
v-model="transaction.date" dense
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors.date" :error-message="submissionErrors.date"
|
||||
:hint="$t('firefly.date')" bottom-slots outlined
|
||||
type="date"/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-input v-model="transaction.time" :disable="disabledInput" :hint="$t('firefly.time')" bottom-slots
|
||||
outlined dense
|
||||
type="time"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col q-mb-md">
|
||||
<q-input
|
||||
v-model="transaction.category"
|
||||
:disable="disabledInput" dense
|
||||
:error="hasSubmissionErrors.category" :error-message="submissionErrors.category"
|
||||
:label="$t('firefly.category')" bottom-slots
|
||||
hint="category"
|
||||
clearable outlined/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-select dense v-model="transaction.budget" clearable outlined hint="Budget"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col q-mb-md">
|
||||
<q-select
|
||||
v-model="transaction.bill"
|
||||
:disable="disabledInput" dense
|
||||
:error="hasSubmissionErrors.category" :error-message="submissionErrors.category"
|
||||
:label="$t('firefly.bill')" bottom-slots
|
||||
hint="bill"
|
||||
clearable outlined/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-select
|
||||
v-model="transaction.piggy"
|
||||
:disable="disabledInput" dense
|
||||
:error="hasSubmissionErrors.category" :error-message="submissionErrors.category"
|
||||
:label="$t('firefly.piggy')" bottom-slots
|
||||
hint="bill"
|
||||
clearable outlined/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<q-input
|
||||
v-model="transaction.tags"
|
||||
:disable="disabledInput" dense
|
||||
:error="hasSubmissionErrors.tags" :error-message="submissionErrors.category"
|
||||
:label="$t('firefly.tags')" bottom-slots
|
||||
hint="Tags"
|
||||
clearable outlined/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col q-mb-xs q-pl-sm">
|
||||
<q-card bordered flat>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label><strong>More meta info</strong></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator/>
|
||||
<q-card-section>
|
||||
Extra opts
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col q-mb-xs q-pl-sm">
|
||||
<q-card bordered flat>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label><strong>Date info</strong></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator/>
|
||||
<q-card-section>
|
||||
Date fields
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
</div>
|
||||
<div class="col-4 offset-4">
|
||||
<q-input v-model="transaction.interest_date" filled type="date" hint="Interest date"/>
|
||||
<q-input v-model="transaction.book_date" filled type="date" hint="Book date"/>
|
||||
<q-input v-model="transaction.process_date" filled type="date" hint="Processing date"/>
|
||||
<q-input v-model="transaction.due_date" filled type="date" hint="Due date"/>
|
||||
<q-input v-model="transaction.payment_date" filled type="date" hint="Payment date"/>
|
||||
<q-input v-model="transaction.invoice_date" filled type="date" hint="Invoice date"/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
-->
|
||||
<!--
|
||||
<q-card bordered class="q-mt-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6">Meta for {{ $route.params.type }}</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-select filled v-model="transaction.budget" :options="tempBudgets" label="Budget"/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input filled clearable v-model="transaction.category" :label="$t('firefly.category')" outlined/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-select filled v-model="transaction.subscription" :options="tempSubscriptions" label="Subscription"/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
Tags
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
Bill
|
||||
</div>
|
||||
<div class="col-6">
|
||||
???
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
-->
|
||||
<!--
|
||||
<q-card bordered class="q-mt-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6">Extr for {{ $route.params.type }}</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
Notes
|
||||
</div>
|
||||
<div class="col-6">
|
||||
attachments
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
Links
|
||||
</div>
|
||||
<div class="col-6">
|
||||
reference
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
url
|
||||
</div>
|
||||
<div class="col-6">
|
||||
location
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TransactionDescription from "components/transactions/form/TransactionDescription.vue";
|
||||
import SourceAccount from "components/transactions/form/SourceAccount.vue";
|
||||
|
||||
export default {
|
||||
name: "Split",
|
||||
components: {SourceAccount, TransactionDescription},
|
||||
props: {
|
||||
index: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
disabledInput: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
hasSubmissionErrors: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
submissionErrors: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
transaction: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
updateDescription(newVal) {
|
||||
this.transaction.description = newVal;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
transaction: {
|
||||
handler: function (val) {
|
||||
const obj = {index: this.index, transaction: val}
|
||||
this.$emit('update:transaction', obj);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
145
frontend/src/components/transactions/form/SourceAccount.vue
Normal file
145
frontend/src/components/transactions/form/SourceAccount.vue
Normal file
@@ -0,0 +1,145 @@
|
||||
<!--
|
||||
- SourceAccount.vue
|
||||
- Copyright (c) 2023 james@firefly-iii.org
|
||||
-
|
||||
- This file is part of Firefly III (https://github.com/firefly-iii).
|
||||
-
|
||||
- This program is free software: you can redistribute it and/or modify
|
||||
- it under the terms of the GNU Affero General Public License as
|
||||
- published by the Free Software Foundation, either version 3 of the
|
||||
- License, or (at your option) any later version.
|
||||
-
|
||||
- This program is distributed in the hope that it will be useful,
|
||||
- but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
- GNU Affero General Public License for more details.
|
||||
-
|
||||
- You should have received a copy of the GNU Affero General Public License
|
||||
- along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
-->
|
||||
|
||||
<template>
|
||||
<q-select
|
||||
v-model="model"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
:options="options"
|
||||
@filter="filterFn"
|
||||
hint="filter bla bla"
|
||||
|
||||
dense
|
||||
outlined
|
||||
:error="hasSubmissionError"
|
||||
:label="$t('firefly.source_account')"
|
||||
:error-message="submissionError"
|
||||
bottom-slots
|
||||
clearable
|
||||
|
||||
>
|
||||
<!--
|
||||
:disable="disabledInput"
|
||||
label="Lazy filter"
|
||||
-->
|
||||
<template v-slot:option="scope">
|
||||
<q-item v-bind="scope.itemProps">
|
||||
<q-item-section>
|
||||
<q-item-label>{{ scope.opt.label }}</q-item-label>
|
||||
<q-item-label caption>{{ scope.opt.description }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
|
||||
<template v-slot:no-option>
|
||||
<q-item>
|
||||
<q-item-section class="text-grey">
|
||||
No results
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</q-select>
|
||||
|
||||
</template>
|
||||
|
||||
<!--
|
||||
source account is basic dropdown from API
|
||||
with optional filters on account type. This depends
|
||||
on transaction type which is null or invalid or withdrawal or whatever
|
||||
if the index is not null the field shall be disabled and empty.
|
||||
-->
|
||||
|
||||
<script>
|
||||
import Accounts from '../../../api/v2/autocomplete/accounts'
|
||||
|
||||
export default {
|
||||
name: "SourceAccount",
|
||||
data() {
|
||||
return {
|
||||
model: null,
|
||||
transactionTypeString: '',
|
||||
stringOptions: [],
|
||||
options: [
|
||||
|
||||
],
|
||||
}
|
||||
},
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
transactionType: {
|
||||
type: String,
|
||||
required: false
|
||||
},
|
||||
disabledInput: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: true
|
||||
},
|
||||
hasSubmissionError: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: true
|
||||
},
|
||||
submissionError: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
//this.options.value = this.stringOptions
|
||||
this.getAccounts();
|
||||
},
|
||||
methods: {
|
||||
getAccounts: function() {
|
||||
// default set of account types, will later be set by the transaction type.
|
||||
let types = 'Asset account,Revenue account,Loan,Debt,Mortgage';
|
||||
(new Accounts).get(types).then(response => {
|
||||
this.stringOptions = [];
|
||||
for(let i in response.data) {
|
||||
let entry = response.data[i];
|
||||
let current = {
|
||||
label: entry.name,
|
||||
value: entry.id,
|
||||
description: entry.type
|
||||
}
|
||||
|
||||
this.stringOptions.push(current);
|
||||
}
|
||||
//this.stringOptions = response.data.data;
|
||||
this.options.value = this.stringOptions;
|
||||
});
|
||||
},
|
||||
filterFn (val, update, abort) {
|
||||
update(() => {
|
||||
const needle = val.toLowerCase()
|
||||
this.options.value = this.stringOptions.filter(v => v.label.toLowerCase().indexOf(needle) > -1)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
@@ -0,0 +1,70 @@
|
||||
<!--
|
||||
- TransactionDescription.vue
|
||||
- Copyright (c) 2023 james@firefly-iii.org
|
||||
-
|
||||
- This file is part of Firefly III (https://github.com/firefly-iii).
|
||||
-
|
||||
- This program is free software: you can redistribute it and/or modify
|
||||
- it under the terms of the GNU Affero General Public License as
|
||||
- published by the Free Software Foundation, either version 3 of the
|
||||
- License, or (at your option) any later version.
|
||||
-
|
||||
- This program is distributed in the hope that it will be useful,
|
||||
- but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
- GNU Affero General Public License for more details.
|
||||
-
|
||||
- You should have received a copy of the GNU Affero General Public License
|
||||
- along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
-->
|
||||
|
||||
<template>
|
||||
<q-input
|
||||
v-model="description"
|
||||
hint=" " dense
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionError" :error-message="submissionError"
|
||||
:label="$t('firefly.description')" bottom-slots clearable
|
||||
outlined
|
||||
type="text"/>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TransactionDescription",
|
||||
props: {
|
||||
description: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
disabledInput: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: true
|
||||
},
|
||||
hasSubmissionError: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: true
|
||||
},
|
||||
submissionError: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
description: {
|
||||
handler: function (newVal) {
|
||||
this.$emit('update:description', newVal)
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
@@ -30,7 +30,6 @@
|
||||
</q-banner>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="row q-ma-md">
|
||||
<div class="col-12">
|
||||
<q-card>
|
||||
@@ -43,163 +42,28 @@
|
||||
align="left"
|
||||
class="text-teal col"
|
||||
>
|
||||
<q-tab v-for="(transaction,index) in transactions" :name="'split-' + index" :label="getSplitLabel(index)"/>
|
||||
<q-btn @click="addTransaction" flat label="Add split" icon="fas fa-plus-circle" class="text-orange"></q-btn>
|
||||
<q-tab v-for="(transaction,index) in transactions" :name="'split-' + index"
|
||||
:label="getSplitLabel(index)"/>
|
||||
<q-btn @click="addTransaction" flat label="Add split" icon="fas fa-plus-circle"
|
||||
class="text-orange"></q-btn>
|
||||
</q-tabs>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel v-for="(transaction,index) in transactions" :key="index" :name="'split-' + index">
|
||||
<q-card bordered>
|
||||
<q-card-section>
|
||||
<div class="text-h6">Info for {{ $route.params.type }} {{ index }}</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-12 q-mb-xs">
|
||||
<q-input
|
||||
v-model="transaction.description"
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors[index].description" :error-message="submissionErrors[index].description" :label="$t('firefly.description')" bottom-slots clearable
|
||||
outlined
|
||||
type="text"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-4 q-mb-xs q-pr-xs">
|
||||
<q-input
|
||||
v-model="transaction.source"
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors[index].source" :error-message="submissionErrors[index].source" :label="$t('firefly.source_account')" bottom-slots
|
||||
clearable outlined/>
|
||||
</div>
|
||||
<div class="col-4 q-px-xs">
|
||||
<q-input
|
||||
v-model="transaction.amount"
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors[index].amount" :error-message="submissionErrors[index].amount" :label="$t('firefly.amount')" bottom-slots clearable fill-mask="0"
|
||||
hint="Expects #.##"
|
||||
mask="#.##"
|
||||
outlined reverse-fill-mask/>
|
||||
</div>
|
||||
<div class="col-4 q-pl-xs">
|
||||
<q-input
|
||||
v-model="transaction.destination"
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors[index].destination" :error-message="submissionErrors[index].destination" :label="$t('firefly.destination_account')" bottom-slots
|
||||
clearable
|
||||
outlined/>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="row">
|
||||
<div class="col-4 offset-4">
|
||||
Foreign
|
||||
</div>
|
||||
|
||||
</div>
|
||||
-->
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<q-input
|
||||
v-model="transaction.date"
|
||||
:disable="disabledInput"
|
||||
:error="hasSubmissionErrors[index].date" :error-message="submissionErrors[index].date" :hint="$t('firefly.date')" bottom-slots outlined
|
||||
type="date"/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-input v-model="transaction.time" :disable="disabledInput" :hint="$t('firefly.time')" bottom-slots outlined
|
||||
type="time"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="col-4 offset-4">
|
||||
<q-input v-model="transaction.interest_date" filled type="date" hint="Interest date"/>
|
||||
<q-input v-model="transaction.book_date" filled type="date" hint="Book date"/>
|
||||
<q-input v-model="transaction.process_date" filled type="date" hint="Processing date"/>
|
||||
<q-input v-model="transaction.due_date" filled type="date" hint="Due date"/>
|
||||
<q-input v-model="transaction.payment_date" filled type="date" hint="Payment date"/>
|
||||
<q-input v-model="transaction.invoice_date" filled type="date" hint="Invoice date"/>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
<!--
|
||||
<q-card bordered class="q-mt-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6">Meta for {{ $route.params.type }}</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-select filled v-model="transaction.budget" :options="tempBudgets" label="Budget"/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<q-input filled clearable v-model="transaction.category" :label="$t('firefly.category')" outlined/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<q-select filled v-model="transaction.subscription" :options="tempSubscriptions" label="Subscription"/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
Tags
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
Bill
|
||||
</div>
|
||||
<div class="col-6">
|
||||
???
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
-->
|
||||
<!--
|
||||
<q-card bordered class="q-mt-md">
|
||||
<q-card-section>
|
||||
<div class="text-h6">Extr for {{ $route.params.type }}</div>
|
||||
</q-card-section>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
Notes
|
||||
</div>
|
||||
<div class="col-6">
|
||||
attachments
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
Links
|
||||
</div>
|
||||
<div class="col-6">
|
||||
reference
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
url
|
||||
</div>
|
||||
<div class="col-6">
|
||||
location
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
-->
|
||||
<Split
|
||||
:transaction="transaction"
|
||||
:index="index"
|
||||
:disabled-input="disabledInput"
|
||||
:has-submission-errors="hasSubmissionErrors[index]"
|
||||
:submission-errors="submissionErrors[index]"
|
||||
@update:transaction="updateTransaction"
|
||||
/>
|
||||
</q-tab-panel>
|
||||
|
||||
<!--
|
||||
@@ -219,7 +83,7 @@
|
||||
|
||||
<div class="row q-mx-md">
|
||||
<div class="col-12">
|
||||
<q-card class="q-mt-xs">
|
||||
<q-card class="q-mt-xs" bordered flat>
|
||||
<q-card-section>
|
||||
<div class="row">
|
||||
<div class="col-12 text-right">
|
||||
@@ -231,7 +95,8 @@
|
||||
<q-checkbox v-model="doReturnHere" :disable="disabledInput" label="Return here to create another one"
|
||||
left-label/>
|
||||
<br/>
|
||||
<q-checkbox v-model="doResetForm" :disable="!doReturnHere || disabledInput" label="Reset form after submission"
|
||||
<q-checkbox v-model="doResetForm" :disable="!doReturnHere || disabledInput"
|
||||
label="Reset form after submission"
|
||||
left-label/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -246,9 +111,11 @@
|
||||
import format from 'date-fns/format';
|
||||
import formatISO from 'date-fns/formatISO';
|
||||
import Post from "../../api/transactions/post";
|
||||
import Split from "components/transactions/Split.vue";
|
||||
|
||||
export default {
|
||||
name: 'Create',
|
||||
components: {Split},
|
||||
data() {
|
||||
return {
|
||||
tab: 'split-0',
|
||||
@@ -268,35 +135,50 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
disabledInput: function () {
|
||||
return this.submitting;
|
||||
return this.submitting ?? false;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
console.log('Created');
|
||||
this.resetForm();
|
||||
},
|
||||
methods: {
|
||||
resetForm: function () {
|
||||
console.log('ResetForm');
|
||||
this.transactions = [];
|
||||
const info = this.getDefaultTransaction();
|
||||
this.transactions.push(info.transaction);
|
||||
this.submissionErrors.push(info.submissionError);
|
||||
this.hasSubmissionErrors.push(info.hasSubmissionError);
|
||||
this.addTransaction();
|
||||
// const info = this.getDefaultTransaction();
|
||||
// this.transactions.push(info.transaction);
|
||||
// this.submissionErrors.push(info.submissionError);
|
||||
// this.hasSubmissionErrors.push(info.hasSubmissionError);
|
||||
},
|
||||
addTransaction: function () {
|
||||
const transaction = this.getDefaultTransaction();
|
||||
this.transactions.push(transaction);
|
||||
this.tab = 'split-' + (parseInt(this.transactions.length) - 1);
|
||||
|
||||
// push all three
|
||||
this.transactions.push(transaction.transaction);
|
||||
this.submissionErrors.push(transaction.submissionError);
|
||||
this.hasSubmissionErrors.push(transaction.hasSubmissionError);
|
||||
|
||||
const index = String(this.transactions.length - 1);
|
||||
console.log('AddTransaction ' + index);
|
||||
this.tab = 'split-' + index;
|
||||
},
|
||||
getSplitLabel: function (index) {
|
||||
if (this.transactions.hasOwnProperty(index) && null !== this.transactions[index].description && this.transactions[index].description.length > 0) {
|
||||
console.log('Get split label (' + index + ')');
|
||||
if (this.transactions.hasOwnProperty(index) &&
|
||||
null !== this.transactions[index].description &&
|
||||
this.transactions[index].description.length > 0) {
|
||||
return this.transactions[index].description
|
||||
}
|
||||
return this.$t('firefly.single_split') + ' ' + (index + 1);
|
||||
},
|
||||
dismissBanner: function () {
|
||||
console.log('Dismiss banner');
|
||||
this.errorMessage = '';
|
||||
},
|
||||
submitTransaction: function () {
|
||||
console.log('submit transaction');
|
||||
this.submitting = true;
|
||||
this.errorMessage = '';
|
||||
|
||||
@@ -312,7 +194,15 @@ export default {
|
||||
.catch(this.processErrors)
|
||||
.then(this.processSuccess);
|
||||
},
|
||||
updateTransaction: function (obj) {
|
||||
const index = obj.index;
|
||||
const transaction = obj.transaction;
|
||||
console.log('Update transaction ' + index);
|
||||
console.log(transaction);
|
||||
this.transactions[index] = transaction;
|
||||
},
|
||||
processSuccess: function (response) {
|
||||
console.log('process success');
|
||||
this.submitting = false;
|
||||
let message = {
|
||||
level: 'success',
|
||||
@@ -340,6 +230,7 @@ export default {
|
||||
|
||||
},
|
||||
resetErrors: function () {
|
||||
console.log('reset errors');
|
||||
let length = this.transactions.length;
|
||||
let transaction = this.getDefaultTransaction();
|
||||
for (let i = 0; i < length; i++) {
|
||||
@@ -348,6 +239,7 @@ export default {
|
||||
}
|
||||
},
|
||||
processErrors: function (error) {
|
||||
console.log('process errors');
|
||||
if (error.response) {
|
||||
let errors = error.response.data; // => the response payload
|
||||
this.errorMessage = errors.message;
|
||||
@@ -360,7 +252,8 @@ export default {
|
||||
this.submitting = false;
|
||||
},
|
||||
processSingleError: function (key, errors) {
|
||||
// lol dumbest way to explode "transactions.0.something" ever.
|
||||
console.log('process single error');
|
||||
// lol the dumbest way to explode "transactions.0.something" ever.
|
||||
let index = parseInt(key.split('.')[1]);
|
||||
let fieldName = key.split('.')[2];
|
||||
switch (fieldName) {
|
||||
@@ -383,6 +276,7 @@ export default {
|
||||
}
|
||||
},
|
||||
buildTransaction: function () {
|
||||
console.log('build transaction');
|
||||
const obj = {
|
||||
transactions: []
|
||||
};
|
||||
@@ -401,6 +295,7 @@ export default {
|
||||
return obj;
|
||||
},
|
||||
getDefaultTransaction: function () {
|
||||
console.log('get default transaction');
|
||||
let date = '';
|
||||
let time = '00:00';
|
||||
|
||||
|
Reference in New Issue
Block a user