dcp-design-react 1.7.42

package/lib/table/style/column-filter.less

@@ -0,0 +1,94 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-02-28 22:13:50
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-11-26 20:32:27
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}-column-filter {
+  display: inline-block;
+  padding: 5px 0 5px 3px;
+  line-height: 1;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .icon {
+    font-size: 1.05em;
+    margin-right: 2px;
+  }
+  &:hover,
+  &.selected {
+    color: @v-primary-color;
+  }
+}
+
+.column-filter__popper {
+  padding: 0 !important;
+  .column-filter--wrap {
+    padding: 5px @v-module-distance;
+    min-width: 150px;
+    max-width: 200px;
+    overflow-y: auto;
+    .box-sizing-content();
+    li.item {
+      position: relative;
+      line-height: 1.75;
+      .text-overflow-cut();
+      .handle {
+        padding: 2px;
+        color: @v-font-secondary-color;
+        cursor: s-resize;
+        transform: scale(0.9);
+      }
+      .fixed {
+        position: absolute;
+        right: 0;
+        i {
+          color: @--icon-color;
+          cursor: pointer;
+        }
+        &.disabled {
+          i {
+            color: @v-font-disabled-color;
+            cursor: not-allowed;
+          }
+        }
+      }
+    }
+    .reset {
+      text-align: right;
+      .ant-btn-text {
+        padding: 0;
+      }
+    }
+    .left {
+      ul {
+        margin: 0;
+        li {
+          padding-right: 15px;
+        }
+      }
+    }
+    .main {
+      ul {
+        margin: 0;
+        li {
+          padding-right: 30px;
+        }
+      }
+    }
+    .right {
+      ul {
+        margin: 0;
+        li {
+          padding-right: 15px;
+        }
+      }
+    }
+    .divider {
+      height: 0;
+      border-top: 1px solid @v-table-border-color;
+      margin: 4px 0;
+    }
+  }
+}

package/lib/table/style/empty.less

@@ -0,0 +1,19 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-05-19 19:18:15
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-09-12 22:09:00
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}--empty {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  width: 100%;
+  pointer-events: none;
+  .ant-empty-image {
+    margin-bottom: 0;
+  }
+}

package/lib/table/style/expandable.less

@@ -0,0 +1,64 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-03-30 16:36:41
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-12-28 19:56:04
+ */
+@prefix-expand: ~'@{qm-prefix}-expand';
+
+.@{prefix-expand}--icon {
+  position: relative;
+  display: inline-flex;
+  margin-right: 5px;
+  width: 17px;
+  height: 17px;
+  color: @v-font-secondary-color;
+  vertical-align: -4px;
+  background: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.085);
+  border-radius: @v-border-radius;
+  transform: scale(0.94117647);
+  outline: none;
+  user-select: none;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .box-sizing-content();
+  &:hover {
+    color: @v-primary-color;
+    border-color: @v-primary-color;
+  }
+  &::before,
+  &::after {
+    position: absolute;
+    background: currentColor;
+    transition: transform 0.3s ease-out;
+    content: '';
+  }
+  &::before {
+    top: 7px;
+    right: 3px;
+    left: 3px;
+    height: 1px;
+  }
+  &::after {
+    top: 3px;
+    bottom: 3px;
+    left: 7px;
+    width: 1px;
+    transform: rotate(90deg);
+  }
+  &.collapsed::before {
+    transform: rotate(-180deg);
+  }
+  &.collapsed::after {
+    transform: rotate(0deg);
+  }
+  &.disabled {
+    cursor: not-allowed;
+    color: rgba(0, 0, 0, 0.1);
+    background: @--background-color-cecondary;
+    &:hover {
+      border-color: currentColor;
+    }
+  }
+}

package/lib/table/style/export.less

@@ -0,0 +1,26 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-03-26 11:26:46
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-01-09 11:58:00
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}-export {
+  display: inline-block;
+  padding: 5px 3px;
+  line-height: 1;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .icon {
+    font-size: 1.05em;
+  }
+  &:hover {
+    color: @v-primary-color;
+  }
+  &__setting {
+    .@{qm-prefix}-form--sm .@{qm-prefix}-table-column-filter {
+      font-size: @v-font-size-small;
+    }
+  }
+}

package/lib/table/style/fast-search.less

@@ -0,0 +1,110 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2022-03-16 19:05:30
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-11-26 21:11:04
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}-fast-search {
+  display: inline-block;
+  padding: 5px 3px;
+  line-height: 1;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .icon {
+    font-size: 1.05em;
+  }
+  &:hover {
+    color: @v-primary-color;
+  }
+}
+
+.@{prefix-table}-fast-search__setting {
+  height: 100%;
+  .main {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    .top {
+      display: flex;
+      flex: 1;
+      height: 0;
+      overflow-y: auto;
+      .container {
+        flex: 1;
+        width: 0;
+        .@{qm-prefix}-tabs {
+          margin-top: -5px;
+        }
+      }
+      .saved {
+        width: 200px;
+        .form-wrap {
+          display: flex;
+        }
+        .card-wrap {
+          margin-top: @v-module-distance;
+          border: 1px solid @v-table-border-color;
+          > h5 {
+            display: flex;
+            align-items: center;
+            font-size: inherit;
+            font-weight: normal;
+            margin-bottom: 0;
+            padding: 0 @v-module-distance;
+            border-bottom: 1px solid @v-table-border-color;
+            background-color: @v-table-header-background-color;
+          }
+          > ul {
+            margin-bottom: 0;
+            li {
+              display: flex;
+              align-items: center;
+              position: relative;
+              padding: 6px @v-module-distance;
+              border-bottom: 1px solid @v-table-border-color;
+              cursor: pointer;
+              transition: all 0.3s ease;
+              &:last-of-type {
+                border-bottom: 0;
+              }
+              &:hover {
+                background-color: @v-table-row-hover-background-color;
+                .close {
+                  visibility: visible;
+                }
+              }
+              &.selected {
+                background-color: @v-table-row-selected-background-color;
+              }
+              .title {
+                i {
+                  margin-right: 5px;
+                }
+              }
+              .close {
+                position: absolute;
+                right: @v-module-distance;
+                visibility: hidden;
+              }
+            }
+          }
+        }
+      }
+      .line {
+        border-left: 1px dashed @--border-color-base;
+        padding-left: @v-module-distance;
+        margin-left: @v-module-distance;
+      }
+    }
+    .bottom {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 10px 5px;
+      margin-top: 10px;
+      border-top: 1px dashed @--border-color-base;
+    }
+  }
+}

package/lib/table/style/footer.less

@@ -0,0 +1,33 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-02-28 22:13:07
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-05-21 13:56:03
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}--footer-wrapper {
+  background-color: @v-table-footer-background-color;
+  &::before {
+    content: '';
+    position: absolute;
+    left: 0;
+    right: 0;
+    height: 0;
+    z-index: 3;
+    border-top: 1px solid @v-table-border-color;
+  }
+  .@{prefix-table}--footer {
+    .gutter {
+      background-color: @v-table-footer-background-color;
+    }
+    .cell {
+      font-weight: 700;
+    }
+    .footer--row {
+      &:last-of-type .footer--column {
+        border-bottom: 0;
+      }
+    }
+  }
+}

package/lib/table/style/full-screen.less

@@ -0,0 +1,21 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-03-26 11:45:02
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-12-30 16:06:55
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}-full-screen {
+  display: inline-block;
+  padding: 5px 3px;
+  line-height: 1;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .icon {
+    font-size: 1.05em;
+  }
+  &:hover {
+    color: @v-primary-color;
+  }
+}

package/lib/table/style/group-summary.less

@@ -0,0 +1,93 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-03-26 11:45:02
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-11-26 21:11:09
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}-group-summary {
+  display: inline-block;
+  padding: 5px 3px;
+  line-height: 1;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .icon {
+    font-size: 1.05em;
+  }
+  &:hover {
+    color: @v-primary-color;
+  }
+}
+
+.@{prefix-table}-group-summary__setting {
+  .main {
+    display: flex;
+    flex-direction: row;
+    height: 100%;
+    margin-bottom: @v-module-distance;
+    .container {
+      flex: 1;
+      width: 0;
+    }
+    .saved {
+      width: 200px;
+      .form-wrap {
+        display: flex;
+      }
+      .card-wrap {
+        margin-top: @v-module-distance;
+        border: 1px solid @v-table-border-color;
+        > h5 {
+          display: flex;
+          align-items: center;
+          font-size: inherit;
+          font-weight: normal;
+          margin-bottom: 0;
+          padding: 0 @v-module-distance;
+          border-bottom: 1px solid @v-table-border-color;
+          background-color: @v-table-header-background-color;
+        }
+        > ul {
+          margin-bottom: 0;
+          li {
+            display: flex;
+            align-items: center;
+            position: relative;
+            padding: 6px @v-module-distance;
+            border-bottom: 1px solid @v-table-border-color;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            &:last-of-type {
+              border-bottom: 0;
+            }
+            &:hover {
+              background-color: @v-table-row-hover-background-color;
+              .close {
+                visibility: visible;
+              }
+            }
+            &.selected {
+              background-color: @v-table-row-selected-background-color;
+            }
+            .title {
+              i {
+                margin-right: 5px;
+              }
+            }
+            .close {
+              position: absolute;
+              right: @v-module-distance;
+              visibility: hidden;
+            }
+          }
+        }
+      }
+    }
+    .line {
+      border-left: 1px dashed @--border-color-base;
+      padding-left: @v-module-distance;
+      margin-left: @v-module-distance;
+    }
+  }
+}

package/lib/table/style/header.less

@@ -0,0 +1,207 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-02-28 22:11:53
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-11-26 21:07:50
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.TheadAlignCenter {
+  .cell--text {
+    justify-content: center !important;
+  }
+}
+
+.TheadAlignRight {
+  .cell--text {
+    justify-content: flex-end !important;
+  }
+}
+
+.@{prefix-table}--header-wrapper {
+  background-color: @v-table-header-background-color;
+  .@{prefix-table}--header {
+    tr > th[colspan]:not([colspan='1']) {
+      .TheadAlignCenter();
+    }
+  }
+  .gutter {
+    background-color: @v-table-header-background-color;
+  }
+}
+
+.header--column {
+  .cell--wrapper {
+    display: flex;
+    align-items: center;
+    .cell--text {
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      flex: 1;
+      /* 重要 */
+      width: 0;
+      .cell {
+        padding-right: 2px;
+        line-height: 24px;
+      }
+      .tip {
+        padding: 2px;
+        cursor: default;
+      }
+    }
+  }
+  &.column-has-filter {
+    .cell--wrapper {
+      margin-right: 16px;
+    }
+  }
+  &.col--center {
+    .TheadAlignCenter();
+  }
+  &.col--right {
+    .TheadAlignRight();
+  }
+  &:not(.column-has-sorter):not(.column-has-filter) {
+    .cell--text {
+      .cell {
+        padding-right: @v-module-distance;
+      }
+      .tip {
+        margin-left: -8px;
+      }
+    }
+  }
+  &.column--required {
+    .cell {
+      &::before {
+        content: '*';
+        color: @v-danger-color;
+        margin-right: 2px;
+      }
+    }
+  }
+
+  /* 全选 */
+  .cell--selection {
+    display: flex;
+    align-items: center;
+    .icon {
+      padding: 2px;
+      margin-left: 2px;
+      margin-top: 1px;
+      font-size: @v-font-size;
+      color: @v-icon-color;
+      cursor: pointer;
+    }
+    .info {
+      flex-shrink: 0;
+      margin-left: 4px;
+      font-size: @v-font-size - 1px;
+      color: @v-font-secondary-color;
+    }
+  }
+
+  /* 排序 */
+  .cell--sorter {
+    font-size: 0.8em;
+    flex-shrink: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    cursor: pointer;
+    // transform: scale(0.8, 0.8);
+    &__asc,
+    &__desc {
+      color: @v-icon-color;
+      &.actived {
+        color: @v-primary-color;
+      }
+    }
+    &__asc {
+      transform: translateY(1.5px);
+    }
+    &__desc {
+      transform: translateY(-1.5px);
+    }
+  }
+
+  /* 筛选 */
+  .cell--filter {
+    width: 16px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    color: @v-icon-color;
+    transition: all 0.3s ease;
+    cursor: pointer;
+    .icon {
+      transform: scale(0.8, 0.9);
+    }
+    &:hover,
+    &.selected {
+      color: @v-font-secondary-color;
+      background-color: @v-table-column-filter-hover-color;
+    }
+    &.actived {
+      color: @v-primary-color;
+    }
+  }
+
+  .resizable {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    right: -5px;
+    width: 10px;
+    z-index: 1;
+    cursor: col-resize;
+    &.is--line {
+      &:before {
+        content: '';
+        position: absolute;
+        left: 50%;
+        top: 20%;
+        width: 1px;
+        height: 60%;
+        background-color: @v-table-resizable-color;
+      }
+    }
+  }
+}
+
+.head-filter__popper {
+  padding: @v-module-distance !important;
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.head-filter--wrap {
+  ul {
+    margin: 0;
+    li {
+      display: flex;
+      align-items: center;
+      margin-bottom: 5px;
+      &:last-of-type {
+        margin-bottom: 0;
+      }
+      & > span {
+        margin-right: 5px;
+      }
+    }
+  }
+}
+
+.all-selection__popper {
+  .ant-dropdown-menu {
+    &-item {
+      padding-left: 12px;
+      padding-right: 12px;
+    }
+  }
+}

package/lib/table/style/import.less

@@ -0,0 +1,25 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-03-26 11:26:46
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-04-28 12:03:38
+ */
+@prefix-table: ~'@{qm-prefix}-table';
+
+.@{prefix-table}-import {
+  display: inline-block;
+  padding: 5px 3px;
+  line-height: 1;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  .icon {
+    font-size: 1.05em;
+  }
+  &:hover {
+    color: @v-primary-color;
+  }
+}
+
+.@{prefix-table}--file-form {
+  display: none;
+}