<!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/jkglsj.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" id="rwpfhistory">
                <div class="div-left" >
                    <div class="div-xzml">
                        <!--<span class="xzxq">行政辖区</span>-->
                        <input type="text" class="form-control input-pub" placeholder="请输入点位 回车搜索" v-model="searchText"
                               style="width: calc(100% - 20px);margin-left: 10px;margin-bottom: 10px;" @keyup.enter="fastSearch">
                        <div class="div-xzml-div">
                            <img src="../img/sjcx/xzml.png">
                            <span>监控目录</span>
                        </div>
                        <div id="tree-xzxq" style="height: calc(100% - 80px);overflow-x: auto;float: left;width: 100%;"></div>
                    </div>
                    <div id="rwpfhistory_s" class="div-right">
                        <span class="div-right-top" style="padding-left: 10px">
                            <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" v-model="taskwpmodel_select">
                                  <option v-for="(item,index) in taskwp_select" :key="index"
                                          :value='item.id'>{{item.name}}</option>
                            </select>
                              <span class="pub-span" style="margin-left: 10px;">处理状态</span>
                            <select class="form-control selectpicker" multiple v-model="model_select">
                                  <option v-for="(item,index) in clzt_select" :key="index"
                                          :value='item.id'>{{item.name}}</option>
                            </select>
                             <!--<span class="pub-span" style="margin-left: 10px;">负责人姓名</span>-->
                            <!--<input type="text" class="form-control" id="username">-->

                         <span style="float:left;line-height: 52px;margin-right: 10px;">事件类型：</span>
                        <select  class="form-control selectpicker" multiple  v-model="sjlx_select" id="cllxs">
                            <option v-for="(item,index) in data_sjlxs" :key="index"
                                    :value='item.id'>{{item.name}}
                            </option>
                        </select>
                        <button type="button" class="btn btn-sm pub-btn" style="margin-left: 30px;" @click="getChange()">查询</button>
                        </span>
                        <div style="padding: 10px">
                     <span class="div-right-top">
                           <img v-show="taskwpmodel_select==1" src="../img/del.png" title="删除" @click="del()">
                          <img src="../img/back.png" title="回退"  @click="back()">
                          <img src="../img/pftask.png" title="派发"  @click="distributed()"></span>
                        </div>
                        <div style="height:calc(100% - 164px);margin-top: 20px;" 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.id+'|'+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="'http://zjh189.ncpoi.cc:7080'+item.imagedata" :id="'img'+item.id">
<!--                                        <canvas :id="'cvs'+item.id" style="position: absolute;pointer-events: none;left:0;width:100%;height:100%"></canvas>-->
                                    </div>
                                    <div class="li-center">
                                        <div>
                                            <span class="lx-span" v-text="item.recordname"></span>
                                        </div>
                                        <div>
                                            <span>检测时间：</span>
                                            <span v-text="item.recordtime"></span>
                                        </div>
                                        <div>
                                            <span>通道名称：</span>
                                            <span v-text="item.tdmc"></span>
                                        </div>
                                        <!--<div>-->
                                            <!--<span>辖区名称：</span>-->
                                            <!--<span v-text="item.xzmc"></span>-->
                                        <!--</div>-->
                                        <div v-show="item.targetnum!=null && item.targetnum>0">
                                            <span>人员密度：</span>
                                            <span v-text="item.targetnum"></span>
                                            <span>警界值：</span>
                                            <span v-text="item.alarmnum"></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>
                            <table v-if="!show" class="table table-td">
                                <thead>
                                <tr style="background-color: rgb(228, 228, 228);">
                                    <td>类型</td>
                                    <td>时间</td>
                                    <td>通道名称</td>
                                    <td>辖区名称</td>
                                    <td>操作</td>
                                </tr>
                                </thead>
                                <tbody class="div-pub-gt">
                                <tr v-for="(item,index) in data_table_wfpz">
                                    <td v-text="item.recordname"></td>
                                    <td v-text="item.recordtime"></td>
                                    <td v-text="item.tdmc"></td>
                                    <td v-text="item.xzmc"></td>
                                    <td>
                                        <img src="../img/sjcx/lssp.png" style="width: 20px;" v-show="item.videopath==null?false:true">
                                        <button type="button" class="btn btn-sm pub-btn"
                                                @click="xq(item)" style="margin-left: 5px;margin-top: 0px;padding: 2px 7px;">详情
                                        </button>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </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>24</option>
                                    <option>36</option>
                                    <option>48</option>
                                    <option>60</option>
                                </select>
                                <span style="float: left;margin-left: 8px;">条</span>
                            </div>
                        </div>
                        <div class="state_div" v-show="show_nums">
                            <button type="button" class="btn btn-sm btn1" id="all">全选</button>
                            <button type="button" class="btn btn-sm btn1" id="unall">取消</button>
                            <span v-text="'已选择'+state_arr.length+'项'"></span>
                            <!--<button type="button" class="btn btn-sm btn2" @click="state_cli(3)">重复事件</button>-->
                            <!--<button type="button" class="btn btn-sm btn3" @click="state_cli(2)">误检</button>-->
                            <!--<button type="button" class="btn btn-sm btn4" @click="state_cli(1)">正检</button>-->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
   <!--事件实时提醒弹出框三级弹框-->
    <div class="modal fade" id="myModal_rwpfhistory" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document" style="width: 330px;">
            <div class="modal-content" style="width: 330px;">
                <div class="modal-header" style="background-color: rgb(48, 53, 72);">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true" style="color: white;">&times;</span></button>
                    <h6 class="modal-title" style="color: white;  font-weight: bold">任务派发</h6>
                </div>
                <div class="modal-body" style="height: 280px;">
                    <table class="table table-td">
                        <tr>
                            <td>
                                单位/角色:
                            </td>
                            <td width="200px">
                                <select class="form-control selectpicker" v-model="rolepmodel_select" id="role" @change="getusers($event,item)">
                                    <option v-for="(item,index) in role_select" :key="index"
                                            :value='item.roleId'>{{item.roleName}}</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>
                               用户:
                            </td>
                            <td width="200px">
                                <select class="form-control selectpicker" v-model="usermodel_select" id="user" >
                                    <option v-for="(item,index) in user_select" :key="index"
                                            :value='item.id'>{{item.name}}</option>
                                </select>
                            </td>
                        </tr>
                    </table>
                </div>
                <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            <button type="button" class="btn btn-primary"  @click="dorwpf()">派发</button>
                </div>
                </div>
            </div>
        </div>
    </div>

</body>
<link rel="stylesheet" href="../lib/layui/css/layui.css">
<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="../lib/layui/layui.js"></script>
<script src="../js/util/http_util.js"></script>
<script src="../js/jkgl/Canvas.js"></script>
<script src="../js/rwpfhistory/rwpfhistory.js"></script>
</html>