Skip to content

D
DA-Platform

文档服务地址：http://47.92.0.57:3000/ 周报索引地址：http://47.92.0.57:3000/s/NruNXRYmV

Commit 164f2d15 by 郭婉茹
Options

text

parent 27c68064
Showing with 692 additions and 370 deletions
DAPlatform-front/src/components/textAnnotation/SelectText.vue
......@@ -2,12 +2,36 @@
<div class="select-container">
<el-container>
<el-aside class="sidebar1">
<!-- 实体列表 -->
<!-- 实体/属性模板 -->
<div class="sidebar-box1">
<div>
<div class="img-list-title1">实体列表</div>
<div class="img-list-title1">实体/属性模板</div>
<div class="img-title-list-box1">
<div>
<div style="overflow: auto; height: calc(100vh - 61px - 100px - 40px - 60px);">
<p v-html="'实体：'+ token.entityId" />
<el-tree
:data="treeData"
show-checkbox
default-expand-all
node-key="id"
ref="tree"
highlight-currentD
:props="defaultProps"
></el-tree>
</div>
<div style="width: 100%"></div>
<el-button type="primary" style="margin-top: 10px" @click="uploadToken">确定</el-button>
</div>
</div>
</div>
</el-aside>
<!-- 文本界面 -->
<el-main class="filter-container1" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<div class="content1" @mouseup="select()" v-html="content"></div>
<el-row>
<el-col :span="21">
<div class="content_left">
<div
class="tokenList1"
v-for="it in tokenList"
......@@ -25,36 +49,13 @@
</el-tag>
</div>
</div>
</div>
</div>
</div>
</el-aside>
<!-- 文本界面 -->
<el-main class="filter-container1" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<div class="content1" @mouseup="select()" v-html="content"></div>
<div>
<el-button class="button1" type="primary" @click="submit()">提交</el-button>
</div>
<!-- 弹窗-->
<el-dialog title="请标注" :visible.sync="ifAlert">
<div style="overflow: auto; height: 50vh">
<p v-html="'实体：'+ token.entityId" />
<el-tree
:data="treeData"
show-checkbox
default-expand-all
node-key="id"
ref="tree"
highlight-current
:props="defaultProps"
></el-tree>
</div>
<div style="width: 100%;height: 5px"></div>
<el-button type="primary" style="margin-top: 30px" @click="uploadToken">确定</el-button>
</el-dialog>
<!-- 弹窗 -->
</el-col>
<el-col :span="3">
<div class="content_right">
<el-button class="button1" type="primary" @click="submit()">提交</el-button>
</div>
</el-col>
</el-row>
</div>
</el-main>
</el-container>
......@@ -189,6 +190,7 @@ export default {
},
}).then((res) => {
if (res.return_code == 200) {
this.content = this.contentWithoutColor;
res.result.forEach((element) => {
this.tokenInit = element;
console.log(" token: " + JSON.stringify(this.tokenInit));
......@@ -243,51 +245,43 @@ export default {
// 定位原文token
select() {
if (window.getSelection().toString() != "") {
// // 禁止重复标注，沾边的也不行
// for (var i = 0; i < this.tokenList.length; i++) {
// if (
// window.getSelection().anchorOffset >= this.tokenList[i].begin &&
// window.getSelection().anchorOffset < this.tokenList[i].end
// ) {
// this.$message({
// message: "选中区域头部存在重叠",
// type: "info"
// });
// return;
// } else if (
// window.getSelection().focusOffset > this.tokenList[i].begin &&
// window.getSelection().focusOffset <= this.tokenList[i].end
// ) {
// this.$message({
// message: "选中区域尾部存在重叠",
// type: "info"
// });
// return;
// }
// }
console.log(" token select" + JSON.stringify(this.token));
//console.log(" token select" + JSON.stringify(this.token));
this.token.tokenId = "0";
this.token.word = window.getSelection().toString();
this.token.begin = window.getSelection().anchorOffset; //开始位置
this.token.end = window.getSelection().focusOffset; //结束位置
console.log(" token select" + JSON.stringify(this.token));
console.log(" tokenList select" + JSON.stringify(this.tokenList));
this.ifAlert = true; // 打开标注弹窗
//console.log(" token select" + JSON.stringify(this.token));
//console.log(" tokenList select" + JSON.stringify(this.tokenList));
}
},
// 添加标注 // TODO 大于段落的标注还是无法渲染
uploadToken() {
this.ifAlert = false;
let res = this.$refs.tree.getCheckedNodes();
let arr = [];
res.forEach((item) => {
arr.push(item.label); // 属性
});
if (arr == []) {
if (arr.length == 0) {
this.$message({
message: "未选择属性",
type: "info",
});
} else {
// 删除原有
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: this.token.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList.splice(this.tokenList.indexOf(this.token), 1);
console.log(" token change" + JSON.stringify(this.token));
}
});
// 保存token
this.axios({
method: "post",
......@@ -304,30 +298,8 @@ export default {
},
}).then((res) => {
if (res.return_code == 200) {
// 渲染文本
let replaceReg = new RegExp(this.token.word, "g"); // 匹配关键字正则
let replaceString =
'<span class="highlights-text">' +
this.token.word +
"</span>" +
'<span class="mark">' +
"(实体：" +
this.token.entityId +
"；属性：" +
arr +
")" +
"</span>"; // 高亮替换v-html值
console.log(" 文本渲染" + replaceReg + replaceString);
this.content = this.content.replace(replaceReg, replaceString);
let token = {
tokenId: res.result,
word: this.token.word,
begin: this.token.begin,
end: this.token.end,
entityId: this.token.entityId,
attribute: arr,
};
this.tokenList.push(token);
this.tokenList = [];
this.getTokenList();
console.log(" token uploadToken" + JSON.stringify(token));
console.log(" token uploadToken" + JSON.stringify(this.token));
console.log(
......@@ -344,11 +316,6 @@ export default {
});
}
});
// TODO 不知道为啥有缓存不能清除
// this.$nextTick(() => {
// this.$refs.tree.setCheckedKeys([]);
//});
}
return;
},
......@@ -402,46 +369,11 @@ export default {
},
// 修改实体属性=删除+添加（如果选择属性弹窗没有点提交直接关掉的话会删除，也就是双击直接删除，也许这里后期需要改）
changeToken(tag) {
this.ifAlert = true;
this.token = tag;
// this.tokenList.splice(this.tokenList.indexOf(tag), 1);
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: tag.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList.splice(this.tokenList.indexOf(tag), 1);
this.content = this.contentWithoutColor;
console.log(" this.tokenList: " + JSON.stringify(this.tokenList));
console.log(" this.content: " + this.content);
this.tokenList.forEach((element) => {
console.log(" token: " + JSON.stringify(element));
let replaceReg = new RegExp(element.word, "g"); // 匹配关键字正则
let replaceString =
'<span class="highlights-text">' +
element.word +
"</span>" +
'<span class="mark">' +
"(实体：" +
element.entityId +
"；属性：" +
element.attribute +
")" +
"</span>"; // 高亮替换v-html值
this.content = this.content.replace(replaceReg, replaceString);
});
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
this.token.tokenId = tag.tokenId;
this.token.word = tag.word;
this.token.begin = tag.begin;
this.token.end = tag.end;
this.token.entityId = tag.entityId;
},
// 提交已标注文档
submit() {
......@@ -506,12 +438,6 @@ export default {
overflow: auto;
background-color: white;
box-shadow: 0px 0px 10px #dbdbdb;
.tokenList1 {
margin: 9px;
}
.token1 {
font-size: 18px;
}
}
}
.filter-container1 {
......@@ -519,10 +445,8 @@ export default {
margin-left: 20px;
margin-top: 40px;
height: calc(100vh - 61px - 100px);
width: 70%;
//float: center;
width: 100%;
padding: 25px 10px 20px 25px;
@include whiteBoard;
.content1 {
overflow: auto;
......@@ -531,6 +455,17 @@ export default {
font-size: 20px;
line-height: 30px;
}
.content_left {
overflow: auto;
height: 60px;
margin-top: 1px;
.tokenList1 {
margin: 3px;
}
.token1 {
font-size: 16px;
}
}
.button1 {
overflow: auto;
float: right;
......
DAPlatform-front/src/components/textAnnotation/SelectedCheck.vue
<template>
<div class="select-container">
<el-container>
<el-aside
class="sidebar1"
style="background-color: rgba(255,255,255,0);box-shadow: 0px 0px 0px rgba(255,255,255,0);padding-right: 20px"
>
<!-- 实体列表 -->
<el-aside class="sidebar1">
<!-- 实体/属性模板 -->
<div class="sidebar-box1">
<div>
<div class="img-list-title1">实体列表</div>
<div class="img-list-title1">实体/属性模板</div>
<div class="img-title-list-box1">
<div class="img-title-list1">
<div
class="tokenList2"
v-for="it in tokenList"
:key="it"
style="user-select:none; float: left;"
>
<li class="token2" v-html="it.word"></li>
</div>
<div style="overflow: auto; height: calc(100vh - 61px - 100px - 40px - 60px);">
<p v-html="'实体：'+ token.entityId" />
<el-tree
:data="treeData"
show-checkbox
default-expand-all
node-key="id"
ref="tree"
highlight-currentD
:props="defaultProps"
></el-tree>
</div>
<div style="width: 100%"></div>
<el-button type="primary" style="margin-top: 10px" @click="uploadToken">修改</el-button>
</div>
</div>
</div>
</el-aside>
<!-- 文本界面 -->
<el-main class="filter-container1" style="background-color: #FFFFFF">
<el-main class="filter-container3" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<div class="content1" @mouseup="select()" v-html="content"></div>
<!-- 打分 -->
<!--div v-if="this.$route.query.isCheck == '1'"-->
<div class="button1">
<el-button type="primary" @click="commentScore = true">打分</el-button>
<!-- <el-button type="primary" @click="submit()">提交</el-button>-->
<el-dialog title="请打分" :visible.sync="commentScore" width="400px">
<el-form :model="scoreForm">
<el-form-item label="标注准确率" :label-width="formLabelWidth">
<el-input v-model="scoreForm.accuracy" autocomplete="off" clearable></el-input>
</el-form-item>
<el-form-item label="标注得分" :label-width="formLabelWidth">
<el-input v-model="scoreForm.score" autocomplete="off" clearable></el-input>
</el-form-item>
<el-button type="primary" @click="addScore()">确认</el-button>
</el-form>
</el-dialog>
<div class="content3" @mouseup="select()" v-html="content"></div>
<div class="content_left1">
<div
class="tokenList1"
v-for="it in tokenList"
:key="it"
style="user-select:none; float: left;"
>
<el-tag
size="small"
@click="changeToken(it)"
closable
:disable-transitions="false"
@close="deleteToken(it)"
>
<a style="font-size: 18px;" v-html="it.word"></a>
<a style="font-size: 14px;">: 实体</a>
<a style="font-size: 14px;" v-html="it.entityId"></a>
<a style="font-size: 14px;">属性</a>
<a style="font-size: 14px;" v-html="it.attribute"></a>
<el-button style="margin-left: auto;font-size: 12px" @click="countScore()" size="mini" type="text">标注正确</el-button>
</el-tag>
</div>
</div>
<div style="overflow:auto;font-size: 15px;float: right;">
<!-- <button @click="computeFn()">开始计算</button>-->
计算得分 =
<b style="font-size: 20px">{{this.computeScore}}</b>
</div>
</div>
</el-main>
......@@ -62,6 +75,7 @@ export default {
// 任务
task: null,
// 文章内容
contentWithoutColor: "",
content: "",
//实体属性
tokenInit: {
......@@ -98,6 +112,9 @@ export default {
},
formLabelWidth: "120px",
executors: [],
computeScore: 0,
allScore: 1,
rightScore: 0,
};
},
beforeMount() {
......@@ -109,6 +126,12 @@ export default {
this.executors = this.$route.params.executor;
},
methods: {
countScore() {
this.rightScore++;
this.computeScore = (this.rightScore/this.allScore)*100;
console.log(this.rightScore);
console.log(this.allScore);
},
// 插入数据库
insertDocument() {
// console.log("insertDocument");
......@@ -134,6 +157,7 @@ export default {
this.documentId = res.result;
//console.log("this.documentId: " + this.documentId);
this.getContent();
this.getTemplate();
} else {
this.$message({
message: res.return_info,
......@@ -146,6 +170,7 @@ export default {
getContent() {
console.log("getContent this.file: " + JSON.stringify(this.file));
console.log("getContent this.documentId: " + this.documentId);
console.log("getContent this.content: " + this.content);
this.axios({
method: "post",
url: "/files/getFileContent",
......@@ -154,15 +179,14 @@ export default {
},
}).then((res) => {
if (res.return_code == 200) {
// console.log(" getContent: " + res.result);
this.allScore = 0;
this.rightScore = 0;
console.log(" getContent: " + res.result);
this.content = res.result;
console.log("getContent this.content: " + this.content);
this.$nextTick(function () {
this.getTokenList();
});
// console.log(
// " this.contentWithoutColor: " + this.contentWithoutColor
// );
this.contentWithoutColor = this.content;
} else {
this.$message({
message: res.return_info,
......@@ -184,8 +208,11 @@ export default {
},
}).then((res) => {
if (res.return_code == 200) {
this.content = this.contentWithoutColor;
this.allScore = 0;
res.result.forEach((element) => {
this.tokenInit = element;
this.allScore++;
console.log(" token: " + JSON.stringify(this.tokenInit));
this.tokenList.push(this.tokenInit);
let replaceReg = new RegExp(this.tokenInit.word, "g"); // 匹配关键字正则
......@@ -203,7 +230,151 @@ export default {
this.content = this.content.replace(replaceReg, replaceString);
});
console.log(" this.tokenList: " + JSON.stringify(this.tokenList));
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
},
//获取模板
getTemplate() {
console.log("getTemplate");
this.axios({
method: "post",
url: "/textAnnotation/getOneTemplate",
data: {
templateId: parseInt(this.piece.template),
},
}).then((res) => {
if (res.return_code == 200) {
console.log(res.result);
// 实体
this.token.entityId = res.result.templateName;
// 属性
this.treeData = res.result.entityList;
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
},
// 定位原文token
select() {
if (window.getSelection().toString() != "") {
//console.log(" token select" + JSON.stringify(this.token));
this.token.tokenId = "0";
this.token.word = window.getSelection().toString();
this.token.begin = window.getSelection().anchorOffset; //开始位置
this.token.end = window.getSelection().focusOffset; //结束位置
//console.log(" token select" + JSON.stringify(this.token));
//console.log(" tokenList select" + JSON.stringify(this.tokenList));
}
},
// 添加标注 // TODO 大于段落的标注还是无法渲染
uploadToken() {
let res = this.$refs.tree.getCheckedNodes();
let arr = [];
res.forEach((item) => {
arr.push(item.label); // 属性
});
if (arr.length == 0) {
this.$message({
message: "未选择属性",
type: "info",
});
} else {
// 删除原有
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: this.token.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList.splice(this.tokenList.indexOf(this.token), 1);
console.log(" token change" + JSON.stringify(this.token));
}
});
// 保存token
this.axios({
method: "post",
url: "/textAnnotation/addToken",
data: {
documentId: this.documentId,
token: {
word: this.token.word,
begin: this.token.begin,
end: this.token.end,
entityId: this.token.entityId,
attribute: arr,
},
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList = [];
this.getTokenList();
console.log(" token uploadToken" + JSON.stringify(token));
console.log(" token uploadToken" + JSON.stringify(this.token));
console.log(
" tokenList uploadToken" + JSON.stringify(this.tokenList)
);
this.$message({
message: "已保存",
type: "success",
});
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
}
return;
},
// 删除实体属性
deleteToken(tag) {
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: tag.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.$message({
type: "info",
message: "已删除",
});
this.tokenList.splice(this.tokenList.indexOf(tag), 1);
this.content = this.contentWithoutColor;
console.log(" this.tokenList: " + JSON.stringify(this.tokenList));
console.log(" this.content: " + this.content);
this.tokenList.forEach((element) => {
console.log(" token: " + JSON.stringify(element));
let replaceReg = new RegExp(element.word, "g"); // 匹配关键字正则
let replaceString =
'<span class="highlights-text">' +
element.word +
"</span>" +
'<span class="mark">' +
"(实体：" +
element.entityId +
"；属性：" +
element.attribute +
")" +
"</span>"; // 高亮替换v-html值
this.content = this.content.replace(replaceReg, replaceString);
});
} else {
this.$message({
message: res.return_info,
......@@ -211,6 +382,18 @@ export default {
});
}
});
// 不知道为啥不清除
//this.$nextTick(() => {
// this.$refs.tree.setCheckedKeys([]);
//});
},
// 修改实体属性=删除+添加（如果选择属性弹窗没有点提交直接关掉的话会删除，也就是双击直接删除，也许这里后期需要改）
changeToken(tag) {
this.token.tokenId = tag.tokenId;
this.token.word = tag.word;
this.token.begin = tag.begin;
this.token.end = tag.end;
this.token.entityId = tag.entityId;
},
// 打分
addScore() {
......@@ -240,23 +423,23 @@ export default {
)
this.$message("得分应该在0~100范围内");
else {
this.axios({
method: "get",
params: {
userId: this.$route.params.executor.id,
fileId: this.file.id,
scoreForm: this.scoreForm,
},
url: "task/gradePieces",
}).then((res) => {
console.log(res)
if (res.code == 0) {
alert("分数提交失败!");
} else if (res.code == 1) {
alert("打分成功");
this.$router.push({ path: "/check" });
}
});
this.axios({
method: "get",
params: {
userId: this.$route.params.executor.id,
fileId: this.file.id,
scoreForm: this.scoreForm,
},
url: "task/gradePieces",
}).then((res) => {
console.log(res);
if (res.code == 0) {
alert("分数提交失败!");
} else if (res.code == 1) {
alert("打分成功");
this.$router.push({ path: "/check" });
}
});
// this.commentScore = false;
// this.$message("打分成功");
}
......@@ -350,31 +533,32 @@ export default {
overflow: auto;
background-color: white;
box-shadow: 0px 0px 10px #dbdbdb;
.tokenList1 {
margin: 9px;
}
.token1 {
font-size: 18px;
}
}
}
.filter-container1 {
.filter-container3 {
margin-right: 40px;
margin-left: 20px;
margin-top: 40px;
height: calc(100vh - 61px - 100px);
width: 70%;
//float: center;
width: 100%;
padding: 25px 10px 20px 25px;
@include whiteBoard;
.content1 {
.content3 {
overflow: auto;
height: calc(100vh - 61px - 100px - 100px);
height: calc(100vh - 61px - 100px - 170px);
text-align: left;
font-size: 20px;
line-height: 30px;
}
.content_left1 {
width: 100%;
overflow: auto;
height: 100px;
margin-top: 1px;
.tokenList1 {
margin: 3px;
}
}
.button1 {
overflow: auto;
float: right;
......
DAPlatform-front/src/components/textAnnotation/Table.vue
......@@ -2,33 +2,6 @@
<div class="select-container">
<el-container>
<el-aside class="sidebar3">
<!-- 实体列表 -->
<div class="sidebar-box3">
<div>
<div class="img-list-title3">实体列表</div>
<div class="img-title-list-box3">
<div>
<div
class="tokenList3"
v-for="it in tokenList"
:key="it"
style="user-select:none; float: left;"
>
<el-tag
size="small"
@click="changeToken(it)"
closable
:disable-transitions="false"
@close="deleteToken(it)"
>
<a class="token3" v-html="it.word"></a>
</el-tag>
<br />
</div>
</div>
</div>
</div>
</div>
<!-- 表单列表 -->
<div class="sidebar-box3">
<div>
......@@ -46,12 +19,41 @@
</div>
</div>
</div>
<!-- 实体列表 -->
<div class="sidebar-box3">
<div>
<div class="img-list-title3">实体/属性模板</div>
<div class="img-title-list-box4">
<div>
<div style="overflow: auto;height: calc(100vh - 61px - 100px - 180px - 50px);">
<p v-html="'实体：'+ value" />
<el-tree
:data="treeData"
show-checkbox
default-expand-all
node-key="id"
ref="tree"
highlight-current
:props="defaultProps"
></el-tree>
</div>
<el-button
type="primary"
style="margin-top: 9px;margin-right: 20px;float:right"
@click="uploadToken"
size="small"
plain
>确定</el-button>
</div>
</div>
</div>
</div>
</el-aside>
<!-- 文件界面 -->
<el-main class="filter-container1" style="background-color: #FFFFFF">
<el-main class="filter-container2" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<!-- 表格界面 -->
<div class="content1">
<div class="content2">
<el-table
:data="nowContent.tableData"
:cell-style="cellStyle"
......@@ -69,29 +71,33 @@
</el-table>
</div>
<!-- 表格界面 -->
<div>
<el-button class="button1" type="primary" @click="submit()">提交</el-button>
</div>
<!-- 弹窗-->
<el-dialog title="请标注" :visible.sync="ifAlert">
<div style="overflow: auto;height: 50vh">
<p v-html="'实体：'+ value" />
<!--el-button type="primary" @click="handleOption">新建</el-button-->
<el-tree
:data="treeData"
show-checkbox
default-expand-all
node-key="id"
ref="tree"
highlight-current
:props="defaultProps"
></el-tree>
</div>
<div style="width: 100%;height: 5px"></div>
<el-button type="primary" style="margin-top: 30px" @click="uploadToken">确定</el-button>
</el-dialog>
<!-- 弹窗-->
<el-row>
<el-col :span="21">
<div class="content_left">
<div
class="tokenList3"
v-for="it in tokenList"
:key="it"
style="user-select:none; float: left;"
>
<el-tag
size="small"
@click="changeToken(it)"
closable
:disable-transitions="false"
@close="deleteToken(it)"
>
<a class="token3" v-html="it.word"></a>
</el-tag>
</div>
</div>
</el-col>
<el-col :span="3">
<div class="content_right">
<el-button class="button1" type="primary" @click="submit()">提交</el-button>
</div>
</el-col>
</el-row>
</div>
</el-main>
</el-container>
......@@ -241,7 +247,6 @@ export default {
this.tokenInit = element;
console.log(" token: " + JSON.stringify(this.tokenInit));
this.tokenList.push(this.tokenInit);
// TODO 初始渲染
});
console.log(" this.tokenList: " + JSON.stringify(this.tokenList));
} else {
......@@ -290,12 +295,10 @@ export default {
select: function (row, column) {
this.row = row;
this.column = column;
this.token.tokenId = "0";
this.token.word = row[column.property];
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.begin == this.tokenList[i].begin &&
......@@ -310,7 +313,6 @@ export default {
}
console.log(" token select" + JSON.stringify(this.token));
console.log(" tokenList select" + JSON.stringify(this.tokenList));
this.ifAlert = true; // 打开标注弹窗
},
getCellIndex: function ({ row, column, rowIndex, columnIndex }) {
row.index = rowIndex;
......@@ -336,18 +338,31 @@ export default {
},
// 添加标注
uploadToken() {
this.ifAlert = false;
let res = this.$refs.tree.getCheckedNodes();
let arr = [];
res.forEach((item) => {
arr.push(item.label); // 属性
});
if (arr == []) {
if (arr.length == 0) {
this.$message({
message: "未选择属性",
type: "info",
});
} else {
// 删除原有
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: this.token.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList.splice(this.tokenList.indexOf(this.token), 1);
}
});
// 保存token
this.axios({
method: "post",
......@@ -364,21 +379,9 @@ export default {
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList = [];
this.getTokenList();
this.cellStyle(this.row, this.column);
let token = {
tokenId: res.result,
word: this.token.word,
begin: this.token.begin,
end: this.token.end,
entityId: this.value,
attribute: arr,
};
this.tokenList.push(token);
console.log(" token uploadToken" + JSON.stringify(token));
console.log(" token uploadToken" + JSON.stringify(this.token));
console.log(
" tokenList uploadToken" + JSON.stringify(this.tokenList)
);
this.$message({
message: "已保存",
type: "success",
......@@ -423,30 +426,11 @@ export default {
},
// 修改实体属性=删除+添加（如果选择属性弹窗没有点提交直接关掉的话会删除，也就是双击直接删除，也许这里后期需要改）
changeToken(tag) {
this.ifAlert = true;
this.token = tag;
// this.tokenList.splice(this.tokenList.indexOf(tag), 1);
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: tag.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList.splice(this.tokenList.indexOf(tag), 1);
this.content = this.contentWithoutColor;
console.log(" this.tokenList: " + JSON.stringify(this.tokenList));
console.log(" this.content: " + this.content);
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
this.token.tokenId = tag.tokenId;
this.token.word = tag.word;
this.token.begin = tag.begin;
this.token.end = tag.end;
this.token.entityId = tag.entityId;
},
// 提交已标注文档
submit() {
......@@ -502,22 +486,53 @@ export default {
.img-title-list-box3 {
padding: 0 0 0 0;
width: 300px;
height: 200px;
height: 100px;
overflow: auto;
background-color: white;
//margin-top: 13px;
margin-bottom: 13px;
box-shadow: 0px 0px 10px #dbdbdb;
}
.img-title-list-box4 {
padding: 0 0 0 0;
width: 300px;
height: calc(100vh - 61px - 100px - 180px);
overflow: auto;
background-color: white;
box-shadow: 0px 0px 10px #dbdbdb;
}
}
.filter-container2 {
margin-right: 40px;
margin-left: 20px;
margin-top: 40px;
height: calc(100vh - 61px - 100px);
//float: center;
width: 100%;
@include whiteBoard;
.content2 {
overflow: auto;
height: calc(100vh - 61px - 100px - 110px);
text-align: left;
font-size: 20px;
line-height: 30px;
}
.content_left {
overflow: auto;
height: 60px;
margin-top: 1px;
.tokenList3 {
margin: 9px;
margin: 3px;
}
.token3 {
font-size: 18px;
font-size: 16px;
}
}
.button1 {
overflow: auto;
float: right;
margin-right: 10px;
margin-top: 10px;
}
}
.el-table .warning-row {
background: oldlace;
}
......
DAPlatform-front/src/components/textAnnotation/Tabled.vue
......@@ -48,10 +48,10 @@
</div>
</el-aside>
<!-- 文件界面 -->
<el-main class="filter-container1" style="background-color: #FFFFFF">
<el-main class="filter-container2" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<!-- 表格界面 -->
<div class="content1">
<div class="content2">
<el-table
:data="nowContent.tableData"
:cell-style="cellStyle"
......
DAPlatform-front/src/components/textAnnotation/TabledCheck.vue
......@@ -2,62 +2,65 @@
<div class="select-container">
<el-container>
<el-aside class="sidebar3">
<!-- 实体列表 -->
<!-- 表单列表 -->
<div class="sidebar-box3">
<div>
<div class="img-list-title3">实体列表</div>
<div class="img-list-title3">表单列表</div>
<div class="img-title-list-box3">
<div class="img-title-list3">
<div style="user-select:none; float:left; padding: 5px;">
<div
class="tokenList2"
v-for="it in tokenList"
:key="it"
style="user-select:none; float: left;"
v-for="item in allContent"
:key="item.tablename"
@click="changeSheet(item.tablename)"
>
<div
size="small"
@click="changeToken(it)"
closable
:disable-transitions="false"
@close="deleteToken(it)"
>
<li class="token2" v-html="it.word"></li>
</div>
<el-link icon="el-icon-edit" type="primary">{{ item.tablename }}</el-link>
</div>
</div>
</div>
</div>
</div>
<!-- 文本列表 -->
<!-- 实体列表 -->
<div class="sidebar-box3">
<div>
<div class="img-list-title3">表单列表</div>
<div class="img-title-list-box3">
<div style="user-select:none; float:left; padding: 5px;">
<div
v-for="item in allContent"
:key="item.tablename"
@click="changeSheet(item.tablename)"
>
<el-link icon="el-icon-edit" type="primary">{{ item.tablename }}</el-link>
<div class="img-list-title3">实体/属性模板</div>
<div class="img-title-list-box4">
<div>
<div style="overflow: auto;height: calc(100vh - 61px - 100px - 180px - 50px);">
<p v-html="'实体：'+ value" />
<el-tree
:data="treeData"
show-checkbox
default-expand-all
node-key="id"
ref="tree"
highlight-current
:props="defaultProps"
></el-tree>
</div>
<el-button
type="primary"
style="margin-top: 9px;margin-right: 20px;float:right"
@click="uploadToken"
size="small"
plain
>确定</el-button>
</div>
</div>
</div>
</div>
</el-aside>
<!-- 文件界面 -->
<el-main class="filter-container1" style="background-color: #FFFFFF">
<el-main class="filter-container2" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<!-- 表格界面 -->
<div class="content1">
<div class="content2">
<el-table
:data="nowContent.tableData"
:cell-style="cellStyle"
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"
......@@ -70,21 +73,47 @@
<!-- 表格界面 -->
<!-- 打分 -->
<!--div v-if="this.$route.query.isCheck == '1'"-->
<div class="button1" >
<el-button type="primary" @click="commentScore = true">打分</el-button>
<!-- <el-button type="primary" @click="submit()">提交</el-button>-->
<el-dialog title="请打分" :visible.sync="commentScore" width="400px">
<el-form :model="scoreForm">
<el-form-item label="标注准确率" :label-width="formLabelWidth">
<el-input v-model="scoreForm.accuracy" autocomplete="off" clearable></el-input>
</el-form-item>
<el-form-item label="标注得分" :label-width="formLabelWidth">
<el-input v-model="scoreForm.score" autocomplete="off" clearable></el-input>
</el-form-item>
<el-button class="button1" type="primary" @click="addScore()">确认</el-button>
</el-form>
</el-dialog>
</div>
<el-row>
<el-col :span="21">
<div class="content_left">
<div
class="tokenList3"
v-for="it in tokenList"
:key="it"
style="user-select:none; float: left;"
>
<el-tag
size="small"
@click="changeToken(it)"
closable
:disable-transitions="false"
@close="deleteToken(it)"
>
<a class="token3" v-html="it.word"></a>
</el-tag>
</div>
</div>
</el-col>
<el-col :span="3">
<div class="content_right">
<div class="button1">
<el-button type="primary" @click="commentScore = true">打分</el-button>
<!-- <el-button type="primary" @click="submit()">提交</el-button>-->
<el-dialog title="请打分" :visible.sync="commentScore" width="400px">
<el-form :model="scoreForm">
<el-form-item label="标注准确率" :label-width="formLabelWidth">
<el-input v-model="scoreForm.accuracy" autocomplete="off" clearable></el-input>
</el-form-item>
<el-form-item label="标注得分" :label-width="formLabelWidth">
<el-input v-model="scoreForm.score" autocomplete="off" clearable></el-input>
</el-form-item>
<el-button class="button1" type="primary" @click="addScore()">确认</el-button>
</el-form>
</el-dialog>
</div>
</div>
</el-col>
</el-row>
</div>
</el-main>
</el-container>
......@@ -187,6 +216,8 @@ export default {
this.getContent();
// 获得实体属性
this.getTokenList();
// 获得标注模板
this.getTemplate();
} else {
this.$message({
message: res.return_info,
......@@ -250,6 +281,67 @@ export default {
}
});
},
//获取模板
getTemplate() {
//console.log("getTemplate");
this.axios({
method: "post",
url: "/textAnnotation/getOneTemplate",
data: {
templateId: parseInt(this.piece.template),
},
}).then((res) => {
if (res.return_code == 200) {
//console.log(res.result)
// 实体
this.value = res.result.templateName; // 现在的实体与模板相近，所以就先固定了
// 属性
this.treeData = res.result.entityList;
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
},
// 更改表单
changeSheet(name) {
for (var i = 0; i < this.numOfSheet; i++) {
// console.log("in " + name + " " + this.nowContent.tablename)
if (name == this.allContent[i].tablename) {
// console.log("match " + JSON.stringify(this.allContent[i]))
this.nowContent = this.allContent[i];
}
}
},
// 定位原文token
select: function (row, column) {
this.row = row;
this.column = column;
this.token.tokenId = "0";
this.token.word = row[column.property];
this.token.begin = row.index;
this.token.end = column.index;
for (var i = 0; i < this.tokenList.length; i++) {
if (
this.token.begin == this.tokenList[i].begin &&
this.token.end == this.tokenList[i].end
) {
this.$message({
message: "选中单元格已标记",
type: "info",
});
return;
}
}
console.log(" token select" + JSON.stringify(this.token));
console.log(" tokenList select" + JSON.stringify(this.tokenList));
},
getCellIndex: function ({ row, column, rowIndex, columnIndex }) {
row.index = rowIndex;
column.index = columnIndex;
},
// 表格标注颜色
cellStyle: function (row, column, rowIndex, columnIndex) {
for (var i = 0; i < this.tokenList.length; i++) {
......@@ -268,6 +360,102 @@ export default {
}
return "";
},
// 添加标注
uploadToken() {
let res = this.$refs.tree.getCheckedNodes();
let arr = [];
res.forEach((item) => {
arr.push(item.label); // 属性
});
if (arr.length == 0) {
this.$message({
message: "未选择属性",
type: "info",
});
} else {
// 删除原有
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: this.token.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList.splice(this.tokenList.indexOf(this.token), 1);
}
});
// 保存token
this.axios({
method: "post",
url: "/textAnnotation/addToken",
data: {
documentId: this.documentId,
token: {
word: this.token.word,
begin: this.token.begin,
end: this.token.end,
entityId: this.token.entityId,
attribute: arr,
},
},
}).then((res) => {
if (res.return_code == 200) {
this.tokenList = [];
this.getTokenList();
this.cellStyle(this.row, this.column);
this.$message({
message: "已保存",
type: "success",
});
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
}
return;
},
// 删除实体属性
deleteToken(tag) {
console.log("deleteToken");
this.axios({
method: "post",
url: "/textAnnotation/deleteToken",
data: {
documentId: this.documentId,
tokenId: tag.tokenId,
},
}).then((res) => {
if (res.return_code == 200) {
this.$message({
type: "info",
message: "已删除",
});
this.tokenList.splice(this.tokenList.indexOf(tag), 1);
this.content = this.contentWithoutColor;
console.log(" this.tokenList: " + JSON.stringify(this.tokenList));
console.log(" this.content: " + this.content);
} else {
this.$message({
message: res.return_info,
type: "error",
});
}
});
},
// 修改实体属性=删除+添加（如果选择属性弹窗没有点提交直接关掉的话会删除，也就是双击直接删除，也许这里后期需要改）
changeToken(tag) {
this.token.tokenId = tag.tokenId;
this.token.word = tag.word;
this.token.begin = tag.begin;
this.token.end = tag.end;
this.token.entityId = tag.entityId;
},
// 打分
addScore() {
if (this.scoreForm.accuracy == "" || this.scoreForm.score == "")
......@@ -294,22 +482,22 @@ export default {
)
this.$message("分数范围在0~100");
else {
this.axios({
method: "get",
params: {
userId: this.$route.params.executor.id,
fileId: this.file.id,
scoreForm: this.scoreForm,
},
url: "task/gradePieces",
}).then((res) => {
if (res.code == 0) {
alert("分数提交失败!");
} else if (res.code == 1) {
alert("打分成功");
this.$router.push({ path: "/check" });
}
});
this.axios({
method: "get",
params: {
userId: this.$route.params.executor.id,
fileId: this.file.id,
scoreForm: this.scoreForm,
},
url: "task/gradePieces",
}).then((res) => {
if (res.code == 0) {
alert("分数提交失败!");
} else if (res.code == 1) {
alert("打分成功");
this.$router.push({ path: "/check" });
}
});
// this.commentScore = false;
// this.$message("打分成功");
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment