<template>
  <div>
    <el-popover ref="myPopover" :placement="placement" :width="width" trigger="hover" :popper-options="popperOptions">
      <p v-if="type === '1'" class="p-1">公司调查是针对特定的目标公司展开的调查分析，是分析评议中常用的基础分析模块，在解决例如于企业上市、企业并购的评议以及在专利维权及遭遇侵权纠纷问题时都会用到。
      </p>
      <p v-if="type === '2'" class="p-1">
        产品调查是针对特定产品的调查分析，包括该产品的基本信息、市场竞争及其相关知识产权分析，是分析评议中常用的基础分析模块，在解决例如产品上市或出口、境内外参展、专利维权问题时都会用到。</p>
      <p v-if="type === '3'" class="p-1">
        技术调查是针对特定技术进行的调查分析，可能是具体产品包含的某一技术，也可能是通用于某一或者某些领域的通用技术。技术调查是分析评议中常用的基础分析模块，在解决例如技术引进、人才引进、企业并购、标准制定与采用等问题时会用到。</p>
      <p v-if="type === '4'" class="p-1">侵权风险排查又称自由实施调查（Freedom To
        Operate，即FTO调查），是针对特定技术或者具体产品进行的调查分析，通过调查分析，确定相关技术或者产品是否落入专利的保护范围，从而判定是否存在侵犯专利权的可能。侵权调查是分析评议中常用的基础分析模块，在解决例如产品上市或出口、境内外参展、技术引进、人才引进、企业上市、企业并购等问题时会用到。
      </p>
      <p v-if="type === '5'" class="p-1">
        侵权比对分析是指对指定产品/技术与指定专利的权利要求进行比对分析，综合分析对象产品/技术是否落入目标专利的保护范围。在解决例如产品上市或出口风险控制、侵权纠纷、专利维权、竞争对手威胁应对等具体问题场景时会使用。</p>
      <p v-if="type === '6'" class="p-1">
        回避设计分析是指为规避专利保护范围来修改现有的设计,避免触犯他人专利权利。回避设计分析是分析评议中常用的基础分析模块，在解决例如产品上市或出口、技术引进、企业上市、企业遭遇侵权纠纷、标准制定与标准采用等问题时会用到。</p>
      <p v-if="type === '7'" class="p-1">
        专利性分析主要指两个方面，第一是指在申请专利之前判断该发明创造是否是专利保护的客体，第二是指专利授权之后，判断该专利被无效的可能性，即专利稳定性分析，统称为专利性分析。专利性分析是分析评议中常用的基础分析模块，在解决例如产品上市或出口、境内外参展、技术引进、人才引进、企业上市、企业遭遇侵权纠纷、专利维权、专利布局、标准制定与标准采用等问题时会用到。
      </p>
      <p v-if="type === '8'" class="p-1">
        专利价值评估是指对特定的一件或者多件专利进行价值评价，反映专利在交易或者其它知识产权活动中的内在价值。专利价值分析是分析评议中常用的基础分析模块，在解决例如技术引进、人才引进、企业上市、企业并购等涉及到专利交易等问题时会用到。
      </p>
      <p v-if="type === '9'" class="p-1">产业调查需要对全球、各个国家及区域的产业发展状况进行调查分析，产业发展状况分析的具体内容包括产业概况、市场分析、竞争分析、应用趋势与技术分析等。</p>
      <p v-if="type === '10'" class="p-1">
        政策主要指产业政策，产业政策是国家或者地方制定的，引导产业发展方向、引导推动产业升级、协调产业结构、使国民经济健康可持续发展的政策。主要是调查目标国家/地区对于行业或者相关技术发展的相关政策、规划、决定等。</p>
      <p v-if="type === '10'" class="p-1">市场环境分析指影响产品生产和销售的一系列外部因素，主要是对主要国家/地区的相关行业/技术的相关市场进行分析。</p>
      <p v-if="type === '11'" class="p-1">
        专利监控是指对特定对象相关的专利进行实时监视，包括最新公开公告的专利监视、专利法律状态监视等。专利监控是分析评议中常用的基础分析模块，在解决例如专利布局、竞争对手威胁应对等问题时会用到。</p>
      <p v-if="type === '12'" class="p-1">
        专利挖掘是从创新成果中提炼出具有专利申请和保护价值的技术创新点和方案，并结合产业链上中下游的关系，整理并确定适合提出专利申请的技术方案。在解决例如专利培育布局、企业上市、竞争对手威胁应对等问题时会用到。</p>

      <div v-if="type === 'titleA1'">
        <p class="p-1">用于实现专利培育与专利布局的相关解决方案，主要基于产品/技术、市场、行业等多维关联因素制定专利挖掘、专利申请及专利保护的综合策略方案，以协助企业在市场竞争中取得最大化的商业利益，处于商战优势地位。
        </p>
        <p class="p-1">在技术研发之初和研发过程中，高度重视运用文献信息特别是专利信息，从而找准研发的重点、起点和研发方向，避免低水平研究或者是重复研究</p>
        <p class="p-1">
          在专利申请阶段通过专利挖掘制定合理的专利布局、合理的构建专利组合或者专利池，对某一技术或者产品相关的技术方案进行详细的、全方位的、系统性的并且强有力的保护，打造最强的保护范围，提升专利组合的整体稳定性；其次，对产业链的上下游进行合理的专利布局，提升在该行业的商业价值；再次，根据商业需求进行合理的地域布局，拓展专利的保护空间，增加其商业价值。
        </p>
      </div>
      <div v-if="type === 'titleA2'">
        <p class="p-1">旨在解决产品上市/出口是否有侵犯他人在先知识产权的可能性，为后续可能遇到的知识产权风险提前做好必要的应对预案，为产品的上市/出口实施保驾护航。</p>
        <p class="p-1">
          企业产品是否可销售、企业投入经费立项研发出来的新产品上市/出口是否能够自由实施，是否会侵犯他人专利权，是否会涉及巨额赔偿，是企业关注的问题。基于上述问题，在企业产品上市或出口之前开展知识产权分析评议工作尤为重要。可以帮助企业尽量做好各项准备，避免临时禁令、海关扣押、警方行动、恶意侵权指控、侵权诉讼等极端不利的情况。当突发极端不利情况时，可以积极采用各项预案策略，避免事态严重和发生更多法律费用。
        </p>
      </div>
      <div v-if="type === 'titleA3'">
        <p class="p-1">
          在遭遇专利侵权纠纷，收到专利侵权警告函或被他人起诉专利侵权时，合理应对以化险为夷，妥善解决侵权纠纷的解决方案。主要包括确认自有技术/产品是否存在侵权风险的侵权分析判断，并在存在侵权行为时进行专利无效、回避设计的应对机制。
        </p>
        <p class="p-1">
          随着市场竞争的加剧，无论是在国内或是国外市场环境下，越来越多的企业遭遇到侵权纠纷。这些侵权纠纷有的来自竞争对手，有的来自NPE（非专利实施实体），国内企业对涉诉一般具有恐惧心理，特别是涉外诉讼。但是，并不一定所有的侵权纠纷都可怕，很多侵权纠纷仅仅是竞争对手的商业手段或者是NPE的恐吓行为，通过专利分析评议，充分了解案情，在知己知彼的基础上，企业完全可以从容应对。
        </p>
      </div>
      <div v-if="type === 'titleA4'">
        <p class="p-1">专利维权旨在提供用于解决在激烈的行业竞争中，己方专利面临被他人侵犯时的解决方案。</p>
        <p class="p-1">
          企业遇到侵犯专利权情况，拿起法律武器合理维护自己的权益不失为最直接有效的措施。很多企业在自身的专利技术遭到侵犯时不知该如何应对，通过专利维权的解决方案，可以帮助企业理清思路，及时发现侵犯自身专利权的行为，划分市场份额，收取侵权赔偿费用，进行商业谈判，以找到合适的维权方式，维护自身利益。
        </p>
      </div>
      <div v-if="type === 'titleA5'">
        <p class="p-1">企业IPO上市前的专利储备规划与风险应对预案的解决方案，用于全面支撑IPO过程中知识产权相关问询答辩，有效应对竞争对手发起的上市狙击，协助企业顺利IPO上市。</p>
        <p class="p-1">涉及的相关专利分析主要包括己方专利盘点、评估核心产品之侵权风险、评估己方核心专利的稳定性以及潜在侵权高风险专利的稳定性分析及无效分析。</p>
      </div>
      <div v-if="type === 'titleA6'">
        <p class="p-1">用于解决专利主体(专利权人)的专利无形资产的评估与运营的相关专利分析，包括：专利盘点与专利运维。</p>
        <p class="p-1">
          专利盘点是指根据专利撰写质量、专利与产品的关联度强弱、专利对产品的涵盖度深浅等方向进行专利分类分级管理和专利布局优化分析。专利布局优化分析方向主要包括已有申请的权利要求优化/已有技术是否全部专利覆盖/已有专利是否足够保护产品。
        </p>
        <p class="p-1">专利运维是指根据专利盘点结果规划专利运营策略与专利维持策略，包括：针对性的专利布局优化策略的制定、专利维持或放弃的判断、许可谈判策略的制定、专利成果的转化等商业策略的制定。</p>
      </div>
      <div v-if="type === 'titleA7'">
        <p class="p-1">专利导航是运用专利制度的信息功能和专利分析技术系统，为立项提供决策参考，是导引产业健康发展的有效工具。</p>
        <p class="p-1">
          在科技与重大立项决策前开展专利导航，结合政策与市场环境、产业调查、现有技术的检索以及初步专利分析的情况，综合产业/企业的发展现状最终确认是否立项，其必要性与可行性如何，如果确认立项，给出研发的起点和方向等建议，避免出现重大立项失误。
        </p>
        <p class="p-1">
          借助专利导航，可以发挥专利信息分析对产业运行决策及企业经营决策的引导作用，发挥专利制度对产业创新资源的配置作用，提高产业创新效率和水平，防范和规避产业知识产权风险，强化产业/企业竞争力的专利支撑，提升产业创新驱动发展能力。
        </p>
      </div>
      <div v-if="type === 'titleA8'">
        <p class="p-1">在企业发现存在威胁性的潜在竞争对手时的应对方案，包括：对潜在威胁企业、行业、技术储备与实力进行分析,以及对己方专利盘点。</p>
        <p class="p-1">通过寻找杀手专利、针对威胁方产品布局包围专利、确认己方核心的维权杀手专利、优化和补充自身专利布局的方式，以形成可与竞争对手相互抗衡的专利实力。</p>
      </div>


      <slot slot="reference" />
    </el-popover>
    <el-popover ref="myPopover2" :placement="placement" :width="width1" trigger="click">
      <Question v-if="type1 === 'question'" v-on="$listeners" :type="scene"></Question>
      <slot slot="reference" />
    </el-popover>
  </div>
</template>

<script>
import Question from './question.vue'
export default {
  name: 'myPopover',
  components: {
    Question
  },
  props: {
    QuestionTotal: Array,
  },
  data() {
    return {
      popperOptions:{
        boundariesElement: 'body', gpuAcceleration: false
      },
      width: '',
      type: '',
      width1: '',
      type1: '',
      trigger: 'click',
      placement: 'bottom',
      scene: '',
      isClick: false,
    }
  },
  mounted() {
    document.body.addEventListener('click', () => {
      if (!this.isClick) {
        this.scene = ''
        if(this.$refs.myPopover2){
          this.$refs.myPopover2.doClose()
        }
        
      }
      this.isClick = false
    })
  },
  methods: {
    // 鼠标进入事件
    svgOnMouseenter(e, data) {
      if (data.width>e.target.getBoundingClientRect().width) {
        this.width=data.width
      } else {
        this.width = e.target.getBoundingClientRect().width - 20
      }
      this.type = data.type
      this.popover(e, data, 'myPopover')
    },
    // 鼠标离开事件
    svgOnMouseleave(e, data) {
      this.$refs.myPopover.doClose()
    },
    // 鼠标点击事件
    svgOnClick(e, data) {
      if (this.$refs.myPopover2.showPopper) {
        this.scene = ''
        this.$refs.myPopover2.doClose()
        return false
      }
      this.isClick = true
      var scene = data.scene
      this.scene = this.getQuestionId(scene)
      this.width1 = data.width
      this.type1 = data.type
      if (this.scene) {
        this.popover(e, data, 'myPopover2')
      }

    },
    // 打开popover
    popover(e, data, myPopover) {
      const _top3 = document.body.scrollTop || document.documentElement.scrollTop //获取滚动高度
      const _left = document.body.scrollLeft || document.documentElement.scrollLeft //获取滚动高度
      let top1 = e.target.getBoundingClientRect().height//目标元素的高
      let top2 = e.target.getBoundingClientRect().top //目标元素距离顶部的高
      // 计算目标元素距离左侧的距离
      let left = e.target.getBoundingClientRect().left
      // 将计算的值给到popover的left和top
      let popover = this.$refs[myPopover]
      popover.$el.style.position = 'fixed'
      if (myPopover == 'myPopover2') {
        top1 = -50
        if (e.currentTarget.getBoundingClientRect().top < Math.abs(top1)) {
          top1 =-e.currentTarget.getBoundingClientRect().top 
        }

        if (document.body.clientWidth - left < this.width1) {
          // target点击的元素、目标元素，currentTarget绑定点击事件的元素
          left = left - data.width - e.currentTarget.getBoundingClientRect().width
        } else {
          left = left + e.currentTarget.getBoundingClientRect().width
        }
      }


      if (myPopover == 'myPopover') {
        if (data.width > e.target.getBoundingClientRect().width) {
          let center = left-(data.width - e.target.getBoundingClientRect().width) / 2
          left=center<0?left:center
        }
      }

      popover.$el.style.left = left + _left + 'px'
      popover.$el.style.top = top1 + top2 + _top3 + 10 + 'px'
      // 显示popover窗口
      popover.doShow()
    },
    getQuestionId(type) {
      if (this.QuestionTotal.length > 0) {
        return this.QuestionTotal.find(item => { return item.applicationScenarioName == type })
      }
    },
  },
}
</script>