预警和视频页面

YYC

2023-05-06 8e92b167650c011cfd38096524e6877268ae65b1

预警和视频页面

 igds-app/inout-in-record.html

@@ -32,7 +32,7 @@
                <div class="mui-scroll-wrapper rkjl">
                    <div class="mui-scroll">
                        <div class="m-record" id="recordList">
                            <div class="id" style="text-align: center;font-size: 20px;color:#dd524d">所选日期暂无入库记录信息</div>
                            <!-- <div class="id" style="text-align: center;font-size: 20px;color:#dd524d">所选日期暂无入库记录信息</div> -->
                            <!-- <div class="item">
                                <div class="id">单据号: 202205050002</div>
                                <ul class="g-listb2">
@@ -59,7 +59,8 @@
                                </ul>
                                <div class="time">完成时间: 2021-05-08 12:00 </div>
                            </div>
                            <div class="item">
							 
                             <div class="item">
                                <div class="id">单据号: 202205050002</div>
                                <ul class="g-listb2">
                                    <li>
@@ -110,6 +111,7 @@
                                    </li>
                                </ul>
                                <div class="time">完成时间: 2021-05-08 12:00 </div>
                                -->
                            </div>
                        </div>
                    </div>

 igds-app/inout-out-record.html

@@ -23,7 +23,7 @@
            <div class="g-date_box">
                <span class="day prev" onclick="addAndReduceMonth(-1)">前一天</span>
                <div class="inpbox" onclick="chooseDate();">
                    <input id="dateTime" type="text" value="2022-04-15" readonly class="inp" />
                    <input id="dateTime" type="text" value="" readonly class="inp" />
                </div>
                <span class="day next" onclick="addAndReduceMonth(1)">后一天</span>
            </div>

 igds-app/js/admin/security-video.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,146 @@
var url = null;
var videoData = null;
var playData =null;
var data = {
    "interfaceId": "5604",
    "tokenAuth": "",
    "sign": "10003",
    "outId": "10003",
    "reqDateTime": new Date(),
    "data": {
        "deptId": ""
    }
};
var data1 = {
    "interfaceId": "5605",
    "tokenAuth": "",
    "sign": "10003",
    "outId": "10003",
    "reqDateTime": new Date(),
    "data": {
        "id": "",
        "playType": ""
    }
};

function init() {

    var user = JSON.parse(localStorage.getItem('user'));
    var selectDeptId = JSON.parse(localStorage.getItem('selectDeptId'));
    data.tokenAuth = user.tokenAuth;
    data1.tokenAuth = user.tokenAuth;
    data.data.deptId = selectDeptId;
    url = user.url + "/api-phone/v35/gateway";

    getVideoList();

}

function getVideoList() {
    //发送请求获取视频设备
    mui.ajax(url, {
        type: "POST",
        dataType: "json",
        crossDomain: true,
        contentType: "application/json;charset=utf-8",
        data: JSON.stringify(data),
        success: function(result) {
            if (result.code == "0000") {
                videoData = result.data;
                console.log(JSON.stringify(videoData))
                renderVideo();
            } else {
                renderVideo();
                mui.alert(result.msg, '提示', ["确定"], function() {}, "div");
				
            }
        },
        error: function() {
            renderVideo();
            mui.alert('系统繁忙,请重试！', '提示', ["确定"], function() {}, "div");
        }
    })
}

//渲染视频监控设备
function renderVideo() {
    var html = '';
    if (videoData) {
        var videoList = videoData.data;
        if (videoList && videoList.length > 0) {
            $.each(videoList, function(index, item) {
                if (index % 3 == 0) {
                    html +=
                    '<li><a onclick="getVideo('+item.id,item.playType+')" class="con" style="background-image: url(images/icons/g-i15.png);">';
                }
                if (index % 3 == 1) {
                    html +=
                    '<li><a onclick="getVideo('+item.id,item.playType+')" class="con" style="background-image: url(images/icons/g-i16.png);">';
                }
                if (index % 3 == 2) {
                    html +=
                    '<li><a onclick="getVideo('+item.id,item.playType+')" class="con" style="background-image: url(images/icons/g-i17.png);">';
                }
                if (item.type = '02') {
                    html +=
                        '<div class="left"><div class="icon"><img src="images/icons/g-i13.png" alt=""></div><div class="name">' +
                        item.name + ' (球机)</div></div>';
                }
                if (item.type == '01') {
                    html +=
                        '<div class="left"><div class="icon"><img src="images/icons/g-i14.png" alt=""></div><div class="name">' +
                        item.name + ' (枪机)</div></div>';
                }

                html += '<div class="right"><span class="mui-icon  mui-icon-forward"></span></div></a></li>';
            })
        } else {
            html += '<li><a class="con" style="background-image: url(images/icons/g-i15.png);"><span>暂无相关设备</span></a></li>';
        }
    }else{
        html += '<li><a class="con" style="background-image: url(images/icons/g-i15.png);"><span>暂无相关设备</span></a></li>';
    }
    $("#recordList").html(html);
}


function getVideo(cameraId,playType){
    data1.data.id = cameraId;
    data1.data.playType = playType;
	
    //发送请求获取视频设备
    mui.ajax(url, {
        type: "POST",
        dataType: "json",
        crossDomain: true,
        contentType: "application/json;charset=utf-8",
        data: JSON.stringify(data1),
        success: function(result) {
            if (result.code == "0000") {
                playData = result.data;
                console.log(JSON.stringify(playData))
                toVideo(playData.playAddr);
            } else {
                toVideo('');
                mui.alert(result.msg, '提示', ["确定"], function() {}, "div");
            }
        },
        error: function() {
            toVideo('');
            mui.alert('系统繁忙,请重试！', '提示', ["确定"], function() {}, "div");
        }
    })
}

function toVideo(playAddr){
    var html = '';
    html += '<video src="'+playAddr+'" poster="images/pos1.png" class="video" webkit-playsinline="true" playsinline="true" controls></video>'
    $("#toVideo").html(html);
}

mui('.mui-scroll-wrapper').scroll({
    indicators: false, //是否显示滚动条
    deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
    bounce: false, //是否启用回弹
    deceleration: 0.0005 //flick å‡é€Ÿç³»æ•°ï¼Œç³»æ•°è¶Šå¤§ï¼Œæ»šåŠ¨é€Ÿåº¦è¶Šæ…¢ï¼Œæ»šåŠ¨è·ç¦»è¶Šå°ï¼Œé»˜è®¤å€¼0.0006
});

 igds-app/js/admin/warn-list.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,238 @@
var url = null;
var dateTime;
var warnData = null;
var data = {
    "interfaceId": "5801",
    "tokenAuth": "",
    "sign": "10003",
    "outId": "10003",
    "reqDateTime": new Date(),
    "data": {
        "deptId": "",
        "dataTime": ""
    }
};
var dataPop = {
    "interfaceId": "5802",
    "tokenAuth": "",
    "sign": "10003",
    "outId": "10003",
    "reqDateTime": new Date(),
    "data": {
        "id":"",
        "status": "",
        "remark": ""
    }
};

function init() {

    console.log("init")
    var user = JSON.parse(localStorage.getItem('user'));
    var selectDeptId = JSON.parse(localStorage.getItem('selectDeptId'));
    data.tokenAuth = user.tokenAuth;
    dataPop.tokenAuth = user.tokenAuth;
    data.data.deptId = selectDeptId;
    url = user.url + "/api-phone/v35/gateway";

    dateTime = getDate(new Date())
    $('#date').val(dateTime)

    //获取警告记录
    getWarnList();

}


//获取警告记录
function getWarnList() {
    warnData = null;
    //赋值参数的日期
    data.data.dateTime = dateTime;
    //请求
    mui.ajax(url, {
        type: "POST",
        dataType: "json",
        crossDomain: true,
        contentType: "application/json;charset=utf-8",
        data: JSON.stringify(data),
        success: function(result) {
            if (result.code == "0000") {
                warnData = result.data;
                console.log(warnData)
                renderWarn();
            } else {
                renderWarn();
                mui.toast(result.msg);
                console.log(JSON.stringify(result))
            }
        },
        error: function() {
            mui.alert("系统繁忙,请重试！", "提示", ["确定"], function() {}, "div")
        }
    })
}

//默认获取当天日期(yyyy-MM-dd)
function getDate() {
    var date = new Date();
    var year = date.getFullYear();
    var month, day;
    month = date.getMonth() + 1;
    if (month >= 1 && month <= 9) {
        month = "0" + month;
    }
    day = date.getDate();
    if (day >= 1 && day <= 9) {
        day = "0" + day;
    }
    return year + "-" + month + "-" + day
}
//默认获取当前日期(yyyy-MM-dd)
function getDate(date) {
    var year = date.getFullYear();
    var month, day;
    month = date.getMonth() + 1;
    if (month >= 1 && month <= 9) {
        month = "0" + month;
    }
    day = date.getDate();
    if (day >= 1 && day <= 9) {
        day = "0" + day;
    }
    return year + "-" + month + "-" + day;
}

//加减天数
function addAndReduceMonth(tag) {

    var date = new Date(dateTime);

    date = date.setDate(date.getDate() + tag);
    date = new Date(date);
    dateTime = getDate(date);
    $('#date').val(dateTime)
    //获取警告记录
    getWarnList();
}

function chooseDate() {
    var dtpicker = new mui.DtPicker({
        type: "date", //设置日历初始视图模式 
        // beginDate: new Date(2015, 04, 25), //设置开始日期 
        // endDate: new Date(2016, 04, 25), //设置结束日期 
    })
    dtpicker.show(function(e) {
        document.getElementById("date").value = e.value
    })
}




//渲染页面
function renderWarn() {
    var html = '';
    if (warnData) {
        var warnList = warnData.data;
        if (warnList && warnList.length > 0) {
            $.each(warnList, function(index, item) {
                html += '<li><div class="con myfancy" onclick="openPop('+item.id+')">';
                if (item.status == '10') {
                    html += '<span class="type">未处理</span>';
                }
                if (item.status == '20') {
                    html += '<span class="type k">处理延迟</span>';
                }
                if (item.status == '30') {
                    html += '<span class="type k">已处理</span>';
                }
                if (item.status == '40') {
                    html += '<span class="type k">忽略</span>';
                }
                html += '<div class="tit">警告名称: <span>' + item.name + '</span></div>';
                html += '<div class="txt">';
                html += '<div class="box"><div class="group c"><div class="desc">' + item.type +
                    '</div><div class="ort">警告类型</div></div></div>';
                html += '<div class="box"><div class="group c1"><div class="desc">' + item.depotName +
                    '</div><div class="ort">仓库名称</div></div></div>';
                if (item.level == '1') {
                    html +=
                        '<div class="box"><div class="group level-2"><div class="desc">高级</div><div class="ort">警告级别</div></div></div></div>';
                }
                if (item.level == '2') {
                    html +=
                        '<div class="box"><div class="group level-1"><div class="desc">中级</div><div class="ort">警告级别</div></div></div></div>';
                }

                html += '<div class="tit coation">警告内容: <span>' + item.info + '</span></div>';
                html += '<div class="time">' + item.time + '</div></div></li>';
            })
        } else {
            html +=
                '<li><div class="con myfancy" style="text-align: center;font-size: 20px;color:#dd524d">暂无警告信息</div></li>';
        }
    } else {
        html +=
            '<li><div class="con myfancy" style="text-align: center;font-size: 20px;color:#dd524d">暂无警告信息</div></li>';
    }
    $("#recordList").html(html);

}



//打开弹窗
function openPop(warnId) {
    dataPop.data.id = warnId;
    $('#m-pop').css('display', 'flex');
}
//警告处理
function handleWarn(tag) {
    if (tag == "1") {
        dataPop.data.status = '40'
        // mui.toast("忽略警告");
    }
    if (tag == "2") {
        dataPop.data.status = '30'
        // mui.toast("警告处理");
    }
    dataPop.data.remark = mui("#textareaPop")[0].value;
    //请求
    mui.ajax(url, {
        type: "POST",
        dataType: "json",
        crossDomain: true,
        contentType: "application/json;charset=utf-8",
        data: JSON.stringify(dataPop),
        success: function(result) {
            if (result.code == "0000") {
                console.log(JSON.stringify(result))
            } else {
                mui.toast(result.msg);
                console.log(JSON.stringify(result))
            }
        },
        error: function() {
            mui.alert("系统繁忙,请重试！", "提示", ["确定"], function() {}, "div")
        }
    })
    closePop();
}
//关闭弹窗
function closePop() {
    $("#m-pop").css('display', 'none');
}
$('.pop-bg,.m-pop .close').click(function(e) {
    e.stopPropagation();
    $('.m-pop').fadeOut();
});


//滑动
mui('.mui-scroll-wrapper').scroll({
    indicators: false, //是否显示滚动条
    deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
    bounce: false, //是否启用回弹
    deceleration: 0.0005 //flick å‡é€Ÿç³»æ•°ï¼Œç³»æ•°è¶Šå¤§ï¼Œæ»šåŠ¨é€Ÿåº¦è¶Šæ…¢ï¼Œæ»šåŠ¨è·ç¦»è¶Šå°ï¼Œé»˜è®¤å€¼0.0006
});

 igds-app/security-video.html

@@ -23,13 +23,14 @@
            <div class="mui-scroll-wrapper box">
                <div class="mui-scroll">
                    <div class="wp">
                        <div class="m-videob1">
                            <video src="http://player.alicdn.com/video/aliyunmedia.mp4" poster="images/pos1.png"
                        <div class="m-videob1" id="toVideo">
                            <!-- src="http://player.alicdn.com/video/aliyunmedia.mp4" -->
                            <video src="" poster="images/pos1.png"
                                class="video" webkit-playsinline="true" playsinline="true" controls></video>
                        </div>
                        <ul class="ul-locb1">
                        <ul class="ul-locb1" id="recordList">
                            <li>
                                <a href="" class="con" style="background-image: url(images/icons/g-i15.png);">
                                <a onclick="getVideo(1,1)" class="con" style="background-image: url(images/icons/g-i15.png);">
                                    <div class="left">
                                        <div class="icon">
                                            <img src="images/icons/g-i13.png" alt="">
@@ -134,13 +135,13 @@
        </div>
    </body>
    <script src="./js/mui.min.js"></script>
    <script src="./js/jquery.js"></script>
    <script src="./js/admin/security-video.js"></script>
    <script type="text/javascript" charset="utf-8">
        mui.init();
        mui('.mui-scroll-wrapper').scroll({
            indicators: false, //是否显示滚动条
            deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
            bounce: false, //是否启用回弹
            deceleration: 0.0005 //flick å‡é€Ÿç³»æ•°ï¼Œç³»æ•°è¶Šå¤§ï¼Œæ»šåŠ¨é€Ÿåº¦è¶Šæ…¢ï¼Œæ»šåŠ¨è·ç¦»è¶Šå°ï¼Œé»˜è®¤å€¼0.0006
        });
        mui.plusReady(function() {
            //数据初始化
            init();
        })
    </script>
</html>

 igds-app/warn-list.html

@@ -22,18 +22,18 @@
        </header>
        <div class="mui-content">
            <div class="g-date_box">
                <span class="day prev">前一天</span>
                <span class="day prev" onclick="addAndReduceMonth(-1)">前一天</span>
                <div class="inpbox" onclick="chooseDate();">
                    <input id="date" type="text" value="2022-04-15" readonly class="inp" />
                    <input id="date" type="text" value="" readonly class="inp" />
                </div>
                <span class="day next">后一天</span>
                <span class="day next" onclick="addAndReduceMonth(1)">后一天</span>
            </div>
            <div class="mui-scroll-wrapper jglb">
                <div class="g-in-sl">
                    <div class="m-pow-dist">
                        <div class="m-caution-mana">
                            <ul class="ul-listmana ul-listcaut1">
                                <li>
                            <ul class="ul-listmana ul-listcaut1" id="recordList">
                                 <!-- <li>
                                    <div class="con myfancy" onclick="openPop('11')">
                                        <span class="type">未处理</span>
                                        <div class="tit">
@@ -132,7 +132,8 @@
                                        <div class="time">2022-03-02 10:10</div>
                                    </div>
                                </li>
                            </ul>
                             -->
                             </ul>
                        </div>
                    </div>

@@ -146,7 +147,7 @@
                        <div class="h3"><span class="red">*</span> å¤„理说明</div>
                        <form class="">
                            <div class="mui-input-row">
                                <textarea rows="" cols="" placeholder="请输入说明"></textarea>
                                <textarea id="textareaPop" rows="" cols="" placeholder="请输入说明"></textarea>
                            </div>
                        </form>
                        <div class="btns">
@@ -161,48 +162,15 @@
    <script src="./js/mui.min.js"></script>
    <script src="./js/mui.picker.min.js"></script>
    <script src="./js/jquery.js"></script>
    <script src="./js/admin/warn-list.js"></script>
    <script type="text/javascript" charset="utf-8">
        //mui初始化
        mui.init();

        function chooseDate() {
            var dtpicker = new mui.DtPicker({
                type: "date", //设置日历初始视图模式 
                // beginDate: new Date(2015, 04, 25), //设置开始日期 
                // endDate: new Date(2016, 04, 25), //设置结束日期 

            })
            dtpicker.show(function(e) {
                document.getElementById("date").value = e.value
            })
        }

        mui('.mui-scroll-wrapper').scroll({
            indicators: false, //是否显示滚动条
            deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏
            bounce: false, //是否启用回弹
            deceleration: 0.0005 //flick å‡é€Ÿç³»æ•°ï¼Œç³»æ•°è¶Šå¤§ï¼Œæ»šåŠ¨é€Ÿåº¦è¶Šæ…¢ï¼Œæ»šåŠ¨è·ç¦»è¶Šå°ï¼Œé»˜è®¤å€¼0.0006
        });
        //打开弹窗
        function openPop(warnId) {
            $('#m-pop').css('display', 'flex');
        }
        //警告处理
        function handleWarn(tag) {
            if(tag == "1"){
                mui.toast("忽略警告");
            }
            if(tag == "2"){
                mui.toast("警告处理");
            }
            closePop();
        }
        //关闭弹窗
        function closePop() {
            $("#m-pop").css('display', 'none');
        }
        $('.pop-bg,.m-pop .close').click(function(e) {
            e.stopPropagation();
            $('.m-pop').fadeOut();
        });
		
        mui.plusReady(function() {
            //数据初始化
            init();
        })
		
    </script>
</html>