cloud-web-corejs 1.1.0-dev.6 → 1.1.0-dev.60

package/src/styles/dialog.scss

@@ -0,0 +1,1710 @@
+// Core 弹框皮肤。仅由 styles/index.scss 引入一次。
+// 从历史 style.scss 的 body 块迁入，保留 body 前缀以维持特异度。
+@import "./variables.scss";
+@import "./mixin.scss";
+
+body {
+  .dialog-style {
+    border-radius: 8px;
+    box-shadow: 0 0 24px rgba(0, 0, 0, 0.22);
+    max-height: 100vh;
+    max-width: 100%;
+    .el-dialog__header {
+      height: 42px;
+      line-height: 42px;
+      font-size: 14px;
+      padding: 0 24px;
+      .el-dialog__title {
+        font-size: 13px;
+        font-family: element-icons !important;
+        &:before {
+          content: "";
+          color: $baseColor;
+          vertical-align: middle;
+          margin-right: 6px;
+          font-size: 14px;
+        }
+      }
+      .el-dialog__headerbtn {
+        font-size: 20px;
+        top: 0;
+        line-height: 42px;
+        padding: 0 14px;
+        right: 10px;
+        .el-icon-close {
+          color: $text-color-dark-gray;
+        }
+      }
+    }
+    .el-dialog__body {
+      padding: 30px 20px 20px;
+      .el-upload-list--picture .el-upload-list__item {
+        margin-top: 10px;
+      }
+      .step-head {
+        padding: 32px 104px 8px;
+      }
+      .data-table_height {
+        height: 100%;
+        .el-form {
+          height: 100%;
+        }
+      }
+      .pop-filterBox .product-filter {
+        max-height: calc(100vh - 228px);
+      }
+      .designer-view {
+        .grid-container {
+          outline: none;
+        }
+        //&.cont#containt .grid-container.detail-wrap .d-cont{height: calc(100vh - 98px);}
+      }
+    }
+    .el-dialog__footer {
+      padding: 12px 14px;
+      .button-sty.el-button i {
+        margin-bottom: 2px;
+      }
+    }
+    .multipleChoice {
+      background-color: #fff;
+      position: relative;
+      height: 43px;
+      .allDel {
+        font-family: "iconfont";
+        position: absolute;
+        left: 16px;
+        font-size: 21px;
+        top: 8px;
+        color: $baseColor;
+      }
+      .el-breadcrumb {
+        overflow: auto;
+        padding: 6px 0 7px 42px;
+        height: 43px;
+        .position {
+          font-family: "iconfont";
+          position: absolute;
+          left: 16px;
+          font-size: 18px;
+          top: 12px;
+          color: $baseColor;
+        }
+        .el-breadcrumb__item {
+          line-height: 29px;
+        }
+      }
+      .list {
+        padding: 0 22px 0 60px;
+        height: 100%;
+        overflow: auto;
+        min-height: 43px;
+        .item {
+          display: inline-block;
+          font-size: $fontSizeBase;
+          position: relative;
+          border: solid 1px #c7d6e3;
+          padding: 0 12px;
+          height: $control-height;
+          line-height: 26px;
+          margin-bottom: 7px;
+          margin-top: 7px;
+          margin-right: 26px;
+          border-radius: 24px;
+          text-align: center;
+          > p {
+            display: inline-block;
+            max-width: 140px;
+            overflow: hidden;
+            margin: 0;
+            height: 25px;
+            line-height: 26px;
+          }
+          > a {
+            width: 18px;
+            height: 18px;
+            text-align: center;
+            line-height: 16px;
+            font-size: $fontSizeBase;
+            position: absolute;
+            right: -8px;
+            top: -5px;
+            background: #fff;
+            border: solid 1px #c7d6e3;
+            border-radius: 50%;
+            display: none;
+            &:hover {
+              background: #f5fbff;
+            }
+          }
+          &.item:hover > a {
+            display: block;
+          }
+        }
+      }
+    }
+    &.dialog-form {
+      .el-dialog__header {
+        background: $bg-color-light;
+        border-bottom: solid 1px $border-color-lighter;
+        border-radius: 5px 5px 0 0;
+      }
+      .btn-fr {
+        text-align: center;
+        margin-top: 37px;
+        line-height: 1;
+        &.el-form-item {
+          margin-top: 42px;
+        }
+      }
+      .pfrombox {
+        .el-form-item {
+          margin: 4px 0;
+          padding: 0;
+          .el-form-item__content {
+            display: table-cell;
+            .el-input-number .el-input {
+              width: 200px !important;
+            }
+            .el-date-editor.el-input,
+            .el-date-editor.el-input__inner {
+              width: 186px !important;
+            }
+            .el-tag {
+              line-height: 27px;
+            }
+            .el-input,
+            .el-textarea {
+              width: 240px !important;
+            }
+          }
+        }
+      }
+      &.w500 {
+        .pfrombox .el-form-item .el-form-item__content {
+          .el-input,
+          .el-textarea {
+            width: 340px !important;
+          }
+        }
+      }
+    }
+    &.drag-space {
+      .el-dialog__body {
+        padding: 10px;
+        background: #f2f6fc;
+      }
+      #containt1 {
+        background-color: #fff;
+        line-height: 0;
+        height: 70vh;
+        > div {
+          height: 100%;
+        }
+        .tree-box {
+          width: 21%;
+          //&.tree-annex .tree-list{height:calc(100vh - 197px);}
+        }
+        //#labBtn{margin:0;height: calc(100vh - 115px);}
+        .main-right {
+          width: 79%;
+          padding: 0 10px 0 20px;
+          margin-left: -10px;
+          // &.file-library{
+          //   .grid-height{height: calc(100vh - 206px);
+          //     .annex-grid-height{height: calc(100vh - 248px);}
+          //   }
+          //   .annex-piclist > .clearfix{height: calc(100vh - 281px);}
+          // }
+        }
+      }
+    }
+    &.dialog-printPreview {
+      .el-dialog__header {
+        height: auto;
+        padding: 7px 24px 9px;
+        line-height: 30px;
+        .name {
+          margin-right: 20px;
+          display: block;
+          -height: 28px;
+          font-size: 16px;
+        }
+      }
+      .el-dialog__body {
+        padding: 0 !important;
+        height: 500px;
+        overflow: auto;
+        border-top: solid 1px $border-color-lighter;
+        overflow-x: hidden;
+      }
+    }
+    &.w1293 {
+      width: 1293px !important;
+      .el-dialog__body {
+        line-height: 0;
+      }
+    }
+    &.is-fullscreen {
+      .el-dialog__body {
+        .cont {
+          height: calc(
+            100vh - #{$dialogfooterHeight} - #{$dialogheadHeight} - 16px
+          );
+          overflow: auto;
+        }
+        // .list-drag .cont{height: calc(100vh - 162px);overflow: auto;}
+      }
+    }
+
+    &.proList-dialog {
+      .el-dialog__body {
+        background: $bg-color-page;
+        padding: 8px;
+        #containt {
+          padding: 0;
+          height: 457px;
+          overflow: hidden;
+          .tree-box {
+            padding-right: 8px;
+          }
+          #labBtn {
+            height: 457px;
+            margin: 0;
+            margin-left: -9px;
+          }
+          .main-right {
+            padding: 6px 10px 0 6px;
+          }
+        }
+        .pop-filterBox {
+          position: absolute;
+          right: -1050px;
+          &.on {
+            right: 0;
+          }
+        }
+        .pop-filterMask {
+          position: absolute;
+          left: 10px;
+        }
+
+        .search-criteria {
+          padding: 10px 18px 10px 10px;
+          .tit {
+            color: #333;
+            i {
+              font-weight: 400;
+              background: #f0f3ff;
+              width: 20px;
+              height: 20px;
+              display: inline-block;
+              line-height: 20px;
+              text-align: center;
+              border-radius: 6px;
+              margin-right: 8px;
+              color: #6386fa;
+              font-size: $fontSizeBase;
+            }
+            b {
+              font-weight: 400;
+            }
+          }
+          .el-form .el-form-item {
+            margin-bottom: 4px;
+            .el-form-item__label {
+              padding-bottom: 0;
+            }
+            .el-input,
+            .el-select {
+              width: 100% !important;
+            }
+
+            &.btns {
+              margin-top: 16px;
+            }
+          }
+        }
+      }
+    }
+    &.list-dialog {
+      &.pd_8 .el-dialog__body .cont {
+        padding-bottom: 8px;
+      }
+      &.pd_0 .el-dialog__body .cont {
+        padding-bottom: 0;
+      }
+      .el-dialog__body {
+        background: $bg-color-page;
+        padding: 8px;
+        #containt {
+          margin: 0; /*padding: 10px; 弹框插入详情界面又冲突*/
+          &.designer-view.PC {
+            overflow: hidden;
+            //.grid-container.detail-wrap .d-cont{height:calc(100vh - 250px) 弹框正常模式有滚动条 太力}
+            &.nfootBtn {
+              //.grid-container.detail-wrap .d-cont{height:calc(100vh - 74px)}
+            }
+          }
+          .detail-wrap {
+            //margin:-8px -10px 0;冲突
+            //height:80vh;不能写死
+            .slide-wrap {
+              max-height: calc(100% - 50px);
+            }
+            //.d-cont{height: calc(80vh - 50px);}
+          }
+          &.list-drag {
+            .tree-box {
+              min-width: auto;
+            }
+            .cont {
+              padding: 0;
+              .dilatory-box {
+                height: calc(100vh - 224px);
+              }
+            }
+          }
+        }
+        .cont {
+          background: #fff;
+          padding: 8px 8px 0;
+          overflow-y: auto;
+          overflow-x: hidden; /*max-height:65vh;分辨率低的电脑 给加上个最大高度*/
+          > .el-table:first-child {
+            margin-bottom: 8px;
+          }
+          .organization-tree {
+            height: 500px;
+            margin: 0 8px;
+            overflow: auto;
+            .el-tree-node__content {
+              height: 36px;
+              line-height: 36px;
+              border: solid 1px $border-color-lighter;
+              margin-bottom: 10px;
+              border-radius: $control-radius;
+              > .el-tree-node__expand-icon {
+                margin-top: -2px;
+              }
+            }
+            .el-tree-node__content:hover,
+            .el-tree-node__content:focus,
+            .el-tree-node:focus > .el-tree-node__content {
+              background: none;
+            }
+            > .el-tree-node > .el-tree-node__content {
+              border: none;
+              margin-bottom: 0;
+            }
+            .el-tree-node__children {
+              .el-tree-node__content {
+                .el-tree-node__label {
+                  font-size: $fontSizeBase;
+                  &:before {
+                    content: "";
+                    font-family: element-icons !important;
+                    margin: 0 8px 0 -18px;
+                  }
+                }
+                .el-icon-arrow-down + .el-tree-node__label {
+                  padding-left: 2px;
+                }
+              }
+              .is-current .el-tree-node__content {
+                border-color: $baseColor;
+                color: $baseColor;
+                position: relative;
+                &:after {
+                  content: "";
+                  font-family: element-icons !important;
+                  position: absolute;
+                  right: 12px;
+                }
+              }
+            }
+          }
+          .user-tree {
+            padding: 4px 5px 12px;
+            > .el-input {
+              width: 100% !important;
+              margin-bottom: 6px;
+            }
+            .el-tree {
+              height: 260px;
+              overflow: auto;
+              > .el-tree-node > .el-tree-node__content > .custom-tree-node {
+                color: $text-color-darker;
+                font-size: 13px;
+              }
+              .el-tree-node {
+                .el-tree-node__content {
+                  height: 30px;
+                }
+                .custom-tree-node {
+                  font-size: $fontSizeBase;
+                  i {
+                    margin-right: 4px;
+                    font-size: 14px;
+                    color: #e7a644;
+                    &.el-icon-office-building {
+                      color: $baseColor;
+                    }
+                  }
+                }
+              }
+            }
+          }
+          .adSearchForm {
+            height: 300px;
+            overflow-y: auto;
+            width: 526px;
+            padding-right: 5px;
+            overflow-x: hidden;
+            .el-form-item__content {
+              font-size: $fontSizeBase;
+              line-height: 30px;
+              .el-breadcrumb__item {
+                line-height: 18px;
+                display: inline-block;
+                margin-top: 5px;
+              }
+            }
+            .el-form-item {
+              margin: 4px 0;
+              padding: 0;
+              .el-form-item__label {
+                padding-right: 0;
+              }
+              .el-form-item-title {
+                padding-right: 12px;
+                position: relative;
+                text-align: right;
+                line-height: 11px;
+                .el-form-item-title-label {
+                  font-size: $fontSizeBase;
+                  &:after {
+                    content: ":";
+                    position: absolute;
+                    right: 6px;
+                    top: 50%;
+                    margin-top: -6px;
+                    height: 12px;
+                    line-height: 12px;
+                    display: none;
+                  }
+                }
+              }
+              .el-form-item__content {
+                display: table-cell;
+                .el-input-number .el-input {
+                  width: 148px !important;
+                }
+                .el-date-editor.el-input,
+                .el-date-editor.el-input__inner {
+                  width: 186px !important;
+                }
+                .el-tag {
+                  line-height: 27px;
+                }
+              }
+              &.block {
+                width: 100%;
+                .el-form-item__content {
+                  width: 397px;
+                  .el-input {
+                    width: 397px !important;
+                  }
+                }
+              }
+            }
+            .vxe-form--item-inner {
+              min-height: 28px;
+            }
+            .vxe-form--item {
+              margin: 4px 0;
+              padding: 0;
+              .vxe-form--item-title {
+                padding-right: 12px;
+                position: relative;
+                text-align: right;
+                line-height: 11px;
+                .vxe-form--item-title-label {
+                  font-size: $fontSizeBase;
+                  &:after {
+                    content: ":";
+                    position: absolute;
+                    right: 6px;
+                    top: 50%;
+                    margin-top: -6px;
+                    height: 12px;
+                    line-height: 12px;
+                    display: none;
+                  }
+                }
+              }
+              .vxe-form--item-content {
+                display: table-cell;
+                .el-input-number .el-input {
+                  width: 148px !important;
+                }
+                .el-date-editor.el-input,
+                .el-date-editor.el-input__inner {
+                  width: 186px !important;
+                }
+              }
+              &.block {
+                width: 100%;
+                .vxe-form--item-content {
+                  width: 397px;
+                  .el-input {
+                    width: 397px !important;
+                  }
+                }
+              }
+            }
+          }
+          .pro-img {
+            width: 26%;
+            height: calc(100% + 10px);
+            float: left;
+            border-right: solid 1px $bg-color-page;
+            padding: 10px;
+            margin: -10px;
+            .title {
+              padding: 0;
+            }
+            img {
+              width: 100%;
+              padding-top: 7px;
+            }
+          }
+          .pro-list {
+            width: 74%;
+            float: right;
+            margin-right: 0;
+            height: 100%;
+          }
+          &.H5 {
+            margin: -6px -8px;
+            padding: 0;
+            .h5-list-box .item {
+              background: #f7f7f7;
+              .t1 {
+                padding-bottom: 6px;
+              }
+              .btns {
+                display: none;
+              }
+            }
+            + #labBtn {
+              margin: 0 0 -4px 0;
+              display: inline-block;
+              + .multipleChoice {
+                margin: 0 -8px -7px;
+                .allDel {
+                  top: 6px;
+                  left: 12px;
+                }
+                .list {
+                  padding-left: 42px;
+                  .item {
+                    margin-right: 12px;
+                  }
+                }
+              }
+            }
+          }
+        }
+        #labBtn {
+          margin: 0 -8px;
+          width: calc(100% + 14px);
+          display: block;
+        }
+        .xx_user_list {
+          padding: 0;
+          .left_side {
+            overflow: auto;
+            width: 316px;
+            border-right: solid 5px $bg-color-page;
+            .tit {
+              padding: 10px 8px;
+            }
+            .oper-box {
+              display: flex;
+              padding: 0 8px;
+              .search-box {
+                flex: 1;
+                background: #f7f7f7;
+                height: 38px;
+                border-radius: 20px;
+                display: flex;
+                padding-right: 5px;
+                .txt.el-input {
+                  width: auto !important;
+                  flex: 1;
+                  .el-input__inner {
+                    border: none;
+                    background: none;
+                    line-height: 38px;
+                    height: 38px !important;
+                    padding: 0 21px;
+                  }
+                }
+                .btn.el-button {
+                  width: 64px;
+                  font-size: $fontSizeBase;
+                  padding: 0;
+                  height: 30px;
+                  margin-top: 4px;
+                  border-radius: 17px;
+                }
+              }
+              .btn-add {
+                font-size: 30px;
+                margin-left: 8px;
+                color: #bcbcbc;
+                line-height: 38px;
+                cursor: pointer;
+              }
+            }
+            .adrbook-box {
+              padding: 0 8px;
+              height: 385px;
+              overflow: auto;
+              .item {
+                border: solid 1px $border-color-lighter;
+                color: $text-color-muted;
+                margin: 10px 0;
+                border-radius: 5px;
+                padding: 0 10px 4px;
+                .el-checkbox {
+                  width: 100%;
+                  display: block;
+                  .el-checkbox__input {
+                    position: absolute;
+                    top: 12px;
+                    display: block;
+                    width: 100%;
+                  }
+                  .el-checkbox__label {
+                    padding-left: 23px;
+                    padding-top: 8px;
+                    width: 100%;
+                  }
+                }
+                .more-info {
+                  position: absolute;
+                  right: -4px;
+                  top: 10px;
+                  transform: rotate(90deg);
+                  color: #248bbc;
+                }
+                .name {
+                  color: $text-color-darker;
+                  margin-bottom: 8px;
+                  > i {
+                    width: 18px;
+                    height: 18px;
+                    background: rgba(42, 100, 148, 0.08);
+                    color: $baseColor;
+                    border-radius: 50%;
+                    display: inline-block;
+                    vertical-align: middle;
+                    text-align: center;
+                    line-height: 18px;
+                    margin-right: 5px;
+                  }
+                  > span {
+                    vertical-align: middle;
+                    &.el-tag {
+                      zoom: 0.6;
+                      margin-left: 12px;
+                      margin-top: 3px;
+                    }
+                  }
+                }
+                p {
+                  margin: 0;
+                  color: $text-color-muted;
+                  > span {
+                    min-width: 50%;
+                    display: inline-block;
+                  }
+                }
+              }
+            }
+          }
+          .right_side {
+            flex: 1;
+            overflow: auto;
+            padding: 8px;
+            position: relative;
+            .tit {
+              position: absolute;
+              top: 10px;
+            }
+          }
+          .tit {
+            i,
+            span {
+              vertical-align: middle;
+            }
+            i {
+              margin-right: 4px;
+              color: $baseColor;
+            }
+          }
+          .el-tabs {
+            .el-tabs__nav-wrap {
+              padding-left: 16px;
+            }
+            .el-tabs__content {
+              padding: 0 12px;
+            }
+          }
+        }
+      }
+      &.demo-sty_2 #containt {
+        height: 450px;
+        padding: 0 10px;
+        margin: 8px 0 0;
+      }
+      &.demo-sty_1 {
+        #containt {
+          height: 80vh;
+          padding: 8px 10px 0;
+          margin: 0;
+          overflow: hidden;
+        }
+        .el-loading-mask {
+          position: fixed;
+        }
+      }
+      &.full-height {
+        //.el-dialog__body #containt .detail-wrap .d-cont{height: calc(100vh - 115px);}
+        //&.pageList-dialog .el-dialog__body #containt .detail-wrap .d-cont{height: calc(100vh - 124px)}
+      }
+      &.pageList-dialog {
+        #containt {
+          padding: 0;
+        }
+        &.wenjian .el-dialog__body #containt .detail-wrap .d-cont {
+          height: 420px;
+          width: 100%;
+        }
+      }
+      .debug-left .d-cont {
+        width: 100% !important;
+        height: calc(100vh - 98px) !important;
+      }
+      .debug-right > .grid-height {
+        height: calc(100vh - 98px) !important;
+        padding: 8px 10px;
+      }
+      //.file-library .annex-piclist > .clearfix{height: calc(100vh - 201px);}
+      //&.huishou  .el-dialog__body #containt .detail-wrap .d-cont{height: calc(80vh - 132px);}
+      &.dialog-uploadannex {
+        .upload-box {
+          margin: 0;
+        }
+        .avatar-uploader {
+          margin-top: 10px;
+        }
+      }
+      &.dialog-tab {
+        .el-dialog__body .cont {
+          padding: 0;
+          .tab-box .el-tab-pane {
+            #labBtn {
+              margin: 0 -10px;
+              position: absolute;
+            }
+            .multipleChoice {
+              margin-top: 9px;
+            }
+          }
+          #containt {
+            margin: -8px -10px 0;
+            .detail-wrap .d-cont {
+              height: 462px;
+            }
+          }
+        }
+      }
+    }
+    &.full-height {
+      .el-dialog__body {
+        min-height: calc(100vh - #{$dialogheadHeight});
+      }
+    }
+    &.tips-dialog,
+    &.wf-dialog {
+      max-width: 95%;
+      .el-dialog__title:before {
+        content: "";
+      }
+      .el-dialog__body {
+        margin: 0 14px;
+        padding: 0;
+        background-color: #f4f7fd;
+        min-height: 147px;
+        color: #666666;
+        font-size: $fontSizeBase;
+        position: relative;
+        font-family: element-icons !important;
+        overflow: hidden;
+        .cont {
+          padding: 14px;
+          max-height: 450px;
+          overflow: auto;
+          position: relative;
+          z-index: 2;
+          p {
+            margin: 0 0 8px;
+          }
+          a {
+            color: $baseColor;
+            border-bottom: solid 1px $baseColor;
+          }
+        }
+      }
+      &.warning .el-dialog__body:after {
+        content: "";
+        color: rgba(44, 126, 235, 0.22);
+        font-size: 180px;
+        position: absolute;
+        right: -53px;
+        bottom: -66px;
+      }
+      &.error .el-dialog__body:after {
+        content: "";
+        color: rgba(44, 126, 235, 0.22);
+        font-size: 180px;
+        position: absolute;
+        right: -53px;
+        bottom: -66px;
+      }
+      &.tips-1 {
+        .el-dialog__body {
+          margin: 0;
+          padding: 8px;
+          .cont {
+            padding: 18px;
+            line-height: 1.8;
+            font-size: 13px;
+            background: #fff;
+          }
+        }
+      }
+    }
+    &.wf-dialog {
+      width: 456px;
+      #containt {
+        margin: 8px !important;
+        min-height: 128px;
+        .table-detail tbody tr td {
+          width: 400px;
+          .el-textarea__inner {
+            border: solid 1px $border-color-soft;
+          }
+        }
+      }
+    }
+    &.history-dialog {
+      .el-dialog__header {
+        background: #f7f7f7;
+      }
+      .el-dialog__body {
+        padding: 0;
+        background: #f7f7f7;
+      }
+    }
+    .export-box,
+    .import-box,
+    .upload-box,
+    .print-box {
+      .tips {
+        background: #fff7eb;
+        color: #ff731c;
+        padding: 0 20px;
+        margin: 0 -20px 10px;
+        height: $control-height;
+        line-height: 28px;
+        font-size: $fontSizeBase;
+        em {
+          font-style: inherit;
+        }
+      }
+      .i-status {
+        margin-bottom: 14px;
+        padding: 12px 20px;
+        display: flex;
+        .item {
+          margin: 0 24px;
+          text-align: center;
+          font-size: 13px;
+          -moz-box-flex: 1;
+          -webkit-box-flex: 1;
+          box-flex: 1;
+          i {
+            font-size: 21px;
+            margin-right: 8px;
+            vertical-align: sub;
+          }
+          span {
+            border-bottom: solid 1px $baseColor;
+            color: $baseColor;
+            font-size: 15px;
+            cursor: pointer;
+            padding: 0 6px;
+          }
+        }
+      }
+      .derive-box {
+        overflow: hidden;
+        padding: 2px 18px;
+        font-size: $fontSizeBase;
+        .item {
+          overflow: hidden;
+          margin: 14px 0;
+          line-height: 22px;
+          color: $text-color-gray;
+        }
+        .d-status {
+          float: right;
+          font-size: 15px;
+        }
+        .btn-download {
+          margin-left: 36px;
+          border-radius: 3px;
+          display: inline-block;
+          line-height: 20px;
+          color: $baseColor;
+          font-size: $fontSizeBase;
+          margin: 0 16px 0 8px;
+          i {
+            margin-right: 4px;
+          }
+        }
+      }
+      // .el-progress{padding:30px 30px 10px;}
+    }
+    .import-count {
+      line-height: 28px;
+      font-size: $fontSizeBase;
+      color: $text-color-gray;
+      span {
+        margin: 0 8px;
+      }
+    }
+    .export-box {
+      margin: -30px 0 -20px;
+      .export-progress {
+        margin-bottom: 20px;
+        margin-top: 20px;
+        .el-progress-bar__innerText {
+          color: #b7b7b7 !important;
+        }
+      }
+    }
+    .import-box {
+      margin: -30px 0 -20px;
+      .template-btn {
+        margin-bottom: 10px;
+      }
+      .upload-file {
+        width: 100%;
+        .el-upload-dragger {
+          width: 100%;
+          .el-upload__text {
+            font-size: $fontSizeBase;
+          }
+        }
+      }
+      .export-progress {
+        margin-bottom: 20px;
+        margin-top: 34px;
+        .el-progress-bar__innerText {
+          color: #b7b7b7 !important;
+        }
+      }
+    }
+    .import-stepbox {
+      ul {
+        padding: 0 16px;
+        list-style: none;
+        li {
+          padding: 14px 0 14px 40px;
+          position: relative;
+          margin-bottom: 24px;
+          border: solid 1px $border-color-lighter;
+          border-radius: 4px;
+          font-size: $fontSizeBase;
+          i {
+            display: none;
+            position: absolute;
+            left: 8px;
+            top: 12px;
+            font-size: 19px;
+            background: #fff;
+            padding: 2px;
+            z-index: 2;
+            color: #e4e4e4;
+            &.el-icon-circle-check {
+              display: block;
+            }
+          }
+          &:before {
+            content: "";
+            bottom: 46px;
+            top: -26px;
+            width: 1px;
+            left: 19px;
+            background: #f1e4e4;
+            position: absolute;
+          }
+          &:first-child:before {
+            display: none;
+          }
+          &.ok {
+            &:before {
+              background: $baseColor;
+            }
+            i.el-icon-circle-check {
+              color: $baseColor;
+            }
+            .nums {
+              background: #67c23a;
+              color: #fff;
+            }
+          }
+          &.loading {
+            &:before {
+              background: $baseColor;
+            }
+            i.el-icon-loading {
+              display: block;
+              color: $baseColor;
+            }
+            &.el-icon-circle-check {
+              display: none;
+            }
+            .nums {
+              background: #67c23a;
+              color: #fff;
+            }
+          }
+          .nums {
+            background: #e2e2e2;
+            float: right;
+            margin-right: 10px;
+            line-height: 22px;
+            width: 40px;
+            text-align: center;
+            color: #666;
+            border-radius: 3px;
+            margin-top: -2px;
+            opacity: 0.9;
+          }
+          &:last-child {
+            margin-bottom: 0;
+          }
+        }
+      }
+    }
+    .upload-box {
+      margin: -30px 0 -20px;
+      display: flex;
+      border-top: solid 1px #eaeaea;
+      .upload-demo {
+        height: 300px;
+        overflow: auto;
+        .el-upload {
+          display: inline-block;
+          vertical-align: middle;
+          float: left;
+          margin-right: 14px;
+          .el-button {
+            &:focus,
+            &:hover {
+              border-color: #c0ccda;
+              background-color: #fbfdff;
+              color: $text-color-placeholder;
+            }
+          }
+        }
+        .el-upload-list--picture .el-progress {
+          top: -19px;
+          width: calc(100% - 20px);
+          right: -19px;
+        }
+      }
+      .upload-b_left {
+        border: solid 1px transparent;
+        border-right-color: #eaeaea;
+        width: 294px;
+        padding: 10px 0;
+        margin-bottom: -52px;
+        margin-top: -1px;
+        border-radius: 0 0 0 9px;
+        z-index: 1;
+        .t {
+          color: #ff731c;
+          font-size: $fontSizeBase;
+          padding: 0 16px;
+          i {
+            margin-right: 4px;
+          }
+        }
+        .el-upload-list--picture {
+          height: calc(66vh + 8px);
+          max-height: inherit;
+          overflow: auto;
+          padding: 0 16px;
+          margin-bottom: 10px;
+          overflow-x: hidden;
+          .nodata {
+            text-align: center;
+            line-height: 1.6;
+            color: $text-color-muted;
+            margin-top: 60%;
+            img {
+              width: 100%;
+              margin-bottom: 6px;
+            }
+          }
+          .el-upload-list__item {
+            margin-right: 0;
+            width: 259px;
+            height: 84px;
+            margin-bottom: 3px;
+            .el-upload-list__item-thumbnail {
+              width: 82px;
+              height: 82px;
+              border-radius: 6px;
+            }
+            .el-input {
+              margin: 6px 0 5px;
+            }
+            .el-upload-list__item-name {
+              .txt-box {
+                width: 150px;
+                height: 33px;
+                overflow: hidden;
+                margin-top: 5px;
+                margin-left: -3px;
+                margin-bottom: 2px;
+                .tb-left {
+                  float: left;
+                  height: 36px;
+                  width: 1px;
+                }
+                .tb-mid {
+                  float: right;
+                  word-break: break-all;
+                  width: 145px;
+                  .txt {
+                    font-size: $fontSizeBase;
+                    line-height: 1.2;
+                    margin-top: 3px;
+                    display: table-cell;
+                    width: 145px;
+                    height: 36px;
+                    white-space: break-spaces;
+                    .name {
+                      word-break: break-all;
+                    }
+                    span {
+                      vertical-align: middle;
+                      display: inline;
+                    }
+                    i {
+                      position: inherit;
+                      top: inherit;
+                      left: inherit;
+                      display: inline-block;
+                      font-size: $fontSizeBase;
+                      line-height: 20px;
+                      height: 20px;
+                      color: $baseColor;
+                      margin-left: 6px;
+                    }
+                  }
+                }
+                .format {
+                  float: right;
+                  position: relative;
+                  background-color: #fff;
+                  font-size: $fontSizeBase;
+                  padding: 0 2px 0 6px;
+                  line-height: 1;
+                  width: 22px;
+                  height: 18px;
+                  top: -20px;
+                  left: 146px;
+                  margin-left: -17px;
+                  text-align: right;
+                  i {
+                    display: block;
+                    font-size: $fontSizeBase;
+                    color: $baseColor;
+                    position: inherit;
+                  }
+                }
+              }
+              p.flex {
+                display: flex;
+                margin-bottom: 4px;
+                margin-top: 3px;
+                span {
+                  flex: 1;
+                  vertical-align: middle;
+                  display: inline-block;
+                  margin: 6px 0 5px 3px;
+                  line-height: 28px;
+                }
+                .el-input {
+                  width: 100% !important;
+                  vertical-align: middle;
+                  .el-input__inner {
+                    height: 24px !important;
+                    line-height: 24px;
+                  }
+                }
+              }
+            }
+          }
+        }
+        .button-sty {
+          float: right;
+          margin-right: 16px;
+        }
+        &.on {
+          border-color: transparentize($baseColor, 0.37);
+          box-shadow: 0 0 7px rgba($baseColor, 0.48);
+          border-radius: 0 12px 12px 9px;
+        }
+      }
+      .upload-b_right {
+        flex: 1;
+        .tips {
+          margin-left: 0;
+          margin-right: 0;
+          margin-bottom: 6px;
+        }
+        .upload-demo {
+          padding: 0 18px;
+          height: calc(66vh);
+        }
+        .upload-count {
+          text-align: center;
+          display: inline-block;
+          color: $text-color-dark;
+          > div {
+            display: inline-block;
+            margin: 0 18px;
+            > span {
+              display: inline-block;
+              padding: 2px 4px 0;
+              font-size: 13px;
+              border-radius: 8px;
+              line-height: 1.4;
+              &.error {
+                background: $red;
+                color: #fff;
+                min-width: 42px;
+                padding-bottom: 2px;
+              }
+            }
+          }
+        }
+      }
+    }
+    .table-detail .upload-box {
+      margin: 0;
+      .el-upload-list__item {
+        margin-top: 0 !important;
+      }
+    }
+    .print-box {
+      margin: -30px 0 0;
+      font-size: $fontSizeBase;
+      .tips {
+        height: 38px;
+        line-height: 38px;
+        .button-sty {
+          background-color: #fff;
+          margin-top: 5px;
+          color: #e6a23c;
+          &:hover {
+            background-color: #e6a23c;
+            color: #fff;
+          }
+        }
+      }
+      .oper {
+        .button-sty {
+          vertical-align: middle;
+        }
+        .el-select {
+          margin: 0 10px;
+        }
+        span {
+          margin-right: 6px;
+          em {
+            margin: 0 6px 0 -4px;
+            vertical-align: middle;
+          }
+        }
+      }
+      .return-msg {
+        background-color: #f2f6fc;
+        padding: 12px;
+        margin: 8px 0 12px;
+        min-height: 228px;
+        overflow: auto;
+      }
+    }
+    &.news-box {
+      .el-dialog__body {
+        background: #f7f8fc;
+        display: flex;
+        padding: 8px 16px;
+        p {
+          margin: 0;
+        }
+        .n-list {
+          height: 85vh;
+          overflow: auto;
+          padding-right: 12px;
+          width: 286px;
+          overflow-x: hidden;
+          margin-top: 12px;
+          .item {
+            border-radius: 4px;
+            background: #edeef3;
+            padding: 8px 14px;
+            width: 224px;
+            margin: 12px 0;
+            font-size: $fontSizeBase;
+            line-height: 1.6;
+            color: $text-color-muted;
+            cursor: pointer;
+            &:hover {
+              color: $baseColor;
+              .name {
+                color: $baseColor;
+              }
+            }
+            &:first-child {
+              margin-top: 0;
+            }
+            .name {
+              font-size: 13px;
+              @include ellipsis;
+              color: #424242;
+              em {
+                background: $red;
+                color: #fff;
+                font-style: initial;
+                width: 16px;
+                height: 16px;
+                display: inline-block;
+                padding-left: 1px;
+                border-radius: 3px;
+                line-height: 16px;
+                margin-right: 4px;
+              }
+            }
+            &.on {
+              border-left: solid 2px $baseColor;
+              background: #fff;
+              position: relative;
+              &:after {
+                content: "";
+                position: absolute;
+                top: 0;
+                right: -12px;
+                background: #fff;
+                bottom: 0;
+                width: 24px;
+              }
+            }
+          }
+        }
+        .n-cont {
+          background: #fff;
+          border-radius: 4px;
+          padding: 16px 24px;
+          margin: 12px 0;
+          font-size: $fontSizeBase;
+          line-height: 1.4;
+          height: 85vh;
+          overflow: auto;
+          width: calc(100% - 76px);
+          .t1 {
+            font-size: 20px;
+            margin: 0 0 6px 0;
+            font-weight: 400;
+          }
+          .t2 {
+            color: $text-color-muted;
+            font-weight: 200;
+            margin: 0;
+            margin-bottom: 8px;
+            font-size: $fontSizeBase;
+          }
+          .time {
+            color: $text-color-muted;
+            margin-bottom: 13px;
+          }
+          .c {
+            border-top: solid 1px $border-color-soft;
+            padding: 10px 0;
+            line-height: 1.6;
+            p {
+              text-indent: 24px;
+            }
+          }
+        }
+        .annex {
+          text-align: right;
+          overflow: hidden;
+          a {
+            color: $baseColor;
+            text-decoration: underline;
+            float: left;
+            min-width: 50%;
+            margin-right: 23px;
+            margin-bottom: 8px;
+            min-width: 231px;
+            text-align: left;
+          }
+        }
+      }
+    }
+    &.designer-dialog {
+      background-color: #f1f2f3;
+      > .el-dialog__body {
+        padding: 0;
+        border-top: solid 1px #f0f0f0;
+        background-color: #fff;
+        height: calc(100vh - #{$dialogheadHeight});
+        #containt {
+          margin: 0;
+          overflow: hidden;
+          height: 100%;
+          // &.detail-list{
+          //   .grid-height{height: calc(100vh - 122px);}
+          // }
+          > div,
+          > .el-form {
+            height: inherit;
+          }
+          .designer-drawer.el-drawer__wrapper {
+            position: absolute;
+            left: 0;
+            right: 0;
+            top: 43px;
+            bottom: 0;
+            .el-drawer__body {
+              overflow: hidden;
+            }
+          }
+        }
+      }
+      //#containt .detail-wrap .d-cont{height: calc(100vh - 82px);}
+    }
+    &.video-dialog {
+      .el-dialog__header .el-dialog__title::before {
+        content: "\e763";
+      }
+      .el-dialog__body {
+        padding: 0 10px 10px;
+      }
+    }
+    &.upload-dialog {
+      margin-top: 5vh !important;
+      .el-dialog__body {
+        padding: 0;
+        overflow: hidden;
+        background-color: #f4f6fa;
+        .el-tabs {
+          width: 72%;
+          float: left;
+          .el-tabs__header {
+            margin-bottom: 0;
+            background-color: #fff;
+            .el-tabs__nav-wrap {
+              padding-left: 10px;
+              &:after,
+              .el-tabs__active-bar {
+                display: none;
+              }
+              .el-tabs__item {
+                background: #eef3f9;
+                min-width: 121px;
+                height: 34px;
+                line-height: 34px;
+                margin-bottom: -2px;
+                padding: 0 25px 0 0;
+                text-align: center;
+                &.is-active {
+                  background: #fff;
+                  color: $baseColor;
+                }
+              }
+            }
+          }
+          .el-tabs__content {
+            padding-top: 10px;
+            .tree-box.tree-annex {
+              width: 22%;
+              //.tree-list{height:calc(90vh - 250px)}
+            }
+            #labBtn {
+              height: calc(90vh - 250px);
+            }
+            #containt .main-right {
+              width: 77%;
+              // &.file-library .annex-piclist > .clearfix{height:calc(90vh - 247px);}
+              // &.file-library .grid-height{height:calc(90vh - 215px);}
+            }
+          }
+        }
+        .upload-checked {
+          width: 28%;
+          float: right;
+          border: solid 1px #e0e0e0;
+          border-right: none;
+          border-radius: 14px 0 0 14px;
+          padding: 0 10px;
+          background: #fff;
+          .tit {
+            padding: 8px 0 6px;
+            overflow: hidden;
+            color: $text-color-title;
+            line-height: 28px;
+            b {
+              font-weight: 400;
+              font-size: 13px;
+              vertical-align: middle;
+            }
+            i {
+              color: $baseColor;
+              margin-right: 6px;
+              vertical-align: middle;
+            }
+          }
+          .list {
+            height: calc(90vh - 144px);
+          }
+        }
+      }
+    }
+    &.h5view-dialog {
+      margin-top: 15px !important;
+      .el-dialog__body {
+        background: $bg-color-page;
+        padding: 0;
+        border-top: solid 1px $bg-color-page;
+        overflow: auto;
+        .h5-wrap .form-box {
+          .c {
+            .el-form-item.is-error .el-input .el-input__inner {
+              border: solid 1px #ee7575 !important;
+            }
+          }
+          .fix-bottom-btns {
+            z-index: 998;
+            + .c {
+              height: calc(100vh - 205px);
+            }
+          }
+        }
+        .pop-viewForm {
+          top: 45px;
+          .viewForm-box {
+            height: calc(100% - 70px);
+            overflow: auto;
+            .el-form .el-input {
+              width: 100% !important;
+            }
+          }
+        }
+
+        .h5-detail-wrap {
+          .el-tabs__content {
+            height: calc(100vh - 214px);
+            overflow: auto;
+            margin-bottom: 56px;
+            padding: 0 0 10px;
+          }
+          .h5-fixed-bottom-btns {
+            position: absolute;
+          }
+        }
+        > .cont {
+          > .h5-list-box {
+            padding: 12px;
+            background: #fff;
+            .t2 dl .field-wrapper {
+              width: calc(100vw - 129px);
+            }
+          }
+        }
+      }
+      &.is-fullscreen .el-dialog__body .cont {
+        height: inherit;
+      }
+    }
+    &.dialog-upload-h5 {
+      .upload-box {
+        .upload-b_right {
+          .tips {
+            height: inherit;
+            line-height: 1.4;
+            padding: 8px 20px;
+            overflow: hidden;
+          }
+          .upload-count {
+            margin-top: 6px;
+          }
+          .upload-demo {
+            height: 55vh;
+          }
+        }
+      }
+      .el-dialog__footer .dialog-footer > .fl {
+        margin-left: 0 !important;
+      }
+    }
+    &.designer-view {
+      .upload-box {
+        margin: 0;
+        border-top: none;
+        .el-upload-list--picture .el-upload-list__item {
+          margin-top: 0;
+        }
+      }
+    }
+  }
+  .adSearchForm_all .dialog-style {
+    width: 418px !important;
+    .el-dialog__body .cont .adSearchForm {
+      width: 100%;
+      margin: auto;
+      .vxe-form--item {
+        width: 100%;
+        .el-input,
+        .el-select {
+          width: 100% !important;
+        }
+        .dateRange .el-input.el-date-editor {
+          width: calc(50% - 13px) !important;
+        }
+      }
+    }
+  }
+}