zuel-itsm-3.0.2/assets/views/incident/list.html

<div ng-controller="incidentListCtrl" class="">
    <section id="page-title">
        <div class="row">
            <!-- <i class="iconfont icon-bianji pull-left"></i> -->
            <div class="col-sm-8">
                <h1 class="mainTitle">事件列表
                    <i tooltip='事件列表,点击操作处理任务' tooltip-placement="right"
                        class="fa  ti-help-alt margin-left-10 fontcolor-five pointfont"></i>
                </h1>
            </div>
        </div>
    </section>
    <div class="listbote">
        <div class="list-controls clearfix">
            <div class="btn-group">
                <button class="btn btn-statebutton statebutton  keepleftbottom wt_btn2" ng-click="onChange('all')"
                    ng-class="{'statecolor':searchstate=='all'}">全部</button>
                <button class="btn btn-statebutton statebutton wt_btn2" ng-class="{'statecolor':searchstate=='todo'}"
                    ng-click="onChange('todo')">待处理</button>
                <button class="btn btn-statebutton statebutton wt_btn2" ng-class="{'statecolor':searchstate=='done'}"
                    ng-click="onChange('done')">处理过</button>
                <button class="btn btn-statebutton statebutton keeprightbottom wt_btn2"
                    ng-class="{'statecolor':searchstate=='create'}" ng-click="onChange('create')">我创建</button>
                <!-- <button class="btn btn-statebutton statebutton keeprightbottom wt_btn2" ng-class="{'statecolor':searchstate=='overDate'}"
                    ng-click="onChange('overDate')">已逾期</button> -->
                <!-- <button class="btn btn-statebutton statebutton keeprightbottom wt_btn2" ng-class="{'statecolor':searchstate=='wt_all'}" ng-click="onChange1('wt_all')">我的通知</button> -->
            </div>
            <!-- <div class="btn-group" ng-if="!allright">
                <button class="btn btn-statebutton statebutton  keepleftbottom" ng-click="onChange('all')" ng-class="{'statecolor':searchstate=='all'}">全部</button>
                <button class="btn btn-statebutton statebutton  keepleftbottom" ng-class="{'statecolor':searchstate=='todo'}" ng-click="onChange('todo')">待处理</button>
                <button class="btn btn-statebutton statebutton" ng-class="{'statecolor':searchstate=='done'}" ng-click="onChange('done')">处理过</button>
                <button class="btn btn-statebutton statebutton keeprightbottom" ng-class="{'statecolor':searchstate=='create'}" ng-click="onChange('create')">我创建</button>
            </div> -->
        </div>

        <!-- <button class="blank btn btn-downbutton downbutton" ng-click="onChange()"><span >全部事件</span></button> -->
        <div style="background: #F9F9F9 !important;padding-left: 16px;padding-right: 0px;">
            <div class="row wt_searchlistback" id="searchid">

                <div class="col-xs-10" style="padding-right: 0px !important;padding-bottom: 10px;">

                    <form class="form-inline incidentsearchsize" style='padding-top: 8px'>
                        <!-- <div class="form-group incidentsearch">
                        <div class="pull-right">
                            <div class="control-label pull-left margin-top-5 margin-right-5">列表分类:</div>
                            <ui-select class="pull-left selectzise" ng-model="searchkeys.searchdatas" theme="bootstrap">
                                <ui-select-match placeholder="">
                                    {{$select.selected.name}}
                                </ui-select-match>
                                <ui-select-choices repeat="item in states | filter: $select.search">
                                    <div ng-bind-html="item.name | highlight: $select.search"></div>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                    </div> -->

                        <div class="form-group incidentsearch  wt_width" ng-if="repairMain.valueconfig == 2">
                            <div class="">
                                <div class="control-label pull-left margin-top-5">报修科室:</div>
                                <ui-select class="pull-right selectzise wt_width1 wt_width3"
                                    ng-model="searchkeys.department" theme="bootstrap">
                                    <ui-select-match placeholder="">
                                        {{$select.selected.dept}}
                                    </ui-select-match>
                                    <ui-select-choices repeat="item in department"
                                        refresh="onChangeDept($select.search)">
                                        <div ng-bind-html="item.dept | highlight: $select.search"></div>
                                    </ui-select-choices>
                                </ui-select>

                                <!-- <ui-select class="pull-left" style="width:101px" ng-model="searchkeys.handlingPersonnelUser" theme="bootstrap">
                                    <ui-select-match placeholder="">
                                        {{$select.selected.name}}
                                    </ui-select-match>
                                    <ui-select-choices repeat="item in handlingPersonnelUser" refresh="onChangehandling($select.search)">
                                        <div ng-bind-html="item.name | highlight: $select.search"></div>
                                    </ui-select-choices>
                                </ui-select> -->
                            </div>
                        </div>
                        <div class="form-group incidentsearch  wt_width" ng-if="repairMain.valueconfig == 1">
                            <div class="">
                                <div class="control-label pull-left margin-top-5">报修人:</div>
                                <ui-select class="pull-right selectzise wt_width1 wt_width3"
                                    ng-model="searchkeys.requester" theme="bootstrap">
                                    <ui-select-match placeholder="">
                                        {{$select.selected.name}}
                                    </ui-select-match>
                                    <ui-select-choices repeat="item in requester"
                                        refresh="onChangehandling($select.search)">
                                        <div ng-bind-html="item.name | highlight: $select.search"></div>
                                    </ui-select-choices>
                                </ui-select>

                                <!-- <ui-select class="pull-left" style="width:101px" ng-model="searchkeys.handlingPersonnelUser" theme="bootstrap">
                                    <ui-select-match placeholder="">
                                        {{$select.selected.name}}
                                    </ui-select-match>
                                    <ui-select-choices repeat="item in handlingPersonnelUser" refresh="onChangehandling($select.search)">
                                        <div ng-bind-html="item.name | highlight: $select.search"></div>
                                    </ui-select-choices>
                                </ui-select> -->
                            </div>
                        </div>
                        <div class="form-group incidentsearch  wt_width" ng-if="repairMain.valueconfig == 1">
                            <div class="">
                                <div class="control-label pull-left margin-top-5">联系电话:</div>
                                <input class=" inputcolor wt_width1 wt_width3 pull-right" type="text"
                                    ng-model="searchkeys.requester.mphone" placeholder="" />
                            </div>
                        </div>

                        <!-- <div class="form-group incidentsearch  wt_width">
                            <div class="">
                                <div class="control-label pull-left margin-top-5">故障地点:</div>
                                <div class="address-wrap pull-right wt_width1 wt_width3">
                                    <input class=" inputcolor"
                                        type="text" ng-model="searchkeys.houseNumber" id="bx_address" placeholder=""
                                        ng-click="addressClickHandle()" ng-change="addressChangeHandle()" />
                                    <ul id="bx_address_ul" ng-show="addressFlag" ng-nicescroll>
                                        <li ng-repeat="item in address_arr" ng-click="addressItemClick(item)">
                                            {{item.place?item.area.area+item.place:item.area}}</li>
                                    </ul>
                                </div>
                            </div>
                        </div> -->
                        <div class="form-group incidentsearch wt_width">
                            <!-- <div class="pull-right"> -->
                            <div class="control-label pull-left margin-top-5 ">区域:</div>
                            <ui-select class="pull-right selectzise wt_width1 wt_width3" ng-model="searchkeys.area" theme="bootstrap"
                                ng-change="onChangearea(searchkeys)">
                                <ui-select-match placeholder="">
                                    {{$select.selected.area}}
                                </ui-select-match>
                                <ui-select-choices repeat="item in outarea | filter: $select.search">
                                    <div ng-bind-html="item.area | highlight: $select.search"></div>
                                </ui-select-choices>
                            </ui-select>
                            <!-- </div> -->
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <!-- <div class="pull-right"> -->
                            <div class="control-label pull-left margin-top-5">地点:</div>
                            <ui-select class="pull-right selectzise wt_width1 wt_width3" ng-model="searchkeys.place" theme="bootstrap"
                                ng-change="onChangeplace(key)">
                                <ui-select-match placeholder="">
                                    {{$select.selected.place}}
                                </ui-select-match>
                                <ui-select-choices repeat="item in outplace | filter: $select.search">
                                    <div ng-bind-html="item.place | highlight: $select.search"></div>
                                </ui-select-choices>
                            </ui-select>
                            <!-- </div> -->
                        </div>
                        <div class="form-group incidentsearch  wt_width">
                            <div class="control-label pull-left margin-top-5">状态:</div>
                            <ui-select class="pull-right selectzise wt_width1 wt_width3" ng-model="othcode.state"
                                theme="bootstrap">
                                <ui-select-match placeholder="">
                                    {{$select.selected.name}}
                                </ui-select-match>
                                <ui-select-choices repeat="item in state | filter: $select.search">
                                    <div ng-bind-html="item.name | highlight: $select.search"></div>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                        <div class="form-group incidentsearch  wt_width">
                            <div class="control-label pull-left margin-top-5">事件分类:</div>
                            <multi-select-tree class="pull-right selectzise wt_width1 wt_width3"
                                ng-model="cifilter_classic" data-input-model="select_treedata"
                                data-output-model="cifilter_classics" theme="bootstrap" multi-select="false"
                                data-callback="onFilterCallback(item)" data-select-only-leafs="true"
                                reset-search-input="false" data-trans-label="category" data-switch-view="false">
                            </multi-select-tree>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div class="control-label pull-left margin-top-5 ">受理人:</div>
                            <ui-select class="pull-right selectzise wt_width1 wt_width3"
                                ng-model="searchkeys.acceptUser" theme="bootstrap">
                                <ui-select-match placeholder="">
                                    {{$select.selected.name}}
                                </ui-select-match>
                                <ui-select-choices repeat="item in acceptUser | filter: $select.search"
                                    refresh="onChangeacceptUser($select.search)" refresh-delay="0">
                                    <div ng-bind-html=" item.name | highlight: $select.search "></div>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div class="control-label pull-left margin-top-5">处理人:</div>
                            <ui-select class="pull-right selectzise wt_width1 wt_width3"
                                ng-model="searchkeys.handlingPersonnelUser" theme="bootstrap">
                                <ui-select-match placeholder="">
                                    {{$select.selected.name}}
                                </ui-select-match>
                                <ui-select-choices repeat="item in handlingPersonnelUser"
                                    refresh="onChangehandling($select.search)">
                                    <div ng-bind-html="item.name | highlight: $select.search"></div>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div class="">
                                <div class="control-label pull-left margin-top-5">登记时间:</div>
                                <input type="text" class=" incidentsearchsize wt_width5"
                                    datepicker-popuptime="yyyy-MM-dd" ng-model="searchkeys.acceptDate"
                                    max-date="searchkeys.acceptDateEnd" is-open="startOpened" hour-time=true
                                    ng-init="startOpened = false" close-text="关闭" ng-click="startOpen($event)"
                                    placeholder="" />
                            </div>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div class="">
                                <div class="control-label pull-left margin-top-5">至</div>
                                <input type="text" class=" selectzise incidentsearchsize wt_width5"
                                    datepicker-popuptime="yyyy-MM-dd" ng-model="searchkeys.acceptDateEnd" hour-time=true
                                    min-date="searchkeys.acceptDate" is-open="endOpened" ng-init="endOpened = false"
                                    close-text="关闭" ng-click="endOpen($event)" placeholder="" />
                            </div>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div>
                                <div class="control-label pull-left margin-top-5 margin-right-5">事件单号:</div>
                                <input class="f inputcolor wt_width1 wt_width3 pull-right" type="text"
                                    ng-model="searchkeys.incidentsign" placeholder="" />
                            </div>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div class="control-label pull-left margin-top-5">是否逾期:</div>
                            <ui-select ng-change="selectTypeChange()" ng-model="searchkeys.selectType" class="pull-right selectzise wt_width1 wt_width3" theme="bootstrap">
                                <ui-select-match>
                                    <span ng-bind="$select.selected.name"></span>
                                </ui-select-match>
                                <ui-select-choices repeat="item in selectType">
                                    <span ng-bind="item.name"></span>
                                </ui-select-choices>
                             </ui-select>
                        </div>
                        <!-- <div class='wt_width6' style="">
                            <span class="panel-title text-dark">至</span>
                        </div>
                        <div class="form-group incidentsearch wt_width">
                            <div class="">
                                <input type="text" class=" selectzise incidentsearchsize wt_width5" style='    float: left;'
                                    datepicker-popuptime="yyyy-MM-dd" ng-model="searchkeys.acceptDateEnd" hour-time=true
                                    min-date="searchkeys.acceptDate" is-open="endOpened" ng-init="endOpened = false"
                                    close-text="关闭" ng-click="endOpen($event)" placeholder="" />
                            </div>
                        </div> -->
                        <!-- <div class="form-group">
                    <button class="btn btn-light-orange" ng-click="chiceIncident(parameters,key)" type="button" ng-disabled="!((parameters.paramDateFrom&&parameters.paramDateTo)||key.area)">搜索</button>
                </div> -->
                    </form>
                </div>
                <div class="col-xs-2 wt_pad">
                    <!-- <hr style="height:60px !important;width:5px;color:red;margin-top:0px;margin-bottom: 0px;border-top: 1px solid #eee;" class="pull-left" /> -->
                    <div class="" style='padding-top: 8px'>
                        <!-- <table class="pull-left hrboardr">
                    <tr>
                        <td valign="top"></td>
                    </tr>
                </table> -->
                        <!-- <div class="centerdiv"></div> -->
                        <div class="pull-left margin-top-10 searchBtnBox">
                            <!-- <div class="form-group wt_btns">
                                <div class="btn btn-searchbutton wt_btn1 wt_btnColor2" ng-click="chiceIncident(searchkeys,othcode.state)" type="button">搜索</div>
                            </div>

                            <div class="form-group wt_btns">
                                <div class="btn btn-searchbutton steelbutton wt_btn1 wt_btnColor1" ng-click="replacement(parameters,searchkeys,othcode)" type="button">重置</div>
                            </div> -->
                            <div class=" wt_btns">
                                <div class="btn btn_search" ng-click="chiceIncident(searchkeys,othcode.state)"
                                    type="button">搜索</div>
                            </div>

                            <div class=" wt_btns">
                                <div class="btn btn_clean" ng-click="clear()" type="button">重置</div>
                            </div>
                            <!-- <button class="btn btn-searchbutton steelbutton margin-top-10" ng-click="chiceIncident(searchkeys,othcode.state)" type="button">搜索</button>
                            <button class="btn btn-default  margin-top-10" ng-click="export()" ladda="ldloading.zoom_in" data-style="zoom-in"><span translate="sidebar.nav.configuremanagerdb.LISTButton.EXPORT ">Export
                                    Data</span></button>
                            <button class="btn btn-exportbutton exportbutton margin-top-10" ng-click="clear()" ladda="ldloading.zoom_in" data-style="zoom-in">清空</button> -->
                            <!-- <div class=" wt_btns">
                                <div class="btn btn-searchbutton steelbutton wt_btn1 wt_btnColor1" ng-click="jry_refresh()"
                                    type="button">刷新</div>
                            </div> -->
                            <div class=" wt_btns">
                                <div class="btn btn_clean" ng-click="goToAddIncident()" type="button">新增事件</div>
                            </div>
                            <div class=" wt_btns blank" ng-show="daochu">
                                <button class=" btn btn_other" ng-click="export()" ladda="ldloading.zoom_in"
                                    data-style="zoom-in">
                                    <span translate="sidebar.nav.configuremanagerdb.LISTButton.EXPORT ">Export
                                        Data</span>
                                </button>
                            </div>
                            
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- <div class="panel">
            <div class="panel-heading px-nested-panel-heading clearfix">
                <h3 ng-click="export()" class="panel-title text-secondhead pull-right bluefont pointfont"><i class="icon  iconfont icon-daochu daochulist"></i>导出列表</h3>
            </div>
        </div> -->
        <div class="wt_list">
            <div ui-i18n="{{lang}} " style="background: #fff;">
                <div id="grid" style="border-radius: 2px !important;" ui-grid="gridOptions " ui-grid-pagination
                    external-scopes="$scope " ui-grid-resize-columns ui-grid-auto-resize class="grid "></div>
            </div>
        </div>
    </div>
</div>

<style>
    @media screen and (max-width: 1750px) {
        .wt_width {
            width: 30% !important;
        }

        .wt_width1 {
            width: 60% !important;
        }

        .wt_width4 {
            width: 27% !important;
        }

        .wt_width5 {
            width: 60% !important;
            border-color: #dedede;
            float: right;
        }

    }

    .selectzise {
        width: 160px;
    }

    .wt_width {
        width: 20%;
        margin-right: 16px;
        min-width: 275px !important;
    }

    .wt_width1 {
        width: 160px;
    }

    .wt_margin-top {
        margin-top: 35px !important;
    }

    .form-inline .form-control {
        border-radius: 2px;
    }

    .wt_width3 {
        width: 160px;
        height: 28px !important;
        border-radius: 2px !important;
    }

    .wt_width4 {
        width: 20%;
    }

    .wt_width5 {
        width: 160px;
        border-color: #dedede;
        float: right;
        height: 28px;
        border-radius: 2px !important;
    }

    .wt_width6 {
        display: inline-block;
        padding-top: 0px;
        position: relative;
        top: 4px;
        /* left: 10px; */
        width: 8.2%;
        text-align: left;
    }

    .ui-select-bootstrap .ui-select-toggle {
        height: 28px;
    }

    /* 
    .wt_width {
        width: 20%;
        margin-right: 1%;
        padding: 0px;
    }

    .wt_width1 {
        width: 100% !important;
        padding: 0px;
    } */

    .wt_width2 {
        width: 50% !important;
    }

    .wt_pad {
        padding: 0px;
    }

    .wt_btns {
        display: inline-block;
        margin-right: 8px;
    }

    .wt_btn1 {
        width: 60px;
        height: 28px !important;
        border-radius: 2px;
        line-height: 28px;
        font-size: 14px;
        padding: 0px !important;
        font-size: 14px !important;
    }

    .btn.steelbutton.wt_btn1 {
        padding: 0px !important;
    }

    .wt_btnColor {
        background: #4A90E2 !important;
    }

    /* .btn{
        padding: 0px!important;
    } */


    .wt_btnColor:hover {
        background: #fff !important;
        color: #2B5EB8 !important;
        border: 1px solid #2B5EB8;
    }

    .wt_btnColor2:hover {
        background: #fff !important;
        color: #2B5EB8 !important;
        border: 1px solid #2B5EB8;
    }

    .wt_btn2 {
        width: 100px;
        height: 34px !important;
        border-radius: 2px !important;
    }

    .wt_list {
        padding: 15px;
        background: #F9F9F9;
    }

    .ui-grid-render-container:hover {
        background: #fff !important;
    }

    .wt_btnColor1 {
        background: #fff !important;
        color: #2B5EB8 !important;
        border: 1px solid #2B5EB8;
    }

    .wt_btnColor1:hover {
        background: #4A90E2 !important;
        color: #fff !important;
        border: 1px solid #4A90E2 !important;
    }

    div.ui-grid-row.ng-scope:hover {
        cursor: pointer;
        background: #fff !important;
    }

    .wt_searchlistback {
        margin-top: 1px;
        margin-bottom: 8px;
        border-top-left-radius: 0px !important;
        border-top-right-radius: 8px !important;
        border-bottom-left-radius: 8px !important;
        border-bottom-right-radius: 8px !important;
    }

    .ui-grid-row:nth-child(even) .ui-grid-cell {
        background: #fafafa !important;
    }

    .searchBtnBox>.wt_btns {
        margin: 0 8px 10px 0;
    }

    /* 故障地点 */
    .address-wrap {
        position: relative;
        height: 28px;
    }
    #bx_address{
        height: 100%;
    }

    #bx_address_ul {
        position: absolute;
        top: 28px;
        left: 0;
        width: 100%;
        max-height: 136px;
        overflow-y: auto;
        background-color: #fff;
        border: 1px solid #d1d1d1;
        border-top: none;
        z-index: 9999;
    }

    #bx_address_ul li {
        height: 34px;
        border-bottom: 1px solid #d1d1d1;
        line-height: 32px;
        padding: 0 16px;
        cursor: pointer;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #bx_address_ul li:hover {
        /* background-color: #005395; */
        /* color: #fff; */
    }

    #bx_address_ul li:last-child {
        border-bottom: none;
    }
</style>