n20-common-lib 1.2.41 → 1.3.0

package/src/assets/css/cl-form-item.scss

@@ -30,6 +30,7 @@ $--input-max: 304px;
 
 @media only screen and (max-width: $--l) {
   @for $i from 0 through 24 {
+
     .el-form-item[span-l='#{$i}'],
     .el-form-item[span-lg='#{$i}'] {
       width: (1 / 24 * $i * 100) * 1%;
@@ -57,16 +58,19 @@ $--input-max: 304px;
   .el-form[gutter='#{$i}0'] {
     margin-left: $i * -5px;
     margin-right: $i * -5px;
+
     .el-form-item {
       padding-left: $i * 5px;
       padding-right: $i * 5px;
     }
+
     .n20-title {
       margin-left: $i * 5px;
       margin-right: $i * 5px;
     }
   }
 }
+
 .el-form[gutter] {
   &.m-lr-auto {
     margin-left: auto;
@@ -78,6 +82,7 @@ $--input-max: 304px;
 .el-form-item--small.el-form-item {
   margin-bottom: 24px;
 }
+
 .el-form-item__error,
 .el-form-item--small .el-form-item__error {
   padding-top: 4px;
@@ -102,26 +107,30 @@ $--input-max: 304px;
 
 .el-input__inner {
   padding-left: 10px;
+
   &[oreadonly] {
     border-color: $--border-color-base;
   }
 }
 
 .w-224 {
-  width: $--input-width !important;
+  width: $--input-width  !important;
 }
+
 .input-w {
-  width: $--input-width !important;
+  width: $--input-width  !important;
 }
 
 .el-form.label-width-6em {
   margin-left: 96px;
   margin-right: 14px;
+
   .n20-title,
   .n20-in-block {
     margin-left: -96px;
     margin-right: -14px;
   }
+
   .el-form-item.col-span-24 {
     @media only screen and (min-width: ($--l + 1px)) {
       .el-textarea {
@@ -152,14 +161,17 @@ $--input-max: 304px;
     }
   }
 }
+
 .el-form.label-width-8em {
   margin-left: 66px;
   margin-right: 38px;
+
   .n20-title,
   .n20-in-block {
     margin-left: -66px;
     margin-right: -38px;
   }
+
   .el-form-item.col-span-24 {
     @media only screen and (min-width: ($--l + 1px)) {
       .el-textarea {
@@ -190,14 +202,17 @@ $--input-max: 304px;
     }
   }
 }
+
 .el-form.label-width-10em {
   margin-left: 40px;
   margin-right: 70px;
+
   .n20-title,
   .n20-in-block {
     margin-left: -40px;
     margin-right: -70px;
   }
+
   .el-form-item.col-span-24 {
     @media only screen and (min-width: ($--l + 1px)) {
       .el-textarea {
@@ -228,14 +243,17 @@ $--input-max: 304px;
     }
   }
 }
+
 .el-form.label-width-12em {
   margin-left: 10px;
   margin-right: 96px;
+
   .n20-title,
   .n20-in-block {
     margin-left: -10px;
     margin-right: -96px;
   }
+
   .el-form-item.col-span-24 {
     @media only screen and (min-width: ($--l + 1px)) {
       .el-textarea {
@@ -266,14 +284,17 @@ $--input-max: 304px;
     }
   }
 }
+
 .el-form.label-width-14em {
   margin-left: 0px;
   margin-right: 96px;
+
   .n20-title,
   .n20-in-block {
     margin-left: 0px;
     margin-right: -96px;
   }
+
   .el-form-item.col-span-24 {
     @media only screen and (min-width: ($--l + 1px)) {
       .el-textarea {
@@ -304,14 +325,17 @@ $--input-max: 304px;
     }
   }
 }
+
 .el-form.label-width-16em {
   margin-left: 0px;
   margin-right: 98px;
+
   .n20-title,
   .n20-in-block {
     margin-left: 0px;
     margin-right: -96px;
   }
+
   .el-form-item.col-span-24 {
     @media only screen and (min-width: ($--l + 1px)) {
       .el-textarea {
@@ -342,6 +366,7 @@ $--input-max: 304px;
     }
   }
 }
+
 .el-form.label-width-6em,
 .el-form.label-width-8em,
 .el-form.label-width-10em,
@@ -354,13 +379,16 @@ $--input-max: 304px;
     box-sizing: border-box;
     margin-right: 0;
   }
+
   @media only screen and (min-width: ($--s + 1px)) {
     .el-form-item__content {
       max-width: $--input-max;
     }
   }
+
   .el-form-item.col-span-24 {
     width: 100%;
+
     .el-form-item__content {
       max-width: none;
     }
@@ -396,11 +424,6 @@ $--input-max: 304px;
   .is-search {
     pointer-events: all;
     cursor: pointer;
-    &:hover,
-    &:active {
-      font-weight: bolder;
-      color: $--color-primary;
-    }
   }
 }
 
@@ -409,12 +432,14 @@ $--input-max: 304px;
     background: #eeeeee;
     border: none;
     border-radius: 2px;
+
     &:hover {
       .el-tag__close {
         opacity: 1;
       }
     }
   }
+
   .el-tag__close.el-icon-close {
     right: -4px;
     opacity: 0;
@@ -456,6 +481,7 @@ $--input-max: 304px;
 .el-switch {
   &[inline] {
     position: relative;
+
     .el-switch__label {
       position: absolute;
       z-index: 1;
@@ -463,18 +489,22 @@ $--input-max: 304px;
       margin-left: 0;
       margin-right: 0;
       display: none;
+
       &.is-active {
         display: initial;
       }
     }
+
     .el-switch__label--left {
       right: 8px;
     }
+
     .el-switch__label--right {
       left: 8px;
     }
   }
 }
+
 .el-switch {
   &.is-disabled {
     opacity: 0.3;
@@ -483,14 +513,17 @@ $--input-max: 304px;
 
 .n20-date-editor.el-input--prefix {
   width: $--input-width;
+
   .el-input__inner {
     padding-left: 10px;
   }
+
   .el-input__prefix {
     right: 5px;
     left: unset;
     font-size: 16px;
   }
+
   &.has-value {
     &:not(.is-disabled):hover {
       .el-input__prefix {
@@ -500,8 +533,14 @@ $--input-max: 304px;
   }
 }
 
+.el-range-editor--small .el-range__icon,
+.el-range-editor--small .el-range__close-icon {
+  line-height: 30px;
+}
+
 .el-range-editor {
   position: relative;
+
   .el-range__icon {
     position: absolute;
     height: 100%;
@@ -512,6 +551,7 @@ $--input-max: 304px;
     font-size: 16px;
     transition: all 0.3s;
   }
+
   &.has-value {
     &:hover {
       .el-range__icon {
@@ -519,6 +559,8 @@ $--input-max: 304px;
       }
     }
   }
+
+
   .el-range__close-icon {
     position: absolute;
     height: 100%;
@@ -530,14 +572,20 @@ $--input-max: 304px;
   }
 }
 
+.el-range-editor.el-input__inner {
+  padding: 3px 6px;
+}
+
 .el-range-editor.el-input__inner {
   width: $--input-width;
   padding-right: 30px;
 }
+
 .el-range-editor .el-range-input {
   flex: 1 1 auto;
   text-align: left;
 }
+
 .el-range-editor:not(.has-value) .el-range-separator {
   color: #cccccc;
 }
@@ -546,23 +594,29 @@ $--input-max: 304px;
   & span {
     border-radius: 2px;
   }
+
   &.today span {
     border: 1px solid $--color-primary;
   }
+
   &.available:hover span {
     background: $--color-primary-light-9;
   }
+
   &.current:not(.disabled) span {
     background-color: $--color-primary;
   }
+
   &.start-date div {
     border-top-left-radius: 2px;
     border-bottom-left-radius: 2px;
   }
+
   &.end-date div {
     border-top-right-radius: 2px;
     border-bottom-right-radius: 2px;
   }
+
   &.start-date,
   &.end-date {
     &:hover span {
@@ -570,43 +624,83 @@ $--input-max: 304px;
     }
   }
 }
+
+.el-input-number {
+
+  .el-input__inner {
+    text-align: left;
+
+    &::placeholder {
+      font-size: 14px;
+      text-align: left;
+    }
+  }
+}
+
+.el-input__inner {
+  &::placeholder {
+    font-size: 14px;
+    text-align: left;
+  }
+}
+
+
+
+.el-textarea__inner {
+  &::placeholder {
+    font-size: 14px;
+  }
+}
+
 /* 金额,利率输入框 */
 .n20-num-w {
   display: inline-block;
   width: $--input-width;
   position: relative;
+
   .n20-num,
   .n20-stc {
     width: 100%;
+
     .el-input__inner {
       text-align: right;
     }
   }
+
   .n20-num--rate {
     .el-input__inner {
       padding-right: 30px;
     }
   }
+
   .el-input__suffix {
     font-size: 14px;
   }
 }
+
 /* 多选搜索框 */
 .n20-input-search {
   display: inline-block;
   width: $--input-width;
   position: relative;
+
   .el-select {
     width: 100%;
+
     .el-select__input {
       margin-left: 10px;
     }
   }
+
   .el-select .el-input__suffix {
     display: none;
   }
 }
 
 .el-input__inner:not([disabled]):hover {
-  border-color: $--color-primary !important;
+  border-color: $--color-primary  !important;
 }
+
+.el-icon-zoom-in:hover {
+  color: $--color-primary;
+}

package/src/assets/css/cl-message.scss

@@ -2,29 +2,55 @@
   padding-top: 12px;
   padding-bottom: 12px;
 }
+
 .el-message-box {
   box-sizing: border-box;
   padding: 32px 32px 24px;
+
   .el-message-box__header {
     padding: 0;
     margin-bottom: 12px;
+
+    .n20-icon-xinxi {
+      color: #ffbf00;
+    }
+
+    .el-message-box__status.el-icon-warning {
+      color: #ffbf00;
+    }
   }
+
   .el-message-box__content {
     padding: 0;
     margin-top: 12px;
     margin-bottom: 12px;
   }
+
   .el-message-box__btns {
     margin-top: 24px;
     padding-left: 0;
     padding-right: 0;
     display: flex;
     flex-direction: row-reverse;
-    & .el-button + .el-button {
+
+    .el-button.el-button--default:hover {
+      color: #007aff;
+      background: #ffffff;
+      border-color: #007aff;
+    }
+
+    .el-button.el-button--primary:hover {
+      background: #006ee6;
+      color: #fff;
+      border-color: #006ee6;
+    }
+
+    & .el-button+.el-button {
       margin-left: 0;
-      margin-right: 10px;
+      margin-right: 16px;
     }
   }
+
   .el-message-box__headerbtn {
     top: -15px;
     right: -15px;
@@ -34,17 +60,21 @@
 .header-show-icon {
   .el-message-box__title {
     justify-content: flex-start;
+
     .el-message-box__status {
       top: 1px;
       padding-right: 16px;
     }
   }
+
   .el-message-box__content {
     text-align: left;
   }
+
   .el-message-box__btns {
     text-align: right;
   }
+
   .el-message-box__message {
     padding-left: 40px;
   }
@@ -57,19 +87,74 @@
 .message-por {
   padding: 16px 24px;
   align-items: flex-start;
+
   .el-message__icon {
     font-size: 24px;
     position: relative;
     top: -3px;
   }
+
+  .el-message__closeBtn {
+    top: 25%;
+  }
+}
+
+.el-message--info {
+  border: 1px solid #97c3ff;
+}
+
+.el-message--success {
+  border: 1px solid rgba(72, 210, 160, 0.40);
+}
+
+.el-message--error {
+  border: 1px solid #ffaba6;
+}
+
+.el-message--warning {
+  border: 1px solid #ffe28d;
+}
+
+
+.message-por.el-message--info {
+  .el-message__icon {
+    color: $--color-primary;
+  }
 }
+
 .message-por__header {
   margin-bottom: 12px;
   font-size: 16px;
   line-height: 1;
   color: $--color-text-primary;
 }
+
 .message-por__content {
   margin-top: 12px;
   color: $--color-text-regular;
 }
+
+
+.el-message--success .el-message__content {
+  color: $--color-text-regular;
+}
+
+.el-message--error .el-message__content {
+  color: $--color-text-regular;
+}
+
+.el-message__icon .el-message__content {
+  color: $--color-text-regular;
+}
+
+.el-message--warning .el-message__content {
+  color: $--color-text-regular;
+}
+
+.el-message .el-icon-info {
+  color: $--color-primary;
+}
+
+.el-message-box__status.el-icon-info {
+  color: $--messagebox-warning-color;
+}

package/src/assets/css/cl-pagination.scss

@@ -30,12 +30,13 @@
       line-height: 26px;
       padding-left: 4px;
       padding-right: 4px;
+      border-radius: 2px;
     }
   }
 }
 .n20-pagination-sizes-1 {
   .el-radio-button__inner {
-    border-radius: $--border-radius-base !important;
+    border-radius: 2px !important;
     border: 1px solid $--border-color-base;
     box-shadow: none;
   }
@@ -52,6 +53,7 @@
       line-height: 26px;
       padding-left: 4px;
       padding-right: 4px;
+      border-radius: 2px;
     }
   }
   &.is-active {

package/src/assets/css/cl-showcolumn.scss

@@ -1,23 +1,40 @@
 .dialog-view {
   height: 400px;
+  color: $--color-text-primary;
+
   .left-c {
     flex: 1;
     height: 400px;
   }
+
   .m-title {
     font-size: 16px;
     font-weight: 400;
   }
+
   .right-c {
     height: 400px;
     width: 200px;
     margin-left: 15px;
     overflow-y: auto;
   }
+
   .el-checkbox {
     margin: 0;
     padding-right: 16px;
     box-sizing: border-box;
     width: 25%;
+
+    .el-checkbox__label {
+      color: $--color-text-primary;
+    }
   }
-}
+
+  .n20-drag-list-item {
+
+    a,
+    i {
+      color: $--color-text-placeholder;
+    }
+  }
+}

package/src/assets/css/cl-statis.scss

@@ -1,5 +1,5 @@
 .n20-statis {
-  font-size: 12px;
+  font-size: 14px;
   color: $--color-text-primary;
   .n20-primary {
     color: $--color-primary;
@@ -40,3 +40,16 @@
     margin-top: 4px;
   }
 }
+
+.n20-statis:hover {
+  .rotating-icon {
+    transform:rotate(270deg)
+  }
+}
+.rotating-icon {
+  transform:rotate(90deg)
+}
+
+.rotating-icon:hover {
+  transform:rotate(270deg)
+}

package/src/assets/css/cl-tertiary-tab.scss

@@ -9,8 +9,10 @@
     }
     .el-tabs__item {
       height: auto;
-      line-height: 1;
-      padding: 6px 16px !important;
+      line-height: var(--line-height-22);
+      font-size: $--font-size-base;
+      font-weight: 400;
+      padding: 4px 16px !important;
       border: 1px solid $--border-color-light !important;
       margin-left: -1px;
 

package/src/assets/css/cl-upload.scss

@@ -39,3 +39,10 @@
     margin-bottom: 30px;
   }
 }
+
+
+.upload-224 {
+  .el-input {
+    width: 224px;
+  }
+}