1
QYF-GitLab1
2024-12-27 fe8fa03517cc04f99a4ed467559861e765160830
src/books/aviationSafety/assets/main.less
@@ -1,322 +1,155 @@
.aviationSafety-book {
    width: 100%;
    height: 100%;
  width: 100%;
  height: 100%;
    // 视频
    .video-box-cover {
        border: 1px dashed #895B2E;
        padding: 2% 2%;
    }
  // 自定义内容
  .page-box {
      box-sizing: border-box;
      min-height: 1128px;
      margin-bottom: 20px;
      box-shadow: 0 3px 6px 1px #00000029;
      background-color: #fff;
  }
    .video-box {
        margin: 20px 0 20px 8%;
        border: 1px dashed #895B2E;
        padding: 2% 2%;
    }
  .foreword {
      line-height: 10px !important;
      margin-top: 0;
  }
    .video-box-left {
        margin: 20px 8% 20px 0;
        border: 1px dashed #895B2E;
        padding: 2% 2%;
    }
  .c-g {
      color: green;
  }
    .videoname {
        display: flex;
        justify-content: center;
    }
  .c-r {
      color: red;
  }
    .selectInput {
        width: 20px;
        outline: none;
        border: 0;
        text-align: center;
    }
  .t-right {
      text-align: right;
  }
    .collect-btn {
        cursor: pointer;
        width: 20px;
        height: 20px;
        margin-left: 10px;
        margin-top: 0.8%;
    }
  .mr-0 {
      margin: 0 !important;
  }
    .collect-btn1 {
        cursor: pointer;
        width: 10px;
        height: 10px;
        margin-left: 10px;
        margin-top: 0.8%;
    }
  .mr-9 {
      margin-right: 9%;
  }
    // 自定义内容
    .page-box {
        box-sizing: border-box;
        min-height: 1128px;
        margin-bottom: 20px;
        box-shadow: 0 3px 6px 1px #00000029;
        background-color: #fff;
    }
  .ml-9 {
      margin-left: 9%;
  }
    .foreword {
        line-height: 10px !important;
        margin-top: 0;
    }
  .ml-2e {
      margin-left: 2em;
  }
    .c-g {
        color: green;
    }
  .mt--25{
      margin-top: -25px !important;
  }
    .c-r {
        color: red;
    }
  .mt-10 {
      margin-top: 10px !important;
  }
    .t-right {
        text-align: right;
    }
  .mt-20 {
      margin-top: 20px !important;
  }
    .mr-0 {
        margin: 0 !important;
    }
  .mt-30 {
      margin-top: 30px !important;;
  }
    .mr-9 {
        margin-right: 9%;
    }
  .mt-50 {
      margin-top: 50px !important;
  }
    .ml-9 {
        margin-left: 9%;
    }
  .mb-20 {
      margin-bottom: 20px !important;
  }
    .ml-2e {
        margin-left: 2em;
    }
  .mb-10 {
      margin-bottom: 10px;
  }
    .mt--25 {
        margin-top: -25px !important;
    }
  .pd-5 {
      padding: 0 5px;
  }
    .mt-10 {
        margin-top: 10px !important;
    }
  .w100 {
      width: 100%;
  }
    .mt-20 {
        margin-top: 20px !important;
    }
  .w90 {
      width: 90%;
  }
    .mt-30 {
        margin-top: 30px !important;
        ;
    }
    .mt-50 {
        margin-top: 50px !important;
    }
  .w80 {
      width: 80%;
  }
    .mb-20 {
        margin-bottom: 20px !important;
    }
    .mb-10 {
        margin-bottom: 10px;
    }
  .b0 {
      border: 0;
  }
    .pd-5 {
        padding: 0 5px;
    }
  sup {
      vertical-align: super;
      /* 保持上标对齐方式 */
      font-size: smaller;
      // position: relative; /* 相对于正常位置调整 */
      // top: -0.2em; /* 根据需要调整这个值 */
  }
    .w100 {
        width: 100%;
    }
  .fz-13 {
      font-size: 13px !important;
  }
    .w90 {
        width: 90%;
    }
  .fz-14 {
      font-size: 14px !important;
  }
  .fz-15 {
      font-size: 15px !important;
  }
    p {
        text-indent: 0em;
        line-height: 20px;
    }
}
.table-title-bc {
    background-color: #8091BC;
    color: #fff;
    line-height: 25px;
}
.table-textarea {
    font-size: 14px;
    font-family: "Times New Roman", "宋体";
    resize: none;
    &:focus {
        outline: none;
    }
}
.table-input-border {
    width: 80%;
    background-color: transparent;
    border: 0;
    &:focus {
        outline: none;
    }
}
.table-input-border-w20 {
    width: 20%;
    background-color: transparent;
    border: 0;
    &:focus {
        outline: none;
    }
}
.table-input-border-w15 {
    width: 15%;
    background-color: transparent;
    border: 0;
    &:focus {
        outline: none;
    }
}
.table-input-border-w10 {
    width: 10%;
    background-color: transparent;
    border: 0;
    &:focus {
        outline: none;
    }
}
.table-input-border-w5 {
    width: 5%;
    background-color: transparent;
    border: 0;
    &:focus {
        outline: none;
    }
}
.input-bottom-border {
    width: 11%;
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #000;
    &:focus {
        outline: none;
    }
}
.input-bottom-border1 {
    width: 33%;
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #000;
    &:focus {
        outline: none;
    }
}
.input-bottom-border2 {
    width: 21.5%;
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #000;
    &:focus {
        outline: none;
    }
}
// 续表
.continued {
    text-align: right;
    margin: 0%;
}
.text-rights {
    width: 230px;
    float: right;
    height: auto;
    margin: auto;
    margin-left: 20px;
    .w80 {
        width: 80%;
    }
    .b0 {
        border: 0;
    }
    sup {
        vertical-align: super;
        /* 保持上标对齐方式 */
        font-size: smaller;
        // position: relative; /* 相对于正常位置调整 */
        // top: -0.2em; /* 根据需要调整这个值 */
    }
    .fz-13 {
        font-size: 13px !important;
    }
    .fz-14 {
        font-size: 14px !important;
    }
    .fz-15 {
        font-size: 15px !important;
    }
    .fz-16 {
        font-size: 16px !important;
    }
  .fz-16 {
      font-size: 16px !important;
  }
    .fz-18 {
        font-size: 18px !important;
    }
  .fz-18 {
      font-size: 18px !important;
  }
    .img-0 {
        width: 100%;
    }
  .img-0 {
      width: 100%;
  }
    .pt-20 {
        padding-top: 20px;
    }
  .pt-20 {
      padding-top: 20px;
  }
    .td-0 {
        text-indent: 0em !important;
    }
  .td-0 {
      text-indent: 0em !important;
  }
    .td-1 {
        text-indent: 1em !important;
    }
  .td-1 {
      text-indent: 1em !important;
  }
    .td-2 {
        text-indent: 2em !important;
    }
  .td-2 {
      text-indent: 2em !important;
  }
    .fl {
        display: flex;
    }
  .fl {
      display: flex;
  }
    .ju-cn {
        justify-content: center;
    }
  .ju-cn {
      justify-content: center;
  }
    .ju-ev {
        justify-content: space-evenly;
@@ -425,9 +258,9 @@
        background-color: #6D84AE;
    }
    .radioClass {
    .radioClass{
        margin: 0 0 0 4px !important;
    }
@@ -660,7 +493,7 @@
    .table-title-bc {
        background-color: #8091BC;
        color: #fff;
        color:#fff;
        line-height: 25px;
    }
@@ -675,7 +508,7 @@
    }
    .table-input-border {
        width: 90%;
        width: 80%;
        background-color: transparent;
        border: 0;
@@ -684,13 +517,51 @@
        }
    }
    .table-input-border-w20 {
        width: 20%;
        background-color: transparent;
        border: 0;
        &:focus {
            outline: none;
        }
    }
    .table-input-border-w15 {
        width: 15%;
        background-color: transparent;
        border: 0;
        &:focus {
            outline: none;
        }
    }
    .table-input-border-w10 {
        width: 10%;
        background-color: transparent;
        border: 0;
        &:focus {
            outline: none;
        }
    }
    .table-input-border-w5 {
        width: 5%;
        background-color: transparent;
        border: 0;
        &:focus {
            outline: none;
        }
    }
    .input-bottom-border {
        width: 11%;
        background-color: transparent;
        border: 0;
        border-bottom: 1px solid #000;
        &:focus {
            outline: none;
        }
@@ -701,13 +572,12 @@
        background-color: transparent;
        border: 0;
        border-bottom: 1px solid #000;
        &:focus {
            outline: none;
        }
    }
    .input-bottom-border2 {
        width: 21.5%;
        background-color: transparent;
@@ -717,6 +587,51 @@
        &:focus {
            outline: none;
        }
    }
    // 视频
    .video-box-cover {
        border: 1px dashed #895B2E;
        padding: 2% 2%;
    }
    .video-box {
        margin: 20px 0 20px 8%;
        border: 1px dashed #895B2E;
        padding: 2% 2%;
    }
    .video-box-left {
        margin: 20px 8% 20px 0;
        border: 1px dashed #895B2E;
        padding: 2% 2%;
    }
    .videoname {
        display: flex;
        justify-content: center;
    }
    .sInput {
      width: 60px;
      border: 0;
      outline: none;
      text-align: center;
    }
    .collect-btn {
        cursor: pointer;
        width: 20px;
        height: 20px;
        margin-left: 10px;
        margin-top: 0.8%;
    }
    .collect-btn1 {
        cursor: pointer;
        width: 10px;
        height: 10px;
        margin-left: 10px;
        margin-top: 0.8%;
    }
    // 续表
@@ -856,16 +771,16 @@
        display: flex !important;
        flex-direction: column-reverse !important;
        position: relative !important;
        .img {
            margin: 0 !important;
            font-size: 16px !important;
            font-size: 14px !important;
            position: absolute !important;
            left: 50% !important;
            transform: translateX(-50%);
            bottom: -2% !important;
        }
        img {
            height: 80%;
        }
@@ -1440,7 +1355,7 @@
    }
    .img-a {
        width: 95%;
        width: 96%;
    }
    .img-b {
@@ -1685,11 +1600,11 @@
        font-size: 1.2em;
    }
    .zt-1 {
        color: #6F84AF;
    .zt-1{
        color:#6F84AF;
        font-weight: bold;
        font-size: 1.1em;
        font-size:1.1em;
    }
    div.bj3 {
@@ -1861,268 +1776,268 @@
}
.pdfModal {
    width: 100%;
    height: 90vh;
  width: 100%;
  height: 90vh;
    .pdfBox-component {
        width: 100%;
        height: 100%;
        position: relative;
  .pdfBox-component {
      width: 100%;
      height: 100%;
      position: relative;
        .preview {
            width: 100%;
            height: 100%;
      .preview {
          width: 100%;
          height: 100%;
            .imageBox {
                height: calc(100% - 30px);
                overflow-x: hidden;
                overflow-y: auto;
                background: #ccc;
                box-sizing: border-box;
            }
          .imageBox {
              height: calc(100% - 30px);
              overflow-x: hidden;
              overflow-y: auto;
              background: #ccc;
              box-sizing: border-box;
          }
            .imageBox:hover {
                cursor: zoom-in !important;
            }
          .imageBox:hover {
              cursor: zoom-in !important;
          }
            ::v-deep .el-dialog__header {
                background-color: rgba(0, 0, 0, 0.8);
          ::v-deep .el-dialog__header {
              background-color: rgba(0, 0, 0, 0.8);
                .header_title {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    color: #fff;
                    font-weight: 900;
                    font-size: 16px;
                    font-family: 'FZLTXIHJW';
              .header_title {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  color: #fff;
                  font-weight: 900;
                  font-size: 16px;
                  font-family: 'FZLTXIHJW';
                    span:nth-child(2):hover {
                        cursor: pointer;
                    }
                }
                  span:nth-child(2):hover {
                      cursor: pointer;
                  }
              }
                ::v-deep .el-dialog__title,
                ::v-deep .el-dialog__headerbtn .el-dialog__close {
                    color: #fff;
                    font-weight: 900;
                    font-size: 16px;
                    font-family: 'FZLTXIHJW';
                }
            }
              ::v-deep .el-dialog__title,
              ::v-deep .el-dialog__headerbtn .el-dialog__close {
                  color: #fff;
                  font-weight: 900;
                  font-size: 16px;
                  font-family: 'FZLTXIHJW';
              }
          }
            .bottom_tool {
                height: 30px;
                background-color: rgba(0, 0, 0, 0.8);
                display: flex;
                justify-content: flex-end;
                align-items: center;
          .bottom_tool {
              height: 30px;
              background-color: rgba(0, 0, 0, 0.8);
              display: flex;
              justify-content: flex-end;
              align-items: center;
                svg {
                    margin-right: 15px;
                    fill: #d1d1d1;
                }
              svg {
                  margin-right: 15px;
                  fill: #d1d1d1;
              }
                svg:hover {
                    fill: #fff;
                    cursor: pointer;
                }
            }
        }
              svg:hover {
                  fill: #fff;
                  cursor: pointer;
              }
          }
      }
        .notBox {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: calc(100% - 30px);
            min-height: 300px;
        }
    }
      .notBox {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: calc(100% - 30px);
          min-height: 300px;
      }
  }
}
.custom-dialog {
    overflow: hidden !important;
  overflow: hidden !important;
    .el-dialog__body {
        padding: 0;
    }
  .el-dialog__body {
      padding: 0;
  }
    .el-dialog__header {
        background-color: rgba(0, 0, 0, 0.8);
  .el-dialog__header {
      background-color: rgba(0, 0, 0, 0.8);
        .header_title {
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: #fff;
            font-weight: 900;
            font-size: 16px;
            font-family: 'FZLTXIHJW';
      .header_title {
          display: flex;
          justify-content: space-between;
          align-items: center;
          color: #fff;
          font-weight: 900;
          font-size: 16px;
          font-family: 'FZLTXIHJW';
            span:nth-child(2):hover {
                cursor: pointer;
            }
        }
          span:nth-child(2):hover {
              cursor: pointer;
          }
      }
        .el-dialog__title,
        .el-dialog__headerbtn .el-dialog__close {
            color: #fff;
            font-weight: 900;
            font-size: 16px;
            font-family: 'FZLTXIHJW';
        }
    }
      .el-dialog__title,
      .el-dialog__headerbtn .el-dialog__close {
          color: #fff;
          font-weight: 900;
          font-size: 16px;
          font-family: 'FZLTXIHJW';
      }
  }
}
.header_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    // color: #fff;
    font-weight: 900;
    font-size: 16px;
    font-family: 'FZLTXIHJW';
  display: flex;
  justify-content: space-between;
  align-items: center;
  // color: #fff;
  font-weight: 900;
  font-size: 16px;
  font-family: 'FZLTXIHJW';
    span:nth-child(2):hover {
        cursor: pointer;
    }
  span:nth-child(2):hover {
      cursor: pointer;
  }
}
@font-face {
    font-family: 'FZLTZHJW';
    src: url('./Fonts/FZLTZHJW.ttf');
  font-family: 'FZLTZHJW';
  src: url('./Fonts/FZLTZHJW.ttf');
}
@font-face {
    font-family: 'FZLTXIHJW';
    src: url('./Fonts/FZLTXIHJW.ttf');
  font-family: 'FZLTXIHJW';
  src: url('./Fonts/FZLTXIHJW.ttf');
}
@font-face {
    font-family: 'FZHTJW';
    src: url('./Fonts/FZHTJW.ttf');
  font-family: 'FZHTJW';
  src: url('./Fonts/FZHTJW.ttf');
}
@font-face {
    font-family: 'FANGSONG';
    src: url('./Fonts/fangSong.ttf');
  font-family: 'FANGSONG';
  src: url('./Fonts/fangSong.ttf');
}
@font-face {
    font-family: 'FANGZHENG';
    src: url('./Fonts/fangZheng.ttf');
  font-family: 'FANGZHENG';
  src: url('./Fonts/fangZheng.ttf');
}
@font-face {
    font-family: 'ZHUNYUAN';
    src: url('./Fonts/zhunyuan.ttf');
  font-family: 'ZHUNYUAN';
  src: url('./Fonts/zhunyuan.ttf');
}
@font-face {
    font-family: 'ZHONGDENGXIAN';
    src: url('./Fonts/zhongdengxian.ttf');
  font-family: 'ZHONGDENGXIAN';
  src: url('./Fonts/zhongdengxian.ttf');
}
@font-face {
    font-family: 'BOYA';
    src: url('./Fonts/boYa.ttf');
  font-family: 'BOYA';
  src: url('./Fonts/boYa.ttf');
}
// 隐藏页面
.hidePage {
    min-height: 0 !important;
    height: 0 !important;
    box-shadow: none !important;
  min-height: 0 !important;
  height: 0 !important;
  box-shadow: none !important;
}
/* 媒体查询做基础响应式布局 */
@media screen and (max-width: 1024px) {
    .pdfModal {
        width: 100%;
        height: 80vh;
    }
  .pdfModal {
      width: 100%;
      height: 80vh;
  }
    .custom-dialog {
        .el-dialog {
            width: 90vw !important;
        }
    }
  .custom-dialog {
      .el-dialog {
          width: 90vw !important;
      }
  }
}
@media screen and (max-width: 800px) {
    .pdfModal {
        width: 100%;
        height: 60vh;
    }
  .pdfModal {
      width: 100%;
      height: 60vh;
  }
    .custom-dialog {
        .el-dialog {
            width: 90vw !important;
        }
    }
  .custom-dialog {
      .el-dialog {
          width: 90vw !important;
      }
  }
}
@media (max-width: 660px) {
    .aviationSafety-book {
  .aviationSafety-book {
        /* 分页padding */
        .padding-93 {
            padding: 0 20px;
        }
      /* 分页padding */
      .padding-93 {
          padding: 0 20px;
      }
        .padding-102 {
            padding: 0 20px;
        }
      .padding-102 {
          padding: 0 20px;
      }
        .img-float {
            width: 130px;
        }
      .img-float {
          width: 130px;
      }
        .img-rights {
            width: 130px;
        }
      .img-rights {
          width: 130px;
      }
        .btn-w {
            width: 42px;
        }
    }
      .btn-w {
          width: 42px;
      }
  }
}
@media (min-width: 660px) {
    .aviationSafety-book {
        .padding-93 {
            padding: 0 93px 0px 93px;
        }
  .aviationSafety-book {
      .padding-93 {
          padding: 0 93px 0px 93px;
      }
        .padding-102 {
            padding: 0 102px 0 102px;
        }
    }
      .padding-102 {
          padding: 0 102px 0 102px;
      }
  }
}
::-webkit-scrollbar {
    width: 8px;
    height: 10px;
  width: 8px;
  height: 10px;
}
::-webkit-scrollbar-track-piece {
    background-color: rgba(0, 0, 0, 0.1);
    -webkit-border-radius: 6px;
  background-color: rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 6px;
}
::-webkit-scrollbar-thumb:vertical {
    height: 5px;
    background-color: rgba(125, 125, 125, 0.3);
    -webkit-border-radius: 6px;
  height: 5px;
  background-color: rgba(125, 125, 125, 0.3);
  -webkit-border-radius: 6px;
}
::-webkit-scrollbar-thumb:horizontal {
    width: 5px;
    background-color: rgba(125, 125, 125, 0.3);
    -webkit-border-radius: 6px;
  width: 5px;
  background-color: rgba(125, 125, 125, 0.3);
  -webkit-border-radius: 6px;
}