|
@@ -0,0 +1,234 @@
|
|
|
|
+export const translate = {
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ tabs:[
|
|
|
|
+ {
|
|
|
|
+ label:'原文',
|
|
|
|
+ name:'0',
|
|
|
|
+ field:'content'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label:'译文',
|
|
|
|
+ name:'1',
|
|
|
|
+ field:'contentOut'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label:'双语',
|
|
|
|
+ name:'2',
|
|
|
|
+ field:'content'
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
|
|
+ tabItem:{
|
|
|
|
+ label:'原文',
|
|
|
|
+ name:'0',
|
|
|
|
+ field:'content'
|
|
|
|
+ },
|
|
|
|
+ getDataSign:true
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+ this.showTabs()
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ showTabs(){
|
|
|
|
+ if(this.outside || this.patent.appCountry == 'CN'){
|
|
|
|
+ this.tabs = [
|
|
|
|
+ {
|
|
|
|
+ label:'原文',
|
|
|
|
+ name:'0',
|
|
|
|
+ field:'content',
|
|
|
|
+ icon:'el-icon-refresh',
|
|
|
|
+ value:'3'
|
|
|
|
+ },
|
|
|
|
+ ]
|
|
|
|
+ this.$set(this,'name','0')
|
|
|
|
+ this.tabItem={
|
|
|
|
+ label:'原文',
|
|
|
|
+ name:'0',
|
|
|
|
+ field:'content'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ else{
|
|
|
|
+ this.tabs = [
|
|
|
|
+ {
|
|
|
|
+ label:'原文',
|
|
|
|
+ name:'0',
|
|
|
|
+ field:'content',
|
|
|
|
+ icon:'el-icon-refresh',
|
|
|
|
+ value:'3'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label:'译文',
|
|
|
|
+ name:'1',
|
|
|
|
+ field:'contentOut'
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label:'双语',
|
|
|
|
+ name:'2',
|
|
|
|
+ field:'content'
|
|
|
|
+ },
|
|
|
|
+ ]
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ to(scrollTop,ref='yiwen',activeIndex){
|
|
|
|
+ var dom2 = this.$refs[ref]
|
|
|
|
+ dom2.scrollTo(
|
|
|
|
+ {
|
|
|
|
+ behavior: "smooth",
|
|
|
|
+ top:scrollTop
|
|
|
|
+ }
|
|
|
|
+ )
|
|
|
|
+ //方案三
|
|
|
|
+ // dom2.children[activeIndex].scrollIntoView(
|
|
|
|
+ // {
|
|
|
|
+ // behavior: "smooth",
|
|
|
|
+ // block:'center'
|
|
|
|
+ // // block:'nearest'
|
|
|
|
+ // }
|
|
|
|
+ // )
|
|
|
|
+ if(activeIndex || activeIndex == 0){
|
|
|
|
+ this.heightLight(activeIndex)
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ heightLight(activeIndex){
|
|
|
|
+ var dom2 = this.$refs.yiwen
|
|
|
|
+ var dom1 = this.$refs.yuanwen
|
|
|
|
+ for (let i = 0; i < dom1.children.length; i++) {
|
|
|
|
+ if (i == activeIndex) {
|
|
|
|
+ dom1.children[i].classList.add('highlightText');
|
|
|
|
+ dom2.children[i].classList.add('highlightText');
|
|
|
|
+ } else {
|
|
|
|
+ // 清除之前的高亮
|
|
|
|
+ dom1.children[i].classList.remove('highlightText');
|
|
|
|
+ dom2.children[i].classList.remove('highlightText');
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ clickDom(e,ref){
|
|
|
|
+ var index = e.target.dataset.index
|
|
|
|
+ // var ref1 = 'yiwen'
|
|
|
|
+ // if(ref=='yiwen'){
|
|
|
|
+ // ref1 = 'yuanwen'
|
|
|
|
+ // }
|
|
|
|
+ // var scrollTop = this.$refs[ref].scrollTop
|
|
|
|
+ // this.to(scrollTop,ref1,index)
|
|
|
|
+ this.heightLight(index)
|
|
|
|
+ },
|
|
|
|
+ handleClick(tab, event) {
|
|
|
|
+ this.tabItem = this.tabs.find(item=>{
|
|
|
|
+ return item.name == this.name
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ if(this.name == 2 ){
|
|
|
|
+ if((this.patentField == 3 && !this.checkedRightTree) || this.patentField == 4){
|
|
|
|
+ this.$nextTick(()=>{
|
|
|
|
+ var dom1 = this.$refs.yuanwen
|
|
|
|
+ var dom2 = this.$refs.yiwen
|
|
|
|
+ dom1.addEventListener('click',(e)=>this.clickDom(e,'yuanwen'))
|
|
|
|
+ dom2.addEventListener('click',(e)=>this.clickDom(e,'yiwen'))
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }else{
|
|
|
|
+ var dom1 = this.$refs.yuanwen
|
|
|
|
+ var dom2 = this.$refs.yiwen
|
|
|
|
+ if(dom2){
|
|
|
|
+ dom2.removeEventListener('click',(e)=>this.clickDom(e,'yiwen'))
|
|
|
|
+ }
|
|
|
|
+ if(dom1){
|
|
|
|
+ dom1.removeEventListener('click',(e)=>this.clickDom(e,'yuanwen'))
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ //获取内容
|
|
|
|
+ getContentOrContentOut(data,field){
|
|
|
|
+ if(data){
|
|
|
|
+ if(data[field]){
|
|
|
|
+ return this.getViewDom(data[field])
|
|
|
|
+ }else{
|
|
|
|
+ if(field == 'content'){
|
|
|
|
+ var {text,sign} = this.dataToDom(data.data,field)
|
|
|
|
+ if(sign){
|
|
|
|
+ this.$set(data,'content',text)
|
|
|
|
+ return this.getViewDom(text)
|
|
|
|
+ }
|
|
|
|
+ return text
|
|
|
|
+ }
|
|
|
|
+ if(field == 'contentOut'){
|
|
|
|
+ var contentData = data.data
|
|
|
|
+ if(contentData && contentData.length>0){
|
|
|
|
+ // var obj = contentData[0]
|
|
|
|
+ // if(obj.language && obj.language == 'CN'){
|
|
|
|
+ // return this.getContentOrContentOut(data,'content')
|
|
|
|
+ // }
|
|
|
|
+ var {text,sign} = this.dataToDom(data.data,field)
|
|
|
|
+ if(sign){
|
|
|
|
+ this.$set(data,'contentOut',text)
|
|
|
|
+ return this.getViewDom(text)
|
|
|
|
+ }
|
|
|
|
+ return text
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ //装载DOM
|
|
|
|
+ dataToDom(data,field){
|
|
|
|
+ var fieldKey = {
|
|
|
|
+ content:'originalContent',
|
|
|
|
+ contentOut:'translationContent'
|
|
|
|
+ }
|
|
|
|
+ field = fieldKey[field]
|
|
|
|
+ var content = ''
|
|
|
|
+ var sign = true
|
|
|
|
+ var noTranslateData = []
|
|
|
|
+ data.forEach((item,index)=>{
|
|
|
|
+ content += `<div id="${field}${item.order}" data-index=${index}>`
|
|
|
|
+ if(item[field]){
|
|
|
|
+ content += item[field]
|
|
|
|
+ }else{
|
|
|
|
+ content += '加载中...'
|
|
|
|
+ noTranslateData.push(
|
|
|
|
+ {
|
|
|
|
+ order:item.order,
|
|
|
|
+ index:index
|
|
|
|
+ }
|
|
|
|
+ )
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ content += '</div>'
|
|
|
|
+ })
|
|
|
|
+ if(noTranslateData.length>0){
|
|
|
|
+ sign = false
|
|
|
|
+ if(this.getDataSign){
|
|
|
|
+ this.getDataSign = false
|
|
|
|
+ noTranslateData.forEach(item=>{
|
|
|
|
+ this.getTranslateOrder(item.order,item.index,data)
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ return {text:content,sign:sign}
|
|
|
|
+ },
|
|
|
|
+ //获取译文
|
|
|
|
+ getTranslateOrder(order,index,data){
|
|
|
|
+ var params = {
|
|
|
|
+ patentNo:this.patent.patentNo,
|
|
|
|
+ patentField:this.patentField,
|
|
|
|
+ order:order
|
|
|
|
+ }
|
|
|
|
+ this.$api.getTranslateOrder(params).then(res=>{
|
|
|
|
+ if(res.code == 200){
|
|
|
|
+ var translate = res.data
|
|
|
|
+ var obj = {
|
|
|
|
+ translationContent:'无译文'
|
|
|
|
+ }
|
|
|
|
+ if(translate.length>0){
|
|
|
|
+ var obj = translate[0]
|
|
|
|
+ }
|
|
|
|
+ this.$set(data[index],'translationContent',obj.translationContent)
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+}
|