表格着色bug

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

@@ -158,7 +158,7 @@ export default {
         },
       }).then((res) => {
         if (res.return_code == 200) {
-          // console.log("  getContent: " + res.result);
+          console.log("  getContent: " + res.result);
           this.content = res.result;
           this.$nextTick(function () {
             this.getTokenList();

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

@@ -29,7 +29,7 @@
             </div>
           </div>
         </div>
-        <!-- 文本列表 -->
+        <!-- 表单列表 -->
         <div class="sidebar-box3">
           <div>
             <div class="img-list-title3">表单列表</div>
@@ -58,7 +58,7 @@
               border
               style="width: 100%,height:200px"
               @cell-click="select"
-              :row-class-name="tableRowClassName"
+              :cell-class-name="getCellIndex"
             >
               <el-table-column
                 v-for="col in nowContent.name"
@@ -288,20 +288,20 @@ export default {
       }
     },
     // 定位原文token
-    select(row, column) {
+    select: function (row, column) {
       this.row = row;
       this.column = column;
       this.token.word = row[column.property];
-      this.token.begin = column.property;
-      this.token.entityId = row[1];
-      console.log(JSON.stringify(row));
-      console.log(JSON.stringify(column));
-      console.log(JSON.stringify(this.token.word));
-      console.log(this.token.begin);
-      console.log(JSON.stringify(this.token.entityId));
-      // 禁止重复标注，沾边的也不行
+      this.token.begin = row.index;
+      this.token.end = column.index;
+      // console.log("select: "+JSON.stringify(row.index));
+      // console.log("select: "+JSON.stringify(column.index));
+      // console.log(JSON.stringify(this.token.word));
       for (var i = 0; i < this.tokenList.length; i++) {
-        if (this.token.word == this.tokenList[i].word) {
+        if (
+          this.token.begin == this.tokenList[i].begin &&
+          this.token.end == this.tokenList[i].end
+        ) {
           this.$message({
             message: "选中单元格已标记",
             type: "info",
@@ -313,16 +313,28 @@ export default {
       console.log("  tokenList select" + JSON.stringify(this.tokenList));
       this.ifAlert = true; // 打开标注弹窗
     },
-    // tableRowClassName({ row, rowIndex }) {
-    //   if (rowIndex === 0) {
-    //     return "success-row";
-    //   } else if (rowIndex === 3) {
-    //     return "success-row";
-    //   }
-    //   return "";
-    // },
+    getCellIndex: function ({ row, column, rowIndex, columnIndex }) {
+      row.index = rowIndex;
+      column.index = columnIndex;
+    },
     // 表格标注颜色
-    cellStyle(row, column, rowIndex, columnIndex) {},
+    cellStyle: function (row, column, rowIndex, columnIndex) {
+      for (var i = 0; i < this.tokenList.length; i++) {
+        // console.log("draw  token" + JSON.stringify(this.tokenList[i]));
+        // console.log("draw  rowindex" + JSON.stringify(this.tokenList[i].begin));
+        // console.log("draw  columnindex" + JSON.stringify(this.tokenList[i].end));
+        // console.log("draw  rowindex" + JSON.stringify(row.rowIndex));
+        // console.log("draw  columnindex" + JSON.stringify(row.columnIndex));
+        if (
+          row.rowIndex === this.tokenList[i].begin &&
+          row.columnIndex === this.tokenList[i].end
+        ) {
+          // console.log("draw  token" + JSON.stringify(this.token));
+          return "background: #d9ecff;";
+        }
+      }
+      return "";
+    },
     // 添加标注
     uploadToken() {
       this.ifAlert = false;
@@ -346,7 +358,7 @@ export default {
             token: {
               word: this.token.word,
               begin: this.token.begin,
-              end: 0,
+              end: this.token.end,
               entityId: this.token.entityId,
               attribute: arr,
             },
@@ -358,8 +370,8 @@ export default {
               tokenId: res.result,
               word: this.token.word,
               begin: this.token.begin,
-              end: 0,
-              entityId: this.token.entityId,
+              end: this.token.end,
+              entityId: this.value,
               attribute: arr,
             };
             this.tokenList.push(token);
@@ -481,16 +493,16 @@ export default {
   width: 30%;
   .img-list-title3 {
     padding: 0 0 0 0;
-      width: 300px;
-      height: 40px;
-      line-height: 40px;
-      background: #409eff;
-      color: white;
-      box-shadow: 0px 0px 10px #dbdbdb;
+    width: 300px;
+    height: 40px;
+    line-height: 40px;
+    background: #409eff;
+    color: white;
+    box-shadow: 0px 0px 10px #dbdbdb;
   }
   .img-title-list-box3 {
     padding: 0 0 0 0;
-      width: 300px;
+    width: 300px;
     height: 200px;
     overflow: auto;
     background-color: white;
@@ -547,4 +559,4 @@ export default {
   margin-top: 3px;
   margin-bottom: 3px;
 }
-</style>
+</style>
\ No newline at end of file

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

@@ -240,6 +240,24 @@ export default {
         }
       });
     },
+    // 表格标注颜色
+    cellStyle: function (row, column, rowIndex, columnIndex) {
+      for (var i = 0; i < this.tokenList.length; i++) {
+        // console.log("draw  token" + JSON.stringify(this.tokenList[i]));
+        // console.log("draw  rowindex" + JSON.stringify(this.tokenList[i].begin));
+        // console.log("draw  columnindex" + JSON.stringify(this.tokenList[i].end));
+        // console.log("draw  rowindex" + JSON.stringify(row.rowIndex));
+        // console.log("draw  columnindex" + JSON.stringify(row.columnIndex));
+        if (
+          row.rowIndex === this.tokenList[i].begin &&
+          row.columnIndex === this.tokenList[i].end
+        ) {
+          // console.log("draw  token" + JSON.stringify(this.token));
+          return "background: #d9ecff;";
+        }
+      }
+      return "";
+    },
     submit() {
       this.$router.push({ path: "/taskhall" });
       

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

@@ -252,6 +252,24 @@ export default {
         }
       });
     },
+    // 表格标注颜色
+    cellStyle: function (row, column, rowIndex, columnIndex) {
+      for (var i = 0; i < this.tokenList.length; i++) {
+        // console.log("draw  token" + JSON.stringify(this.tokenList[i]));
+        // console.log("draw  rowindex" + JSON.stringify(this.tokenList[i].begin));
+        // console.log("draw  columnindex" + JSON.stringify(this.tokenList[i].end));
+        // console.log("draw  rowindex" + JSON.stringify(row.rowIndex));
+        // console.log("draw  columnindex" + JSON.stringify(row.columnIndex));
+        if (
+          row.rowIndex === this.tokenList[i].begin &&
+          row.columnIndex === this.tokenList[i].end
+        ) {
+          // console.log("draw  token" + JSON.stringify(this.token));
+          return "background: #d9ecff;";
+        }
+      }
+      return "";
+    },
     // 打分
     addScore() {
       if (this.scoreForm.accuracy == "" || this.scoreForm.score == "")