@lingxiteam/ebe-utils 0.5.0 → 0.5.2

package/lib/public/src/components/pcfactory/src/styles/components/Alert.less

@@ -0,0 +1,25 @@
+@import (reference) '../theme/variables/antdVariables.less';
+@alert-prefix-cls: ~'@{ant-prefix}-alert';
+
+.ued-alert{
+  .@{alert-prefix-cls}-info {
+    .@{alert-prefix-cls}-content{
+      color: @info-color;
+    }
+  }
+  .@{alert-prefix-cls}-success {
+    .@{alert-prefix-cls}-content{
+      color: @success-color;
+    }
+  }
+  .@{alert-prefix-cls}-error {
+    .@{alert-prefix-cls}-content{
+      color: @error-color;
+    }
+  }
+  .@{alert-prefix-cls}-warning {
+    .@{alert-prefix-cls}-content{
+      color: @warning-color;
+    }
+  }
+}

package/lib/public/src/components/pcfactory/src/styles/components/Audio.less

@@ -0,0 +1,198 @@
+@import (reference) '../theme/variables/index.less';
+
+@alert-prefix-cls: ~'@{ant-prefix}-alert';
+
+.AWSSoundPlayer {
+  display: flex;
+  align-items: center;
+
+  .sb-soundplayer-btn {
+    position: relative;
+    z-index: 2;
+    display: inline-block;
+    flex: none;
+    height: auto;
+    vertical-align: middle;
+    background-color: transparent;
+    border: 1px solid transparent;
+  }
+
+  .sb-soundplayer-play-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+    background-color: @primary-color;
+    border-radius: 100%;
+
+    &>.sb-soundplayer-icon {
+      position: relative;
+      width: 8px;
+      height: 8px;
+      vertical-align: middle;
+      color: #fff;
+    }
+  }
+
+
+  .sb-soundplayer-progress-container {
+    width: 100%;
+    height: 4px;
+    overflow: hidden;
+    background-color: rgba(68, 119, 238, 0.2);
+    cursor: pointer;
+    border-radius: 25px;
+  }
+
+  .sb-soundplayer-progress-inner {
+    height: 100%;
+    background-color: @primary-color;
+    transition: width 0.2s ease-in;
+    border-radius: 25px;
+
+    &::-webkit-slider-thumb {
+      width: 1em;
+      height: 1em;
+      margin-top: -0.4em;
+      background: @primary-color;
+      border-radius: 1em;
+      cursor: pointer;
+      -webkit-appearance: none;
+    }
+  }
+
+  .sb-soundplayer-volume {
+    display: flex;
+    align-items: center;
+    margin-top: -3px;
+  }
+
+  // .sb-soundplayer-volume:hover div {
+  //   width: 80px;
+  // }
+  .sb-soundplayer-volume div {
+    position: relative;
+    width: 80px;
+    overflow: hidden;
+    // transition: width 0.2s ease-out;
+  }
+
+  .sb-soundplayer-volume-range {
+    width: 98%;
+    vertical-align: middle;
+    -webkit-appearance: none;
+  }
+
+  .sb-soundplayer-volume-range:focus {
+    outline: none;
+  }
+
+  .sb-soundplayer-volume-range::-webkit-slider-runnable-track {
+    width: 100%;
+    height: 4px;
+    background: rgba(68, 119, 238, 0.2);
+    border-radius: 1.3px;
+    cursor: pointer;
+    transition: 0.2s;
+  }
+
+  .sb-soundplayer-volume-range::-moz-range-track {
+    width: 100%;
+    height: 4px;
+    background: rgba(68, 119, 238, 0.2);
+    border-radius: 1.3px;
+    cursor: pointer;
+    transition: 0.2s;
+  }
+
+  .sb-soundplayer-volume-range::-ms-track {
+    width: 100%;
+    height: 4px;
+    background: rgba(68, 119, 238, 0.2);
+    border-radius: 1.3px;
+    cursor: pointer;
+    transition: 0.2s;
+  }
+
+  .sb-soundplayer-volume-range::-moz-range-thumb {
+    width: 1em;
+    height: 1em;
+    margin-top: -0.4em;
+    background: @primary-color;
+    border-radius: 1em;
+    cursor: pointer;
+    -webkit-appearance: none;
+  }
+
+  .sb-soundplayer-volume-range::-webkit-slider-thumb {
+    width: 1em;
+    height: 1em;
+    margin-top: -0.4em;
+    background: @primary-color;
+    border-radius: 1em;
+    cursor: pointer;
+    -webkit-appearance: none;
+  }
+
+  .sb-soundplayer-volume-range::-ms-thumb {
+    width: 1em;
+    height: 1em;
+    margin-top: -0.4em;
+    background: @primary-color;
+    border-radius: 1em;
+    cursor: pointer;
+    -webkit-appearance: none;
+  }
+
+  .sb-soundplayer-volume-range::-ms-fill-lower {
+    background: @primary-color;
+  }
+
+  .sb-soundplayer-volume-btn {
+    &>.sb-soundplayer-icon {
+      position: relative;
+      width: 16px;
+      height: 16px;
+      vertical-align: middle;
+      color: @primary-color;
+    }
+  }
+
+  &-audioTitle {
+    flex: 1;
+    overflow: hidden;
+    color: #1C242E;
+    font-weight: 400;
+    font-size: 16px;
+    letter-spacing: 0.2em;
+    white-space: nowrap;
+    text-transform: uppercase;
+    text-overflow: ellipsis;
+  }
+  
+  &-audioContent {
+    flex: 6;
+    display: flex;
+    align-items: center;
+  
+    .playBtn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 24px;
+      height: 24px;
+      background-color: @primary-color;
+      border-radius: 100%;
+    }
+  }
+  
+  &-audioTimer {
+    flex: none;
+    margin: 0 8px;
+    font-size: 14px;
+    font-weight: 400;
+    color: @primary-color;
+  }
+}
+

package/lib/public/src/components/pcfactory/src/styles/components/Button.less

@@ -0,0 +1,32 @@
+@import (reference) '../theme/variables/antdVariables.less';
+@btn-prefix-cls: ~'@{ant-prefix}-btn';
+
+.ued-button-wrap {
+  &.@{btn-prefix-cls} {
+    padding: @padding-xss @padding-lg;
+    line-height: 0;
+    box-shadow: none;
+  }
+
+  &.@{btn-prefix-cls}.@{btn-prefix-cls}-default,
+  &.@{btn-prefix-cls}.@{btn-prefix-cls}-dashed {
+    &:hover {
+      color: @primary-color;
+      border-color: @primary-color;
+    }
+  }
+
+  &.@{btn-prefix-cls}.@{btn-prefix-cls}-lg {
+    height: 36px;
+    padding: @padding-xs 26px;
+    font-size: @font-size-base;
+  }
+
+  &.@{btn-prefix-cls}.@{btn-prefix-cls}-sm {
+    height: 28px;
+    padding: 3px 14px;
+  }
+  .anticon {
+    padding-right: @margin-xss !important;
+  }
+}

package/lib/public/src/components/pcfactory/src/styles/components/Card.less

@@ -0,0 +1,155 @@
+@import (reference) '../theme/variables/antdVariables.less';
+/* --- 扩展组件: Card改造 --- */
+.ued-card {
+  display: flex;
+  flex-direction: column;
+  // height: 100%;  ie下样式出错
+  // overflow-y: hidden;
+
+  &.@{ant-prefix}-card-large {
+    .@{ant-prefix}-card-head {
+      & > .@{ant-prefix}-card-head-wrapper > .@{ant-prefix}-card-head-title {
+        padding: @padding-md 0;
+      }
+    }
+  }
+
+  .ued-card-title {
+    display: flex;
+    align-items: center;
+
+    &::before {
+      position: absolute;
+      top: 50%;
+      left: @padding-xs;
+      width: @padding-xxs;
+      height: @font-size-lg;
+      margin-right: @margin-xs;
+      background: @primary-color;
+      border-radius: @padding-xxs / 2;
+      transform: translateY(-50%);
+      content: '';
+    }
+
+    &-icon-left {
+      &::before {
+        left: 0;
+        width: @padding-sm;
+        height: @padding-sm;
+        border-radius: 0 (@padding-sm / 2) (@padding-sm / 2) 0;
+      }
+    }
+
+    &-icon-auto {
+      &::before {
+        content: none;
+      }
+
+      > i,
+      span {
+        margin-right: @padding-xs;
+        color: @primary-color;
+      }
+    }
+  }
+  .ued-card-children-skeleton {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    background-color: white;
+    z-index: 1000;
+    
+  }
+  .ued-card-extend {
+    flex: 1 1 auto;
+    text-align: right;
+
+    .anticon {
+      margin-left: 0 !important;
+      cursor: pointer;
+    }
+
+    .ued-card-extend-btn {
+      margin-left: @padding-sm;
+      i {
+        margin-left: 0;
+      }
+    }
+
+    .ued-card-extend-iconBtn {
+      height: auto;
+      padding: 0;
+      color: inherit;
+      margin-left: @padding-sm;
+      > button {
+        height: auto;
+        padding: 0;
+        color: inherit;
+      }
+    }
+  }
+
+  .@{ant-prefix}-card-body {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    overflow-y: auto;
+  }
+
+  .@{ant-prefix}-card-head {
+    position: relative;
+    padding: 0 @padding-20;
+    border-color: #f0f0f0;
+
+    & > .@{ant-prefix}-card-head-wrapper {
+      & > .@{ant-prefix}-card-head-title {
+        padding: @padding-sm 0;
+        font-weight: @font-weight-bold;
+        font-size: @font-size-lg;
+        line-height: 1.5;
+      }
+
+      & > .@{ant-prefix}-card-extra {
+        padding: 0;
+      }
+    }
+  }
+
+  &.@{ant-prefix}-card-small {
+    .@{ant-prefix}-card-head {
+      padding: 0 @padding-20;
+
+      & > .@{ant-prefix}-card-head-wrapper {
+        & > .@{ant-prefix}-card-head-title {
+          padding: @padding-xs 0;
+        }
+
+        & > .@{ant-prefix}-card-extra {
+          padding: 0;
+        }
+      }
+    }
+  }
+
+  &.@{ant-prefix}-card-bordered {
+    border-color: @border-color-base;
+
+    .@{ant-prefix}-card-head {
+      border-color: @border-color-base;
+    }
+  }
+}
+
+.ued-card-ed-box {
+  display: flex;
+  flex-direction: column;
+}
+
+.ued-card-simple {
+  // 简约格式 头部不带分割线
+  .@{ant-prefix}-card-head {
+    border: none;
+  }
+}

package/lib/public/src/components/pcfactory/src/styles/components/Cascader.less

@@ -0,0 +1,54 @@
+@import (reference) '../theme/variables/antdVariables.less';
+@cascader-prefix-cls: ~'@{ant-prefix}-cascader';
+
+.cascader-dropdown {
+  .@{cascader-prefix-cls}-menu-item {
+    min-width: 100%;
+    width: fit-content !important;
+  }
+}
+
+.ued-cascader-wrap {
+  .PICKER(@height) {
+    .@{ant-prefix}-input {
+      height: @height;
+      padding-right: @input-affix-padding;
+      line-height: @height;
+    }
+
+    .@{cascader-prefix-cls}-picker-label {
+      height: @height;
+      margin-top: 0;
+      padding: 0 @control-padding-horizontal;
+      line-height: @height;
+      transform: translateY(-50%);
+    }
+  }
+
+  .@{cascader-prefix-cls}-picker {
+    &.@{cascader-prefix-cls}-picker-lg {
+      .PICKER(@input-height-lg);
+    }
+
+    &.@{cascader-prefix-cls}-picker-base {
+      .PICKER(@input-height-base);
+    }
+
+    &.@{cascader-prefix-cls}-picker-small {
+      .PICKER(@input-height-sm);
+    }
+  }
+}
+
+.@{cascader-prefix-cls}-menus {
+  .@{cascader-prefix-cls}-menu {
+    &-item {
+      &-active:not(&-disabled) {
+        &,
+        &:hover {
+          background-color: @item-active-bg;
+        }
+      }
+    }
+  }
+}

package/lib/public/src/components/pcfactory/src/styles/components/Checkbox.less

@@ -0,0 +1,7 @@
+@import (reference) '../theme/variables/antdVariables.less';
+@checkbox-prefix-cls: ~'@{ant-prefix}-checkbox';
+
+// 复选框复选组，通用样式
+label.@{checkbox-prefix-cls}-wrapper {
+  line-height: @input-height-base;
+}

package/lib/public/src/components/pcfactory/src/styles/components/Collapse.less

@@ -0,0 +1,214 @@
+@import (reference) '../theme/variables/antdVariables.less';
+@collapse-prefix-cls: ~'@{ant-prefix}-collapse';
+@border-color-collapse: @border-color-base;
+.ued-collapse-wrap {
+  .@{collapse-prefix-cls} {
+    border-color: @border-color-collapse;
+    // 默认边框型
+    > .@{collapse-prefix-cls}-item {
+      border-color: @border-color-collapse;
+
+      > .@{collapse-prefix-cls}-header {
+        position: relative;
+        padding: 0;
+        font-weight: @font-weight-bold;
+        font-size: @font-size-lg;
+        line-height: @collapse-header-line-height;
+        background-color: @collapse-background-color;
+        border-color: @border-color-collapse;
+        border-radius: @border-radius-base;
+
+        .ued-collapse-panel-header,
+        .ued-collapse-panel-header-default {
+          flex: 1;
+          padding: @padding-sm @padding-20;
+          padding-left: @padding-20 * 2;
+          border-radius: @border-radius-base;
+        }
+
+        .@{collapse-prefix-cls}-arrow {
+          position: absolute;
+          top: 50%;
+          left: @padding-20;
+          line-height: 0;
+          transform: translateY(-50%);
+        }
+      }
+
+      > .@{collapse-prefix-cls}-content {
+        > .@{collapse-prefix-cls}-content-box {
+          padding: 0;
+
+          .ued-collapse-pane-content {
+            padding: @padding-20;
+          }
+        }
+
+        border-color: @border-color-collapse;
+      }
+    }
+
+    &.ued-collapse-large {
+      > .@{collapse-prefix-cls}-item {
+        > .@{collapse-prefix-cls}-header {
+          .ued-collapse-panel-header,
+          .ued-collapse-panel-header-default {
+            padding-top: @padding-md;
+            padding-bottom: @padding-md;
+          }
+        }
+      }
+    }
+
+    &.ued-collapse-small {
+      > .@{collapse-prefix-cls}-item {
+        > .@{collapse-prefix-cls}-header {
+          .ued-collapse-panel-header,
+          .ued-collapse-panel-header-default {
+            padding-top: @padding-xs;
+            padding-bottom: @padding-xs;
+          }
+        }
+      }
+    }
+
+    // 默认分割线
+    &.@{collapse-prefix-cls}-borderless:not(.ued-collapse-simple) {
+      background-color: @component-background;
+      border: 0;
+
+      > .@{collapse-prefix-cls}-item {
+        border: 0;
+
+        > .@{collapse-prefix-cls}-header {
+          border-bottom: 1px solid @border-color-collapse;
+          border-radius: 0;
+        }
+
+        > .@{collapse-prefix-cls}-content {
+          border-top: none;
+
+          > .@{collapse-prefix-cls}-content-box {
+            padding: 0;
+
+            .ued-collapse-pane-content {
+              padding: @padding-20;
+            }
+          }
+        }
+      }
+    }
+
+    // 简洁型
+    &.ued-collapse-simple {
+      background-color: transparent;
+      border: none;
+
+      > .@{collapse-prefix-cls}-item {
+        margin-bottom: 20px;
+        border-bottom: none;
+        border-radius: @border-radius-base @border-color-collapse 0 0;
+
+        & .@{collapse-prefix-cls}-item-active {
+          border-radius: @border-color-base;
+        }
+
+        > .@{collapse-prefix-cls}-header {
+          background-color: #fafafa;
+        }
+
+        .@{collapse-prefix-cls}-content {
+          border-top: none;
+
+          &-box {
+            // 内边距放到组件中处理
+            padding: 0;
+
+            .ued-collapse-pane-content {
+              padding: @padding-20;
+            }
+          }
+        }
+
+        &:last-child {
+          margin-bottom: 0;
+          > .@{collapse-prefix-cls}-header {
+            margin-bottom: 0;
+          }
+
+          .@{collapse-prefix-cls}-content-box {
+            padding: 0;
+          }
+        }
+      }
+    }
+
+    &.@{collapse-prefix-cls}-icon-position-end
+      > .@{collapse-prefix-cls}-item
+      > .@{collapse-prefix-cls}-header {
+      .ued-collapse-panel-header,
+      .ued-collapse-panel-header-default {
+        padding-right: @padding-20 * 2;
+        padding-left: @padding-20;
+      }
+
+      .@{collapse-prefix-cls}-arrow {
+        right: @padding-20;
+        left: auto;
+      }
+    }
+  }
+
+  .ued-collapse-panel-header {
+    display: flex;
+    align-items: center;
+
+    &::before {
+      position: absolute;
+      top: 50%;
+      left: @padding-xs;
+      width: @padding-xxs;
+      height: @font-size-lg;
+      margin-right: @padding-xs;
+      background: @primary-color;
+      border-radius: @padding-xxs / 2;
+      transform: translateY(-50%);
+      content: '';
+    }
+
+    &-icon-left {
+      &::before {
+        left: 0;
+        width: @padding-sm;
+        height: @padding-sm;
+        border-radius: 0 (@padding-sm / 2) (@padding-sm / 2) 0;
+      }
+    }
+
+    &-icon-auto {
+      &::before {
+        content: none;
+      }
+
+      > i,
+      span {
+        margin-right: @padding-xs;
+        color: @primary-color;
+      }
+    }
+  }
+
+  .ued-collapse-expand-icon-arrow {
+    svg {
+      transform: rotate(-90deg);
+      fill: currentColor;
+    }
+
+    &.active {
+      svg {
+        transform: rotate(0);
+        fill: currentColor;
+      }
+    }
+  }
+}

package/lib/public/src/components/pcfactory/src/styles/components/DatePicker.less

@@ -0,0 +1,22 @@
+@import (reference) '../theme/variables/antdVariables.less';
+@calendar-prefix-cls: ~'@{ant-prefix}';
+
+.ued-datePicker-wrap {
+  &.@{calendar-prefix-cls}-picker {
+    width: 100%;
+
+    &-icon {
+      width: 12px;
+      height: 12px;
+      margin-top: -6px;
+      font-size: @font-size-sm;
+    }
+  }
+}
+
+.noFormTip {
+  height: 16px;
+  color: @error-color;
+  font-size: 12px;
+  line-height: 16px;
+}