yonui-ys/lib/components/Modal/index.less

yonui ys

.u-modal {
  .u-modal-content {
    border-radius: 4px;
    border: none !important;
    overflow: hidden;
  }

  .modal-header {
    position: relative;
    border-bottom-color: #e9e9e9;
    padding: 0px 24px 0px 16px;
    line-height: 40px;
    font-size: 14px;
    overflow: hidden;

    button.u-close {
      position: absolute;
      top: 0;
      right: 0;
      width: @base-input-height;
      height: @base-input-height;
      margin-top: 0;
      line-height: @base-input-height;
      font-size: 12px;
      font-weight: 100;
      opacity: .8;

      &:hover {
        color: #444;
      }
    }
  }

  .modal-footer {
    border-top-color: #e9e9e9 !important;
  }

  .modal-body {
    .padd-bottom-60 {
      padding-bottom: 20px;

    }

    .refer-toolbar {
      .u-button {
        font-size: 12px;
      }
    }
  }
}

// Confirm 弹框
.u-modal-confirm {
  .u-modal-content {
    min-height: 150px;

    .u-modal-header {
      padding-top: 30px;
    }
  }

  &.u-modal .u-modal-body {
    padding: 0;
  }

  &.u-modal .u-modal-footer {
    position: absolute;
    bottom: 20px;
    right: 30px;
    padding: 0;
    border: none;
  }
}


// confirm 确认弹框
.uretail_confirm.u-modal-confirm {
  z-index: 1702;
}

//UI模板弹框样式
.bill-setting-modal {
  .u-modal-content {
    .modal-body.u-modal-body {
      .bill-modal-tabs {
        .bill-setting-tabs {
          .u-tabs-top {
            .u-tabs-bar {
              padding-top: 0;

              .u-tabs-nav-container {
                .u-tabs-tab-prev,
                .u-tabs-tab-next{
                  transform: translateY(0px);
                  .u-tabs-tab-prev-icon,
                  .u-tabs-tab-next-icon{
                      margin-top: 0px;
                      height: 54px;
                      line-height: 50px;
                  }
                }
                .u-tabs-nav-wrap {
                  .u-tabs-tab {
                    padding: 8px !important;
                    font-size: 14px;
                    height: 52px;
                    line-height: 36px;
                  }
                }
              }
            }
          }

          .tabs-button {
            margin:12px 16px 12px 8px !important;
          }
        }
      }
    }
  }
  //UISJ-18
  .u-input-group.simple .u-form-control:not(:last-child){
    padding-right: 24px!important;
  }
}

//新增方案
.u-modal .scheme-content {
  &.u-modal-dialog {
    min-width: 750px;
  }

  .u-modal-content {
    .Scheme-Content-body {
      
      .add-scheme {
        position: relative;

        .scheme-name-mention {
          position: absolute;
          font-size: 12px;
          color: #ee2222;
          left: 102px;
        }
      }

      .add-scheme-content {
        position: relative;
        line-height: 32px;
        margin-top: 20px;
        display: flex;

        .scheme-name-content {
          min-width: 400px;
        }

        .scheme-set {
          padding-left: 15px;
        }

      }

      .query-content-ranking {
        .query-content-list.sumarea_list_item {
          display: flex;
          -ms-flex-align: initial;
          align-items: initial;
          margin-top: 14px;

          .query-content-title {
            width: 87px;
            margin-right: 18px;
            // line-height: 32px;
            text-align: right;
            display: flex;
            align-items: center;
            justify-content: flex-end;

            +div {
              .compareLogic {
                min-width: 120px;
                margin-right: 8px;
              }
            }
          }

          .query-component-3 {
            width: 270px;
            overflow-y: hidden;

            .tag-group {
              .label-control:empty {
                display: none;
              }
            }
          }

          .sumarea_list_updown {
            .u-button {
              min-width: 0;

              &:hover {
                background: #ffffff;
                color: #ee2223;
              }
            }
          }
        }

        .Test-time-two.sumarea_list_item {
          display: flex;
          margin-top: 12px;

          .query-content-title {
            width: 87px;
            line-height: 28px;
            max-height: 32px;
            overflow: hidden;
            text-align: right;
          }

          .compareLogic {
            width: 120px !important;
            margin-right: 8px;
          }

          .query-component-2 {
            width: 20px;
            text-align: center;
          }

          .query-content-title+div+.query-component-1,
          .query-content-title+div+.query-component-1+.query-component-2+.query-component-3 {
            width: 125px !important;
          }

          .query-content-title+div+.query-component-1+.query-component-2 {
            line-height: 28px;
            height: 28px;
          }

          .query-component-1,
          .query-component-3 {
            width: 270px !important;
          }

          .query-component-1 {
            .basic-predicate-data-picker {
              .yon-row.m-b-10 {
                >div.m-r-10 {
                  margin-right: 0px;

                  .u-radio-group {
                    .u-radio-button {
                      padding: 0 18.45px;
                    }
                  }
                }
              }
            }

            .query-scheme-date {
              margin-top: 10px;

              .col-float {
                width: 119px !important;
              }
            }
          }

          .sumarea_list_updown {
            .u-button {
              min-width: 0;
              padding: 4px 0 4px 8px;

              &:hover {
                background: #ffffff;
                color: #ee2223;
              }
            }
          }
        }
      }
    }

    .query-button {
      .query-item-button.add-query-criteria {
        svg.icon {
          margin-right: 5px;
        }

        float: left;
        margin-top: 6px;
        font-size: 12px;
        color: #588CE9;
        cursor: pointer;
      }
    }

    .u-modal-footer {
      padding: 15px 32px;

      .add-query-criteria:hover {
        color: #ee2223;
      }

      // button.confirmScheme {
      //   margin-left: 8px;
      // }

      button.cancelScheme {
        margin-right: 8px;
        .cancel-button-mixin();
      }
    }
  }
  //英文状态下tag样式
  .basic-predicate-data-picker,.refer-div,.tag-group {
    .yon-row{
      padding-left: 0!important;
      min-height: 0!important;
      line-height: 26px;
    }
  }
}

.u-modal-modal.referModal.Table {
  .refer-toolbar {
    padding-top: 0;

    .u-form-control-affix-wrapper {
      width: 295.5px;
    }
  }
}

// 交叉分组，穿梭框适配
.u-modal {
  .crossGroupingModal {
    .u-modal-body {
      margin-bottom: 10px;

      .crosstype {
        width: 100%;
        color: #666;
        margin-bottom: 10px;
        line-height: 26px;

        .u-form-control {
          height: 28px;
        }

        &Name,
        .eChart-displayTitle,
        .eChart-ApplyAt {
          min-width: 62px;
          display: inline-block;
          text-align: right;
          vertical-align: top;
        }

        &NameList {
          display: inline-block;
          margin: 0 5px 0 16px;

          .custom-radio-wrapper {
            position: relative;
            top: 3px;
          }
        }

        .crosscheckbox {
          margin-left: 7px;
        }

        .eChart-global {
          display: inline-block;

          .eChart_DisplayType {
            margin: 0 8px 0 16px;

            .custom-radio-wrapper {
              position: relative;
              top: 3px;
            }
          }

          .eChart_Setting {
            margin-left: 16px;

            .u-button {
              height: 28px;
              font-size: 12px;
              vertical-align: initial;
            }
          }

          .Charts-columns {
            margin: 0 8px 0 30px;
          }

          .Charts-columns-input {
            width: 50px;
            display: inline-block;
          }

          .Charts-columns-input-hint {
            margin-left: 5px;
            color: #999;

            span {
              color: #ee2223;
            }
          }
        }

        .eChart-ApplyAt {

          &Pc,
          &Mobile {
            margin-left: 16px;
          }
        }

        .eChart-global2 {
          margin-left: 16px;
          border: #d9d9d9 solid 1px;
          min-height: 28px;
          border-radius: 4px;
          padding-bottom: 2px;
          padding-right: 6px;
          width: 588px;
          overflow: hidden;
          display: inline-block;

          &:hover {
            border-color: #505766;
          }
        }
      }

      .crossadddata {
        margin-left: 20px;
        max-width: 270px;

        .crossaddnamemargin {
          line-height: 16px;
          margin-bottom: 6px;
        }

        .crossselectborder {
          border: #D9D9D9 solid 1px;
          border-radius: 4px;
          width: 268px;
          height: 317px;

          &.crossselectborder2 {
            height: 388px;
            ;
          }
        }

        .crossadddatalist {
          width: 100%;
          height: 264px;
          overflow-y: auto;

          .yon-row {

            .u-checkbox {
              padding-left: 15px;
            }
          }
        }
      }

      .crossbtncount {
        padding-top: 128px;
        max-width: 50px;

        .u-button-icon {
          width: 30px;
          height: 40px;
          display: block;
          margin-top: 20px;
          background: #edf1f7;
          color: #535a69;
          border: none;
          padding: 0;
          border-radius: 4px;
          min-width: unset;
          &:hover {
            background: #e3e7ef;
          }

          &::before {
            content: "";
            font-size: 16px;
            display: block;
            font-family: anticon;
            color: #666;
            line-height: 40px;
            text-align: center;
          }

          // &.icon-right-enabled::before,
          // &.icon-right-disabled::before {
          //   content: "\e6a5";
          // }

          // &.icon-left-enabled::before,
          // &.icon-left-disabled::before {
          //   content: "\e6a4";
          // }

          &.icon-right-disabled::before,
          &.icon-left-disabled::before {
            color: rgba(0, 0, 0, 0.25);
          }

        }
      }

      .selecteddata {
        .crossaddnamemargin {
          line-height: 16px;
          margin-bottom: 6px;
        }

        .groupCondition-SelectedItem {
          width: 268px;
          border: 1px solid #d9d9d9;
          border-radius: 4px;

          .groupCondition-SelectedItem-Row2 {
            height: 158px;

            .titlemore {
              padding-left: 15px;
              height: 30px;
              line-height: 28px;
              border-bottom: 1px solid #dbe0e5;
              border-top: 1px solid #dbe0e5;
              background: #F3F5F9;
              cursor: pointer;

              &.titlemore-none {
                border-top: none;
              }

              .groupCondition-HideAllZeroRow {
                width: 180px;
                float: unset;
                display: inline-block;
                margin-left: 20px;
                .u-checkbox{
                    line-height: 18px;
                    height: 18px;
                }
              }

              &.groupCondition-SelectedItem-Selected {
                background: #e3e7ef;
              }
            }

            .titlename-list3 {
              height: 120px;
              width: 100%;
              overflow-y: auto;

              .yon-row {
                height: 26px;
                line-height: 22px;
                overflow: hidden;
                &:hover {
                  background: #f3f5f9;
                }

                .u-checkbox {
                  padding-left: 15px;
                }

                .u-checkbox+div {
                  float: right;
                  margin-top: 2px;
                  margin-right: 10px;
                }
              }
            }
          }

          &.groupCondition-SelectedItem2 {
            height: 388px;

            .titlemore {
              height: 30px;
              background: #F3F5F9;
              cursor: pointer;
              border-top: #DBE0E5 solid 1px;
              border-bottom: #DBE0E5 solid 1px;
              padding-left: 15px;
              line-height: 30px;

              &.titlemore-none {
                border-top: none;
                border-top-left-radius: 3px;
                border-top-right-radius: 3px;
              }

              .anticon {
                float: right;
                margin-right: 9px;
              }
            }

            .titlename-list {
              .u-checkbox {
                margin-left: 15px;

                +div {
                  display: inline-block;
                  position: absolute;
                  right: 10px;

                  .groupCondition-ColumnDefine-Design {
                    span:hover{
                      color: #588ce9;
                    }
                  }
                }
              }
            }

            .groupCondition-SelectedItemNum_3 {
              height: 119px;
            }

            .groupCondition-SelectedItemNum_4 {
              height: 96px;
            }

            .groupCondition-SelectedItem-Selected {
              background: #E3E7EF;
            }
          }

          .groupCondition-SelectedItemNum_4 {
            height: 96px;

            .titlename-list {
              height: 65px;
              overflow-y: auto;
            }
          }
        }
      }
    }
  }
}

// 上述modal中的popover样式
.u-popover.u-popover-tooltip.u-tooltip.inverse.groupCondition-ColumnDefine {
  .tooltip-inner {
    min-width: 140px;
  }

  .group-add-grouping-count {
    .u-checkbox {
      height: 33px;
      line-height: 33px;
    }

    .footer-btn {
      .u-button {
        float: right;
      }

      [type='default'] {
        border: none;
        background: @custom2-color;
        color: @custom2-font-color;

        &:hover {
          background: @custom2-color-hover;
        }
      }
    }
  }
}

.bottom-toolbar {
  padding-left: 10px;
}

.u-modal-content .u-modal-body .refer-toolbar .u-form-control-search {
  width: 300px;
}

.TreeTable.u-modal-dialog {
  .u-modal-body {
    padding-top: 0;

    .leftPanel {
      border-right: 1px solid #ebebeb;

      .u-tree {
        padding: 7px 10px 0;
        height: 100%;
        overflow: auto;
      }
    }
  }
}

.u-modal {

  // issue: f12 打开上下变动高度，模态框会动态添加padding-left: 7px  导致页面tabel部分布局右边溢出
  &.in .u-modal-dialog {
    padding-left: 0 !important;
  }

  .model-header {
    button.u-close {
      top: 8px;
      right: 8px;
    }
  }
  .u-modal-title,
  .model-title {
    font-size: 14px;
    color: rgba(0, 0, 0, .85);
  }
  .u-modal-title{
    min-height: 20px;
    line-height: 20px;
    font-weight: normal!important;
  }
  .modal-body {
    padding-left: 0;
    padding-right: 0;
  }

  .u-modal-footer {
    padding: 10px 32px;
  }
}

// fix: 供货目录，编辑参照tab 的toolbar
// .tab-top-right .btn-toolbar-bottom {
//   padding: 0 30px;
// }

.u-modal-dialog {
  .btn-toolbar-bottom {
    display: flex;
    justify-content: flex-end;
  }
}
// @media (max-width: 768px){
//   .u-modal .u-modal-dialog {
//     top:3%!important;
//   }
// }
// ui模板
.Formula-Designer .u-modal-content .u-modal-body>div {
  display: flex;
}

.Formula-Designer .u-modal-content .u-modal-body .RightContent .yon-row .label-control {
  padding-left: 10px;
  padding-right: 0;
}

.tab-menu+.tab-top-right .btn-toolbar-bottom {
  border-top: none;
}

.u-modal-backdrop {
  position: absolute;
  // top: 80px !important;
  background-color: rgba(55, 55, 55, .6) !important;

  // &.in {
  //   opacity: 1;
  // }
}

.uretail_confirm.u-modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1700;
  -webkit-overflow-scrolling: touch;
  outline: 0;

  .u-modal-dialog {
    position: relative;
    background: #fff;
    // margin: 30px auto;
    border-radius: 4px;
  }
}


.u-tree .u-tree-checkbox-disabled .u-tree-checkbox-inner{
  background: #F7F7F7;
}

.u-modal-content {
  .swiper-container {
    margin-bottom: 24px;
  }
}

.ant-modal-mask .ant-spin-nested-loading {
  position: relative;
  height: 100%;
}

.u-modal.fade.in {
  overflow-y: auto !important;
}

// 物料模板，选择商品规格
.specifications {
  .ant-modal {
    width: 600px !important;
    height: 600px !important;
    .ant-modal-header{
        padding: 9px 16px;
    }
    .ant-modal-body {
      padding: 14px 0px 0px 0px;

      .ant-col-12 {
        padding-bottom: 15px;

        &:first-child {
          padding-left: 32px !important;
        }

        &:last-child {
          padding-right: 32px !important;
        }

        .code-box {
          height: 260px;
          margin-bottom: 8px;

          .clearfix {
            line-height: 26px;
          }
          p>span {
            padding-top: 0px;
            padding-left: 0px;
          }
        }

        .code-box-container {
          border-radius: 4px;
          .code-box{
              p{
                line-height: 26px;
              }
          }
        }
      }

      .ant-modal-footer {
        border-top: 1px solid #e9e9e9 !important;
        padding: 10px 20px !important;
        height: 48px;
        
      }
    }
  }
}

.u-modal.pu_venandinv_ven {
  .u-modal-body {
    .line-tabs .tab-top-right {
      button.btn-maximize {
        display: none;
      }
    }
  }

  .u-modal-footer {
    div[id='pu_venandinv_ven|btnAbandon'] {
      margin-right: 0;
    }
  }
}

// .s-ok-button {
//   margin-left: 8px;
// }

.u-modal:not(.new-interactive-scheme-modal),
.bill-setting-modal {
  .u-modal-footer {
    .u-button-border {
      &:hover {
        border: none;
      }
    }
  }
}

 //英文状态下增加宽度
 .enus{
  .u-modal-dialog.scheme-content{
    .query-picker.query-copypicker{
      width: 330px!important;
    }
  }
 }
// fix: UHY-14072
 .enus {
   .u-modal {
     .referModal {
       .col-float {
         .label-control {
           float: none;
           text-align: left!important;
           overflow: visible !important;
         }

         .input-control {
           width: 90% !important;
         }
       }

       .refer-div {
         .yon-row {
           padding-left: 0;
         }
       }
     }
   }
 }

 //英文状态下上下展示-PTGGKF-2298
 .enus{
  .u-modal-dialog.addfilter_content {
    .RightContent{
      .yon-row{
        .label-control.multi-line{
          float: none;
          width: 100%!important;
          text-align: left;
          padding: 0;
        }
      }
    }
    .u-modal-body {
      .add_defined,
      .enumeration {
        .tips_popover {
          top: 20px;
          left: 368px;
        }

        .error {
          left: 0;
        }
      }
    }
  }
 }