Skip to content

Commit 21471bd

Browse files
HironsanHironsan
authored
Merge pull request doccano#158 from CatalystCode/enhancement/fix-vue-eslint-errors
Enhancement/Fix all Vue ESlint errors
2 parents f0bf653 + d8b23a7 commit 21471bd

7 files changed

Lines changed: 197 additions & 152 deletions

File tree

‎app/server/static/js/.eslintrc.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ module.exports = {
99
},
1010
extends: [
1111
"airbnb-base",
12-
"plugin:vue/base",
12+
"plugin:vue/recommended",
1313
],
1414
rules: {
1515
"no-new": "off",
@@ -18,6 +18,6 @@ module.exports = {
1818
"object-shorthand": "off",
1919
"prefer-destructuring": "off",
2020
"prefer-template": "off",
21+
"vue/max-attributes-per-line": 3,
2122
},
2223
};
23-
// https://travishorn.com/setting-up-eslint-on-vs-code-with-airbnb-javascript-style-guide-6eb78a535ba6

‎app/server/static/js/demo/demo_named_entity.js‎

Lines changed: 66 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -6,26 +6,73 @@ Vue.use(require('vue-shortkey'), {
66
});
77

88
Vue.component('annotator', {
9-
template: '<div @click="setSelectedRange">'
10-
+ ' <span v-for="r in chunks"'
11-
+ ' v-bind:class="{tag: id2label[r.label].text_color}"'
12-
+ ' v-bind:style="{ color: id2label[r.label].text_color, backgroundColor: id2label[r.label].background_color }"'
13-
+ ' >{{ text.slice(r.start_offset, r.end_offset) }}<button class="delete is-small"'
14-
+ ' v-if="id2label[r.label].text_color"'
15-
+ ' @click="removeLabel(r)"></button></span>'
16-
+ ' </div>',
179
props: {
18-
labels: Array, // [{id: Integer, color: String, text: String}]
19-
text: String,
20-
entityPositions: Array, // [{'startOffset': 10, 'endOffset': 15, 'label_id': 1}]
10+
labels: {
11+
type: Array, // [{id: Integer, color: String, text: String}]
12+
default: () => [],
13+
},
14+
text: {
15+
type: String,
16+
default: '',
17+
},
18+
entityPositions: {
19+
type: Array, // [{'startOffset': 10, 'endOffset': 15, 'label_id': 1}]
20+
default: () => [],
21+
},
2122
},
23+
2224
data() {
2325
return {
2426
startOffset: 0,
2527
endOffset: 0,
2628
};
2729
},
2830

31+
computed: {
32+
sortedEntityPositions() {
33+
/* eslint-disable vue/no-side-effects-in-computed-properties */
34+
this.entityPositions = this.entityPositions.sort((a, b) => a.start_offset - b.start_offset);
35+
return this.entityPositions;
36+
/* eslint-enable vue/no-side-effects-in-computed-properties */
37+
},
38+
39+
chunks() {
40+
const res = [];
41+
let left = 0;
42+
for (let i = 0; i < this.sortedEntityPositions.length; i++) {
43+
const e = this.sortedEntityPositions[i];
44+
const l = this.makeLabel(left, e.start_offset);
45+
res.push(l);
46+
res.push(e);
47+
left = e.end_offset;
48+
}
49+
const l = this.makeLabel(left, this.text.length);
50+
res.push(l);
51+
52+
return res;
53+
},
54+
55+
id2label() {
56+
const id2label = {};
57+
// default value;
58+
id2label[-1] = {
59+
text_color: '',
60+
background_color: '',
61+
};
62+
for (let i = 0; i < this.labels.length; i++) {
63+
const label = this.labels[i];
64+
id2label[label.id] = label;
65+
}
66+
return id2label;
67+
},
68+
},
69+
70+
watch: {
71+
entityPositions() {
72+
this.resetRange();
73+
},
74+
},
75+
2976
methods: {
3077
setSelectedRange() {
3178
let start;
@@ -103,48 +150,14 @@ Vue.component('annotator', {
103150
},
104151
},
105152

106-
watch: {
107-
entityPositions() {
108-
this.resetRange();
109-
},
110-
},
111-
112-
computed: {
113-
sortedEntityPositions() {
114-
this.entityPositions = this.entityPositions.sort((a, b) => a.start_offset - b.start_offset);
115-
return this.entityPositions;
116-
},
117-
118-
chunks() {
119-
const res = [];
120-
let left = 0;
121-
for (let i = 0; i < this.sortedEntityPositions.length; i++) {
122-
const e = this.sortedEntityPositions[i];
123-
const l = this.makeLabel(left, e.start_offset);
124-
res.push(l);
125-
res.push(e);
126-
left = e.end_offset;
127-
}
128-
const l = this.makeLabel(left, this.text.length);
129-
res.push(l);
130-
131-
return res;
132-
},
133-
134-
id2label() {
135-
const id2label = {};
136-
// default value;
137-
id2label[-1] = {
138-
text_color: '',
139-
background_color: '',
140-
};
141-
for (let i = 0; i < this.labels.length; i++) {
142-
const label = this.labels[i];
143-
id2label[label.id] = label;
144-
}
145-
return id2label;
146-
},
147-
},
153+
template: '<div @click="setSelectedRange">'
154+
+ ' <span v-for="r in chunks"'
155+
+ ' v-bind:class="{tag: id2label[r.label].text_color}"'
156+
+ ' v-bind:style="{ color: id2label[r.label].text_color, backgroundColor: id2label[r.label].background_color }"'
157+
+ ' >{{ text.slice(r.start_offset, r.end_offset) }}<button class="delete is-small"'
158+
+ ' v-if="id2label[r.label].text_color"'
159+
+ ' @click="removeLabel(r)"></button></span>'
160+
+ ' </div>',
148161
});
149162

150163
const vm = new Vue({ // eslint-disable-line no-unused-vars

‎app/server/static/js/demo/demo_translation.js‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,19 @@ Vue.use(require('vue-shortkey'));
66

77
const vm = new Vue({ // eslint-disable-line no-unused-vars
88
el: '#mail-app',
9+
910
delimiters: ['[[', ']]'],
11+
12+
directives: {
13+
'todo-focus': (el, binding) => {
14+
if (binding.value) {
15+
el.focus();
16+
}
17+
},
18+
},
19+
20+
mixins: [annotationMixin],
21+
1022
data: {
1123
newTodo: '',
1224
editedTodo: null,
@@ -53,14 +65,6 @@ const vm = new Vue({ // eslint-disable-line no-unused-vars
5365
[],
5466
],
5567
},
56-
mixins: [annotationMixin],
57-
directives: {
58-
'todo-focus': (el, binding) => {
59-
if (binding.value) {
60-
el.focus();
61-
}
62-
},
63-
},
6468

6569
methods: {
6670
addTodo() {

‎app/server/static/js/label.js‎

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,23 @@ Vue.filter('simpleShortcut', simpleShortcut);
77

88
const vm = new Vue({ // eslint-disable-line no-unused-vars
99
el: '#mail-app',
10+
1011
delimiters: ['[[', ']]'],
12+
1113
data: {
1214
labels: [],
1315
newLabel: null,
1416
editedLabel: null,
1517
messages: [],
1618
},
1719

20+
created() {
21+
HTTP.get('labels').then((response) => {
22+
this.labels = response.data;
23+
this.sortLabels();
24+
});
25+
},
26+
1827
methods: {
1928
generateColor() {
2029
const color = (Math.random() * 0xFFFFFF | 0).toString(16); // eslint-disable-line no-bitwise
@@ -114,10 +123,4 @@ const vm = new Vue({ // eslint-disable-line no-unused-vars
114123
Object.assign(label, this.beforeEditCache);
115124
},
116125
},
117-
created() {
118-
HTTP.get('labels').then((response) => {
119-
this.labels = response.data;
120-
this.sortLabels();
121-
});
122-
},
123126
});

‎app/server/static/js/seq2seq.js‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,9 @@ Vue.use(require('vue-shortkey'));
77

88
const vm = new Vue({ // eslint-disable-line no-unused-vars
99
el: '#mail-app',
10+
1011
delimiters: ['[[', ']]'],
11-
data: {
12-
newTodo: '',
13-
editedTodo: null,
14-
},
15-
mixins: [annotationMixin],
12+
1613
directives: {
1714
'todo-focus': (el, binding) => {
1815
if (binding.value) {
@@ -21,6 +18,13 @@ const vm = new Vue({ // eslint-disable-line no-unused-vars
2118
},
2219
},
2320

21+
mixins: [annotationMixin],
22+
23+
data: {
24+
newTodo: '',
25+
editedTodo: null,
26+
},
27+
2428
methods: {
2529
addTodo() {
2630
const value = this.newTodo && this.newTodo.trim();

0 commit comments

Comments
 (0)