text

DAPlatform-front/src/components/CheckDetail.vue

@@ -44,10 +44,10 @@ export default {
       }
       switch (type) {
         case "文本":
-          goto("SelectedText");
+          self.$router.push({ name: 'SelectedText', path: '/selected', params: {documentId: documentId} });
           break;
         case "表格":
-          goto("Table");
+          self.$router.push({ name: 'Tabled', path: '/tabled', params: {documentId: documentId} });
           break;
         case "图片":
           goto("image");

DAPlatform-front/src/components/CompletedTaskDetail.vue

@@ -45,10 +45,10 @@ export default {
       }
       switch (type) {
         case "文本":
-          goto("SelectedText");
+          self.$router.push({ name: 'SelectedText', path: '/selected', params: {documentId: documentId} });
           break;
         case "表格":
-          goto("Table");
+          self.$router.push({ name: 'Tabled', path: '/tabled', params: {documentId: documentId} });
           break;
         case "图片":
           goto("image");

DAPlatform-front/src/components/OngoingTaskDetail.vue

@@ -44,10 +44,10 @@ export default {
       }
       switch (type) {
         case "文本":
-          goto("SelectText");
+          self.$router.push({ name: 'SelectText', path: '/select', params: {documentId: documentId} });
           break;
         case "表格":
-          goto("Table");
+          self.$router.push({ name: 'Table', path: '/table', params: {documentId: documentId} });
           break;
         case "图片":
           goto("image");

DAPlatform-front/src/components/textAnnotation/SelectText.vue

@@ -42,6 +42,8 @@
           </div>
         </div>
       </el-aside>
+
+      <!-- 文本界面 -->
       <el-main class="filter-container" style="background-color: #FFFFFF">
         <div style="overflow-y:auto;height:100%;">
           <div @mouseup="highlight()">
@@ -96,15 +98,31 @@ export default {
       address: "那是我心中最美的“第三极”——第二次青藏科考青年说"
     };
     return {
+      // 文章id
+      documentId: '',
+      // 文章内容
+      content: [],
+      //实体属性
+      token: {
+        entityId: "",
+        word: "",
+        begin: 0,
+        end: 0,
+        attribute: "",
+        tokenId: ""
+      },
+      // 实体属性列表
+      tokenList: [],
+      // 文章列表
       textData: [
         {
-          label: "那是我心中最美的“第三极”",
+          label: this.documentId,
           children: [
             {
-              label: "那是我心中最美的“第三极”——第一次青藏科考青年说"
+              label: this.documentId
             },
             {
-              label: "那是我心中最美的“第三极”——第二次青藏科考青年说"
+              label: "暂无数据"
             }
           ]
         }
@@ -270,24 +288,6 @@ export default {
       },
       count: 1,
       tableData: Array(20).fill(item),
-      msg: [
-        "那是我心中最美的“第三极”——第二次青藏科考青年说<br/> \
-       2020-05-06 11:08 来源：新华网 编辑：矿材网<br/> \
-      “看到国家自主研发的‘极目一号’浮空器从纳木错科考站升起，她宛若白鲸，越升越高，融入了星海。古老的‘第三极’与前沿的科技，在星空中融为一体，那就是我心中最美的‘第三极’风情。”中国科学院空天信息创新研究院的屈维说。<br/> \
-       2019年5月23日，中国科学院空天信息创新研究院研制的“极目一号”浮空器在第二次青藏高原综合科学考察研究中，在纳木错升空达到海拔7003米的高度，创造了迄今已知同类型、同量级浮空器驻空高度的世界纪录。<br/> \
-       第二次青藏高原综合科考从2017年8月全面启动，在之后5到10年内，大批科研工作者将对青藏高原的水、生态、人类活动等环境问题进行考察研究。我国首次青藏高原综合科学考察研究是20世纪70年代，这次综合科考研究积累了大量科学资料，为青藏高原生态保护和社会经济发展提供了科学依据。<br/> \
-       相对于南极和北极，人们把青藏高原称为世界“第三极”。<br/> \
-       中国科学家认同“第三极”的称号，除了因为青藏高原和南极、北极有表面上的相似，还因为青藏高原的“一举一动”都对地球的整体环境有着重要影响。<br/> \
-       “当科考车翻过山头，映入眼帘的便是海拔4700米的纳木错与远处的雪山，碧蓝的湖水倒映着树木、雪山，一相逢便割舍不下。”2018年参加工作的屈维说，能参与第二次青藏科考，能看到“第三极”的多样风情，是他的幸运。<br/> \
-       作为地球“第三极”的核心区,西藏有着极致的美丽。顶着身体不适,扛着各种仪器,做样方、采标本、打土钻和入户调研是科考队员户外作业最平常的事情。<br/> \
-        “高原上的天气极不稳定,狂风、冰雹、大雨会在同一天多次造访,我们必须趁着天气略有好转时,见缝插针,尽可能多地赶任务。一日行车数百公里都是‘家常便饭’,调研途中为了‘救出’陷入泥坑的车辆,经常折腾到灰头土脸。”36岁的西藏农牧学院副教授王向涛说。<br/> \
-        2019年7月,第二次青藏科考雅鲁藏布大峡谷水汽通道考察分队在墨脱县的一次“陷车”,至今让科考队员李璐含记忆深刻。当时,墨脱因为多日暴雨和泥石流,已封锁半个月之久,科考队员采集数据的当天仍在下暴雨。傍晚,车子到了一处山体坍塌严重的路段。<br/> \
-        “当车子陷入泥泞的时候,我心想,今晚或许就要睡在这里了。”李璐含说,“知道我们是科考队后,前后方车辆的司机和路旁维修道路的人都帮我们推车。原本在黑暗中的车子,被车灯和探照灯照亮,使我能看清这些人的面庞,他们用不同的方言喊口号、用力推车的场景让我难忘。”<br/> \
-        躺在草地上观看云团变幻出各种造型;科考间隙引逗草原上东张西望的鼠兔或旱獭;科考途中和赶着牛群、羊群的牧民依靠手势交流,致以微笑……这些是科考队员在科考途中不多的乐趣。<br/> \
-        作为第二次青藏科考的参与人员,王向涛多次深入藏北地区考察。“有时候,我随手拍的风景照发到朋友圈,会引来朋友的羡慕。或许这是很多人眼里的‘诗和远方’,但对于我们来说,这一次次‘旅程’不是‘游山玩水’,而是科研工作者的负重前行。”王向涛感慨说。<br/> \
-        2019年以来,第二次青藏高原综合科学考察研究队在西藏共采集大气、水文、土壤等环境要素样品1.2万余份,采集动植物、微生物样本4.4万余份,收集经济社会发展资料超2200套,在“亚洲水塔”变化与影响及应对等方面取得突破。<br/> \
-        “我们在西藏进行科学考察,必须了解当地群众生产、生活需求和意愿,为保护好这里的一草一木尽一份绵薄之力。肆虐的风雪阻挡不住前进的路,选择了科考,选择了拥抱这片广袤的土地,就是青春的荣耀。”王向涛说。"
-      ],
       ifAlert: false,
       options: [
         {
@@ -306,42 +306,41 @@ export default {
           value: "选项4",
           label: "时间"
         }
-      ],
-      token:{
-        entityId: "",
-        word: "",
-        begin: 0,
-        end: 0,
-        attribute:"",
-        tokenId: ""
-      },
-      tokenList: []
+      ]
     };
   },
+  created() {
+    this.getParams();
+  },
   methods: {
+    // 获取文本id
+    getParams() {
+      var routerParams = this.$route.params.documentId;
+      this.documentId = routerParams;
+    },
     handleNodeClick(data) {
       console.log(data);
     },
-    //获取文本
-    getContent(){
-      this.axios({
-          method: "post",
-          url: "http://127.0.0.1:9100/uploadDownload/getFileContent",
-          data: {
-            documentId: "a55a28d4a25811ea93c354e1ad87433a"//改成通用跳转传过来的documentId
-          }
-        }).then(res => {
-          if(res.return_code == 200)
-            console.log("123" + res.result);
-            //res.result就是文本的内容
-          else{
-            this.$message({
-              message: res.return_info,
-              type: "error"
-            });
-          }
-        });
-    },
+    // 获取文本
+    getContent() {
+      this.axios({
+        method: "post",
+        url: "http://127.0.0.1:9100/uploadDownload/getFileContent",
+        data: {
+          documentId: this.documentId
+        }
+      }).then(res => {
+        if (res.return_code == 200) {
+          console.log("123" + res.result);
+          content = res.result;
+        } else {
+          this.$message({
+            message: res.return_info,
+            type: "error"
+          });
+        }
+      });
+    },
     // 暂时没用
     handleOption() {
       console.log(this.token.entityId);
@@ -352,6 +351,17 @@ export default {
         });
       }
     },
+    // 定位原文token
+    highlight() {
+      if (window.getSelection().toString() != "") {
+        //console.log("1111"+window.getSelection().toString());
+        this.ifAlert = true;
+        //var word;
+        this.token.word = window.getSelection().toString();
+        this.token.begin = window.getSelection().anchorOffset; //开始位置
+        this.token.end = window.getSelection().focusOffset; //结束位置
+      }
+    },
     // 标注
     handleCheckChange() {
       console.log(this.$refs.tree.getCheckedNodes());
@@ -364,7 +374,7 @@ export default {
       });
       console.log("111" + arr);
       this.token.attribute = arr[0];
-      this.msg = this.msg.map(item => {
+      this.content = this.content.map(item => {
         let replaceReg = new RegExp(this.token.word, "g"); // 匹配关键字正则
         let replaceString =
           '<span class="highlights-text">' +
@@ -385,23 +395,22 @@ export default {
           method: "post",
           url: "http://127.0.0.1:9100/textAnnotation/addToken",
           data: {
-            documentId: "a55a28d4a25811ea93c354e1ad87433a",//改成通用跳转传过来的documentId
-            token:{
-              entityId: this.token.entityId, // 这里类型似乎是string
+            documentId: this.documentId,
+            token: {
+              entityId: this.token.entityId, // TODO:这里类型似乎是string
               word: this.token.word,
               begin: this.token.begin,
               end: this.token.end,
-              attribute: arr[0],
+              attribute: arr[0]
             }
           }
-        }).then(res=>{
-          if(res.return_code == 200){
-            this.token.tokenId = res.result
-            token = this.token
+        }).then(res => {
+          if (res.return_code == 200) {
+            this.token.tokenId = res.result;
+            token = this.token;
             this.token = {};
             this.tokenList.push(token);
-          }
-          else{
+          } else {
             this.$message({
               message: res.return_info,
               type: "error"
@@ -425,23 +434,7 @@ export default {
       this.ifAlert = true;
       this.token = tag;
       this.tokenList.splice(this.tokenList.indexOf(tag), 1);
-      this.axios({
-          method: "post",
-          url: "http://127.0.0.1:9100/textAnnotation/deleteToken",//改成通用跳转传过来的documentId
-          data: {
-            documentId: "a55a28d4a25811ea93c354e1ad87433a",
-            tokenId: this.token.tokenId
-          }
-        }).then(res => {
-          if(res.return_code == 200)
-            console.log("123" + res.return_info);
-          else{
-            this.$message({
-              message: res.return_info,
-              type: "error"
-            });
-          }
-        });
+      this.$options.methods.handleTokenClose(tag);
     },
     // 直接调用修改接口（因为选择属性弹窗的提交会触发保存标注操作所以会再次产生一个标注，修改也不会成功）
     // handleTokenChange(tag) {
@@ -478,7 +471,7 @@ export default {
     handleTokenClose(tag) {
       this.tokenList.splice(this.tokenList.indexOf(tag), 1);
       this.token = tag;
-      this.msg = this.msg.map(item => {
+      this.content = this.content.map(item => {
         let replaceReg = new RegExp(
           '<span class="highlights-text">' + this.token.word + "</span>",
           "g"
@@ -492,13 +485,12 @@ export default {
           method: "post",
           url: "http://127.0.0.1:9100/textAnnotation/deleteToken",
           data: {
-            documentId: "a55a28d4a25811ea93c354e1ad87433a",//改成通用跳转传过来的documentId
+            documentId: this.documentId,
             tokenId: this.token.tokenId
           }
         }).then(res => {
-          if(res.return_code == 200)
-            console.log("123" + res.return_info);
-          else{
+          if (res.return_code == 200) console.log("123" + res.return_info);
+          else {
             this.$message({
               message: res.return_info,
               type: "error"
@@ -517,34 +509,13 @@ export default {
         message: "已删除"
       });
     },
-    setCheckedNodes() {
-      this.$refs.tree.setCheckedNodes([
-        {
-          id: 5,
-          label: "二级 2-1"
-        },
-        {
-          id: 9,
-          label: "三级 1-1-1"
-        }
-      ]);
-    },
-    highlight() {
-      if (window.getSelection().toString() != "") {
-        //console.log("1111"+window.getSelection().toString());
-        this.ifAlert = true;
-        //var word;
-        this.token.word = window.getSelection().toString();      
-        this.token.begin = window.getSelection().anchorOffset; //开始位置
-        this.token.end = window.getSelection().focusOffset;  //结束位置
-      }
-    },
+    
     // 提交本次标注
     submit() {
-      this.$message({
-        message: "保存成功！",
-        type: "success"
-      });
+    //  this.$message({
+    //    message: "保存成功！",
+    //    type: "success"
+    //  });
       this.$router.replace("/completed");
     },
     // 放到边栏的token边栏
@@ -553,15 +524,14 @@ export default {
         method: "post",
         url: "http://127.0.0.1:9100/textAnnotation/getTokenList",
         data: {
-          documentId: "a55a28d4a25811ea93c354e1ad87433a"
+          documentId: this.documentId
         }
       }).then(res => {
-        if(res.return_code == 200){
+        if (res.return_code == 200) {
           res.result.forEach(element => {
-            this.tokenList.push(element)
+            this.tokenList.push(element);
           });
-        }
-        else{
+        } else {
           this.$message({
             message: res.return_info,
             type: "error"
@@ -570,6 +540,9 @@ export default {
       });
     }
   },
+  watch: {
+    $route: "getParams"
+  },
   mounted: function() {
     this.getTokenList(); //需要触发的函数
   }
@@ -593,7 +566,7 @@ export default {
     @include whiteBoard;
   }
 }
-.msg {
+.content {
   text-align: left;
   font-size: 20px;
   line-height: 30px;

DAPlatform-front/src/components/textAnnotation/SelectedText.vue

@@ -80,15 +80,31 @@ export default {
       address: "那是我心中最美的“第三极”——第二次青藏科考青年说"
     };
     return {
+      // 文章id
+      documentId: '',
+      // 文章内容
+      content: [],
+      //实体属性
+      token: {
+        entityId: "",
+        word: "",
+        begin: 0,
+        end: 0,
+        attribute: "",
+        tokenId: ""
+      },
+      // 实体属性列表
+      tokenList: [],
+      // 文章列表
       textData: [
         {
-          label: "那是我心中最美的“第三极”",
+          label: this.documentId,
           children: [
             {
-              label: "那是我心中最美的“第三极”——第一次青藏科考青年说"
+              label: this.documentId
             },
             {
-              label: "那是我心中最美的“第三极”——第二次青藏科考青年说"
+              label: "暂无数据"
             }
           ]
         }
@@ -97,24 +113,6 @@ export default {
         children: "children",
         label: "label"
       },
-      msg: [
-        '那是我心中最美的“第三极”——第二次青藏科考青年说<br/> \
-       "<span class="highlights-text">2020-05-06</span><span class="mark">(实体：时间；属性：yyyy-MM-dd)</span>" 11:08 来源：新华网 编辑：矿材网<br/> \
-      “看到国家自主研发的‘极目一号’浮空器从纳木错科考站升起，她宛若白鲸，越升越高，融入了星海。古老的‘第三极’与前沿的科技，在星空中融为一体，那就是我心中最美的‘第三极’风情。”中国科学院空天信息创新研究院的屈维说。<br/> \
-       2019年5月23日，中国科学院空天信息创新研究院研制的“极目一号”浮空器在第二次青藏高原综合科学考察研究中，在纳木错升空达到海拔7003米的高度，创造了迄今已知同类型、同量级浮空器驻空高度的世界纪录。<br/> \
-       第二次青藏高原综合科考从2017年8月全面启动，在之后5到10年内，大批科研工作者将对青藏高原的水、生态、人类活动等环境问题进行考察研究。我国首次青藏高原综合科学考察研究是20世纪70年代，这次综合科考研究积累了大量科学资料，为青藏高原生态保护和社会经济发展提供了科学依据。<br/> \
-       相对于南极和北极，人们把青藏高原称为世界“第三极”。<br/> \
-       中国科学家认同“第三极”的称号，除了因为青藏高原和南极、北极有表面上的相似，还因为青藏高原的“一举一动”都对地球的整体环境有着重要影响。<br/> \
-       “当科考车翻过山头，映入眼帘的便是海拔4700米的纳木错与远处的 "<span class="highlights-text">雪山</span><span class="mark">(实体：山体；属性：岩质)</span>"，碧蓝的湖水倒映着树木、"<span class="highlights-text">雪山</span><span class="mark">(实体：山体；属性：岩质)</span>"，一相逢便割舍不下。”2018年参加工作的屈维说，能参与第二次青藏科考，能看到“第三极”的多样风情，是他的幸运。<br/> \
-       作为地球“第三极”的核心区,西藏有着极致的美丽。顶着身体不适,扛着各种仪器,做样方、采标本、打土钻和入户调研是科考队员户外作业最平常的事情。<br/> \
-        “高原上的天气极不稳定,狂风、冰雹、大雨会在同一天多次造访,我们必须趁着天气略有好转时,见缝插针,尽可能多地赶任务。一日行车数百公里都是‘家常便饭’,调研途中为了‘救出’陷入泥坑的车辆,经常折腾到灰头土脸。”36岁的西藏农牧学院副教授王向涛说。<br/> \
-        "<span class="highlights-text">2019年7月</span><span class="mark">(实体：时间；属性：yyyy-MM-dd)</span>",第二次青藏科考雅鲁藏布大峡谷水汽通道考察分队在墨脱县的一次“陷车”,至今让科考队员李璐含记忆深刻。当时,墨脱因为多日暴雨和泥石流,已封锁半个月之久,科考队员采集数据的当天仍在下暴雨。傍晚,车子到了一处山体坍塌严重的路段。<br/> \
-        “当车子陷入泥泞的时候,我心想,今晚或许就要睡在这里了。”李璐含说,“知道我们是科考队后,前后方车辆的司机和路旁维修道路的人都帮我们推车。原本在黑暗中的车子,被车灯和探照灯照亮,使我能看清这些人的面庞,他们用不同的方言喊口号、用力推车的场景让我难忘。”<br/> \
-        躺在草地上观看云团变幻出各种造型;科考间隙引逗草原上东张西望的鼠兔或旱獭;科考途中和赶着牛群、羊群的牧民依靠手势交流,致以微笑……这些是科考队员在科考途中不多的乐趣。<br/> \
-        作为第二次青藏科考的参与人员,王向涛多次深入藏北地区考察。“有时候,我随手拍的风景照发到朋友圈,会引来朋友的羡慕。或许这是很多人眼里的‘诗和远方’,但对于我们来说,这一次次‘旅程’不是‘游山玩水’,而是科研工作者的负重前行。”王向涛感慨说。<br/> \
-        2019年以来,第二次青藏高原综合科学考察研究队在西藏共采集大气、水文、土壤等环境要素样品1.2万余份,采集动植物、微生物样本4.4万余份,收集经济社会发展资料超2200套,在“亚洲水塔”变化与影响及应对等方面取得突破。<br/> \
-        “我们在西藏进行科学考察,必须了解当地群众生产、生活需求和意愿,为保护好这里的一草一木尽一份绵薄之力。肆虐的风雪阻挡不住前进的路,选择了科考,选择了拥抱这片广袤的土地,就是青春的荣耀。”王向涛说。'
-      ],
       commentScore: false,
       scoreForm: {
         accuracy: "",
@@ -125,22 +123,50 @@ export default {
       tokenList: []
     };
   },
+  created() {
+    this.getParams();
+  },
   methods: {
+    // 获取文本id
+    getParams() {
+      var routerParams = this.$route.params.documentId;
+      this.documentId = routerParams;
+    },
     handleNodeClick(data) {
       console.log(data);
     },
-    getArticle() {
-      axios.get("/textAnnotation?textid=10").then(function(response) {
-        console.log(response);
+    // 获取文本
+    getContent() {
+      this.axios({
+        method: "post",
+        url: "http://127.0.0.1:9100/uploadDownload/getFileContent",
+        data: {
+          documentId: this.documentId
+        }
+      }).then(res => {
+        if (res.return_code == 200) {
+          console.log("123" + res.result);
+          content = res.result;
+        } else {
+          this.$message({
+            message: res.return_info,
+            type: "error"
+          });
+        }
       });
     },
+    //getArticle() {
+    //  axios.get("/textAnnotation?textid=10").then(function(response) {
+    //    console.log(response);
+    //  });
+    //},
     // 放到边栏的token边栏
     getTokenList() {
       this.axios({
         method: "post",
         url: "http://127.0.0.1:9100/textAnnotation/getTokenList",
         data: {
-          documentId: "a55a28d4a25811ea93c354e1ad87433a"
+          documentId: this.documentId
         }
       }).then(res => {
         if(res.return_code == 200){
@@ -154,6 +180,7 @@ export default {
         }
       });
     },
+    // 打分
     addScore() {
       if (this.scoreForm.accuracy == "" || this.scoreForm.score == "")
         this.$message("请输入内容");