Browse Source

连线分词增加字体 句子拆分输入对齐方式 生词强制换行 输入框左右padding

natasha 2 years ago
parent
commit
9df9d415c7

+ 0 - 3
src/components/Adult/common/SegwordConfig.vue

@@ -8,7 +8,6 @@
         type != 'sentence_segtemp_chs' &&
         type != 'sort_chs' &&
         type != 'CourseStart_chs' &&
-        type != 'ligature_chs' && 
         type != 'sentence_listen_read_chs'
       "
       style="margin-top: 10px"
@@ -32,7 +31,6 @@
         type != 'sentence_segtemp_chs' &&
         type != 'sort_chs' &&
         type != 'CourseStart_chs' &&
-        type != 'ligature_chs' && 
         type != 'sentence_listen_read_chs'
       "
     >
@@ -84,7 +82,6 @@
         v-if="
           type != 'sort_chs' &&
           type != 'CourseStart_chs' &&
-          type != 'ligature_chs'&& 
           type != 'sentence_listen_read_chs'
         "
       >

+ 10 - 0
src/components/Adult/common/SentenceSegTemp.vue

@@ -143,6 +143,15 @@
             </el-checkbox>
           </el-checkbox-group>
         </div>
+        <div class="adult-book-input-item">
+          <span class="adult-book-lable">输入内容:</span>
+          <el-radio-group v-model="dItem.config.conAlign"
+            >     
+            <el-radio label="left">左对齐</el-radio>
+            <el-radio label="center">居中对齐</el-radio>
+            <el-radio label="right">右对齐</el-radio>
+          </el-radio-group>
+        </div>
       </template>
     </div>
     <el-button @click="addElement()" style="margin-bottom: 10px"
@@ -330,6 +339,7 @@ export default {
           fontColor: "#000",
           fontFamily: "FZJCGFKTK",
           wordPadding: [],
+          conAlign: 'left'
         },
       };
       this.detail.detail.push(JSON.parse(JSON.stringify(obj)));

+ 14 - 0
src/components/Adult/inputModules/Neword.vue

@@ -45,6 +45,16 @@
               
       </div>
       <div class="adult-book-input-item">
+        <span class="adult-book-lable">汉字换行:</span>  
+        <div class="adult-book-main">
+          <el-radio-group v-model="curQue.whiteSpace">
+            <el-radio :label="true">是</el-radio>
+            <el-radio :label="false">否</el-radio> </el-radio-group
+          >  
+        </div>
+              
+      </div>
+      <div class="adult-book-input-item">
         <span class="adult-book-lable">题目音频:</span>
         <Upload
           :changeFillId="changeMp3"
@@ -163,6 +173,7 @@ export default {
         title: "",
         isInfor: true,
         isWordShow: true,
+        whiteSpace: false,
         titleBg: "themeColor", //标题背景颜色
         mp3_list: [],
         lrc_list: [],
@@ -397,6 +408,9 @@ export default {
       if (!this.curQue.hasOwnProperty("isWordShow")) {
         this.$set(this.curQue, "isWordShow", true);
       }
+      if (!this.curQue.hasOwnProperty("whiteSpace")) {
+        this.$set(this.curQue, "whiteSpace", false);
+      }
       if (!this.curQue.hasOwnProperty("titleBg")) {
         this.$set(this.curQue, "titleBg", "themeColor");
       }

+ 2 - 0
src/components/Adult/inputModules/SentenceModule.vue

@@ -1274,6 +1274,8 @@ export default {
       float: left;
       &.dleft {
         padding-left: 4px;
+      }
+      &.dright{
         padding-right: 4px;
       }
     }

+ 2 - 0
src/components/Adult/inputModules/SentenceMulModule.vue

@@ -1323,6 +1323,8 @@ export default {
       float: left;
       &.dleft {
         padding-left: 4px;
+      }
+      &.dright{
         padding-right: 4px;
       }
     }

+ 1 - 0
src/components/Adult/preview/EditDiv.vue

@@ -292,6 +292,7 @@ export default {
   user-select: text;
   white-space: pre-wrap;
   text-align: left;
+  padding: 0 4px;
   &[contenteditable="true"] {
     user-modify: read-write-plaintext-only;
     &:empty:before {

+ 78 - 20
src/components/Adult/preview/Ligature.vue

@@ -64,22 +64,42 @@
                           {{ it.pinyin }}
                         </p>
                         <p
-                          style="
-                            font-family: 'FZJCGFKTK';
-                            font-size: 20px;
-                            line-height: 150%;
-                          "
+                          :style="{
+                            fontSize: it.fontSize? it.fontSize: '20px',
+                            color: it.fontColor?it.fontColor:'#606266',
+                            fontFamily: it.fontFamily?it.fontFamily:'FZJCGFKTK',
+                            'line-height':'150%'
+                          }"
+                          :class="[
+                            it.wordPadding.indexOf('left') > -1
+                            ? 'dleft'
+                            : '',
+                            it.wordPadding.indexOf('right') > -1
+                            ? 'dright'
+                            : '',
+                            it.underLine ? 'underline' : ''
+                          ]"
                         >
                           {{ it.chs }}
                         </p>
                       </template>
                       <template v-else>
                         <p
-                          style="
-                            font-family: 'FZJCGFKTK';
-                            font-size: 20px;
-                            line-height: 150%;
-                          "
+                          :style="{
+                            fontSize: it.fontSize? it.fontSize: '20px',
+                            color: it.fontColor?it.fontColor:'#606266',
+                            fontFamily: it.fontFamily?it.fontFamily:'FZJCGFKTK',
+                            'line-height':'150%'
+                          }"
+                          :class="[
+                            it.wordPadding.indexOf('left') > -1
+                            ? 'dleft'
+                            : '',
+                            it.wordPadding.indexOf('right') > -1
+                            ? 'dright'
+                            : '',
+                            it.underLine ? 'underline' : ''
+                          ]"
                         >
                           {{ it.chs }}
                         </p>
@@ -185,22 +205,42 @@
                           {{ it.pinyin }}
                         </p>
                         <p
-                          style="
-                            font-family: 'FZJCGFKTK';
-                            font-size: 20px;
-                            line-height: 150%;
-                          "
+                          :style="{
+                            fontSize: it.fontSize? it.fontSize: '20px',
+                            color: it.fontColor?it.fontColor:'#606266',
+                            fontFamily: it.fontFamily?it.fontFamily:'FZJCGFKTK',
+                            'line-height':'150%'
+                          }"
+                          :class="[
+                            it.wordPadding.indexOf('left') > -1
+                            ? 'dleft'
+                            : '',
+                            it.wordPadding.indexOf('right') > -1
+                            ? 'dright'
+                            : '',
+                            it.underLine ? 'underline' : ''
+                          ]"
                         >
                           {{ it.chs }}
                         </p>
                       </template>
                       <template v-else>
                         <p
-                          style="
-                            font-family: 'FZJCGFKTK';
-                            font-size: 20px;
-                            line-height: 150%;
-                          "
+                          :style="{
+                            fontSize: it.fontSize? it.fontSize: '20px',
+                            color: it.fontColor?it.fontColor:'#606266',
+                            fontFamily: it.fontFamily?it.fontFamily:'FZJCGFKTK',
+                            'line-height':'150%'
+                          }"
+                          :class="[
+                            it.wordPadding.indexOf('left') > -1
+                            ? 'dleft'
+                            : '',
+                            it.wordPadding.indexOf('right') > -1
+                            ? 'dright'
+                            : '',
+                            it.underLine ? 'underline' : '',
+                          ]"
                         >
                           {{ it.chs }}
                         </p>
@@ -861,6 +901,15 @@ export default {
               word-break: break-word;
               p {
                 margin: 0;
+                &.dleft {
+                    padding-left: 4px;
+                }
+                &.dright{
+                    padding-right: 4px;
+                }
+                &.underline{
+                    text-decoration: underline;
+                }
               }
             }
           }
@@ -940,6 +989,15 @@ export default {
               word-break: break-word;
               p {
                 margin: 0;
+                &.dleft {
+                    padding-left: 4px;
+                }
+                &.dright{
+                    padding-right: 4px;
+                }
+                &.underline{
+                    text-decoration: underline;
+                }
               }
             }
           }

+ 6 - 0
src/components/Adult/preview/WordPhrase.vue

@@ -135,6 +135,7 @@
                       sItem.motif_color
                         ? 'NPC-word-tab-word-' + themeColor
                         : '',
+                      curQue.whiteSpace?'NPC-word-tab-word-break':''
                     ]"
                   >
                     {{ sItem.new_word }}
@@ -176,6 +177,7 @@
                   class="NPC-word-tab-common NPC-word-tab-word"
                   :class="[
                     sItem.motif_color ? 'NPC-word-tab-word-' + themeColor : '',
+                    curQue.whiteSpace?'NPC-word-tab-word-break':''
                   ]"
                 >
                   {{ sItem.new_word }}
@@ -614,6 +616,10 @@ export default {
         &.NPC-word-tab-word-brown {
           color: #bd8865;
         }
+        &-break{
+            white-space: normal;
+            word-break: break-word;
+        }
       }
       .NPC-word-tab-cixing {
         font-family: "robot";

+ 6 - 0
src/components/Adult/preview/components/OneSentenceTemp.vue

@@ -94,6 +94,7 @@
                             : 'left',
                           fontFamily: pItem.fontFamily,
                         }"
+                        :textAlign="detail.config.conAlign?detail.config.conAlign:'left'"
                       />
                     </template>
                     <template v-else>
@@ -132,6 +133,7 @@
                             : 'left',
                           fontFamily: pItem.fontFamily,
                         }"
+                        :textAlign="detail.config.conAlign?detail.config.conAlign:'left'"
                       />
                     </template>
                   </template>
@@ -189,6 +191,7 @@
                       }"
                       @saveBlankTF="saveBlankTF"
                       :hengIndex="pItem.hengIndex"
+                      :textAlign="detail.config.conAlign?detail.config.conAlign:'left'"
                     />
                   </template>
                 </template>
@@ -379,6 +382,7 @@
                         textAlign: detail.hengList[pIndex] ? 'center' : 'left',
                         fontFamily: pItem.fontFamily,
                       }"
+                      :textAlign="detail.config.conAlign?detail.config.conAlign:'left'"
                     />
                   </template>
                   <template v-else>
@@ -413,6 +417,7 @@
                         textAlign: detail.hengList[pIndex] ? 'center' : 'left',
                         fontFamily: pItem.fontFamily,
                       }"
+                      :textAlign="detail.config.conAlign?detail.config.conAlign:'left'"
                     />
                   </template>
                 </template>
@@ -469,6 +474,7 @@
                     }"
                     @saveBlankTF="saveBlankTF"
                     :hengIndex="pItem.hengIndex"
+                    :textAlign="detail.config.conAlign?detail.config.conAlign:'left'"
                   />
                 </template>
               </template>