{% load staticfiles %} {% if jkphoto|length %}
<div class="popup-gallery">
    {% for i in jkphoto %}
    <div class="imgParent">
        <a class="popupA" href="{{ i.addr }}" title="path: {{ i.addr }}">
            <img src="{{ i.addr }}" width="300" height="300">
            <p>{{ i.upl_time }} </p>
        </a>
        <input type="hidden" value="{{i.equip_id}}">
        <input type="hidden" class="photoTime" value="{{i.upl_time}}">
        <!-- 管理员显示删除图片按钮 -->
        {% if current_user.is_superuser == True or current_user.is_staff == True %}
        <span class="delBtn" onclick="del($(this))"></span>
        {% else %} {% endif %}
        <a href="#lookDescribe" class="open-popup-link lookDetial">病害识别</a>
        <!-- 最新识别 -->
        <!-- <div> -->
        <label class="imgcheckbox">
            <input type="checkbox" class="check" onclick="checkAllSelect()" value="2014" name="check_box_list">
            <span></span>
        </label>
        <!-- </div> -->
    </div>
    {% endfor %}
</div>
{% else %}
<div class="nullData">暂无数据</div>
{% endif %}


<div style="clear:both"></div>
<input type="hidden" id="selectListPage" value="{{nums}}">
<script src="{% static '/lib/js/jquery.magnific-popup.js' %}" type="text/javascript"></script>
<script src="{% static '/js/equipmanage/jk_imageList.js' %}?versions=0.5.4" type="text/javascript"></script>
<script>
    var parentUserName = $('#parentUserName', parent.document).html();
    // if(!(parentUserName == '云飞展示账号')){
    // 	$('#takephotoShowBtn').remove();
    // }
    if (!(parentUserName == 'admin' || parentUserName == 'user')) {
        $('.simulation').remove();
    } else {
        $('.simulation').show();
    }
    var topicid = [];        //imei数组
    // 单个复选框
    function checkAllSelect() {
        $('.check').each(function () {
            if ($(this).prop("checked") == true) {
                if (!contains(topicid, $(this).parents('.imgParent').find('img').attr('src'))) {
                    topicid.push($(this).parents('.imgParent').find('img').attr('src'));
                }
            } else {
                removeByValue(topicid, $(this).parents('.imgParent').find('img').attr('src'));
            }
        });
        console.log(topicid)
    }
    //移除数组元素
    function removeByValue(arr, val) {
        for (var i = 0; i < arr.length; i++) {
            if (arr[i] == val) {
                arr.splice(i, 1);
                break;
            }
        }
    }
    //判断数组中是否包含元素
    function contains(arr, obj) {
        var i = arr.length;
        while (i--) {
            if (arr[i] === obj) {
                return true;
            }
        }
        return false;
    }
    // 刷新页面
    function reload() {
        var page = $('.layui-laypage-curr em').eq(1).html() || 1;
        $.ajax({
            url: 'cbd_img_list?imei=' + $('#imei').val() + '&page=' + page,
            type: 'get',
            success: function (data) {
                $('#imgList').html('');
                $('#imgList').html(data);
                if ($('.content').height() > 750) {
                    $('#iframe-main', parent.document).css('height', $('.content').height() + 20)
                } else {
                    $('#iframe-main', parent.document).css('height', '750px')
                }
                canceldelimg(document.getElementById('canceldel'))
            }
        })
    }
    // console.log($('#selectListPage').val())
    var dat = {
        imei: $('#imei').val(),
        page: 1,
        limit: 8,
        begin: $('#begin').val(),
        end: $('#end').val()
    }
    initSearchPage($('#selectListPage').val(), 'jk_image', dat, 1)
    // 时间段查询
    function img_filter() {
        var discern = $('#discern').val();
        var selectListPage = $('#selectListPage').val();
        // console.log($('#selectListPage').val())
        var begin = $('#begin').val();
        var end = $('#end').val();
        if (!begin || !end) {
            layui.use('laypage', function () {
                var layer = layui.layer;
                layer.msg('请输入时间段！')
            })
            return false;
        }

        var datas = {
            imei: $('#imei').val(),
            page: 1,
            limit: 8,
            begin: begin,
            end: end
        }
        console.log(1)
        $.ajax({
            url: 'jk_image',
            type: 'post',
            data: datas,
            success: function (data) {
                $('#imgList').html('');
                $('#imgList').html(data);
                if ($('#selectListPage').val() > 0) {
                    $('.nullData').hide();
                    $('#page').parent().show();
                } else {
                    $('.nullData').show();
                    $('#page').parent().hide();
                }
                initSearchPage($('#selectListPage').val(), 'jk_image', datas, 1)
            }
        })
    }
    //用户搜索分页
    function initSearchPage(page, url, datas, currpage) {
        if (page > 0) {
            layui.use('laypage', function () {
                var laypage = layui.laypage;
                laypage.render({
                    elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
                    // , count: 30
                    , count: page
                    , curr: currpage
                    , theme: '#428BCA'
                    , layout: ['prev', 'page', 'next', 'skip']
                    , jump: function (obj, first) {
                        datas.page = obj.curr;
                        if (!first) {
                            $.ajax({
                                url: url,
                                type: 'post',
                                data: datas,
                                success: function (data) {
                                    $('#imgList').html('');
                                    $('#imgList').html(data);
                                    if ($('#selectListPage').val() > 0) {
                                        $('.nullData').hide();
                                        $('#page').parent().show();
                                    } else {
                                        $('.nullData').show();
                                        $('#page').parent().hide();
                                    }
                                    initSearchPage($('#selectListPage').val(), 'jk_image', datas, obj.curr)
                                }
                            })
                        }
                    }
                });
            });
        }

    }
</script>