zuel-itsm-3.0.2/assets/views/partials/off-sidebar.html

<!-- start: OFF RIGHT SIDEBAR TABSET -->
<!-- <tabset class="sidebar-wrapper" justified="true">
    <tab>
        <tab-heading>
            <i class="fa fa-phone"></i>
        </tab-heading>
        <div class="tab-pane" id="getup">
            <div class="users-list fontsizes-14">
                <botton href="#" ng-click="setbusy(1)" translate="offsidebar.login.SETBUSY" class="btn btn-setbusy setbusy" ng-if="statecall==1&&login&&statuscall!=3&&statuscall!=2">setbusy</botton>
                <botton href="#" ng-click="setidle()" translate="offsidebar.login.SETIDLE" class="btn btn-setidle setidle" ng-if="login&&statecall==2&&statuscall!=3&&statuscall!=2">setidle</botton>
                <botton href="#" style="float:right" ng-click="end()" translate="offsidebar.login.GETOUT" class="btn btn-getout getout" ng-if="login">getout</botton>
                <div class="row form-group fontcolor-two" style="margin-top:30px" id="updata" ng-if="!login">
                    <div class="col-xs-12 fontsizes-14">
                        <div class="col-xs-12">
                            <div class="control-label" for="title">
                                绑定分机:
                            </div>
                            <select class="form-control" ng-model="phone" ng-change="phoneChange(phone)">  
                                        <option ng-repeat="x in runNumber" value="{{x.name}}">{{x.name}}</option>  
                                    </select>
                        </div>
                        <div class="col-xs-12">
                            <button class="btn btn-addbutton  addbutton pull-right" style="margin-top:20px" ng-click="start(phone)" translate="offsidebar.login.GETIN"></button>
                        </div>
                    </div>
                </div>
                <div class="row form-group fontcolor-two" style="margin-top:30px" id="dialout" ng-if="login&&statuscall!=3">
                    <div class="col-xs-12 fontsizes-14">
                        <div class="col-xs-12">
                            <div>
                                <div class="control-label" for="title">
                                    目的号码:
                                </div>
                                <div class="">
                                    <input id="teleno" name="teleno" ng-model="teleno" class="form-control" placeholder="目的号码" />
                                </div>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <button class="btn btn-primary col-md-offset-6" style="margin-top:20px" ng-click="dialout(gid,teleno)" translate="offsidebar.login.DIALOUT"></button>
                        </div>
                    </div>
                </div>
                <div class="row form-group fontcolor-two" style="margin-top:30px" ng-if="login&&statuscall==3">
                    <div class="col-xs-12 fontsizes-14">
                        <div class="col-xs-12">
                            <div class="control-label" for="title" style="padding-right:0px">
                                转接号码:
                            </div>
                            <div class="">
                                <select-input class="openaddinput" onChangeadd="onChangeadd()" model={{telephone}} requesdata="telephone" showkeys="phone"></select-input>
                            </div>
                        </div>
                        <div class="col-xs-12">
                            <button class="btn btn-primary" style="margin-top:20px" ng-click="inittrans(telephone)" translate="offsidebar.login.INITTRANS"></button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </tab>
</tabset> -->
<div class="jry_flex">
    <div class="phone_call">
        <div class="tit">请选择坐席号:</div>
        <ui-select class="col-xs-12 margin-top-8" ng-model="jry_extnNumberObj.jry_extnNumber"
            theme="bootstrap">
            <ui-select-match placeholder="">
                {{$select.selected.name}}
            </ui-select-match>
            <ui-select-choices repeat="item in jry_extnNumberSelect">
                <div ng-bind-html="item.name"></div>
            </ui-select-choices>
        </ui-select>
        <div>
            <input type="button" value="签入" ng-click="jry_qianru()" ng-if="jry_state=='weiqianru'" class="jry_btn">
            <input type="button" value="签出" ng-click="jry_qianchu()" ng-if="jry_state!='weiqianru'" class="jry_btn">
        </div>
    </div>
</div>
<style>
    .jry_btn{
        width: 60px;
        height: 28px;
        background-color: #00437A;
        color: white;
        font-size: 14px;
        border: 0;
        border-radius: 4px;
        margin-top: 8px;
        float: right;
        font-weight: bold
    }
    .jry_flex{
        display: flex;
        flex-direction:column;
        height: 100%;
    }
    .jry_phoneIpt{
        width: 100%;
        margin-top: 5px;
    }
    .jry_phoneBtn{
        margin-left: 3px
    }
    .phone_call{
        padding:16px;
        /* background-color: white */
    }
    .phone_call .tit{
        height: 26px;
        line-height: 26px;
        font-size: 14px
    }
    .phone_call .phone_ipt{
        height: 30px;
        border:1px rgb(209,209,203) solid;
        margin-top: 5px
    }
    .phone_call .phone_ipt .ipt{
        width: 190px;
        float: left;
        padding-left: 5px;
        height: 27px;
        border:0;
        font-size: 13px
    }
    .phone_call .phone_ipt .phone_ico{
        float: left;
        width: 35px;
        height: 29px;
        line-height: 29px;
        text-align: center;
        border-left: 1px rgb(209,209,203) solid;
        cursor: pointer;
    }
    .phone_call .phone_ipt .phone_ico i{
        color: blue;
        font-size: 18px;
    }
    .phone_call .phone_ipt .ipt:focus{
        outline: none
    }
    .unanswered_tit{
        height: 34px;
        background-color: rgb(243,243,243);
        line-height: 34px;
        font-size: 14px;
        padding-left: 16px
    }
    .unanswered_list{
        height: 100%;
        background-color: white;
        overflow-y: scroll
    }
    .unanswered_list .unanswered_phone{
        
    }
    .unanswered_list .unanswered_phone .unanswered_phone_msg{
        display: flex;
        padding: 16px;
        align-items:center
    }
    .unanswered_list .unanswered_phone .unanswered_phone_msg div:nth-child(1){
        width: 60%
    }
    .unanswered_list .unanswered_phone .unanswered_phone_msg div:nth-child(1) span{
        color:red
    }
    .unanswered_list .unanswered_phone .unanswered_phone_msg div:nth-child(2){
        font-size: 12px;
        color:rgb(164,164,164)
    }
    .unanswered_list .unanswered_phone .unanswered_fot_ipt{
        height: 34px;
        border-top:1px rgb(243,243,243) solid;
        border-bottom:1px rgb(243,243,243) solid;
    }
    .unanswered_list .unanswered_phone .unanswered_fot_ipt div:nth-child(1){
        height: 34px;
        line-height: 34px;
        background-color: #f9f9f9;
        color: #005395;
        font-size: 14px;
        width: 49%;
        float: left;
        text-align: center;
        cursor: pointer;
    }
    .unanswered_list .unanswered_phone .unanswered_fot_ipt div:nth-child(2){
        height: 34px;
        line-height: 34px;
        font-size: 14px;
        width: 49%;
        border-left: 1px rgb(243,243,243) solid;
        float: left;
        text-align: center;
        cursor: pointer;
    }
    .unanswered_list::-webkit-scrollbar{
        display: none
    }
</style>