init

src/api/modules/http.js

@@ -795,3 +795,23 @@ export function findText(query) {
   })
 }
 
+
+
+// 文本优化
+export function saveText(obj) {
+  return request({
+    url: 'autoSR/zk/text/saveText',
+    method: 'post',
+    data: obj
+  })
+}
+
+// 搜索
+export function keyWordsMatching(obj) {
+  return request({
+    url: 'autoSR/customer/keyWordsMatching',
+    method: 'post',
+    data: obj
+  })
+}
+

src/views/Receive/index.vue

@@ -65,7 +65,7 @@
           <div class="zuo-titbox">
             <div class="searchbox">
               <div style="flex:1;">
-                <div style="width:96%;display: flex;margin:0 auto;">
+                <div style="width:96%;display: flex;margin:0 auto;" @click="searchtab()">
                   <div class="input" >请输入关键词</div>
                   <div class="input2">搜索</div>
                 </div>
@@ -482,7 +482,7 @@
   <div v-if="dialogFormtext" @click="dialogFormtext=false" id="zhezhao"></div>
 	<div v-if="dialogFormtext" class="auDivhhh">
 		<div style="width: 100%;height: 50px;line-height: 50px;text-align: center;font-size: 20px;font-weight: 400;">文本优化</div>
-		<div class="center2" style="width: 95%;margin: 0 auto;border:1px solid #e3e3e3;height: 430px;overflow-y: scroll;">
+		<div class="center3" style="width: 95%;margin: 0 auto;border:1px solid #e3e3e3;height: 430px;overflow-y: scroll;">
 			<div class="text" :data-bg="item.bg" :data-ed="item.ed"
 				 v-for="(item,index) in optimizetext" :key="index" :data-speaker="item.speaker">
 				<div class="buttonzu">
@@ -569,6 +569,63 @@
 		</div>
 	</div>
 
+
+      <el-dialog title="纠正文本" :visible.sync="texteditorishow" center width="600px" :close-on-click-modal="false">
+        <div>
+            <span>错误内容：</span>
+			<span v-html="textareacuowu"></span>
+        </div>
+        <div style="margin-top: 10px;">
+            <div>纠正内容：</div>
+			<div style="margin-top: 6px;">
+				<el-input
+						type="textarea"
+						:rows="2"
+						placeholder="请输入内容"
+						v-model="textarea">
+				</el-input>
+			</div>
+        </div>
+        <div slot="footer" class="dialog-footer">
+            <el-button @click="texteditorishow=false">取消</el-button>
+            <el-button type="primary" @click="summunct()">确认</el-button>
+        </div>
+    </el-dialog>
+
+
+    <el-dialog title="搜索" :visible.sync="searchisshow" center width="500px"   :close-on-click-modal="false">
+    <div style="width:100%;display: flex;height:32px;">
+      <div style="width: 75%;height:100%;">
+        <input @input="tabinput()" v-model="inputtest" class="inputclass" type="text" placeholder="请输入搜索内容">
+      </div>
+      <div style="width: 25%;height:100%;">
+        <div class="inputclass2" style="margin:0 auto;">搜索</div>
+      </div>
+    </div>
+    <div style="height:400px;width:100%;overflow: auto;padding: 15px;">
+      <div class="searchbox54" v-for="(item,index) in Searchcontent" @click="tabseek(item)" :key="index" style="cursor:pointer">
+				<div >
+				<div class="avatar">
+          <div v-if="item.speaker == 1" style="color: #4F861E">A</div>
+          <div v-if="item.speaker == 2" style="color: #4F861E">B</div>
+					<div v-if="item.speaker == 3" style="color: #4F861E">C</div>
+					<div v-if="item.speaker == 4" style="color: #60CBEC">D</div>
+					<div v-if="item.speaker == 5" style="color: #EC8B47">E</div>
+					<div v-if="item.speaker == 6" style="color: #9F61C8">F</div>
+					<div v-if="item.speaker == 7" style="color: #4980C8">G</div>
+				</div>
+				</div>
+				<div>
+					<div style="font-size: 14px;">{{formatTime(item.transferContent.bg)}}</div>
+					<div style="padding-top: 4px;font-size: 14px;" v-html="item.text"></div>
+				</div>
+			</div>
+    </div>
+		<div slot="footer" class="dialog-footer">
+			<el-button @click="searchisshow=false">取 消</el-button>
+		</div>
+	</el-dialog>
+
   </div>
 </template>
 
@@ -582,6 +639,8 @@ export default {
       dialogFormVisible11:false,
       dialogFormVisible12:false,
       dialogFormVisible13:false,
+      texteditorishow:false,
+      searchisshow:false,
       effectiveindex:1,
       effectiveitext:'',
       form:{
@@ -626,7 +685,14 @@ export default {
 			textItself:'',//原词内容
       Acquirecustomerintentlist2:[],//校准列表
       dialogFormtext:false,
-      optimizetext:[]
+      optimizetext:[],//文本优化list
+      optimizeobj:{},//文本优化obj
+      textarea:'',
+			textareacuowu:'',
+			textareaindex:0,
+      Searchcontent:[],
+      inputtest:'',
+
     };
   },
   mounted() {
@@ -635,9 +701,129 @@ export default {
     this.init()
   },
   methods: {
+    	//点击播放
+			tabseek(item){
+				this.centerindex=0;
+				let num = parseInt(item.transferContent.bg / 1000)
+				if(item.corpusId==this.arr[this.aplayerId].id){
+					this.aplayer.seek(num)
+				}else{
+          let idx=this.arr.findIndex(item1=>item1.id==item.corpusId)
+					if(idx==-1){
+						this.$message('没有此条录音信息')
+					}else{
+						this.aplayerId=idx
+						this.aplayer.destroy()
+						console.log(idx)
+						this.transcriptionlist=JSON.parse(this.arr[idx].audioContent)
+						this.recordPath=this.arr[idx].recordPath
+						this.bofangchushihua()
+						this.$nextTick(()=>{
+							this.aplayer.audio.currentTime=num
+						})
+					}
+				}
+        this.searchisshow=false;
+				this.aplayer.play()
+			},
+    //点击搜索
+    searchtab(){
+      this.inputtest='';
+      this.Searchcontent=[];
+      this.searchisshow=true;
+    },
+    tabinput(){
+      if(this.inputtest==''){
+          return
+      }else {
+          this.Searchcontent=[];
+          this.$api.http.keyWordsMatching({
+            keyword:this.inputtest,
+            customerId:this.fileId
+          }).then((res) => {
+            let list=res.data;
+            // JSON.parse();
+            list.map(item=>{
+               item.transferContent=JSON.parse(item.transferContent)
+
+              item.text=this.brightKeyword(item.transferContent.onebest)
+            })
+            this.Searchcontent=list;
+          })
+      }
+    },
+    	//替换方法
+			brightKeyword(val) {
+				if (val.indexOf(this.inputtest) !== -1) {
+					return val.replace(this.inputtest,	"<text style='color: red'>"+this.inputtest+"</text>");
+				} else {
+					return val;
+				}
+			},
+    //文本恢复
+    textrestore(){
+       this.optimizeobj=[];
+       this.optimizetext={};
+       this.$api.http.findText({corpusId:this.arr[this.aplayerId].id}).then((res) => {
+         this.optimizeobj=res.data;
+         this.optimizetext=JSON.parse(res.data.textContent)
+       })
+    },
+    //保存并更新文本 保存草稿
+    savedraft(i){
+        this.$api.http.saveText({
+          	saveType:i,
+						corpusId:this.arr[this.aplayerId].id,
+						id:this.optimizeobj.id,
+						textContent:JSON.stringify(this.optimizetext)
+        }).then((res) => {
+            this.dialogFormtext=false;
+						this.$message.success('优化完成')
+						if(i==1){
+							this.init()
+						}
+        })
+			},
+    //文本编辑确认
+    	summunct(){
+				this.optimizetext[this.textareaindex].onebest=this.textarea;
+				this.texteditorishow=false;
+			},
+    //文本编辑
+    texteditor(item,index){
+      this.textarea='';
+      this.textareaindex=index;
+      this.textareacuowu=item.onebest;
+      this.texteditorishow=true;
+    },
+    //文本优化删除
+    optimdel(i){
+        console.log(i)
+        var that=this;
+        this.$confirm('此操作将删除该条, 是否继续?', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+        }).then(() => {
+            that.optimizetext.splice(i,1)
+            this.$message({
+                type: 'success',
+                message: '删除成功!'
+            });
+        }).catch(() => {
+            this.$message({
+                type: 'info',
+                message: '已取消删除'
+            });
+        });
+    },
+    //获取文本
     texttap(){
+      this.optimizeobj=[];
+       this.optimizetext={};
        this.$api.http.findText({corpusId:this.arr[this.aplayerId].id}).then((res) => {
-         console.log(res)
+         this.optimizeobj=res.data;
+         this.optimizetext=JSON.parse(res.data.textContent)
            this.dialogFormtext=true;
        })
     },
@@ -1125,12 +1311,23 @@ export default {
 						$(this).removeClass("activecoloc")
 					}
 				});
-			},
-      	//倍速更改
-			aplayerSpeed(num){
-				this.aplayer.audio.playbackRate=num
-				this.aplayerSpeedNum=num
-			},
+		},
+    //倍速更改
+    aplayerSpeed(num){
+      this.aplayer.audio.playbackRate=num
+      this.aplayerSpeedNum=num
+    },
+    //格式化时间
+    formatTime(num) {
+      num = parseInt(num / 1000)
+      //格式化时间格式
+      num = num.toFixed(0);
+      let second = num % 60;
+      if (second < 10) second = '0' + second;
+      let min = Math.floor(num / 60);
+      if (min < 10) min = '0' + min;
+      return min + ":" + second;
+    },
       //下载
 			download(){
         //  this.$api.http.filedownload({videoSrc:this.recordPath}).then((res) => {
@@ -1153,7 +1350,24 @@ export default {
   padding-bottom: 100px;
   background: #FFFFFF;
 }
-
+.inputclass{
+  width: 100%;
+  height: 32px;
+  line-height: 32px;
+  background: #FFFFFF;
+  border-radius: 2px 0px 0px 2px;
+  text-indent: 6px;
+  border: 1px solid #E0E0E0;
+}
+.inputclass2{
+  width: 70px;
+  height: 32px;
+  line-height: 32px;
+  background: #2671E2;
+  border-radius:4px 4px 4px 4px;
+  color: #FFFFFF;
+  text-align: center;
+}
 
 // 播放
 .center2{
@@ -1161,54 +1375,97 @@ export default {
   padding-right: 10px;
 }
 .text {
-			 width: 100%;
-			 font-size: 12px;
-			 line-height: 20px;
-			 display: flex;
-			 align-items: center;
-			 margin:18px 0px;
-			 position: relative;
-		}
-		.text[data-speaker="2"],
-		.text[data-speaker="4"],
-		.text[data-speaker="6"] {
-			flex-direction: row-reverse;
-			text-align: left;
-		}
-		.content123 div{
-			color:#ffffff;
-			font-size:14px;
-			padding:5px 14px;
-			background:#3ca953;
-			border-radius:8px;
-			margin: 0 12px;
-			line-height: 1.5;
-			max-width: 365px;
-		}
-		 .text[data-speaker="2"].activecoloc .content123 div,
-		 .text[data-speaker="4"].activecoloc .content123 div,
-		 .text[data-speaker="6"].activecoloc .content123 div{
-			 color: #FF7538;
-		 }
-     .activecoloc .content123 div{
-			 color:#38FFF1;
-		 }
-		 .center2 .text .avatar{
-			 width: 34px;
-			 height:34px;
+      width: 100%;
+      font-size: 12px;
+      line-height: 20px;
+      display: flex;
+      align-items: center;
+      margin:18px 0px;
+      position: relative;
+  }
+  .text[data-speaker="2"],
+  .text[data-speaker="4"],
+  .text[data-speaker="6"] {
+    flex-direction: row-reverse;
+    text-align: left;
+  }
+  .content123 div{
+    color:#ffffff;
+    font-size:14px;
+    padding:5px 14px;
+    background:#3ca953;
+    border-radius:8px;
+    margin: 0 12px;
+    line-height: 1.5;
+    max-width: 365px;
+  }
+    .text[data-speaker="2"].activecoloc .content123 div,
+    .text[data-speaker="4"].activecoloc .content123 div,
+    .text[data-speaker="6"].activecoloc .content123 div{
+      color: #FF7538;
+    }
+    .activecoloc .content123 div{
+      color:#38FFF1;
+    }
+    .center2 .text .avatar{
+      width: 34px;
+      height:34px;
+      background-color: #ccc;
+      border-radius: 50%;
+    //  margin-left: 15px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+    .center2 .text .avatar img{
+      width: 28px;
+      height:28px;
+      display: block;
+    }
+    .center2 .text .avatar div{
+      width: 100%;
+      height: 100%;
+      text-align: center;
+      line-height: 38px;
+      color: #ffffff;
+      font-size: 24px;
+    }
+  .aplayerSpeedFont{
+    color: #2671E2;
+  }
+
+
+  .center3{
+    padding-left: 10px;
+    padding-right: 10px;
+    padding-top: 10px;
+  }
+ .center3 .text {
+      width: 100%;
+      font-size: 12px;
+      line-height: 20px;
+      display: flex;
+      align-items: center;
+      margin:26px 0px;
+      position: relative;
+  }
+  .center3 .text .avatar{
+			 width: 38px;
+			 height:38px;
+			 /*background-color: #f2f2f2;*/
 			 background-color: #ccc;
 			 border-radius: 50%;
-			//  margin-left: 15px;
+			 margin-left: 15px;
 			 display: flex;
 			 justify-content: center;
 			 align-items: center;
 		 }
-		 .center2 .text .avatar img{
+		 .center3 .text .avatar img{
 			 width: 28px;
 			 height:28px;
 			 display: block;
 		 }
-		 .center2 .text .avatar div{
+		 .center3 .text .avatar div{
 			 width: 100%;
 			 height: 100%;
 			 text-align: center;
@@ -1216,9 +1473,21 @@ export default {
 			 color: #ffffff;
 			 font-size: 24px;
 		 }
-    .aplayerSpeedFont{
-			color: #2671E2;
-		}
+
+ .buttonzu{
+    position: absolute;
+    left: 70px;
+    top: -20px;
+  }
+  .text[data-speaker="2"] .buttonzu,
+  .text[data-speaker="4"] .buttonzu,
+  .text[data-speaker="6"] .buttonzu{
+    position: absolute;
+    right: 70px;
+    top: -20px;
+    text-align: right;
+  }
+
 
 
 //指标执行率
@@ -1357,6 +1626,7 @@ export default {
     margin-left: 20px;
   }
 }
+
 .input{
   width: 94%;
   height: 32px;
@@ -1586,4 +1856,41 @@ export default {
 			 transform: translate(-50%, -50%);
 			 background: #ffffff;
 		 }
+     .searchbox54 .avatar img{
+			 /*width: 53px;*/
+			 /*height: 53px;*/
+			 width: 32px;
+			 height: 32px;
+			 display: block
+		 }
+		 .searchbox54 .avatar {
+			 width: 40px;
+			 height: 40px;
+			 /*background-color: #f2f2f2;*/
+			 background-color: #ccc;
+			 border-radius: 50%;
+			 margin-left: 5px;
+			 display: flex;
+			 justify-content: center;
+			 align-items: center;
+		 }
+     		.searchbox54{
+			width: 100%;
+			min-height: 72px;
+			border-bottom:1px solid #E0E0E0;
+			display: flex;
+			font-size: 16px;
+			color: #666666;
+			padding-bottom: 20px;
+		}
+		.searchbox54>div:nth-of-type(1){
+			width:17%;
+			height: 100%;
+			text-align: center;
+			margin-top: 18px;
+		}
+		.searchbox54>div:nth-of-type(2){
+			width:83%;
+			margin-top: 20px;
+		}
 </style>