|
|
|
@ -1,40 +1,31 @@
|
|
|
|
|
<script lang="ts">
|
|
|
|
|
import { mapState } from "pinia";
|
|
|
|
|
import { defineComponent } from "vue";
|
|
|
|
|
import { defineComponent, PropType } from "vue";
|
|
|
|
|
import Currency from "../components/Currency.vue";
|
|
|
|
|
import { useBudgetsStore } from "../stores/budget";
|
|
|
|
|
import { Category, useAccountStore } from "../stores/budget-account";
|
|
|
|
|
|
|
|
|
|
interface Date {
|
|
|
|
|
Year: Number,
|
|
|
|
|
Month: Number,
|
|
|
|
|
Year: number,
|
|
|
|
|
Month: number,
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default defineComponent({
|
|
|
|
|
mounted() {
|
|
|
|
|
document.title = "Budgeteer - Budget for " + this.selected.Month + "/" + this.selected.Year;
|
|
|
|
|
return useAccountStore().FetchMonthBudget(this.budgetid, this.year, this.month);
|
|
|
|
|
props: {
|
|
|
|
|
budgetid: {} as PropType<string>,
|
|
|
|
|
year: {} as PropType<number>,
|
|
|
|
|
month: {} as PropType<number>,
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
year() {
|
|
|
|
|
return useAccountStore().FetchMonthBudget(this.budgetid, this.year, this.month);
|
|
|
|
|
},
|
|
|
|
|
month() {
|
|
|
|
|
return useAccountStore().FetchMonthBudget(this.budgetid, this.year, this.month);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
props: ["budgetid", "year", "month"],
|
|
|
|
|
computed: {
|
|
|
|
|
...mapState(useBudgetsStore, ["CurrentBudgetID"]),
|
|
|
|
|
Categories() : IterableIterator<Category> | undefined {
|
|
|
|
|
Categories() : Category[] {
|
|
|
|
|
const accountStore = useAccountStore();
|
|
|
|
|
console.log(accountStore.CategoriesForMonth(this.year, this.month));
|
|
|
|
|
return accountStore.CategoriesForMonth(this.year, this.month);
|
|
|
|
|
return [...accountStore.CategoriesForMonth(this.selected.Year, this.selected.Month)];
|
|
|
|
|
},
|
|
|
|
|
previous() : Date {
|
|
|
|
|
return {
|
|
|
|
|
Year: new Date(this.year, this.month - 1, 1).getFullYear(),
|
|
|
|
|
Month: new Date(this.year, this.month - 1, 1).getMonth(),
|
|
|
|
|
Year: new Date(this.selected.Year, this.selected.Month - 1, 1).getFullYear(),
|
|
|
|
|
Month: new Date(this.selected.Year, this.selected.Month - 1, 1).getMonth(),
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
current() : Date {
|
|
|
|
@ -45,17 +36,31 @@ export default defineComponent({
|
|
|
|
|
},
|
|
|
|
|
selected() : Date {
|
|
|
|
|
return {
|
|
|
|
|
Year: this.year,
|
|
|
|
|
Month: Number(this.month) + 1
|
|
|
|
|
Year: this.year ?? this.current.Year,
|
|
|
|
|
Month: Number(this.month ?? this.current.Month) + 1
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
next() : Date {
|
|
|
|
|
return {
|
|
|
|
|
Year: new Date(this.year, Number(this.month) + 1, 1).getFullYear(),
|
|
|
|
|
Month: new Date(this.year, Number(this.month) + 1, 1).getMonth(),
|
|
|
|
|
Year: new Date(this.selected.Year, Number(this.month) + 1, 1).getFullYear(),
|
|
|
|
|
Month: new Date(this.selected.Year, Number(this.month) + 1, 1).getMonth(),
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() : Promise<void> {
|
|
|
|
|
document.title = "Budgeteer - Budget for " + this.selected.Month + "/" + this.selected.Year;
|
|
|
|
|
return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.selected.Year, this.selected.Month);
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
year() {
|
|
|
|
|
if (this.year != undefined && this.month != undefined)
|
|
|
|
|
return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.year, this.month);
|
|
|
|
|
},
|
|
|
|
|
month() {
|
|
|
|
|
if (this.year != undefined && this.month != undefined)
|
|
|
|
|
return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.year, this.month);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
components: { Currency }
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|