salary-management-oneself/src/pages/atdTable/components/index.less

//表格样式
.tableWrapper {
  background: #fff;

  .titleWrapper {
    display: flex;
    align-items: center;

    & > span:first-child {
      flex: 1;
      display: inline-block;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    & > span.titleIcon {
      margin-left: 4px;
      display: none;

      & > span {
        cursor: pointer;
        color: #5d9cec;
      }

    }
  }

  .contentSpan {
    display: flex;
    justify-content: space-between;
    align-items: center;

    .contentTitle {
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      word-break: keep-all;
    }

    :global {
      span.anticon-lock {
        color: #5d9cec;
      }
    }
  }

  .titleWrapper:hover {
    & > span.titleIcon {
      display: block;
    }
  }

  .optWrapper {
    .mr10 {
      margin-right: 10px;
    }
  }

  .customSpan {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;

    span.title {
      flex: 1;
      margin-right: 4px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    :global {
      .ant-tag {
        margin-right: 0;
      }
    }
  }

  .danger {
    font-size: var(--data-size);
    color: rgb(217, 0, 27)
  }

  .expand-th:hover {
    .toogle-lock-tool {
      display: flex;
    }
  }

  th.td_odd {
    background: #fffaf0 !important;
  }

  .expand-th {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;

    .title-text {
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      cursor: pointer;
    }

    .toogle-lock-tool {
      display: none;
      overflow: hidden;
      height: 100%;
      justify-content: center;
      align-items: center;

      & > :not(:last-child) {
        margin-right: 4px;
      }

      :global {
        .anticon {
          color: #5d9cec;
          cursor: pointer;
          font-size: 14px;
        }
      }
    }
  }

  .explain-icon-area {
    display: flex;
    justify-content: flex-start;
    align-items: center;

    .icon-item {
      display: flex;
      align-items: center;
      margin-right: 12px;
      color: #5d9cec;
      font-size: var(--data-size);

      :global {
        .anticon {
          font-size: var(--data-size);
          margin-right: 4px;
        }
      }
    }
  }

  .comparison-column-item-container {
    cursor: pointer;

    .comparison-single-row {
      margin: 4px 0;
    }

    .danger {
      color: #ff4d4f;
    }
  }

  tr:hover .editable-cell {
    padding: 4px 11px;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
  }

  :global {
    .ant-btn-link {
      height: inherit !important;
    }

    .ant-btn-link, .ant-dropdown-trigger {
      padding: 0;
      font-size: var(--data-size);
      color: #333;
    }

    .ant-btn-link:hover {
      color: #00a9ff;

      span {
        text-decoration: underline;
      }
    }

    .ant-table-tbody > tr.ant-table-row:hover > td {
      background: #e9f7ff;
    }

    .anticon-more {
      font-size: 16px;
      cursor: pointer;
    }

    .ant-spin-container {
      .ant-pagination {
        font-size: var(--data-size);
        align-items: center;
        margin-right: 8px;

        .ant-pagination-item, .ant-pagination-prev, .ant-pagination-next {
          min-width: 28px;
          height: 28px;
          line-height: 28px;
          border-radius: 6px;

          & > button {
            border-radius: 6px;
          }
        }

        .ant-pagination-item-active {
          background: var(--ant-primary-color);
          border: none;

          & > a {
            color: #FFF;
          }
        }

        .ant-pagination-options {
          .ant-select {
            font-size: var(--data-size);

            .ant-select-selector {
              height: 28px;
              border-radius: 6px;

              .ant-select-selection-search-input {
                height: 26px;
                line-height: 26px;
              }

              .ant-select-selection-item {
                line-height: 26px;
              }
            }

            .ant-select-item {
              font-size: var(--data-size);
            }
          }

          .ant-pagination-options-quick-jumper {
            height: 28px;
            line-height: 28px;

            & > input {
              border-radius: 6px;
              height: 28px;
            }
          }
        }
      }
    }

    .ant-table-thead > tr > th {
      background-color: #f7fbfe;
    }

    th, td {
      font-size: var(--data-size);

      .ant-form-item {
        margin-bottom: 0;

        .ant-input-number {
          width: 100%;
        }
      }
    }

    .ant-typography {
      margin-bottom: 0 !important;
      font-size: var(--data-size) !important;
    }

    .ant-checkbox-inner {
      width: 14px;
      height: 14px;
    }

    .ant-table-header {
      .ant-checkbox-checked {
        .ant-checkbox-inner:after {
          width: 5px !important;
        }
      }

      .ant-checkbox-inner:after {
        width: 8px !important;
      }
    }

    .ant-checkbox-inner:after {
      width: 5px;
      height: 8px;
    }
  }
}

.moreIconWrapper {
  :global {
    .ant-btn-link {
      font-size: var(--data-size);
      color: #333;
    }

    .ant-btn-link:hover {
      color: #00a9ff;

      span {
        text-decoration: underline;
      }
    }

    .ant-dropdown-menu-title-content {
      a {
        font-size: var(--data-size);
        color: #333;
      }

      a:hover {
        color: #00a9ff;
        text-decoration: underline;
      }
    }

    .ant-popover-inner {
      min-width: 106px
    }

    .ant-popover-inner-content {
      padding: 0;

    }
  }
}

:global {
  .ant-dropdown-placement-bottomRight {
    .ant-dropdown-menu {
      max-height: inherit !important;
    }
  }

  .ant-dropdown-menu-item {
    font-size: var(--data-size);
    color: #333;
  }

  .rankMapWrapper {
    .ant-table-thead > tr > th {
      background: #ED7D31;
    }
  }

  .bg_1_Cols {
    background: #ED7D31 !important;
  }

  th.bg_1_Cols {
    height: 48px;
    line-height: 48px;
  }

  .bg_2_Cols {
    background: #DEE0E3 !important;
  }
}

//自适应表格样式
.resizeTable {
  width: 1920px;
  height: 100%;
  //height: 1080px;
  //position: absolute;
  //top: 50%;
  //left: 50%;
  ////transform: scale(0.5, 0.5) translate(-50%, -50%);
  //transform: translate(-50%, -50%);
  //transform-origin: left top;
  overflow-y: hidden;
}