zuel-itsm-3.0.2/assets/views/dashboard/newdash.html

<style>
    .bodybackground {
        background: #eee;
    }
    
    .know-text-group {
        display: inline-block;
        box-sizing: border-box;
        border-radius: 2px;
        /* border: 1px solid #fff; */
        padding-top: 5px;
        width: 100%;
        padding-bottom: 5px;
    }
    
    .know-text-group-div {
        display: inline-block;
        width: 12%;
        padding-top: 5px;
        padding-bottom: 5px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    
    .know-text-group-div:hover {
        background-color: #005395 !important;
        color: #fff;
    }
    
    .know-text-group-div.active,
    .know-text-group-div:focus,
    .know-text-group-div:hover {
        background-color: #005395 !important;
        color: #fff;
    }
    
    .know-text-color {
        padding-left: 14px;
        font-size: 14px;
        color: #93989e;
    }
    
    .know-span {
        display: inline-block;
        text-align: center;
    }
    
    .know-num {
        width: 28px;
        height: 20px;
        line-height: 20px;
        font-size: 12px;
        border-radius: 10px;
        margin-right: 10px;
        color: white;
    }
    
    .bg-yellow {
        background: #005395;
    }
    
    .bg-green {
        background: #2edbb8;
    }
    
    .bg-blue {
        background: #6f9ad4;
    }
    
    .leftBorder {
        border-left: 1px solid #eeeeee;
    }
    
    .leftBorder.active,
    .leftBorder:focus,
    .leftBorder:hover {
        border-left: 0px solid #005395;
    }
    
    .divRight {
        float: right;
    }
    
    input[type="text"] {}
    
    .searchInput {
        border: none !important;
    }
    
    input:focus {
        box-shadow: none !important;
        border: none !important;
        background-color: white !important;
    }
    
    .know-left-div {
        width: 706px;
        /* margin-top: 15px; */
        /* display: inline-block; */
        float: left;
        margin-right: 20px;
    }
    
    .know-right-div {
        /* margin-top: 15px; */
        /* display: inline-block; */
        overflow: hidden;
    }
    
    .know-left-up-div {
        margin-bottom: 20px;
    }
    
    .know-left-div-head {
        height: 34px;
        line-height: 34px;
        background: #e9eff8;
        font-size: 14px;
        color: #606367;
        border-radius: 8px 8px 0 0;
        padding-left: 10px;
    }
    /* .listheight {}
     */
    
    .gobutton {
        color: 005395;
        font-family: "microsoft yahei";
    }
    
    .gobutton:hover {
        color: #1b3651;
    }
    
    .gobutton:focus,
    .gobutton:hover {
        color: #1b3651;
    }
    
    .dash_head {
        font-size: 14px;
    }
    
    .dash_headborder {
        height: 260px;
        border: 1px solid #dedede;
        border-radius: 2px;
    }
    
    .dashheadcolor {
        col-xs-1fff;
        border: 1px solid #dedede;
        border-radius: 2px;
    }
    
    .dash_mapborder {
        height: 320px;
        border: 1px solid #dedede;
        border-radius: 2px;
    }
    
    .disablecolor {
        color: #f3f3f3 !important;
    }
    
    .onlyaline {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    
    .newcolor {
        color: #79a3c4;
    }
    
    .form-controldash {
        color: #93989e;
        height: 20px;
        border-radius: 2px;
        border: 1px solid #d1d1d1;
    }
    
    .iconcolorjingji {
        color: #BE2636 !important;
    }
    
    .iconcoloryanzhong {
        color: #f5a623 !important;
    }
    
    .iconcoloryiban {
        color: #005396 !important;
    }
    
    .iconfontkill {
        font-family: iconfont!important;
        font-size: 18px;
        color: #000;
        z-index: 1;
        -webkit-font-smoothing: antialiased;
        -webkit-text-stroke-width: .2px;
    }
    
    .monthchoice {
        height: 200px;
        overflow-x: hidden;
        overflow-y: scroll;
        line-height: 30px;
        text-align: center;
    }
    
    .dropdown-menu.monthchoice {
        min-width: 30px !important;
    }
</style>
<div ng-style="bodyheight">
    <div ng-controller="newDashCtrl" class="">
        <div class="listbote dashheadcolor margin-top-15">
            <div class="list-controls clearfix">
                <div class="know-text-group">
                    <div class="know-text-group-div pointfont center" ng-click="gowechart()" ng-if="thisuserrole=='admin'||thisuserrole=='center'">
                        <span class="know-text-color"><i class="icon  iconfontsmall icon-baozhangzhuanhuan ashy"></i>移动端报障</span>
                    </div>
                    <div class="know-text-group-div  pointfont center" ng-click="gobaojin()" ng-if="thisuserrole=='admin'||thisuserrole=='center'">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontsmall icon-jiankongliebiao ashy"></i>监控报警</span>
                        </div>
                    </div>
                    <!-- <div class="know-text-group-div center pointfont" ng-click="gonewincident()">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontsmall icon-xinjiangongdan1 ashy"></i>新建事件</span>
                        </div>
                    </div> -->
                    <div class="know-text-group-div center pointfont" ng-click="goyuqi()">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontsmall icon-yiyuqi ashy"></i>逾期工单</span>
                        </div>
                    </div>
                    <!-- <div class="know-text-group-div center pointfont" ng-click="gonewproblem()">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontsmall icon-wentifankui ashy"></i>新建问题</span>
                        </div>
                    </div>
                    <div class="know-text-group-div center pointfont" ng-click="gonewchange()">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontkill icon-biangengshebei ashy"></i>新建变更</span>
                        </div>
                    </div> -->
                    <div class="know-text-group-div center pointfont" ng-click="goknowledge()">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontsmall icon-zhishiku4 ashy"></i>知识库</span>
                        </div>
                    </div>
                    <!-- <div class="know-text-group-div center pointfont" ng-click="gocmdb()">
                        <div class="leftBorder">
                            <span class="know-text-color"><i class="icon  iconfontsmall icon-zichanguanli ashy"></i>CMDB</span>
                        </div>
                    </div> -->
                </div>
            </div>
        </div>
        <div class="row" style="margin-left:-7px;margin-right:-7px">
            <div class="col-xs-4" style="padding-left:8px;padding-right:8px">
                <div class=" listheight dash_headborder">
                    <div class="col-xs-12 fenlei ">
                        <div class="fenleitop  fontsizes-14">
                            <div class="row bottomborder">
                                <div class="col-xs-12 fontcolor-two padding-15">
                                    <div class="fenleifont pull-left">待办事项</div>
                                    <div class="fenleifont pull-right fontcolor-ten fontsizes-14"><i class="icon  iconfontsmall icon-qiehuanzuo newcolor pointfont" ng-click="parselist()" ng-class=" { 'disablecolor':gaoliangleft} "></i>{{filterData.idx+1}}/{{totalPage}}<i class="icon  iconfontsmall icon-qiehuanyou newcolor pointfont"
                                            ng-class="{'disablecolor':gaoliangright}" ng-click="nextlist()"></i></div>
                                </div>
                            </div>
                            <form role="form" class="fontsizes-12 fontcolor-ten padding-top-15">
                                <table class="table table-noline" id="sample-table-1">
                                    <tbody>
                                        <tr ng-repeat="task in incidentlist">
                                            <td class="hidden-xs th-noline fontcolor-ten onlyaline" style="min-width:80px;"><span class="fontcolor-two">{{$index+filterData.idx*5+1}}.</span><span class="fontcolor-ten">{{task.orderId}}</span><span class="fontcolor-two">你有一条{{task.tolabelname}}待处理</span></td>
                                            <td class="th-noline pull-right onlyaline"><a ng-click="gotuclose(task)">去处理</a></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>
                <!-- </div> -->
            </div>
            <!-- <div class="col-xs-4 listheight dash_headborder">
            <div class="fenlei ">
                <div class="fenleitop  fontsizes-14">
                    <script type="text/ng-template" id="custom/pager">
                        <ul class="pagers ng-cloak">
                            <li ng-repeat="page in pages" ng-show="page.type == 'prev' || page.type == 'next'" ng-switch="page.type">
                                <a ng-switch-when="prev" class="noborder" ng-click="params.page(page.number)" href="">
                                    < </a>
                                        <span class="noborder" ng-switch-when="next"> 1/9</span>
                                        <a class="noborder" ng-switch-when="next" ng-click="params.page(page.number)" href="">></a>
                            </li>
                        </ul>
                    </script>
                    <table ng-table="tableParams" class="table table-striped" template-pagination="custom/pager">
                        <tr ng-repeat="user in $data">
                            <td>{{user.index}}</td>
                            <td>{{user.incidentsign}}</td>
                            <td>{{user.tolabelname}}</td>
                            <td>去处理</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div> -->
            <div class="col-xs-4" style="padding-left:8px;padding-right:8px">
                <div class="listheight dash_headborder">
                    <div class="fenlei col-xs-12 ">
                        <div class="fenleitop  fontsizes-14">
                            <!-- <div class="row bottomborder">
                                <div class="col-xs-12 fontcolor-two">
                                    <label class="fenleifont pull-left padding-top-5 fontsizes-14">消息通知</label>
                                    <a class="fenleifont pull-right  padding-top-5">更多>></a>
                                </div>
                            </div> -->
                            <div class="row bottomborder">
                                <div class="col-xs-12 fontcolor-two padding-15">
                                    <div class="fenleifont pull-left">消息通知</div>
                                    <a class="fenleifont pull-right  fontsizes-14" ng-click="wt_messages()">更多>></a>
                                </div>
                            </div>
                            <form role="form">
                                <table class="table table-hover table-noline  fontsizes-12" id="sample-table-1">
                                    <thead>
                                        <tr>
                                            <th class="th-noline" style="min-width:30px">发送人</th>
                                            <th class="th-noline" style="min-width:80px">内容</th>
                                            <th class="th-noline" style="min-width:50px">发送时间</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr ng-repeat="task in xiaoxilist">
                                            <td class="hidden-xs th-noline onlyaline" style="min-width:30px;max-width:40px">{{task.user.name}}</td>
                                            <td class="th-noline onlyaline" style="min-width:80px;max-width:100px">{{task.content}}</td>
                                            <td class="th-noline onlyaline" style="min-width:40px;max-width:50px">{{task.releaseTime}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-4" style="padding-left:8px;padding-right:8px" ng-if="thisuserrole=='center'">
                <div class="listheight dash_headborder">
                    <div class="fenlei col-xs-12 ">
                        <div class="fenleitop  fontsizes-14">
                            <div class="row bottomborder">
                                <div class="col-xs-12 fontcolor-two padding-15">
                                    <div class="fenleifont pull-left">告警详情</div>
                                    <a class="fenleifont pull-right  fontsizes-14" ng-click="gobaojin()">更多>></a>
                                </div>
                            </div>
                            <form role="form">
                                <table class="table table-hover table-noline fontsizes-12" id="sample-table-1">
                                    <thead>
                                        <tr>
                                            <th class="th-noline onlyaline" style="min-width:20px;max-width:30px"></th>
                                            <th class="th-noline onlyaline" style="min-width:80px;max-width:90px">告警日期</th>
                                            <th class="th-noline onlyaline" style="min-width:60px;max-width:70px">来源</th>
                                            <th class="th-noline onlyaline" style="min-width:50px;max-width:60px">定位</th>
                                            <th class="th-noline onlyaline" style="min-width:50px;max-width:60px">原因</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr ng-repeat="task in myDataalarmincident track by task.id" ng-click="jingjiinform(task)" class="pointfont">
                                            <td class="hidden-xs th-noline onlyaline" style="min-width:20px;max-width:30px"><i class="icon  iconfontsmall icon-jiankongtubiao" ng-class="{iconcolorjingji:task.alarm.alarmSeverity=='紧急',iconcoloryanzhong:task.alarm.alarmSeverity=='严重',iconcoloryiban:task.alarm.alarmSeverity=='一般',}"></i></td>
                                            <td class="hidden-xs th-noline onlyaline" style="min-width:80px;max-width:90px">{{task.alarm.addTime}}</td>
                                            <td class="th-noline onlyaline" style="min-width:50px;max-width:60px">{{task.alarm.alarmSystem}}</td>
                                            <td class="th-noline gobutton onlyaline" style="min-width:50px;max-width:60px">{{task.alarm.alarmLocation}}</td>
                                            <td class="th-noline onlyaline" style="min-width:50px;max-width:60px">{{task.alarm.alarmContent}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <!--我的排班-->
            <div class="col-xs-4" style="padding-left:8px;padding-right:8px" ng-if="thisuserrole!='center'">
                <div class="listheight dash_headborder">
                    <div class="fenlei col-xs-12 ">
                        <div class="fenleitop  fontsizes-14">
                            <div class="row bottomborder">
                                <div class="col-xs-12 fontcolor-two padding-15">
                                    <div class="fenleifont pull-left">我的排班</div>
                                    <a class="fenleifont pull-right  fontsizes-14" ng-click="gopaiban()">更多>></a>
                                </div>
                            </div>
                            <form role="form">
                                <table class="table table-hover table-noline fontsizes-12" id="sample-table-1">
                                    <thead>
                                        <tr>
                                            <th class="th-noline onlyaline" style="min-width:50px;max-width:60px">姓名</th>
                                            <th class="th-noline onlyaline" style="min-width:60px;max-width:70px">开始时间</th>
                                            <!-- <th class="th-noline onlyaline" style="min-width:60px;max-width:70px">结束时间</th> -->
                                            <th class="th-noline onlyaline" style="min-width:50px;max-width:60px">班次</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr ng-repeat="task in scheevents track by task.id">
                                            <td class="hidden-xs th-noline onlyaline" style="min-width:45px;max-width:50px">{{task.user.name}}</td>
                                            <td class="th-noline onlyaline" style="min-width:90px;max-width:100px">{{task.startTime}}</td>
                                            <!-- <td class="th-noline onlyaline" style="min-width:60px;max-width:70px">{{task.endTime}}</td> -->
                                            <td class="th-noline gobutton onlyaline" style="min-width:50px;max-width:60px">{{task.title}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row margin-top-15 margin-bottom-15" style="margin-left:-7px;margin-right:-7px">
            <div class="col-xs-6" style="padding-left:8px;padding-right:8px">
                <div class="listheight dash_mapborder">
                    <div class="fenlei col-xs-12" style="height:100%">
                        <div class="fenleitop fontsizes-14">
                            <!-- <div class="fenleifont pull-left">当月事件工单处理TOP5<span>我的排名</span><span>8</span></div>
                            <div class="fenleifont pull-right">报修单位</div> -->
                            <div class="row bottomborder">
                                <div class="col-xs-12 fontcolor-two padding-15">
                                    <div class="fenleifont pull-left">当月事件工单处理TOP5<span class="margin-left-10 fontcolor-ten fontsizes-14"><i class="icon  iconfontsmall icon-qiehuanzuo newcolor pointfont" mwl-date-modifier date="calendarDate" decrement="calendarView"></i>
                                       

                                        <div class="btn-group" dropdown>
                                            <div class="dropdown-toggle pointfont " dropdown-toggle>
                                                {{ thisyertop5}}年
                                            </div>
                                            <ul class="dropdown-menu pull-right dropdown-light monthchoice" role="menu" >
                                                <li ng-repeat="y in nian">
                                                    <a ng-model="thisyertop5" ng-click="changeyear(y)" href="">
                                                                {{y}}
                                                            </a>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="btn-group" dropdown>
                                            <div class="dropdown-toggle pointfont" dropdown-toggle>
                                                {{ thismonthtop5}}月
                                            </div>
                                            <ul class="dropdown-menu pull-right dropdown-light monthchoice" role="menu">
                                                <li ng-repeat="m in yue">
                                                    <a ng-model="calendarView" ng-click="changemonth(m)" href="">
                                                               {{m}}
                                                            </a>
                                                </li>
                                            </ul>
                                        </div>
                                        <i ng-disabled="maxtoptime" class="icon  iconfontsmall icon-qiehuanyou newcolor pointfont"
                                          mwl-date-modifier date="calendarDate" increment="calendarView"></i></span></div>

                                    <div class="fenleifont pull-right fontcolor-ten fontsizes-14"><span>我的排名</span><span>{{paiming}}</span></div>
                                </div>
                            </div>
                        </div>
                        <div id="fault" class="pull-left" style="width: 100%;
            height: 260px"></div>
                    </div>
                </div>
            </div>
            <div class="col-xs-3" style="padding-left:8px;padding-right:8px">
                <div class="listheight dash_mapborder">
                    <div class="fenlei col-xs-12 fontsizes-14">
                        <!-- <div class="fenleitop fontsizes-14">
                            <div class="fenleifont pull-left">当月工单解决率</div>
                            <div class="fenleifont pull-right">2018年10月10号 </div>
                        </div> -->
                        <div class="row bottomborder">
                            <div class="col-xs-12 fontcolor-two padding-15">
                                <div class="fenleifont pull-left">工单解决率</div>
                                <div class="fenleifont pull-right fontcolor-ten fontsizes-14"><span class="margin-left-10 fontcolor-ten fontsizes-14"><i class="icon  iconfontsmall icon-qiehuanzuo newcolor pointfont" mwl-date-modifier date="calendarDatejiejue" decrement="calendarView" ng-class=" { 'disablecolor':yueleft} "></i>

                                    <div class="btn-group" dropdown>
                                        <div class="dropdown-toggle pointfont" dropdown-toggle>
                                            {{ thisyerjiejue}}年
                                        </div>
                                        <ul class="dropdown-menu pull-right dropdown-light monthchoice" role="menu" >
                                            <li ng-repeat="y in nian">
                                                <a ng-model="thisyertop5" ng-click="jiejueyear(y)" href="">
                                                            {{y}}
                                                        </a>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="btn-group" dropdown>
                                        <div class="dropdown-toggle pointfont" dropdown-toggle>
                                            {{ thismonthjiejue}}月
                                        </div>
                                        <ul class="dropdown-menu pull-right dropdown-light monthchoice" role="menu">
                                            <li ng-repeat="m in yue">
                                                <a ng-model="calendarView" ng-click="jiejuemonth(m)" href="">
                                                           {{m}}
                                                        </a>
                                            </li>
                                        </ul>
                                    </div>
                                    
                                    
                                    <i class="icon  iconfontsmall icon-qiehuanyou newcolor pointfont"
                                    ng-class="{'disablecolor':yueright}"  mwl-date-modifier date="calendarDatejiejue" increment="calendarView"></i></span></div>
                            </div>
                        </div>
                        <div id="finish" class="pull-left" style="width: 100%;
            height: 260px"></div>
                    </div>
                </div>
            </div>
            <div class="col-xs-3" style="padding-left:8px;padding-right:8px">
                <div class="listheight dash_mapborder ">
                    <div class="fenlei col-xs-12 fontsizes-14">
                        <!-- <div class="fenleitop fontsizes-14">
                            <div class="fenleifont pull-left">知识库撰写量</div>
                            <a class="fenleifont pull-right">全部>></a>
                        </div> -->
                        <div class="row bottomborder">
                            <div class="col-xs-12 fontcolor-two padding-15">
                                <div class="fenleifont pull-left">知识库撰写量</div>
                                <a class="fenleifont pull-right  fontsizes-14" ng-click="goknowledge()">全部>></a>
                            </div>
                        </div>
                        <div id="knowlege" class="pull-left" style="width: 100%;
            height: 260px"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- </div> -->
</div>