Add tooltips to the SVG chart with date and amount

This commit is contained in:
jordi fita mas 2023-05-21 19:22:46 +02:00
parent 02a4fad443
commit 46b079cb0b
1 changed files with 27 additions and 14 deletions

View File

@ -8,6 +8,7 @@ import (
"math"
"net/http"
"strings"
"time"
)
const (
@ -60,7 +61,7 @@ func ServeDashboard(w http.ResponseWriter, r *http.Request, _ httprouter.Params)
conn := getConn(r)
dashboard := &DashboardPage{
Filters: filters,
Chart: buildDashboardChart(r.Context(), conn, company, periodStart, periodEnd, filters.Period.Selected),
Chart: buildDashboardChart(r.Context(), conn, locale, company, periodStart, periodEnd, filters.Period.Selected),
}
rows := conn.MustQuery(r.Context(), fmt.Sprintf(`
select to_price(0, decimal_digits) as sales
@ -173,17 +174,23 @@ func (form *dashboardFilterForm) Parse(r *http.Request) error {
return nil
}
func buildDashboardChart(ctx context.Context, conn *Conn, company *Company, periodStart string, periodEnd string, selectedPeriod string) template.HTML {
func buildDashboardChart(ctx context.Context, conn *Conn, locale *Locale, company *Company, periodStart string, periodEnd string, selectedPeriod string) template.HTML {
group := "yyyymmdd"
dateFormat := "02/01/2006"
switch selectedPeriod {
case YearPeriod, YesteryearPeriod:
group = "yyyymm"
dateFormat = "01/2006"
}
rows := conn.MustQuery(ctx, fmt.Sprintf(`
select date
, 0 as sales
, to_date(date::text, '%[3]s')
, 0 as sales
, to_price(0, $2) as sales_price
, coalesce(invoice.total, 0) as income
, to_price(coalesce(invoice.total, 0), $2) as income_price
, coalesce(expense.total, 0) as expenses
, to_price(coalesce(expense.total, 0), $2) as expenses_price
from (
select to_char(date.invoice_date, '%[3]s')::integer as date
, sum(total)::integer as total
@ -200,14 +207,18 @@ func buildDashboardChart(ctx context.Context, conn *Conn, company *Company, peri
group by date
) as expense using (date)
order by date
`, periodStart, periodEnd, group), company.Id)
`, periodStart, periodEnd, group), company.Id, company.DecimalDigits)
defer rows.Close()
type value struct {
date int
sales float64
income float64
expenses float64
index int
date time.Time
sales float64
salesPrice string
income float64
incomePrice string
expenses float64
expensesPrice string
}
var values []value
var max = 0.
@ -216,7 +227,7 @@ func buildDashboardChart(ctx context.Context, conn *Conn, company *Company, peri
var sales int
var income int
var expenses int
if err := rows.Scan(&v.date, &sales, &income, &expenses); err != nil {
if err := rows.Scan(&v.index, &v.date, &sales, &v.salesPrice, &income, &v.incomePrice, &expenses, &v.expensesPrice); err != nil {
panic(err)
}
v.sales = float64(sales)
@ -251,13 +262,15 @@ func buildDashboardChart(ctx context.Context, conn *Conn, company *Company, peri
writePolyline(func(v value) float64 { return v.income })
writePolyline(func(v value) float64 { return v.expenses })
writeCircle := func(i int, v float64) {
sb.WriteString(fmt.Sprintf("<circle cx='%f' cy='%f' r='4'></circle>", float64(i)/dataPoints*width, height-v/max*height))
writeCircle := func(i int, time time.Time, p string, v float64) {
price := formatPrice(p, locale.Language, locale.CurrencyPattern, company.DecimalDigits, company.CurrencySymbol)
date := time.Format(dateFormat)
sb.WriteString(fmt.Sprintf("<circle cx='%f' cy='%f' r='4'><title>%s\n%s</title></circle>", float64(i)/dataPoints*width, height-v/max*height, date, price))
}
for i, v := range values {
writeCircle(i, v.sales)
writeCircle(i, v.income)
writeCircle(i, v.expenses)
writeCircle(i, v.date, v.salesPrice, v.sales)
writeCircle(i, v.date, v.incomePrice, v.income)
writeCircle(i, v.date, v.expensesPrice, v.expenses)
}
sb.WriteString("</svg>")
return template.HTML(sb.String())