@arim-aisdc/public-components 2.3.41 → 2.3.42

package/dist/components/TableMax/tableMax.less

@@ -1,340 +1,340 @@
-.table-max-container {
-  color: @tableColor1;
-  // height: 100%;
-  // max-height: 100%;
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  // justify-content: center;
-  // align-items: center;
-
-  .table-max-header {
-    // height: 22px;
-    height: fit-content;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    margin-bottom: 12px;
-
-    .tableTitle {
-      font-size: 16px;
-      line-height: 24px;
-      display: inline-block;
-    }
-
-    .handleRightItem {
-      margin-left: 8px;
-      display: inline-block;
-      text-align: center;
-      cursor: pointer;
-      font-size: 20px !important;
-      color: @globalColor1;
-      // margin-bottom: 6px;
-
-      &:hover {
-        color: @global-primary-color;
-      }
-    }
-
-    .handleRightEditBtn {
-      display: inline-block;
-      // margin-bottom: 6px;
-    }
-
-    .table-max-header-right {
-      margin-left: 4px;
-      // font-size: 0;
-      line-height: 1;
-      display: flex;
-      align-items: center;
-      // height: ;
-
-      .upload-btn {
-        line-height: 1;
-      }
-
-      .download-btn {
-        // margin-left: 12px;
-        width: auto;
-        height: auto;
-        padding: 0;
-        line-height: 1;
-        border: none;
-
-        span {
-          font-size: inherit;
-        }
-      }
-    }
-
-    .disableBtn {
-      i {
-        color: @globalColor4;
-        cursor: no-drop;
-      }
-
-      i:hover {
-        color: @globalColor4;
-      }
-    }
-  }
-
-  .table-max-content {
-    flex: 1;
-    overflow: hidden;
-    width: 100% !important;
-    background: @globalColor0;
-    position: relative;
-    display: flex;
-    border-radius: @global-table-max-center-border-radius;
-
-    // &:hover {
-    //   .scroll {
-    //     overflow: hidden auto;
-    //     width: 1rem;
-    //     flex-shrink: 0;
-    //     scrollbar-width: thin;
-    //     position: relative;
-    //     background: @globalColor0;
-    //     z-index: 1000;
-    //   }
-
-    //   .scroll::-webkit-scrollbar-thumb {
-    //     border: 6px solid transparent;
-    //     background: @scrollThumb;
-    //     border-radius: 10px;
-    //     background-clip: padding-box;
-    //   }
-
-    //   .scroll::-webkit-scrollbar-thumb:hover {
-    //     border: 4px solid transparent;
-    //     background: @scrollThumbHover;
-    //     background-clip: padding-box;
-    //   }
-    // }
-
-    .table-center {
-      flex: 1;
-      overflow-x: hidden !important;
-      overflow-y: hidden !important;
-      display: flex;
-      flex-direction: column;
-      border: @global-table-max-border;
-      border-bottom: @global-table-max-center-border-bottom;
-      border-radius: @global-table-max-center-border-radius;
-
-      .table-header-wrapper {
-        display: flex;
-        background: @tableColor2;
-        padding: 0;
-
-        .table-header {
-          position: relative;
-          overflow: hidden;
-          box-sizing: border-box;
-          height: fit-content;
-          width: calc(100% - 10px);
-          margin: 0;
-          // flex: 1;
-          justify-content: space-between;
-          .cell-wapper {
-            line-height: @global-table-max-header-cell-wapper-line-height;
-          }
-        }
-
-        .table-header-scroll {
-          width: 10px;
-          height: 100%;
-          margin: 0;
-          padding: 0;
-        }
-      }
-
-      .table-body {
-        flex: 1;
-        overflow: scroll scroll;
-        scroll-behavior: smooth;
-        font-weight: @global-table-max-body-font-weight;
-        // background: @tableColor2;
-        .tbody-tr-td {
-          line-height: @global-table-body-tbody-tr-td-line-height;
-        }
-
-        &::-webkit-scrollbar {
-          width: 10px;
-          height: 10px;
-        }
-        
-        &::-webkit-scrollbar-track, &::-webkit-scrollbar-corner {
-          background: @global-table-max-scrollbar-track !important;
-        }
-
-        &::-webkit-scrollbar-thumb {
-          border-radius: 20px;
-          border: 6px solid transparent !important;
-          background: @scrollThumb !important;
-          background-clip: padding-box !important;
-        }
-
-      }
-      .table-body.hover-active  {
-        &::-webkit-scrollbar-thumb {
-          border-radius: 20px;
-          border: 2px solid transparent !important;
-          background: @scrollThumb !important;
-          background-clip: padding-box !important;
-        }
-
-        &::-webkit-scrollbar-thumb:hover {
-          border-radius: 20px;
-          border: 1px solid transparent !important;
-          background: @scrollThumb !important;
-          background-clip: padding-box !important;
-        }
-      }
-    }
-
-   
-
-    .table-loading {
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      height: 200px;
-    }
-
-    .empty-container {
-      width: 100%;
-      height: 100%;
-      min-height: 100px;
-
-      .empty-wapper {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        position: sticky;
-        left: 0;
-      }
-    }
-  }
-
-  .table-max-footer {
-    padding-top: 8px;
-    // background-color: @global-card-background-color;
-    padding-left: @global-table-max-padding-left;
-    padding-right: @global-table-max-padding-right;
-    padding-bottom: @global-table-max-padding-bottom;
-    border: @global-table-max-border;
-    border-radius: @global-table-max-footer-border-radius;
-  }
-
-  .custom-light-checkbox-indeterminate .custom-light-checkbox-inner::after {
-    height: 2px !important;
-    display: block;
-  }
-
-  .custom-dark-checkbox-indeterminate .custom-dark-checkbox-inner::after {
-    height: 2px !important;
-    display: block;
-  }
-}
-
-.custom-light-pagination,
-.custom-dark-pagination {
-  text-align: right;
-}
-
-.ant-checkbox-indeterminate {
-  .ant-checkbox-inner {
-    background-color: @global-primary-color;
-    border-color: @global-primary-color;
-
-    &::after {
-      display: inline-block;
-      background-color: #fff;
-      height: 2px;
-    }
-  }
-}
-
-.table-max-content-compact {
-  // 紧凑模式
-  .cell-wapper {
-    line-height: 16px !important;
-    padding: 4px 2px !important;
-    height: 24px !important;
-  }
-
-  .tbody-tr-td, .table-thead-tr {
-    height: 24px !important;
-    line-height: 24px !important;
-
-    .table-max-cell-wrapper {
-      padding: 1px 2px;
-      line-height: 22px;
-    }
-  }
-}
-
-.table-center::before {
-  // content: '';
-  // position: absolute;
-  // top: 0;
-  // bottom: 0;
-  // width: 30px;
-  // pointer-events: none;
-  // opacity: 0;
-  // transition: opacity 0.3s;
-  // z-index: 1000;
-
-  box-shadow: inset 10px 0 8px -8px #00000026;
-  position: absolute;
-  top: 0;
-  bottom: -1px;
-  left: 0;
-  width: 30px;
-  // transform: translate(-100%);
-  // transition: box-shadow 0.3s;
-  content: '';
-  pointer-events: none;
-  opacity: var(--left-fixed-opacity);
-  transition: opacity 0.3s ease; /* 添加透明度过渡 */
-  z-index: 1000;
-}
-
-.table-center::after {
-  box-shadow: inset -10px 0 8px -8px #00000026;
-  position: absolute;
-  top: 0;
-  bottom: -1px;
-  right: 0;
-  width: 30px;
-  // transform: translate(100%);
-  // transition: box-shadow 0.3s;
-  content: '';
-  pointer-events: none;
-  opacity: var(--right-fixed-opacity);
-  transition: opacity 0.3s ease; /* 添加透明度过渡 */
-  z-index: 1000;
-}
-
-.table-center::before {
-  left: var(--left-fixed-columns-width);
-  // background: linear-gradient(to right, rgba(0,0,0,0.15), transparent);
-}
-
-.table-center::after {
-  right: var(--right-fixed-columns-width);
-  // background: linear-gradient(to left, rgba(0,0,0,0.15), transparent);
-}
-
-.table-center.shadow-left::before {
-  opacity: 1;
-}
-
-.table-center.shadow-right::after {
-  opacity: 1;
-}
+.table-max-container {
+  color: @tableColor1;
+  // height: 100%;
+  // max-height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  // justify-content: center;
+  // align-items: center;
+
+  .table-max-header {
+    // height: 22px;
+    height: fit-content;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 12px;
+
+    .tableTitle {
+      font-size: 16px;
+      line-height: 24px;
+      display: inline-block;
+    }
+
+    .handleRightItem {
+      margin-left: 8px;
+      display: inline-block;
+      text-align: center;
+      cursor: pointer;
+      font-size: 20px !important;
+      color: @globalColor1;
+      // margin-bottom: 6px;
+
+      &:hover {
+        color: @global-primary-color;
+      }
+    }
+
+    .handleRightEditBtn {
+      display: inline-block;
+      // margin-bottom: 6px;
+    }
+
+    .table-max-header-right {
+      margin-left: 4px;
+      // font-size: 0;
+      line-height: 1;
+      display: flex;
+      align-items: center;
+      // height: ;
+
+      .upload-btn {
+        line-height: 1;
+      }
+
+      .download-btn {
+        // margin-left: 12px;
+        width: auto;
+        height: auto;
+        padding: 0;
+        line-height: 1;
+        border: none;
+
+        span {
+          font-size: inherit;
+        }
+      }
+    }
+
+    .disableBtn {
+      i {
+        color: @globalColor4;
+        cursor: no-drop;
+      }
+
+      i:hover {
+        color: @globalColor4;
+      }
+    }
+  }
+
+  .table-max-content {
+    flex: 1;
+    overflow: hidden;
+    width: 100% !important;
+    background: @globalColor0;
+    position: relative;
+    display: flex;
+    border-radius: @global-table-max-center-border-radius;
+
+    // &:hover {
+    //   .scroll {
+    //     overflow: hidden auto;
+    //     width: 1rem;
+    //     flex-shrink: 0;
+    //     scrollbar-width: thin;
+    //     position: relative;
+    //     background: @globalColor0;
+    //     z-index: 1000;
+    //   }
+
+    //   .scroll::-webkit-scrollbar-thumb {
+    //     border: 6px solid transparent;
+    //     background: @scrollThumb;
+    //     border-radius: 10px;
+    //     background-clip: padding-box;
+    //   }
+
+    //   .scroll::-webkit-scrollbar-thumb:hover {
+    //     border: 4px solid transparent;
+    //     background: @scrollThumbHover;
+    //     background-clip: padding-box;
+    //   }
+    // }
+
+    .table-center {
+      flex: 1;
+      overflow-x: hidden !important;
+      overflow-y: hidden !important;
+      display: flex;
+      flex-direction: column;
+      border: @global-table-max-border;
+      border-bottom: @global-table-max-center-border-bottom;
+      border-radius: @global-table-max-center-border-radius;
+
+      .table-header-wrapper {
+        display: flex;
+        background: @tableColor2;
+        padding: 0;
+
+        .table-header {
+          position: relative;
+          overflow: hidden;
+          box-sizing: border-box;
+          height: fit-content;
+          width: calc(100% - 10px);
+          margin: 0;
+          // flex: 1;
+          justify-content: space-between;
+          .cell-wapper {
+            line-height: @global-table-max-header-cell-wapper-line-height;
+          }
+        }
+
+        .table-header-scroll {
+          width: 10px;
+          height: 100%;
+          margin: 0;
+          padding: 0;
+        }
+      }
+
+      .table-body {
+        flex: 1;
+        overflow: scroll scroll;
+        scroll-behavior: smooth;
+        font-weight: @global-table-max-body-font-weight;
+        // background: @tableColor2;
+        .tbody-tr-td {
+          line-height: @global-table-body-tbody-tr-td-line-height;
+        }
+
+        &::-webkit-scrollbar {
+          width: 10px;
+          height: 10px;
+        }
+        
+        &::-webkit-scrollbar-track, &::-webkit-scrollbar-corner {
+          background: @global-table-max-scrollbar-track !important;
+        }
+
+        &::-webkit-scrollbar-thumb {
+          border-radius: 20px;
+          border: 6px solid transparent !important;
+          background: @scrollThumb !important;
+          background-clip: padding-box !important;
+        }
+
+      }
+      .table-body.hover-active  {
+        &::-webkit-scrollbar-thumb {
+          border-radius: 20px;
+          border: 2px solid transparent !important;
+          background: @scrollThumb !important;
+          background-clip: padding-box !important;
+        }
+
+        &::-webkit-scrollbar-thumb:hover {
+          border-radius: 20px;
+          border: 1px solid transparent !important;
+          background: @scrollThumb !important;
+          background-clip: padding-box !important;
+        }
+      }
+    }
+
+   
+
+    .table-loading {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      height: 200px;
+    }
+
+    .empty-container {
+      width: 100%;
+      height: 100%;
+      min-height: 100px;
+
+      .empty-wapper {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        position: sticky;
+        left: 0;
+      }
+    }
+  }
+
+  .table-max-footer {
+    padding-top: 8px;
+    // background-color: @global-card-background-color;
+    padding-left: @global-table-max-padding-left;
+    padding-right: @global-table-max-padding-right;
+    padding-bottom: @global-table-max-padding-bottom;
+    border: @global-table-max-border;
+    border-radius: @global-table-max-footer-border-radius;
+  }
+
+  .custom-light-checkbox-indeterminate .custom-light-checkbox-inner::after {
+    height: 2px !important;
+    display: block;
+  }
+
+  .custom-dark-checkbox-indeterminate .custom-dark-checkbox-inner::after {
+    height: 2px !important;
+    display: block;
+  }
+}
+
+.custom-light-pagination,
+.custom-dark-pagination {
+  text-align: right;
+}
+
+.ant-checkbox-indeterminate {
+  .ant-checkbox-inner {
+    background-color: @global-primary-color;
+    border-color: @global-primary-color;
+
+    &::after {
+      display: inline-block;
+      background-color: #fff;
+      height: 2px;
+    }
+  }
+}
+
+.table-max-content-compact {
+  // 紧凑模式
+  .cell-wapper {
+    line-height: 16px !important;
+    padding: 4px 2px !important;
+    height: 24px !important;
+  }
+
+  .tbody-tr-td, .table-thead-tr {
+    height: 24px !important;
+    line-height: 24px !important;
+
+    .table-max-cell-wrapper {
+      padding: 1px 2px;
+      line-height: 22px;
+    }
+  }
+}
+
+.table-center::before {
+  // content: '';
+  // position: absolute;
+  // top: 0;
+  // bottom: 0;
+  // width: 30px;
+  // pointer-events: none;
+  // opacity: 0;
+  // transition: opacity 0.3s;
+  // z-index: 1000;
+
+  box-shadow: inset 10px 0 8px -8px #00000026;
+  position: absolute;
+  top: 0;
+  bottom: -1px;
+  left: 0;
+  width: 30px;
+  // transform: translate(-100%);
+  // transition: box-shadow 0.3s;
+  content: '';
+  pointer-events: none;
+  opacity: var(--left-fixed-opacity);
+  transition: opacity 0.3s ease; /* 添加透明度过渡 */
+  z-index: 1000;
+}
+
+.table-center::after {
+  box-shadow: inset -10px 0 8px -8px #00000026;
+  position: absolute;
+  top: 0;
+  bottom: -1px;
+  right: 0;
+  width: 30px;
+  // transform: translate(100%);
+  // transition: box-shadow 0.3s;
+  content: '';
+  pointer-events: none;
+  opacity: var(--right-fixed-opacity);
+  transition: opacity 0.3s ease; /* 添加透明度过渡 */
+  z-index: 1000;
+}
+
+.table-center::before {
+  left: var(--left-fixed-columns-width);
+  // background: linear-gradient(to right, rgba(0,0,0,0.15), transparent);
+}
+
+.table-center::after {
+  right: var(--right-fixed-columns-width);
+  // background: linear-gradient(to left, rgba(0,0,0,0.15), transparent);
+}
+
+.table-center.shadow-left::before {
+  opacity: 1;
+}
+
+.table-center.shadow-right::after {
+  opacity: 1;
+}