<?php
require_once __DIR__ . "/../core/Common.php";
require_once __DIR__ . "/../report/classes/ItemsPegavisionStockClass.php";

function getValue($value)
{
    return empty($value) ? 0 : $value;
}

$itemsPegavisionStock = new ItemsPegavisionStock();
$result = $itemsPegavisionStock->getStock();
$locations = $itemsPegavisionStock->getLocation();

$column = 0;
$row = count($locations);

foreach ($result as $brand => $products)
    $column = $column > count($products) ? $column : count($products);

$column *= 2;
$column += 2;

$options = [
    '0.00D',
    '-0.50D',
    '-0.75D',
    '-1.00D',
    '-1.25D',
    '-1.50D',
    '-1.75D',
    '-2.00D',
    '-2.25D',
    '-2.50D',
    '-2.75D',
    '-3.00D',
    '-3.25D',
    '-3.50D',
    '-3.75D',
    '-4.00D',
    '-4.25D',
    '-4.50D',
    '-4.75D',
    '-5.00D',
    '-5.25D',
    '-5.50D',
    '-5.75D',
    '-6.00D',
    '-6.50D',
    '-7.00D',
    '-7.50D',
    '-8.00D',
    '-8.50D',
    '-9.00D',
    '-9.50D',
    '-10.00D',
    '-10.50D',
    '-11.00D',
    '-11.50D',
    '-12.00D'
]
?>
<style>
    body {
        font-family: "微軟正黑體";
    }

    td, th {
        box-sizing: border-box;
    }

    table.report {
        font-size: 12px;
        border-spacing: 0;
        border-collapse: collapse;
        border: 0px solid #ccc;
    }

    table.report thead {
        position: relative;
        border-bottom: 1px solid #ccc;
        background-color: #fff;
        z-index: 100;
    }

    table.report tbody {
        position: relative;
        overflow-y: scroll;
    }

    table.report tbody .item {
        height: 0;
    }

    table.report th.title {
        background-color: #E2DFDF;
        font-size: 16px;
        padding: 5px 0px;
    }

    table.report td {
        padding: 2px 5px;
        border-bottom: 1px solid #ccc;
        background-color: #FFF;
        border-left: 1px solid #ccc;
    }

    table.report .brand {
        background-color: #E8EBFF;
        text-align: left;
        font-weight: bold;
        padding: 5px;
        border-left: 1px solid #ccc !important;
        border-bottom: 3px double #ccc;
    }

    table.report .data td,
    table.report .center {
        text-align: center;
        vertical-align: middle;
    }

    table.report .total td {
        border-top: 3px double #000 !important;
        border-bottom: 3px double #000 !important;
    }

    table.report .location {
        padding: 1px 3px;
        font-size: 10px;
    }

    table.report .total-label {
        width: 40px;
        text-align: center;
        vertical-align: middle;
    }

    table.report .location-label {
        width: 40px;
        padding: 1px;
        font-size: 10px;
        text-align: center;
        vertical-align: middle;
    }

    table.report .number {
        text-align: right;
    }

    table.report .highlight {
        background-color: #ffd;
    }

    table.report .highlight-focus {
        background-color: #ffa;
    }

    table.report .total:not(:nth-last-of-type(1)) .location {
        border-bottom: 1px dotted #ccc !important;
    }

    table.report .total:not(:nth-last-of-type(<?php echo $row ?>)) .location {
        border-top: 1px dotted #ccc !important;
    }
</style>
<?php include __DIR__ . "/../core/incAdminMsgDialog.php"; ?>
<div class="contentListWrapper">
    <?php include __DIR__ . "/../core/incAdminListPageHiddenField.php"; ?>
    <div class="navHeader">
        <span class="title">REPORT / </span> <span class="subTitle">ITEMS PEGAVISION STOCK REPORT</span>
    </div>
    <div class="filterWrapper floatLeft" style="width:100%; background-color:#fff;">
        <div class="fieldWrapper noBackground floatLeft" style="float:left">
            <div class="content">
                <div class="field">
                    <a class="awesome big" href="javascript:tableToExcel('table', 'OverallSalesReport')">Download</a>
                </div>
            </div>
        </div>
    </div>
    <?php ?>

    <table id="table" class="report">
        <thead>
        <tr>
            <th colspan="<?php echo $column ?>" class="title">Pegavision Stock Report</th>
        </tr>
        <?php foreach ($result as $brand => $products): ?>
            <tr>
                <td class="brand" colspan="<?php echo $column ?>"><?php echo $brand ?></td>
            </tr>
        <?php endforeach; ?>
        <?php foreach ($result as $brand => $products): ?>
            <tr class="item">
                <td class="center total-label" rowspan="<?php echo $row ?>">Total</td>
                <td class="location-label"><?php echo $locations[0]['location'] ?></td>
                <?php foreach ($products as $product => $data): ?>
                    <td colspan="2" rowspan="<?php echo $row ?>"
                        data-product="<?php echo $product ?>"><?php echo $product ?></td>
                <?php endforeach; ?>
            </tr>

            <?php foreach ($locations as $index => $location): ?>
                <?php if ($index != 0): ?>
                    <tr class="item">
                        <td class="location-label"><?php echo $location['location'] ?></td>
                    </tr>
                <?php endif; ?>
            <?php endforeach; ?>
        <?php endforeach; ?>
        </thead>

        <tbody>
        <?php foreach ($result as $brand => $products): ?>
            <tr class="item">
                <td class="center total-label" rowspan="<?php echo $row ?>">Total</td>
                <td class="location-label"><?php echo $locations[0]['location'] ?></td>
                <?php foreach ($products as $product => $data): ?>
                    <td colspan="2" rowspan="<?php echo $row ?>"
                        data-product="<?php echo $product ?>"><?php echo $product ?></td>
                <?php endforeach; ?>
            </tr>

            <?php foreach ($locations as $index => $location): ?>
                <?php if ($index != 0): ?>
                    <tr class="item">
                        <td class="location-label"><?php echo $location['location'] ?></td>
                    </tr>
                <?php endif; ?>
            <?php endforeach; ?>

            <?php foreach ($options as $option): ?>
                <tr class="data">
                    <td colspan="2" rowspan="<?php echo $row ?>"
                        data-option="<?php echo $option ?>"><?php echo $option ?></td>
                    <?php foreach ($products as $product => $data): ?>
                        <td class="hover" rowspan="<?php echo $row ?>" data-option="<?php echo $option ?>"
                            data-product="<?php echo $product ?>"><?php echo getValue($data['度數'][$option]['total']) ?></td>
                        <td class="hover location" data-option="<?php echo $option ?>"
                            data-product="<?php echo $product ?>"><?php echo getValue($data['度數'][$option][$locations[0]['location']]) ?></td>
                    <?php endforeach; ?>
                </tr>

                <?php foreach ($locations as $index => $location): ?>
                    <?php if ($index != 0): ?>
                        <tr class="data">
                            <?php foreach ($products as $product => $data): ?>
                                <td class="hover location" data-option="<?php echo $option ?>"
                                    data-product="<?php echo $product ?>"><?php echo getValue($data['度數'][$option][$location['location']]) ?></td>
                            <?php endforeach; ?>
                        </tr>
                    <?php endif; ?>
                <?php endforeach; ?>
            <?php endforeach; ?>

            <tr class="total">
                <td class="center" colspan="2" rowspan="<?php echo $row ?>">Total</td>
                <?php foreach ($products as $product => $data): ?>
                    <td class="center number" rowspan="<?php echo $row ?>"><?php echo $data['度數']['count']['total'] ?></td>
                    <td class="location number"><?php echo $data['度數']['count'][$locations[0]['location']] ?></td>
                <?php endforeach; ?>
            </tr>

            <?php foreach ($locations as $index => $location): ?>
                <?php if ($index != 0): ?>
                    <tr class="total">
                        <?php foreach ($products as $product => $data): ?>
                            <td class="location number"><?php echo $data['度數']['count'][$location['location']] ?></td>
                        <?php endforeach; ?>
                    </tr>
                <?php endif; ?>
            <?php endforeach; ?>
        <?php endforeach; ?>
        </tbody>
    </table>
</div>
<script>
    function tableToExcel(table, name) {
        var uri = 'data:application/vnd.ms-excel;base64,';
        var template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">' +
            '<head>' +
            '<!--[if gte mso 9]>' +
            '<xml>' +
            '<x:ExcelWorkbook>' +
            '<x:ExcelWorksheets>' +
            '<x:ExcelWorksheet>' +
            '<x:Name>' +
            '{worksheet}' +
            '</x:Name>' +
            '<x:WorksheetOptions>' +
            '<x:DisplayGridlines/>' +
            '</x:WorksheetOptions>' +
            '</x:ExcelWorksheet>' +
            '</x:ExcelWorksheets>' +
            '</x:ExcelWorkbook>' +
            '</xml>' +
            '<![endif]-->' +
            '</head>' +
            '<body>' +
            '<table>' +
            '{table}' +
            '</table>' +
            '</body>' +
            '</html>';

        function base64(s) {
            return window.btoa(unescape(encodeURIComponent(s)))
        }

        function format(s, c) {
            return s.replace(/{(\w+)}/g, function (m, p) {
                return c[p];
            })
        }

        if (!table.nodeType) {
            table = document.getElementById(table);
        }
        var ctx = {
            worksheet: name || 'Worksheet',
            table: table.innerHTML
        };

        window.location.href = uri + base64(format(template, ctx))
    }

    $(document).ready(function () {
        var thead = $('#table thead');
        var tbody = $('#table tbody');

        function setWidth() {
            var marginTop = -1 * (tbody.find('.item td:eq(0)').height() + 6) + 'px';
            var width = tbody.prop('scrollWidth') + 1;

            if (tbody.css('margin-top') != marginTop)
                tbody.css('margin-top', marginTop);

            if (thead.width() != width) {
                thead.width(width);
                $('.total-label', thead).width(tbody.find('.total-label').width());
                $('.location-label', thead).width(tbody.find('.location-label:eq(0)').width());

                $('.item [data-product]', tbody).each(function (index, item) {
                    item = $(item);
                    $('.item [data-product="' + item.data('product') + '"]', thead).width(item.width());
                });
            }
        }

        function setHeight() {
            tbody.height(window.innerHeight);
            tbody.height(2 * window.innerHeight - document.body.scrollHeight);
        }

        setWidth();
        setHeight();
        setInterval(setWidth, 100);
        $(window).on('resize', setHeight);

        var td = $('[data-option], [data-product]');

        tbody.on('mouseleave', '.hover', function () {
            var data = $(this).data();
            td.removeClass('highlight');
            $('[data-option="' + data.option + '"][data-product="' + data.product + '"]').removeClass('highlight-focus');
        });

        tbody.on('mouseenter', '.hover', function () {
            var data = $(this).data();
            $('[data-option="' + data.option + '"], [data-product="' + data.product + '"]').addClass('highlight');
            $('[data-option="' + data.option + '"][data-product="' + data.product + '"]').addClass('highlight-focus');
        });
    });
</script>