{
  "schemaVersion": 1,
  "name": "Sales by customer",
  "unit": "mm",
  "page": {
    "size": "A4",
    "orientation": "portrait",
    "margins": {
      "top": 12,
      "right": 12,
      "bottom": 12,
      "left": 12
    }
  },
  "dataSources": [
    {
      "name": "orders"
    }
  ],
  "styles": {
    "title": {
      "fontSize": 18,
      "fontWeight": "bold",
      "color": "#0f172a"
    },
    "muted": {
      "fontSize": 9,
      "color": "#64748b"
    },
    "th": {
      "fontSize": 9,
      "fontWeight": "bold",
      "color": "#ffffff",
      "backgroundColor": "#334155",
      "padding": 1.5
    },
    "td": {
      "fontSize": 9,
      "padding": 1.5,
      "border": {
        "width": 0.4,
        "color": "#e2e8f0",
        "style": "solid",
        "sides": [
          "bottom"
        ]
      }
    },
    "num": {
      "textAlign": "right"
    },
    "sub": {
      "fontSize": 9,
      "fontWeight": "bold",
      "backgroundColor": "#e2e8f0",
      "padding": 1.5
    }
  },
  "reportHeader": {
    "id": "rh",
    "height": 16,
    "components": [
      {
        "id": "title",
        "type": "text",
        "x": 0,
        "y": 0,
        "width": 186,
        "height": 9,
        "text": "Sales by customer",
        "styleName": "title"
      },
      {
        "id": "sub",
        "type": "text",
        "x": 0,
        "y": 10,
        "width": 186,
        "height": 5,
        "text": "{{ count(orders) }} orders from {{ distinct(orders, \"customer\").length }} customers",
        "styleName": "muted"
      }
    ]
  },
  "pageFooter": {
    "id": "pf",
    "height": 8,
    "components": [
      {
        "id": "pf_n",
        "type": "text",
        "x": 0,
        "y": 2,
        "width": 186,
        "height": 5,
        "text": "Page {{ page.number }} of {{ page.count }}",
        "style": {
          "fontSize": 8,
          "color": "#64748b",
          "textAlign": "right"
        }
      }
    ]
  },
  "body": [
    {
      "kind": "dataRegion",
      "id": "orders_region",
      "dataSource": "orders",
      "sort": [
        {
          "expression": "row.date",
          "direction": "asc"
        }
      ],
      "groups": [
        {
          "id": "by_customer",
          "expression": "row.customer",
          "header": {
            "id": "gh",
            "height": 8,
            "components": [
              {
                "id": "gh1",
                "type": "text",
                "x": 0,
                "y": 1,
                "width": 186,
                "height": 6,
                "text": "{{ group.key }}",
                "style": {
                  "fontSize": 11,
                  "fontWeight": "bold",
                  "color": "#1d4ed8",
                  "padding": 1
                }
              }
            ]
          },
          "footer": {
            "id": "gf",
            "height": 8,
            "components": [
              {
                "id": "gf1",
                "type": "text",
                "x": 0,
                "y": 1,
                "width": 134,
                "height": 6,
                "text": "Subtotal ({{ group.count }} orders)",
                "styleName": "sub"
              },
              {
                "id": "gf2",
                "type": "text",
                "x": 134,
                "y": 1,
                "width": 52,
                "height": 6,
                "text": "{{ sum(group.rows, \"amount\") }}",
                "styleName": "sub",
                "style": {
                  "textAlign": "right"
                },
                "format": {
                  "type": "currency",
                  "currency": "USD"
                }
              }
            ]
          }
        }
      ],
      "header": {
        "id": "head",
        "height": 7,
        "components": [
          {
            "id": "h1",
            "type": "text",
            "x": 0,
            "y": 0,
            "width": 22,
            "height": 7,
            "text": "Order",
            "styleName": "th"
          },
          {
            "id": "h2",
            "type": "text",
            "x": 22,
            "y": 0,
            "width": 30,
            "height": 7,
            "text": "Date",
            "styleName": "th"
          },
          {
            "id": "h3",
            "type": "text",
            "x": 52,
            "y": 0,
            "width": 82,
            "height": 7,
            "text": "Product",
            "styleName": "th"
          },
          {
            "id": "h4",
            "type": "text",
            "x": 134,
            "y": 0,
            "width": 52,
            "height": 7,
            "text": "Amount",
            "styleName": "th",
            "style": {
              "textAlign": "right"
            }
          }
        ]
      },
      "detail": {
        "id": "row",
        "height": 6.5,
        "components": [
          {
            "id": "c1",
            "type": "text",
            "x": 0,
            "y": 0,
            "width": 22,
            "height": 6.5,
            "text": "#{{ row.id }}",
            "styleName": "td"
          },
          {
            "id": "c2",
            "type": "text",
            "x": 22,
            "y": 0,
            "width": 30,
            "height": 6.5,
            "text": "{{ row.date }}",
            "styleName": "td",
            "format": {
              "type": "date",
              "pattern": "dd MMM yyyy"
            }
          },
          {
            "id": "c3",
            "type": "text",
            "x": 52,
            "y": 0,
            "width": 82,
            "height": 6.5,
            "text": "{{ row.product }}",
            "styleName": "td"
          },
          {
            "id": "c4",
            "type": "text",
            "x": 134,
            "y": 0,
            "width": 52,
            "height": 6.5,
            "text": "{{ row.amount }}",
            "styleName": "td",
            "style": {
              "textAlign": "right"
            },
            "format": {
              "type": "currency",
              "currency": "USD"
            }
          }
        ]
      },
      "footer": {
        "id": "foot",
        "height": 10,
        "components": [
          {
            "id": "f1",
            "type": "text",
            "x": 0,
            "y": 2,
            "width": 134,
            "height": 7,
            "text": "Grand total",
            "style": {
              "fontSize": 11,
              "fontWeight": "bold",
              "backgroundColor": "#1e293b",
              "color": "#fff",
              "padding": 1.5
            }
          },
          {
            "id": "f2",
            "type": "text",
            "x": 134,
            "y": 2,
            "width": 52,
            "height": 7,
            "text": "{{ sum(rows, \"amount\") }}",
            "style": {
              "fontSize": 11,
              "fontWeight": "bold",
              "backgroundColor": "#1e293b",
              "color": "#fff",
              "padding": 1.5,
              "textAlign": "right"
            },
            "format": {
              "type": "currency",
              "currency": "USD"
            }
          }
        ]
      }
    }
  ]
}