dcp-design-react 1.12.3 → 1.12.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,6 +22,7 @@ type IProps = {
22
22
  };
23
23
  export type ScrollbarRef = {
24
24
  container: HTMLDivElement;
25
+ scrollElement: HTMLDivElement;
25
26
  scrollTop: number;
26
27
  scrollLeft: number;
27
28
  SET_SCROLL_TOP: (value: number, animate?: boolean) => void;
@@ -27452,7 +27452,9 @@ body {
27452
27452
  * @Last Modified time: 2021-07-31 22:38:07
27453
27453
  */
27454
27454
  .qm-empty .ant-empty-image {
27455
- height: auto;
27455
+ display: grid;
27456
+ height: -moz-fit-content;
27457
+ height: fit-content;
27456
27458
  }
27457
27459
  .qm-empty--lg .ant-empty-image > svg {
27458
27460
  width: 80px;
@@ -31328,6 +31330,12 @@ body {
31328
31330
  font-feature-settings: 'tnum';
31329
31331
  width: 100%;
31330
31332
  }
31333
+ .qm-pivot-grid__layout.col-resize {
31334
+ cursor: col-resize;
31335
+ }
31336
+ .qm-pivot-grid__layout.col-resize .qm-scrollbar__view {
31337
+ pointer-events: none;
31338
+ }
31331
31339
  .qm-pivot-grid__layout .qm-scrollbar__wrap {
31332
31340
  display: flex;
31333
31341
  flex-wrap: nowrap;
@@ -31439,6 +31447,11 @@ body {
31439
31447
  color: rgba(0, 0, 0, 0.45);
31440
31448
  visibility: hidden;
31441
31449
  }
31450
+ .qm-pivot-grid__layout .header .table-cell .action .drag-icon,
31451
+ .qm-pivot-grid__layout .body .table-cell .action .drag-icon,
31452
+ .qm-pivot-grid__layout .footer .table-cell .action .drag-icon {
31453
+ cursor: grab;
31454
+ }
31442
31455
  .qm-pivot-grid__layout .header .table-cell .action .expand-icon:hover,
31443
31456
  .qm-pivot-grid__layout .body .table-cell .action .expand-icon:hover,
31444
31457
  .qm-pivot-grid__layout .footer .table-cell .action .expand-icon:hover {
@@ -31548,7 +31561,6 @@ body {
31548
31561
  width: 2px;
31549
31562
  height: 100%;
31550
31563
  background-color: #1890ff;
31551
- cursor: col-resize;
31552
31564
  z-index: 2;
31553
31565
  }
31554
31566
  .qm-pivot-grid__layout .fixed-line {
@@ -31557,7 +31569,7 @@ body {
31557
31569
  top: 0;
31558
31570
  width: 0;
31559
31571
  height: 100%;
31560
- border-left: 1px solid #91d5ff;
31572
+ border-left: 1px solid #d9d9d9;
31561
31573
  z-index: 2;
31562
31574
  pointer-events: none;
31563
31575
  }
@@ -31572,9 +31584,50 @@ body {
31572
31584
  transition: box-shadow 0.3s;
31573
31585
  pointer-events: none;
31574
31586
  }
31575
- .qm-pivot-grid__layout .fixed-line.active::after {
31587
+ .qm-pivot-grid__layout .fixed-line.leave::after {
31576
31588
  box-shadow: inset 10px 0 8px -8px rgba(0, 0, 0, 0.15);
31577
31589
  }
31590
+ .qm-pivot-grid__layout .fixed-line.active {
31591
+ border-left: 1px solid #1890ff;
31592
+ border-right: 1px solid #1890ff;
31593
+ }
31594
+ .qm-pivot-grid__layout .fixed-bar {
31595
+ position: absolute;
31596
+ top: 0;
31597
+ left: -1px;
31598
+ width: 6px;
31599
+ height: 100%;
31600
+ margin-left: -2px;
31601
+ background-image: none;
31602
+ background-repeat: no-repeat;
31603
+ z-index: 1;
31604
+ cursor: col-resize;
31605
+ }
31606
+ .qm-pivot-grid__layout .fixed-bar:hover,
31607
+ .qm-pivot-grid__layout .fixed-bar.active {
31608
+ background-image: linear-gradient(to right, transparent 2px, #d9d9d9 2px 4px, transparent 4px 6px);
31609
+ z-index: 2;
31610
+ }
31611
+ .qm-pivot-grid__layout .fixed-bar:hover .thumb,
31612
+ .qm-pivot-grid__layout .fixed-bar.active .thumb {
31613
+ opacity: 1;
31614
+ }
31615
+ .qm-pivot-grid__layout .fixed-bar .thumb {
31616
+ position: absolute;
31617
+ top: 0;
31618
+ left: 0;
31619
+ width: 100%;
31620
+ height: 32px;
31621
+ border-radius: 6px;
31622
+ background-color: #1890ff;
31623
+ opacity: 0;
31624
+ pointer-events: none;
31625
+ }
31626
+ .qm-pivot-grid__layout .content-empty {
31627
+ position: absolute;
31628
+ width: 100%;
31629
+ margin: 20px 0;
31630
+ }
31578
31631
  .qm-pivot-grid__layout .left-panel {
31579
31632
  position: sticky;
31580
31633
  left: 0;
@@ -31601,6 +31654,25 @@ body {
31601
31654
  .qm-pivot-grid__layout .left-panel .row-item.last .table-cell:first-child {
31602
31655
  border-bottom-left-radius: 8px;
31603
31656
  }
31657
+ .qm-pivot-grid__layout .left-panel .row-item.is-leaf .selection-column {
31658
+ border-top-color: transparent;
31659
+ }
31660
+ .qm-pivot-grid__layout .left-panel .row-item.is-leaf .cell--indent {
31661
+ display: flex;
31662
+ background-color: #fff;
31663
+ }
31664
+ .qm-pivot-grid__layout .left-panel .row-item.is-leaf .cell--indent .line {
31665
+ flex: 1 0;
31666
+ position: relative;
31667
+ }
31668
+ .qm-pivot-grid__layout .left-panel .row-item.is-leaf .cell--indent .line::before {
31669
+ content: '';
31670
+ position: absolute;
31671
+ left: 10px;
31672
+ height: 100%;
31673
+ margin-top: -100%;
31674
+ border-left: 1px dashed rgba(0, 0, 0, 0.175);
31675
+ }
31604
31676
  .qm-pivot-grid__layout .left-panel .no-group .row-item:last-child {
31605
31677
  box-shadow: -5px 0px 0 0px #f5f5f5;
31606
31678
  }
@@ -31637,6 +31709,7 @@ body {
31637
31709
  position: absolute;
31638
31710
  border: 1px solid #e8e8e8;
31639
31711
  background-color: #fff;
31712
+ overflow: hidden;
31640
31713
  }
31641
31714
  .qm-pivot-grid__layout .container .group-label .label-row {
31642
31715
  display: flex;
@@ -31662,6 +31735,7 @@ body {
31662
31735
  }
31663
31736
  .qm-pivot-grid__layout .container .group-label .label-cell .title {
31664
31737
  flex-shrink: 0;
31738
+ margin-left: 8px;
31665
31739
  margin-right: 20px;
31666
31740
  font-weight: 600;
31667
31741
  }
@@ -31682,18 +31756,25 @@ body {
31682
31756
  height: inherit;
31683
31757
  }
31684
31758
  .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell,
31685
- .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell {
31759
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell,
31760
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .cell--indent,
31761
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .cell--indent {
31686
31762
  background-color: #f5f5f5;
31687
31763
  }
31688
31764
  .middle.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell:has(.checkbox) .order,
31689
- .middle.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell:has(.checkbox) .order {
31765
+ .middle.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell:has(.checkbox) .order,
31766
+ .middle.qm-pivot-grid__layout .container .row-item .table-row.row--hover .cell--indent:has(.checkbox) .order,
31767
+ .middle.qm-pivot-grid__layout .container .row-item .table-row.row--selection .cell--indent:has(.checkbox) .order {
31690
31768
  display: none;
31691
31769
  }
31692
31770
  .middle.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell:has(.checkbox) .checkbox,
31693
- .middle.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell:has(.checkbox) .checkbox {
31771
+ .middle.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell:has(.checkbox) .checkbox,
31772
+ .middle.qm-pivot-grid__layout .container .row-item .table-row.row--hover .cell--indent:has(.checkbox) .checkbox,
31773
+ .middle.qm-pivot-grid__layout .container .row-item .table-row.row--selection .cell--indent:has(.checkbox) .checkbox {
31694
31774
  display: inline-flex;
31695
31775
  }
31696
- .qm-pivot-grid__layout .container .row-item .table-row.row--highlight .table-cell {
31776
+ .qm-pivot-grid__layout .container .row-item .table-row.row--highlight .table-cell,
31777
+ .qm-pivot-grid__layout .container .row-item .table-row.row--highlight .cell--indent {
31697
31778
  background-color: #e6f7ff;
31698
31779
  }
31699
31780
  .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .drag-icon,
@@ -31702,14 +31783,22 @@ body {
31702
31783
  }
31703
31784
  .qm-pivot-grid__layout .container .row-item .table-row .cell--expand {
31704
31785
  display: inline-flex;
31705
- padding: 4px;
31706
- font-size: 13px;
31786
+ align-items: center;
31787
+ justify-content: center;
31788
+ z-index: 1;
31789
+ padding: 3px;
31707
31790
  color: rgba(0, 0, 0, 0.45);
31791
+ border-radius: 4px;
31792
+ background-color: #fff;
31793
+ -webkit-user-select: none;
31794
+ -moz-user-select: none;
31795
+ user-select: none;
31708
31796
  cursor: pointer;
31709
- transform: scaleX(1.15);
31797
+ }
31798
+ .qm-pivot-grid__layout .container .row-item .table-row .cell--expand .icon {
31710
31799
  transition: transform 0.3s ease;
31711
31800
  }
31712
- .qm-pivot-grid__layout .container .row-item .table-row .cell--expand.fold {
31801
+ .qm-pivot-grid__layout .container .row-item .table-row .cell--expand.fold .icon {
31713
31802
  transform: rotate(-90deg);
31714
31803
  }
31715
31804
  .qm-pivot-grid__layout .container .row-item .table-row .cell--expand.disabled {
@@ -31717,15 +31806,18 @@ body {
31717
31806
  cursor: not-allowed;
31718
31807
  }
31719
31808
  .qm-pivot-grid__layout.small .label-row,
31720
- .qm-pivot-grid__layout.small .table-cell {
31809
+ .qm-pivot-grid__layout.small .table-cell,
31810
+ .qm-pivot-grid__layout.small .cell--indent {
31721
31811
  height: 26px;
31722
31812
  }
31723
31813
  .qm-pivot-grid__layout.middle .label-row,
31724
- .qm-pivot-grid__layout.middle .table-cell {
31814
+ .qm-pivot-grid__layout.middle .table-cell,
31815
+ .qm-pivot-grid__layout.middle .cell--indent {
31725
31816
  height: 34px;
31726
31817
  }
31727
31818
  .qm-pivot-grid__layout.large .label-row,
31728
- .qm-pivot-grid__layout.large .table-cell {
31819
+ .qm-pivot-grid__layout.large .table-cell,
31820
+ .qm-pivot-grid__layout.large .cell--indent {
31729
31821
  height: 42px;
31730
31822
  }
31731
31823
  /*