<link rel="stylesheet" href="<?php echo base_url(); ?>public/css/vendor/bootstrap/bootstrap-table.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>public/css/vendor/bootstrap/table-fix-column.css">

<script src="<?php echo base_url(); ?>public/js/vendor/bootstrap/src/bootstrap-table.js"></script>
<script src="<?php echo base_url(); ?>public/js/vendor/bootstrap/src/table-fix-column.js"></script>
<!-- Select2 -->
<link rel="stylesheet" href="<?php echo base_url(); ?>public/js/vendor/select2/select2.min.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>public/node_modules/bootstrap-select/dist/css/bootstrap-select.min.css">
<script src="<?php echo base_url(); ?>public/node_modules/bootstrap-select/dist/js/bootstrap-select.min.js"></script>

<style type="text/css">
    table {
        table-layout: fixed !important;
    }

    th {
        background: rgb(146, 208, 80);
    }

    td, th {
        max-width: 400px;
        word-wrap: break-word;
    }

    .table-hover > tbody > tr:hover {
        background-color: #c8bd6d;
    }

    input {
        width: 60px;
    }

    #roleTable tr:nth-child(5n) {
        background: rgb(198, 239, 206);
    }

    /**隔五行*/

    .fixed-table-toolbar {
        display: none;
    }

    .fileinput-button {
        position: relative;
        top: -5px;
    }

    .fileinput-button input {
        position: absolute;
        right: 0px;
        top: 0px;
        opacity: 0;
        -ms-filter: 'alpha(opacity=0)';
    }
</style>
<div class="content_wrapper">
    <div class="container-fluid ">
        <div class="row">
            <div class="col-sm-12">
                <aside>
                    <header><i class="fa fa-fw fa-file"></i>体力不足弹窗配置</header>
                    <section>
                        <div class="container-fluid">
                            <div style="margin-bottom: 10px;">
                                <button type="button" style="width: 80px;" class="btn btn-primary commitBtn" id="commitBtn">提交</button>
                            </div>
                            <div class="table-responsive">
                                <form action="" id="unfitnessPopConf">
                                    <table id="roleTable_1" class="table table-bordered table-hover roleTable">
                                        <thead>
                                        <tr>
                                            <td width="200">等级下限</td>
                                            <td width="200">等级上限</td>
                                            <td >数数分组</td>
                                            <td width="200">优先级</td>
                                            <td>弹出礼包</td>
                                        </tr>
                                        </thead>
                                        <tbody id="popWindowsConf">
                                        <?php
                                        if (is_array($list) && !empty($list)) {
                                            $ssOptions = '';
                                            foreach ($ssGroupList as $key => $val) {
                                                $ssOptions .= '<option value="' . $key . '">' . $val . '</option>';
                                            }
                                            foreach ($list as $key => $val) {
                                                $options = '';
                                                foreach (json_decode($activityList, true) as $activity => $name) {
                                                    $sel = $val['activity'] == $activity ? 'selected' : '';
                                                    $options .= '<option value="' . $activity . '" ' . $sel . '>' . $name . '</option>';
                                                }
                                                $index = $key + 1;
                                                echo '<tr id="popConfTr_' . $key . '" data-idx="' . $key . '">';
                                                echo '<td><input type="number" class="form-control" name="conf[' . $key . '][lvMin]" value="' . $val['lvMin'] . '"></td>';
                                                echo '<td><input type="number" class="form-control" name="conf[' . $key . '][lvMax]" value="' . $val['lvMax'] . '"></td>';
                                                echo '<td><select multiple class="form-control selectpicker show-tick" name="conf[' . $key . '][ssGroup][]">' . $ssOptions . '</select></td>';
                                                echo '<td><input type="number" class="form-control" name="conf[' . $key . '][priority]" value="' . $val['priority'] . '"></td>';
                                                echo '<td><select class="form-control" name="conf[' . $key . '][activity]">' . $options . '</select></td>';
                                                echo '</tr>';
                                            }
                                        }
                                        ?>
                                        </tbody>
                                        <tr>
                                            <td colspan="5">
                                                <div class="text-center" style="margin-top: 20px">
                                                    <botton class="btn btn-primary addConfTr" onclick="addConfTr()">添加
                                                    </botton>
                                                    <botton class="btn btn-danger del-tr" onclick="delConfTr(this)">删除</botton>
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </form>
                            </div>
                        </div>
                    </section>
                </aside>
            </div>
        </div>
    </div>
</div>

<script>
    activityList =<?php echo $activityList; ?>;
    ssGroupList =<?php echo json_encode($ssGroupList); ?>;
    list =<?php echo json_encode($list); ?>;
    $.each(list, (k, v) => {
        $(`select[name="conf[${k}][ssGroup][]"]`).selectpicker('val', v["ssGroup"]);
    })

    function addConfTr() {
        let lvIdx = $('#popWindowsConf').find('tr:last').data('idx')
        lvIdx = lvIdx === undefined ? 0 : parseInt(lvIdx) + 1

        let options = '';
        $.each(activityList, (k, v) => {
            options += `<option value="${k}" >${v}</option>`
        })

        let ssOptions = '';
        $.each(ssGroupList, (k, v) => {
            ssOptions += `<option value="${k}" >${v}</option>`
        })

        const html = `
        <tr id="popConfTr_${lvIdx}"  data-idx="${lvIdx}">
            <td><input name="conf[${lvIdx}][lvMin]" type="number"  class="form-control" value="0"></td>
            <td><input name="conf[${lvIdx}][lvMax]" type="number"  class="form-control" value="0"></td>
            <td><select name="conf[${lvIdx}][ssGroup][]" multiple class="form-control selectpicker show-tick" >${ssOptions}</select></td>
            <td><input name="conf[${lvIdx}][priority]" type="number"  class="form-control" value="0"></td>
            <td><select name="conf[${lvIdx}][activity]" class="form-control" >${options}</select></td>
        </tr>`;

        $('#popWindowsConf').append(html)
        $(`select[name="conf[${lvIdx}][ssGroup][]"]`).selectpicker('val', []);
    }

    function delConfTr() {
        const lvIdx = $('#popWindowsConf').find('tr:last').data('idx')
        $('#popConfTr_' + lvIdx).remove()
    }


    //提交表格数据
    $('.commitBtn').click(function () {
        const datas = $('#unfitnessPopConf').toObject();
        showLoading()
        $.ajax({
            type: 'POST',
            dataType: 'json',
            data: datas,
            url: 'newShop/unfitnessPopConfigUpdate',
            success: function (data) {
                hideLoading()
                if (data.ret == 0) {
                    window.location.reload()
                } else {
                    msgTip.messager().error(data.msg);
                }
            },
            error: function (xhr, error) {
                alert('请求失败！')
                hideLoading()
                console.log(xhr, error);
            }
        });
    });

</script>

