From fa45fe41bea49c3660b3686b762281ddde01718d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Piotr=20Bie=C5=84kowski?= <me@piotr.codes>
Date: Fri, 29 Jul 2022 07:35:31 +0200
Subject: [PATCH] WIP: Migrate components to SFC
---
common/templates/base.html | 13 +-
.../static/entries/js/components/Entries.js | 86 ---------
.../entries/js/components/InfoTooltip.js | 31 ----
.../static/entries/js/components/Spinner.js | 12 --
.../js/components/UnificationComponent.js | 4 -
.../js/components/UnificationEntriesList.js | 48 -----
.../js/components/UnificationRightPane.js | 18 +-
.../frame-components/ExamplesComponent.js | 92 ---------
.../SemanticsSchemataComponent.js | 173 -----------------
entries/templates/entries.html | 3 +-
entries/templates/unification.html | 3 +-
entries/views.py | 2 +
frontend/src/App.vue | 8 +-
frontend/src/components/Entries.vue | 3 -
.../src/components/shared/InfoTooltip.vue | 34 ++++
.../unification/Entries/Entries.vue | 76 ++++++++
.../unification/Entries/EntriesList.vue | 51 +++++
.../Unification}/Unification.vue | 0
.../unification/shared/LexicalUnitDisplay.vue | 20 +-
.../frame-components/ExamplesComponent.vue | 90 +++++++++
.../frame-components/MeaningComponent.vue | 19 +-
.../SemanticsSchemataComponent.vue | 174 ++++++++++++++++++
.../frame-components/SlowalFrameComponent.vue | 77 ++++----
frontend/src/main.js | 4 +-
frontend/vite.config.js | 5 +
.../management/commands/import_expansions.py | 4 +-
syntax/management/commands/import_tei.py | 2 +-
27 files changed, 515 insertions(+), 537 deletions(-)
delete mode 100644 entries/static/entries/js/components/Entries.js
delete mode 100644 entries/static/entries/js/components/InfoTooltip.js
delete mode 100644 entries/static/entries/js/components/Spinner.js
delete mode 100644 entries/static/entries/js/components/UnificationEntriesList.js
delete mode 100644 entries/static/entries/js/components/frame-components/ExamplesComponent.js
delete mode 100644 entries/static/entries/js/components/frame-components/SemanticsSchemataComponent.js
delete mode 100644 frontend/src/components/Entries.vue
create mode 100644 frontend/src/components/shared/InfoTooltip.vue
create mode 100644 frontend/src/components/unification/Entries/Entries.vue
create mode 100644 frontend/src/components/unification/Entries/EntriesList.vue
rename frontend/src/components/{ => unification/Unification}/Unification.vue (100%)
rename entries/static/entries/js/components/LexicalUnitDisplay.js => frontend/src/components/unification/shared/LexicalUnitDisplay.vue (98%)
create mode 100644 frontend/src/components/unification/shared/frame-components/ExamplesComponent.vue
rename entries/static/entries/js/components/frame-components/MeaningComponent.js => frontend/src/components/unification/shared/frame-components/MeaningComponent.vue (84%)
create mode 100644 frontend/src/components/unification/shared/frame-components/SemanticsSchemataComponent.vue
rename entries/static/entries/js/components/frame-components/SlowalFrameComponent.js => frontend/src/components/unification/shared/frame-components/SlowalFrameComponent.vue (60%)
diff --git a/common/templates/base.html b/common/templates/base.html
index b61041b..216fea5 100644
--- a/common/templates/base.html
+++ b/common/templates/base.html
@@ -104,11 +104,14 @@
</a>
</nav>
- <main class="container-fluid flex-grow-1 overflow-auto m-0 p-0 bg-dark" role="main">
- <div id="vue-app"></div>
- {% block content %}{% endblock %}
- </main>
-
+ {% if is_vue_app %}
+ <main id="vue-app"></main>
+ {% else %}
+ <main class="container-fluid flex-grow-1 overflow-auto m-0 p-0 bg-dark" role="main">
+ {% block content %}{% endblock %}
+ </main>
+ {% endif %}
+
<footer class="footer bg-dark text-muted">
<div class='px-1'>
Copyright © {% trans "Instytut Podstaw Informatyki PAN" %}, 2021.
diff --git a/entries/static/entries/js/components/Entries.js b/entries/static/entries/js/components/Entries.js
deleted file mode 100644
index 64211ef..0000000
--- a/entries/static/entries/js/components/Entries.js
+++ /dev/null
@@ -1,86 +0,0 @@
-import UnificationEntriesList from "./UnificationEntriesList.js";
-import UnificationRightPane from "./UnificationRightPane.js";
-
-export default {
- data () {
- return {
- entryId: null,
- lexicalUnitId: null,
- unifiedFrameId: null,
- isEdit: false,
- gettext: window.gettext,
- unificationEntriesListRefreshKey: 1
- };
- },
- components: {UnificationEntriesList, UnificationRightPane},
- methods: {
- lexicalUnitSelected (entryId, lexicalUnitId) {
- this.entryId = entryId;
- this.lexicalUnitId = lexicalUnitId;
- this.isEdit = false;
- },
- unifiedFrameSelected (unifiedFrameId) {
- this.unifiedFrameId = unifiedFrameId;
- this.isEdit = true;
- },
- refreshEntriesList() {
- this.unificationEntriesListRefreshKey++;
- }
- },
- mounted () {
- $('#entries-list').length && Split(['#entries-list', '#entry-display'], {
- sizes: [20, 80],
- gutterSize: 4,
- minSize: 10,
- elementStyle: (dimension, size, gutterSize) => {
- return {
- 'flex-basis': 'calc(' + size + '% - ' + gutterSize + 'px)'
- }
- },
- });
- // Split(['#right-pane', '#examples'], {
- // direction: 'vertical',
- // sizes: [75, 25],
- // gutterSize: 4,
- // minSize: 10,
- // });
- },
- template: `
- <div id="entries-list" class="col h-100 w-100 px-0 overflow-hidden">
- <div id="entries-list-div" class="col p-0 h-100 w-100 overflow-hidden">
- <unification-entries-list
- :unificationEntriesListRefreshKey="unificationEntriesListRefreshKey"
- :initialLexicalUnitId="lexicalUnitId"
- :initialEntryId="entryId"
- @lexical-unit-selected="lexicalUnitSelected" />
- </div>
- </div>
- <div id="entry-display" class="col h-100 p-0 overflow-hidden">
- <div class="w-100 h-100">
- <div id="right-pane" class="col w-100 h-100 p-0">
- <unification-right-pane
- :key="lexicalUnitId"
- :entryId="entryId"
- :lexicalUnitId="lexicalUnitId"
- :initialUnifiedFrameId="unifiedFrameId"
- :initialIsEdit="isEdit"
- @refresh-entries-list="refreshEntriesList" />
- </div>
-<!-- <div class="col w-100 p-0 tab-pane overflow-auto" id="examples">-->
-<!-- <table id="semantics-examples" class="table table-sm table-hover">-->
-<!-- <thead>-->
-<!-- <tr>-->
-<!-- <th scope="col">{{ gettext("Przykład") }}<i id="examples-argument"></i><i id="examples-lu"></i><i id="examples-schema"></i></th>-->
-<!-- <th scope="col">{{ gettext("Źródło") }}</th>-->
-<!-- <th scope="col">{{ gettext("Opinia") }}</th>-->
-<!-- </tr>-->
-<!-- </thead>-->
-<!-- <tbody id="semantics-examples-list">-->
-<!-- </tbody>-->
-<!-- </table>-->
-<!-- <p class="mx-1 my-1" id="semantics-no-examples">{{ gettext("Brak przykładów") }}</p>-->
-<!-- </div>-->
- </div>
- </div>
- `
-};
diff --git a/entries/static/entries/js/components/InfoTooltip.js b/entries/static/entries/js/components/InfoTooltip.js
deleted file mode 100644
index 3fa1e9a..0000000
--- a/entries/static/entries/js/components/InfoTooltip.js
+++ /dev/null
@@ -1,31 +0,0 @@
-export default {
- props: {
- text: String,
- visibleText: String
- },
- data () {
- return {
- iconUrl: window.STATIC_URL + 'common/img/info.svg'
- }
- },
- computed: {
- quotedText () {
- return this.text.replace(/"/g, '"');
- }
- },
- mounted () {
- $(this.$refs.tooltip).tooltip();
- },
- template: `
- <span
- data-toggle="tooltip"
- data-placement="bottom"
- data-html="true"
- :title="quotedText"
- ref="tooltip"
- >
- <img v-if="!visibleText" :src="iconUrl" alt="info" width="14" height="14" />
- <span v-else>{{visibleText}}</span>
- </span>
- `
-}
diff --git a/entries/static/entries/js/components/Spinner.js b/entries/static/entries/js/components/Spinner.js
deleted file mode 100644
index a4ac913..0000000
--- a/entries/static/entries/js/components/Spinner.js
+++ /dev/null
@@ -1,12 +0,0 @@
-export default {
- data() {
- return { gettext: window.gettext }
- },
- template: `
- <div class="d-flex justify-content-center wait-spinner">
- <div class="spinner-border text-primary m-5" style="width: 3rem; height: 3rem;" role="status">
- <span class="sr-only">{{ gettext('Proszę czekać...') }}</span>
- </div>
- </div>
- `
-}
diff --git a/entries/static/entries/js/components/UnificationComponent.js b/entries/static/entries/js/components/UnificationComponent.js
index 5a80808..926b201 100644
--- a/entries/static/entries/js/components/UnificationComponent.js
+++ b/entries/static/entries/js/components/UnificationComponent.js
@@ -7,7 +7,6 @@ export default {
entryId: null,
lexicalUnitId: null,
unifiedFrameId: null,
- isEdit: false,
gettext: window.gettext,
unificationEntriesListRefreshKey: 1,
};
@@ -17,10 +16,8 @@ export default {
lexicalUnitSelected (entryId, lexicalUnitId) {
this.entryId = entryId;
this.lexicalUnitId = lexicalUnitId;
- this.isEdit = false;
},
unifiedFrameSelected (unifiedFrameId, entryId, lexicalUnitId) {
- this.isEdit = true;
this.unifiedFrameId = unifiedFrameId;
this.entryId = entryId;
this.lexicalUnitId = lexicalUnitId;
@@ -68,7 +65,6 @@ export default {
:entryId="entryId"
:lexicalUnitId="lexicalUnitId"
:initialUnifiedFrameId="unifiedFrameId"
- :initialIsEdit="isEdit"
@refresh-entries-list="refreshEntriesList"
/>
</div>
diff --git a/entries/static/entries/js/components/UnificationEntriesList.js b/entries/static/entries/js/components/UnificationEntriesList.js
deleted file mode 100644
index 5bec789..0000000
--- a/entries/static/entries/js/components/UnificationEntriesList.js
+++ /dev/null
@@ -1,48 +0,0 @@
-export default {
- props: {
- initialLexicalUnitId: Number,
- initialEntryId: Number,
- unificationEntriesListRefreshKey: Number,
- },
- watch: {
- unificationEntriesListRefreshKey() {
- // TODO: reload data and click in selected row
- // this.datatableObject.ajax.reload();
- setup_entries_list({
- table: this.$refs.table,
- lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); },
- selectEntryId: this.initialEntryId,
- secondarySelectEntryId: this.initialLexicalUnitId,
- });
- }
- },
- data () {
- return {
- gettext: window.gettext,
- canViewAssignment: has_permission("users.view_assignment"),
- }
- },
- emits: ['lexicalUnitSelected'],
- mounted () {
- setup_entries_list({
- table: this.$refs.table,
- lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); },
- selectEntryId: this.initialEntryId
- });
- },
- template: `
- <table ref="table" class="table table-sm text-dark">
- <thead>
- <tr>
- <th class="p-1">{{ gettext('Lemat') }}</th>
- <th class="p-1">{{ gettext('Część mowy') }}</th>
- <th class="p-1">{{ gettext('Do pobrania') }}</th>
- <th v-if="canViewAssignment" class="p-1">{{ gettext('Semantyk') }}</th>
- <th v-else class="p-1">{{ gettext('Moje (w opracowaniu)') }}</th>
- </tr>
- </thead>
- <tbody id="entries">
- </tbody>
- </table>
- `
-};
diff --git a/entries/static/entries/js/components/UnificationRightPane.js b/entries/static/entries/js/components/UnificationRightPane.js
index 9f99ede..4bb097e 100644
--- a/entries/static/entries/js/components/UnificationRightPane.js
+++ b/entries/static/entries/js/components/UnificationRightPane.js
@@ -7,7 +7,6 @@ export default {
entryId: Number,
lexicalUnitId: Number,
initialUnifiedFrameId: Number,
- initialIsEdit: false,
},
emits: ['refreshEntriesList'],
data () {
@@ -16,7 +15,6 @@ export default {
methods: {
getInitialData () {
return {
- isEdit: this.initialIsEdit,
key: this.lexicalUnitId,
entryIdLocal: this.entryId,
unifiedFrameId: this.initialUnifiedFrameId,
@@ -24,7 +22,6 @@ export default {
};
},
goToDisplay () {
- this.isEdit = false;
this.unifiedFrameId = null;
},
refresh () {
@@ -41,9 +38,6 @@ export default {
}
},
watch: {
- initialIsEdit () {
- Object.assign(this, this.getInitialData());
- },
lexicalUnitId () {
Object.assign(this, this.getInitialData());
},
@@ -52,18 +46,10 @@ export default {
}
},
template: `
- <div v-if="key || unifiedFrameId" :key="(key, entryIdLocal, unifiedFrameId, isEdit)" class="row h-100 m-0 p-0 overflow-auto" id="semantics-top-pane">
- <lexical-unit-display
- v-if="key && !isEdit"
- :key="key"
- :entryId="entryIdLocal"
- :lexicalUnitId="key"
- @refresh="refresh"
- @refresh-entries-list="refreshEntriesList"
- />
+ <div v-if="key || unifiedFrameId" :key="(key, entryIdLocal, unifiedFrameId)" class="row h-100 m-0 p-0 overflow-auto" id="semantics-top-pane">
<lexical-unit-edit
ref="lexicalUnitEdit"
- v-if="unifiedFrameId && isEdit"
+ v-if="unifiedFrameId"
:key="unifiedFrameId"
:readOnly="false"
:unifiedFrameId="unifiedFrameId"
diff --git a/entries/static/entries/js/components/frame-components/ExamplesComponent.js b/entries/static/entries/js/components/frame-components/ExamplesComponent.js
deleted file mode 100644
index 81ff812..0000000
--- a/entries/static/entries/js/components/frame-components/ExamplesComponent.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import InfoTooltip from "../InfoTooltip.js";
-
-export default {
- props: {
- examples: Object,
- frame: Object,
- frame_arguments: Object,
- frame_arguments_or_type: null,
- schemas: Object,
- lus: Object,
- },
- components: {InfoTooltip},
- data() {
- return {
- img_prefix: String
- }
- },
- emits: ['exampleSelected'],
- methods: {
- getExamples () {
- let ret = this.examples;
- if(this.schemas && this.schemas.length > 0) {
- // ograniczone do schematu
- ret = ret.filter(e => this.schemas.every(a => e.schema_ids.includes(parseInt(a.id))));
- }
- if(this.frame_arguments && this.frame_arguments.length > 0) {
- // ograniczone do argumentu ramy
- if(this.frame_arguments_or_type) {
- ret = ret.filter(e => this.frame_arguments.some(a => e.argument_ids.includes(a.id)));
- } else {
- ret = ret.filter(e => this.frame_arguments.every(a => e.argument_ids.includes(a.id)));
- }
- }
- if(this.frame) {
- ret = ret.filter(e => e.frame_ids.includes(this.frame.id));
- }
- if(this.lus && this.lus.length > 0) {
- ret = ret.filter(e => this.lus.every(lu => e.lu_ids.includes(lu.id)));
- }
- return ret;
- },
- getSchemaStr(schema) {
- return schema.positions.map(e => e.phrases.map(p => p.str).join(",")).join('|');
- },
- selectExample(example) {
- example.selected = !example.selected;
- this.$emit('exampleSelected', this.examples.filter(example => example.selected));
- }
- },
- mounted () {
- this.img_prefix = window.STATIC_URL;
- },
- template: `
- <table id="semantics-examples" v-if="getExamples().length > 0" class="table table-sm table-hover" style="">
- <thead>
- <tr>
- <th scope="col">Przykład
- <i v-if="frame_arguments" v-for="frame_argument in frame_arguments">
- <span class="example-role"> {{' '}}
- <span :class="frame_argument.role">{{frame_argument.role}}</span>
- </span>
- </i>
- <i v-if="lus" v-for="lu in lus">{{' ' + lu.str}}</i>
- <i v-if="schemas" v-for="schema in schemas">{{' '+getSchemaStr(schema)}}</i>
- </th>
- <th scope="col">Źródło</th>
- <th scope="col">Opinia</th>
- </tr>
- </thead>
- <tbody id="semantics-examples-list">
- <template v-for="example in getExamples()">
- <tr class="example"
- @mouseenter="example.hover=true"
- @mouseleave="example.hover=false"
- @click.stop="selectExample(example)"
- :class="example.selected ? 'active table-primary' : example.hover ? 'bg-highlight' : ''"
- >
- <td class="py-1">
- {{example.sentence}}
- <info-tooltip v-if="example.note" :text="example.note" />
- </td>
- <td class="py-1">{{example.source}}</td>
- <td class="py-1">{{example.opinion}}</td>
- </tr>
- </template>
- </tbody>
- </table>
- <p v-else class="mx-1 my-1" id="semantics-no-examples" style="display: none;">Brak przykładów</p>
- `
-}
-
-
diff --git a/entries/static/entries/js/components/frame-components/SemanticsSchemataComponent.js b/entries/static/entries/js/components/frame-components/SemanticsSchemataComponent.js
deleted file mode 100644
index 9f1d160..0000000
--- a/entries/static/entries/js/components/frame-components/SemanticsSchemataComponent.js
+++ /dev/null
@@ -1,173 +0,0 @@
-import InfoTooltip from "../InfoTooltip.js";
-
-export default {
- props: {
- subentries: Object,
- frame: Object,
- alternations: Object,
- realisation_phrases: Object,
- realisation_descriptions: Object,
- selectedExamples: Object
- },
- components: {InfoTooltip},
- emits: ['schemataSelected'],
- data() {
- return {
- img_prefix: String
- }
- },
- methods: {
- getFunctions(position) {
- const props_spans = [];
- if (position.func.str !== '') {
- props_spans.push({str: position.func.str, tooltip: position.func.desc});
- }
- if (position.control.str !== '') {
- props_spans.push({str: position.control.str, tooltip: position.control.desc});
- }
- if (position.p_control.str !== '') {
- props_spans.push({str: position.p_control.str, tooltip: position.p_control.desc});
- }
- return props_spans;
- },
- getSchemataPositionCnt(schema) {
- return schema.positions.length;
- },
- getRealisationDescriptions(schema) {
- const alternationDescList = [];
- if(this.alternations) {
- const curr_alternations = this.alternations[this.frame.id][schema.id];
- const curr_realisation_descriptions = this.realisation_descriptions[this.frame.id][schema.id];
- for (let i in curr_alternations) {
- alternationDescList.push(curr_realisation_descriptions[i]);
- }
- }
- return '<i>' + alternationDescList + '</i>';
- },
- getPhraseCss(schema, position) {
- const styles = [];
- if(this.alternations) {
- const argumentIdSet = new Set();
-
- const curr_alternations = this.alternations[this.frame.id][schema.id];
- for (let i in curr_alternations) {
- const alternation = curr_alternations[i]
-
- for (let arg_id in alternation){
- const phrase_ids = alternation[arg_id];
- phrase_ids.forEach(phrase_id => {
- if (phrase_id.startsWith(position.id)) {
- argumentIdSet.add(arg_id);
- }
- });
- }
- }
-
- argumentIdSet.forEach(argumentId => {
- const argument = this.frame.arguments.find(arg => argumentId.endsWith(arg.argument_id));
- const role = argument.role;
- styles.push(role);
- });
-
- }
- const selectedExampleFrameArguments = this.selectedExamples && this.selectedExamples.length > 0 ? new Set(this.selectedExamples.map(e => e.positions).flat()) : null;
-
- if(selectedExampleFrameArguments != null) {
- styles.push(selectedExampleFrameArguments.has(position.id) ? 'example-yes' : 'example-no');
- }
- return styles;
- },
- getPositionPhrases(schema, position) {
- const phrases = [];
- if(this.alternations) {
- const curr_alternations = this.alternations[this.frame.id][schema.id];
- for (let i in curr_alternations) {
- const alternation = curr_alternations[i]
-
- for (let arg_id in alternation){
- const phrase_ids = alternation[arg_id];
- phrase_ids.forEach(phrase_id => {
- if (phrase_id.startsWith(position.id)) {
- phrases.push(this.realisation_phrases[arg_id][i][phrase_id]);
- }
- });
- }
- }
- }
- return phrases;
- },
- selectSchema(schema) {
- schema.selected = !schema.selected;
- const selected = [];
- this.subentries.forEach(subentry => {
- subentry.schemata.forEach(s => {
- if(s.selected) {
- selected.push(s);
- }
- });
- });
- this.$emit('schemataSelected', selected);
- }
- },
- mounted () {
- this.img_prefix = window.STATIC_URL;
- },
- template: `
- <div>
- <template v-for="subentry in subentries">
- <div class="subentry">
- <div class="mb-1 sticky-top"><h5 class="bg-dark text-light p-1">{{subentry.str}}</h5></div>
- <template v-for="schema in subentry.schemata">
- <div class="schema mb-3"
- v-if="alternations[this.frame.id][schema.id]"
- @mouseenter="schema.hover=true"
- @mouseleave="schema.hover=false"
- @click="selectSchema(schema)"
- :class="(schema.selected ? 'active' : schema.hover ? 'bg-highlight' : '')"
- >
- <table class="table m-0 table-borderless border border-secondary text-dark">
- <tbody>
- <tr class="opinion-row">
- <th scope="row" class="py-2 px-1 text-secondary" style="width: 3em;">Opinia</th>
- <td class="opinion-cell py-2 px-1" :colspan="getSchemataPositionCnt(schema)"><img
- :src="img_prefix + 'entries/img/' + schema.opinion_key + '.svg'" width="12"
- height="12" :alt="schema.opinion"> {{schema.opinion}}
- </td>
- </tr>
-
- <tr>
- <th scope="row" class="py-2 px-1 text-secondary">Funkcja</th>
-
- <td class="position py-2 px-1 border-top border-left border-secondary"
- v-for="position in schema.positions">
- <div v-for="f in getFunctions(position)" class="phrase px-1 py-2">
- <info-tooltip :text="f.tooltip" :visibleText="f.str"/>
- </div>
- </td>
-
- </tr>
-
- <tr class="realisation-description">
- <td class="px-1 py-2" :colspan="getSchemataPositionCnt(schema)" v-html="getRealisationDescriptions(schema)"></td>
- </tr>
- <tr class="phrase-types alt-0">
- <th scope="row" class="py-0 px-1 text-secondary">Typy fraz</th>
- <td v-for="position in schema.positions" class="px-0 py-0 border-top border-left border-secondary">
- <div v-for="phrase in position.phrases" class="phrase px-1 py-2"
- :class="getPhraseCss(schema, position)">
- <info-tooltip :text="phrase.desc" :visibleText="phrase.str"/>
- </div>
- <div v-for="phrase in getPositionPhrases(schema, position)" class="realisation-phrase px-1 py-2"><i>{{phrase}}</i></div>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </template>
- </div>
- </template>
- </div>
- `
-}
-
-
diff --git a/entries/templates/entries.html b/entries/templates/entries.html
index 8c16478..b7ecd78 100644
--- a/entries/templates/entries.html
+++ b/entries/templates/entries.html
@@ -16,6 +16,7 @@
<script type="module" src="{% static 'entries/js/entries_index.js' %}"></script>
{% endblock %}
-{% block content %}
+{% block modals %}
+ {{ block.super }}
<div id="lexical-unit-notes-template" class="d-none">{% include 'notes.html' %}</div>
{% endblock %}
diff --git a/entries/templates/unification.html b/entries/templates/unification.html
index 91abfaf..1f48626 100644
--- a/entries/templates/unification.html
+++ b/entries/templates/unification.html
@@ -20,6 +20,7 @@
<script type="module" src="{% static 'entries/js/unification_index.js' %}"></script>
{% endblock %}
-{% block content %}
+{% block modals %}
+ {{ block.super }}
<div id="lexical-unit-notes-template" class="d-none">{% include 'notes.html' %}</div>
{% endblock %}
diff --git a/entries/views.py b/entries/views.py
index 947632a..075096d 100644
--- a/entries/views.py
+++ b/entries/views.py
@@ -67,6 +67,7 @@ def entries(request):
request,
'entries.html',
{
+ 'is_vue_app': True,
'entries_form' : EntryForm(),
'frames_form' : FrameFormFactory.get_form(as_subform=False),
'schemata_form' : SchemaFormFactory.get_form(as_subform=False)
@@ -79,6 +80,7 @@ def unification(request):
request,
'unification.html',
{
+ 'is_vue_app': True,
'unified_frame_id': request.GET.get("unified_frame_id"),
'entries_form' : EntryForm(),
'frames_form': FrameFormFactory.get_form(as_subform=False),
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index e5f945f..4cbe12a 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,7 +1,5 @@
<template>
- <div class="row m-0 p-0 h-100" v-if="this.$route.name !== '404'">
- <div class="container bg-light">
- <RouterView />
- </div>
- </div>
+ <div class="row h-100 bg-light" v-if="this.$route.name !== '404'">
+ <RouterView />
+ </div>
</template>
diff --git a/frontend/src/components/Entries.vue b/frontend/src/components/Entries.vue
deleted file mode 100644
index 3dc2db6..0000000
--- a/frontend/src/components/Entries.vue
+++ /dev/null
@@ -1,3 +0,0 @@
-<template>
- Entries
-</template>
diff --git a/frontend/src/components/shared/InfoTooltip.vue b/frontend/src/components/shared/InfoTooltip.vue
new file mode 100644
index 0000000..f161376
--- /dev/null
+++ b/frontend/src/components/shared/InfoTooltip.vue
@@ -0,0 +1,34 @@
+<script>
+ export default {
+ props: {
+ text: String,
+ visibleText: String
+ },
+ data () {
+ return {
+ iconUrl: window.STATIC_URL + 'common/img/info.svg'
+ }
+ },
+ computed: {
+ quotedText () {
+ return this.text.replace(/"/g, '"');
+ }
+ },
+ mounted () {
+ $(this.$refs.tooltip).tooltip();
+ },
+ }
+</script>
+
+<template>
+ <span
+ data-toggle="tooltip"
+ data-placement="bottom"
+ data-html="true"
+ :title="quotedText"
+ ref="tooltip"
+ >
+ <img v-if="!visibleText" :src="iconUrl" alt="info" width="14" height="14" />
+ <span v-else>{{visibleText}}</span>
+ </span>
+</template>
\ No newline at end of file
diff --git a/frontend/src/components/unification/Entries/Entries.vue b/frontend/src/components/unification/Entries/Entries.vue
new file mode 100644
index 0000000..fde7135
--- /dev/null
+++ b/frontend/src/components/unification/Entries/Entries.vue
@@ -0,0 +1,76 @@
+<script>
+import EntriesList from "./EntriesList.vue";
+import LexicalUnitDisplay from "../shared/LexicalUnitDisplay.vue";
+
+export default {
+ data () {
+ return {
+ entryId: null,
+ lexicalUnitId: null,
+ unifiedFrameId: null,
+ isEdit: false,
+ gettext: window.gettext,
+ key: null,
+ unificationEntriesListRefreshKey: 1
+ };
+ },
+ components: {EntriesList, LexicalUnitDisplay},
+ methods: {
+ lexicalUnitSelected (entryId, lexicalUnitId) {
+ this.entryId = entryId;
+ this.lexicalUnitId = lexicalUnitId;
+ this.key = lexicalUnitId;
+ this.isEdit = false;
+ },
+ unifiedFrameSelected (unifiedFrameId) {
+ this.unifiedFrameId = unifiedFrameId;
+ this.isEdit = true;
+ },
+ refreshEntriesList() {
+ this.unificationEntriesListRefreshKey++;
+ },
+ refresh () {
+ this.key = null;
+ setTimeout(() => { this.key = this.lexicalUnitId; }, 0);
+ },
+ },
+ mounted () {
+ $('#entries-list').length && Split(['#entries-list', '#entry-display'], {
+ sizes: [20, 80],
+ gutterSize: 4,
+ minSize: 10,
+ elementStyle: (dimension, size, gutterSize) => {
+ return {
+ 'flex-basis': 'calc(' + size + '% - ' + gutterSize + 'px)'
+ }
+ },
+ });
+ },
+};
+</script>
+
+<template>
+ <div id="entries-list" class="col h-100 w-100 pr-0 overflow-hidden">
+ <div id="entries-list-div" class="h-100 w-100 overflow-hidden">
+ <entries-list
+ :unificationEntriesListRefreshKey="unificationEntriesListRefreshKey"
+ :initialLexicalUnitId="lexicalUnitId"
+ :initialEntryId="entryId"
+ @lexical-unit-selected="lexicalUnitSelected" />
+ </div>
+ </div>
+ <div id="entry-display" class="col h-100 p-0 overflow-hidden">
+ <div class="w-100 h-100">
+ <div id="right-pane" class="col w-100 h-100 p-0">
+ <lexical-unit-display
+ v-if="lexicalUnitId"
+ :key="key"
+ :entryId="entryId"
+ :lexicalUnitId="lexicalUnitId"
+ @refresh="refresh"
+ @refresh-entries-list="refreshEntriesList"
+ />
+ </div>
+ </div>
+ </div>
+</template>
diff --git a/frontend/src/components/unification/Entries/EntriesList.vue b/frontend/src/components/unification/Entries/EntriesList.vue
new file mode 100644
index 0000000..41d3175
--- /dev/null
+++ b/frontend/src/components/unification/Entries/EntriesList.vue
@@ -0,0 +1,51 @@
+<script>
+ export default {
+ props: {
+ initialLexicalUnitId: Number,
+ initialEntryId: Number,
+ unificationEntriesListRefreshKey: Number,
+ },
+ watch: {
+ unificationEntriesListRefreshKey() {
+ // TODO: reload data and click in selected row
+ // this.datatableObject.ajax.reload();
+ setup_entries_list({
+ table: this.$refs.table,
+ lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); },
+ selectEntryId: this.initialEntryId,
+ secondarySelectEntryId: this.initialLexicalUnitId,
+ });
+ }
+ },
+ data () {
+ return {
+ gettext: window.gettext,
+ canViewAssignment: has_permission("users.view_assignment"),
+ }
+ },
+ emits: ['lexicalUnitSelected'],
+ mounted () {
+ setup_entries_list({
+ table: this.$refs.table,
+ lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); },
+ selectEntryId: this.initialEntryId
+ });
+ },
+ };
+</script>
+
+<template>
+ <table ref="table" class="table table-sm text-dark">
+ <thead>
+ <tr>
+ <th class="p-1">{{ gettext('Lemat') }}</th>
+ <th class="p-1">{{ gettext('Część mowy') }}</th>
+ <th class="p-1">{{ gettext('Do pobrania') }}</th>
+ <th v-if="canViewAssignment" class="p-1">{{ gettext('Semantyk') }}</th>
+ <th v-else class="p-1">{{ gettext('Moje (w opracowaniu)') }}</th>
+ </tr>
+ </thead>
+ <tbody id="entries">
+ </tbody>
+ </table>
+</template>
diff --git a/frontend/src/components/Unification.vue b/frontend/src/components/unification/Unification/Unification.vue
similarity index 100%
rename from frontend/src/components/Unification.vue
rename to frontend/src/components/unification/Unification/Unification.vue
diff --git a/entries/static/entries/js/components/LexicalUnitDisplay.js b/frontend/src/components/unification/shared/LexicalUnitDisplay.vue
similarity index 98%
rename from entries/static/entries/js/components/LexicalUnitDisplay.js
rename to frontend/src/components/unification/shared/LexicalUnitDisplay.vue
index d4d5244..1fcd309 100644
--- a/entries/static/entries/js/components/LexicalUnitDisplay.js
+++ b/frontend/src/components/unification/shared/LexicalUnitDisplay.vue
@@ -1,9 +1,9 @@
-import Spinner from './Spinner.js';
-import SemanticsSchemataComponent from "./frame-components/SemanticsSchemataComponent.js";
-import ExamplesComponent from "./frame-components/ExamplesComponent.js";
-import SlowalFrameComponent from "./frame-components/SlowalFrameComponent.js";
-import MeaningComponent from "./frame-components/MeaningComponent.js";
-
+<script>
+import Spinner from '/src/components/shared/Spinner.vue';
+import SemanticsSchemataComponent from "./frame-components/SemanticsSchemataComponent.vue";
+import ExamplesComponent from "./frame-components/ExamplesComponent.vue";
+import SlowalFrameComponent from "./frame-components/SlowalFrameComponent.vue";
+import MeaningComponent from "./frame-components/MeaningComponent.vue";
export default {
components: { Spinner, SemanticsSchemataComponent, ExamplesComponent, SlowalFrameComponent, MeaningComponent },
@@ -184,7 +184,10 @@ export default {
});
this.setup();
},
- template: `
+};
+</script>
+
+<template>
<div class="col p-0 h-100 overflow-hidden">
<div id="main-frames-pane" class="row">
<div class="col h-100 pl-3 pr-1 pt-0 pb-2 overflow-auto" id="semantics-frames-pane">
@@ -286,5 +289,4 @@ export default {
</div>
</div>
</div>
- `
-}
+</template>
diff --git a/frontend/src/components/unification/shared/frame-components/ExamplesComponent.vue b/frontend/src/components/unification/shared/frame-components/ExamplesComponent.vue
new file mode 100644
index 0000000..6e9b4ea
--- /dev/null
+++ b/frontend/src/components/unification/shared/frame-components/ExamplesComponent.vue
@@ -0,0 +1,90 @@
+<script>
+import InfoTooltip from "/src/components/shared/InfoTooltip.vue";
+
+export default {
+ props: {
+ examples: Object,
+ frame: Object,
+ frame_arguments: Object,
+ frame_arguments_or_type: null,
+ schemas: Object,
+ lus: Object,
+ },
+ components: { InfoTooltip },
+ data() {
+ return {
+ img_prefix: String
+ }
+ },
+ emits: ['exampleSelected'],
+ methods: {
+ getExamples() {
+ let ret = this.examples;
+ if (this.schemas && this.schemas.length > 0) {
+ // ograniczone do schematu
+ ret = ret.filter(e => this.schemas.every(a => e.schema_ids.includes(parseInt(a.id))));
+ }
+ if (this.frame_arguments && this.frame_arguments.length > 0) {
+ // ograniczone do argumentu ramy
+ if (this.frame_arguments_or_type) {
+ ret = ret.filter(e => this.frame_arguments.some(a => e.argument_ids.includes(a.id)));
+ } else {
+ ret = ret.filter(e => this.frame_arguments.every(a => e.argument_ids.includes(a.id)));
+ }
+ }
+ if (this.frame) {
+ ret = ret.filter(e => e.frame_ids.includes(this.frame.id));
+ }
+ if (this.lus && this.lus.length > 0) {
+ ret = ret.filter(e => this.lus.every(lu => e.lu_ids.includes(lu.id)));
+ }
+ return ret;
+ },
+ getSchemaStr(schema) {
+ return schema.positions.map(e => e.phrases.map(p => p.str).join(",")).join('|');
+ },
+ selectExample(example) {
+ example.selected = !example.selected;
+ this.$emit('exampleSelected', this.examples.filter(example => example.selected));
+ }
+ },
+ mounted() {
+ this.img_prefix = window.STATIC_URL;
+ },
+}
+</script>
+
+<template>
+ <table id="semantics-examples" v-if="getExamples().length > 0" class="table table-sm table-hover" style="">
+ <thead>
+ <tr>
+ <th scope="col">Przykład
+ <i v-if="frame_arguments" v-for="frame_argument in frame_arguments">
+ <span class="example-role"> {{ ' ' }}
+ <span :class="frame_argument.role">{{ frame_argument.role }}</span>
+ </span>
+ </i>
+ <i v-if="lus" v-for="lu in lus">{{ ' ' + lu.str }}</i>
+ <i v-if="schemas" v-for="schema in schemas">{{ ' ' + getSchemaStr(schema) }}</i>
+ </th>
+ <th scope="col">Źródło</th>
+ <th scope="col">Opinia</th>
+ </tr>
+ </thead>
+ <tbody id="semantics-examples-list">
+ <template v-for="example in getExamples()">
+ <tr class="example" @mouseenter="example.hover = true" @mouseleave="example.hover = false"
+ @click.stop="selectExample(example)"
+ :class="example.selected ? 'active table-primary' : example.hover ? 'bg-highlight' : ''">
+ <td class="py-1">
+ {{ example.sentence }}
+ <info-tooltip v-if="example.note" :text="example.note" />
+ </td>
+ <td class="py-1">{{ example.source }}</td>
+ <td class="py-1">{{ example.opinion }}</td>
+ </tr>
+ </template>
+ </tbody>
+ </table>
+ <p v-else class="mx-1 my-1" id="semantics-no-examples" style="display: none;">Brak przykładów</p>
+</template>
\ No newline at end of file
diff --git a/entries/static/entries/js/components/frame-components/MeaningComponent.js b/frontend/src/components/unification/shared/frame-components/MeaningComponent.vue
similarity index 84%
rename from entries/static/entries/js/components/frame-components/MeaningComponent.js
rename to frontend/src/components/unification/shared/frame-components/MeaningComponent.vue
index d497ec1..0576d02 100644
--- a/entries/static/entries/js/components/frame-components/MeaningComponent.js
+++ b/frontend/src/components/unification/shared/frame-components/MeaningComponent.vue
@@ -1,4 +1,5 @@
-import InfoTooltip from "../InfoTooltip.js";
+<script>
+import InfoTooltip from "/src/components/shared/InfoTooltip.vue";
export default {
props: {
@@ -6,14 +7,14 @@ export default {
selectedExamples: Object
},
emits: ['meaningLuSelected'],
- data () {
+ data() {
return {
iconUrl: window.STATIC_URL + 'common/img/ext-link.svg'
}
},
components: {InfoTooltip},
methods: {
- getTooltipStr (lu) {
+ getTooltipStr(lu) {
const tooltip = [];
if (lu.definition) {
tooltip.push(lu.definition);
@@ -31,20 +32,22 @@ export default {
this.$emit('meaningLuSelected', this.lexicalUnits.filter(lexicalUnit => lexicalUnit.selected));
}
},
- template: `
+};
+</script>
+
+<template>
<p class="mb-1">
<template v-for="lexicalUnit in lexicalUnits">
<span
@mouseenter="lexicalUnit.hover=true"
@mouseleave="lexicalUnit.hover=false"
@click.stop="select(lexicalUnit)"
- :class="lexicalUnit.selected ? 'entry-meaning active' : lexicalUnit.hover ? 'entry-meaning active' : ''"
- class="lexical-unit entry-meaning" style="padding-left: 4px; padding-right: 4px;">{{lexicalUnit.str}}</span>
+ :class="lexicalUnit.selected ? 'entry-meaning active' : lexicalUnit.hover ? 'entry-meaning active' : ''"
+ class="lexical-unit entry-meaning" style="padding-left: 4px; padding-right: 4px;">{{lexicalUnit.str}}</span>
<info-tooltip v-if="getTooltipStr(lexicalUnit)" :text="getTooltipStr(lexicalUnit)"/>
<a v-if="lexicalUnit.url" class="lu-plwn" style="padding-left: 4px;" :href="lexicalUnit.url" target="_blank">
<img :src="iconUrl" alt="external link" height="14">
</a>
</template>
</p>
- `
-}
+</template>
diff --git a/frontend/src/components/unification/shared/frame-components/SemanticsSchemataComponent.vue b/frontend/src/components/unification/shared/frame-components/SemanticsSchemataComponent.vue
new file mode 100644
index 0000000..ce3604a
--- /dev/null
+++ b/frontend/src/components/unification/shared/frame-components/SemanticsSchemataComponent.vue
@@ -0,0 +1,174 @@
+<script>
+import InfoTooltip from "/src/components/shared/InfoTooltip.vue";
+
+export default {
+ props: {
+ subentries: Object,
+ frame: Object,
+ alternations: Object,
+ realisation_phrases: Object,
+ realisation_descriptions: Object,
+ selectedExamples: Object
+ },
+ components: {InfoTooltip},
+ emits: ['schemataSelected'],
+ data() {
+ return {
+ img_prefix: String
+ }
+ },
+ methods: {
+ getFunctions(position) {
+ const props_spans = [];
+ if (position.func.str !== '') {
+ props_spans.push({str: position.func.str, tooltip: position.func.desc});
+ }
+ if (position.control.str !== '') {
+ props_spans.push({str: position.control.str, tooltip: position.control.desc});
+ }
+ if (position.p_control.str !== '') {
+ props_spans.push({str: position.p_control.str, tooltip: position.p_control.desc});
+ }
+ return props_spans;
+ },
+ getSchemataPositionCnt(schema) {
+ return schema.positions.length;
+ },
+ getRealisationDescriptions(schema) {
+ const alternationDescList = [];
+ if (this.alternations) {
+ const curr_alternations = this.alternations[this.frame.id][schema.id];
+ const curr_realisation_descriptions = this.realisation_descriptions[this.frame.id][schema.id];
+ for (let i in curr_alternations) {
+ alternationDescList.push(curr_realisation_descriptions[i]);
+ }
+ }
+ return '<i>' + alternationDescList + '</i>';
+ },
+ getPhraseCss(schema, position) {
+ const styles = [];
+ if (this.alternations) {
+ const argumentIdSet = new Set();
+
+ const curr_alternations = this.alternations[this.frame.id][schema.id];
+ for (let i in curr_alternations) {
+ const alternation = curr_alternations[i]
+
+ for (let arg_id in alternation) {
+ const phrase_ids = alternation[arg_id];
+ phrase_ids.forEach(phrase_id => {
+ if (phrase_id.startsWith(position.id)) {
+ argumentIdSet.add(arg_id);
+ }
+ });
+ }
+ }
+
+ argumentIdSet.forEach(argumentId => {
+ const argument = this.frame.arguments.find(arg => argumentId.endsWith(arg.argument_id));
+ const role = argument.role;
+ styles.push(role);
+ });
+
+ }
+ const selectedExampleFrameArguments = this.selectedExamples && this.selectedExamples.length > 0 ? new Set(this.selectedExamples.map(e => e.positions).flat()) : null;
+
+ if (selectedExampleFrameArguments != null) {
+ styles.push(selectedExampleFrameArguments.has(position.id) ? 'example-yes' : 'example-no');
+ }
+ return styles;
+ },
+ getPositionPhrases(schema, position) {
+ const phrases = [];
+ if (this.alternations) {
+ const curr_alternations = this.alternations[this.frame.id][schema.id];
+ for (let i in curr_alternations) {
+ const alternation = curr_alternations[i]
+
+ for (let arg_id in alternation) {
+ const phrase_ids = alternation[arg_id];
+ phrase_ids.forEach(phrase_id => {
+ if (phrase_id.startsWith(position.id)) {
+ phrases.push(this.realisation_phrases[arg_id][i][phrase_id]);
+ }
+ });
+ }
+ }
+ }
+ return phrases;
+ },
+ selectSchema(schema) {
+ schema.selected = !schema.selected;
+ const selected = [];
+ this.subentries.forEach(subentry => {
+ subentry.schemata.forEach(s => {
+ if (s.selected) {
+ selected.push(s);
+ }
+ });
+ });
+ this.$emit('schemataSelected', selected);
+ }
+ },
+ mounted() {
+ this.img_prefix = window.STATIC_URL;
+ },
+};
+</script>
+
+<template>
+ <div>
+ <template v-for="subentry in subentries">
+ <div class="subentry">
+ <div class="mb-1 sticky-top"><h5 class="bg-dark text-light p-1">{{subentry.str}}</h5></div>
+ <template v-for="schema in subentry.schemata">
+ <div class="schema mb-3"
+ v-if="alternations[this.frame.id][schema.id]"
+ @mouseenter="schema.hover=true"
+ @mouseleave="schema.hover=false"
+ @click="selectSchema(schema)"
+ :class="(schema.selected ? 'active' : schema.hover ? 'bg-highlight' : '')"
+ >
+ <table class="table m-0 table-borderless border border-secondary text-dark">
+ <tbody>
+ <tr class="opinion-row">
+ <th scope="row" class="py-2 px-1 text-secondary" style="width: 3em;">Opinia</th>
+ <td class="opinion-cell py-2 px-1" :colspan="getSchemataPositionCnt(schema)"><img
+ :src="img_prefix + 'entries/img/' + schema.opinion_key + '.svg'" width="12"
+ height="12" :alt="schema.opinion"> {{schema.opinion}}
+ </td>
+ </tr>
+
+ <tr>
+ <th scope="row" class="py-2 px-1 text-secondary">Funkcja</th>
+
+ <td class="position py-2 px-1 border-top border-left border-secondary"
+ v-for="position in schema.positions">
+ <div v-for="f in getFunctions(position)" class="phrase px-1 py-2">
+ <info-tooltip :text="f.tooltip" :visibleText="f.str"/>
+ </div>
+ </td>
+
+ </tr>
+
+ <tr class="realisation-description">
+ <td class="px-1 py-2" :colspan="getSchemataPositionCnt(schema)" v-html="getRealisationDescriptions(schema)"></td>
+ </tr>
+ <tr class="phrase-types alt-0">
+ <th scope="row" class="py-0 px-1 text-secondary">Typy fraz</th>
+ <td v-for="position in schema.positions" class="px-0 py-0 border-top border-left border-secondary">
+ <div v-for="phrase in position.phrases" class="phrase px-1 py-2"
+ :class="getPhraseCss(schema, position)">
+ <info-tooltip :text="phrase.desc" :visibleText="phrase.str"/>
+ </div>
+ <div v-for="phrase in getPositionPhrases(schema, position)" class="realisation-phrase px-1 py-2"><i>{{phrase}}</i></div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </template>
+ </div>
+ </template>
+ </div>
+</template>
diff --git a/entries/static/entries/js/components/frame-components/SlowalFrameComponent.js b/frontend/src/components/unification/shared/frame-components/SlowalFrameComponent.vue
similarity index 60%
rename from entries/static/entries/js/components/frame-components/SlowalFrameComponent.js
rename to frontend/src/components/unification/shared/frame-components/SlowalFrameComponent.vue
index f7fec2a..12a6283 100644
--- a/entries/static/entries/js/components/frame-components/SlowalFrameComponent.js
+++ b/frontend/src/components/unification/shared/frame-components/SlowalFrameComponent.vue
@@ -1,43 +1,47 @@
-import InfoTooltip from "../InfoTooltip.js";
+<script>
+import InfoTooltip from "/src/components/shared/InfoTooltip.vue";
export default {
- props: {
- frame: Object,
- selectedExamples: Object
+ props: {
+ frame: Object,
+ selectedExamples: Object
+ },
+ components: {InfoTooltip},
+ emits: ['frameSelectionChanged'],
+ data() {
+ return {
+ img_prefix: String,
+ }
+ },
+ methods: {
+ getTitleHTML() {
+ const ret = window.lexical_units2dom(this.frame.lexical_units);
+ return ret;
},
- components: {InfoTooltip},
- emits: ['frameSelectionChanged'],
- data() {
- return {
- img_prefix: String,
- }
+ getOpinionHTML() {
+ return window.make_opinion_row(this.frame, this.frame.arguments.length, 3).outerHTML;
},
- methods: {
- getTitleHTML() {
- const ret = window.lexical_units2dom(this.frame.lexical_units);
- return ret;
- },
- getOpinionHTML() {
- return window.make_opinion_row(this.frame, this.frame.arguments.length, 3).outerHTML;
- },
- getArguments() {
- return this.frame.arguments;
- },
- selectArgument(argument) {
- argument.selected = !argument.selected;
- const selectedArguments = this.frame.arguments.filter(argument => argument.selected)
- this.$emit('frameSelectionChanged', selectedArguments);
- },
- computeArgumentCSS(argument) {
- const selectedExampleFrameArguments = this.selectedExamples && this.selectedExamples.length > 0 ? new Set(this.selectedExamples.map(e => e.argument_ids).flat()) : null;
- return argument.role + ' ' + (argument.selected ? 'active' : argument.hover ? 'bg-highlight' : '')
- + (selectedExampleFrameArguments != null ? selectedExampleFrameArguments.has(argument.id) ? 'example-yes' : 'example-no' : '');
- }
+ getArguments() {
+ return this.frame.arguments;
},
- mounted () {
- this.img_prefix = window.STATIC_URL;
+ selectArgument(argument) {
+ argument.selected = !argument.selected;
+ const selectedArguments = this.frame.arguments.filter(argument => argument.selected)
+ this.$emit('frameSelectionChanged', selectedArguments);
},
- template: `
+ computeArgumentCSS(argument) {
+ const selectedExampleFrameArguments = this.selectedExamples && this.selectedExamples.length > 0 ? new Set(this.selectedExamples.map(e => e.argument_ids).flat()) : null;
+ return argument.role + ' ' + (argument.selected ? 'active' : argument.hover ? 'bg-highlight' : '')
+ + (selectedExampleFrameArguments != null ? selectedExampleFrameArguments.has(argument.id) ? 'example-yes' : 'example-no' : '');
+ }
+ },
+ mounted() {
+ this.img_prefix = window.STATIC_URL;
+ },
+};
+</script>
+
+<template>
<table class="table m-0 table-borderless border border-secondary text-dark">
<tbody>
<tr class="opinion-row" v-html="getOpinionHTML()">
@@ -77,7 +81,4 @@ export default {
</tr>
</tbody>
</table>
- `
-}
-
-
+</template>
diff --git a/frontend/src/main.js b/frontend/src/main.js
index eb8f249..309a1cb 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -3,8 +3,8 @@ import './style.css'
import App from './App.vue'
import { createRouter, createWebHistory } from "vue-router";
-import Entries from "./components/Entries.vue";
-import Unification from "./components/Unification.vue";
+import Entries from "./components/unification/Entries/Entries.vue";
+import Unification from "./components/unification/Unification/Unification.vue";
const router = createRouter({
history: createWebHistory(),
diff --git a/frontend/vite.config.js b/frontend/vite.config.js
index 5ab96ec..2c0cdf0 100644
--- a/frontend/vite.config.js
+++ b/frontend/vite.config.js
@@ -5,6 +5,11 @@ import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
+ resolve: {
+ alias: {
+ '/src': resolve(__dirname, './src'),
+ },
+ },
base: '/static/',
server: {
host: '0.0.0.0',
diff --git a/phrase_expansions/management/commands/import_expansions.py b/phrase_expansions/management/commands/import_expansions.py
index ebf2c08..85b3ca7 100644
--- a/phrase_expansions/management/commands/import_expansions.py
+++ b/phrase_expansions/management/commands/import_expansions.py
@@ -38,8 +38,8 @@ def import_expansions():
expansions = parser.getContentHandler()._expansions
- for cls in (ExpansionOpinion, PhraseExpansion, ExpansionPosition, ExpansionPhrase, ExpansionPhraseDescription):
- cls.objects.all().delete()
+ # for cls in (ExpansionOpinion, PhraseExpansion, ExpansionPosition, ExpansionPhrase, ExpansionPhraseDescription):
+ # cls.objects.all().delete()
opinions = [(50, u'col'), (40, u'dat'), (20, u'unc'), (10, u'cer'),]
for pri, short in opinions:
diff --git a/syntax/management/commands/import_tei.py b/syntax/management/commands/import_tei.py
index 0f78622..e936e5d 100644
--- a/syntax/management/commands/import_tei.py
+++ b/syntax/management/commands/import_tei.py
@@ -36,7 +36,7 @@ def import_tei():
#xml_file = os.path.join(BASE_DIR, 'data', 'walenty', 'walenty_20200926_smaller.xml')
xml_file = os.path.join(BASE_DIR, 'data', 'walenty', 'walenty_20210913_smaller.xml')
# xml_file = os.path.join(BASE_DIR, 'data', 'walenty', 'walenty_20210913_smallest.xml')
- # xml_file = os.path.join(BASE_DIR, 'data', 'walenty', 'walenty_20210913.xml')
+ xml_file = os.path.join(BASE_DIR, 'data', 'walenty', 'walenty_20210913.xml')
xml_path = os.path.join(os.path.dirname(os.path.abspath(__file__)), xml_file)
--
GitLab