Various fixes

This commit is contained in:
James Cole
2023-07-14 06:04:48 +02:00
parent d943a5ae9b
commit ab3dbf9218
4 changed files with 99 additions and 42 deletions

View File

@@ -10,7 +10,8 @@ import {
startOfQuarter,
startOfWeek,
startOfYear,
subDays, subMonths
subDays,
subMonths
} from "date-fns";
import format from './util/format'
@@ -26,8 +27,14 @@ class MainApp {
language = 'en-US';
constructor() {
//console.log('MainApp constructor');
// TODO load range from local storage (Apline)
let start = window.BasicStore.getFromLocalStorage('start');
let end = window.BasicStore.getFromLocalStorage('end');
if (null !== start && null !== end) {
this.range = {
start: new Date(start),
end: new Date(end),
};
}
}
init() {
@@ -39,9 +46,8 @@ class MainApp {
window.__localeId__ = this.language;
// the range is always null but later on we will store it in BasicStore.
if (null === this.range.start && null === this.range.end
&& null === this.defaultRange.start && null === this.defaultRange.end
) {
if (null === this.range.start && null === this.range.end && null === this.defaultRange.start && null === this.defaultRange.end) {
this.range.start = new Date;
this.setDatesFromViewRange();
}
}
@@ -51,7 +57,7 @@ class MainApp {
let end;
let viewRange = this.viewRange;
let today = new Date;
let today = this.range.start;
switch (viewRange) {
case 'last365':
start = startOfDay(subDays(today, 365));
@@ -142,7 +148,6 @@ class MainApp {
}
buildDateRange() {
// generate ranges
let nextRange = this.getNextRange();
let prevRange = this.getPrevRange();
@@ -199,54 +204,74 @@ class MainApp {
}
getNextRange() {
let nextMonth = addMonths(this.range.start, 1);
let start = startOfMonth(this.range.start);
let nextMonth = addMonths(start, 1);
let end = endOfMonth(nextMonth);
return {start: nextMonth, end: end};
}
getPrevRange() {
let prevMonth = subMonths(this.range.start, 1);
let start = startOfMonth(this.range.start);
let prevMonth = subMonths(start, 1);
let end = endOfMonth(prevMonth);
return {start: prevMonth, end: end};
}
ytd() {
let end = this.range.start;
let end = new Date;
let start = startOfYear(this.range.start);
return {start: start, end: end};
}
mtd() {
let end = this.range.start;
let end = new Date;
let start = startOfMonth(this.range.start);
return {start: start, end: end};
}
lastDays(days) {
let end = this.range.start;
let end = new Date;
let start = subDays(end, days);
return {start: start, end: end};
}
changeDateRange(e) {
let target = e.currentTarget;
//alert('OK 3');
let start = new Date(target.getAttribute('data-start'));
let end = new Date(target.getAttribute('data-end'));
e.preventDefault();
window.app.setStart(start);
window.app.setEnd(end);
window.app.buildDateRange();
return false;
}
setStart(date) {
this.range.start = date;
window.BasicStore.store('start', date);
}
setEnd(date) {
this.range.end = date;
window.BasicStore.store('end', date);
}
}
let app = new MainApp();
// Listen for the basic store, we need it to continue with the
document.addEventListener(
"BasicStoreReady",
(e) => {
// e.target matches elem
app.init();
app.buildDateRange();
},
false,
);
document.addEventListener("BasicStoreReady", (e) => {
app.init();
app.buildDateRange();
}, false,);
function handleClick(e) {
console.log('here we are');
e.preventDefault();
alert('OK');
return false;
if (window.BasicStore.isReady()) {
app.init();
app.buildDateRange();
}
export {app, handleClick};
window.app = app;
export default app;

View File

@@ -5,14 +5,18 @@ import Get from '../api/preferences/index.js';
class Basic {
viewRange = '1M';
darkMode = 'browser';
listPageSize = 10;
locale = 'en-US';
language = 'en-US';
locale = 'en-US';
// others, to be used in the future.
listPageSize = 10;
currencyCode = 'AAA';
currencyId = '0';
ready = false;
count = 0;
readyCount = 4;
start = null;
end = null;
constructor() {
}
@@ -27,11 +31,25 @@ class Basic {
loadVariable(name) {
if (window.hasOwnProperty(name)) {
this[name] = window[name];
this.count++;
if (this.count === this.readyCount) {
// trigger event:
const event = new Event("BasicStoreReady");
document.dispatchEvent(event);
}
return;
}
// load from local storage
if (window.Alpine.store(name)) {
this[name] = window.Alpine.store(name);
if (localStorage.getItem(name)) {
this[name] = localStorage.getItem(name);
this.count++;
if (this.count === this.readyCount) {
// trigger event:
const event = new Event("BasicStoreReady");
document.dispatchEvent(event);
}
return;
}
// grab
@@ -43,12 +61,26 @@ class Basic {
this.count++;
let value = response.data.data.attributes.data;
this[name] = value;
localStorage.setItem(name, value);
if (this.count === this.readyCount) {
// trigger event:
const event = new Event("BasicStoreReady");
document.dispatchEvent(event);
}
}
store(name, value) {
this[name] = value;
localStorage.setItem(name, value);
}
getFromLocalStorage(name) {
return localStorage.getItem(name);
}
isReady() {
return this.count === this.readyCount;
}
}
export default Basic;

View File

@@ -14,7 +14,7 @@
<button x-on:click="count++">Increment</button>
<span x-text="count"></span>
<button x-on:click="handleClick">KLIK</button>
<button x-on:click="app.changeDateRange">KLIK</button>
</div>
</div>

View File

@@ -35,36 +35,36 @@
<!-- begin date range drop down -->
<li class="nav-item dropdown">
<a class="nav-link daterange-holder" data-bs-toggle="dropdown" href="#"></a>
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end">
<a href="#" class="dropdown-item daterange-current" @click="handleClick">
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end" x-data="">
<a href="#" class="dropdown-item daterange-current">
</a>
<div class="dropdown-divider"></div>
<a href="#" @click="handleClick" class="dropdown-item daterange-next">
<a href="#" x-on:click="app.changeDateRange" class="dropdown-item daterange-next">
next
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item daterange-prev">
<a href="#" class="dropdown-item daterange-prev" @click="app.changeDateRange">
prev
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item daterange-7d">
<a href="#" class="dropdown-item daterange-7d" @click="app.changeDateRange">
{{ __('firefly.last_seven_days') }}
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item daterange-90d">
<a href="#" class="dropdown-item daterange-90d" @click="app.changeDateRange">
{{ __('firefly.last_thirty_days') }}
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item daterange-mtd">
<a href="#" class="dropdown-item daterange-mtd" @click="app.changeDateRange">
{{ __('firefly.month_to_date') }}
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item daterange-ytd">
<a href="#" class="dropdown-item daterange-ytd" @click="app.changeDateRange">
{{ __('firefly.year_to_date') }}
</a>
<div class="dropdown-divider"></div>
<a href="#" class="dropdown-item dropdown-footer daterange-custom">
<a href="#" class="dropdown-item dropdown-footer daterange-custom" @click="app.doCustomRange">
{{ __('firefly.customRange') }}
</a>
</div>