<template>
  <div>
    <div class="box" style="height: 1080px"></div>
    <el-popover placement="bottom" width="524" trigger="hover">
      <p class="p-1">用于解决专利主体(专利权人)的专利无形资产的评估与运营的相关专利分析，包括：专利盘点与专利运维。</p>
      <p class="p-1">专利盘点是指根据专利撰写质量、专利与产品的关联度强弱、专利对产品的涵盖度深浅等方向进行专利分类分级管理和专利布局优化分析。专利布局优化分析方向主要包括已有申请的权利要求优化/已有技术是否全部专利覆盖/已有专利是否足够保护产品。</p>
      <p class="p-1">专利运维是指根据专利盘点结果规划专利运营策略与专利维持策略，包括：针对性的专利布局优化策略的制定、专利维持或放弃的判断、许可谈判策略的制定、专利成果的转化等商业策略的制定。</p>
      <div class="b-0 t-4 c-1 c-p" slot="reference">
        <span class="no-star" v-if="!questionName && $permission('/workspace/event')"></span><span>专利盘点与运维<span v-if="questionName" class="q-1">({{ questionName }})</span></span>
        <el-popover placement="right" width="524" trigger="click" v-if="!questionName && $permission('/workspace/event')">
          <Question v-on="$listeners" :type="getQuestionId('专利盘点与运维')"></Question>
          <div class="o1 n-1" slot="reference">
            <el-tooltip class="item" effect="dark" content="相关事件数量" placement="top">
              <span>{{ getQuestionTotal('专利盘点与运维') }}</span>
            </el-tooltip>
            </div>
        </el-popover>
      </div>
    </el-popover>
    <div class="t-2 b-1 c-3">了解专利主体在行业中的地位和技术的优劣势</div>
    <div class="t-2 b-1 c-4">了解目标国家/地区对该技术相关产业发展态度，机遇及风险</div>
    <div class="t-2 b-1 c-5">了解该技术的产业发展概况，产品情况，企业合作情况</div>
    <div class="t-2 b-1 c-6">了解重点关注企业/潜在竞争企业的专利布局</div>
    <div class="t-2 b-1 c-7">了解重点关注技术方向的专利布局情况</div>
    <div class="t-2 b-1 c-8">做专利挖掘，找可布局专利的技术方向</div>
    <div class="t-2 b-1 c-9">定期了解关注企业/技术的发展情况</div>
    <div class="t-2 b-1 c-10">新颖性判别</div>
    <div class="t-1 b-2 c-11 c-p" @click="handleClick('产业/行业专利调查')">
      <span class="no-star"></span>
      <span>产业/行业专利调查</span>
      <span class="o n-1">{{ getTotal('产业/行业专利调查') }}</span>
    </div>
    <popover type="10" width="270">
      <div class="t-1 b-2 c-12 c-p" @click="handleClick('政策与市场环境分析')">
        <span class="no-star"></span>
        <span>政策与市场环境分析</span>
        <span class="o n-1">{{ getTotal('政策与市场环境分析') }}</span>
      </div>
    </popover>
    <popover type="9" width="270">
      <div class="t-1 b-2 c-13 c-p" @click="handleClick('产业/行业调查')">
        <span class="no-star"></span>
        <span>产业/行业调查</span>
        <span class="o n-1">{{ getTotal('产业/行业调查') }}</span>
      </div>
    </popover>
    <popover type="1" width="270">
      <div class="t-1 b-2 c-14 c-p" @click="handleClick('公司调查')">
        <span class="no-star"></span>
        <span>公司调查</span>
        <span class="o n-1">{{ getTotal('公司调查') }}</span>
      </div>
    </popover>
    <popover type="3" width="270">
      <div class="t-1 b-2 c-15 c-p" @click="handleClick('重点技术专利调查')">
        <span class="no-star"></span>
        <span>重点技术专利调查</span>
        <span class="o n-1">{{ getTotal('重点技术专利调查') }}</span>
      </div>
    </popover>
    <div class="t-1 b-2 c-16 c-p" @click="handleClick('定期专利监控公报')">
      <span class="no-star"></span>
      <span>定期专利监控公报</span>
      <span class="o n-1">{{ getTotal('定期专利监控公报') }}</span>
    </div>
    <popover type="12" width="530">
      <div class="t-1 b-2 c-17 c-p" @click="handleClick('专利挖掘/技术交底')">
        <span class="no-star"></span>
        <span>专利挖掘<br>技术交底书</span>
        <span class="o n-1">{{ getTotal('专利挖掘') }}</span>
      </div>
    </popover>
    <div class="t-1 b-2 c-18 c-p" @click="handleClick('技术查新')">
      <span class="no-star"></span>
      <span>技术查新</span>
      <span class="o n-1">{{ getTotal('技术查新') }}</span>
    </div>
    <div class="t-1 b-2 c-19 c-p" @click="handleClick('专利运营')">
      <span class="no-star"></span>
      <span>
        <span>专利运营</span><br>
        <span class="t-3">专利价值实现</span>
      </span>
      <span class="o n-1">{{ getTotal('专利运营') }}</span>
    </div>
    <div class="t-2 b-3 c-20">了解专利与产品的对应情况</div>
    <div class="t-2 b-3 c-22">专利质量、专利与产品涵盖度、关联度进行划分</div>
    <div class="t-2 b-3 c-21">专利质量、专利与产品涵盖度、关联度进行优化</div>
    <div class="t-1 b-4 c-23 c-p" @click="handleClick('产品/技术拆解')">
      <span class="star"></span>
      <span>产品/技术拆解</span>
      <span class="o n-2">{{ getTotal('产品/技术拆解') }}</span>
    </div>
    <div class="t-1 b-4 c-24 c-p" @click="handleClick('专利文本质量分析')">
      <span class="star"></span>
      <span>专利文本质量分析</span>
      <span class="o n-2">{{ getTotal('专利文本质量分析') }}</span>
    </div>
    <div class="t-1 b-4 c-25 c-p" @click="handleClick('专利与产品的对应关系')">
      <span class="star"></span>
      <span>专利与产品的<br>对应关系</span>
      <span class="o n-2">{{ getTotal('专利与产品的对应关系') }}</span>
    </div>
    <div class="t-1 b-4 c-26 c-p" @click="handleClick('专利布局优化分析')">
      <span class="star"></span>
      <span>专利布局优化分析</span>
      <span class="o n-2">{{ getTotal('专利布局优化分析') }}</span>
    </div>
    <div class="t-1 b-4 c-27 c-p" @click="handleClick('专利布局/专利申请')">
      <span class="star"></span>
      <span>专利布局/专利申请</span>
      <span class="o n-2">{{ getTotal('专利布局/专利申请') }}</span>
    </div>
    <div class="t-1 b-2 c-30">
      <span class="no-star"></span>
      <span>布局优化策略</span>
      <span class="o n-2" style="visibility: hidden"></span>
    </div>
    <div class="t-1 b-4 c-29 c-p" @click="handleClick('专利分类分级')">
      <span class="star"></span>
      <span>专利分类分级</span>
      <span class="o n-2">{{ getTotal('专利分类分级') }}</span>
    </div>
    <div class="t-1 b-2 c-28">
      <span class="no-star"></span>
      <span>运营策略</span>
      <span class="o n-2" style="visibility: hidden"></span>
    </div>
    <div class="t-1 b-2 c-31">
      <span class="no-star"></span>
      <span>专利维持策略</span>
      <span class="o n-2" style="visibility: hidden"></span>
    </div>
    <div class="c-32"></div>
    <div class="c-33"></div>
    <div class="c-34"></div>
    <div class="c-35"></div>
    <div class="c-36"></div>
    <div class="c-37"></div>
    <div class="c-38"></div>
    <div class="c-39"></div>
    <div class="c-40"></div>
    <div class="c-41"></div>
    <div class="c-42"></div>
    <div class="c-43"></div>
    <div class="c-44"></div>
    <div class="c-45"></div>
    <div class="c-46"></div>
    <div class="c-47"></div>
    <div class="c-48"></div>
    <div class="c-49"></div>
    <div class="c-50"></div>
    <div class="c-52"></div>
    <div class="c-53"></div>
    <div class="c-54"></div>
    <div class="c-55"></div>
    <div class="c-56"></div>
    <div class="c-57"></div>
    <div class="c-58"></div>
    <div class="c-59"></div>
    <div class="c-60"></div>
    <div class="c-61"></div>
    <div class="c-62"></div>
    <div class="c-63"></div>
    <div class="c-64"></div>
    <div class="c-65"></div>
    <div class="c-66"></div>
    <div class="c-67"></div>
    <div class="d-1 c-69"></div>
    <div class="d-1 c-70"></div>
    <div class="d-1 c-71"></div>
    <div class="d-1 c-72"></div>
    <div class="d-1 c-73"></div>
    <div class="d-1 c-74"></div>
    <div class="d-1 c-75"></div>
    <div class="d-1 c-76"></div>
    <div class="d-1 c-77"></div>
    <div class="d-5 c-78"></div>
    <div class="d-2 c-80"></div>
    <div class="d-2 c-81"></div>
    <div class="d-2 c-82"></div>
    <div class="d-2 c-83"></div>
    <div class="d-2 c-84"></div>
    <div class="d-9 c-85"></div>
    <div class="d-5 c-86"></div>
    <div class="c-200"></div>
    <div class="d-2 c-201"></div>
    <div class="d-2 c-202"></div>
    <div class="d-2 c-203"></div>
    <div class="d-1 c-204"></div>
    <div class="d-3 c-205"></div>
  </div>
</template>

<script>
import mixins from "./mixins";
export default {
  mixins: [mixins]
}
</script>

<style lang="scss" scoped>
.c-1 {
  min-width: 524px;
  padding:0 10px;
  height: 100px;
  border-radius: 10px;
  background: #11acaf;
  top: 70px;
  left: 694px;
}
.c-2 {
  width: 524px;
  height: 66px;
  top: 160px;
  left: 694px;
}
.c-3 {
  width: 180px;
  height: 66px;
  top: 190px;
  left: 1000px;
}
.c-4 {
  width: 250px;
  height: 66px;
  top: 190px;
  left: 270px;
}
.c-5 {
  width: 250px;
  height: 66px;
  top: 190px;
  left: 1420px;
}
.c-6 {
  width: 200px;
  height: 66px;
  top: 355px;
  left: 1220px;
}
.c-7 {
  width: 170px;
  height: 66px;
  top: 355px;
  left: 1570px;
}
.c-8 {
  width: 170px;
  height: 66px;
  top: 530px;
  left: 1070px;
}
.c-9 {
  width: 100px;
  height: 66px;
  top: 553px;
  left: 1710px;
}
.c-10 {
  width: 512px;
  height: 66px;
  top: 640px;
  left: 1180px;
}
.c-11 {
  width: 300px;
  height: 80px;
  top: 255px;
  left: 1050px;
}
.c-12 {
  width: 300px;
  height: 80px;
  top: 255px;
  left: 100px;
}
.c-13 {
  width: 300px;
  height: 80px;
  top: 255px;
  left: 1500px;
}
.c-14 {
  width: 300px;
  height: 80px;
  top: 420px;
  left: 1050px;
}
.c-15 {
  width: 300px;
  height: 80px;
  top: 420px;
  left: 1400px;
}
.c-16 {
  width: 300px;
  height: 80px;
  top: 710px;
  left: 1560px;
}
.c-17 {
  width: 300px;
  height: 80px;
  top: 565px;
  left: 1230px;
}
.c-18 {
  width: 300px;
  height: 80px;
  top: 710px;
  left: 1230px;
}
.c-19 {
  width: 300px;
  height: 80px;
  top: 990px;
  left: 1230px;
}
.c-20 {
  width: 120px;
  height: 66px;
  top: 190px;
  left: 720px;
}
.c-21 {
  width: 200px;
  height: 66px;
  top: 500px;
  left: 320px;
}
.c-22 {
  width: 200px;
  height: 66px;
  top: 500px;
  left: 680px;
}
.c-23 {
  width: 300px;
  height: 80px;
  top: 255px;
  left: 550px;
}
.c-24 {
  width: 300px;
  height: 80px;
  top: 420px;
  left: 370px;
}
.c-25 {
  width: 300px;
  height: 80px;
  top: 420px;
  left: 730px;
}
.c-26 {
  width: 300px;
  height: 80px;
  top: 565px;
  left: 370px;
}

.c-27 {
  width: 300px;
  height: 80px;
  top: 845px;
  left: 1230px;
}
.c-28 {
  width: 300px;
  height: 80px;
  background-color: #E6A23C !important;
  top: 710px;
  left: 60px;
}
.c-29 {
  width: 300px;
  height: 80px;
  top: 565px;
  left: 730px;
}
.c-30 {
  width: 300px;
  height: 80px;
  background-color: #E6A23C !important;
  top: 710px;
  left: 370px;
}
.c-31 {
  width: 300px;
  height: 80px;
  background-color: #E6A23C !important;
  top: 710px;
  left: 680px;
}
.c-32 {
  width: 2px;
  height: 20px;
  background: #3084e5;
  top: 170px;
  left: 955px;
}
.c-33 {
  height: 2.7px;
  width: 1400px;
  background: #3084e5;
  top: 190px;
  left: 250px;
}
.c-34 {
  width: 2.7px;
  height: 60px;
  background: #3084e5;
  top: 190px;
  left: 250px;
}
.c-35 {
  width: 2px;
  height: 60px;
  background: #3084e5;
  top: 190px;
  left: 700px;
}
.c-36 {
  width: 2px;
  height: 60px;
  background: #3084e5;
  top: 190px;
  left: 1200px;
}
.c-37 {
  width: 2.7px;
  height: 60px;
  background: #3084e5;
  top: 190px;
  left: 1650px;
}
.c-38 {
  width: 2px;
  height: 80px;
  background: #3084e5;
  top: 330px;
  left: 1200px;
}
.c-39 {
  height: 2px;
  width: 350px;
  background: #3084e5;
  top: 360px;
  left: 1200px;
}
.c-40 {
  width: 2.7px;
  height: 50px;
  background: #3084e5;
  top: 360px;
  left: 1550px;
}
.c-41 {
  width: 2px;
  height: 60px;
  background: #d45a6a;
  top: 500px;
  left: 520px;
}
.c-42 {
  width: 2px;
  height: 30px;
  background: #3084e5;
  top: 500px;
  left: 1200px;
}
.c-43 {
  width: 2.7px;
  height: 30px;
  background: #3084e5;
  top: 500px;
  left: 1550px;
}
.c-44 {
  height: 2.7px;
  width: 352px;
  background: #3084e5;
  top: 530px;
  left: 1200px;
}
.c-45 {
  width: 2px;
  height: 60px;
  background: #3084e5;
  top: 640px;
  left: 1375px;
}
.c-46 {
  width: 2px;
  height: 60px;
  background: #3084e5;
  top: 925px;
  left: 1375px;
}
.c-47 {
  height: 2.5px;
  width: 330px;
  background: #3084e5;
  top: 545px;
  left: 1375px;
}
.c-48 {
  width: 2px;
  height: 60px;
  background: #d45a6a;
  top: 500px;
  left: 880px;
}
.c-49 {
  height: 2px;
  width: 45px;
  background: #3084e5;
  top: 460px;
  left: 1350px;
}
.c-51 {
  height: 2px;
  width: 159px;
  background: #3084e5;
  top: 969px;
  left: 501px;
}
.c-52 {
  width: 2px;
  height: 160px;
  background: #3084e5;
  top: 545px;
  left: 1703px;
}
.c-53 {
  width: 2px;
  height: 135px;
  background: #3084e5;
  top: 750px;
  left: 1703px;
}
.c-54 {
  width: 2px;
  height: 30px;
  background: #3084e5;
  top: 530px;
  left: 1375px;
}
.c-55 {
  width: 2px;
  height: 60px;
  background: #d45a6a;
  top: 780px;
  left: 1375px;
}
.c-56 {
  width: 2px;
  height: 30px;
  background: #d45a6a;
  top: 330px;
  left: 700px;
}
.c-57 {
  height: 2px;
  width: 360px;
  background: #d45a6a;
  top: 360px;
  left: 520px;
}
.c-58 {
  width: 2px;
  height: 55px;
  background: #d45a6a;
  top: 360px;
  left: 520px;
}
.c-59 {
  width: 2px;
  height: 55px;
  background: #d45a6a;
  top: 360px;
  left: 880px;
}
.c-60 {
  height: 2.7px;
  width: 170px;
  background: #3084e5;
  top: 885px;
  left: 1535px;
}
.c-61 {
  height: 2px;
  width: 620px;
  background: #d45a6a;
  top: 680px;
  left: 210px;
}
.c-62 {
  width: 2px;
  height: 25px;
  background: #d45a6a;
  top: 680px;
  left: 210px;
}
.c-63 {
  width: 2px;
  height: 25px;
  background: #d45a6a;
  top: 680px;
  left: 830px;
}
.c-64 {
  width: 2px;
  height: 137px;
  background: #d45a6a;
  top: 750px;
  left: 520px;
}
.c-65 {
  height: 2.7px;
  width: 700px;
  background: #d45a6a;
  top: 885px;
  left: 520px;
}
.c-66 {
  height: 2.7px;
  width: 1010px;
  background: #3084e5;
  top: 1030px;
  left: 210px;
}
.c-67 {
  width: 2.7px;
  height: 240px;
  background: #3084e5;
  top: 790px;
  left: 210px;
}
.c-68 {
  height: 2px;
  width: 26px;
  background: #d45a6a;
  top: 787px;
  left: 1225px;
}
.c-69 {
  top: 240px;
  left: 241px;
}
.c-70 {
  top: 240px;
  left: 691px;
}
.c-71 {
  top: 240px;
  left: 1191px;
}
.c-72 {
  top: 240px;
  left: 1641px;
}
.c-73 {
  top: 405px;
  left: 1541px;
}
.c-74 {
  top: 405px;
  left: 1191px;
}
.c-75 {
  top: 695px;
  left: 1366px;
}
.c-76 {
  top: 975px;
  left: 1366px;
}
.c-77 {
  top: 550px;
  left: 1366px;
}
.c-78 {
  top: 451px;
  left: 1385px;
}
.c-79 {
  top: 773px;
  left: 680px;
}
.c-80 {
  top: 405px;
  left: 511px;
}
.c-81 {
  top: 405px;
  left: 871px;
}
.c-82 {
  top: 695px;
  left: 201px;
}
.c-83 {
  top: 695px;
  left: 821px;
}
.c-84 {
  top: 830px;
  left: 1366px;
}
.c-85 {
  top: 876px;
  left: 1215px;
}
.c-86 {
  top: 1021px;
  left: 1215px;
}
.c-200 {
  width: 2px;
  height: 60px;
  background: #d45a6a;
  top: 640px;
  left: 520px;
}
.c-201 {
  top: 695px;
  left: 511px;
}
.c-202 {
  top: 550px;
  left: 511px;
}
.c-203 {
  top: 550px;
  left: 871px;
}
.c-204 {
  top: 695px;
  left: 1694px;
}
.c-205 {
  top: 876px;
  left: 1535px;
}
</style>