@import "../../style/index.less";
@import "./mixin.less";
@import "../../formcontrols/checkbox/style/mixin.less";
@ui-prefix-tree: yyui-tree;
@tree-prefix-cls: ant-tree;
.checkbox(@checkbox-prefix-cls: ant-tree-checkbox);
.@{ui-prefix-tree}-wrapper {
  background-color: #fff;
  .yyui-tree{
    overflow: auto;
  }
  ////搜索栏样式
  //.yyui-inputbutton{
  //  display: table;
  //  width: 100%;
  //  .yyui-input{
  //    display: table-cell;
  //  }
  //  .yyui-button.ant-btn{
  //    display: block;
  //  }
  //}
  .yyui-tree-header{
    color:@text-color;
    background:@header-background;
    height:40px;
    line-height:24px;
    padding:8px 10px;
    font-size:@font-size-normal;
  }
  .yyui-tree-search{
    margin: 5px;
  }
  //带下拉的搜索栏样式
  .yyui-tree-search-select {
    margin: 5px;
    &.yyui-inputbutton {
      align-items: center;
      //.yyui-button.ant-btn{
      //  float: left;
      //}
    }
  }
  //带边框
  &.bordered{
    border: 1px solid @border-color-split;
    .yyui-tree-header{
      border-bottom: 1px solid @border-color-split;
    }
  }
}
.@{ui-prefix-tree} {
  &.@{tree-prefix-cls} {
    margin: 0;
    padding: 5px;
    font-size: @font-size-normal;
    background-color: #fff;
    li {
      padding: 2px 0;
      margin: 2px 0;
      list-style: none;
      white-space: nowrap;
      outline: 0;
      a[draggable],
      a[draggable="true"] {
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        /* Required to make elements draggable in old WebKit */
        -khtml-user-drag: element;
        -webkit-user-drag: element;
      }
      &.drag-over {
        > a[draggable] {
          background-color: @primary-color;
          color: white;
          opacity: 0.8;
        }
      }
      &.drag-over-gap-top {
        > a[draggable] {
          border-top: 2px @yellow-light solid;
        }
      }
      &.drag-over-gap-bottom {
        > a[draggable] {
          border-bottom: 2px @yellow-light solid;
        }
      }
      //&.filter-node {
      //  > a {
      //    color: @error-color !important;
      //    font-weight: bold !important;
      //  }
      //}

      &.hidden {
        display: none;
      }
      //节点文本样式-无法被选中
      &.selectable-disabled{
        >a span.ant-tree-title{
          color: #999999;
          cursor: text;
        }
      }

      ul {
        margin: 0;
        padding: 0 0 0 18px;
        &.@{tree-prefix-cls}-line {
          background: url("../showLine.gif") 0 0 repeat-y;
        }
      }
      a {
        display: inline-block;
        padding: 1px 5px;
        border-radius: 2px;
        margin: 0;
        cursor: pointer;
        text-decoration: none;
        vertical-align: top;
        color: #666;
        transition: all 0.3s ease;
        &:hover {
          background-color: tint(@primary-color, 75%);
        }
        &.@{tree-prefix-cls}-node-selected {
          background-color: @primary-color;
          color:#fff;
        }
      }
      span {
        &.@{tree-prefix-cls}-checkbox {
          margin: 2px 4px 0 0;
        }
        &.@{tree-prefix-cls}-switcher,
        &.@{tree-prefix-cls}-iconEle {
          margin: 0;
          width: 16px;
          height: 16px;
          line-height: 16px;
          display: inline-block;
          vertical-align: middle;
          border: 0 none;
          cursor: pointer;
          outline: none;
        }
        //&.@{tree-prefix-cls}-icon_loading {
        //  &:after {
        //    display: inline-block;
        //    .iconfont-font("\e6a1");
        //    animation: loadingCircle 1s infinite linear;
        //    color: @primary-color;
        //  }
        //}
        &.@{tree-prefix-cls}-switcher {
          &.@{tree-prefix-cls}-roots_open,
          &.@{tree-prefix-cls}-center_open,
          &.@{tree-prefix-cls}-bottom_open,
          &.@{tree-prefix-cls}-noline_open {
            .antTreeSwitcherIcon();
          }
          &.@{tree-prefix-cls}-roots_close,
          &.@{tree-prefix-cls}-center_close,
          &.@{tree-prefix-cls}-bottom_close,
          &.@{tree-prefix-cls}-noline_close {
            .antTreeSwitcherIcon();
            .ie-rotate(3);
            &:after {
              transform: rotate(270deg) scale(0.5);
            }
          }
        }
      }
    }
    //&-child-tree {
    //  display: none;
    //  &-open {
    //    display: block;
    //  }
    //}
    //&-treenode-disabled {
    //  > span,
    //  > a,
    //  > a span {
    //    color: #ccc;
    //    cursor: not-allowed;
    //  }
    //}
    //&-icon__open {
    //  margin-right: 2px;
    //  vertical-align: top;
    //}
    //&-icon__close {
    //  margin-right: 2px;
    //  vertical-align: top;
    //}
  }
}

.rc-trigger-popup.yyui-tree-search-trigger {
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: 3px 3px 3px #ededed;

  .popupcontent-wrapper {
    overflow: auto;
    font-size: 12px;
    max-height: 300px;
    &>.popup-content {
      display: block;
      padding: 7px 15px;
      input[type=checkbox] {
        margin-right: 2px;
      }
      label {
        font-size: 12px;
        cursor: pointer;
      }
    }
    &>.popup-content.hover {
      background-color: #eaf8fe;
      cursor: pointer;
      display:block;
    }
  }
  .popupcontent-toolbar {
    border-top: 1px solid #d9d9d9;
    height: 30px;
    position:relative;
    &>.yyui-button {
      left:6px;
      font-size: 12px;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
    }
  }
}