<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <link rel="stylesheet" href="../bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap-datetimepicker.css">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap-select.css">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap-treeview.css">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap-switch.min.css">
    <link rel="stylesheet" href="../css/sjcx.css">
    <link rel="stylesheet" href="../css/photoviewer.css">
    <link rel="stylesheet" href="../css/animate.css">
    <link rel="stylesheet" href="../css/noticejs.css">
    <!--<link rel="stylesheet" href="../css/viewer.min.css">-->
    <title>事件查询</title>
</head>
<body>
<div id="page-sy">
    <div class="right-nav">
        <div class="tab-content content-sjfx">
            <div role="tabpanel" class="tab-pane active" >
                <div class="div-left">
                    <div id="sjcx" class="div-right">
                        <span class="div-right-top">
                            <span class="pub-span">告警时间：</span>
                            <input type="text" class="form-control input-pub" id="kssj" style="width: 300px;" placeholder="请选择开始时间至结束时间">
                            <span class="pub-span" style="margin-left: 10px;">检测类型</span>
                            <select class="form-control selectpicker" multiple v-model="clzt_select">
                                 <option v-for="option in options" :value="option.value">
                                    {{ option.text }}
                                    </option>
<!--                                <option value="人员离岗" selected>重点人员离开检测</option>-->
<!--                                <option value="人员聚集" selected>车间通道人员聚集检测</option>-->
                            </select>
                        </span>
                        <button type="button" class="btn btn-sm pub-btn" style="margin-left: 30px;" id="querybtn" @click="getChange()">查询</button>
                        <div style="height:calc(94% - 30px);margin-top: 1px;" class="tables" >
                            <ul class="div-ul div-pub-gt" v-if="show">
                                <li v-for="(item,index) in data_table_wfpz">
<!--                                    <div style="position: absolute;right: 12px;top: 7px;border: 1px solid #e0e0e0;width: 18px;height: 18px;">-->
<!--                                        <input type="checkbox" name="loginName" class="loginName" :value="item.recordid+'|'+item.channelid+'|'+item.fdid+'|'+item.recordtime+'|'+item.recordtype"   @click="cli_input" style="width: 17px;height: 17px;margin-top: 0px;">-->
<!--                                    </div>-->
<!--                                    <div class="show-icon" :style="{'background':(item.processstatus==0||item.processstatus==null)?'#ff9c2b':(item.processstatus==2)?'#fc3939':(item.processstatus==1)?'#2fba08':'#cccccc'}" v-text="item.processstatus==0||item.processstatus==null?'未处理':item.processstatus==1?'正检':item.processstatus==2?'误检':'重复事件'"></div>-->
                                    <div class="li-top">
                                        <img :src="'/alarm/api/alg/files/'+item.checkJpg" @click="showimg('/alarm/api/alg/files/'+item.checkJpg)" style="width: 100%;height: 100%;cursor: zoom-in;">
                                    </div>
                                    <div class="li-center">
                                        <div >
                                            <span   v-for="(item1 ,index2) in item.labels" :style="{'background':getclolor(item1)}" style="font-size: 14px;   font-weight: bold;   padding: 4px;   color: #f7f0f1;margin-right: 3px">
                                                {{item1}}
                                            </span>

                                        </div>
                                        <div>
                                            <span v-text="item.time_norm" style="font-size: 14px;color: gray"></span>
                                        </div>
                                        <div>
                                            <span v-text="item.device_name" style="font-size: 14px;color: gray"></span>
                                        </div>

                                    </div>
<!--                                    <div class="li-bottom">-->
<!--                                        <img src="../img/sjcx/lssp.png" v-show="item.videopath==null?false:true">-->
<!--                                        <span @click="xq(item)">详情</span>-->
<!--                                    </div>-->
                                </li>
                            </ul>

                        </div>
                        <div class="div-right-buttom">
                            <div style="line-height: 64px;float: left;font-weight: 900;">
                                <span>共</span><span style="color: red;" v-text="count"></span><span>条</span>
                            </div>
                            <ul id="fy4" style="float: right;"></ul>
                            <div style="float: right;margin-top: 21px;margin-right: 30px;width: 111px;line-height: 36px;font-weight: 900;">
                                <span style="float: left;width: 34px;">每页</span>
                                <select class="form-control selectpicker" v-model="fy_select" style="width: 50px;padding: 0px 3px;float: left;"v-on:change="getChange()">
                                    <option>12</option>
                                    <option>21</option>
                                    <option>36</option>
                                    <option>42</option>
                                    <option>54</option>
                                </select>
                                <span style="float: left;margin-left: 8px;">条</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
</div>
    </div>
</div>
</body>
<script src="../js/jquery-3.1.1.min.js"></script>
<!--<script src="../js/viewer.min.js"></script>-->
<script src="../js/util/photoviewer.js"></script>
<script src="../bootstrap/js/bootstrap.js"></script>
<script src="../bootstrap/js/bootstrap-paginator.js"></script>
<script src="../bootstrap/js/bootstrap-treeview.js"></script>
<script src="../bootstrap/js/bootstrap-select.js"></script>
<script src="../bootstrap/js/bootstrap-switch.min.js"></script>
<!--<script src="../bootstrap/js/bootstrap-datetimepicker.js"></script>-->
<!--<script src="../bootstrap/js/bootstrap-datetimepicker.zh-CN.js"></script>-->
<script src="../js/laydate/laydate.js"></script>
<script src="../js/vue.js"></script>
<script src="../js/util/http_util.js"></script>
<script th:src="@{/lib/layui/layui.js}"></script>
<script src="../js/sjcx/sjcxjs.js"></script>

</html>