|
@@ -4,22 +4,66 @@ require("./../css/participle.less");
|
|
|
require("./../css/common.css");
|
|
|
const { post, api } = require('./api.js');
|
|
|
require('./../resources/images/empty2.png');
|
|
|
+require('./../resources/images/iconUp.png');
|
|
|
+require('./../resources/images/iconDown.png');
|
|
|
+require('./../resources/images/iconClose3.png');
|
|
|
const {currentIIData} = require('./data.js')
|
|
|
-const initData = currentIIData[14]
|
|
|
|
|
|
-for(let i = 0; i < 3; i++){
|
|
|
- let str = `<span class="example" id="example${i+1}" data-index=${i}>示例${i+1}</span>`
|
|
|
- $('.btnBox').append(str)
|
|
|
+function appendCurrentII(currentIIList){
|
|
|
+ for(let i = 0; i < currentIIList.length; i++){
|
|
|
+ let str = `<p class="example" id="example${i+1}" data-index=${i}>${currentIIList[i].title} <span class="exampleBtn">引用</span> <img class="iconSlide" src="./images/iconDown.png" alt="logo"></p>
|
|
|
+ <div class="exampleInfo${i} exampleInfo">${currentIIList[i].content}</div>`;
|
|
|
+ $('.exampleList .pop-body').append(str)
|
|
|
+ }
|
|
|
+
|
|
|
+ $('.example').click(function(){
|
|
|
+ const index1 = $(".example.selected").attr('data-index');
|
|
|
+ $(`.example.selected img`).attr('src','./images/iconDown.png')
|
|
|
+ $(`.exampleInfo${index1}`).slideUp()
|
|
|
+ $(".example").removeClass("selected");
|
|
|
+ $(this).addClass("selected");
|
|
|
+ const index2 = $(".example.selected").attr('data-index');
|
|
|
+ if($(`.exampleInfo${index2}`).css('display') === 'block'){
|
|
|
+ $(`.example.selected img`).attr('src','./images/iconDown.png')
|
|
|
+
|
|
|
+ $(".example").removeClass("selected");
|
|
|
+ $(`.exampleInfo${index2}`).slideUp()
|
|
|
+
|
|
|
+ }else{
|
|
|
+ $(`.exampleInfo${index2}`).slideDown()
|
|
|
+ $(`.example.selected img`).attr('src','./images/iconUp.png')
|
|
|
+ }
|
|
|
+
|
|
|
+ });
|
|
|
+ $('.exampleBtn').click(function(e){
|
|
|
+ e.stopPropagation();
|
|
|
+ const index = $(this).parent().attr('data-index');
|
|
|
+ $('#infoTxt').val(currentIIList[index].content);
|
|
|
+ getEntityPredict();
|
|
|
+ $(".pop-box").hide();
|
|
|
+ });
|
|
|
}
|
|
|
|
|
|
-$('.example').click(function(){
|
|
|
- const index = $(this).attr('data-index')
|
|
|
- $('#infoTxt').val(currentIIData[index])
|
|
|
- getEntityPredict();
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+$("#showEgBtn").click(function(){
|
|
|
+ const popShow = $(".pop-box").css('display')
|
|
|
+ if(popShow === 'block'){
|
|
|
+ $(".pop-box").hide();
|
|
|
+ } else{
|
|
|
+ $(".pop-box").show();
|
|
|
+ }
|
|
|
+
|
|
|
+});
|
|
|
+/******弹窗事件******/
|
|
|
+$(".pop-cover,.pop-close,.pop-cancel").click(()=>{
|
|
|
+ $(".pop-box").hide();
|
|
|
})
|
|
|
|
|
|
-$('#infoTxt').val(initData)
|
|
|
-getEntityPredict();
|
|
|
+
|
|
|
function insertStr(soure, start, newStr){
|
|
|
return soure.slice(0, start) + newStr + soure.slice(start);
|
|
|
}
|
|
@@ -35,20 +79,86 @@ function getEntityPredict(){
|
|
|
|
|
|
]
|
|
|
|
|
|
- }
|
|
|
+ };
|
|
|
+ $(".resultBoxInfo").html(`<p style="color: #aaa;text-align: center;margin-top:50px;">正在分析...</p>`);
|
|
|
+ $(".analying").css('display','block');
|
|
|
+ $('table').css("display","none")
|
|
|
+
|
|
|
+ $('.empty').hide();
|
|
|
post(api.entity_predict, param).then(res =>{
|
|
|
if(res.data.code == '0'){
|
|
|
const data = JSON.parse(res.data.data)
|
|
|
const result = data.data[0].entity_relation_object
|
|
|
- const entryList = result.outputs.annotation['T']
|
|
|
- const relationList = result.outputs.annotation['R']
|
|
|
+ const entryList = result&&result.outputs&&result.outputs.annotation['T']
|
|
|
+ const relationList = result&&result.outputs&&result.outputs.annotation['R']
|
|
|
let content = result.content
|
|
|
- getSchema(content,entryList)
|
|
|
- getRelationList(relationList,entryList)
|
|
|
+ // getSchema(content,entryList)
|
|
|
+ if((JSON.stringify(entryList)!='[""]')&&(JSON.stringify(relationList)!='[""]')){
|
|
|
+ getRelationList(relationList,entryList)
|
|
|
+ let enter = chageEnter(entryList)
|
|
|
+ let rela = chageRelation(relationList)
|
|
|
+ let svgData = Object.assign(enter,rela,{"content":content})
|
|
|
+ showSvg(svgData)
|
|
|
+ $('#analy').removeClass('disabled')
|
|
|
+ }else{
|
|
|
+ $('#analy').addClass('disabled')
|
|
|
+ $('.resultBoxInfo').html('')
|
|
|
+ $('.empty').css("display","block");
|
|
|
+ $('.analying').css("display","none")
|
|
|
+ $('table').css("display","none")
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+function chageEnter(data){
|
|
|
+ var keyMap = {
|
|
|
+ "name" : "text",
|
|
|
+ "start" : "startIndex",
|
|
|
+ "end" : "endIndex",
|
|
|
+ "id" : "categoryId",
|
|
|
+ };
|
|
|
+ for(let i = 0;i < data.length;i++){
|
|
|
+ let obj = data[i];
|
|
|
+ for(let key in obj){
|
|
|
+ let newKey = keyMap[key];
|
|
|
+ if(newKey){
|
|
|
+ obj[newKey] = obj[key];
|
|
|
+ // delete obj[key];
|
|
|
+ }
|
|
|
+ obj.color = "red"
|
|
|
+ obj.borderColor = "#5A8EEE"
|
|
|
+ }
|
|
|
+ }
|
|
|
+ data.splice(0,1)
|
|
|
+ return {
|
|
|
+ "labelCategories":data,
|
|
|
+ "labels":data
|
|
|
+ }
|
|
|
+}
|
|
|
+function chageRelation(data){
|
|
|
+ var keyMap = {
|
|
|
+ "name" : "text",
|
|
|
+ "from" : "fromId",
|
|
|
+ "to" : "toId",
|
|
|
+ "id" : "categoryId",
|
|
|
+ };
|
|
|
+ for(let i = 0;i < data.length;i++){
|
|
|
+ let obj = data[i];
|
|
|
+ for(let key in obj){
|
|
|
+ let newKey = keyMap[key];
|
|
|
+ if(newKey){
|
|
|
+ obj[newKey] = obj[key];
|
|
|
+ }
|
|
|
+ obj.id = i
|
|
|
+ obj.categoryId = i
|
|
|
+ }
|
|
|
+ }
|
|
|
+ data.splice(0,1)
|
|
|
+ return {
|
|
|
+ "connectionCategories":data,
|
|
|
+ "connections":data,
|
|
|
+ }
|
|
|
+}
|
|
|
function getSchema(content, entryList){
|
|
|
let addNum = 0
|
|
|
for(let i = 1; i < entryList.length; i++){
|
|
@@ -61,7 +171,6 @@ function getSchema(content, entryList){
|
|
|
content = insertStr(content, entryList[i].end+addNum, '</span><span class="star">*</span>')
|
|
|
addNum += 34
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
$('.resultBoxInfo').html(content)
|
|
|
}
|
|
@@ -80,6 +189,7 @@ function getRelationList(relationList,entryList){
|
|
|
}
|
|
|
if(str){
|
|
|
$('.empty').css("display","none");
|
|
|
+ $('.analying').css("display","none")
|
|
|
$('table').css("display","table")
|
|
|
}
|
|
|
$('.relationBody').html(str)
|
|
@@ -91,6 +201,23 @@ $("#analy").click(function(){
|
|
|
getEntityPredict()
|
|
|
}
|
|
|
})
|
|
|
+getMrInfo()
|
|
|
+function getMrInfo(){
|
|
|
+ post(api.getMrInfo, {}).then(res =>{
|
|
|
+ if(res.data.code == '0'){
|
|
|
+ const MrInfoList = res.data.data
|
|
|
+ const initData = MrInfoList[0].content
|
|
|
+ initTxtData(initData)
|
|
|
+ const currentIIList = MrInfoList&&MrInfoList.slice(1,MrInfoList.length)
|
|
|
+ appendCurrentII(currentIIList)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function initTxtData(data){
|
|
|
+ $('#infoTxt').val(data)
|
|
|
+ getEntityPredict();
|
|
|
+}
|
|
|
|
|
|
$("#infoTxt").bind("input propertychange",function(event){
|
|
|
const val = $("#infoTxt").val().trim()
|
|
@@ -104,3 +231,17 @@ $("#infoTxt").bind("input propertychange",function(event){
|
|
|
}
|
|
|
});
|
|
|
|
|
|
+function showSvg(data){
|
|
|
+ $("#svg").html("")//防止页面不渲染
|
|
|
+ const poplar = require('poplar-annotation');
|
|
|
+ const {Annotator} = poplar;
|
|
|
+ const elm = document.getElementById("svg");
|
|
|
+ new Annotator(data,elm,{
|
|
|
+ contentEditable:false,
|
|
|
+ unconnectedLineStyle:"none",
|
|
|
+ labelPadding:3,
|
|
|
+ topContextMargin:-4,
|
|
|
+ bracketWidth:5,
|
|
|
+ labelWidthCalcMethod:'label'
|
|
|
+ });
|
|
|
+}
|