zhangkun
/
ditie2.0_web


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435
							<!DOCTYPE html>
<html>
<head>

    <title>管理首页</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="/Content/layui/css/layui.css" rel="stylesheet" />
    <link href="/Content/css/public.css" rel="stylesheet" />
    <link href="/Content/css/callscreen/callscreen.css" rel="stylesheet" />
    <link href="/Content/layui/css/modules/layui-icon-extend/iconfont.css" type="text/css" rel=" stylesheet" />
    <link href="/Content/css/font-awesome/css/font-awesome.min.css" type="text/css" rel=" stylesheet" />
    <script src="/Content/js/jquery-1.8.3.min.js"></script>
    <style type="text/css">
        #tip1 {
            background-color: #fff;
            position: absolute;
            font-size: 12px;
            left: 25px;
            top: -100px;
            border-radius: 3px;
            border: 1px solid #ccc;
            line-height: 80px;
            height: 80px;
            width: 200px;
            vertical-align: top;
            display: none;
        }

        #tipPlus {
            position: absolute;
            font-size: 12px;
            left: 10px;
            top: 10px;
            line-height: 36px;
            height: 36px;
            width: 36px;
            vertical-align: middle;
        }

        #tipMinus {
            position: absolute;
            font-size: 12px;
            right: 0px;
            top: 10px;
            line-height: 36px;
            height: 36px;
            width: 26px;
            vertical-align: middle;
        }
    </style>
    <script type="text/javascript">
        function ClosePlus() {
            document.getElementById("tip1").style.display = "none";
        }
        function ShowPlus() {
            document.getElementById("tip1").style.display = "block";
        }
        /**
        * 获取本周、本季度、本月、上月的开始日期、结束日期
        */
        var now = new Date(); //当前日期 
        var nowDayOfWeek = now.getDay(); //今天本周的第几天 
        var nowDay = now.getDate(); //当前日 
        var nowMonth = now.getMonth(); //当前月 
        var nowYear = now.getYear(); //当前年 
        nowYear += (nowYear < 2000) ? 1900 : 0; //

        var lastMonthDate = new Date(); //上月日期
        lastMonthDate.setDate(1);
        lastMonthDate.setMonth(lastMonthDate.getMonth() - 1);
        var lastYear = lastMonthDate.getYear();
        var lastMonth = lastMonthDate.getMonth();

        //格式化日期：yyyy-MM-dd 
        function formatDate(date) {
            var myyear = date.getFullYear();
            var mymonth = date.getMonth() + 1;
            var myweekday = date.getDate();

            if (mymonth < 10) {
                mymonth = "0" + mymonth;
            }
            if (myweekday < 10) {
                myweekday = "0" + myweekday;
            }
            return (myyear + "-" + mymonth + "-" + myweekday);
        }

        //获得某月的天数 
        function getMonthDays(myMonth) {
            var monthStartDate = new Date(nowYear, myMonth, 1);
            var monthEndDate = new Date(nowYear, myMonth + 1, 1);
            var days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
            return days;
        }

        //获得本季度的开始月份 
        function getQuarterStartMonth() {
            var quarterStartMonth = 0;
            if (nowMonth < 3) {
                quarterStartMonth = 0;
            }
            if (2 < nowMonth && nowMonth < 6) {
                quarterStartMonth = 3;
            }
            if (5 < nowMonth && nowMonth < 9) {
                quarterStartMonth = 6;
            }
            if (nowMonth > 8) {
                quarterStartMonth = 9;
            }
            return quarterStartMonth;
        }

        //获得本周的开始日期 
        function getWeekStartDate() {
            var weekStartDate = new Date(nowYear, nowMonth, nowDay - nowDayOfWeek-2);
            return formatDate(weekStartDate);
        }

        //获得本周的结束日期 
        function getWeekEndDate() {
            var weekEndDate = new Date(nowYear, nowMonth, nowDay + (4 - nowDayOfWeek));
            return formatDate(weekEndDate);
        }

        //获得本月的开始日期 
        function getMonthStartDate() {
            var monthStartDate = new Date(nowYear, nowMonth, 1);
            return formatDate(monthStartDate);
        }

        //获得本月的结束日期 
        function getMonthEndDate() {
            var monthEndDate = new Date(nowYear, nowMonth, getMonthDays(nowMonth));
            return formatDate(monthEndDate);
        }

        //获得上月开始时间
        function getLastMonthStartDate() {
            var lastMonthStartDate = new Date(nowYear, lastMonth, 1);
            return formatDate(lastMonthStartDate);
        }

        //获得上月结束时间
        function getLastMonthEndDate() {
            var lastMonthEndDate = new Date(nowYear, lastMonth, getMonthDays(lastMonth));
            return formatDate(lastMonthEndDate);
        }

        //获得本季度的开始日期 
        function getQuarterStartDate() {

            var quarterStartDate = new Date(nowYear, getQuarterStartMonth(), 1);
            return formatDate(quarterStartDate);
        }

        //或的本季度的结束日期 
        function getQuarterEndDate() {
            var quarterEndMonth = getQuarterStartMonth() + 2;
            var quarterStartDate = new Date(nowYear, quarterEndMonth, getMonthDays(quarterEndMonth));
            return formatDate(quarterStartDate);
        }
        function BindChart(type) {
            $('#btnday').attr('class', 'layui-btn layui-btn-primary');
            $('#btnweek').attr('class', 'layui-btn layui-btn-primary');
            $('#btnmonth').attr('class', 'layui-btn layui-btn-primary');
            $('#btnyear').attr('class', 'layui-btn layui-btn-primary');
            var strdate = "~";
            switch (type) {
                case 1:
                    $('#btnday').attr('class', 'layui-btn layui-btn-normal');
                    strdate = formatDate(now) + ' 00:00:00' + ' ~ ' + formatDate(now) + ' 23:59:59';
                    $('#txtdate').val(strdate);
                    break;
                case 2:
                    $('#btnweek').attr('class', 'layui-btn layui-btn-normal');
                    strdate = getWeekStartDate() + ' 00:00:00' + ' ~ ' + getWeekEndDate() + ' 23:59:59';
                    $('#txtdate').val(strdate);
                    break;
                case 3:
                    $('#btnmonth').attr('class', 'layui-btn layui-btn-normal');
                    strdate = getMonthStartDate() + ' 00:00:00' + ' ~ ' + getMonthEndDate() + ' 23:59:59';
                    $('#txtdate').val(strdate);
                    break;
                case 4:
                    $('#btnyear').attr('class', 'layui-btn layui-btn-normal');
                    strdate = nowYear + '-01-01' + ' 00:00:00' + ' ~ ' + formatDate(now) + ' 23:59:59';
                    $('#txtdate').val(strdate);
                    break;
            }
            SearchData(type);
        }
        function SearchData(type) {
            var timeno = new Date().getTime();
            var strdate = $('#txtdate').val();
            var startdate = strdate.split('~')[0];
            var enddate = strdate.split('~')[1];
            strdate = startdate.trim() + '~' + enddate.trim();
            document.getElementById("framereport1").src = "/Report/IndexCenterCallPre/?timeno=" + timeno + "&type=" + type + "&strdate=" + strdate;
            document.getElementById("framereport2").src = "/Report/IndexCenterWorkOrderPre/?timeno=" + timeno + "&type=" + type + "&strdate=" + strdate;
            document.getElementById("framereport3").src = "/Report/IndexCenterWorkOrderTimeBar/?timeno=" + timeno + "&type=" + type + "&strdate=" + strdate;
        }
        
    </script>
</head>
<body class="childrenBody">
    <blockquote class="layui-elem-quote layui-text" style="font-size: larger; display: none;">
        管理首页
    </blockquote>
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md4">
                <form class="layui-form layui-card">
                    <div class="layui-card-header">
                        <i class="fa fa-user-circle-o" style="color:#395E67;"></i>&nbsp;&nbsp;用户信息
                    </div>
                    <div class="layui-card-body">
                        <div class="layui-row layui-col-space15">
                            <div class="layui-col-md12">
                                <label class="layui-form-label">
                                    姓名：
                                </label><label class="layui-form-label" style=" text-align:left;">
                                    @Model.UserAccountModel.F_UserName
                                </label>
                            </div>
                            <div class="layui-col-md12">
                                <label class="layui-form-label">
                                    工号：
                                </label><label class="layui-form-label" style=" text-align:left;">
                                    @Model.UserAccountModel.F_UserCode
                                </label>
                            </div>
                            <div class="layui-col-md12">
                                <label class="layui-form-label">
                                    角色：
                                </label><label class="layui-form-label" style=" text-align:left;">
                                    @Model.RoleName
                                </label>
                            </div>
                            <div class="layui-col-md12">
                                <label class="layui-form-label">
                                    分机：
                                </label><label class="layui-form-label" style=" text-align:left;">
                                    @Model.UserAccountModel.F_ExtensionNumber
                                </label>
                            </div>
                        </div>
                    </div>
                </form>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">
                        <i class="fa fa-bell" style="color:red;"></i>&nbsp;&nbsp;提醒事项
                    </div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12" id="notices" style="overflow:scroll;height:260px;">
                             
                            <ul class="layui-timeline" id="notice" style="display:none;">
                                <li class="layui-timeline-item">
                                    <i class="layui-icon layui-timeline-axis" style="color:red;">&#xe617;</i>
                                    <div class="layui-timeline-content layui-text">
                                        <div class="layui-timeline-title">回访客户[张三] 电话13984983983</div>
                                    </div>
                                </li>
                                    <li class="layui-timeline-item">
                                    <i class="layui-icon layui-timeline-axis" style="color:green;">&#xe617;</i>
                                    <div class="layui-timeline-content layui-text">
                                        <div class="layui-timeline-title">处理工单 工单编号[TS1849381023]</div>
                                    </div>
                                </li>
                                <li class="layui-timeline-item">
                                    <i class="layui-icon layui-timeline-axis" style="color:yellow;">&#xe617;</i>
                                    <div class="layui-timeline-content layui-text">
                                        <div class="layui-timeline-title">下午12：30通知开会</div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="layui-col-md12" style="height:38px;display:none;" >
                            <div id="tipPlus">
                                <i class="fa fa-plus-circle fa-lg" onmouseover="ShowPlus();" style="color:green; cursor:pointer;"></i>
                            </div>
                            <div id="tipMinus">
                                <i class="fa fa-minus-circle fa-lg" onmouseover="ClosePlus();" style="color:red; cursor:pointer;"></i>
                            </div>
                            <div id="tip1">
                                <ul class="layui-nav layui-nav-tree" lay-filter="test">
                                    <li class="layui-nav-item">
                                        <a href="javascript:;"><i class="layui-icon" style="color:red;">&#xe617;</i>&nbsp;&nbsp;特别关注客户</a>
                                    </li>
                                    <li class="layui-nav-item">
                                        <a href="javascript:;"><i class="layui-icon" style="color:green;">&#xe617;</i>&nbsp;&nbsp;重点关注工单</a>
                                    </li>
                                    <li class="layui-nav-item"><a href="javascript:;"><i class="layui-icon" style="color:yellow;">&#xe617;</i>&nbsp;&nbsp;重要事项</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-col-md8">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <div style="float:left;">
                            <div class="layui-btn-group">
                                <button id="btnday" onclick="BindChart(1);" class="layui-btn layui-btn-normal"><i class="fa fa-calendar-minus-o"></i>&nbsp;&nbsp;当天</button>
                                <button id="btnweek" onclick="BindChart(2);" class="layui-btn layui-btn-primary"><i class="fa fa-calendar-o"></i>&nbsp;&nbsp;本周</button>
                                <button id="btnmonth" onclick="BindChart(3);" class="layui-btn layui-btn-primary"><i class="fa fa-calendar"></i>&nbsp;&nbsp;本月</button>
                                <button id="btnyear" onclick="BindChart(4);" class="layui-btn layui-btn-primary"><i class="fa fa-bars"></i>&nbsp;&nbsp;本年</button>
                            </div>
                        </div>
                        <div style="float:left; padding-left:20px; padding-top:4px;"><input type="text" class="layui-input" id="txtdate" style="width:200px;" placeholder=""></div><div style="float:left;"><button id="btnsearch" onclick="SearchData(0);" class="layui-btn layui-btn-danger"><i class="fa fa-search"></i></button></div>
                    </div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <div class="layui-col-md6">
                                <blockquote class="layui-elem-quote title" style="border-left: 5px solid #555299;">
                                    <div class="panel-icon fa fa-pie-chart">
                                    </div>
                                    &nbsp;&nbsp;来电类型比例分析
                                </blockquote>
                                <table class="layui-table" lay-skin="line" style="width:100%;">
                                    <tbody class="hot_news">
                                        <tr>
                                            <td align="center" style="height: 176px;">
                                                <iframe id="framereport1" src="" scrolling="no" frameborder="0" style="border:0px;" width="100%" height="176px"></iframe>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="layui-col-md6">
                                <blockquote class="layui-elem-quote title" style="border-left: 5px solid #555299;">
                                    <div class="panel-icon fa fa-pie-chart">
                                    </div>
                                    &nbsp;&nbsp;工单类型比例分析
                                </blockquote>
                                <table class="layui-table" lay-skin="line" style="width:100%;">
                                    <tbody class="hot_news">
                                        <tr>
                                            <td align="center" style="height: 176px;">
                                                <iframe id="framereport2" src="" scrolling="no" frameborder="0" style="border:0px;" width="100%" height="176px"></iframe>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="layui-col-md12" >
                            <blockquote class="layui-elem-quote title" style="border-left: 5px solid #555299;">
                                <div class="panel-icon fa fa-bar-chart">
                                </div>
                                &nbsp;&nbsp;各时间段比例分析
                            </blockquote>
                            <table class="layui-table" lay-skin="line" style="width:100%;">
                                <tbody class="hot_news">
                                    <tr>
                                        <td align="center" style="height: 310px;">
                                            <iframe id="framereport3" src="" scrolling="no" frameborder="0" style="border:0px;" width="100%" height="300px"></iframe>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(function () {
            var timeno = new Date().getTime(); 
            $.ajax({
                url: "/Main/NoticeData?timeno="+timeno,
                type: "get",
                dataType: "html",
                cache: true,
                success: function (res, result) {
                    console.log(res);
                    if (result == "success") {
                        document.getElementById("notices").innerHTML = res;
                    }
                },
                error: function (error) {
                    return false;
                }
            });

        });
        function view(noticeid) { 
            var iWidth = 750; //弹出窗口的宽度;
            var iHeight = 450; //弹出窗口的高度;
            var t = (window.screen.availHeight - 30 - iHeight) / 2; //获得窗口的垂直位置;
            var l = (window.screen.availWidth - 10 - iWidth) / 2; //获得窗口的水平位置;
            //var l = (screen.availWidth - 500) / 2;
            //var t = (screen.availHeight - 300) / 2; 
            layui.use(['layer', 'form', 'element'], function () {
                var layer = layui.layer
                    , form = layui.form
                    , element = layui.element
                layer.open({
                    type: 2,
                    anim: 4,
                    scrollbar: false,
                    content: '/SystemManage/NoticeView/?noticeId=' + noticeid,
                    area: ['90%', '90%'],
                    id: 'ViewNOtice',
                    title: '查看公告'

                });
            });  
            //window.open('/SystemManage/NoticeView/?noticeId=' + noticeid, '_blank', 'location=yes,height=450,width=750,top=' + t + ',left=' + l + ',toolbar=no,menubar=no,location=no,status=yes');
        }
    </script>
</body>
<!--下拉输入选择框工具栏-->

<script src="/Content/layui/layui.js"></script>
<script type="text/javascript">
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //自定义背景色主题 - 非常实用
        //日期时间范围
        laydate.render({
            elem: '#txtdate'
            , range: '~'
            , value: '@DateTime.Now.ToString("yyyy-MM-dd")' + ' 00:00:00' + ' ~ @DateTime.Now.ToString("yyyy-MM-dd")' + ' 23:59:59'
            , theme: '#395E67'
             , type: 'datetime'
        });
    });
    BindChart(1);
</script>
</html>