ZLPMS/PMS.WebUI/Views/ClassifyManage/Home/Dashboard.cshtml

@{
    ViewBag.Title = "Dashboard";
    Layout = "~/Views/Shared/_MainLayoutPage.cshtml";
}

<style type="text/css">
    .outer {
        width: 100%;
        height: 180px;
        display: -webkit-flex;
        justify-content: space-between; /*决定子元素两端对齐，均匀间隔*/
        align-item: center; /*决定子元素垂直居中*/
        /*flex-wrap: wrap; 子元素超出换行，默认是不换行的，当子元素的宽由flex决定时会失效*/
        margin-bottom: 5px;
    }

        .outer .chart-container {
            width: 260px;
            float: left;
            height: 180px;
            margin: 3px;
           cursor:pointer;
        }

    .highcharts-yaxis-grid .highcharts-grid-line {
        display: none;
    }

    p {
        padding: 2px;
    } 
    #Newnoty a{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px;
    display: inline-block;
    }

    @@media (max-width: 600px) {
        .outer {
            width: 100%;
            height: 400px;
        }

            .outer .chart-container {
                width: 300px;
                float: none;
                margin: 0 auto;
             
            }
    }
</style>
<script src="~/Content/Scripts/plugins/hcharts/highcharts.js"></script>
<script src="~/Content/Scripts/plugins/hcharts/highcharts-more.js"></script>
<script src="~/Content/Scripts/plugins/hcharts/modules/solid-gauge.js"></script>
<script src="~/ViewModels/dashboard.js?v=1.13"></script>
<div class="outer">
    <div onclick="NotFinishList(3)" id="container0" class="chart-container"></div>
    <div onclick="NotFinishList(2)" id="container1" class="chart-container"></div>
    <div onclick="NotFinishList(1)" id="container2" class="chart-container"></div>
    <div onclick="NotFinishList(4)" id="container3" class="chart-container"></div>
    <div onclick="NotFinishList(5)" id="container4" class="chart-container"></div>
</div>
<div class="outer" style="height:230px;">
    <div class="easyui-panel" title="<i class='fa fa-flag'></i> 与我相关的问题(最近5条)" data-options="tools:[{iconCls:'fa fa-folder-open',handler:function(){alert('浏览更多')}}]" style="width:33%;height:230px;float:left">
        <table id="dgMyProlem"></table>
    </div>
    <div class="easyui-panel" title="<i class='fa fa-hand-o-right'></i> 常见问题处理" data-options="tools:[{iconCls:'fa fa-folder-open',handler:function(){alert('浏览更多')}}]" style="width:33%;height:230px;">
        <table id="dgNorProlems"></table>
    </div>
    <div id="Newnoty" class="easyui-panel" title="<i class='fa fa-volume-up'></i> 最新公告" data-options="tools:[{iconCls:'fa fa-folder-open',handler:function(){MessageList()}}]" style="width:33%;height:230px;padding:10px;">
        
        
    </div>
</div>
<div style="width:100%;height:400px; border-top:solid 1px #EEE; border-bottom:solid 1px #eee; margin:3px;">
    <div id="container-column" style="width: 48%; height: 400px; float:left;"></div>
    <!--问题处理延迟环节-->
    <div id="problemStop" style="width: 45%; height: 400px; float:left;"></div>
</div>

<script type="text/javascript">
    var RYXZ= '@ViewBag.RYXZ'
    var model = new viewModel(RYXZ);
    model.init();
    //消息列表
    function MessageList() {
        top.ZLPMS.OpenNewWindow('消息列表', '/Home/MessageList', '795px', '523px', null);
    }
    //未完成列表
    function NotFinishList(Type) {
        top.ZLPMS.OpenNewWindow('未完成问题', '/Home/NotFinishProblem?Type=' + Type, '795px', '523px', null);
    }
    //详细消息查看
    function MessageDeatil(id) {
        top.ZLPMS.OpenNewWindow('消息详细', '/Home/MessageDeatil/' + id, '905px', '553px', null);
    }
</script>