mirror of https://github.com/doccano/doccano.git
Hironsan
6 years ago
2 changed files with 158 additions and 115 deletions
Split View
Diff Options
@ -1,42 +1,71 @@ |
|||
Vue.config.debug = true; |
|||
|
|||
var app4 = new Vue({ |
|||
var app = new Vue({ |
|||
el: '#app', |
|||
delimiters: ['[[', ']]'], |
|||
data: { |
|||
cur: 2, |
|||
items: [ |
|||
{"id": 10, "labels": [{"text": "Prefecture", "prob": 0.98}, {"text": "Domestic Region", "prob": 0.58}], "text": "北海道（ほっかいどう）は、日本の北部に位置する島[※ 1][※ 2]。また、同島および付随する島を管轄する地方公共団体（道）である。島としての北海道は日本列島を構成する主要4島の一つである。地方公共団体としての北海道は47都道府県中唯一の「道」で、道庁所在地は札幌市。"}, |
|||
{"id": 11, "labels": [{"text": "Person", "prob": 0.98}], "text": "安倍 晋三（あべ しんぞう、1954年（昭和29年）9月21日 - ）は、日本の政治家。自由民主党所属の衆議院議員（9期）、第90代・第96代・第97代・第98代内閣総理大臣、第21代・第25代自由民主党総裁。"}, |
|||
{"id": 12, "labels": [{"text": "Country", "prob": 0.99}, {"text": "Continental Region", "prob": 0.58}], "text": "アメリカ合衆国（アメリカがっしゅうこく、英語: United States of America）、通称アメリカ、米国（べいこく）は、50の州および連邦区から成る連邦共和国である[6][7]。アメリカ本土の48州およびワシントンD.C.は、カナダとメキシコの間の北アメリカ中央に位置する。アラスカ州は北アメリカ北西部の角に位置し、東ではカナダと、西ではベーリング海峡をはさんでロシアと国境を接している。ハワイ州は中部太平洋における島嶼群である。同国は、太平洋およびカリブに5つの有人の海外領土および9つの無人の海外領土を有する。985万平方キロメートル (km2) の総面積は世界第3位または第4位、3億1千7百万人の人口は世界第3位である。同国は世界で最も民族的に多様かつ多文化な国の1つであり、これは多くの国からの大規模な移住の産物とされている[8]。また同国の広大な国土における地理および気候も極めて多様であり、多種多様な野生生物が存在する。"}, |
|||
cur: 0, |
|||
items: [{ |
|||
"id": 10, |
|||
"labels": [{ |
|||
"text": "Prefecture", |
|||
"prob": 0.98 |
|||
}, { |
|||
"text": "Domestic Region", |
|||
"prob": 0.58 |
|||
}], |
|||
"text": "北海道（ほっかいどう）は、日本の北部に位置する島[※ 1][※ 2]。また、同島および付随する島を管轄する地方公共団体（道）である。島としての北海道は日本列島を構成する主要4島の一つである。地方公共団体としての北海道は47都道府県中唯一の「道」で、道庁所在地は札幌市。" |
|||
}, |
|||
{ |
|||
"id": 11, |
|||
"labels": [{ |
|||
"text": "Person", |
|||
"prob": 0.98 |
|||
}], |
|||
"text": "安倍 晋三（あべ しんぞう、1954年（昭和29年）9月21日 - ）は、日本の政治家。自由民主党所属の衆議院議員（9期）、第90代・第96代・第97代・第98代内閣総理大臣、第21代・第25代自由民主党総裁。" |
|||
}, |
|||
{ |
|||
"id": 12, |
|||
"labels": [{ |
|||
"text": "Country", |
|||
"prob": 0.99 |
|||
}, { |
|||
"text": "Continental Region", |
|||
"prob": 0.58 |
|||
}], |
|||
"text": "アメリカ合衆国（アメリカがっしゅうこく、英語: United States of America）、通称アメリカ、米国（べいこく）は、50の州および連邦区から成る連邦共和国である[6][7]。アメリカ本土の48州およびワシントンD.C.は、カナダとメキシコの間の北アメリカ中央に位置する。アラスカ州は北アメリカ北西部の角に位置し、東ではカナダと、西ではベーリング海峡をはさんでロシアと国境を接している。ハワイ州は中部太平洋における島嶼群である。同国は、太平洋およびカリブに5つの有人の海外領土および9つの無人の海外領土を有する。985万平方キロメートル (km2) の総面積は世界第3位または第4位、3億1千7百万人の人口は世界第3位である。同国は世界で最も民族的に多様かつ多文化な国の1つであり、これは多くの国からの大規模な移住の産物とされている[8]。また同国の広大な国土における地理および気候も極めて多様であり、多種多様な野生生物が存在する。" |
|||
}, |
|||
], |
|||
labels: [], |
|||
guideline: 'annotation text' |
|||
guideline: 'annotation guideline' |
|||
}, |
|||
methods: { |
|||
addLabel: function (label) { |
|||
this.items[this.cur]['labels'].push({"text": label, "prob":null}) |
|||
this.items[this.cur]['labels'].push({ |
|||
"text": label, |
|||
"prob": null |
|||
}) |
|||
}, |
|||
deleteLabel: function (index) { |
|||
this.items[this.cur]['labels'].splice(index, 1) |
|||
this.items[this.cur]['labels'].splice(index, 1) |
|||
}, |
|||
nextPage: function () { |
|||
this.cur += 1 |
|||
this.cur += 1 |
|||
}, |
|||
prevPage: function () { |
|||
this.cur -= 1 |
|||
this.cur -= 1 |
|||
} |
|||
}, |
|||
created: function () { |
|||
console.log('created'); |
|||
var self = this; |
|||
axios.get('/annotation/api/label') |
|||
.then(function(response) { |
|||
.then(function (response) { |
|||
console.log('label request'); |
|||
self.labels = response.data['labels']; |
|||
}) |
|||
.catch(function(error) { |
|||
console.log('ERROR!! happend by Backend.') |
|||
}); |
|||
}) |
|||
.catch(function (error) { |
|||
console.log('ERROR!! happend by Backend.') |
|||
}); |
|||
} |
|||
}) |
|||
@ -1,128 +1,142 @@ |
|||
{% load static %} |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head> |
|||
<meta charset="utf-8"> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|||
<title>Forum - Free Bulma template</title> |
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha256-eZrrJcwDc/3uDhsdt61sL2oOBY362qM3lon1gyExkL0=" crossorigin="anonymous" /> |
|||
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"> |
|||
<!-- Bulma Version 0.6.2--> |
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.2/css/bulma.min.css" integrity="sha256-2k1KVsNPRXxZOsXQ8aqcZ9GOOwmJTMoOB5o5Qp1d6/s=" crossorigin="anonymous" /> |
|||
<link rel="stylesheet" type="text/css" href="{% static 'forum.css' %}"> |
|||
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> |
|||
<script src="https://unpkg.com/axios/dist/axios.min.js"></script> |
|||
|
|||
</head> |
|||
<body> |
|||
<nav class="navbar is-white"> |
|||
<div class="container"> |
|||
<div class="navbar-brand"> |
|||
<a class="navbar-item" href="../"> |
|||
<img src="{% static 'images/logo.png' %}" width="40" height="48">doccano |
|||
</a> |
|||
</div> |
|||
<div id="topNav" class="navbar-menu"> |
|||
<div class="navbar-end"> |
|||
<div class="navbar-item"> |
|||
<div class="field is-grouped"> |
|||
<p class="control"> |
|||
<a class="button is-small"> |
|||
<span class="icon"> |
|||
<i class="fa fa-user-plus"></i> |
|||
</span> |
|||
<span> |
|||
Register |
|||
</span> |
|||
</a> |
|||
</p> |
|||
<p class="control"> |
|||
<a class="button is-small is-primary is-outlined"> |
|||
<span class="icon"> |
|||
<i class="fa fa-user"></i> |
|||
</span> |
|||
<span>Login</span> |
|||
</a> |
|||
</p> |
|||
</div> |
|||
<head> |
|||
<meta charset="utf-8"> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|||
<title>Forum - Free Bulma template</title> |
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha256-eZrrJcwDc/3uDhsdt61sL2oOBY362qM3lon1gyExkL0=" |
|||
crossorigin="anonymous" /> |
|||
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"> |
|||
<!-- Bulma Version 0.6.2--> |
|||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.2/css/bulma.min.css" integrity="sha256-2k1KVsNPRXxZOsXQ8aqcZ9GOOwmJTMoOB5o5Qp1d6/s=" |
|||
crossorigin="anonymous" /> |
|||
<link rel="stylesheet" type="text/css" href="{% static 'forum.css' %}"> |
|||
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> |
|||
<script src="https://unpkg.com/axios/dist/axios.min.js"></script> |
|||
</head> |
|||
|
|||
<body> |
|||
<nav class="navbar is-white"> |
|||
<div class="container"> |
|||
<div class="navbar-brand"> |
|||
<a class="navbar-item" href="../"> |
|||
<img src="{% static 'images/logo.png' %}" width="40" height="48">doccano |
|||
</a> |
|||
</div> |
|||
<div id="topNav" class="navbar-menu"> |
|||
<div class="navbar-end"> |
|||
<div class="navbar-item"> |
|||
<div class="field is-grouped"> |
|||
<p class="control"> |
|||
<a class="button is-small"> |
|||
<span class="icon"> |
|||
<i class="fa fa-user-plus"></i> |
|||
</span> |
|||
<span> |
|||
Register |
|||
</span> |
|||
</a> |
|||
</p> |
|||
<p class="control"> |
|||
<a class="button is-small is-primary is-outlined"> |
|||
<span class="icon"> |
|||
<i class="fa fa-user"></i> |
|||
</span> |
|||
<span>Login</span> |
|||
</a> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</nav> |
|||
</div> |
|||
</nav> |
|||
|
|||
<section class="container" id="app"> |
|||
<div class="columns"> |
|||
<section class="container" id="app"> |
|||
<div class="columns"> |
|||
|
|||
<div class="column is-8"> |
|||
<div class="box content"> |
|||
<div class="tabs is-right"> |
|||
<ul> |
|||
<li class="is-active"><a>Document</a></li> |
|||
<li><a>Guidelilne</a></li> |
|||
</ul> |
|||
</div> |
|||
<article class="post"> |
|||
<h4> |
|||
<div class="field is-grouped is-grouped-multiline"> |
|||
<div class="control" v-for="(label, index) in items[cur].labels"> |
|||
<div class="tags has-addons"> |
|||
<span class="tag is-grey"> |
|||
<button class="delete is-small" v-on:click="deleteLabel(index)"></button> |
|||
[[label.text]] |
|||
</span> |
|||
<span class="tag is-primary" v-if="label.prob">[[label.prob]]</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</h4> |
|||
<div class="media"> |
|||
<div class="media-content"> |
|||
<div class="content"> |
|||
<p> |
|||
[[items[cur].text]] |
|||
</p> |
|||
<div class="column is-8"> |
|||
<div class="box content"> |
|||
<div class="tabs is-right"> |
|||
<ul> |
|||
<li class="is-active"> |
|||
<a>Document</a> |
|||
</li> |
|||
<li> |
|||
<a>Guidelilne</a> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
<article class="post"> |
|||
<h4> |
|||
<div class="field is-grouped is-grouped-multiline"> |
|||
<div class="control" v-for="(label, index) in items[cur].labels"> |
|||
<div class="tags has-addons"> |
|||
<span class="tag is-grey"> |
|||
<button class="delete is-small" v-on:click="deleteLabel(index)"></button> |
|||
[[label.text]] |
|||
</span> |
|||
<span class="tag is-primary" v-if="label.prob">[[label.prob]]</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</article> |
|||
</div> |
|||
</h4> |
|||
<div class="media"> |
|||
<div class="media-content"> |
|||
<div class="content"> |
|||
<p> |
|||
[[items[cur].text]] |
|||
</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</article> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="column is-4"> |
|||
|
|||
<div class="box content"> |
|||
|
|||
<div class="tabs is-right"> |
|||
<ul> |
|||
<li class="is-active"><a>Labeling</a></li> |
|||
<li><a>History</a></li> |
|||
</ul> |
|||
</div> |
|||
<div class="column is-4"> |
|||
<div class="box content"> |
|||
<div class="tabs is-right"> |
|||
<ul> |
|||
<li class="is-active"> |
|||
<a>Labeling</a> |
|||
</li> |
|||
<li> |
|||
<a>History</a> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
|
|||
<div class="control"> |
|||
<a class="button is-link" v-on:click="prevPage"><i class="fa fa-chevron-left"></i></a> |
|||
<a class="button is-link" v-on:click="nextPage"><i class="fa fa-chevron-right"></i></a> |
|||
</div> |
|||
<div class="control"> |
|||
<a class="button is-link" v-on:click="prevPage"> |
|||
<i class="fa fa-chevron-left"></i> |
|||
</a> |
|||
<a class="button is-link" v-on:click="nextPage"> |
|||
<i class="fa fa-chevron-right"></i> |
|||
</a> |
|||
</div> |
|||
|
|||
<a class="button is-primary is-block" href="#">Learn & Classify</a> |
|||
<a class="button is-primary is-block" href="#">Active Learn</a> |
|||
|
|||
<aside class="menu"> |
|||
<p class="menu-label"> |
|||
Tags |
|||
</p> |
|||
<div class="tags"> |
|||
<a class="tag is-grey" v-for="label in labels" v-on:click="addLabel(label)">[[label.text]]</a> |
|||
<a class="tag is-grey" v-for="label in labels" v-on:click="addLabel(label.text)">[[label.text]]</a> |
|||
</div> |
|||
</aside> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
</section> |
|||
<script async type="text/javascript" src="{% static 'bulma.js' %}"></script> |
|||
<script type="text/javascript" src="{% static 'main.js' %}"> |
|||
|
|||
</div> |
|||
</section> |
|||
<script async type="text/javascript" src="{% static 'bulma.js' %}"></script> |
|||
<script type="text/javascript" src="{% static 'main.js' %}"> |
|||
</script> |
|||
</body> |
|||
</body> |
|||
|
|||
</html> |
|||
Write
Preview
Loading…
Cancel
Save