RMS-FrontEnd/RMS-FrontEnd/src/views/report/FTO/FTOPage/components/patentMessage.vue

 
<template>

    <div class="patent-articles" >
        <el-container v-loading="loading">
          <el-container >
            <el-header class="patent-articles-title">
              <div class="patent-articles-title-box">
                <div style="position:relative">
                   <div>
                  <span v-html="getViewDom(patent.publicNo)"></span>
                  <el-tag type="primary" effect="dark" size="mini" class="margin-left_10">{{ patent.simpleStatus }}</el-tag>
                  <el-tag :type="patentStatus2 == '0' ? 'info' : 'primary'" effect="dark" size="mini" class="margin-left_10"
                      style="cursor: pointer" @click="changeStatus(patentStatus2)">{{ patentStatus[patentStatus2]
                      }}</el-tag>
                </div>
                <div style="color: #6b6868; font-size: 15px;border-bottom: 1px solid #e6e6e6;padding-bottom: 5px;">
                  <span v-html="getViewDom2(patent, 'name')"></span>
                  <el-link type="primary" @click.native="handleChange(patent, 'name')" style="margin-left: 10px;margin-top: -3px;">
                    <span v-if="!patent.change">切换译文</span>
                    <span v-else>切换原文</span>
                  </el-link>
                </div>
                </div>
               
                <div  style="  position: relative;">
                    <el-link v-for="item in menuList" :type="activeMenu === item.value ? 'primary' : undefined" v-if="$permission('/workspace/patent/worth')?true:item.value !='patentWorth'" :disabled="item.value === 'PatentExport' ? !$permission('/workspace/details/exportDocument'): false " @click.native="handleSelect(item.value)">{{ item.label }}</el-link>
                  <el-link v-for="item in menuList2" :type="activeMenu === item.value ? 'primary' : undefined" :disabled="item.value === 'PatentExport' ? !$permission('/workspace/details/exportDocument'): false " @click.native="handleSelect(item.value)">{{ item.label }}</el-link>
                  <el-tooltip class="item" effect="dark"  :content="(showRight ? '隐藏' : '显示') + '右侧菜单'" placement="top" v-if="showcard==true">
                    <i :class="showRight ? 'el-icon-s-unfold' : 'el-icon-s-fold'" style="font-size: 25px;position: absolute; right: 10px; margin-top: 5px;color: #2f2f2f; cursor: pointer" @click="showRight = !showRight"></i>
                  </el-tooltip>
                </div>
              </div>
            </el-header>
            <el-main class="patent-articles-content" style="padding-left:30px">
              <div class="patent-articles-content-left" :style="{ width: showRight ? 'calc(100% - 321px)' : 'calc(100% - 21px)' }">
                <component :is="componentName" :project-id="projectId" :patent="patent" :patent-id="patentId" @refresh="getPatent(patent.patentNo)"></component>
              </div>
              <div class="patent-articles-content-right" v-if="showRight">
                <el-container>
                  <el-header v-if="showcard==true">
                    <div class="patent-articles-option">
                      <el-tabs v-model="activeOption" type="card">
                        <el-tab-pane label="标引" name="PatentField"></el-tab-pane>
                        <!-- <el-tab-pane label="高亮" name="PatentKeywordsHighlight"></el-tab-pane> -->
                        <!-- <el-tab-pane label="注释" name="PatentAnnotation" :disabled="!($permission('/workspace/details/notes') && $r(projectId,[1,2]))"></el-tab-pane> -->
                      </el-tabs>
                    </div>
                  </el-header>
                  <el-main>
                    <keep-alive>
                      <component :is="activeOption" @status="getStatus" :project-id="projectId" :patent-id="patentId" :reportId="reportId" :taskId="taskId" :patentNo1="publicNo"></component>
                        <component :is="activeOption" @status="getStatus" :project-id="projectId" :patent-id="patentId" :reportId="reportId" :taskId="taskId" :patentNo1="publicNo"></component>
                    </keep-alive>
                  </el-main>
                </el-container>
              </div>
            </el-main>
          </el-container>
        </el-container>
        <div class="content-main" style="padding-left:40px"></div>
      </div>
      
    
    
     
      
    
</template>
    
<script>

import { changeTranslation, patentKeywordsHighlight } from '@/views/components/common/mixins'
import PatentList from '@/views/components/articles/components/PatentList.vue'
import PatentField from '@/views/components/articles/components/PatentField'
// import PatentAnnotation from './components/PatentAnnotation'
import PatentBasic from "@/views/components/articles/components/PatentBasic"
import PatentPDF from "@/views/components/articles/components/PatentPDF"
import PatentImage from "@/views/components/articles/components/PatentImage"
import PatentRight from "@/views/components/articles/components/PatentRight"
import PatentInstruction from "@/views/components/articles/components/PatentInstruction"
import PatentFamily from "@/views/components/articles/components/PatentFamily"
import PatentStatus from "@/views/components/articles/components/PatentStatus"
// import PatentKeywordsHighlight from '../components/PatentKeywordsHighlight'
import PatentMessage from './patentMessage'
import PatentKeywordsHighlight from "@/views/components/common/PatentKeywordsHighlight"
import Examination from '@/views/components/articles/components/history/examination.vue'
import File from '@/views/components/articles/components/history/file.vue'
import Invalid from '@/views/components/articles/components/history/invalid.vue'
import Litigation from '@/views/components/articles/components/history/litigation.vue'
import Other from '@/views/components/articles/components/history/other.vue'
import { getPatentCountry } from "@/utils";
import Import from '@/views/components/import/index.vue'
import Features from '@/views/components/articles/components/features.vue'
    
import Permit from '@/views/components/articles/components/history/permit.vue'
import ProductManage from '@/views/product/components/product.vue'
import PatentWorth from '@/views/components/articles/components/history/components/echarts/components/echarts.vue'
    export default {
      mixins: [patentKeywordsHighlight, changeTranslation],
      components: {
            PatentMessage,
            PatentList,
            PatentField,
            // PatentAnnotation,//右侧自定义字段中右侧注释部分
            PatentKeywordsHighlight,
            PatentBasic,
            PatentPDF,
            PatentImage,
            PatentRight,
            PatentFamily,
            PatentStatus,
            PatentInstruction,
            Import,
            Features,
            Examination,
            File,
            Invalid,
            Litigation,
            Other,
            Permit,
            ProductManage,
            PatentWorth
      },
  props: ['reportId', 'patentMessage', 'publicNo','taskId',"patentStatus2A","switchValue"],
    //   props:{
    //     reportId:Number,
    //     patentMessage:String,
    //     publicNo:String,
    //     required:true
    //   },
    data() {
        return {
      patentStatus: {
        '0': '未读',
        '1': '已读'
      },
      patentStatus2: '',
      showcard: true,
      fix: false,
      showRight: false,
      patentId: parseInt(this.$route.params.id || 0),
      projectId: parseInt(this.$route.query.id || 0),
      patent: {},
      activeMenu: 'PatentBasic',
      componentName: 'PatentBasic',
      activeOption: 'PatentField',
      loading: false,
      patentNo:"",
      menuList: [
        {
          value: 'PatentBasic',
          label: '基础信息'
        },
        {
          value: 'PatentRight',
          label: '权利要求'
        },
        {
          value: 'PatentImage',
          label: '附图'
        },
        {
          value: 'PatentInstruction',
          label: '说明书文本'
        },
        {
          value: 'PatentFamily',
          label: '同族专利'
        },
        {
          value: 'PatentStatus',
          label: '法律状态'
        },
        {
          value: 'PatentPDF',
          label: '说明书'
        },
        // {
        //   value: 'PatentExport',
        //   label: '导出文档'
        // },
        {
          value:'Permit',
          label:'许可历史'
        },
        {
          value:'ProductManage',
          label:'商品化'
        },
        {
          value:'patentWorth',
          label:'价值曲线'
        }
      ],
      menuList2: [
        {
          value: 'Examination',
          label: '审查历史'
        },
        // {
        //   value: 'File',
        //   label: '申请案卷'
        // },
        {
          value: 'Invalid',
          label: '无效记录'
        },
        {
          value: 'Litigation',
          label: '诉讼历史'
        },
        {
          value: 'Other',
          label: '其他参考资料'
        },
      ],
      
    }
  },
  created() {
    //console.log(this.publicNo);
  },
  watch: {
   
    publicNo(val) {
      //console.log(val);
      this.getPatent(val)
    },
    patentStatus2(val) {
      let value = {
        patentNo: this.publicNo,
        patentStatus2:this.patentStatus2
      }
      this.$emit("patentStatusEmit",value)
    },
    patentStatus2A(val) {
      if (this.publicNo==val.patentNo) {
        this.patentStatus2=val.patentStatus2
      }
    },
    switchValue(val) {
      if (this.publicNo==val.patentNo) {
        if (val.value) {
          this.showcard=false
        } else {
          this.showcard=true
        }
      } else {
        this.showcard=true
      }
    },
    
  },
  mounted() {
    if(this.publicNo){
      this.getPatent(this.publicNo)
    }
  },
  methods: {
    changePageTitle() {
      document.title = `${this.patent.publicNo} ${this.patent.name || ''}`
    },
    async getPatent(publicNo) {
      //console.log(publicNo)
      this.loading = true
      const response = await this.$api.PatentByPatentNo({patentNo : publicNo})
      //console.log(response)
      this.patent = response.data
      if (this.taskId) {
        this.getPatentStatus()
      }
      const country = getPatentCountry(this.patent.patentNo)
      let change = false
      if (country !== 'CN') {
        change = true
      }
      this.$set(this.patent, 'change', change)
      this.$set(this.patent, 'change2', change)
      this.loading = false
      this.changePageTitle()
    },
    handleSelect2(index, path) {

    },
    handleSelect(index) {
      if (index === 'PatentExport') {
        const router = this.$router.resolve({
          path: '/export/patent',
          query: {
            id: this.projectId,
            patent: this.patent.id,
          }
        })
        window.open(router.href, '_blank');
        return false
      }
      this.activeMenu = index
      this.componentName = index
    },
     //修改已读未读
    changeStatus(val) {
      if (val == '0') {
        var a = {
          taskID: this.taskId?this.taskId:this.taskId1,
          patentNo:this.publicNo,
        }
        this.$api.updatePatentStatus(a).then(response => {
          if (response.code == 200) {
            this.patentStatus2 = '1'
          }
        })
      }

    },
      //查询任务下专利状态
    getPatentStatus() {
      var a = {
        taskID: this.taskId?this.taskId:this.taskId1,
        patentNo:this.publicNo,
      }
      this.$api.getPatentStatus(a).then(response => {
        //console.log("patentMessage",response.data);
        if (response.code == 200) {
          this.patentStatus2 = response.data
        }
      })
    },
    //获取状态
    getStatus(val) {
      this.patentStatus2 = val
    },
  }
}
</script>
    
<style lang="scss">
    .content-main{
      width:80% !important ;
      background-color: skyblue !important;
    }
    .patent-articles {
      width: 100%;
      height: 100% !important;
      padding: 0 !important;
      .patent-articles-menu {
    
      }
      .el-menu-item.is-active {
        background: #ecf5ff !important;
        color: #409EFF!important;
      }
      .patent-articles-title {
        padding: 0 !important;
        height: 100px !important;
        .el-link {
          margin-right: 20px;
        }
        .patent-articles-title-box {
          font-size: 20px;
          width: 100%;
          text-align: center;
        }
      }
      .patent-articles-content {
        background: #fff;
        padding: 0;
        height: 100%;
        overflow: hidden;
        .patent-articles-content-left {
          float: left;
          height: 100%;
          overflow-y: auto;
          overflow-x: hidden;
          padding: 10px;
        }
        .patent-articles-content-right {
          width: 300px;
          border-left: 1px solid #e6e6e6;
          float: right;
          height: 100%;
          .el-header {
            height: 50px !important;
            position: relative !important;
          }
          .el-main {
            padding: 0 12px !important;
          }
          .el-container, .el-main {
            height: 100%;
          }
          .patent-articles-option {
            position: absolute;
            bottom: 0;
            height: 100%;
            left: 50px;
            .el-tabs {
              margin-top: 9px;
            }
            .el-tabs__header {
              margin-bottom: 0 !important;
            }
          }
        }
      }
    }
    </style>