Skip to content

D
DA-Platform

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

Commit ad706141 by 郭婉茹
Options

file.url connect to documentId

parent 6f42d1ce
Showing with 120 additions and 269 deletions
DAPlatform-front/src/components/CheckDetail.vue
...@@ -44,10 +44,7 @@ export default { ...@@ -44,10 +44,7 @@ export default {
} }
switch (type) { switch (type) {
case "文本": case "文本":
self.$router.push({ name: 'SelectedText', path: '/selected', params: {documentId: documentId} }); goto("SelectedText");
break;
case "表格":
self.$router.push({ name: 'Tabled', path: '/tabled', params: {documentId: documentId} });
break; break;
case "图片": case "图片":
goto("image"); goto("image");
......
DAPlatform-front/src/components/CompletedTaskDetail.vue
...@@ -45,10 +45,7 @@ export default { ...@@ -45,10 +45,7 @@ export default {
} }
switch (type) { switch (type) {
case "文本": case "文本":
self.$router.push({ name: 'SelectedText', path: '/selected', params: {documentId: documentId} }); goto("SelectedText");
break;
case "表格":
self.$router.push({ name: 'Tabled', path: '/tabled', params: {documentId: documentId} });
break; break;
case "图片": case "图片":
goto("image"); goto("image");
......
DAPlatform-front/src/components/OngoingTaskDetail.vue
...@@ -44,10 +44,7 @@ export default { ...@@ -44,10 +44,7 @@ export default {
} }
switch (type) { switch (type) {
case "文本": case "文本":
self.$router.push({ name: 'SelectText', path: '/select', params: {documentId: documentId} }); goto("SelectText");
break;
case "表格":
self.$router.push({ name: 'Table', path: '/table', params: {documentId: documentId} });
break; break;
case "图片": case "图片":
goto("image"); goto("image");
......
DAPlatform-front/src/components/textAnnotation/SelectText.vue
<template> <template>
<div class="select-container"> <div class="select-container">
<el-container style="margin-top: 40px" :style="{ height : height_res-40+'px'}"> <el-container style="margin-top: 40px">
<el-aside <el-aside
class="sidebar" class="sidebar"
style="background-color: rgba(255,255,255,0);box-shadow: 0px 0px 0px rgba(255,255,255,0);padding-right: 20px" style="background-color: rgba(255,255,255,0);box-shadow: 0px 0px 0px rgba(255,255,255,0);padding-right: 20px"
> >
<!-- 实体列表 -->
<div class="sidebar-box"> <div class="sidebar-box">
<div> <div>
<div class="img-list-title">实体列表</div> <div class="img-list-title">实体列表</div>
<div class="img-title-list-box"> <div class="img-title-list-box">
<div id="img-title-list" style="user-select:none; float: left;"> <div class="img-title-list">
<div <div
class="tokenList" class="tokenList"
v-for="it in tokenList" v-for="it in tokenList"
...@@ -31,13 +32,15 @@ ...@@ -31,13 +32,15 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 文本列表 -->
<div class="sidebar-box"> <div class="sidebar-box">
<div> <div>
<div class="img-list-title">文本列表</div> <div class="img-list-title">文本列表</div>
<div class="img-title-list-box"> <div class="img-title-list-box">
<div id="img-title-list" style="user-select:none"> <div
<el-tree :data="textData" :props="defaultProps" @node-click="handleNodeClick"></el-tree> id="img-title-list"
</div> style="user-select:none; float:left; padding: 5px;"
>{{file.name}}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -46,14 +49,8 @@ ...@@ -46,14 +49,8 @@
<!-- 文本界面 --> <!-- 文本界面 -->
<el-main class="filter-container" style="background-color: #FFFFFF"> <el-main class="filter-container" style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;"> <div style="overflow-y:auto;height:100%;">
<div @mouseup="highlight()"> <div class="content" @mouseup="highlight()" v-html="content"></div>
<ul class="list">
<li v-for="it in msg" :key="it.message">
<div class="msg" v-html="it"></div>
<br /> <br />
</li>
</ul>
</div>
<div> <div>
<el-button type="primary" @click="submit()">提交</el-button> <el-button type="primary" @click="submit()">提交</el-button>
</div> </div>
...@@ -68,7 +65,7 @@ ...@@ -68,7 +65,7 @@
:value="item.label" :value="item.label"
></el-option> ></el-option>
</el-select> </el-select>
<el-button type="primary" @click="handleOption">新建</el-button> <!--el-button type="primary" @click="handleOption">新建</el-button-->
<el-tree <el-tree
:data="treedata" :data="treedata"
show-checkbox show-checkbox
...@@ -92,52 +89,25 @@ ...@@ -92,52 +89,25 @@
<script> <script>
export default { export default {
data() { data() {
const item = {
date: "2020-05-02",
name: "小明",
address: "那是我心中最美的“第三极”——第二次青藏科考青年说"
};
return { return {
// 文章id // 文章
documentId: '', file: null,
// 文章内容 // 文章内容
content: [], content: "",
//实体属性 //实体属性
token: { token: {
entityId: "", tokenId: "", // 编号
word: "", word: "", // 标注
begin: 0, begin: 0, // 起始位置
end: 0, end: 0, // 终止位置
attribute: "", entityId: "", // 实体
tokenId: "" attribute: [] // 属性
}, },
// 实体属性列表 // 实体属性列表
tokenList: [], tokenList: [],
// 文章列表 // 文章列表
textData: [ textData: [],
{
label: this.documentId,
children: [
{
label: this.documentId
},
{
label: "暂无数据"
}
]
}
],
treedata: [ treedata: [
// 基本信息
{
label: "滑坡名称"
},
{
label: "地理位置"
},
{
label: "行政位置"
},
{ {
label: "坐标", label: "坐标",
children: [ children: [
...@@ -150,68 +120,6 @@ export default { ...@@ -150,68 +120,6 @@ export default {
] ]
}, },
{ {
label: "滑坡年代",
children: [
{
label: "古滑坡"
},
{
label: "老滑坡"
},
{
label: "新滑坡"
}
]
},
{
label: "滑动时间",
children: [
{
label: "yyyy-MM-dd"
},
{
label: "HH:mm:ss"
}
]
},
{
label: "运动形式",
children: [
{
label: "旋转"
},
{
label: "平移"
},
{
label: "流动"
},
{
label: "侧向扩展"
},
{
label: "复合"
}
]
},
{
label: "滑体类型",
children: [
{
label: "岩质"
},
{
label: "土质"
},
{
label: "碎屑"
},
{
label: "堆积层"
}
]
},
{
label: "规模等级", label: "规模等级",
children: [ children: [
{ {
...@@ -230,56 +138,6 @@ export default { ...@@ -230,56 +138,6 @@ export default {
label: "小型" label: "小型"
} }
] ]
},
{
label: "宏观稳定性",
children: [
{
label: "不稳定"
},
{
label: "基本稳定"
},
{
label: "稳定"
}
]
},
{
label: "确定性程度",
children: [
{
label: "确定"
},
{
label: "基本确定"
},
{
label: "不确定"
}
]
},
//基本特征
{
label: "前缘高程（m）"
},
{
label: "后缘高程（m）"
},
{
label: "滑体平均厚度（m）"
},
{
label: "滑坡面积（㎡）"
},
{
label: "滑体体积（m³）"
},
{
label: "坡度（°）"
},
{
label: "主滑方向（°）"
} }
], ],
defaultProps: { defaultProps: {
...@@ -287,8 +145,9 @@ export default { ...@@ -287,8 +145,9 @@ export default {
label: "label" label: "label"
}, },
count: 1, count: 1,
tableData: Array(20).fill(item), ifAlert: false, // 弹窗
ifAlert: false, // 实体
value: "",
options: [ options: [
{ {
value: "选项1", value: "选项1",
...@@ -309,30 +168,24 @@ export default { ...@@ -309,30 +168,24 @@ export default {
] ]
}; };
}, },
created() { beforeMount() {
this.getParams(); // 从通用传来文本信息 // TODO 区分text和table
this.file = JSON.parse(decodeURIComponent(this.$route.params.file));
}, },
methods: { methods: {
// 获取文本id
getParams() {
var routerParams = this.$route.params.documentId;
this.documentId = routerParams;
},
handleNodeClick(data) {
console.log(data);
},
// 获取文本 // 获取文本
getContent() { getContent() {
console.log("this.file: " + JSON.stringify(this.file));
this.axios({ this.axios({
method: "post", method: "post",
url: "http://127.0.0.1:9100/uploadDownload/getFileContent", url: "/files/getFileContent",
data: { data: {
documentId: this.documentId documentId: this.file.url //JSON.stringify(this.file.id) // this.file.url
} }
}).then(res => { }).then(res => {
if (res.return_code == 200) { if (res.return_code == 200) {
console.log("123" + res.result); this.content = res.result;
content = res.result; console.log("this.content: " + this.content);
} else { } else {
this.$message({ this.$message({
message: res.return_info, message: res.return_info,
...@@ -341,40 +194,58 @@ export default { ...@@ -341,40 +194,58 @@ export default {
} }
}); });
}, },
// 暂时没用 // 获得实体属性列表
handleOption() { getTokenList() {
console.log(this.token.entityId); this.axios({
if (this.token.entityId) { method: "post",
url: "/textAnnotation/getTokenList",
data: {
documentId: this.file.url // id
}
}).then(res => {
if (res.return_code == 200) {
res.result.forEach(element => {
this.tokenList.push(element);
console.log("this.token: " + element);
});
} else {
this.$message({ this.$message({
message: "创建成功！", message: res.return_info,
type: "success" type: "error"
}); });
} }
});
}, },
// 定位原文token // 定位原文token
highlight() { highlight() {
if (window.getSelection().toString() != "") { if (window.getSelection().toString() != "") {
//console.log("1111"+window.getSelection().toString()); // 禁止重复标注
this.ifAlert = true; var i;
//var word; for (i = 0; i < this.tokenList.length; i++) {
if (window.getSelection().toString() == this.tokenList[i].word)
return;
}
this.ifAlert = true; // 打开标注弹窗
this.token.word = window.getSelection().toString(); this.token.word = window.getSelection().toString();
this.token.begin = window.getSelection().anchorOffset; //开始位置 this.token.begin = window.getSelection().anchorOffset; //开始位置
this.token.end = window.getSelection().focusOffset; //结束位置 this.token.end = window.getSelection().focusOffset; //结束位置
console.log("token: " + JSON.stringify(this.token));
} }
}, },
// 标注 // 添加标注 // TODO templete列表传输
handleCheckChange() { handleCheckChange() {
console.log(this.$refs.tree.getCheckedNodes()); this.ifAlert = false;
this.ifAlert = 0; this.token.entityId = this.value; // 实体
let res = this.$refs.tree.getCheckedNodes(); let res = this.$refs.tree.getCheckedNodes();
let arr = []; let arr = [];
let token = {}; let token = {};
res.forEach(item => { res.forEach(item => {
arr.push(item.label); arr.push(item.label);
}); });
console.log("111" + arr); this.token.attribute = arr; // 属性
this.token.attribute = arr[0]; //console.log("entity: " + JSON.stringify(this.token.entityId));
this.content = this.content.map(item => { //console.log("attribute: " + JSON.stringify(this.token.attribute));
// 渲染文本
let replaceReg = new RegExp(this.token.word, "g"); // 匹配关键字正则 let replaceReg = new RegExp(this.token.word, "g"); // 匹配关键字正则
let replaceString = let replaceString =
'<span class="highlights-text">' + '<span class="highlights-text">' +
...@@ -384,24 +255,24 @@ export default { ...@@ -384,24 +255,24 @@ export default {
"(实体：" + "(实体：" +
this.token.entityId + this.token.entityId +
"；属性：" + "；属性：" +
arr + this.token.attribute +
")" + ")" +
"</span>"; // 高亮替换v-html值 "</span>"; // 高亮替换v-html值
// 保存实体 console.log("文本渲染" + replaceReg + replaceString);
if (this.token.entityId == "" && arr == []) { // TODO length bug
return; if (this.token.entityId == "" && this.token.attribute.length == 0) return;
} // 保存token
this.axios({ this.axios({
method: "post", method: "post",
url: "http://127.0.0.1:9100/textAnnotation/addToken", url: "/textAnnotation/addToken",
data: { data: {
documentId: this.documentId, documentId: this.file.url,
token: { token: {
entityId: this.token.entityId, // TODO:这里类型似乎是string
word: this.token.word, word: this.token.word,
begin: this.token.begin, begin: this.token.begin,
end: this.token.end, end: this.token.end,
attribute: arr[0] entityId: this.token.entityId,
attribute: this.token.attribute
} }
} }
}).then(res => { }).then(res => {
...@@ -410,6 +281,10 @@ export default { ...@@ -410,6 +281,10 @@ export default {
token = this.token; token = this.token;
this.token = {}; this.token = {};
this.tokenList.push(token); this.tokenList.push(token);
this.$message({
message: "已保存",
type: "success"
});
} else { } else {
this.$message({ this.$message({
message: res.return_info, message: res.return_info,
...@@ -418,17 +293,13 @@ export default { ...@@ -418,17 +293,13 @@ export default {
} }
}); });
// 不知道为啥有缓存不能清除 // 不知道为啥有缓存不能清除
this.$nextTick(() => { // this.$nextTick(() => {
this.$refs.tree.setCheckedKeys([]); // this.$refs.tree.setCheckedKeys([]);
}); //});
this.token.entityId = ""; this.value = "";
return item.replace(replaceReg, replaceString); return this.content = this.content.replace(replaceReg, replaceString);
});
this.$message({
message: "保存成功！",
type: "success"
});
}, },
// 修改实体属性=删除+添加（如果选择属性弹窗没有点提交直接关掉的话会删除） // 修改实体属性=删除+添加（如果选择属性弹窗没有点提交直接关掉的话会删除）
handleTokenChange(tag) { handleTokenChange(tag) {
this.ifAlert = true; this.ifAlert = true;
...@@ -471,26 +342,40 @@ export default { ...@@ -471,26 +342,40 @@ export default {
handleTokenClose(tag) { handleTokenClose(tag) {
this.tokenList.splice(this.tokenList.indexOf(tag), 1); this.tokenList.splice(this.tokenList.indexOf(tag), 1);
this.token = tag; this.token = tag;
this.content = this.content.map(item => {
let replaceReg = new RegExp( let replaceReg = new RegExp(
'<span class="highlights-text">' + this.token.word + "</span>", '<span class="highlights-text">' + this.token.word + "</span>" +
'<span class="mark">' +
"(实体：" +
this.token.entityId +
"；属性：" +
this.token.attribute +
")" +
"</span>",
"g" "g"
); // 匹配关键字正则 ); // 匹配关键字正则
let replaceString = this.token.word; let replaceString = this.token.word;
// this.content = this.content.replace(replaceReg, replaceString);
if (this.token.entityId == "" && this.token.attribute == []) { console.log("hello");
return; console.log("hello");
} console.log("hello");
console.log(this.content);
console.log(replaceReg);
// TODO length bug
if (this.token.entityId == "" && this.token.attribute == []) return;
this.axios({ this.axios({
method: "post", method: "post",
url: "http://127.0.0.1:9100/textAnnotation/deleteToken", url: "/textAnnotation/deleteToken",
data: { data: {
documentId: this.documentId, documentId: this.file.url,
tokenId: this.token.tokenId tokenId: this.token.tokenId
} }
}).then(res => { }).then(res => {
if (res.return_code == 200) console.log("123" + res.return_info); if (res.return_code == 200) {
else { this.$message({
type: "info",
message: "已删除"
});
} else {
this.$message({ this.$message({
message: res.return_info, message: res.return_info,
type: "error" type: "error"
...@@ -498,16 +383,11 @@ export default { ...@@ -498,16 +383,11 @@ export default {
} }
}); });
// 不知道为啥不清除 // 不知道为啥不清除
this.$nextTick(() => { //this.$nextTick(() => {
this.$refs.tree.setCheckedKeys([]); // this.$refs.tree.setCheckedKeys([]);
}); //});
this.token.entityId = ""; //this.value = "";
return item.replace(replaceReg, replaceString); return this.content = this.content.replace(replaceReg, replaceString);
});
this.$message({
type: "info",
message: "已删除"
});
}, },
// 提交本次标注 // 提交本次标注
...@@ -517,33 +397,13 @@ export default { ...@@ -517,33 +397,13 @@ export default {
// type: "success" // type: "success"
// }); // });
this.$router.replace("/completed"); this.$router.replace("/completed");
},
// 放到边栏的token边栏
getTokenList() {
this.axios({
method: "post",
url: "http://127.0.0.1:9100/textAnnotation/getTokenList",
data: {
documentId: this.documentId
} }
}).then(res => { // 放到边栏的token边栏
if (res.return_code == 200) {
res.result.forEach(element => {
this.tokenList.push(element);
});
} else {
this.$message({
message: res.return_info,
type: "error"
});
}
});
}
},
watch: {
$route: "getParams"
}, },
mounted: function() { mounted: function() {
// 获得文章
this.getContent();
// 获得实体属性
this.getTokenList(); //需要触发的函数 this.getTokenList(); //需要触发的函数
} }
}; };
......
DAPlatform-front/src/components/textAnnotation/SelectedText.vue
<template> <template>
<div class="select-container"> <div class="select-container">
<el-container style="margin-top: 40px" :style="{ height : height_res-40+'px'}"> <el-container style="margin-top: 40px">
<el-aside <el-aside
class="sidebar" class="sidebar"
style="background-color: rgba(255,255,255,0);box-shadow: 0px 0px 0px rgba(255,255,255,0);padding-right: 20px" style="background-color: rgba(255,255,255,0);box-shadow: 0px 0px 0px rgba(255,255,255,0);padding-right: 20px"
......
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