{
        "title": "Quotation {quotation_number}",
        "size": "large",
        "header": [
            {
                "type": "badge",
                "class": "badge badge-lg",
                "classExpression": "status == \"draft\" ? \"badge-warning\" : status == \"sent\" ? \"badge-info\" : status == \"accepted\" ? \"badge-success\" : status == \"rejected\" ? \"badge-error\" : \"badge-ghost\"",
                "text": "{status}"
            }
        ],
        "body": [
            {
                "type": "tabs",
                "tabs": [
                    {
                        "label": "Details",
                        "icon": "fa-info-circle",
                        "elements": [
                            {
                                "type": "grid",
                                "columns": 2,
                                "elements": [
                                    {
                                        "type": "field-display",
                                        "label": "Quotation Number",
                                        "field": "quotation_number"
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Date",
                                        "field": "date",
                                        "format": "date"
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Customer",
                                        "field": "customer_id",
                                        "lookup": {
                                            "table": "clients",
                                            "keyField": "client_id",
                                            "displayField": "name"
                                        }
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Status",
                                        "field": "status"
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Total Amount",
                                        "field": "total_amount",
                                        "format": "currency"
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Tax Amount",
                                        "field": "tax_amount",
                                        "format": "currency"
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Sent At",
                                        "field": "sent_at",
                                        "format": "datetime"
                                    },
                                    {
                                        "type": "field-display",
                                        "label": "Expires At",
                                        "field": "expires_at",
                                        "format": "datetime"
                                    }
                                ]
                            },
                            {
                                "type": "divider"
                            },
                            {
                                "type": "field-display",
                                "label": "Note",
                                "field": "note"
                            },
                            {
                                "type": "field-display",
                                "label": "Terms",
                                "field": "terms"
                            }
                        ]
                    },
                    {
                        "label": "Line Items",
                        "icon": "fa-list",
                        "elements": [
                            {
                                "type": "shopping-cart",
                                "id": "quotationLineItems",
                                "options": {
                                    "dataField": "line_items",
                                    "readonly": true,
                                    "columns": [
                                        {
                                            "field": "item_type",
                                            "label": "Type",
                                            "type": "select",
                                            "options": [
                                                {"value": "product", "label": "Product"},
                                                {"value": "service", "label": "Service"}
                                            ]
                                        },
                                        {
                                            "field": "item_id",
                                            "label": "Item",
                                            "type": "select",
                                            "options_source_field": "item_type",
                                            "options_tables": {
                                                "product": "products",
                                                "service": "services"
                                            },
                                            "auto_populate": {
                                                "description": "name",
                                                "unit_price": "price",
                                                "tax_rate": "tax_rate"
                                            }
                                        },
                                        {
                                            "field": "description",
                                            "label": "Description",
                                            "type": "text"
                                        },
                                        {
                                            "field": "quantity",
                                            "label": "Qty",
                                            "type": "number"
                                        },
                                        {
                                            "field": "unit_price",
                                            "label": "Price",
                                            "type": "number"
                                        },
                                        {
                                            "field": "tax_rate",
                                            "label": "Tax %",
                                            "type": "number"
                                        },
                                        {
                                            "field": "subtotal",
                                            "label": "Subtotal",
                                            "type": "computed",
                                            "formula": "quantity * unit_price"
                                        },
                                        {
                                            "field": "total",
                                            "label": "Total",
                                            "type": "computed",
                                            "formula": "(quantity * unit_price) * (1 + tax_rate/100)"
                                        }
                                    ]
                                }
                            }
                        ]
                    },
                    {
                        "label": "History",
                        "icon": "fa-history",
                        "elements": [
                            {
                                "type": "table",
                                "id": "quotationHistory",
                                "options": {
                                    "tableName": "audit_logs",
                                    "filters": {
                                        "table_name": "quotations",
                                        "record_id": "{quotation_id}"
                                    },
                                    "showGlobalSearch": false,
                                    "addButton": false,
                                    "columnsToShow": ["action", "changed_by", "changed_at", "changes"],
                                    "columnLabels": {
                                        "action": "Action",
                                        "changed_by": "User",
                                        "changed_at": "Date",
                                        "changes": "Changes"
                                    }
                                }
                            }
                        ]
                    }
                ]
            }
        ],
        "footer": [
            {
                "type": "button",
                "label": "Close",
                "class": "btn btn-ghost",
                "action": "close"
            },
            {
                "type": "button",
                "label": "Edit",
                "icon": "fa-edit",
                "class": "btn btn-secondary",
                "action": {
                    "handler": "openQuotationForm"
                },
                "condition": "status == \"draft\""
            },
            {
                "type": "button",
                "label": "Send",
                "icon": "fa-paper-plane",
                "class": "btn btn-primary",
                "action": "quotations:send",
                "condition": "status == \"draft\"",
                "confirm": "Send this quotation to the customer?"
            },
            {
                "type": "button",
                "label": "Convert to Invoice",
                "icon": "fa-file-invoice",
                "class": "btn btn-success",
                "action": "quotations:convert",
                "condition": "status == \"sent\" || status == \"accepted\"",
                "confirm": "Convert this quotation to an invoice?"
            },
            {
                "type": "button",
                "label": "Download PDF",
                "icon": "fa-file-pdf",
                "class": "btn btn-secondary",
                "action": "quotations:pdf"
            }
        ]
    }