<?xml version="1.0" encoding="UTF-8" ?>
<templates xml:space="preserve">

    <div
        t-name="stock_barcodes.MainMenu"
        class="d-flex flex-column stock-barcodes-main-menu align-items-center p-4"
        owl="1"
    >
        <div
            class="d-flex o_stock_barcode_header_home justify-content-between align-items-center w-100"
        >
            <a href="#" t-on-click="mainMenuHome">
                <i class="fa fa-chevron-left fa-2x" />
            </a>
            <h1 class="mb-4">Barcode Scanner</h1>
        </div>
        <div
            class="alert alert-info alert-dismissible fade show w-100 fs-3 o_stock_barcode_description"
            role="alert"
        >
            Scan a barcode actions
        </div>
        <div
            class="d-flex justify-content-center w-100 mt-3 px-2 o_stock_barcode_buttons"
        >
            <div class="row w-100">
            <t
                    t-foreach="this.barcodeActions"
                    t-as="barcodeAction"
                    t-key="barcodeAction.id"
                >
                <div class="col-12 col-md-6">
                    <button
                            class="btn btn-primary btn-lg w-100 mt-3 text-uppercase"
                            t-on-click="() => this.openAction(barcodeAction.id)"
                        >
                        <span t-attf-class="#{barcodeAction.icon_class} mx-2" />
                        <t t-out="barcodeAction.name" />
            </button>
                </div>
            </t>
            </div>
        </div>
    </div>
</templates>
