zsjz-ai/ai-frontend/packages/trans/views/styles/trans-analysis-table-ui.less

.trans-analysis-table-ui() {
  width: calc(100% + 24px);
  margin: 0 -12px;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;

  .table-panel .ant-table-cell,
  .table-wrapper .ant-table-cell,
  .table-wrap .ant-table-cell,
  .panel-table .ant-table-cell {
    font-size: inherit;
    font-family: inherit;
  }

  .filter-op {
    width: 84px;
    min-width: 84px;
  }

  .table-panel .ant-table-thead > tr > th,
  .table-wrapper .ant-table-thead > tr > th,
  .table-wrap .ant-table-thead > tr > th,
  .panel-table .ant-table-thead > tr > th {
    background: #f8fafc;
    color: #374151;
    font-weight: 600;
  }

  .table-panel .ant-table-tbody > tr > td,
  .table-wrapper .ant-table-tbody > tr > td,
  .table-wrap .ant-table-tbody > tr > td,
  .panel-table .ant-table-tbody > tr > td {
    color: #374151;
  }

  .table-panel .ant-table-tbody > tr.summary-row-selected > td,
  .table-wrapper .ant-table-tbody > tr.summary-row-selected > td,
  .table-wrap .ant-table-tbody > tr.summary-row-selected > td,
  .panel-table .ant-table-tbody > tr.summary-row-selected > td,
  .table-panel .ant-table-tbody > tr.active-row > td,
  .table-wrapper .ant-table-tbody > tr.active-row > td,
  .table-wrap .ant-table-tbody > tr.active-row > td,
  .panel-table .ant-table-tbody > tr.active-row > td {
    background: #eaf4ff;
  }

  .table-panel .ant-table-tbody > tr.summary-row-selected > td.ant-table-column-sort,
  .table-wrapper .ant-table-tbody > tr.summary-row-selected > td.ant-table-column-sort,
  .table-wrap .ant-table-tbody > tr.summary-row-selected > td.ant-table-column-sort,
  .panel-table .ant-table-tbody > tr.summary-row-selected > td.ant-table-column-sort,
  .table-panel .ant-table-tbody > tr.active-row > td.ant-table-column-sort,
  .table-wrapper .ant-table-tbody > tr.active-row > td.ant-table-column-sort,
  .table-wrap .ant-table-tbody > tr.active-row > td.ant-table-column-sort,
  .panel-table .ant-table-tbody > tr.active-row > td.ant-table-column-sort {
    background: #eaf4ff;
  }

  .table-panel .ant-table-tbody > tr:hover > td,
  .table-wrapper .ant-table-tbody > tr:hover > td,
  .table-wrap .ant-table-tbody > tr:hover > td,
  .panel-table .ant-table-tbody > tr:hover > td {
    background: #f5f7ff;
  }

  .table-panel .ant-table-tbody > tr:hover > td.ant-table-column-sort,
  .table-wrapper .ant-table-tbody > tr:hover > td.ant-table-column-sort,
  .table-wrap .ant-table-tbody > tr:hover > td.ant-table-column-sort,
  .panel-table .ant-table-tbody > tr:hover > td.ant-table-column-sort,
  .table-panel .ant-table-tbody > tr:hover > td.ant-table-cell-fix-left.ant-table-column-sort,
  .table-wrapper .ant-table-tbody > tr:hover > td.ant-table-cell-fix-left.ant-table-column-sort,
  .table-wrap .ant-table-tbody > tr:hover > td.ant-table-cell-fix-left.ant-table-column-sort,
  .panel-table .ant-table-tbody > tr:hover > td.ant-table-cell-fix-left.ant-table-column-sort,
  .table-panel .ant-table-tbody > tr:hover > td.ant-table-cell-fix-right.ant-table-column-sort,
  .table-wrapper .ant-table-tbody > tr:hover > td.ant-table-cell-fix-right.ant-table-column-sort,
  .table-wrap .ant-table-tbody > tr:hover > td.ant-table-cell-fix-right.ant-table-column-sort,
  .panel-table .ant-table-tbody > tr:hover > td.ant-table-cell-fix-right.ant-table-column-sort {
    background: #f5f7ff;
  }
}

@analysis-card-gap: 2px;
@analysis-card-padding: 8px;
@analysis-card-radius: 12px;
@analysis-card-strip-bg: @content-bg;
@analysis-card-border: #e2e8f0;

.analysis-card-strip() {
  margin-top: 0;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  padding: @analysis-card-gap;
  background: @analysis-card-strip-bg;
  box-sizing: border-box;
}

.analysis-card-shell() {
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: @analysis-card-padding;
  border: 1px solid @analysis-card-border;
  border-radius: @analysis-card-radius;
  background: #fff;
  box-shadow: none;
  box-sizing: border-box;
}

.analysis-page-frame() {
  background: #fff;
  padding: 0 8px 2px;
  min-height: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;

  :deep(.ant-btn) {
    border-radius: 8px;
  }

  :deep(.ant-btn-primary) {
    box-shadow: none;
  }

  :deep(.ant-input),
  :deep(.ant-input-affix-wrapper),
  :deep(.ant-picker),
  :deep(.ant-select-selector) {
    border-radius: 8px;
  }

  .page-header {
    display: none;
    margin-bottom: 0;
    flex-shrink: 0;
  }

  .filter-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px;
    min-height: 40px;
    border: 0;
    border-radius: 0;
    background: transparent;
    flex-wrap: wrap;
    flex-shrink: 0;
    box-sizing: border-box;
  }

  .filter-item {
    display: flex;
    align-items: center;
    gap: 4px;
  }

  .filter-label {
    color: #6b7280;
    font-size: 12px;
    white-space: nowrap;
  }

  .filter-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
  }

  .filter-input,
  .filter-date,
  .filter-op,
  .filter-actions .ant-btn {
    align-self: center;
  }

  .content-panel {
    .analysis-card-strip();
  }

  .page-content {
    .analysis-card-strip();
  }

  .panel-header {
    padding: 0 0 8px;
    border-bottom: 0;
    flex: 0 0 auto;
    width: 100%;
    box-sizing: border-box;
  }

  .panel-title {
    color: #111827;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
  }

  .panel-desc {
    margin-top: 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 18px;
  }

  .panel-search {
    padding: 0;
    margin-bottom: 8px;
    width: 100%;
    box-sizing: border-box;
    flex-shrink: 0;
  }

  .panel-search .ant-input,
  .panel-search .ant-input-affix-wrapper {
    width: 100%;
  }

  .table-panel {
    margin-top: 0;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
  }

  .table-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
  }

  .table-wrapper .jeesite-basic-table {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  .table-wrapper .ant-table-wrapper,
  .table-wrapper .ant-spin-nested-loading,
  .table-wrapper .ant-spin-container,
  .table-wrapper .ant-table,
  .table-wrapper .ant-table-container {
    height: 100%;
    min-height: 0;
  }

  .table-wrapper .ant-spin-container,
  .table-wrapper .ant-table,
  .table-wrapper .ant-table-container {
    display: flex;
    flex-direction: column;
  }

  .table-wrapper .ant-table-body {
    max-height: 100% !important;
  }

  .table-card > .table-wrapper,
  .left-panel > .table-wrapper,
  .panel-left > .table-wrapper,
  .panel-right > .table-wrapper,
  .summary-panel > .table-wrapper,
  .trend-panel > .table-wrapper {
    margin: 0;
  }

  .pagination-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 0;
    border-top: 0;
    background: transparent;
    color: #6b7280;
    font-size: 12px;
    flex: 0 0 auto;
    flex-wrap: wrap;
    width: 100%;
    box-sizing: border-box;
  }

  .pagination-total {
    margin-right: 0;
    white-space: nowrap;
  }

  .pagination-size,
  .pagination-actions,
  .pagination-jump {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
  }

  @media screen and (max-width: 992px) {
    .filter-actions {
      width: 100%;
      margin-left: 0;
    }

    .pagination-bar {
      justify-content: flex-start;
    }
  }
}

.analysis-single-panel-frame() {
  .analysis-page-frame();

  .content-panel {
    display: flex;
    flex-direction: column;
    gap: @analysis-card-gap;
  }

  .table-card {
    .analysis-card-shell();

    height: 100%;
    min-height: 0;
  }
}

.analysis-flat-layout() {
  .analysis-page-frame();

  .content-panel {
    display: flex;
    gap: @analysis-card-gap;
  }

  .table-card,
  .summary-panel,
  .trend-panel,
  .left-panel,
  .panel-left,
  .panel-right {
    .analysis-card-shell();
  }

  .right-panel {
    .analysis-card-shell();
  }
}

.continuous-page,
.night-page,
.sensitive-page,
.base-station-page,
.behavior-spacetime-page,
.cash-trans-page,
.capital-flow-page,
.card-holding-page,
.co-residence-page,
.express-delivery-page,
.fast-transfer-page,
.face-to-face-page,
.financial-wealth-page,
.fixed-deposit-page,
.large-amount-page,
.month-regular-page,
.morning-evening-call-page,
.peer-analysis-page,
.trade-frequency-page,
.trans-sensitive-page,
.ui-scheme-page {
  .trans-analysis-table-ui();
}

.base-station-page,
.express-delivery-page,
.financial-wealth-page,
.trade-frequency-page {
  .analysis-single-panel-frame();
}

.behavior-spacetime-page,
.capital-flow-page,
.card-holding-page,
.cash-trans-page,
.co-residence-page,
.face-to-face-page,
.fast-transfer-page,
.fixed-deposit-page,
.large-amount-page,
.morning-evening-call-page,
.peer-analysis-page,
.trans-sensitive-page,
.ui-scheme-page {
  .analysis-flat-layout();
}