<?php include_once(mvc::$cfg['PATH_TPL'] . 'public/headBase.php'); ?>
<div class="layui-fluid">
    <form class="layui-form">
        <?php if (isset($Params['level'])) { ?>
            <input type="hidden" name="level" value="<?php echo htmlspecialchars($Params['level']); ?>">
        <?php } ?>
        <?php if (isset($Params['brand_id'])) { ?>
            <input type="hidden" name="brand_id" value="<?php echo htmlspecialchars($Params['brand_id']); ?>">
        <?php } ?>
        <div class="layui-form-item">
            <div class="ayui-input-inline">
                <label class="layui-form-label">月份区间</label>
                <div class="layui-input-inline">
                    <input type="text" name="betime" id="betime" class="layui-input" placeholder=" ~ " value="<?php echo htmlspecialchars($Params['betime']); ?>">
                </div>
            </div>
            <div class="layui-input-inline" style="width:70px">
                <button class="layui-btn act-btn" lay-submit><i class="layui-icon layui-icon-search layuiadmin-button-btn"></i></button>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <a href="<?php echo mvc::$cfg['SELF_URI']; ?>tj/ypBrandCharts?preset=recent3<?php echo "&level=" . $Params['level'] . (isset($Params['brand_id']) ? "&brand_id=" . $Params['brand_id'] : ''); ?>" class="marr10 blue <?php if (isset($Params['preset']) && $Params['preset'] == 'recent3') echo ' active'; ?>">最近3个月</a>
                <a href="<?php echo mvc::$cfg['SELF_URI']; ?>tj/ypBrandCharts?preset=recent6<?php echo "&level=" . $Params['level'] . (isset($Params['brand_id']) ? "&brand_id=" . $Params['brand_id'] : ''); ?>" class="marr10 blue <?php if (isset($Params['preset']) && $Params['preset'] == 'recent6') echo ' active'; ?>">最近6个月</a>
            </div>
        </div>
    </form>
    <div style="margin-bottom: 10px;">
        <button class="layui-btn layui-btn-xs" id="btn_heapline">对比折线图</button>
        <button class="layui-btn layui-btn-xs" id="btn_export">导出</button>
        <span class="gray marl10"><b class="orange">热度</b>是基于跑街令、宜配网、目录等查询数据综合计算出来的数值，仅供参考。</span>
    </div>
    <div class="layui-form">
        <table class="YpTable layui-table" style="width: auto;overflow-x: auto;">
            <thead class="Filter Sortable">
                <tr>
                    <th width="20px">
                        <?php if ($Params['level'] === 'brand') { ?>
                            <input type="checkbox" lay-filter="lay-selectall" value="brand_id" lay-skin="primary" />
                        <?php } else if ($Params['level'] === 'series') { ?>
                            <input type="checkbox" lay-filter="lay-selectall" value="series_id" lay-skin="primary" />
                        <?php } else if ($Params['level'] === 'year') { ?>
                            <input type="checkbox" lay-filter="lay-selectall" value="year_id" lay-skin="primary" />
                        <?php } ?>
                    </th>
                    <?php foreach ($tableColumns as $Column) { ?>
                        <th class="Sort <?php echo $Column['name'] === '操作' ? 'no-filter' : ''; ?>" style="min-width: <?php echo $Column['width']; ?>px;"><?php echo $Column['name']; ?></th>
                    <?php } ?>
                </tr>
            </thead>
            <tbody>
                <?php foreach ($tableData as $brandData) { ?>
                    <tr>
                        <td>
                            <?php if ($Params['level'] === 'brand') { ?>
                                <input type="checkbox" name="brand_id" value="<?php echo $brandData['brand_id']; ?>" lay-skin="primary">
                            <?php } else if ($Params['level'] === 'series') { ?>
                                <input type="checkbox" name="series_id" value="<?php echo $brandData['series_id']; ?>" lay-skin="primary">
                            <?php } else if ($Params['level'] === 'year') { ?>
                                <input type="checkbox" name="year_id" value="<?php echo $brandData['year_id']; ?>" lay-skin="primary">
                            <?php } ?>
                        </td>

                        <td><?php echo $brandData['brand_name']; ?></td>
                        <?php if ($Params['level'] === 'series') { ?>
                            <td><?php echo $brandData['series_name']; ?></td>
                        <?php } else if ($Params['level'] === 'year') { ?>
                            <td><?php echo $brandData['year_name']; ?></td>
                            <td><?php echo $brandData['year']; ?></td>
                        <?php } ?>
                        <td><?php echo $brandData['rank']; ?></td>
                        <td><?php echo $brandData['percentage']; ?></td>
                        <td>
                            <button
                                id="single_line_statistic"
                                data-id="
                            <?php switch ($Params['level']) {
                                case 'brand':
                                    echo $brandData['brand_id'];
                                    break;
                                case 'series':
                                    echo $brandData['series_id'];
                                    break;
                                case 'year':
                                    echo $brandData['year_id'];
                                    break;
                            } ?>"
                                class="layui-btn layui-btn-xs">折线图</button>
                            <?php if ($Params['level'] === 'brand') { ?>
                                <?php foreach ($buttonList as $btn) { ?>
                                    <button id="detail_statistic" data-brand-id="<?php echo $brandData['brand_id']; ?>" data-params="<?php echo $btn['params']; ?>" data-brand-name="<?php echo $brandData['brand_name']; ?>" class="layui-btn layui-btn-xs"><?php echo $btn['name']; ?></a>
                                    <?php } ?>
                                <?php } ?>
                                <button
                                    class="layui-btn layui-btn-xs"
                                    id="btn_region"
                                    data-row-id="<?php
                                                    switch ($Params['level']) {
                                                        case 'brand':
                                                            echo $brandData['brand_id'];
                                                            break;
                                                        case 'series':
                                                            echo $brandData['series_id'];
                                                            break;
                                                        case 'year':
                                                            echo $brandData['year_id'];
                                                            break;
                                                    } ?>">按地区</button>
                        </td>
                        <td><?php echo $brandData['total_hot']; ?></td>

                        <?php foreach ($monthList as $month) { ?>
                            <td><?php echo $brandData[$month['value']]; ?></td>
                        <?php } ?>
                    </tr>
                <?php } ?>
            </tbody>
        </table>
        <?php echo $pageMsg; ?>
    </div>

</div>
<?php include_once(mvc::$cfg['PATH_TPL'] . 'public/footBase.php'); ?>
<script>
    layui.use(['index', 'senior', 'laydate', 'form'], function() {
        let $ = layui.$,
            form = layui.form,
            laydate = layui.laydate;

        // 使用layui form模块监听全选复选框，因为现在复选框在layui-form内
        form.on('checkbox(lay-selectall)', function(data) {
            let isChecked = data.elem.checked;

            // 根据不同级别选择对应的复选框
            let checkboxName = '';
            <?php if ($Params['level'] === 'brand') { ?>
                checkboxName = 'brand_id';
            <?php } else if ($Params['level'] === 'series') { ?>
                checkboxName = 'series_id';
            <?php } else if ($Params['level'] === 'year') { ?>
                checkboxName = 'year_id';
            <?php } ?>

            $('input[name="' + checkboxName + '"]').prop('checked', isChecked);
            form.render('checkbox');
        });

        // 配置月份区间选择器
        laydate.render({
            elem: '#betime',
            range: '~',
            type: 'month',
            min: '<?= $limitYear['minYear'] ?>',
            max: '<?= $limitYear['maxYear'] ?>',
            done: function(value, date, endDate) {
                if (value) {
                    value = value.split(' ~ ');
                    let startMonth = value[0].replace('-', '');
                    let endMonth = value[1].replace('-', '');
                    $('#betime').val(startMonth + ' ~ ' + endMonth);
                }
            }
        });

        // 点击表格单元格打开折线统计图弹窗
        $(document).on('click', '#btn_heapline', function() {
            let level = "<?php echo $Params['level']; ?>";
            let betime = "<?php echo $Params['betime']; ?>";

            let idParam = getSelectedIds(level);

            // 验证选中ID数量
            if (!idParam) {
                layer.msg('请至少选择一个项目！', {
                    icon: 2
                });
                return;
            }
            // if (selectedIds.length > 5) {
            //     layer.msg('最多只能选择5个项目！', {
            //         icon: 2
            //     });
            //     return;
            // }

            // 打开弹窗，引入折线图页面
            let url = SELF_URI + 'charts/stackedLineChart?' + "level=" + level + "&betime=" + betime;
            if (idParam) {
                url += '&' + idParam;
            }
            // 标识需要调用的函数
            url += '&func=getBrandChartsData';
            layer.open({
                type: 2,
                title: '对比折线图',
                shadeClose: true,
                shade: 0.8,
                area: ['70%', '70%'],
                content: url
            });
        });

        //点击导出选中数据
        $(document).on('click', '#btn_export', function() {
            let level = "<?php echo $Params['level']; ?>";
            let betime = "<?php echo $Params['betime']; ?>";
            // 若没有选中项，则默认导出所有数据（包括其他页面的）
            let idParam = getSelectedIds(level);
            let url = SELF_URI + 'tj/ypBrandCharts?' + "export=1" + "&" + idParam + "&level=" + level + "&betime=" + betime;
            <?php if ($Params['level'] !== 'brand') { ?>
                url += '&brand_id=' + <?php echo $Params['brand_id']; ?>;
            <?php } ?>
            window.open(url, '_blank');
        })

        //单一数据折线统计图
        $(document).on('click', '#single_line_statistic', function() {
            let level = "<?php echo $Params['level']; ?>";
            let betime = "<?php echo $Params['betime']; ?>";
            let brandId = $(this).data('id');
            let url = SELF_URI + 'charts/stackedLineChart?' + "level=" + level + "&betime=" + betime + "&ids=" + brandId;
            // 标识需要调用的函数
            url += '&func=getBrandChartsData';
            layer.open({
                type: 2,
                title: '折线统计图',
                shadeClose: true,
                shade: 0.8,
                area: ['70%', '65%'],
                content: url
            });
        })

        //点击同一品牌下的按车系、车代详细统计
        $(document).on('click', '#detail_statistic', function() {
            let betime = "<?php echo $Params['betime']; ?>";
            let brandId = $(this).data('brand-id');
            let params = $(this).data('params');
            let name = $(this).data('brand-name') + '-' + $(this).text();
            let url = SELF_URI + 'tj/ypBrandCharts?' + "betime=" + betime + "&brand_id=" + brandId + "&" + params;
            // 打开弹窗
            layer.open({
                type: 2,
                title: name,
                shadeClose: true,
                shade: 0.8,
                area: ['98%', '95%'],
                content: url
            });
        });

        //点击按地区按钮展示地图
        $(document).on('click', '#btn_region', function() {
            let level = "<?php echo $Params['level']; ?>";
            // 生成完整的月份数组
            let betime = "<?php echo $Params['betime']; ?>";
            let url = SELF_URI + 'tj/ypRegionCharts?' + "betime=" + betime + "&hideBrand=Y";
            //获取当前行id
            let currentId = $(this).data('row-id');

            if (level === 'brand') {
                url += '&brand=' + currentId;
            } else if (level === 'series') {
                url += '&mod1_id=' + currentId;
            } else if (level === 'year') {
                url += '&mod2_id=' + currentId;
            }

            layer.open({
                type: 2,
                title: '区域统计',
                shadeClose: true,
                shade: 0.8,
                area: ['95%', '95%'],
                content: url
            });
        });

        var getSelectedIds = function(level) {
            let selectedIds = [];
            let idParam = '';
            if (level === 'brand') {
                $('.layui-table').find('input[name="brand_id"]:checked').each(function() {
                    selectedIds.push($(this).val());
                });
                idParam = selectedIds.length > 0 ? 'ids=' + selectedIds.join(',') : '';
            } else if (level === 'series') {
                $('.layui-table').find('input[name="series_id"]:checked').each(function() {
                    selectedIds.push($(this).val());
                });
                idParam = selectedIds.length > 0 ? 'ids=' + selectedIds.join(',') : '';
            } else if (level === 'year') {
                $('.layui-table').find('input[name="year_id"]:checked').each(function() {
                    selectedIds.push($(this).val());
                });
                idParam = selectedIds.length > 0 ? 'ids=' + selectedIds.join(',') : '';
            }
            return idParam;
        }
    });
</script>