<template>
  <div style="top:0px;left:0px;">
    <div style="background:white;display:flex; justify-content:flex-end;align-items: center;height: 50px;">
      <!-- <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> -->
      <!-- <el-button type="primary" size="small" @click="checkResult" style="margin-top:20px;margin-right:10px;height:32px;"> 查看结果 </el-button> -->
      <el-button v-if="reportType==4 && !taskId" @click="taskWork" type="primary" size="small" style="height: 32px;"> 协同办公 </el-button>
      <el-popover placement="bottom" title="关键词高亮" width="320" trigger="click" style="margin-left: 20px;">
        <patent-keywords-highlight :project-id="projectId" />
        <el-button slot="reference" size="small" type="primary"
          class="margin-right_10">
          高亮<i class="el-icon-arrow-down el-icon--right"></i>
        </el-button>
      </el-popover>
      <el-switch v-model="value" 
        inactive-text="查看详情" active-color="#00BFFF" inactive-color="#D3D3D3">
      </el-switch>
      <patent-list v-if="taskId && reportType!=4" :patent-id="patentId" :project-id="projectId" @on-change="onChange" :taskId="taskId"
        :location="location1" :state="state" :ban='ban' @behindNumber="behindNumber"/>
    </div>

    <!-- <el-button @click="two">对比</el-button> -->
    <el-container style=" border: 1px solid #eee">
      <!-- <el-container :style="{width:width}" > -->
      <el-aside style="margin:0;" :style="{ width: width }">
        <Patent-Features v-if="type == '2'||type=='1' || reportType == 4" :taskId="taskId" :patentNo="patentNo1" :reportId="reportId" :coordination="coordinationA" :FeaturesNumber="FeaturesNumber" :taskWorkRemak="taskWorkRemakA" :type="type" @isRead="isRead" ></Patent-Features>
        <patent-Message v-else :publicNo="patentNo1" :reportId="reportId" :taskId="taskId" @patentStatusEmit="patentStatusEmit" :patentStatus2A="patentStatus2A" :switchValue="switchValue"></patent-Message>
      </el-aside>
      <!-- </el-container> -->
      <el-main v-show="width != '100%'" :style="{ width: 'calc(100% - ' + width + ')' }">
        <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">
                  <!-- <img src="@/assets/visual/fixed.png" width="20px" height="20px" v-if="fix===true&&value==true" @click="qx" style="position:absolute;top:5px;left:5px"/>
                      <img src="@/assets/visual/unfixed.png" width="20px" height="20px" v-if="fix===false&&value==true"  @click="gd" style="position:absolute;top:5px;left:5px"/> -->
                  <!-- <div style="background-image:url('');width:20px;height:20px"></div> -->
                  <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 v-if="reportType!=4" :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"
                    :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">
                    <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)' }">
                <!-- @isTrues="getIsTrue"  @openContrast='openContrast' -->
                <component :is="componentName" :project-id="projectId" :isTrue="isTrue" :type1="type" :patent="patent"
                  :reportId="reportId" :patent-id="patentId" @refresh="getPatent(patentId)"></component>
              </div>
              <div class="patent-articles-content-right" v-if="showRight">
                <el-container>
                  <el-header>
                    <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"  :taskId="taskId" :project-id="projectId"
                        :patent-id="patentId" :reportId="reportId" :patentNo1="patentNo1"></component>
                      <component :is="activeOption" @status="getStatus" :taskId="taskId" :project-id="projectId"
                        :patent-id="patentId" :reportId="reportId" :patentNo1="patentNo1"></component>
                    </keep-alive>
                  </el-main>
                </el-container>
              </div>
            </el-main>
            <!-- </el-container> -->
          </el-container>
          <div class="content-main" style="padding-left:40px"></div>
        </div>
      </el-main>
    </el-container>
    <sendCollaboration :visibleCollaborations="visibleWork" @collaboration="collaboration" :reportId="reportId" :patentNo1="patentNo1"></sendCollaboration>
    <!-- <el-dialog :visible.sync="dialogVisible">
        <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog> -->
  </div>
</template>
    

<script>
import PatentFeatures from './PatentFeatures.vue'

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 sendCollaboration from "@/views/report/components/sendCollaboration.vue"

export default {
  mixins: [patentKeywordsHighlight, changeTranslation],
  props: ['patentNo', 'taskId1', 'location', 'state',"reportId1","coordination","taskWorkRemak"],
  components: {
    PatentFeatures,
    PatentMessage,
    PatentList,
    PatentField,
    // PatentAnnotation,//右侧自定义字段中右侧注释部分
    PatentKeywordsHighlight,
    PatentBasic,
    PatentPDF,
    PatentImage,
    PatentRight,
    PatentFamily,
    PatentStatus,
    PatentInstruction,
    Import,
    Features,
    Examination,
    File,
    Invalid,
    Litigation,
    Other,
    sendCollaboration,
  },
  data() {
    return {
      patentNo1: this.patentNo,
      // reportId: this.reportId,

      coordinationA:this.coordination,
      taskWorkRemakA: this.taskWorkRemak,
      reportType: '',
      reportStatus:'',
      ban: 0,
      pNo: '',
      location1: this.location ? this.location : '',
      type: '',
      isTrue: false,
      showRight: false,
      patentStatus: {
        '0': '未读',
        '1': '已读'
      },
      patentStatus2: '',
      patentStatus2A:{},
      fix: false,
      patent: '',
      loading: false,
      reportId: this.reportId1,
      taskId: '',
      value: false,
      switchValue:{},
      patentId: parseInt(this.$route.params.id || 0),
      projectId: parseInt(this.$route.query.id || 0),
      activeMenu: 'PatentBasic',
      componentName: 'PatentBasic',
      activeOption: 'PatentField',
      width: '100%',
      dialogVisible: false,
      visibleWork: false,
      dialogImageUrl: '',
      FeaturesNumber: null,
      // isKeepA:null,
      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: '导出文档'
        },
      ],
      menuList2: [
        {
          value: 'Examination',
          label: '审查历史'
        },
        // {
        //   value: 'File',
        //   label: '申请案卷'
        // },
        {
          value: 'Invalid',
          label: '无效记录'
        },
        {
          value: 'Litigation',
          label: '诉讼历史'
        },
        {
          value: 'Other',
          label: '其他参考资料'
        },
      ],
    }
  },
  watch: {
    value(val) {
      this.value = val
      if (val == true) {
        this.width = '50%'
      } else {
        this.width = '100%'
      }
      this.switchValue = {
          patentNo: this.patentNo1,
          value:val,
      }
    },
    patentStatus2(val) {
      // this.patentStatus2A=val
      this.patentStatus2A = {
        patentNo: this.patentNo1,
        patentStatus2:this.patentStatus2
      }
    },
  },
  created() {
    console.log(this.$s.getSession('params'));
    this.taskId = this.$s.getSession('params').taskId
    this.type = this.$s.getSession('params').type
    this.reportType = this.$s.getSession('params').reportType
    this.reportStatus = this.$s.getSession('params').reportStatus?this.$s.getSession('params').reportStatus:''

    this.reportId = this.$s.getSession('params').reportId
    console.log(this.$s.getSession('params'));
    // this.reportId = this.$s.getSession('params').reportId
  },
  mounted() {
    console.log(this.location, this.state,this.taskWorkRemak);
    this.getPatent(this.patentNo)
    console.log(this.reportId, this.$s.getSession('params'));
  },
  methods: {
      // 侵权分析工作协同
      taskWork() { 
        this.visibleWork = true
        // this.compareResult=this.queryParams.compareResult
      },
      collaboration(val) { 
        this.visibleWork=val
      },
    isRead(val) {
      if(this.patentStatus2==0){
        this.changeStatus(val)
      }
      if(this.reportType == 4 && this.reportStatus == 1){
        var a = {
          reportId:this.reportId,
          status:2
        }
        this.$api.UpdateStatus(a).then(response=>{
          if(response.code == 200){
            var a = this.$s.getSession('params')
            a.reportStatus = 2
            this.$s.setSession('params',a)
            var b = this.$s.getSession('reportMessage1')
            b.status = 2
            this.$s.setSession('reportMessage1',b)
          }
        })
      }
    },
    behindNumber(val) {
      this.FeaturesNumber = val
      console.log(this.FeaturesNumber,val);
    },
    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
    },
    async onChange(data) {
      // this.isKeepA=data.patentNo
      // if (this.coordinationA) {
        console.log(this.projectId,data)
        this.message = data.patentNo
        this.patentNo1 = data.patentNo
        if (this.fix != true) {
          await this.getPatent(data.patentNo)
        }

        await this.$router.push({
          path: this.coordinationA? '/FTOContrasts/' + data.id:'/FTOContrast/' + data.id,
          query: {
            patentNo: data.patentNo,
            location: data.location,
          }
        })
        this.location1 = data.location
        this.patentId = data.id
        this.changePageTitle()
      // } else {
      //   console.log(this.projectId,data)
      //   this.message = data.patentNo
      //   this.patentNo1 = data.patentNo
      //   if (this.fix != true) {
      //     await this.getPatent(data.patentNo)
      //   }

      //   await this.$router.push({
      //     path: '/FTOContrast/' + data.id,
      //     query: {
      //       patentNo: data.patentNo,
      //       location: data.location,
      //     }
      //   })
      //   this.location1 = data.location
      //   this.patentId = data.id
      //   this.changePageTitle()
      // }
      // console.log(this.projectId,data)
      // this.message = data.patentNo
      // this.patentNo1 = data.patentNo
      // if (this.fix != true) {
      //   await this.getPatent(data.patentNo)
      // }

      // await this.$router.push({
      //   path: '/FTOContrast/' + data.id,
      //   query: {
      //     patentNo: data.patentNo,
      //     location: data.location,
      //   }
      // })
      // this.location1 = data.location
      // this.patentId = data.id
      // this.changePageTitle()
    },
    //查询任务下专利状态
    getPatentStatus() {
      if(this.taskId){
        var a = {
          reportId:null,
          taskID: this.taskId,
          patentNo: this.patentNo1?this.patentNo1:this.patentNo
        }
      }else{
        var a = {
          reportId:this.reportId,
          taskID:null,
          patentNo: this.patentNo1?this.patentNo1:this.patentNo
        }
      }
      
      this.$api.getPatentStatus(a).then(response => {
        if (response.code == 200) {
          console.log("ContrasrProduct",response.data);
          this.patentStatus2 = response.data
        }
      })
    },
    //修改已读未读
    changeStatus(val) {
      if (val == '0') {
        if(this.taskId){
          var a = {
            reportId:null,
            taskID: this.taskId?this.taskId:this.taskId1,
            patentNo: this.patentNo1?this.patentNo1:this.patentNo
          }
        }else{
          var a = {
            reportId:this.reportId,
            taskID:null,
            patentNo: this.patentNo1?this.patentNo1:this.patentNo
          }
        }
        this.$api.updatePatentStatus(a).then(response => {
          if (response.code == 200) {
            this.patentStatus2 = '1'
          }
        })
      }

    },
    //获取状态
    getStatus(val) {
      this.patentStatus2 = val
    },
    patentStatusEmit(val) {
      if (this.patentNo1==val.patentNo) {
        this.patentStatus2=val.patentStatus2
      }
    },
    changePageTitle() {
      document.title = `${this.patent.publicNo} ${this.patent.name || ''}`
    },
    async getPatent(publicNo) {
      this.loading = true
      const response = await this.$api.PatentByPatentNo({ patentNo: publicNo })
      console.log(response)
      this.patent = response.data
      if (this.taskId) {
        this.getPatentStatus()
      }

      // this.getContrastList()
      this.pNo = this.patent.publicNo
      console.log(this.pNo, this.patent.publicNo)
      // if (this.publicNo == this.patent.publicNo) {
      //   this.showcard = false
      // }
      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()
    },
  },
}
</script>