修改 校对样式及 对话文章增加校对句子和文字

src/components/Adult/inputModules/ArticleTemChs/components/CompareTime.vue

@@ -1,69 +1,64 @@
 <template>
   <div class="CompareTime">
-    <div
-      :class="['sentence']"
-      v-for="(item, index) in data"
-      :key="index + 'sen'"
-    >
-      <div>{{ item.onebest }}</div>
-      <div class="time" v-if="type == '句子'">
-        <span>开始时间：</span>
-        <el-input
-          style="width: 100px"
-          v-model="item.bg"
-          placeholder="开始时间"
-          @change="changeTime(item)"
-        ></el-input
-        >~
-        <span>结束时间：</span>
-        <el-input
-          style="width: 100px"
-          v-model="item.ed"
-          placeholder="结束时间"
-          @change="changeTime(item)"
-        ></el-input>
-      </div>
-      <div class="time" v-else>
-        <el-button
-          style="margin-top: 15px"
-          type="primary"
-          @click="compareOneHZ(index)"
-          size="medium"
-          >校对文字字幕时间</el-button
-        >
-      </div>
-    </div>
+    <template v-if="type == '句子'">
+      <table>
+        <tr>
+          <th style="width: 280px">句子</th>
+          <th style="width: 200px">开始时间</th>
+          <th style="width: 200px">结束时间</th>
+        </tr>
+        <tr v-for="(item, index) in data" :key="index + 'sen'">
+          <td>{{ item.onebest }}</td>
+          <td>
+            <input v-model="item.bg" @change="changeTime(item)" type="text" />
+          </td>
+          <td>
+            <input v-model="item.ed" @change="changeTime(item)" type="text" />
+          </td>
+        </tr>
+      </table>
+    </template>
+    <template v-else>
+      <table>
+        <tr>
+          <th style="width: 280px">句子</th>
+          <th style="width: 200px">操作</th>
+        </tr>
+        <tr v-for="(item, index) in data" :key="index + 'sen'">
+          <td>{{ item.onebest }}</td>
+          <td>
+            <el-button type="primary" @click="compareOneHZ(index)" size="medium"
+              >校对文字字幕时间</el-button
+            >
+          </td>
+        </tr>
+      </table>
+    </template>
     <template v-if="wordData">
       <el-dialog
         title="校对字母时间"
         :visible.sync="oneHZshow"
-        width="50%"
+        width="60%"
         :before-close="handleClose"
         :modal="false"
         top="0"
       >
-        <div
-          :class="['sentence']"
-          v-for="(item, index) in wordData"
-          :key="index + 'wordsResul'"
-        >
-          <div class="time">
-            <div>{{ item.wordsName?item.wordsName:item.onebest }}</div>
-            <span>开始时间：</span>
-            <el-input
-              style="width: 100px"
-              v-model="item.wordBg"
-              placeholder="开始时间"
-            ></el-input
-            >~
-            <span>结束时间：</span>
-            <el-input
-              style="width: 100px"
-              v-model="item.wordEd"
-              placeholder="结束时间"
-            ></el-input>
-          </div>
-        </div>
+        <table>
+          <tr>
+            <th style="width: 250px">文字</th>
+            <th style="width: 200px">开始时间</th>
+            <th style="width: 200px">结束时间</th>
+          </tr>
+          <tr v-for="(item, index) in wordData" :key="index + 'wordsResul'">
+            <td>{{ item.wordsName ? item.wordsName : item.onebest }}</td>
+            <td>
+              <input v-model="item.wordBg" type="text" />
+            </td>
+            <td>
+              <input v-model="item.wordEd" type="text" />
+            </td>
+          </tr>
+        </table>
         <span slot="footer" class="dialog-footer">
           <el-button @click="handleClose">取 消</el-button>
           <el-button :loading="compareloading" type="primary" @click="savehz"
@@ -103,7 +98,9 @@ export default {
     },
     compareOneHZ(index) {
       this.index = index;
-      this.wordData =JSON.parse(JSON.stringify(this.data[index].wordsResultList));
+      this.wordData = JSON.parse(
+        JSON.stringify(this.data[index].wordsResultList)
+      );
       this.oneHZshow = true;
     },
     savehz() {
@@ -111,7 +108,7 @@ export default {
         JSON.stringify(this.wordData)
       );
       this.changewordsResultList(this.index, this.wordData);
-      this.$message.success("保存成功")
+      this.$message.success("保存成功");
     },
     handleClose() {
       this.index = null;
@@ -150,5 +147,28 @@ export default {
       margin-top: 15px;
     }
   }
+  table {
+    border-collapse: collapse;
+    tr {
+      > :nth-child(2) {
+        text-align: center;
+      }
+      > :nth-child(3) {
+        text-align: center;
+      }
+      td {
+        border: 1px solid black;
+        height: 50px;
+        input {
+          border: none;
+          outline: none;
+        }
+      }
+      th {
+        height: 50px;
+        border: 1px solid black;
+      }
+    }
+  }
 }
 </style>

src/components/Adult/inputModules/ArticleTemChs/index.vue

@@ -129,10 +129,11 @@
       </span>
     </el-dialog>
     <el-dialog
-      title="校对字母时间"
+      title="校对字幕时间"
       :visible.sync="compareShow"
       width="50%"
       :before-close="handleClose"
+      top="0"
     >
       <CompareTime
         :data="compareData"

src/components/Adult/inputModules/DialogueArticleChs/index.vue

@@ -152,6 +152,12 @@
       >
         <span>已有字幕时间节点</span>
         <el-button type="text" @click="againWordTime">重新生成</el-button>
+        <el-button @click="compareTime('句子')" size="medium"
+          >校对句子字幕时间</el-button
+        >
+        <el-button @click="compareTime('文字')" size="medium"
+          >校对文字字幕时间</el-button
+        >
       </div>
       <template v-else>
         <el-button v-if="!isWordTime" size="medium" @click="createWordTime"
@@ -190,6 +196,25 @@
         <el-button type="primary" @click="saveRoleList">保 存</el-button>
       </span>
     </el-dialog>
+    <el-dialog
+      title="校对字幕时间"
+      :visible.sync="compareShow"
+      width="50%"
+      :before-close="handleClose"
+      top="0"
+    >
+      <CompareTime
+        :data="compareData"
+        :type="compareType"
+        :changewordsResultList="changewordsResultList"
+      />
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button :loading="compareloading" type="primary" @click="saveCompare"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -200,6 +225,7 @@ import {
   createPinyin,
   prepareTranscribe,
   getWordTime,
+  compareSenTenceTime,
 } from "@/api/ajax";
 const Base64 = require("js-base64").Base64;
 import Upload from "../../common/Upload.vue";
@@ -210,6 +236,7 @@ import Clauseresult from "./components/ClauseresultChs.vue";
 import Segbyword from "./components/SegbywordChs.vue";
 import Createtimelist from "./components/CreatetimelistChs.vue";
 import RoleChs from "./components/RoleChs.vue";
+import CompareTime from "../ArticleTemChs/components/CompareTime.vue";
 
 export default {
   name: "DialogueAnswerChs",
@@ -222,6 +249,7 @@ export default {
     Segbyword,
     Createtimelist,
     RoleChs,
+    CompareTime,
   },
   props: ["curQue", "changeCurQue", "tmIndex"],
   filters: {
@@ -283,12 +311,45 @@ export default {
         checkList: [1, 2, 3],
       },
       isWordTime: false,
+      compareType: "", //校对类型
+      compareShow: false,
+      compareData: null,
+      compareloading: false,
     };
   },
   computed: {},
   watch: {},
   //方法集合
   methods: {
+    // 保存校对
+    saveCompare() {
+      this.compareloading = true;
+      compareSenTenceTime({ matchList: JSON.stringify(this.compareData) }).then(
+        (res) => {
+          console.log(res);
+          this.compareloading = false;
+          this.curQue.wordTime = res.data.result;
+        }
+      );
+    },
+    // 校对时间
+    compareTime(type) {
+      this.compareType = type;
+      this.compareData = JSON.parse(JSON.stringify(this.curQue.wordTime));
+      this.compareShow = true;
+    },
+    handleClose() {
+      this.compareShow = false;
+      this.compareData = null;
+      this.compareType = "";
+    },
+    // 校对每个字的时间
+    changewordsResultList(index, item) {
+      this.curQue.wordTime[index].wordsResultList = JSON.parse(
+        JSON.stringify(item)
+      );
+    },
+
     onBlur(item, field) {
       item[field] = item[field] ? item[field].trim() : "";
     },