itsm-pc-handle/assets/views/system/qxgl_wt.html

<section id="page-title">
    <div class="row">
        <div class="col-sm-8">
            <h1 class="mainTitle">CMDB权限管理
                <!-- <i tooltip='新增或编辑故障现象' tooltip-placement="right" class="fa ti-help-alt margin-left-10 fontcolor-five pointfont"></i> -->
            </h1>
        </div>
    </div>
</section>
<div ng-controller="qxgl_wtCtrl">
    <div class="col-sm-2 wt_qx_L">
        <div class="wt_qx_L_top">人员姓名</div>
        <div class="wt_qx_L_bom">
            <div class="wt_qx_L_ss">
                <input type="text" class="col-sm-9 wt_qx_L_ipt" placeholder="请输入关键字查询" ng-change="ss_name()" ng-model="wt_names">
                <div class="col-sm-3 wt_qx_L_btn" ng-click="wt_ss()">搜索</div>
            </div>
            <div class="wt_names">
                <div ng-repeat="item in userDatas" class="wt_qx_L_name" ng-click="my_tree_handler(item,$index)" ng-class="{'wt_name1':userIndex==$index}">
                    <!-- <i class="icon iconfont icon-ziyuan-wode"></i> -->
                    {{item.name}}</div>
                <!-- <abn-tree tree-data="userDatas" tree-control="my_tree" on-select="my_tree_handler(branch)" expand-level="2" icon-leaf="iconfont icon-zuzhijiaose" icon-expand="ti-plus" icon-collapse="ti-minus "></abn-tree> -->
            </div>

        </div>
    </div>
    <div class="col-sm-10 wt_qx_C">
        <div class="wt_qx_C_top">资产分类 :
            <div class="wt_qx_C_fl">
                <!-- <multi-select-tree ng-model="cifilter_classic" data-input-model="select_treedata" data-output-model="cifilter_classics" theme="bootstrap"
                    multi-select="false" data-default-label="资产分类" data-callback="onFilterCallback(item)" data-select-only-leafs="true"
                    reset-search-input="false" data-trans-label="label" data-switch-view="false"></multi-select-tree>
                <img src="assets/images/jiang/arrow.png" alt="" class="jiantou"> -->
            </div>
        </div>
        <div class="wt_qx_C_bom">
            <div class="tab-mainDiv-body">
                <div class="box-tree">
                    <!-- <span ng-if="doing_asyncpower ">...加载中...</span> -->
                    <abn-trees tree-data="my_power " on-chioce="formbranch(item)" tree-control="my_tree " expand-level="" relation=true getchild=true
                        icon-expand="ti-plus " icon-collapse="ti-minus " check-boxs=true></abn-trees>
                    <!-- <abn-trees tree-data="my_power " on-chioce="formbranch(item)" tree-control="my_tree " expand-level="" relation=true getchild=true icon-expand="iconfont icon-tianjia" icon-collapse="iconfont icon-qiepian44" check-boxs=true></abn-trees> -->
                </div>
            </div>
        </div>
    </div>
    <div class="col-sm-12 wt_qx_F">
        <div class="btn btn_search" ng-click="changeData()">确认</div>
        <!-- <button class="wt_qx_b2">取消</button> -->
    </div>

</div>
<style>
    input[type="radio"], input[type="checkbox"]{
        /* margin-top: 0px */
    }
    ul.abn-tree li.abn-tree-row {
        height: 28px;
        line-height: 28px;
    }

    .box-tree .nav>li.active a:focus,
    .box-tree .nav>li.active {
        background: #E6EEF4;
    }

    ul.abn-tree li.abn-tree-row:hover {
        /* display: inline-block !important;
    width: 90%; */
        background: #E6EEF4;
    }

    .box-tree .nav>li>a:focus,
    .box-tree .nav>li>a:hover {
        background: #E6EEF4;
        color: #333
    }


    .wt_names {
        width: 100%;
        height: 91%;
        overflow: auto;
        margin-top: 10px;
    }

    /*滚动条样式*/

    .wt_names::-webkit-scrollbar {
        /*滚动条整体样式*/
        width: 4px;
        /*高宽分别对应横竖滚动条的尺寸*/
        height: 4px;
    }

    .wt_names::-webkit-scrollbar-thumb {
        /*滚动条里面小方块*/
        border-radius: 5px;
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        background: rgba(0, 0, 0, 0.2);
    }

    .wt_names::-webkit-scrollbar-track {
        /*滚动条里面轨道*/
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
        border-radius: 0;
        background: rgba(255, 255, 255, 0.1);
    }

    /*滚动条样式*/

    .wt_qx_C_bom::-webkit-scrollbar {
        /*滚动条整体样式*/
        width: 4px;
        /*高宽分别对应横竖滚动条的尺寸*/
        height: 4px;
    }

    .wt_qx_C_bom::-webkit-scrollbar-thumb {
        /*滚动条里面小方块*/
        border-radius: 5px;
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        background: rgba(0, 0, 0, 0.2);
    }

    .wt_qx_C_bom::-webkit-scrollbar-track {
        /*滚动条里面轨道*/
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
        border-radius: 0;
        background: rgba(255, 255, 255, 0.1);
    }


    input::-webkit-input-placeholder {
        color: #ddd;
    }

    input::-moz-placeholder {
        /* Mozilla Firefox 19+ */
        color: #ddd;
    }

    input:-moz-placeholder {
        /* Mozilla Firefox 4 to 18 */
        color: #ddd;
    }

    input:-ms-input-placeholder {
        /* Internet Explorer 10-11 */
        color: #ddd;
    }

    .wt_qx_L_name {
        height: 28px;
        line-height: 28px;
        padding-left: 5px;
        cursor: pointer!important;
    }

    .wt_qx_C_fl {
        width: 20%;
        display: inline-block;
        position: relative;
        top: 13px;
        left: 10px;
    }

    .wt_qx_L_name:hover {
        background: #E6EEF4;
        border-radius: 2px;
    }

    .wt_name1 {
        background: #E6EEF4;
        border-radius: 2px;
    }

    .wt_qx_L {
        height: 600px;
        width: 19%;
        background: #F9F9F9;
        padding: 0px;
    }

    .wt_qx_L_top {
        background: #f3f3f3;
        height: 35px;
        padding-left: 10px;
        line-height: 35px;
        color: #333;
        font-size: 14px;
    }

    .wt_qx_L_bom {
        /* height: 100%; */
        /* width: 100%; */
        height: 543px;
        margin: 10px;
        background: #fff;
        border: 1px solid #ddd;
        /* overflow: auto; */
        padding: 16px 10px 0px 10px;
        border-radius: 2px;
    }

    .wt_qx_L_ss {
        height: 25px;
        border: 1px solid #ddd;
        border-radius: 3px;
    }

    .wt_qx_L_ipt {
        border-width: 0px !important;
        padding: 0px;
        height: 100%;
        /* color:#f3f3f3!important; */
    }

    .wt_qx_L_btn {
        display: inline-block;
        height: 25px;
        position: relative;
        bottom: 1px;
        right: -1px;
        padding: 0px;
        line-height: 25px;
        border-left: 1px solid #ddd;
        text-align: center;
        color: #ddd;
    }

    .wt_qx_L_btn:hover {
        cursor: pointer!important;
    }

    .wt_qx_C {
        height: 600px;
        width: 80%;
        background: #F9F9F9;
        margin-left: 1%;
        padding: 0px
    }

    .wt_qx_C_top {
        height: 60px;
        background: #f3f3f3;
        color: #333;
        line-height: 60px;
        padding-left: 10px;
        font-size: 14px;
    }

    .wt_qx_C_bom {
        height: 514px;
        margin: 14px;
        background: #fff;
        border: 1px solid #ddd;
        overflow: auto;
        padding: 24px;
    }

    .wt_qx_F {
        height: 60px;
        border-bottom: 1px solid #ddd;
        text-align: center;
        line-height: 60px;
    }

    .wt_qx_b1 {
        width: 80px;
        height: 34px;
        border: 1px solid!important;
        color: #fff;
        background: #005395;
        border-radius: 2px;
    }

    .wt_qx_b2 {
        width: 80px;
        height: 34px;
        border: 1px solid #ddd;
        color: #333;
        background: #F9F9F9;
        margin-left: 10px;
        border-radius: 2px;
    }
</style>