适配小屏

src/assets/styles/adaptive.scss

@@ -0,0 +1,306 @@
+@media screen and (max-width: 1366px) {
+  // base
+  .part-box {
+    margin-bottom: 15px;
+    border-radius: 15px;
+    padding: 20px;
+  }
+  .el-form.part-filter-form {
+    padding: 15px 0 0;
+
+    /* element-ui*/
+    .el-form-item {
+      width: 220px;
+    }
+    .el-form-item__label {
+      padding: 0 12px 0 8px;
+    }
+    .el-input__inner {
+      padding-left: 6px;
+    }
+  }
+  .part-box-title {
+    font-size: 18px;
+    padding-bottom: 15px;
+    font-weight: 600;
+  }
+  .part-box-header {
+    padding-bottom: 15px;
+    .part-box-title {
+      font-size: 18px;
+      font-weight: 600;
+    }
+  }
+  .part-box-action {
+    padding-top: 15px;
+  }
+
+  // login
+  .login {
+    .login-main {
+      width: 864px;
+      height: 544px;
+      transform: translate(-50%, -51%);
+      background-size: 100% 100%;
+    }
+    .login-title {
+      left: 125px;
+      top: 72px;
+      font-size: 36px;
+      line-height: 54px;
+    }
+    .login-footer {
+      left: 145px;
+      bottom: 90px;
+    }
+    .login-body {
+      width: 350px;
+      right: 100px;
+      top: 70px;
+      padding: 45px;
+      border-radius: 15px;
+
+      &-title {
+        height: 26px;
+        line-height: 26px;
+        font-size: 18px;
+        margin-bottom: 30px;
+      }
+      .el-input__inner {
+        height: 40px !important;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-left: 36px;
+      }
+      .el-input__prefix {
+        top: 11px;
+        left: 14px;
+      }
+    }
+    .login-submit-btn {
+      height: 42px;
+      box-shadow: 0px 16px 16px 0px rgba(254, 114, 61, 0.3);
+      font-size: 16px;
+    }
+  }
+  // home
+  .home {
+    &::before {
+      width: 560px;
+      height: 160px;
+      left: 160px;
+    }
+    &-body {
+      top: 50px;
+    }
+    &-main {
+      padding: 0 15px 40px 235px;
+    }
+    &-header {
+      height: 50px;
+      left: 215px;
+      padding: 13px 15px;
+    }
+    .header-menu-item {
+      line-height: 24px;
+      height: 24px;
+      min-width: 24px;
+      border-radius: 12px;
+      padding: 0 12px;
+    }
+    &-footer {
+      height: 40px;
+      padding: 10px 0;
+    }
+    &-side {
+      width: 220px;
+    }
+    &-logo {
+      padding: 0 30px;
+      font-size: 18px;
+      line-height: 40px;
+      a {
+        padding: 20px 0;
+      }
+    }
+    .el-menu-vertical-demo {
+      padding-top: 15px;
+
+      .el-submenu__title {
+        padding: 0 30px !important;
+        height: 40px;
+        line-height: 40px;
+      }
+      .el-submenu .el-menu-item {
+        padding-left: 54px !important;
+        height: 36px;
+        line-height: 36px;
+      }
+      .el-submenu__icon-arrow {
+        right: 30px;
+      }
+    }
+  }
+  // pages
+  .data-privilege {
+    .privilege-part {
+      margin-bottom: 15px;
+      border-radius: 15px;
+    }
+    .privilege-header {
+      padding-bottom: 0;
+      &-top {
+        padding: 20px 20px 0;
+
+        .box-justify {
+          padding-bottom: 10px;
+        }
+      }
+    }
+    .privilege-body {
+      .box-justify {
+        padding: 15px 20px;
+      }
+
+      .privilege-table {
+        padding: 20px;
+      }
+    }
+  }
+  .part-tabs {
+    padding: 0 20px;
+
+    &-item {
+      padding: 15px 0 20px;
+    }
+  }
+  .topic-set {
+    &-title {
+      height: 28px;
+      line-height: 28px;
+    }
+    &-content {
+      .el-input__inner {
+        height: 30px;
+        line-height: 30px;
+      }
+    }
+  }
+  // edit paper
+  .edit-paper {
+    .edit-header {
+      padding: 0 40px;
+      box-shadow: 0px 15px 15px 0px rgba(212, 220, 243, 0.2);
+
+      &-top {
+        padding: 10px 0;
+      }
+      &-bottom {
+        padding: 10px 0;
+      }
+    }
+    .edit-body {
+      margin: 0 40px;
+      padding-top: 125px;
+    }
+    .edit-part-list {
+      margin-bottom: 15px;
+      box-shadow: 0px 15px 15px 0px rgba(212, 220, 243, 0.2);
+    }
+    .edit-part {
+      padding: 20px 0;
+
+      &.question-duplicate {
+        &::after {
+          width: 15px;
+        }
+      }
+    }
+    .edit-property {
+      width: 326px;
+      padding: 0 20px;
+    }
+    .edit-cont {
+      padding: 0 20px;
+    }
+    .edit-paper-question-subs {
+      padding-left: 60px;
+    }
+  }
+  // view-paper
+  .view-paper {
+    padding: 66px 40px 40px;
+
+    .view-header {
+      padding: 15px 40px;
+      height: 66px;
+    }
+    .view-body {
+      padding: 20px;
+    }
+    .view-title {
+      text-align: center;
+      margin-bottom: 15px;
+      .paper-title {
+        height: 40px;
+        font-size: 28px;
+        line-height: 40px;
+        margin-bottom: 5px;
+      }
+      .paper-title-sub {
+        margin-bottom: 5px;
+      }
+    }
+    .view-summary {
+      padding-bottom: 20px;
+    }
+    .view-seperator {
+      margin: 0 -20px;
+    }
+    .view-part {
+      padding: 20px 0;
+
+      &-action {
+        top: 20px;
+        right: 10px;
+      }
+      .paper-question-title {
+        margin-bottom: 5px;
+      }
+    }
+    .view-quesiton {
+      padding: 15px 20px;
+    }
+    .view-question-subs {
+      .view-part {
+        padding: 15px;
+      }
+    }
+  }
+
+  // customize element-ui
+  .side-dialog {
+    box-shadow: -15px 15px 15px 0px rgba(212, 220, 243, 0.3);
+    .el-dialog__header {
+      padding: 15px;
+      &::after {
+        left: 15px;
+        right: 15px;
+      }
+    }
+    .el-dialog__body {
+      top: 60px;
+      bottom: 66px;
+      padding: 15px;
+    }
+    .el-dialog__footer {
+      padding: 15px;
+    }
+  }
+  .action-dropdown {
+    padding: 0 15px;
+    .el-dropdown-menu__item {
+      line-height: 36px;
+    }
+  }
+}

src/assets/styles/element-ui-costom.scss

@@ -98,14 +98,6 @@
     }
   }
 }
-// el-form
-.el-form-linemess {
-  .el-form {
-    &-item {
-      margin-bottom: 5px;
-    }
-  }
-}
 // el-button
 .el-button--danger.is-plain,
 .el-button--success.is-plain,
@@ -198,7 +190,7 @@
   }
 }
 // .el-input-number
-.el-input-number--medium {
+.el-input-number {
   .el-input-number__increase,
   .el-input-number__decrease {
     height: 28px;
@@ -229,6 +221,11 @@
       font-weight: 500;
     }
   }
+  &.form-tight {
+    .el-form-item {
+      margin-bottom: 10px;
+    }
+  }
 }
 // .el-table
 .el-table {

src/assets/styles/home.scss

@@ -161,7 +161,7 @@
     font-weight: 600;
   }
   .el-submenu__icon-arrow {
-    right: 30px;
+    right: 40px;
   }
 }
 // link-title

src/assets/styles/index.scss

@@ -7,4 +7,4 @@
 @import "./login.scss";
 @import "./pages.scss";
 
-// @import "./adaptive.scss";
+@import "./adaptive.scss";

src/assets/styles/pages.scss

@@ -405,14 +405,14 @@
       font-size: 32px;
       font-weight: 500;
       line-height: 45px;
-      margin-bottom: 10;
+      margin-bottom: 10px;
     }
     .paper-title-sub {
       font-size: 16px;
       font-weight: 500;
       color: #9a9dab;
       line-height: 22px;
-      margin-bottom: 10;
+      margin-bottom: 10px;
     }
   }
   .view-summary {

src/modules/portal/views/home/Home.vue

@@ -65,7 +65,7 @@
             ref="passForm"
             :inline="true"
             inline-message
-            class="el-form-linemess"
+            class="form-tight"
             :model="passForm"
             :rules="passRules"
             label-position="right"
@@ -114,7 +114,7 @@
         ref="passWeakForm"
         :inline="true"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         :model="passWeakForm"
         :rules="passWeakRules"
         label-position="right"

src/modules/questions/views/ClientConfig.vue

@@ -9,7 +9,7 @@
             :inline="true"
             :model="viewForm"
             inline-message
-            class="el-form-linemess"
+            class="form-tight"
             label-position="right"
           >
             <el-row>

src/modules/questions/views/Course.vue

@@ -219,7 +219,7 @@
         ref="courseForm"
         :inline="true"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         :model="courseForm"
         :rules="rules"
         label-width="90px"
@@ -446,7 +446,7 @@
         ref="addRelationForm"
         :inline="true"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         :model="addRelationForm"
         :rules="addRelationRules"
       >

src/modules/questions/views/CourseProperty.vue

@@ -176,7 +176,7 @@
         label-position="right"
         label-width="90px"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
       >
         <el-form-item label="属性名称" prop="name">
           <el-input

src/modules/questions/views/EditOtherQuestion.vue

@@ -26,7 +26,7 @@
 
       <el-form
         ref="quesModel"
-        class="padding-tb-20"
+        class="padding-tb-20 form-tight"
         :model="quesModel"
         :rules="rules"
         label-position="right"
@@ -187,7 +187,7 @@
       </el-form>
     </div>
     <div class="part-box">
-      <el-form label-width="100px">
+      <el-form class="form-tight" label-width="100px">
         <!-- end -->
         <el-form-item label="题干" prop="quesBody">
           <ckeditor v-model="quesModel.quesBody"></ckeditor>

src/modules/questions/views/EditSelectQuestion.vue

@@ -26,7 +26,7 @@
       <!-- 正文信息 -->
       <el-form
         ref="quesModel"
-        class="padding-tb-20"
+        class="padding-tb-20 form-tight"
         :model="quesModel"
         :rules="rules"
         label-width="100px"
@@ -192,7 +192,7 @@
       </el-form>
     </div>
     <div class="part-box">
-      <el-form label-width="100px">
+      <el-form class="form-tight" label-width="100px">
         <el-form-item label="题干" prop="quesBody">
           <ckeditor v-model="quesModel.quesBody"></ckeditor>
         </el-form-item>

src/modules/questions/views/GenPaperDetail.vue

@@ -58,7 +58,7 @@
         <br />
       </el-form>
       <el-form>
-        <el-form-item label="组卷模式">
+        <el-form-item label="组卷模式" style="margin: 0">
           <el-radio-group
             v-model="genModelType"
             style="padding-left: 15px"

src/modules/questions/views/ImportPaper.vue

@@ -295,7 +295,7 @@
         label-position="right"
         label-width="120px"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
       >
         <el-form-item label="试卷名称" prop="paperName">
           <el-input

src/modules/questions/views/InsertBluePaperStructure.vue

@@ -155,7 +155,7 @@
         label-position="right"
         label-width="90px"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
       >
         <el-form-item label="大题名称" prop="name">
           <el-input

src/modules/questions/views/InsertPaperStructure.vue

@@ -137,7 +137,7 @@
         label-position="right"
         label-width="100px"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
       >
         <el-form-item label="大题名称" prop="name">
           <el-input

src/modules/questions/views/InsertPaperTitle.vue

@@ -4,7 +4,7 @@
     <div class="part-box">
       <h1 class="part-box-title">单体录入</h1>
       <el-form
-        class="padding-tb-20"
+        class="padding-tb-20 form-tight"
         :model="paperTitleForm"
         label-width="150px"
       >
@@ -110,7 +110,7 @@
         label-position="right"
         label-width="120px"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
       >
         <el-form-item label="试卷名称" label-width="120px" prop="name">
           <el-input

src/modules/questions/views/PropertyInfo.vue

@@ -127,7 +127,7 @@
         :inline="true"
         :rules="rules"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         label-width="100px"
       >
         <el-row>

src/modules/questions/views/School.vue

@@ -168,7 +168,7 @@
       <el-form
         ref="schoolForm"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         :model="schoolForm"
         :rules="rules"
         label-position="right"

src/modules/questions/views/data_previllege.vue

@@ -19,7 +19,7 @@
           :inline="true"
           :model="form"
           inline-message
-          class="el-form-linemess"
+          class="form-tight"
           label-position="left"
         >
           <el-form-item label="审核权限" label-width="120px">

src/modules/questions/views/user.vue

@@ -293,7 +293,7 @@
         ref="addingForm"
         :inline="true"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         :model="userForm"
         :rules="rules"
         label-position="right"
@@ -386,7 +386,7 @@
       <el-form
         ref="updateForm"
         inline-message
-        class="el-form-linemess"
+        class="form-tight"
         :model="userForm"
         :rules="rules"
         label-position="right"