Custom HTML

Live Beispiel

Beispielcode

context.enableModules();
const { TableGadget } = require("ou.sp.gadget.TableGadget");

const gadget = new TableGadget({
    html: {
        header: (options) => {
            return [
                "<div style='border: solid 0.2em rgb(3 102 214 / 30%); margin: 20px 20px 40px; padding: 10px 20px; box-shadow:rgba(0, 0, 0, 0.12) 0px 5px 10px 0px;border-radius:3px;'>",
                "✔️ Weitere Informationen unter: ",
                "<a href='https://developers.one-unity.cloud/library/docs/multiTable/options#html-object' target='_blank'>https://developers.one-unity.cloud/library</a>",
                "</div>",
                options.rows.length === 0 ? "<div>Achtung es sind keine Zeilen hinterlegt!</div>" : "",
            ].join("");
        },
        footer: (options) => {
            return (
                "<div style='cursor: pointer; margin-top: 5px; padding: 0px 8px; background-color: #ffde00; box-shadow: 0 2px 2px #ccc; border-radius: 3px; display: inline-block;'>Zeilen: " +
                options.rows.length +
                "</div>"
            );
        },
    },
    allowDelete: false,
    allowInsert: false,
    showOptions: false,
    showFooter: false,
    select: false,
    fieldName: "exampleJSON",
    columns: {
        id: "Kreditorennummer",
        vendorName: "Kreditor",
        recipient: "RK",
        barcode: "Barcode",
        amount: {
            label: "Gesamtbetrag",
            type: "currency",
        },
        status: {
            label: "Status",
            type: "badge",
            badges: {
                Erledigt: "success",
                offen: "error",
            },
        },
    },
    rows: [
        {
            id: "123456",
            vendorName: "One Unity",
            recipient: "OUC",
            barcode: "1234567",
            amount: 42.0,
            totalAmount: 49.98,
            status: "Erledigt",
        },
        {
            id: "123456",
            vendorName: "One Unity",
            recipient: "OUC",
            barcode: "1234567",
            amount: 50.0,
            totalAmount: 59.5,
            status: "offen",
        },
        {
            id: "123456",
            vendorName: "One Unity",
            recipient: "OUC",
            barcode: "1234567",
            amount: 1200.3,
            totalAmount: 1428.36,
            status: "offen",
        },
    ],
});

context.returnValue = gadget.transfer();