高亮

RMS-FrontEnd/src/App.vue

@@ -1,23 +1,150 @@
 <template>
   <div id="app">
     <router-view />
+    <div class="caidan" style ="display:none;"  v-if="$permission('/workspace/scratchWords')">
+          <div style="display: flex;align-items: center;">
+                <div class="dropbtn" :style='{"background-color":mark.color,"border-radius":"50%","width":"12px","height":"12px","margin-top":"1px"}'>
+                  <el-input type="color" v-model="mark.color"  style="opacity: 0;user-select:none;" @input="changeColor()"/>
+                </div>
+                &NonBreakingSpace;&NonBreakingSpace;&NonBreakingSpace;
+                <el-radio-group v-model="mark.scratchType">
+                  <el-radio :label="2" style="margin:0 10px;" @click.native.prevent="handleRadioClick(2)">波浪线</el-radio>
+                  <el-radio :label="0" style="margin-right: 10px;" @click.native.prevent="handleRadioClick(0)">下划线</el-radio>
+                  <el-radio :label="1" style="margin-right: 10px;font-size: 18px;" @click.native.prevent="handleRadioClick(1)">高亮</el-radio>
+                </el-radio-group>
+                &NonBreakingSpace;&NonBreakingSpace;
+                <a onclick="pizhu()" style="font-size: 14px;font-weight: 500;"> 批注</a>
+                &NonBreakingSpace;&NonBreakingSpace;
+                <a onclick="addDuiBi()" v-if="!mark.id" style="font-size: 14px;font-weight: 500;">对比</a>
+              <!-- &NonBreakingSpace;&NonBreakingSpace; -->
+                <!-- <a @click="addOpinion" >陈述意见</a>
+              &NonBreakingSpace;&NonBreakingSpace; -->
+                <!-- <a onclick="hiddenPizhu()"></a> -->
+                &NonBreakingSpace;&NonBreakingSpace;
+                <a v-if="mark.id" @click="hiddenPiZhuDelete" style="font-size: 14px;font-weight: 500;">删除</a>
+                &NonBreakingSpace;&NonBreakingSpace;
+          </div>
+    </div>
+    <!-- <div class="pizhu"></div> -->
+    <piZhu :gaoLiangCaiDan="gaoLiangCaiDan" :piZhuDelete="piZhuDelete"></piZhu>
   </div>
 </template>
 
 <script>
+import piZhu from '@/views/components/gaoliang/components/pizhu.vue'
 export default {
   name: 'app',
   components: {
+    piZhu,
+  },
+  data() {
+    return {
+      gaoLiangCaiDan:false,
+      piZhuDelete:false,
+    }
+  },
+  computed:{
+    mark() {
+      return this.$store.state.patent.index || {
+        rangeType:[]
+      }
+    },
+    contrastList() {
+      return this.$store.state.report.contrastList
+    },
   },
   created() {
 
   },
+  mounted() {
+    document.addEventListener('mousedown',function(e){
+      let btn = document.getElementsByClassName("caidan");
+      // let box = document.getElementsByClassName('pizhu')
+      if(btn[0].style.display!='none'){
+        if ( !btn[0].contains(e.target)) {
+          btn[0].setAttribute("style", "display:none;");
+        }
+      }
+    })
+  },
   methods: {
-
+    changeColor(){},
+    changeRadio(val) {
+      this.mark.scratchType = val
+      // 仅自己可见仅本专题或本报告可见
+      this.mark.permissionType=0
+      this.mark.rangeType = true
+      this.gaoLiangCaiDan = !this.gaoLiangCaiDan
+      this.handleCaiDan()
+    },
+    // 在el-radio-group无法对默认项点击
+    handleRadioClick(val) {
+      this.changeRadio(val)
+    },
+    handleCaiDan() {
+      let btn = document.getElementsByClassName("caidan");
+      if(btn[0].style.display!='none'){
+        btn[0].setAttribute("style", "display:none;");
+      }
+    },
+    hiddenPiZhuDelete() {
+      this.piZhuDelete = !this.piZhuDelete
+      this.handleCaiDan()
+    },
   }
 }
 </script>
 
+<style lang="scss">
+.opinion .el-form-item{
+  margin-bottom: 10px;
+  .el-form-item__content,.el-form-item__label{
+    line-height: normal;
+    min-height: 30px;
+  }
+}
+.caidan{
+  user-select:none;
+  a{
+    user-select:none;
+    cursor: pointer;
+  }
+  .el-radio__inner{
+    display: none;
+  }
+}
+.showPiZhu{
+  position: absolute;
+  background: rgb(255 249 199);
+  left:0;
+  width:200px;
+  box-shadow: 5px 5px 5px rgb(227, 227, 75);
+  padding: 5px;
+  border-radius: 5px;
+}
+.pizhuLightHeigh{
+  position: relative;
+  background: #409EFF !important;
+}
+
+.greenColor{
+  background: #409EFF !important;
+}
+
+   .jinzhi{
+    cursor: not-allowed;
+    pointer-events:none;
+  }
+  .el-dropdown .el-button-group .el-button--primary:first-child{
+    padding: 0;
+    p{
+      margin: 0;
+      width: 50px;
+      line-height: 30px;
+      height: 30px;
+    }
+  }
+</style>
 <style lang="less">
 // .el-main > *{
 //   height: 100%;

RMS-FrontEnd/src/api/highlight.js

@@ -0,0 +1,28 @@
+import axios from '@/utils/axios'
+
+export default {
+  /**
+   * 新增标注
+   */
+  scratchWordsAdd(params) {
+    return axios.post('/v2/scratchWords/add', params)
+  },
+  /**
+   * 查询标注
+   */
+  scratchWordsQuery(params) {
+    return axios.post('/v2/scratchWords/query', params)
+  },
+  /**
+   * 更新标注
+   */
+  scratchWordsUpdate(params) {
+    return axios.post('/v2/scratchWords/update', params)
+  },
+  /**
+   * 删除标注
+   */
+  scratchWordsDelete(params) {
+    return axios.post('/v2/scratchWords/delete', params)
+  },
+}

RMS-FrontEnd/src/api/index.js

@@ -5,7 +5,8 @@ import patent from './patent';
 import permission from './permission';
 import product from './product';
 import matters from './matters';
-import task from './task'
+import task from './task';
+import highlight from './highlight';
 
 export default {
   ...report,
@@ -14,5 +15,6 @@ export default {
   ...permission,
   ...product,
   ...matters,
-  ...task
+  ...task,
+  ...highlight,
 }

RMS-FrontEnd/src/icons/icon/demo.css

@@ -0,0 +1,539 @@
+/* Logo 字体 */
+@font-face {
+  font-family: "iconfont logo";
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
+}
+
+.logo {
+  font-family: "iconfont logo";
+  font-size: 160px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* tabs */
+.nav-tabs {
+  position: relative;
+}
+
+.nav-tabs .nav-more {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 42px;
+  line-height: 42px;
+  color: #666;
+}
+
+#tabs {
+  border-bottom: 1px solid #eee;
+}
+
+#tabs li {
+  cursor: pointer;
+  width: 100px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  font-size: 16px;
+  border-bottom: 2px solid transparent;
+  position: relative;
+  z-index: 1;
+  margin-bottom: -1px;
+  color: #666;
+}
+
+
+#tabs .active {
+  border-bottom-color: #f00;
+  color: #222;
+}
+
+.tab-container .content {
+  display: none;
+}
+
+/* 页面布局 */
+.main {
+  padding: 30px 100px;
+  width: 960px;
+  margin: 0 auto;
+}
+
+.main .logo {
+  color: #333;
+  text-align: left;
+  margin-bottom: 30px;
+  line-height: 1;
+  height: 110px;
+  margin-top: -50px;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.main .logo a {
+  font-size: 160px;
+  color: #333;
+}
+
+.helps {
+  margin-top: 40px;
+}
+
+.helps pre {
+  padding: 20px;
+  margin: 10px 0;
+  border: solid 1px #e7e1cd;
+  background-color: #fffdef;
+  overflow: auto;
+}
+
+.icon_lists {
+  width: 100% !important;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.icon_lists li {
+  width: 100px;
+  margin-bottom: 10px;
+  margin-right: 20px;
+  text-align: center;
+  list-style: none !important;
+  cursor: default;
+}
+
+.icon_lists li .code-name {
+  line-height: 1.2;
+}
+
+.icon_lists .icon {
+  display: block;
+  height: 100px;
+  line-height: 100px;
+  font-size: 42px;
+  margin: 10px auto;
+  color: #333;
+  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
+  -moz-transition: font-size 0.25s linear, width 0.25s linear;
+  transition: font-size 0.25s linear, width 0.25s linear;
+}
+
+.icon_lists .icon:hover {
+  font-size: 100px;
+}
+
+.icon_lists .svg-icon {
+  /* 通过设置 font-size 来改变图标大小 */
+  width: 1em;
+  /* 图标和文字相邻时，垂直对齐 */
+  vertical-align: -0.15em;
+  /* 通过设置 color 来改变 SVG 的颜色/fill */
+  fill: currentColor;
+  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
+      normalize.css 中也包含这行 */
+  overflow: hidden;
+}
+
+.icon_lists li .name,
+.icon_lists li .code-name {
+  color: #666;
+}
+
+/* markdown 样式 */
+.markdown {
+  color: #666;
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.highlight {
+  line-height: 1.5;
+}
+
+.markdown img {
+  vertical-align: middle;
+  max-width: 100%;
+}
+
+.markdown h1 {
+  color: #404040;
+  font-weight: 500;
+  line-height: 40px;
+  margin-bottom: 24px;
+}
+
+.markdown h2,
+.markdown h3,
+.markdown h4,
+.markdown h5,
+.markdown h6 {
+  color: #404040;
+  margin: 1.6em 0 0.6em 0;
+  font-weight: 500;
+  clear: both;
+}
+
+.markdown h1 {
+  font-size: 28px;
+}
+
+.markdown h2 {
+  font-size: 22px;
+}
+
+.markdown h3 {
+  font-size: 16px;
+}
+
+.markdown h4 {
+  font-size: 14px;
+}
+
+.markdown h5 {
+  font-size: 12px;
+}
+
+.markdown h6 {
+  font-size: 12px;
+}
+
+.markdown hr {
+  height: 1px;
+  border: 0;
+  background: #e9e9e9;
+  margin: 16px 0;
+  clear: both;
+}
+
+.markdown p {
+  margin: 1em 0;
+}
+
+.markdown>p,
+.markdown>blockquote,
+.markdown>.highlight,
+.markdown>ol,
+.markdown>ul {
+  width: 80%;
+}
+
+.markdown ul>li {
+  list-style: circle;
+}
+
+.markdown>ul li,
+.markdown blockquote ul>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown>ul li p,
+.markdown>ol li p {
+  margin: 0.6em 0;
+}
+
+.markdown ol>li {
+  list-style: decimal;
+}
+
+.markdown>ol li,
+.markdown blockquote ol>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown code {
+  margin: 0 3px;
+  padding: 0 5px;
+  background: #eee;
+  border-radius: 3px;
+}
+
+.markdown strong,
+.markdown b {
+  font-weight: 600;
+}
+
+.markdown>table {
+  border-collapse: collapse;
+  border-spacing: 0px;
+  empty-cells: show;
+  border: 1px solid #e9e9e9;
+  width: 95%;
+  margin-bottom: 24px;
+}
+
+.markdown>table th {
+  white-space: nowrap;
+  color: #333;
+  font-weight: 600;
+}
+
+.markdown>table th,
+.markdown>table td {
+  border: 1px solid #e9e9e9;
+  padding: 8px 16px;
+  text-align: left;
+}
+
+.markdown>table th {
+  background: #F7F7F7;
+}
+
+.markdown blockquote {
+  font-size: 90%;
+  color: #999;
+  border-left: 4px solid #e9e9e9;
+  padding-left: 0.8em;
+  margin: 1em 0;
+}
+
+.markdown blockquote p {
+  margin: 0;
+}
+
+.markdown .anchor {
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  margin-left: 8px;
+}
+
+.markdown .waiting {
+  color: #ccc;
+}
+
+.markdown h1:hover .anchor,
+.markdown h2:hover .anchor,
+.markdown h3:hover .anchor,
+.markdown h4:hover .anchor,
+.markdown h5:hover .anchor,
+.markdown h6:hover .anchor {
+  opacity: 1;
+  display: inline-block;
+}
+
+.markdown>br,
+.markdown>p>br {
+  clear: both;
+}
+
+
+.hljs {
+  display: block;
+  background: white;
+  padding: 0.5em;
+  color: #333333;
+  overflow-x: auto;
+}
+
+.hljs-comment,
+.hljs-meta {
+  color: #969896;
+}
+
+.hljs-string,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-strong,
+.hljs-emphasis,
+.hljs-quote {
+  color: #df5000;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-type {
+  color: #a71d5d;
+}
+
+.hljs-literal,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-attribute {
+  color: #0086b3;
+}
+
+.hljs-section,
+.hljs-name {
+  color: #63a35c;
+}
+
+.hljs-tag {
+  color: #333333;
+}
+
+.hljs-title,
+.hljs-attr,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #795da3;
+}
+
+.hljs-addition {
+  color: #55a532;
+  background-color: #eaffea;
+}
+
+.hljs-deletion {
+  color: #bd2c00;
+  background-color: #ffecec;
+}
+
+.hljs-link {
+  text-decoration: underline;
+}
+
+/* 代码高亮 */
+/* PrismJS 1.15.0
+https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
+/**
+ * prism.js default theme for JavaScript, CSS and HTML
+ * Based on dabblet (http://dabblet.com)
+ * @author Lea Verou
+ */
+code[class*="language-"],
+pre[class*="language-"] {
+  color: black;
+  background: none;
+  text-shadow: 0 1px white;
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  word-wrap: normal;
+  line-height: 1.5;
+
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  tab-size: 4;
+
+  -webkit-hyphens: none;
+  -moz-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+}
+
+pre[class*="language-"]::-moz-selection,
+pre[class*="language-"] ::-moz-selection,
+code[class*="language-"]::-moz-selection,
+code[class*="language-"] ::-moz-selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+pre[class*="language-"]::selection,
+pre[class*="language-"] ::selection,
+code[class*="language-"]::selection,
+code[class*="language-"] ::selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+@media print {
+
+  code[class*="language-"],
+  pre[class*="language-"] {
+    text-shadow: none;
+  }
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+  padding: 1em;
+  margin: .5em 0;
+  overflow: auto;
+}
+
+:not(pre)>code[class*="language-"],
+pre[class*="language-"] {
+  background: #f5f2f0;
+}
+
+/* Inline code */
+:not(pre)>code[class*="language-"] {
+  padding: .1em;
+  border-radius: .3em;
+  white-space: normal;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: slategray;
+}
+
+.token.punctuation {
+  color: #999;
+}
+
+.namespace {
+  opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #9a6e3a;
+  background: hsla(0, 0%, 100%, .5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: #07a;
+}
+
+.token.function,
+.token.class-name {
+  color: #DD4A68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+  color: #e90;
+}
+
+.token.important,
+.token.bold {
+  font-weight: bold;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+.token.entity {
+  cursor: help;
+}

RMS-FrontEnd/src/icons/icon/iconfont.json

@@ -0,0 +1,44 @@
+{
+  "id": "4145129",
+  "name": "icon1",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "383629",
+      "name": "信息",
+      "font_class": "xinxi4",
+      "unicode": "e623",
+      "unicode_decimal": 58915
+    },
+    {
+      "icon_id": "7872852",
+      "name": "信息",
+      "font_class": "xinxi1",
+      "unicode": "e644",
+      "unicode_decimal": 58948
+    },
+    {
+      "icon_id": "8289020",
+      "name": "信息",
+      "font_class": "xinxi2",
+      "unicode": "e86f",
+      "unicode_decimal": 59503
+    },
+    {
+      "icon_id": "12685022",
+      "name": "标记",
+      "font_class": "icon_huabanfuben",
+      "unicode": "e62f",
+      "unicode_decimal": 58927
+    },
+    {
+      "icon_id": "23949533",
+      "name": "信息",
+      "font_class": "xinxi3",
+      "unicode": "ec68",
+      "unicode_decimal": 60520
+    }
+  ]
+}

RMS-FrontEnd/src/main.js

@@ -18,7 +18,7 @@ require('./assets/css/fix.scss')
 require('./assets/css/layout.less')
 import './icons'
 import lodash from 'lodash'
-
+import "@/icons/icon/iconfont.css"
 import {hasPermission} from './directives/permission';
 Vue.prototype.$permission = hasPermission
 

RMS-FrontEnd/src/store/modules/patent.js

@@ -6,7 +6,15 @@ export default {
     records: [],
     menuLoading: false,
     highlight: {},
-    queryData: []
+    queryData: [],
+    index:{
+      color:'#ff0000',
+      scratchType:2,
+      permissionType:1,
+      rangeType:true,
+      content:'',
+      remark:'',//标注文本
+    },
   },
 
   mutations: {
@@ -30,6 +38,9 @@ export default {
     },
     SET_PATENT_QUERY_DATA(state, queryData) {
       state.queryData = queryData
+    },
+    SET_PATENT_INDEX(state, index){
+      state.index = index
     }
   },
 

RMS-FrontEnd/src/store/modules/report.js

@@ -8,9 +8,13 @@ export default {
     form: {},
     patentList: [],
     contrastList:[],
+    pizhucontrastList:[],
   },
 
   mutations: {
+    SET_PATENT_PIZHU_CONTRAST:(state, pizhucontrastList)=>{
+      state.pizhucontrastList = pizhucontrastList
+    },
     SET_PATENT_CONTRAST:(state, contrastList)=>{
       state.contrastList = contrastList
     },

RMS-FrontEnd/src/views/components/articles/components/PatentBasic.vue

@@ -80,14 +80,14 @@
             <el-tabs value="0">
               <el-tab-pane label="著录项目" name="0">
                 <el-descriptions :column=2>
-                <el-descriptions-item label="申请号"><div class="patent-basic-value" data-type="申请号" v-html="getViewDom(patent.applicationNo,'申请号')"></div></el-descriptions-item>
-                <el-descriptions-item label="申请日"><div class="patent-basic-value" data-type="申请日" v-html="getViewDom(patent.applicationDate,'申请日')"></div></el-descriptions-item>
-                <el-descriptions-item label="公开号"><div class="patent-basic-value" data-type="公开号" v-html="getViewDom(patent.publicNo,'公开号')"></div></el-descriptions-item>
-               <el-descriptions-item label="公开日"><div class="patent-basic-value" data-type="公开日" v-html="getViewDom(patent.publicDate,'公开日')"></div></el-descriptions-item>
+                <el-descriptions-item label="申请号"><div class="patent-basic-value"  v-html="getViewDom(patent.applicationNo,'申请号')"></div></el-descriptions-item>
+                <el-descriptions-item label="申请日"><div class="patent-basic-value"  v-html="getViewDom(patent.applicationDate,'申请日')"></div></el-descriptions-item>
+                <el-descriptions-item label="公开号"><div class="patent-basic-value"  v-html="getViewDom(patent.publicNo,'公开号')"></div></el-descriptions-item>
+               <el-descriptions-item label="公开日"><div class="patent-basic-value"  v-html="getViewDom(patent.publicDate,'公开日')"></div></el-descriptions-item>
              
-                <el-descriptions-item label="授权号" v-if="patent.publicAccreditNo"><div class="patent-basic-value" data-type="授权号" v-html="getViewDom(patent.publicAccreditNo,'授权号')"></div></el-descriptions-item>
-                <el-descriptions-item label="授权日" v-if="patent.publicAccreditDate"><div class="patent-basic-value" data-type="授权日" v-html="getViewDom(patent.publicAccreditDate,'授权日')"></div></el-descriptions-item>
-                <el-descriptions-item label="优先权" v-if="patent.priorityNo"><div class="patent-basic-value" data-type="优先权" v-html="getViewDom(patent.priorityNo,'优先权')+ '&nbsp;&nbsp;&nbsp;&nbsp;' +getViewDom(patent.priorityDate,'优先权')"></div></el-descriptions-item>
+                <el-descriptions-item label="授权号" v-if="patent.publicAccreditNo"><div class="patent-basic-value"  v-html="getViewDom(patent.publicAccreditNo,'授权号')"></div></el-descriptions-item>
+                <el-descriptions-item label="授权日" v-if="patent.publicAccreditDate"><div class="patent-basic-value"  v-html="getViewDom(patent.publicAccreditDate,'授权日')"></div></el-descriptions-item>
+                <el-descriptions-item label="优先权" v-if="patent.priorityNo"><div class="patent-basic-value"  v-html="getViewDom(patent.priorityNo,'优先权')+ '&nbsp;&nbsp;&nbsp;&nbsp;' +getViewDom(patent.priorityDate,'优先权')"></div></el-descriptions-item>
             </el-descriptions>
               </el-tab-pane>
             </el-tabs>
@@ -105,26 +105,26 @@
               <el-tab-pane label="相关人" name="0">
                 <el-descriptions :column="1">
                 <el-descriptions-item label="申请人" labelStyle="width:90px" v-if="patent.applicant" contentStyle="display:flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;">
-                   <div class="patent-basic-value" v-for="item in patent.applicant.filter(a => a.dataType === 2)"  data-type="申请人" v-html="getViewDom(item.name,'申请人')+'(标：'+getViewDom(item.shortName,'申请人')+')&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
+                   <div class="patent-basic-value" v-for="item in patent.applicant.filter(a => a.dataType === 2)"   v-html="getViewDom(item.name,'申请人')+'(标：'+getViewDom(item.shortName,'申请人')+')&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
                 </el-descriptions-item>
                 <el-descriptions-item label="申请人地址" labelStyle="width:90px" v-if="patent.applicant">
-                   <div class="patent-basic-value" v-for="(item,index) in patent.applicant.filter(a => a.dataType === 2)"  v-if="index==0" data-type="申请人地址" v-html="getViewDom(item.addressStr,'申请人地址')"></div>
+                   <div class="patent-basic-value" v-for="(item,index) in patent.applicant.filter(a => a.dataType === 2)"  v-if="index==0"  v-html="getViewDom(item.addressStr,'申请人地址')"></div>
                 </el-descriptions-item>
                <el-descriptions-item label="权利人" labelStyle="width:90px" v-if="patent.applicant" contentStyle="display:flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;">
-                 <div class="patent-basic-value" v-for="item in patent.applicant.filter(a => a.dataType === 1)" data-type="权利人" v-html="getViewDom(item.name,'权利人')+'(标：'+getViewDom(item.shortName,'权利人')+')&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
+                 <div class="patent-basic-value" v-for="item in patent.applicant.filter(a => a.dataType === 1)"  v-html="getViewDom(item.name,'权利人')+'(标：'+getViewDom(item.shortName,'权利人')+')&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
                </el-descriptions-item>
                 <el-descriptions-item label="权利人地址" labelStyle="width:90px" v-if="patent.applicant">
-                  <div class="patent-basic-value" v-for="(item,key) in patent.applicant.filter(a => a.dataType === 1)" v-if="key==0" data-type="权利人地址" v-html="getViewDom(item.addressStr,'权利人地址')"></div>
+                  <div class="patent-basic-value" v-for="(item,key) in patent.applicant.filter(a => a.dataType === 1)" v-if="key==0"  v-html="getViewDom(item.addressStr,'权利人地址')"></div>
                 </el-descriptions-item>
                
                 <el-descriptions-item label="发明人" labelStyle="width:90px" contentStyle="display:flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;">
-                  <div class="patent-basic-value" v-for="item in patent.inventor" data-type="发明人" v-html="getViewDom(item.name,'发明人')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
+                  <div class="patent-basic-value" v-for="item in patent.inventor"  v-html="getViewDom(item.name,'发明人')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
                 </el-descriptions-item>
                 <el-descriptions-item label="代理人" labelStyle="width:90px" v-if="patent.agent">
-                  <div class="patent-basic-value" v-for="item in patent.agent" data-type="代理人" v-html="getViewDom(item.name,'代理人')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
+                  <div class="patent-basic-value" v-for="item in patent.agent"  v-html="getViewDom(item.name,'代理人')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
                 </el-descriptions-item>
                 <el-descriptions-item label="代理机构" labelStyle="width:90px" v-if="patent.agency">
-                   <div v-if="patent.agency" class="patent-basic-value" data-type="代理机构" v-html="getViewDom(patent.agency.name,'代理机构')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
+                   <div v-if="patent.agency" class="patent-basic-value"  v-html="getViewDom(patent.agency.name,'代理机构')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
                 </el-descriptions-item>
             </el-descriptions>
               </el-tab-pane>
@@ -143,7 +143,7 @@
               <el-tab-pane label="分类号" name="0"  v-if="patent.ipcList">
                 <el-descriptions :column=1>
                 <el-descriptions-item label="IPC分类号" contentStyle="display:flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;">
-                  <div class="patent-basic-value" v-for="item in patent.ipcList" data-type="IPC分类号" v-html="getViewDom(item,'IPC分类号')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
+                  <div class="patent-basic-value" v-for="item in patent.ipcList"  v-html="getViewDom(item,'IPC分类号')+ '&nbsp;&nbsp;&nbsp;&nbsp;'"></div>
                 </el-descriptions-item>
             </el-descriptions>
               </el-tab-pane>

RMS-FrontEnd/src/views/components/articles/components/PatentInstruction.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="patent-instruction" @mouseup="mouseup" @mousemove="mousemove">
-    <el-tabs value="0">
+    <el-tabs v-model="name">
       <el-tab-pane label="原文" name="0" :style="{height: height + 'px',overflowY: 'auto'}">
         <p class="common" v-if="patent.instruction" data-type="说明书文本原文" v-html="getViewDom(patent.instruction.manual,'说明书文本原文')"></p>
       </el-tab-pane>

RMS-FrontEnd/src/views/components/articles/components/PatentMark.vue

@@ -0,0 +1,120 @@
+<template>
+  <div class="content">
+    <div class="item" v-for="item in patentMark" :key="item.id" :style="{'background':item.color}">
+      <el-popover
+        placement="bottom"
+        width="200"
+        trigger="hover">
+      <div>
+        <p><span style="color: #409EFF;">栏位：</span><span>{{ item.scratchField }}</span></p>
+        <!-- <p>栏位：{{ item.scratchField }}</p> -->
+        <p><span style="color: #409EFF;">选中文本：</span>{{ item.text }}</p>
+        <p v-if="item.remark"><span style="color: #409EFF;">标注：</span>{{ item.remark }}</p>
+      </div>
+      <div slot="reference" style="height:100%;width:100%" @click.prevent.stop="runTo(item)"></div>
+      </el-popover>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props:['patentNo'],
+  data() {
+    return {
+      patentMark:[]
+    }
+  },
+  computed: {
+    // contrastList() {
+    //   return this.$store.state.report.contrastList
+    // },
+    pizhucontrastList() {
+      return this.$store.state.report.pizhucontrastList
+    }
+  },
+  watch: {
+    // 'contrastList'(val) {
+    //   this.getPatentMark()
+    // },
+    'pizhucontrastList'(val) {
+      this.getPatentMark()
+    },
+    patentNo(val) {
+      this.getPatentMark()
+    },
+  },
+  mounted() {
+    this.getPatentMark()
+  },
+  methods: {
+    getPatentMark() {
+      this.$nextTick(() => {
+        this.patentMark=[]
+        var a = ['摘要', '权利要求', '说明书']
+        var b = this.pizhucontrastList.filter(item => {
+          return item.patentNo == this.patentNo
+        })
+        /**方案一 */
+        // a.forEach(item => {
+        //   b.forEach((item2, index) => {
+        //     if (item2.scratchField.indexOf(item) != -1) {
+        //       this.patentMark.push(item2)
+        //       // 每次都需要重新遍历全部，优化
+        //     }
+        //   })
+        // })
+        /**方案二 */
+        // var c = []
+        // a.forEach((item,index) => {
+        //   c[index] = []
+        // })
+        // b.forEach((item2) => {
+        //   var index = a.findIndex(item => { return item2.scratchField.indexOf(item) != -1 })
+        //   c[index].push(item2)
+        // })
+        // a.forEach((item,index) => {
+        //   c[index].sort((a, b) => {
+        //     return (a.position + a.text.length) - (b.position + b.text.length)
+        //   })
+        // })
+        // this.patentMark = [].concat(...c)
+        /**方案三 */
+        // this.patentMark=b.sort((x,y)=>{
+        //     return a.findIndex(item=>{return x.scratchField.indexOf(item)!=-1}) - a.findIndex(item=>{return y.scratchField.indexOf(item)!=-1})
+        // })
+        /**方案四 */
+        var c = []
+        a.forEach((item,index) => {
+          c[index] = b.filter(item2 => {
+            return item2.scratchField.indexOf(item) != -1  
+          })
+          c[index].sort((a, b) => {
+            return a.position - b.position
+          })
+        })
+        this.patentMark = [].concat(...c)
+      })
+    },
+    runTo(val) {
+      this.$emit('biaozhu',val)
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.item{
+  width: 8px;
+  height: 8px;
+  border: 1px solid black;
+  margin:2px 2px;
+}
+.content{
+  max-width: 300px;
+  max-height: 50px;
+  overflow: auto;
+  display: flex;
+  flex-wrap: wrap;
+}
+</style>

RMS-FrontEnd/src/views/components/articles/components/PatentRight.vue

@@ -1,15 +1,17 @@
 <template>
   <div class="patent-articles-patent-right" @mouseup="mouseup" @mousemove="mousemove">
-    <el-tabs value="0">
+    <el-tabs v-model="name">
       <el-tab-pane label="原文" name="0" :style="{height: height + 'px',overflowY: 'auto'}">
-        <p class="common" v-for="(item, index) in records.original">
+        <!-- <p class="common" v-for="(item, index) in records.original">
           <span v-if="item" :data-type="'权利要求原文'+(index+1)"  v-html="getViewDom(item,'权利要求原文'+(index+1))"></span>
-        </p>
+        </p> -->
+        <div v-html="getViewDom1(patent.rights,'权利要求原文','content')"  data-type="权利要求原文"></div>
       </el-tab-pane>
       <el-tab-pane label="译文" name="1" :style="{height: height + 'px',overflowY: 'auto'}">
-        <p class="common" v-for="(item, index) in records.translation">
+        <!-- <p class="common" v-for="(item, index) in records.translation">
           <span v-if="item"  :data-type="'权利要求译文'+(index+1)"  v-html="getViewDom(item,'权利要求译文'+(index+1))"></span>
-        </p>
+        </p> -->
+        <div v-html="getViewDom1(patent.rights,'权利要求原文','contentOut')"  data-type="权利要求译文"></div>
       </el-tab-pane>
       <el-tab-pane v-if="signPatentNo" label="权利特征" name="2" :style="{height: height + 'px',overflowY: 'auto'}">
           <Features :patentNo="signPatentNo" :reportId="reportId"></Features>

RMS-FrontEnd/src/views/components/articles/components/mixins.js

@@ -66,7 +66,7 @@ export const commonMixins = {
   }
 }
 
-export const addContrast = {
+export const addContrast1 = {
     props:['isTrue','type1','reportType'],
   data() {
     return {
@@ -88,7 +88,7 @@ export const addContrast = {
   mounted() {
     document.onselectionchange = () => {
       this.isSelecting=true;
-   };
+    };
   },
   watch:{
     isTrue(val){
@@ -700,4 +700,270 @@ export const addContrast = {
 
    
   }
+}
+
+export const addContrast = {
+  props:['reportId','activeName'],
+  data() {
+    return {
+      mX: 0,
+      mY: 0,
+      isSelecting: false,
+      anchorOffset: 0,
+      currentSelectObj:{},
+      contrast: {},
+      currentColor:null,
+      duiBiCurrentSelectObj: {},
+      name:this.activeName,
+    }
+  },
+  computed: {
+    index() {
+      return JSON.stringify(this.$store.state.patent.index)
+    },
+    contrastList() {
+      return this.$store.state.report.contrastList
+    },
+  },
+  watch: {
+    index(val) {
+      var index1 = JSON.parse(val)
+      this.currentColor = index1.color
+    },
+    activeName(val) {
+      this.name = val
+    },
+  },
+  mounted() {
+    window.pizhu = this.pizhu
+    window.hiddenPizhu = this.hiddenPizhu
+    window.selectMark = this.selectMark
+    window.addDuiBi = this.addDuiBi
+  },
+  methods: {
+    // 点击对比按钮
+    addDuiBi() {
+      this.duiBiCurrentSelectObj=this.$store.state.patent.index
+      // open打开弹窗
+      if (this.duiBiCurrentSelectObj.Id) {
+        this.$emit('openContrast',this.duiBiCurrentSelectObj)
+      }
+    },
+    //点击图标回显数据
+    selectMark(Id, selectType) {
+      if (selectType==0) {
+        var index = this.pizhucontrastList.findIndex(item => {
+        if (item.id == Id) {
+          // 清空currentSelectObj，否则Id与id同时存在
+          this.currentSelectObj = {}
+          this.$store.commit("SET_PATENT_INDEX", this.currentSelectObj)
+          this.contrast = item
+          this.$store.commit('SET_PATENT_INDEX', this.contrast)
+        }
+        return item.id == Id
+        })
+        if (index != -1) {
+          this.showPizhu()
+        }
+      } else if (selectType == 1) {
+        let a=this.contrastList.find(item => {
+          return item.id==Id
+        })
+        this.$emit('openContrast', a)
+      }
+      
+    },
+    mousemove(e) {
+      this.mX = e.pageX;
+      this.mY = e.pageY;
+    },
+    mouseup(e) {
+      sessionStorage.mY = this.mY
+      sessionStorage.mX = this.mX
+      this.isSelecting = true;
+      if (this.isSelecting) {
+        this.isSelecting = false;
+        let selectObj = document.getSelection();
+        this.anchorOffset = 0;
+        let temSelectObj = this.getSelectobj(selectObj);
+        var tempdt = this.getColumnName(selectObj.anchorNode);
+        if (tempdt != undefined && selectObj.toString() != '') {
+          this.currentSelectObj = temSelectObj;
+          this.currentSelectObj.color = this.currentColor;
+          this.currentSelectObj.Type = 0;
+          this.currentSelectObj.patentNo = this.patent.publicNo
+          // rangeId（专题库id/报告id）
+          this.currentSelectObj.rangeId = this.reportId
+          // 创建来源（默认0/专题库1/报告2）
+          this.currentSelectObj.createFrom = 2
+          // this.showPizhu();
+          this.currentSelectObj.remark = ''
+        }
+        else {
+          this.currentSelectObj = {};
+        }
+        if (this.currentSelectObj.Id) {
+          var a = JSON.parse(this.index)
+          a.Id = this.currentSelectObj.Id
+          a.patentNo = this.currentSelectObj.patentNo
+          a.text = this.currentSelectObj.text
+          a.rangeId = this.reportId
+          a.scratchField = this.currentSelectObj.column
+          a.position = this.currentSelectObj.index
+          a.id = null
+          a.remark = null
+          // a.color = this.currentSelectObj.color
+          a.createFrom = 2
+          a.Type = 0
+          this.$store.commit("SET_PATENT_INDEX", a)
+          this.showPizhu()
+        }
+      }
+    },
+    // 打开批注框
+    pizhu() {
+      if (this.contrast.id == undefined) {
+        this.currentSelectObj = JSON.parse(this.index)
+      }
+      if (this.currentSelectObj.Id != undefined || this.contrast.id != undefined) {
+        // 划词进入
+        // if (this.currentSelectObj.Id != undefined) {
+        //   console.log(2,this.currentSelectObj);
+        //   this.$store.commit('SET_PATENT_INDEX', this.currentSelectObj)
+        // }
+        this.currentSelectObj.Type = 2;
+        this.hiddenPizhu();
+        this.showPizhu2()
+        this.contrast = {}
+      }
+    },
+    showPizhu2() {//展示批注
+      let dl = document.getElementsByClassName("pizhu");
+      let mX = sessionStorage.mX
+      let mY = sessionStorage.mY
+      console.log(document.body.clientHeight , mY);
+      if ((document.body.clientWidth - mX - 380) < 0) {
+        mX = document.body.clientWidth - 390;
+      }
+      if ((document.body.clientHeight - mY - 40) < 0) {
+        mY = document.body.clientHeight - 40;
+      }
+      if ((document.body.clientHeight - mY) < 420) {
+        mY = mY - 410
+      }
+      if ((document.body.clientWidth - mX) < 330) {
+        mX = mX - 330
+      }
+      dl[0].setAttribute("style", "user-select:none;box-shadow: 10px 10px 5px #888888;display:block;position:absolute;left:" + mX.toString() + "px;top:" + mY.toString() + "px;background-color: #F7EED6;border-radius: 15px 15px;padding: 10px;width:380px;z-index: 2;");
+    },
+    showPizhu() {//展示菜单
+      // this.AddClass1(this.currentSelectObj)
+      let mX = sessionStorage.mX
+      let mY = sessionStorage.mY
+      let dl = document.getElementsByClassName("caidan");
+      if ((document.body.clientWidth - mX - 420) < 0) {
+        mX = document.body.clientWidth - 420;
+      }
+      if ((document.body.clientHeight - mY - 40) < 0) {
+        mY = document.body.clientHeight - 40;
+      }
+      dl[0].setAttribute("style", "opacity:0.95;box-shadow: 10px 10px 5px #888888;display:block;position:absolute;left:" + mX.toString() + "px;top:" + mY.toString() + "px;background-color: white;border-radius: 15px 15px;height:30px;display: flex;align-items: center;padding: 10px;user-select:none");
+    },
+    // 关闭菜单
+    hiddenPizhu() {
+      let dl = document.getElementsByClassName("caidan");
+      dl[0].setAttribute("style", "display:none;");
+    },
+    getSelectobj(selectObj) {
+      var temNode = selectObj.anchorNode;
+      var a = temNode.parentElement
+      NotIncludeDataType(a)
+      function NotIncludeDataType(node) {
+        if (node.getAttribute("data-type") != null) {
+          temNode = node
+        } else {
+          NotIncludeDataType(node.parentElement);
+        }
+      }
+      this.getColumn(temNode, selectObj);
+      this.isFirst = true
+      return { "Id": this.uuid(), "column": temNode.getAttribute("data-type"), "index": this.anchorOffset, "text": selectObj.toString(), 'temNode': temNode.innerHTML };
+    },
+    getColumn(node, selectObj) {
+      var baseNode = this.getColumnNode(node);
+      var anchorNodePosition = this.getPosition(baseNode, selectObj.anchorNode, selectObj.anchorOffset);
+      var focusNodePosition = this.getPosition(baseNode, selectObj.focusNode, selectObj.focusOffset);
+      var num = Math.min(anchorNodePosition, focusNodePosition)
+      this.anchorOffset = num
+      return true;
+    },
+    getColumnNode(node) {
+      //获取节点所在的栏位节点
+      if (node != null) {
+        if (node.nodeType != 3 && node.getAttribute("data-type") != null) {
+          return node;
+        } else {
+          if (node == document.root) {
+            return node;
+          } else {
+            return this.getColumnNode(node.parentNode);
+          }
+        }
+      }
+    },
+    getNodes(baseNode, path) {
+      // 拿到所有类型的节点
+      var temPath = path;
+      if (baseNode != null) {
+        temPath.push(baseNode);
+        if (baseNode.childNodes.length > 0) {
+          for (let i = 0; i < baseNode.childNodes.length; i++) {
+            this.getNodes(baseNode.childNodes[i], temPath);
+          }
+        }
+      }
+    },
+    getPosition(baseNode, node, offset) {
+      //根据节点获取给定node中offset位置在栏位中的实际位置
+      let path = [];
+      this.getNodes(baseNode, path);
+      let retIdx = 0;
+      for (let i = 0; i < path.length; i++) {
+        if (path[i] == node) {
+          retIdx += offset;
+          return retIdx;
+        } else {
+          if (path[i].nodeType == 3) {
+            retIdx += path[i].nodeValue.length;
+          }
+        }
+      }
+    },
+    uuid() {
+      var s = [];
+      var hexDigits = "0123456789abcdef";
+      for (var i = 0; i < 36; i++) {
+        s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
+      }
+      s[14] = "4";  // bits 12-15 of the time_hi_and_version field to 0010
+      s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);  // bits 6-7 of the clock_seq_hi_and_reserved to 01
+      s[8] = s[13] = s[18] = s[23] = "-";
+      var uuid = s.join("");
+      return uuid;
+    },
+    getColumnName(el) {
+      let root = el;
+      if (el == undefined) {
+        return undefined;
+      }
+      if (!(el instanceof HTMLElement)) {
+        root = el.parentElement;
+      }
+      let dt = root.getAttribute("data-Type");
+      if (dt != undefined) {
+        return root;
+      }
+      return dt = this.getColumnName(root.parentElement);
+    },
+  },
 }

RMS-FrontEnd/src/views/components/articles/index.vue

@@ -63,6 +63,9 @@
                     <span v-else>切换原文</span>
                   </el-link>
                 </div>
+                <div style="position: absolute;right: 0;top:0;">
+                  <PatentMark :patentNo="patent.patentNo" @biaozhu="getBiaoZhu"></PatentMark>
+                </div>
                 </div>
               
                 <div style=" position: relative;">
@@ -89,7 +92,7 @@
               <div class="patent-articles-content-left" :style="{ width: showRight ? 'calc(100% - 321px)' : 'calc(100% - 21px)' }">
                 <div class="dom box1" v-dragControllerDiv1 style="display:flex;width:100%">
                   <div class="component left1" style="width:100%;overflow-y:auto;overflow-x: hidden;padding-bottom:10px" :style="{height:height}">
-                    <component :is="componentName" :reportType="reportType"  @getVisible="getVisible" :project-id="projectId" @isTrues="getIsTrue" :isTrue="isTrue" :type1="type" :patent="patent" :patentNo="[patent.patentNo]" :domId="patent.patentNo + '1'" :reportId="reportId" :patent-id="patentId" @openContrast='openContrast' @refresh="getPatent(patent.patentNo)" ></component>
+                    <component :is="componentName" :activeName="activeName" :reportType="reportType"  @getVisible="getVisible" :project-id="projectId" @isTrues="getIsTrue" :isTrue="isTrue" :type1="type" :patent="patent" :patentNo="[patent.patentNo]" :domId="patent.patentNo + '1'" :reportId="reportId" :patent-id="patentId" @openContrast='openContrast' @refresh="getPatent(patent.patentNo)" ></component>
                   </div>
                   <div class="resize2" title="收缩侧边栏"  v-show="(radio == 2 || radio == 3) && activeMenu != activeMenu2"><p><span>˙</span><span>˙</span><span>˙</span></p></div>
                   <div class="resize1" title="收缩侧边栏"  v-show="(radio == 4 || radio == 5) && activeMenu != activeMenu2"><span>⋮</span></div>
@@ -131,6 +134,9 @@
   <el-dialog :title="ruleForm.id?'编辑对比':'添加对比'" v-draggable :visible.sync="visible" width="1000px" :before-close="close">
     <el-form :model="ruleForm" ref="ruleForm" label-width="100px" label-position="left">
        
+       <el-form-item label="选择颜色" class="item">
+          <el-input type="color" v-model="ruleForm.color"  style="user-select:none;width: 100px;" @input="changeColor()"/>
+       </el-form-item>
        <el-form-item label="选中文本" class="item">
          <el-input v-model="ruleForm.content" placeholder="请输入备注" type="textarea" show-word-limit></el-input>
        </el-form-item>
@@ -213,7 +219,7 @@ import Features from './components/features.vue'
 import Permit from './components/history/permit.vue'
 import ProductManage from '@/views/product/components/product.vue'
 import PatentWorth from './components/history/components/echarts/components/echarts.vue'
-
+import PatentMark from './components/PatentMark.vue'
 import { splitScreen } from '../common/SplitScreen'
 
 export default {
@@ -241,8 +247,9 @@ export default {
     Other,
     Permit,
     ProductManage,
-    PatentWorth
+    PatentWorth,
     // Product,
+    PatentMark,
 },
   data() {
     return {
@@ -365,16 +372,20 @@ export default {
       // imgList: [],
       file:[],
       patentNo1:this.patentNo,
-      // height:null
+      activeName:'0',
+    }
+  },
+  computed: {
+    piZhuContrastList() {
+      return this.$store.state.report.pizhucontrastList
     }
   },
-  
   created() {
   },
   mounted() {
     // this.height = document.querySelector('.patent-content').offsetHeight>500?document.querySelector('.patent-content').offsetHeight + 90:500
     this.params = this.$s.getSession('params')
-    window.selectMark = this.selectMark
+    // window.addDuiBi = this.addDuiBi
     this.signPatentNo = this.$s.getSession('params').signPatentNo
     // console.log(this.$s.getSession('params'))
    this.taskId = this.$s.getSession('params').taskId
@@ -385,6 +396,8 @@ export default {
       this.getContrastList(this.signPatentNo)
     }
     this.getPatent(this.patentNo)
+     // 请求查询批注
+     this.getPiZhuContrastList()
       // console.log(this.reportId);
       // this.$nextTick(()=>{
       //       this.$set(this,'height',document.getElementsByClassName('patent-articles-content-left')[1].offsetHeight + 20 + 'px')
@@ -427,6 +440,65 @@ export default {
 
   },
   methods: {
+    //获取需要跳转的批注
+    getBiaoZhu(val) {
+      if (val.scratchField == '摘要') {
+        this.activeMenu = 'PatentBasic'
+      } else { 
+        this.activeMenu = this.menuList.find(item => {
+          return val.scratchField.indexOf(item.label)!=-1
+        }).value
+          if (val.scratchField.indexOf('译文') !=-1) {
+          this.activeName = '1'
+          } else {
+            this.activeName='0'
+          }
+      }
+      this.handleSelect(this.activeMenu)
+      
+        this.tiaozhuan(val.id,val)
+    },
+    tiaozhuan(id) {
+      const href = `#${id}`
+      const anchor = document.createElement('a');
+        anchor.href = href;
+        anchor.style.display = "none";
+        document.body.appendChild(anchor);
+        setTimeout(function () {
+          anchor.click();
+          document.body.removeChild(anchor);
+        }, 66);
+        return true;
+    },
+    changeColor(){},
+    // 查询批注
+    getPiZhuContrastList(val) {
+      if (val) {
+        var index = this.piZhuContrastList.findIndex(item => {
+          item.patentNo == val
+        })
+        if (index != -1) {
+          return false;
+        }
+      }
+      let params = {
+        patentNo: val?val:this.patentNo,
+        id: this.reportId,
+        createFrom:2
+      }
+      this.$api.scratchWordsQuery(params).then(response => {
+        if (response.code==200) {
+          if (this.piZhuContrastList.length > 0) {
+             var a = this.piZhuContrastList.filter(item => {
+              return item.patentNo != params.patentNo
+             }).concat(response.data)
+          } else {
+             var a = response.data
+          }
+           this.$store.commit('SET_PATENT_PIZHU_CONTRAST', a)
+        }
+      })
+    },
     // 返回
     goBack() {
       if(this.taskId){
@@ -467,7 +539,7 @@ export default {
     },
   
 
-    selectMark(Id){
+    selectMarkOpen(Id) {
     // console.log(Id,this.contrastList)
   // this.selectMarkObjectId = Id;
 //   this.showPizhu();
@@ -478,6 +550,7 @@ var index = this.contrastList.findIndex(item=>{
 if(index!=-1){
   
   this.ruleForm = {
+    color:this.contrastList[index].color,
     id:this.contrastList[index].id,
     index:this.contrastList[index].position,
     content:this.contrastList[index].content,
@@ -551,15 +624,20 @@ if(index!=-1){
       this.file=[]
     },
     //打开弹窗
-    openContrast(val){
+    openContrast(val) {
       if(val.patentNo != this.signPatentNo){
         this.contrastMessage = val
         this.selectedFeatures=[]
         this.ruleForm = {
-          content:val.text,
-          position:val.column,
+          color:val.color,
+          content:val.text?val.text:val.content,
+          position: val.scratchField ? val.scratchField : val.fields,
+          index:val.position,
           featureslist:[]
         }
+        if (val.id) {
+          this.selectMarkOpen(val.id)
+        }
         // this.ruleForm.content = 
         // this.ruleForm.position = 
         // this.ruleForm.featureslist=[]
@@ -575,7 +653,7 @@ if(index!=-1){
       
     },
     //添加、修改对比
-    submit(){
+    submit() {
       if(this.ruleForm.features&&this.ruleForm.features.length>0){
           if(this.ruleForm.id){
             this.ruleForm.features.forEach(item=>{
@@ -591,7 +669,8 @@ if(index!=-1){
               paresingProcess:this.ruleForm.paresingProcess,
               assoRecordsFeatures:this.ruleForm.features,
               reportId:this.reportId,
-              taskId:this.taskId
+              taskId:this.taskId,
+              color:this.ruleForm.color,
             }
             // let formData = new formData
             let formData = new FormData()
@@ -617,13 +696,14 @@ if(index!=-1){
           }else{
               var a = {
                 patentNo:this.contrastMessage.patentNo,
-                position:this.contrastMessage.index,
+                position:this.contrastMessage.position,
                 fields:this.ruleForm.position,
                 content:this.contrastMessage.text,
                 paresingProcess:this.ruleForm.paresingProcess,
                 assoRecordsFeatures:this.ruleForm.features,
                 reportId:this.reportId,
-                taskId:this.taskId
+                taskId: this.taskId,
+                color:this.ruleForm.color,
             }
             let formData = new FormData()
                 if(this.file){
@@ -790,6 +870,8 @@ if(index!=-1){
       this.location1  = data.location
       this.patentId = data.id
       this.changePageTitle()
+      // 请求批注
+      this.getPiZhuContrastList(data.patentNo)
     },
     //查询任务下专利状态
     getPatentStatus(patentNo){

RMS-FrontEnd/src/views/components/gaoliang/components/mixins.js

@@ -0,0 +1,31 @@
+export const explain = {
+  data() {
+    return {
+      innerHtml:''
+    }
+  },
+  mounted() {
+  },
+  methods: {
+     // 解释所需方法
+    saveValue(val) {//点击输入触发,第一次为空不打印
+      if (this.keepSure) {
+        this.keepSure = false;
+      }
+      // 解决鼠标错位问题
+      // this.$refs["preview"].focus();
+      // document.execCommand("selectAll", false, null);
+      // document.getSelection().collapseToEnd();
+      this.innerhtml = val
+      // this.mark.remark=val
+      this.$forceUpdate()
+          if(this.tableHeight){
+            this.setHeight()
+          }
+    },
+    getValue(row,name) {//失去焦点触发，row本行数据，name是传过来的row里面每一个属性
+        row[name] = this.innerhtml
+        this.innerhtml = ''
+    },
+  }
+}

RMS-FrontEnd/src/views/components/gaoliang/components/pizhu.vue

@@ -0,0 +1,266 @@
+<template>
+  <div>
+    <div class="pizhu" style="display:none;">
+          <div style="display:flex;justify-content: space-between;font-size:14px;border-bottom: 1px white solid;padding-bottom: 5px;">
+            <p style="font-weight:800;margin:0">{{ userinfo.name }}</p>
+            <p style="margin:0">{{ getDate() }}</p>
+          </div>
+          <div>
+            <p style="display: flex;align-items: center;"><span style="width: 60px;">内容：</span><span style="width: 100%;"><el-input type="textarea" v-model="mark.text" readonly rows="2"></el-input></span></p>
+          </div>
+          <div>
+            <p><span>颜色：</span>
+              <span>
+                <el-input type="color" size="small" class="changeColor"  v-model="mark.color" style="user-select:none;width:100px" @input="changeColor()"> </el-input>
+              </span></p>
+            <p><span>类型：</span>
+              <span>
+                <el-radio-group v-model="mark.scratchType" @change="changeRadio">
+                  <el-radio :label="2">波浪线</el-radio>
+                  <el-radio :label="0">下划线</el-radio>
+                  <el-radio :label="1">高亮</el-radio>
+                </el-radio-group>
+              </span></p>
+          </div>
+          <div>
+            <p>
+              <span>使用权限：</span>
+              <span>
+                <el-radio-group v-model="mark.permissionType" @change="changePower()">
+                  <el-radio :label="1">所有人可见</el-radio>
+                  <el-radio :label="0">本人可见</el-radio>
+                </el-radio-group>
+              </span>
+            </p>
+          </div>
+          <div>
+            <p style="display:flex">
+              <span>可见范围：</span>
+              <span>
+                <el-switch
+                  v-model="mark.rangeType"
+                  active-color="#13ce66"
+                  inactive-color="#ff4949"
+                  active-text="本报告可见">
+                </el-switch>
+              </span>
+            </p>
+          </div>
+          <div style="user-select: none;">
+            <!-- <el-input type="textarea"></el-input> -->
+            <p style="margin-bottom:5px">标注：</p>
+            <el-input v-model="mark.remark" type="textarea" class="my-input-preview"></el-input>
+            <!-- <div ref="preview" style="width:100%;outline: #dcdfe6;border:1px solid #DCDFE6;border-radius:5px;min-height:50px;background:white;" id="preview" class="my-input-preview" contenteditable="true" 
+               v-html="mark.remark"  @input="saveValue($event.target.innerHTML)"  @click="saveValue($event.target.innerHTML)"
+               @blur="getValue(mark,'remark')">
+            </div> -->
+          </div>
+          <div style="display:flex;justify-content: flex-end;">
+            <span style="cursor: pointer;" @click="cancelPizhu" >取消</span>
+            <span style="margin-left:15px;cursor: pointer;" v-if="mark.id" @click="deletePizhu">删除</span>
+            <span style="margin-left:15px;cursor: pointer;" @click="submitPizhu">确定</span>
+          </div>
+    </div>
+  </div>
+</template>
+
+<script>
+// 阿里巴巴icon
+// import "@/assets/iconfont/iconfont.css"
+// import { explain } from "./mixins";
+export default {
+  name:'pizhu',
+  // mixins: [explain],
+  props: ['gaoLiangCaiDan','piZhuDelete'],
+  components: {
+  },
+  
+  data() {
+    return {
+      color:'#dff209',
+      scratchType:2,
+      permissionType:2,
+      rangeType:[],
+      remark:'',
+      currentIndex:{},
+      dialogVisible:false,
+      featureVisible:false,
+      featureForm:{},
+      tableData1:[],
+      witchRight: "权要1",
+    }
+  },
+  computed:{
+    mark() {
+      let a = this.$store.state.patent.index
+      if (a.rangeType == 'true' || a.rangeType==true) {
+        a.rangeType=true
+      } else {
+        a.rangeType=false
+      }
+      return a || { rangeType:[] }
+    },
+    userinfo() {
+      return this.$store.state.admin.userinfo
+    },
+    pizhucontrastList() {
+      return this.$store.state.report.pizhucontrastList
+    }
+  },
+  watch: {
+    gaoLiangCaiDan(val) {
+      this.submitPizhu()
+    },
+    piZhuDelete(val) {
+      this.deletePizhu()
+    },
+  },
+  created() {
+
+  },
+  mounted() {
+
+  },
+  methods: {
+    // 显示时间
+    getDate() {
+      let date = new Date()
+      var Y = date.getFullYear().toString()
+      var m = (date.getMonth() + 1) > 9 ? (date.getMonth() + 1).toString() : "0" + (date.getMonth() + 1)
+      var d = date.getDate() > 9 ? date.getDate().toString() : "0" + date.getDate()
+      var H = date.getHours() > 9 ? date.getHours().toString() : "0" + date.getHours()
+      var M = date.getMinutes() > 9 ? date.getMinutes().toString() : "0" + date.getMinutes()
+      var S = date.getSeconds() > 9 ? date.getSeconds().toString() : "0" + date.getSeconds()
+      return Y + '-' + m + '-' + d + ' ' + H + ':' + M + ':' + S
+    },
+    // 确定增加批注
+    submitPizhu() {
+      this.mark.rangeType=false
+      if (this.mark.id) {
+        this.$api.scratchWordsUpdate(this.mark).then(response => {
+          if (response.code == 200) {
+            this.getContrastList('update')
+            this.cancelPizhu()
+          }
+        }).catch(error => {
+
+        })
+      } else {
+        this.$api.scratchWordsAdd(this.mark).then(response => {
+          if (response.code == 200) {
+            this.getContrastList('add')
+            this.cancelPizhu()
+          }
+        }).catch(error => {
+
+        })
+      }
+
+    },
+    // 关闭批注
+    cancelPizhu() {
+      if (this.mark.id|| this.mark.Id) {
+        let index={
+          color:this.mark.color,
+          scratchType:this.mark.scratchType,
+          permissionType:this.mark.permissionType,
+          rangeType:this.mark.rangeType,
+          content:'',
+          remark:'',//标注文本
+        }
+      this.$store.commit('SET_PATENT_INDEX', index)
+      }
+       
+      // }
+      let dl = document.getElementsByClassName("pizhu");
+      dl[0].setAttribute("style", "display:none;");
+    },
+    // 删除批注
+    deletePizhu() {
+      let ids = [
+        this.mark.id
+      ]
+      this.$api.scratchWordsDelete(ids).then(response => {
+        if (response.code == 200) {
+          this.getContrastList('delete')
+          this.cancelPizhu()
+        }
+      }).catch(error => {
+
+      })
+    },
+    // 查询批注
+    getContrastList(type) {
+      if (type != 'add') {
+        var index = this.pizhucontrastList.findIndex(item => {
+          return item.id == this.mark.id
+        })
+      }
+      switch (type) {
+        case 'add':
+          let params = {
+            patentNo:this.mark.patentNo,
+            id: this.mark.rangeId,
+            createFrom:1
+          }
+          this.$api.scratchWordsQuery(params).then(res => {
+            if (res.code == 200) {
+              if (this.pizhucontrastList.length > 0) {
+                var a = this.pizhucontrastList.filter(item => {
+                  return  item.patentNo != params.patentNo
+                }).concat(res.data)
+              } else {
+                var a = res.data
+              }
+              this.$store.commit('SET_PATENT_PIZHU_CONTRAST', a)
+            }
+          })
+          break;
+        case 'update':
+          this.pizhucontrastList.splice(index,1,this.mark)
+          break;
+        case "delete":
+          this.pizhucontrastList.splice(index,1)
+          break;
+      }
+    },
+    // 颜色
+    changeColor(val) {
+      // var a = JSON.parse(this.index)
+      // // a.color = this.color
+      // a.color = this.mark.color
+      // this.$store.commit('SET_PATENT_INDEX',a)
+    },
+    // 类型：下划线，高亮
+    changeRadio(val) {
+      // var a = JSON.parse(this.index)
+      // a.radio = this.radio
+      // console.log(a);
+      // this.$store.commit('SET_PATENT_INDEX',a)
+    },
+    // 使用权限
+    changePower(val) {
+      // var a = JSON.parse(this.index)
+      // a.power = this.power
+      // this.$store.commit('SET_PATENT_INDEX',a)
+    },
+    // 使用范围
+    changeRange(val) {
+      // var a = JSON.parse(this.index)
+      // a.range = this.range
+      // console.log(a);
+      // this.$store.commit('SET_PATENT_INDEX',a)
+    },
+  }
+}
+</script>
+<style lang="less">
+.opinion .el-form-item{
+  margin-bottom: 10px;
+  .el-form-item__content,.el-form-item__label{
+    line-height: normal;
+    min-height: 30px;
+  }
+}
+
+</style>

RMS-FrontEnd/src/views/components/gaoliang/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div>
+
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>