Browse Source

统一样式

guanchunjie 3 years ago
parent
commit
d957f9f730

+ 20 - 42
src/components/Adult/common/SentenceModule.vue

@@ -1,11 +1,11 @@
 <!--  -->
 <template>
   <div class="Big-Book-SentenceModule" v-if="curQueItem">
-    <div class="Big-Book-top">
-      <span class="NPC-lable-80">序号</span>
+    <div class="adult-book-input-item">
+      <span class="adult-book-lable">序号:</span>
       <el-input
-        type="textarea"
-        autosize
+        size="small"
+        class="adult-book-input"
         placeholder="请输入序号"
         v-model="curQueItem.number"
         @blur="onBlur(curQueItem, 'number')"
@@ -22,51 +22,53 @@
     <div class="NPC-sentence-Segword">
       <SentenceSegwordChs :curQue="curQueItem.detail" />
     </div>
-    <div class="Big-Book-top" v-if="type == 'sentence_input'">
-      <span class="NPC-lable-80">答案</span>
+    <div class="adult-book-input-item" v-if="type == 'sentence_input'">
+      <span class="adult-book-lable">答案:</span>
       <div
         class="NPC-sentence-input-box"
         v-for="(ansItem, ansIndex) in curQueItem.answer"
         :key="'answer' + ansIndex"
       >
         <el-input
-          class="NPC-sentence-input"
+          class="adult-book-input"
           type="textarea"
           autosize
           placeholder="请输入答案"
           v-model="curQueItem.answer[ansIndex]"
           @blur="onBlurIndex(ansIndex, 'answer')"
         ></el-input>
-        <i class="el-icon-circle-close"></i>
+        <div class="adult-book-del-icon">
+          <i class="el-icon-circle-close"></i>
+        </div>
       </div>
     </div>
-    <div class="Big-Book-top" style="padding-left: 100px">
+    <div class="adult-book-input-item" style="padding-left: 80px">
       <el-button size="mini" type="primary" icon="el-icon-plus"
         >添加答案</el-button
       >
     </div>
-    <div class="Big-Book-top" v-if="type == 'sentence_judge'">
-      <span class="NPC-lable-80">判断:</span>
+    <div class="adult-book-input-item" v-if="type == 'sentence_judge'">
+      <span class="adult-book-lable">判断:</span>
       <el-radio v-model="curQueItem.judge" :label="true">正确</el-radio>
       <el-radio v-model="curQueItem.judge" :label="false">错误</el-radio>
     </div>
-    <div class="Big-Book-top" v-if="type == 'sentence_record'">
-      <span class="NPC-lable-80">录音组件:</span>
+    <div class="adult-book-input-item" v-if="type == 'sentence_record'">
+      <span class="adult-book-lable">录音组件:</span>
       <img src="../../../assets/adult/mini.png" alt="" />
     </div>
-    <div class="Big-Book-top" v-if="type == 'recordHZ_inputPY_chs'">
+    <div class="adult-book-input-item" v-if="type == 'recordHZ_inputPY_chs'">
       <span>录音</span>
       <el-radio v-model="curQueItem.IsRecord" :label="true">需要</el-radio>
       <el-radio v-model="curQueItem.IsRecord" :label="false">不需要</el-radio>
     </div>
     <div
-      class="Big-Book-top"
+      class="adult-book-input-item"
       v-if="type == 'recordHZ_inputPY_chs' && curQueItem.IsRecord"
     >
       <img src="../../../assets/adult/pro-plus.png" alt="" />
     </div>
-    <div class="Big-Book-top" v-if="type == 'inputItem_chs'">
-      <span class="NPC-lable-80">音频</span>
+    <div class="adult-book-input-item" v-if="type == 'inputItem_chs'">
+      <span class="adult-book-lable">音频</span>
       <Upload
         :changeFillId="changeMp3"
         :datafileList="fileCon.mp3_list"
@@ -240,9 +242,6 @@ export default {
     justify-content: flex-start;
     align-items: center;
     margin-top: 10px;
-    > span {
-      width: 50px;
-    }
     .deleteOptionBox {
       width: 40px;
       height: 33px;
@@ -254,22 +253,13 @@ export default {
         cursor: pointer;
       }
     }
-    .Big-Book-input {
-      display: flex;
-      justify-content: flex-start;
-      align-items: center;
-      > span {
-        line-height: 32px;
-        margin-right: 6px;
-      }
-    }
   }
 
   &-SentenceModule {
     // display: flex;
     // justify-content: flex-start;
     // align-items: center;
-    > .Big-Book-top {
+    > .adult-book-input-item {
       display: flex;
       justify-content: flex-start;
       align-items: center;
@@ -303,18 +293,6 @@ export default {
 }
 </style>
 <style lang="scss">
-.Big-Book-SentenceModule {
-  .el-textarea {
-    width: 400px;
-    // margin-right: 15px;
-  }
-}
-.Big-Book-input {
-  .el-textarea {
-    width: 160px;
-    // margin-right: 15px;
-  }
-}
 .NPC-sentence-input-box {
   .NPC-sentence-input {
     margin-right: 10px;

+ 4 - 3
src/components/Adult/common/SentenceSegwordChs/components/ClauseresultChs.vue

@@ -1,12 +1,13 @@
 <!-- 分句组件 -->
 <template>
   <div class="Big-Book-Maxwidth NPC-Clauseresult">
-    <div class="Big-Book-con-top">
-      <span class="Big-Book-left-text">句子:</span>
+    <div class="adult-book-input-item">
+      <span class="adult-book-lable">句子:</span>
     </div>
     <div class="NPC-sentence-list">
       <el-input
-        style="width: 85%;white-space:nowrap;"
+        style="white-space: nowrap"
+        class="adult-book-input"
         type="textarea"
         :autosize="{ minRows: 2 }"
         placeholder="请输入内容"

+ 6 - 5
src/components/Adult/common/SentenceSegwordChs/components/SegbywordChs.vue

@@ -1,12 +1,13 @@
 <!-- 分句组件 -->
 <template>
   <div class="Big-Book-Maxwidth NPC-Clauseresult">
-    <div class="Big-Book-con-top">
-      <span class="Big-Book-left-text NPC-lable-80">分词结果:</span>
+    <div class="adult-book-input-item">
+      <span class="adult-book-lable">分词结果:</span>
     </div>
     <div class="NPC-para-list">
       <div class="NPC-sentence-list">
         <el-input
+          class="adult-book-input"
           type="textarea"
           :autosize="{ minRows: 2 }"
           placeholder="请输入内容"
@@ -28,7 +29,7 @@
     >
       <div class="NPC-words" v-if="curQue">
         <div class="NPC-words-box">
-          <span class="Big-Book-left-text NPC-lable-80">原句:</span>
+          <span class="adult-book-lable">原句:</span>
           <el-input
             type="textarea"
             :autosize="{ minRows: 1 }"
@@ -38,7 +39,7 @@
           ></el-input>
         </div>
         <div class="NPC-words-box">
-          <span class="Big-Book-left-text NPC-lable-80">分词:</span>
+          <span class="adult-book-lable">分词:</span>
           <el-input
             type="textarea"
             :autosize="{ minRows: 1 }"
@@ -55,7 +56,7 @@
         </div>
         <template>
           <div class="NPC-words-box">
-            <span class="Big-Book-left-text NPC-lable-80">校对拼音:</span>
+            <span class="adult-book-lable">校对拼音:</span>
             <div class="NPC-words-list">
               <el-table :data="curQue.wordsList" border style="width: 400px">
                 <el-table-column prop="chs" label="词" width="180">

+ 2 - 7
src/components/Adult/common/SentenceSegwordChs/index.vue

@@ -5,8 +5,8 @@
     v-if="curQue"
     v-loading="loading"
   >
-    <div class="NPC-Book-model">
-      <span class="Big-Book-left-text NPC-lable-80">拼音位置:</span>
+    <div class="adult-book-input-item">
+      <span class="adult-book-lable">拼音位置:</span>
       <el-radio-group v-model="curQue.pyPosition">
         <el-radio :label="'top'">字上面</el-radio>
         <el-radio :label="'bottom'">字下面</el-radio>
@@ -145,11 +145,6 @@ p {
     }
   }
 }
-.NPC-Book-Article {
-  > div {
-    margin-bottom: 16px;
-  }
-}
 .NPC-Book-model {
   display: flex;
   justify-content: flex-start;

+ 3 - 2
src/components/Adult/inputModules/Sentence.vue

@@ -5,9 +5,10 @@
       class="Big-Book-Single-content"
       style="margin-left: 20px; margin-top: 20px"
     >
-      <div class="Big-Book-con">
-        <span class="NPC-lable-80">标题</span>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">标题:</span>
         <el-input
+          class="adult-book-input"
           type="textarea"
           autosize
           placeholder="请输入标题"

+ 17 - 1
src/styles/index.scss

@@ -214,19 +214,35 @@ input:-ms-input-placeholder {
     justify-content: center;
     align-items: flex-start;
   }
+  .adult-book-input-item{
+    display: flex;
+    justify-content: flex-start;
+    align-items: flex-start;
+    margin-bottom: 10px;
+  }
   .adult-book-lable{
     width: 70px;
     font-size: 14px;
     display: block;
+    text-align: right;
+    margin-right:8px;
+    line-height: 32px;
   }
   .adult-book-input{
     width:500px;
     margin-right: 10px;
   }
+  .el-radio-group{
+    padding: 8px 0;
+  }
+  .adult-book-del-icon{
+    padding:8px;
+    cursor: pointer;
+  }
 }
 
 .adult-book-preview-sty{
-
+   
 }
 //新实用汉语
 .adult-book-NPC{

+ 1 - 8
src/views/adultInput.vue

@@ -1,6 +1,6 @@
 <!--  -->
 <template>
-  <div class="Big-Book-container NPC-Book-input-Sty">
+  <div class="Big-Book-container adult-book-input-sty">
     <Header />
     <div class="Big-Book-content">
       <div class="content-tree">
@@ -998,11 +998,4 @@ export default {
     }
   }
 }
-</style>
-<style lang="scss">
-.NPC-Book-input-Sty {
-  .NPC-lable-80 {
-    width: 80px;
-  }
-}
 </style>