huangzhidong
/
guoyao-jiankang


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
							<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="/static/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/meeting/style.css">
    <script src="/static/elementui2.15.5/vue-2.6.14.js"></script>
    <script src="/static/elementui2.15.5/datav.map.vue.js"></script>
    <title>{$info['title']}</title>
<body>

<div class="nav-header">
    <div class="nav-left" >
        <img  src="/static/meeting/img/logo.png" alt="" class="one">
        <img  src="/static/meeting/img/header-left.png" alt="" class="two">
    </div>
    <div class="nav-title">当前会议室信息一览</div>
    <div class="nav-right">
        <img  src="/static/meeting/img/header-right.png" alt="" class="three">
    </div>
    <div class="nav-right2">
        <div id="time" class="time"></div>
        <div id="week" class="week"></div>
        <div id="date" class="date"></div>
    </div>
    <img src="/static/meeting/img/header-bottom.png" alt="" class="header-bottom">
</div>

<div class="main">
    <div class="main1">
        <div class="meeting-title">
            <div class="qrcode">
                <img src="" alt="" id="qrcode">
            </div>
           <text>{$info.title}</text>
        </div>
        <div class="meeting-status {if($status)}meeting-status-color{$status}{/if}" id="meetingStatus">
            <div class="circle"></div>
            <text id="statusTxt">{if($status ==0)}空闲中{elseif($status ==1)}会议中{/if}</text>
        </div>
    </div>

    <div class="main2" id="vueDadaV">
        <dv-scroll-board :config="config" style="width:100%;height:100%" />
    </div>

    <div class="main3">
        <div class="remind-box">
            <img src="/static/meeting/img/remind.png" alt="">
            <text class="remind-title">提醒</text>
        </div>
        <div class="remind-content">
            <marquee direction="left">{$info.notice}</marquee>
<!--            <p class="animate">-->
<!--                -->
<!--            </p>-->

        </div>

    </div>

</div>

</body>
</html>

<script>
    var meetingId = '{$meetingId}';
    $(window).resize(function(){
        location.reload()
    });
    $(function () {
        changeZoom();
        window.setInterval("realSysTime()", 1000);
    });

    qrcode();
    meeting();
    vueDataV();
    setInterval(function () {
        meeting();
        vueDataV();
    }, 10*1000);

    function changeZoom() {
        var wb = $(window).width()/1920;
        var hb = $(window).height()/1080;
        if(wb >= hb){
            $('body').css({
                'zoom': hb,
            });
        }else{
            $('body').css({
                'zoom': wb,
            });
        }
    }

    function vueDataV(){
        var app = new Vue({
            el: '#vueDadaV',
            data:{
                config:{
                    // header: ['编号', '申请人', '开始时间','结束时间','状态'],
                    // headerHeight: 45,
                    // rowNum: 8,
                    // headerBGC: 'rgba(17, 43, 117, 0.5)',
                    // oddRowBGC: 'rgba(17, 43, 117, 0.5)',
                    // evenRowBGC: 'rgba(9, 32, 99, 0.5)',
                    // data: []
                },
            },
            created(){
                this.getList();
            },
            methods:{
                getList(){
                    var url = "{:url('MeetingScreen/meetingList')}";
                    var that = this;
                    $.post(url,{token:meetingId},function (res) {
                        that.config = {
                            header: ['<span style="font-size: 26px">编号</span>', '<span style="font-size: 26px">申请人</span>', '<span style="font-size: 26px">开始时间</span>','<span style="font-size: 26px">结束时间</span>','<span style="font-size: 26px">状态</span>'],
                            headerHeight: 70,
                            rowNum: 10,
                            align: ['center','center','center','center','center'],
                            headerBGC: 'rgba(0,38,113, 0.42)',
                            oddRowBGC: 'rgba(0,38,113, 0.42)',
                            evenRowBGC: 'rgba(0,38,113, 0.63)',
                            data: res.data
                        }
                    })
                }
            }

        })
    }


    function meeting(){
        var url = "{:url('MeetingScreen/meetingStatus')}";
        $.post(url,{token:meetingId},function (res) {
            $('#meetingStatus').addClass('meeting-status-color'+res.data);
            if(res.data == 0){
                $('#statusTxt').html('空闲中');
            }else if(res.data == 1){
                $('#statusTxt').html('会议中');
            }
        })
    }

    function qrcode(){
        var url = "{:url('MeetingScreen/qrcode')}";
        $.post(url,{token:meetingId},function (res) {
            var src = '{:url("Admin/Qrcode/qrcode")}?code='+res.data;
            $('#qrcode').attr('src',src);
        })
    }


    function realSysTime() {
        var now = new Date();
        var year = now.getFullYear(); //获取年份
        var month = now.getMonth(); //获取月份
        var date = now.getDate(); //获取日期
        var day = now.getDay(); //获取星期
        var hour = now.getHours(); //获取小时
        var minute = now.getMinutes(); //获取分钟
        var seconds = now.getSeconds(); //获取秒
        month = month + 1;
        var arr_week = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
        var week = arr_week[day];
        if (month<10) {
            month = '0'+month
        }
        if (date<10) {
            date = '0'+date
        }
        if (hour<10) {
            hour = '0'+hour
        }
        if (minute<10) {
            minute = '0'+minute
        }
        if (seconds<10) {
            seconds = '0'+seconds
        }
        var curTime = hour + ":" + minute + ":" + seconds;
        var curWeek = week;
        var curDate = year + "." + month + "." + date ;
        $('#time').html(curTime);
        $('#week').html(curWeek);
        $('#date').html(curDate);
    }

</script>