<?php
/**
 * @var \yii\web\View $this
 * @var array $params
 * @var array $data
 */
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>BIT System 后台管理平台</title>
    <?= $this->render('/common/css_js_main'); ?>
    <script src="<?= STATIC_URL ?>/static/cp/plugin-datatables/date/bootstrap-datetimepicker.min.js"></script>
    <script src="<?= STATIC_URL ?>/static/cp/plugin-datatables/date/locales/bootstrap-datetimepicker.zh-CN.js"></script>
</head>
<body id="main">
<div class="main-nav"> <span class="fn-left">微信群列表 总记录数: <?= $data['totalCount'] ?> (共<?= $data['pageCount'] ?>页)</span> <span class="fn-right"><a href="javascript:history.go(-1);"><i class="icon-chevron-left"></i>返回</a></span>
    <div class="fn-clear"></div>
</div>
<form id="list-form" action="/cp/group/list" method="get">
    <div class="main-content">
        <div class="main-action-bar">
            <a class="btn fn-left" href="/cp/group/add"><i class="icon-plus"></i>添加</a>
            
            <div class="form-group" style="display: inline; float: left;">
                创建时间：
                <input type="text" class="form-control span2" name="create_time_start" id="create_time_start"  data-date-format="yyyy-mm-dd" value="<?= $params['create_time_start'] ?>">
                -
                <input type="text" class="form-control span2" name="create_time_end" id="create_time_end" placeholder="
" data-date-format="yyyy-mm-dd" value="<?= $params['create_time_end'] ?>">
                &nbsp;&nbsp;更新时间：
                <input type="text" class="form-control span2" name="update_time_start" id="update_time_start" placeholder="
" data-date-format="yyyy-mm-dd" value="<?= $params['update_time_start'] ?>">
                -
                <input type="text" class="form-control span2" name="update_time_end" id="update_time_end" placeholder="
" data-date-format="yyyy-mm-dd" value="<?= $params['update_time_end'] ?>">
                &nbsp;&nbsp;二维码有效时间：
                <input type="text" class="form-control span2" name="qrcode_expire_start" id="qrcode_expire_start" placeholder="
" data-date-format="yyyy-mm-dd" value="<?= $params['qrcode_expire_start'] ?>">
                -
                <input type="text" class="form-control span2" name="qrcode_expire_end" id="qrcode_expire_end" placeholder="
" data-date-format="yyyy-mm-dd" value="<?= $params['qrcode_expire_end'] ?>">
            </div>
            <span class="fn-left">&nbsp;&nbsp;群名称</span>
            <input type="text" name="group_name" value="<?= $params['group_name'] ?>" class="input-medium search-query fn-left" autocomplete="off" placeholder="请输入群名称">
            
            <button id="search-button" type="submit" class="btn fn-left">搜索</button>
            
            <div style="display: inline; float: right;">
                &nbsp;&nbsp;每页显示：
                <select name="pageSize" id="page-size" class="span1">
                    <option value="10" <?= $params['pageSize'] == 10 ? 'selected="selected"' : '' ?> >
                        10
                    </option>
                    <option value="20" <?= $params['pageSize'] == 20 ? 'selected="selected"' : '' ?> >
                        20
                    </option>
                    <option value="50" <?= $params['pageSize'] == 50 ? 'selected="selected"' : '' ?> >
                        50
                    </option>
                    <option value="100" <?= $params['pageSize'] == 100 ? 'selected="selected"' : '' ?> >
                        100
                    </option>
                </select>
            </div>
            
            <div style="display: inline; margin-left: 30px;">
                <label for="get_current_group" style="display: inline;">只显示当前微信群</label>
                <input type="checkbox" id="get_current_group" value="1" /> 
            </div>
        </div>
        <div class="form-or-table">
            <table id="list-table" class="table table-striped table-bordered">
                <thead>
                <tr>
                    <th class="table-checkbox"><input type="checkbox" class="all-check"></th>
                    <th><a href="javascript:;" class="sort" name="id">ID</a></th>
                    <th><a href="javascript:;" class="sort" name="group_name">微信群名称</a></th>
                    <th><a href="javascript:;" name="group_logo">微信群logo</a></th>
                    <th><a href="javascript:;" name="group_qrcode">活动页群二维码</a></th>
                    <th><a href="javascript:;" class="sort" name="group_link">微信群链接</a></th>
                    <th><a href="javascript:;" class="sort" name="qrcode_expire">二维码有效时间</a></th>
                    <th><a href="javascript:;" class="sort" name="scan_count">已扫码次数</a></th>
                    <th><a href="javascript:;" class="sort" name="sort">排序</a></th>
                    <th><a href="javascript:;" class="sort" name="is_enable">启用</a></th>
                    <th><a href="javascript:;" class="sort" name="create_time">创建时间</a></th>
                    <th><a href="javascript:;" class="sort" name="update_time">更新时间</a></th>
                    <th class="table-action">操作</th>
                </tr>
                </thead>
                <tbody>
                <?php if (!empty($data['dataList'])) : ?>
                    <?php foreach ($data['dataList'] as $k => $v) : ?>
                        <tr <?= $v['is_current'] ? 'class="is_current"' : '' ?> >
                            <td><input name="ids" type="checkbox" value="<?= $v['id'] ?>"></td>
                            <td><?= $v['id'] ?></td>
                            <td><?= $v['group_name'] ?></td>
                            <td><a href="<?= $v['group_logo'] ?>" target="_blank"><img src="<?= $v['group_logo'] ?>" width="180px" height="180px" /></a></td>
                            <td><a href="<?= $v['group_qrcode'] ?>" target="_blank"><img src="<?= $v['group_qrcode'] ?>" width="180px" height="180px" /></a></td>
                            <td><a href="<?= $v['group_link'] ?>" target="_blank"><?= $v['group_link'] ?></a></td>
                            <td><?= $v['qrcode_expire'] ?></td>
                            <td><?= $v['scan_count'] ?></td>
                            <td><?= $v['sort'] ?></td>
                            <td><?= $v['is_enable'] ?></td>
                            <td><?= $v['create_time'] ?></td>
                            <td><?= $v['update_time'] ?></td>
                            <td><a href="/cp/group/edit?id=<?= $v['id'] ?>"><i class="icon-edit"></i> 编辑</a></td>
                        </tr>
                    <?php endforeach; ?>
                <?php else : ?>
                    <tr><td colspan="7">没有数据</td></tr>
                <?php endif; ?>
                </tbody>
            </table>
            
            <a id="delete-button" class="btn fn-left" url="/cp/group/delete" disabled=""><i class="icon-trash"></i> 删除</a>

            <?php if ($data['pageCount'] > 1) : ?>
                <div class="main-footer-action-bar">
                    <?= $this->render('/common/pager', ['pageCount' => $data['pageCount'], 'baseUrl' => '/' . Yii::$app->request->getPathInfo()]) ?>
                </div>
            <?php endif; ?>
        </div>
    </div>
    <input type="hidden" name="pageNumber" id="page-number" value="<?= $params['pageNumber'] ?>" />
    <input type="hidden" name="orderBy" id="order-by" value="<?= $params['orderBy'] ?>" />
    <input type="hidden" name="order" id="order" value="<?= $params['order'] ?>" />
</form>

<div id="delete-modal" class="modal hide fade" style="display: none; ">
    <div class="modal-header"> <a class="close" data-dismiss="modal">×</a>
        <p><strong>您确定要删除吗?</strong></p>
    </div>
    <div class="modal-body">
        <p>删除之后将不可恢复,请确定!</p>
    </div>
    <div class="modal-footer"> <a href="javascript:;" id="delete-modal-sure-btn" class="btn btn-primary">确定</a> <a href="javascript:;" class="btn" data-dismiss="modal">返回</a> </div>
</div>

<script type="text/javascript">
$(function () {
    $('.is_current td').css('background', '#66CCFF');
    
    var datetime_options = {
        minView: 'month',
        format: 'yyyy-mm-dd',
        language: 'zh-CN',
        todayBtn: true,
        autoclose: true,
        todayHighlight: true
    };
    $('#create_time_start, #create_time_end, #update_time_start, #update_time_end, #qrcode_expire_start, #qrcode_expire_end').datetimepicker(datetime_options);
    
    var old_html = '';
    $('#get_current_group').change(function () {
        if (!old_html) {
            old_html = $('#list-table tbody').html();
        }
        
        var prop = $(this).prop('checked');
        if (prop) {
            $.get('/cp/group/get-current-group', {}, function (res) {
                if (res.code == 1) {
                    var data = res.data;
                    var html = '';
                    html += '<tr class="is_current">';
                    html += '<td><input name="ids" type="checkbox" value="' + data.id + '"></td>';
                    html += '<td>' + data.id + '</td>';
                    html += '<td>' + data.group_name + '</td>';
                    html += '<td><a href="' + data.group_logo + '" target="_blank"><img src="' + data.group_logo + '" width="180px" height="180px" /></a></td>';
                    html += '<td><a href="' + data.group_qrcode + '" target="_blank"><img src="' + data.group_qrcode + '" width="180px" height="180px" /></a></td>';
                    html += '<td><a href="' + data.group_link + ' target="_blank">' + data.group_link + '</a></td>';
                    html += '<td>' + data.qrcode_expire + '</td>';
                    html += '<td>' + data.scan_count + '</td>';
                    html += '<td>' + data.sort + '</td>';
                    html += '<td>' + data.is_enable + '</td>';
                    html += '<td>' + data.create_time + '</td>';
                    html += '<td>' + data.update_time + '</td>';
                    html += '<td><a href="/cp/group/edit?id=' + data.id + '"><i class="icon-edit"></i> 编辑</a></td>';
                    html += '</tr>';
                    $('#list-table tbody').html(html);
                    $('.is_current td').css('background', '#66CCFF');
                }
            }, 'json');
        } else {
            $('#list-table tbody').html(old_html);
            $('.is_current td').css('background', '#66CCFF');
        }
    });
});
</script>
</body> 
</html>