<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Room.aspx.cs"
    Inherits="BeginScreen.Room" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" style="height: 100%;">
<head id="Head1" runat="server">
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script src="js/speak.js"></script>
    <script language="javascript" src="js/url.js" charset="utf-8"></script>
    <style type="text/css">
        thead tr:last-child td {
            height: 50px;
        }

        tbody td {
            background: none !important;
            color: #fff !important;
            border-bottom: 15px solid #62906900 !important;
        }

            tbody td div {
                width: 100%;
                height: 100%;
                line-height: 50px;
                background: #E46705 !important;
                border-top: 1.9px solid #fff;
                border-bottom: 1.9px solid #fff;
            }

        tbody tr td:first-child {
            padding-left: 1%;
        }

        tbody tr td:last-child {
            padding-right: 1%;
        }

        tbody tr td:first-child div {
            border-left: 1.9px solid #fff;
            border-top-left-radius: 30px;
            border-bottom-left-radius: 30px;
        }

        tbody tr td:last-child div {
            border-right: 1.9px solid #fff;
            border-top-right-radius: 30px;
            border-bottom-right-radius: 30px;
        }
    </style>
</head>
<body style="margin: 0; /*background: linear-gradient(#08413C,#28A1A9); */background: linear-gradient(#0E101A,#DF8A53); height: 100%;" bgcolor="#000000" id="Mybody">

    <table id="table" border="0" width='100%' height='100%' cellpadding="0" cellspacing="0">
        <thead>
            <tr style="/*background: black; */ background: linear-gradient(#08413C,#28A1A9); color: white; margin-bottom: 6px; font-size: 40px; font-weight: bold;">
                <td colspan="10" align="center" valign="middle" height="10%" style="padding: 6px;">
                    <div onclick="speak('');" style="left: 10px; top: 22px; position: absolute; /*color: #62D377; */ font-size: 27px;">
                        秦皇岛市工人医院
                    </div>
                    每日手术情况一览表
                    <div style="right: 250px; top: 22px; position: absolute; /*color: #62D377; */ font-size: 27px;">
                        <div id="currentTime">
                        </div>
                        <div id="currentHour"></div>
                    </div>
                    <div style="right: 20px; top: 22px; position: absolute; /*color: #62D377; */ font-size: 27px;">
                        <div id="js">
                        </div>
                    </div>
                </td>
            </tr>
            <tr style="/*background: #2D9131; */ color: white; margin-bottom: 6px; font-size: 24px; font-weight: bold;">
                <td width="3%" align="center" valign="middle" height="5%" style="padding: 6px;"></td> 
                </td>
                <td width="5%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    术间
                </td>
                <td width="13%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    科室
                </td>
                <td width="8%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    姓名
                </td>
                <td width="19%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    手术名称
                </td>
                <td width="9%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    手术医生
                </td>
                <td width="14%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    麻醉医生
                </td>
                <td width="14%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    护士
                </td>
                <td width="8%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    时间
                </td>
                <td width="9%%" align="center" valign="middle" height="5%" style="padding: 6px;">
                    状态
                </td>
            </tr>
        </thead>
        <tbody id="Mytbody" style="background: linear-gradient(#221A1C,#DF8A53);">
        </tbody>
    </table>
    <table id="table1" table border="0" width='100%' height='0' cellpadding="0" cellspacing="0">
        <tbody id="Mytbody1" style="background: linear-gradient(#221A1C,#DF8A53);">
            <tr style="position: fixed; bottom: 0; width: 100%;">
                <td colspan="10" style="border-bottom: 0 !important; display: block;">
                    <div style="background: #016768 !important; border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-bottom: 0; padding: 0 5%; height: 60px; width: 89%; position: relative;">
                        <div style="background: #17233B!important; width: 99%; height: 40px; margin-top: 10px; padding: 0 0px;">
                            <marquee id="marquee" direction="left" scrollamount="12" style="font-family: sans-serif; font-size: 25px; color: #fff; height: 40px; line-height: 40px; font-weight: bold;"></marquee>
                        </div>
                        <span style="display: block; width: 20px; height: 20px; background: red; position: absolute; left: 1.8%; top: 22px; border-radius: 50%; border: 1px solid #fff;"></span>
                        <span style="display: block; width: 20px; height: 20px; background: red; position: absolute; right: 1.8%; top: 22px; border-radius: 50%; border: 1px solid #fff;"></span>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
    <div id="officeId" style="width: 4%; height: 100%; background: #ff000000; position: fixed; left: 0; top: 0; z-index: 100000;">
    </div>
    <script language="javascript" src="js/webofficetip.js" charset="utf-8"></script>
    <script language="javascript">
        SetupTip();
    </script>
</body> 
<script type="text/javascript"> 

    var messId = 0;
    var sendType = "";

    var tbodyobj = document.getElementById('Mytbody');
    setInterval(load, 10000);
    var WorkerCurrentPage = 1;
    var countPage; 

    function load() {
        if (WorkerCurrentPage > countPage) {
            WorkerCurrentPage = 1;
        }
        $.ajax({
            type: "POST",
            url: "RoomHandler.ashx?cmd=GetHtml&WorkerCurrentPage=" + WorkerCurrentPage,
            dataType: 'json',
            async: false,
            success: function (result) {
                var data = eval(result);
                if (data.success) {
                    tbodyobj.innerHTML = data.html;
                    sendType = data.sendType;
                    messId = data.messId;

                    countPage = data.countPage;
                    $("#js").html('（第' + WorkerCurrentPage + '屏/共' + data.countPage + '屏）');
                }
            }
        });
        WorkerCurrentPage = WorkerCurrentPage + 1
    }
    Date.prototype.format = function (format) {
        var o = {
            "M+": this.getMonth() + 1, //month 
            "d+": this.getDate(), //day 
            "h+": this.getHours(), //hour 
            "m+": this.getMinutes(), //minute 
            "s+": this.getSeconds(), //second 
            "q+": Math.floor((this.getMonth() + 3) / 3), //quarter 
            "S": this.getMilliseconds() //millisecond 
        }

        if (/(y+)/.test(format)) {
            format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        }
        var week = {
            "0": "日",
            "1": "一",
            "2": "二",
            "3": "三",
            "4": "四",
            "5": "五",
            "6": "六"
        };
        if (/(E+)/.test(format)) {
            format = format.replace(RegExp.$1, ((RegExp.$1.length > 1) ? (RegExp.$1.length > 2 ? "星期" : "周") : "") + week[this.getDay() + ""]);
        }

        for (var k in o) {
            if (new RegExp("(" + k + ")").test(format)) {
                format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
            }
        }
        return format;
    }

    $(function () {
        var _timestamp
        $.ajax({
            type: "POST",
            url: "RoomHandler.ashx?cmd=GetHtmlTime",
            async: false,
            success: function (result) {
                _timestamp = Date.parse(result);
                $("#currentTime").text(new Date(_timestamp).format("yyyy年MM月dd日") + " " + GetWeek());
                setInterval(function () {
                    $("#currentTime").text(new Date(_timestamp).format("yyyy年MM月dd日") + " " + GetWeek());
                    _timestamp += 1000;
                }, 1000);

            }
        });
    });

    function GetWeek() {
        var a = new Array("日", "一", "二", "三", "四", "五", "六");
        var week = new Date().getDay();
        var str = "星期" + a[week];
        return str;
    }
     

    ///设置字体颜色
    function SetFontColor(family, size, color, weight, style) {
        if (family != "") {
            $("#marquee").css("font-family", family);
        }
        if (size != "") {
            $("#marquee").css("font-size", size + "px");
        }
        if (color != "") {
            $("#marquee").css("color", color);
        }
        if (weight != "") {
            $("#marquee").css("font-weight", weight);
        }
        if (style != "") {
            $("#marquee").css("font-style", style);
        }
    } 
</script>
</html>
