//  解决横向滚动条错位问题
.el-scrollbar__wrap {
    // 滚动条样式
    &::-webkit-scrollbar {
        width: 6px;
        height: 6px;
        border: none;
    }
    &::-webkit-scrollbar-thumb {
        border-radius: 6px;
    }
    &::-webkit-scrollbar-track {
        border-radius: 6px;
    }
}
.app-control-grid {
    .el-table {
        font-size: 12px;
        height: 100%;
        border-left: none;
        // 去除表格右侧边框
        &::after {
            width: 0;
        }
        //  表格头最小高度为45px
        .el-table__header-wrapper,
        .el-table__fixed-header-wrapper {
            min-height: 45px;
            height: auto;
            th {
                padding: 5px 0;
                .cell {
                    .textellipsis;
                }
            }
            .el-table__header {
                height: 100%;
            }
        }
        //  表格内容最大高度为100% - 45px
        .el-table__body-wrapper,
        .el-table__fixed-body-wrapper {
            max-height: calc(100% - 45px);
            .el-table__body {
                height: 100%;
            }
        }
        .el-table__body-wrapper {
            // 滚动条样式
            &::-webkit-scrollbar {
                width: 6px;
                height: 6px;
                border: none;
            }
            &::-webkit-scrollbar-thumb {
                border-radius: 6px;
            }
            &::-webkit-scrollbar-track {
                border-radius: 6px;
            }
        }
        // 行编辑单元格
        .edit-cell {
            padding: 0 8px;
            display: table-cell;
            .cell {
                padding: 0;
                .ivu-form-item {
                    margin-bottom: unset;
                }
            }
        }
        .sort-caret {
            border-color: transparent;
        }
        // 操作列样式
        .grid-column--ua__header {
            margin-right: 4px;
        }
        .grid-column--ua__content {
            text-align: center;
            .flex(row, center, flex-start);
            flex-wrap: nowrap;
        }
        .column__divider {
            padding: 0 10px 0 10px;
        }
        .column--first {
            padding: 0 10px 0 10px;
        }
        .column-content--disabled {
            pointer-events: none;
        }
        .column-content--normal {
            pointer-events: auto;
        }
        // 分组列样式（选中所有）
        .grid-column--group--all-select {
            .el-checkbox__inner:after {
                box-sizing: content-box;
                content: '';
                border-left: 0;
                border-top: 0;
                height: 7px;
                left: 4px;
                position: absolute;
                top: 1px;
                transform: rotate(45deg) scaleY(1);
                width: 3px;
                transition: transform 0.15s ease-in 0.05s;
                transform-origin: center;
            }
        }
        // 分组列样式（选择列）
        .grid-column--group--select {
            .el-checkbox__inner:before {
                content: '';
                position: absolute;
                display: block;
                height: 2px;
                transform: scale(0.5);
                left: 0;
                right: 0;
                top: 5px;
            }
            .el-checkbox__inner:after {
                border: 0px;
            }
        }
        // 文件下载列样式
        .grid-column--download {
            text-decoration: underline;
        }
    }
    
    // 分页栏样式
    .app-control-grid__pagination {
        .ivu-icon {
            font-size: 14px;
            &.ivu-icon-md-refresh,
            &.ivu-icon-ios-arrow-back,
            &.ivu-icon-ios-arrow-forward {
                position: relative;
                transform: translate(0, -2px);
            }
        }
        .pagination__refresh {
            margin-right: 4px;
        }
        .pagination--pull-right {
            float: right;
        }
        .pagination__refresh,
        .ivu-page-item-jump-next,
        .ivu-page-item-jump-prev,
        .ivu-page-next,
        .ivu-page-prev,
        .ivu-page-item {
          height: 28px;
          width: 28px;
          min-width: 28px;
          line-height: 28px;
        }
        .ivu-select-selection {
            height: 28px;
            .ivu-select-selected-value {
                font-size: 12px;
                height: 26px;
                line-height: 26px;
            }
        }
        .ivu-page-options-elevator {
            input {
                font-size: 12px;
                height: 26px;
                line-height: 26px;
            }
        }
    }
    // 操作列样式（过滤）
    .app-control-grid__filter {
        position: absolute;
        top: 4px;
        right: 6px;
        z-index: 3;
        height: 46px;
        width: 48px;
        box-shadow: -2px 0px 3px 0px rgba(0, 0, 0, 0.1);
        overflow: hidden;

        &::before {
            content: '';
            position: absolute;
            width: 48px;
            height: 46px;
            border-radius: 0 50% 0 0;
            top: 0px;
            right: 6px;
        }

        &::after {
            content: '';
            position: absolute;
            width: 20px;
            height: 40px;
            border-radius: 33% 50% 0 0;
            top: 8px;
            right: -4px;
            pointer-events: none;
        }

        .ivu-poptip-rel {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100%;
        }

        &.filter__tip--show {
            /* 动画代码 */
            @keyframes openbook1 {
                0% {
                    transform: translate(0, 0);
                }

                100% {
                    transform: translate(-60px, 0px);
                }
            }

            /* 动画代码 */
            @keyframes openbook2 {
                0% {
                    transform: translate(0, 0);
                }

                100% {
                    transform: translate(-60px, 60px);
                }
            }

            &::before {
                animation-name: openbook1;
                animation-duration: 0.5s;
                animation-timing-function: ease-in;
                animation-iteration-count: 1;
                animation-fill-mode: forwards;
            }

            &::after {
                animation-name: openbook2;
                animation-duration: 0.5s;
                animation-timing-function: ease-in;
                animation-iteration-count: 1;
                animation-fill-mode: forwards;
            }
        }

        &.filter__tip--hide {

            /* 动画代码 */
            @keyframes closebook1 {
                0% {
                    transform: translate(-60px, 0px);
                }

                100% {
                    transform: translate(0, 0);
                }
            }

            /* 动画代码 */
            @keyframes closebook2 {
                0% {
                    transform: translate(-60px, 60px);
                }

                100% {
                    transform: translate(0, 0);
                }
            }

            &::before {
                animation-name: closebook1;
                animation-duration: 0.5s;
                animation-timing-function: ease-in;
                animation-iteration-count: 1;
                animation-fill-mode: forwards;
            }

            &::after {
                animation-name: closebook2;
                animation-duration: 0.5s;
                animation-timing-function: ease-in;
                animation-iteration-count: 1;
                animation-fill-mode: forwards;
            }
        }
    }
}
