@jiaozhiye/qm-design-react 1.11.7 → 1.11.9

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.
@@ -31146,7 +31146,7 @@ body {
31146
31146
  * @Author: 焦质晔
31147
31147
  * @Date: 2022-03-16 19:05:30
31148
31148
  * @Last Modified by: 焦质晔
31149
- * @Last Modified time: 2024-12-11 17:28:36
31149
+ * @Last Modified time: 2024-12-21 19:46:45
31150
31150
  */
31151
31151
  .qm-pivot-grid__layout {
31152
31152
  box-sizing: border-box;
@@ -31163,29 +31163,23 @@ body {
31163
31163
  }
31164
31164
  .qm-pivot-grid__layout .header,
31165
31165
  .qm-pivot-grid__layout .footer {
31166
- border: 1px solid #e8e8e8;
31167
- }
31168
- .qm-pivot-grid__layout .header .table,
31169
- .qm-pivot-grid__layout .footer .table {
31170
- table-layout: fixed;
31171
- display: contents;
31166
+ display: flex;
31167
+ flex-direction: row;
31172
31168
  }
31173
- .qm-pivot-grid__layout .header .table thead th,
31174
- .qm-pivot-grid__layout .footer .table thead th,
31175
- .qm-pivot-grid__layout .header .table tfoot td,
31176
- .qm-pivot-grid__layout .footer .table tfoot td {
31177
- text-align: left;
31178
- font-weight: normal;
31179
- border-right: 1px solid #e8e8e8;
31180
- position: relative;
31169
+ .qm-pivot-grid__layout .header .fixed-left,
31170
+ .qm-pivot-grid__layout .footer .fixed-left {
31171
+ position: sticky;
31172
+ left: 0;
31173
+ z-index: 1;
31174
+ display: flex;
31175
+ border-left: 1px solid #e8e8e8;
31176
+ border-bottom: 1px solid #e8e8e8;
31181
31177
  }
31182
- .qm-pivot-grid__layout .header .table thead th.selection-column,
31183
- .qm-pivot-grid__layout .footer .table thead th.selection-column,
31184
- .qm-pivot-grid__layout .header .table tfoot td.selection-column,
31185
- .qm-pivot-grid__layout .footer .table tfoot td.selection-column {
31186
- text-align: center;
31187
- justify-content: center;
31188
- border-right-color: transparent;
31178
+ .qm-pivot-grid__layout .header .no-fixed,
31179
+ .qm-pivot-grid__layout .footer .no-fixed {
31180
+ flex: 1 0;
31181
+ display: flex;
31182
+ border-bottom: 1px solid #e8e8e8;
31189
31183
  }
31190
31184
  .qm-pivot-grid__layout .header {
31191
31185
  position: sticky;
@@ -31193,7 +31187,9 @@ body {
31193
31187
  z-index: 2;
31194
31188
  }
31195
31189
  .qm-pivot-grid__layout .header .table-cell {
31190
+ position: relative;
31196
31191
  background-color: #d6f2ff !important;
31192
+ cursor: pointer;
31197
31193
  }
31198
31194
  .qm-pivot-grid__layout .header .resize-bar {
31199
31195
  position: absolute;
@@ -31205,101 +31201,11 @@ body {
31205
31201
  cursor: col-resize;
31206
31202
  }
31207
31203
  .qm-pivot-grid__layout .body {
31204
+ display: flex;
31205
+ flex-direction: row;
31208
31206
  min-height: -moz-fit-content;
31209
31207
  min-height: fit-content;
31210
31208
  }
31211
- .qm-pivot-grid__layout .body .group-card {
31212
- margin: 15px 0;
31213
- background-color: #fff;
31214
- border: 1px solid #e8e8e8;
31215
- }
31216
- .qm-pivot-grid__layout .body .group-card.inner {
31217
- margin: 0 12px 12px;
31218
- }
31219
- .qm-pivot-grid__layout .body .group-card:has(.inner) > .label-row > .label-cell {
31220
- border-bottom: 0;
31221
- }
31222
- .qm-pivot-grid__layout .body .group-card .label-row {
31223
- display: flex;
31224
- align-items: center;
31225
- }
31226
- .qm-pivot-grid__layout .body .group-card .label-row .label-cell {
31227
- align-self: stretch;
31228
- display: inline-flex;
31229
- align-items: center;
31230
- background-color: #fff;
31231
- border-bottom: 1px solid #e8e8e8;
31232
- }
31233
- .qm-pivot-grid__layout .body .group-card .label-row .label-cell.expandable-column {
31234
- justify-content: center;
31235
- }
31236
- .qm-pivot-grid__layout .body .group-card .label-row .label-cell.expandable-column .button-icon > .anticon {
31237
- transition: transform 0.3s ease;
31238
- }
31239
- .qm-pivot-grid__layout .body .group-card .label-row .label-cell.expandable-column .button-icon.expand > .anticon {
31240
- transform: rotate(90deg);
31241
- }
31242
- .qm-pivot-grid__layout .body .group-card .label-row .label-cell.col--fix-left {
31243
- position: sticky;
31244
- z-index: 1;
31245
- }
31246
- .qm-pivot-grid__layout .body .group-card .label-row .label-cell .title {
31247
- flex-shrink: 0;
31248
- margin-right: 20px;
31249
- font-weight: 700;
31250
- }
31251
- .qm-pivot-grid__layout .body .group-card .grid-list {
31252
- margin: 0;
31253
- border: 0;
31254
- background: transparent;
31255
- }
31256
- .qm-pivot-grid__layout .body .grid-list {
31257
- margin: 15px 0;
31258
- border: 1px solid #e8e8e8;
31259
- }
31260
- .qm-pivot-grid__layout .body .grid-list .table-row {
31261
- display: flex;
31262
- align-items: center;
31263
- }
31264
- .qm-pivot-grid__layout .body .grid-list .table-row:hover .table-cell {
31265
- background-color: #f5f5f5;
31266
- }
31267
- .qm-pivot-grid__layout .body .grid-list .table-row:hover .table-cell .order {
31268
- display: none;
31269
- }
31270
- .qm-pivot-grid__layout .body .grid-list .table-row:hover .table-cell .checkbox {
31271
- display: inline-flex;
31272
- }
31273
- .qm-pivot-grid__layout .body .grid-list .table-row.row--selection {
31274
- background-color: #e6f7ff;
31275
- }
31276
- .qm-pivot-grid__layout .body .grid-list .table-row.row--selection .table-cell .order {
31277
- display: none;
31278
- }
31279
- .qm-pivot-grid__layout .body .grid-list .table-row.row--selection .table-cell .checkbox {
31280
- display: inline-flex;
31281
- }
31282
- .qm-pivot-grid__layout .body .grid-list .table-row .table-cell {
31283
- align-self: stretch;
31284
- display: inline-flex;
31285
- align-items: center;
31286
- border-bottom: 1px solid #e8e8e8;
31287
- }
31288
- .qm-pivot-grid__layout .body .grid-list .table-row .table-cell.active {
31289
- box-shadow: inset 0 0 0 2px #1890ff;
31290
- background-color: #ffeb8c;
31291
- }
31292
- .qm-pivot-grid__layout .body .grid-list .table-row .cell--expand {
31293
- display: inline-flex;
31294
- padding: 4px;
31295
- font-size: 13px;
31296
- color: rgba(0, 0, 0, 0.45);
31297
- cursor: pointer;
31298
- transition: transform 0.3s ease;
31299
- }
31300
- .qm-pivot-grid__layout .body .grid-list .table-row .cell--expand.fold {
31301
- transform: rotate(-90deg);
31302
- }
31303
31209
  .qm-pivot-grid__layout .footer {
31304
31210
  position: sticky;
31305
31211
  bottom: 0;
@@ -31308,13 +31214,12 @@ body {
31308
31214
  .qm-pivot-grid__layout .header .table-cell,
31309
31215
  .qm-pivot-grid__layout .body .table-cell,
31310
31216
  .qm-pivot-grid__layout .footer .table-cell {
31311
- background-color: #fff;
31217
+ align-self: stretch;
31218
+ display: inline-flex;
31219
+ align-items: center;
31220
+ border-top: 1px solid #e8e8e8;
31312
31221
  border-right: 1px solid #e8e8e8;
31313
- }
31314
- .qm-pivot-grid__layout .header .table-cell:last-child,
31315
- .qm-pivot-grid__layout .body .table-cell:last-child,
31316
- .qm-pivot-grid__layout .footer .table-cell:last-child {
31317
- border-right: 0;
31222
+ background-color: #fff;
31318
31223
  }
31319
31224
  .qm-pivot-grid__layout .header .table-cell.selection-column,
31320
31225
  .qm-pivot-grid__layout .body .table-cell.selection-column,
@@ -31335,13 +31240,13 @@ body {
31335
31240
  .qm-pivot-grid__layout .header .table-cell.col--center,
31336
31241
  .qm-pivot-grid__layout .body .table-cell.col--center,
31337
31242
  .qm-pivot-grid__layout .footer .table-cell.col--center {
31338
- text-align: center !important;
31243
+ text-align: center;
31339
31244
  justify-content: center;
31340
31245
  }
31341
31246
  .qm-pivot-grid__layout .header .table-cell.col--right,
31342
31247
  .qm-pivot-grid__layout .body .table-cell.col--right,
31343
31248
  .qm-pivot-grid__layout .footer .table-cell.col--right {
31344
- text-align: right !important;
31249
+ text-align: right;
31345
31250
  justify-content: flex-end;
31346
31251
  }
31347
31252
  .qm-pivot-grid__layout .header .table-cell.col--fix-left,
@@ -31350,6 +31255,17 @@ body {
31350
31255
  position: sticky;
31351
31256
  z-index: 1;
31352
31257
  }
31258
+ .qm-pivot-grid__layout .header .table-cell.col--checked,
31259
+ .qm-pivot-grid__layout .body .table-cell.col--checked,
31260
+ .qm-pivot-grid__layout .footer .table-cell.col--checked {
31261
+ background-color: #e6f7ff;
31262
+ }
31263
+ .qm-pivot-grid__layout .header .table-cell.active,
31264
+ .qm-pivot-grid__layout .body .table-cell.active,
31265
+ .qm-pivot-grid__layout .footer .table-cell.active {
31266
+ box-shadow: inset 0 0 0 2px #1890ff;
31267
+ background-color: #ffeb8c;
31268
+ }
31353
31269
  .qm-pivot-grid__layout .header .table-cell .cell,
31354
31270
  .qm-pivot-grid__layout .body .table-cell .cell,
31355
31271
  .qm-pivot-grid__layout .footer .table-cell .cell {
@@ -31358,6 +31274,11 @@ body {
31358
31274
  white-space: nowrap;
31359
31275
  padding: 0 8px;
31360
31276
  }
31277
+ .qm-pivot-grid__layout .header .table-cell .cell.indent,
31278
+ .qm-pivot-grid__layout .body .table-cell .cell.indent,
31279
+ .qm-pivot-grid__layout .footer .table-cell .cell.indent {
31280
+ padding-left: 16px;
31281
+ }
31361
31282
  .qm-pivot-grid__layout .header .label-cell:hover .count-select,
31362
31283
  .qm-pivot-grid__layout .body .label-cell:hover .count-select,
31363
31284
  .qm-pivot-grid__layout .footer .label-cell:hover .count-select,
@@ -31411,22 +31332,114 @@ body {
31411
31332
  cursor: col-resize;
31412
31333
  z-index: 2;
31413
31334
  }
31414
- .qm-pivot-grid__layout.small .header .table th,
31415
- .qm-pivot-grid__layout.small .footer .table td,
31416
- .qm-pivot-grid__layout.small .body .grid-list > li,
31417
- .qm-pivot-grid__layout.small .body .group-card > li {
31335
+ .qm-pivot-grid__layout .fixed-line {
31336
+ position: absolute;
31337
+ left: -1px;
31338
+ top: 0;
31339
+ width: 0;
31340
+ height: 100%;
31341
+ border-left: 1px solid #91d5ff;
31342
+ z-index: 2;
31343
+ pointer-events: none;
31344
+ }
31345
+ .qm-pivot-grid__layout .left-panel {
31346
+ position: sticky;
31347
+ left: 0;
31348
+ z-index: 1;
31349
+ }
31350
+ .qm-pivot-grid__layout .left-panel .group-label {
31351
+ border-right: 0 !important;
31352
+ }
31353
+ .qm-pivot-grid__layout .main-panel {
31354
+ flex: 1 0;
31355
+ z-index: 0;
31356
+ }
31357
+ .qm-pivot-grid__layout .main-panel .group-label,
31358
+ .qm-pivot-grid__layout .main-panel .row-item {
31359
+ border-left: 0 !important;
31360
+ }
31361
+ .qm-pivot-grid__layout .container {
31362
+ position: relative;
31363
+ left: 0;
31364
+ top: 0;
31365
+ }
31366
+ .qm-pivot-grid__layout .container .group-label {
31367
+ position: absolute;
31368
+ border: 1px solid #e8e8e8;
31369
+ background-color: #fff;
31370
+ }
31371
+ .qm-pivot-grid__layout .container .group-label .label-row {
31372
+ display: flex;
31373
+ align-items: center;
31374
+ }
31375
+ .qm-pivot-grid__layout .container .group-label .label-cell {
31376
+ align-self: stretch;
31377
+ display: inline-flex;
31378
+ align-items: center;
31379
+ }
31380
+ .qm-pivot-grid__layout .container .group-label .label-cell.expandable-column {
31381
+ justify-content: center;
31382
+ }
31383
+ .qm-pivot-grid__layout .container .group-label .label-cell.expandable-column .button-icon > .anticon {
31384
+ transition: transform 0.3s ease;
31385
+ }
31386
+ .qm-pivot-grid__layout .container .group-label .label-cell.expandable-column .button-icon.expand > .anticon {
31387
+ transform: rotate(90deg);
31388
+ }
31389
+ .qm-pivot-grid__layout .container .group-label .label-cell.col--fix-left {
31390
+ position: sticky;
31391
+ z-index: 1;
31392
+ }
31393
+ .qm-pivot-grid__layout .container .group-label .label-cell .title {
31394
+ flex-shrink: 0;
31395
+ margin-right: 20px;
31396
+ font-weight: 700;
31397
+ }
31398
+ .qm-pivot-grid__layout .container .row-item {
31399
+ position: absolute;
31400
+ border-left: 1px solid #e8e8e8;
31401
+ }
31402
+ .qm-pivot-grid__layout .container .row-item.last .table-cell {
31403
+ border-bottom: 1px solid #e8e8e8;
31404
+ }
31405
+ .qm-pivot-grid__layout .container .row-item .table-row {
31406
+ display: flex;
31407
+ align-items: center;
31408
+ height: inherit;
31409
+ }
31410
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell,
31411
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell {
31412
+ background-color: #f5f5f5;
31413
+ }
31414
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .order,
31415
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .order {
31416
+ display: none;
31417
+ }
31418
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .checkbox,
31419
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .checkbox {
31420
+ display: inline-flex;
31421
+ }
31422
+ .qm-pivot-grid__layout .container .row-item .table-row .cell--expand {
31423
+ display: inline-flex;
31424
+ padding: 4px;
31425
+ font-size: 13px;
31426
+ color: rgba(0, 0, 0, 0.45);
31427
+ cursor: pointer;
31428
+ transition: transform 0.3s ease;
31429
+ }
31430
+ .qm-pivot-grid__layout .container .row-item .table-row .cell--expand.fold {
31431
+ transform: rotate(-90deg);
31432
+ }
31433
+ .qm-pivot-grid__layout.small .label-row,
31434
+ .qm-pivot-grid__layout.small .table-cell {
31418
31435
  height: 26px;
31419
31436
  }
31420
- .qm-pivot-grid__layout.middle .header .table th,
31421
- .qm-pivot-grid__layout.middle .footer .table td,
31422
- .qm-pivot-grid__layout.middle .body .grid-list > li,
31423
- .qm-pivot-grid__layout.middle .body .group-card > li {
31437
+ .qm-pivot-grid__layout.middle .label-row,
31438
+ .qm-pivot-grid__layout.middle .table-cell {
31424
31439
  height: 34px;
31425
31440
  }
31426
- .qm-pivot-grid__layout.large .header .table th,
31427
- .qm-pivot-grid__layout.large .footer .table td,
31428
- .qm-pivot-grid__layout.large .body .grid-list > li,
31429
- .qm-pivot-grid__layout.large .body .group-card > li {
31441
+ .qm-pivot-grid__layout.large .label-row,
31442
+ .qm-pivot-grid__layout.large .table-cell {
31430
31443
  height: 42px;
31431
31444
  }
31432
31445
  /*