forked from kristjan/cjvt-valency
old files from diploma's poc
This commit is contained in:
voje
9
src_diploma/vue_frontend/src/App.vue
Normal file
9
src_diploma/vue_frontend/src/App.vue
Normal file
@@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<router-view/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'App',
|
||||
}
|
||||
</script>
|
||||
206
src_diploma/vue_frontend/src/components/EditSenses.vue
Normal file
206
src_diploma/vue_frontend/src/components/EditSenses.vue
Normal file
@@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<p class="pb-0 mb-0">Urejanje pomenov za besedo: <b>{{ hw }}</b>.</p>
|
||||
<p><small>
|
||||
Z miško kliknite na poved, nato kliknite na pomen, ki ga želite dodeliti povedi. Par poved‒pomen bo obarvan z modro. Pare lahko shranite s klikom na gumb "Shrani". Možno je dodajanje poljubnih pomenov.
|
||||
</small></p>
|
||||
<button v-on:click="cancel_all">Prekliči</button>
|
||||
<button v-on:click="save_all">Shrani</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
<!-- left column: sentences -->
|
||||
<div class="my-sent col-sm-6">
|
||||
<div
|
||||
v-for="(sentence, ssj_id) in sentences"
|
||||
v-on:click="pick_ssj_id(ssj_id)"
|
||||
class="border rounded my-sentences my-pointer"
|
||||
v-bind:class="{
|
||||
'border-primary': ssj_id === picked_ssj_id
|
||||
}"
|
||||
>
|
||||
<div>
|
||||
<span
|
||||
v-for="(word, index) in sentence.words"
|
||||
v-bind:class="{
|
||||
'text-primary': index === parseInt(sentence.hw_idx)
|
||||
}"
|
||||
>
|
||||
<span v-if="$root.mkspace(index, word)"> </span>{{ word }}
|
||||
</span>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="col-sm-12"><small>
|
||||
<div v-if="ssj_id in local_sense_map">
|
||||
<Sense v-bind:sense="local_sense_map[ssj_id].sense"></Sense>
|
||||
</div>
|
||||
<div v-else>
|
||||
<Sense v-bind:sense="undefined"></Sense>
|
||||
</div>
|
||||
</small></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- right column: senses -->
|
||||
<div class="col-sm-6 border rounded my-div-scroll sticky-top">
|
||||
<div
|
||||
v-for="sense in local_senses"
|
||||
class="my-pointer"
|
||||
v-on:click="picked_sense_id = sense.sense_id"
|
||||
v-bind:class="{
|
||||
'text-primary': sense.sense_id === picked_sense_id
|
||||
}"
|
||||
>
|
||||
<Sense v-bind:sense="sense"></Sense>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<textarea class="my-textarea" v-model="new_sense_desc"></textarea>
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<button v-on:click="new_sense">Dodaj pomen</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sense from "./Sense"
|
||||
export default {
|
||||
name: "EditSenses",
|
||||
props: ["hw", "sentences", "sens"],
|
||||
components: {
|
||||
Sense: Sense
|
||||
},
|
||||
data () { return {
|
||||
picked_ssj_id: null,
|
||||
picked_sense_id: null,
|
||||
local_senses: [], // make changes on a local copy
|
||||
local_sense_map: {}, // make changes on a local copy
|
||||
new_sense_desc: "",
|
||||
new_senses: [], // only send changes to server
|
||||
delta_sense_map: {}, // only send changes to server
|
||||
}},
|
||||
created: function() {
|
||||
// not sure if needed, maybe move to data()
|
||||
this.local_senses = this.sens.senses
|
||||
var json = JSON.stringify(this.sens.sense_map)
|
||||
this.local_sense_map = JSON.parse(json)
|
||||
for (var ssj_id in this.local_sense_map) {
|
||||
this.local_sense_map[ssj_id].sense = this.sense_id_to_sense(
|
||||
this.local_sense_map[ssj_id].sense_id)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
picked_ssj_id: function() {
|
||||
this.new_link()
|
||||
},
|
||||
picked_sense_id: function() {
|
||||
this.new_link()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
pick_ssj_id: function(ssj_id) {
|
||||
this.picked_ssj_id = ssj_id
|
||||
if (ssj_id in this.local_sense_map) {
|
||||
this.picked_sense_id = this.local_sense_map[ssj_id].sense_id
|
||||
}
|
||||
|
||||
},
|
||||
new_link: function() {
|
||||
if (this.picked_ssj_id === null ||
|
||||
this.picked_sense_id === null) { return }
|
||||
this.local_sense_map[this.picked_ssj_id] = {
|
||||
sense_id: this.picked_sense_id,
|
||||
sense: this.sense_id_to_sense(this.picked_sense_id)
|
||||
}
|
||||
this.delta_sense_map[this.picked_ssj_id] = { sense_id: this.picked_sense_id }
|
||||
},
|
||||
new_sense: function(sense_id) {
|
||||
if (this.new_sense_desc === "") {
|
||||
return
|
||||
}
|
||||
var new_sense = {
|
||||
hw: this.hw,
|
||||
author: this.$root.store.username,
|
||||
desc: this.new_sense_desc,
|
||||
sense_id: "tmp_sense_id" + (new Date().getTime()),
|
||||
}
|
||||
this.local_senses.push(new_sense)
|
||||
this.new_senses.push(new_sense)
|
||||
this.new_sense_desc = ""
|
||||
},
|
||||
sense_id_to_sense: function(sense_id) {
|
||||
for (var i=0; i<this.local_senses.length; i++) {
|
||||
if (this.local_senses[i].sense_id === sense_id) {
|
||||
return this.local_senses[i]
|
||||
}
|
||||
}
|
||||
return undefined
|
||||
},
|
||||
cancel_all: function() {
|
||||
this.$parent.state = "normal"
|
||||
},
|
||||
save_all: function() {
|
||||
const data = {
|
||||
token: this.$root.store.token,
|
||||
hw: this.hw,
|
||||
sense_map: this.delta_sense_map,
|
||||
new_senses: this.new_senses,
|
||||
}
|
||||
var component = this
|
||||
function exit_edit(component) {
|
||||
component.$parent.state = "normal"
|
||||
component.$parent.request_reload = true
|
||||
}
|
||||
|
||||
// don't update if there are no changes
|
||||
if (
|
||||
Object.keys(data.sense_map).length === 0 &&
|
||||
data.new_senses.length === 0
|
||||
) { exit_edit(component); return }
|
||||
|
||||
// exit after update
|
||||
this.$http.post(
|
||||
this.$root.store.api_addr + "/api/senses/update",
|
||||
data,
|
||||
{ headers: {
|
||||
'Content-type': 'application/json',
|
||||
}}
|
||||
).then(function () {
|
||||
exit_edit(component)
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.my-div-scroll {
|
||||
margin-top: 5px;
|
||||
height: 90vh;
|
||||
overflow-y: auto;
|
||||
padding-top: 5px;
|
||||
}
|
||||
.my-pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
.my-textarea {
|
||||
width: 100%;
|
||||
}
|
||||
.my-sentences {
|
||||
margin: 5px 0px 20px 0px;
|
||||
padding: 5px;
|
||||
}
|
||||
.my-sent {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.my-sent span {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
208
src_diploma/vue_frontend/src/components/Frame.vue
Normal file
208
src_diploma/vue_frontend/src/components/Frame.vue
Normal file
@@ -0,0 +1,208 @@
|
||||
<template>
|
||||
<!-- clicking on empty space clears highlights -->
|
||||
<div v-on:click="clearOnClick" class="container-fluid">
|
||||
<hr>
|
||||
<div class="row">
|
||||
<div class="col-sm-7">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
št. povedi: {{ frameData.sentences.length }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--frame slots-->
|
||||
<div class="row my-frames">
|
||||
<div class="col-sm-12">
|
||||
<span v-for="(slot, key) in frameData.slots">
|
||||
<span
|
||||
v-bind:class="{
|
||||
'my-pointer text-danger': hasHoverTid(idx=key),
|
||||
'my-underline text-danger': hasSelTid(idx=key)
|
||||
}"
|
||||
v-on:mouseover="setHid(idx=key)"
|
||||
v-on:mouseleave="setHid()"
|
||||
v-on:click="setSid(idx=key)"
|
||||
>{{ slot.functor }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--sense information-->
|
||||
<div v-if="$root.store.radio === 'three'" class="col-sm-5">
|
||||
<Sense v-bind:sense="getSense()"></Sense>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--sentences-->
|
||||
<div class="row">
|
||||
<!-- fmode: prikaz->udelezenske vloge (drugacno razvrscanje povedi) -->
|
||||
<div v-if="fmode" class="col-sm-12">
|
||||
<div v-for="hw in getAggrHws()">
|
||||
<blockquote v-for="sentence in getAggrSent(hw)">
|
||||
<span class="text-secondary"> {{ hw }}</span><br>
|
||||
<span
|
||||
v-for="(token, index) in sentence"
|
||||
v-bind:class="{
|
||||
'my-pointer text-danger': hasHoverTid(idx=null, tid=token[0]), 'my-underline text-danger': hasSelTid(idx=null, tid=token[0]),
|
||||
'text-primary': isHw(token[0]),
|
||||
}"
|
||||
v-on:mouseover="setHid(idx=null, tid=token[0])"
|
||||
v-on:mouseleave="setHid()"
|
||||
v-on:click="setSid(idx=null, tid=token[0])"
|
||||
v-bind:title="token[1].msd"
|
||||
><span v-if="$root.mkspace(index, token[1].word)"> </span>{{ token[1].word }}</span>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="col-sm-12">
|
||||
<blockquote v-for="sentence in frameData.sentences">
|
||||
<span
|
||||
v-for="(token, index) in sentence"
|
||||
v-bind:class="{
|
||||
'my-pointer text-danger': hasHoverTid(idx=null, tid=token[0]), 'my-underline text-danger': hasSelTid(idx=null, tid=token[0]),
|
||||
'text-primary': isHw(token[0]),
|
||||
}"
|
||||
v-on:mouseover="setHid(idx=null, tid=token[0])"
|
||||
v-on:mouseleave="setHid()"
|
||||
v-on:click="setSid(idx=null, tid=token[0])"
|
||||
v-bind:title="token[1].msd"
|
||||
><span v-if="$root.mkspace(index, token[1].word)"> </span>{{ token[1].word }}</span>
|
||||
</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Sense from "./Sense"
|
||||
export default {
|
||||
name: "Frame",
|
||||
props: {
|
||||
frameData: {},
|
||||
sensData: {},
|
||||
fmode: {
|
||||
default: false,
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
data() { return {
|
||||
hid: null, // hover functor index
|
||||
sid: null, // select functor index (click)
|
||||
}},
|
||||
components: {
|
||||
Sense: Sense
|
||||
},
|
||||
watch: {
|
||||
frameData: function () {
|
||||
this.hid = null,
|
||||
this.sid = null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
setHid: function (idx=null, tid=null) {
|
||||
// calling this functoin without parameters
|
||||
// resets hid
|
||||
if (tid === null) {
|
||||
this.hid = idx
|
||||
return
|
||||
}
|
||||
for (var i=0; i<this.frameData.slots.length; i++) {
|
||||
if (this.frameData.slots[i].tids.includes(tid)) {
|
||||
this.hid = i
|
||||
return
|
||||
}
|
||||
}
|
||||
},
|
||||
clearOnClick: function (event) {
|
||||
if (event.target.tagName !== "SPAN") {
|
||||
this.sid = null
|
||||
}
|
||||
},
|
||||
setSid: function (idx=null, tid=null) {
|
||||
this.sid = null
|
||||
if (tid === null) {
|
||||
this.sid = idx
|
||||
return
|
||||
}
|
||||
for (var i=0; i<this.frameData.slots.length; i++) {
|
||||
if (this.frameData.slots[i].tids.includes(tid)) {
|
||||
this.sid = i
|
||||
return
|
||||
}
|
||||
}
|
||||
},
|
||||
hasHoverTid: function(idx=null, tid=null) {
|
||||
if (this.hid === null) {
|
||||
return false
|
||||
}
|
||||
if (tid === null) {
|
||||
if (idx == this.hid) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
return this.frameData.slots[this.hid].tids.includes(tid)
|
||||
},
|
||||
hasSelTid: function (idx=null, tid=null) {
|
||||
if (this.sid === null) {
|
||||
return false
|
||||
}
|
||||
if (tid === null) {
|
||||
if (idx == this.sid) {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
return this.frameData.slots[this.sid].tids.includes(tid)
|
||||
},
|
||||
isHw: function (tid) {
|
||||
return this.frameData.tids.includes(tid)
|
||||
},
|
||||
getSense: function () {
|
||||
for (var i in this.sensData.senses) {
|
||||
if (this.sensData.senses[i].sense_id === this.frameData.sense_info.sense_id) {
|
||||
return this.sensData.senses[i]
|
||||
}
|
||||
}
|
||||
return undefined
|
||||
},
|
||||
getAggrHws: function() {
|
||||
return (Object.keys(this.frameData.aggr_sent)).sort()
|
||||
},
|
||||
getAggrSent: function(hw) {
|
||||
var sentences = []
|
||||
for (var i=0; i<this.frameData.aggr_sent[hw].length; i++) {
|
||||
sentences.push(
|
||||
this.frameData.sentences[this.frameData.aggr_sent[hw][i]]
|
||||
)
|
||||
}
|
||||
return sentences
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.my-pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
.my-underline {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.my-frames {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
blockquote {
|
||||
background: #ffffff;
|
||||
border-left: 4px solid #ccc;
|
||||
margin: 10px 0px 10px 10px;
|
||||
padding: 0px 0px 0px 5px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
blockquote span {
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
50
src_diploma/vue_frontend/src/components/Home.vue
Normal file
50
src_diploma/vue_frontend/src/components/Home.vue
Normal file
@@ -0,0 +1,50 @@
|
||||
<template>
|
||||
<div>
|
||||
<p
|
||||
v-if="this.$root.store.api_error !== null"
|
||||
class="text-warning"
|
||||
>
|
||||
api_error: {{ this.$root.store.api_error }}
|
||||
</p>
|
||||
<Nav></Nav>
|
||||
<div class="my-home container-fluid">
|
||||
<div class="row">
|
||||
<div id="serach" class="col-sm-2 border-right fill">
|
||||
<LWords v-if="navSS()"></LWords>
|
||||
<LFunctors v-else></LFunctors>
|
||||
</div>
|
||||
<div class="col-sm-10">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Nav from "./Nav"
|
||||
import LWords from "./LWords"
|
||||
import LFunctors from "./LFunctors"
|
||||
import MainDispl from "./MainDispl"
|
||||
|
||||
export default {
|
||||
name: 'Home',
|
||||
components: {
|
||||
Nav: Nav,
|
||||
LWords: LWords,
|
||||
LFunctors: LFunctors,
|
||||
MainDispl: MainDispl,
|
||||
},
|
||||
methods: {
|
||||
navSS: function () {
|
||||
return this.$root.storeGet("navSS") === "words"
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.my-home {
|
||||
padding-top: 10px;
|
||||
}
|
||||
</style>
|
||||
51
src_diploma/vue_frontend/src/components/LFunctors.vue
Normal file
51
src_diploma/vue_frontend/src/components/LFunctors.vue
Normal file
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<div>
|
||||
<table>
|
||||
<tr v-for="functor in functors">
|
||||
<td><a href="#" v-on:click="selectFunctor(functor)">{{ functor[0] }}</a></td>
|
||||
<td>({{ functor[1] }})</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "LWords",
|
||||
props: ["appState"],
|
||||
data() {return {
|
||||
functors: []
|
||||
}},
|
||||
methods: {
|
||||
apiGetFunctors: function () {
|
||||
var component = this
|
||||
this.$http.get(this.$root.store.api_addr + "/api/functors")
|
||||
.then(function(response) {
|
||||
component.$root.store.api_error = null
|
||||
component.functors = response.data
|
||||
})
|
||||
.catch(function(error) {
|
||||
component.$root.store.api_error = error
|
||||
})
|
||||
},
|
||||
selectFunctor: function (functor) {
|
||||
this.$router.push({
|
||||
name: "MainDispl",
|
||||
params: {
|
||||
hw: functor[0],
|
||||
fmode: true
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
this.apiGetFunctors()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
80
src_diploma/vue_frontend/src/components/LWords.vue
Normal file
80
src_diploma/vue_frontend/src/components/LWords.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<div>
|
||||
<select v-model="selectedLetter">
|
||||
<option v-for="letter in alphabet" :value="letter">
|
||||
{{ letter.toUpperCase() }} ({{ getNumWords(letter) }})
|
||||
</option>
|
||||
</select>
|
||||
<table>
|
||||
<tr v-for="word in getWords()">
|
||||
<td><a href="#" v-on:click="selectHw(word)">{{ word[0] }}
|
||||
<span v-if="$root.store.has_se.includes(word[0])">se</span>
|
||||
</a></td>
|
||||
<td>({{ word[1] }})</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "LWords",
|
||||
data() {return {
|
||||
alphabet: "abcčdefghijklmnoprsštuvzž",
|
||||
letters: {},
|
||||
selectedLetter: "a"
|
||||
}},
|
||||
methods: {
|
||||
apiGetWords: function() {
|
||||
var component = this
|
||||
this.$http.get(this.$root.storeGet("api_addr") + "/api/words")
|
||||
.then(function(response) {
|
||||
component.$root.store.api_error = null
|
||||
component.$root.store.has_se = response.data["has_se"]
|
||||
component.letters = response.data["sorted_words"]
|
||||
})
|
||||
.catch(function(error) {
|
||||
component.$root.store.api_error = error
|
||||
})
|
||||
},
|
||||
getNumWords: function(letter) {
|
||||
var entry = this.letters[letter]
|
||||
if (entry) {
|
||||
return entry.length
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
getWords: function() {
|
||||
var entry = this.letters[this.selectedLetter]
|
||||
if (entry) {
|
||||
return entry
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
},
|
||||
selectHw: function(word) {
|
||||
this.$router.push({
|
||||
name: "MainDispl",
|
||||
params: {
|
||||
hw: word[0],
|
||||
fmode: false
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
this.apiGetWords()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
table {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
select {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
120
src_diploma/vue_frontend/src/components/Login.vue
Normal file
120
src_diploma/vue_frontend/src/components/Login.vue
Normal file
@@ -0,0 +1,120 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="col-sm-2">
|
||||
<a href="#" v-on:click="this.$root.routeBack">Nazaj</a>
|
||||
</div>
|
||||
<div class="ev-login col-sm-4 offset-sm-4">
|
||||
<div class="alert alert-danger" v-if="error">
|
||||
<p>{{ error }}</p>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="text"
|
||||
data-id="login.username"
|
||||
class="form-control js-login__username"
|
||||
placeholder="Uporabnik"
|
||||
v-model="credentials.username"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control js-login__password "
|
||||
placeholder="Geslo"
|
||||
v-model="credentials.password"
|
||||
>
|
||||
</div>
|
||||
<button
|
||||
data-id="login.submit"
|
||||
class="btn btn-primary solid blank js-login__submit"
|
||||
@click="submit()"
|
||||
>
|
||||
Prijava<i class="fa fa-arrow-circle-o-right"></i>
|
||||
</button>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<router-link to="/new_pass">Ste pozabili geslo?</router-link>
|
||||
<br>
|
||||
<br>
|
||||
Nov uporabnik?
|
||||
<br>
|
||||
<router-link to="/register">Ustvarite nov račun.</router-link>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Login',
|
||||
data () {
|
||||
return {
|
||||
credentials: {
|
||||
username: '',
|
||||
password: ''
|
||||
},
|
||||
loggingIn: false,
|
||||
error: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submit () {
|
||||
this.error = ""
|
||||
//this.loggingIn = true
|
||||
// Auth.login() returns a promise. A redirect will happen on success.
|
||||
// For errors, use .then() to capture the response to output
|
||||
// error_description (if exists) as shown below:
|
||||
/*
|
||||
this.$auth.login(credentials, 'dashboard').then((response) => {
|
||||
this.loggingIn = false
|
||||
this.error = utils.getError(response)
|
||||
})
|
||||
*/
|
||||
|
||||
if ( this.credentials.username === "" ||
|
||||
this.credentials.password === ""
|
||||
) {
|
||||
this.error = "Izpolnite vsa polja."
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
var data = {
|
||||
username: this.credentials.username,
|
||||
password: this.credentials.password
|
||||
}
|
||||
|
||||
var component = this
|
||||
this.$http.post(this.$root.storeGet("api_addr") + "/api/login",
|
||||
data, // the data to post
|
||||
{ headers: {
|
||||
'Content-type': 'application/x-www-form-urlencoded',
|
||||
}
|
||||
})
|
||||
.then(function (response) {
|
||||
component.$root.store.api_error = null
|
||||
var token = response.data.token
|
||||
if (token === null) {
|
||||
component.error = "Napačno uporabniško ime ali geslo."
|
||||
} else {
|
||||
// set cookies (if the page reloads)
|
||||
component.$root.store.username = component.credentials.username
|
||||
component.$root.store.token = token
|
||||
component.$router.go(-1)
|
||||
component.$cookies.set("valency_token", token, 60*60*48)
|
||||
}
|
||||
})
|
||||
.catch(function (err) {
|
||||
component.$root.store.api_error = err
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ev-login {
|
||||
margin-top: 100px;
|
||||
}
|
||||
</style>
|
||||
256
src_diploma/vue_frontend/src/components/MainDispl.vue
Normal file
256
src_diploma/vue_frontend/src/components/MainDispl.vue
Normal file
@@ -0,0 +1,256 @@
|
||||
<template>
|
||||
<!--load mode-->
|
||||
<div v-if="show_loader">
|
||||
<pulse-loader :color="loader_color"></pulse-loader>
|
||||
</div>
|
||||
|
||||
<!--edit mode (button: razvrsti po pomenih)-->
|
||||
<div v-else-if="state === 'editing'" class="container-fluid">
|
||||
<EditSenses
|
||||
v-bind:hw="hw"
|
||||
v-bind:sentences="sentences"
|
||||
v-bind:sens="sens"
|
||||
></EditSenses>
|
||||
</div>
|
||||
|
||||
<!--normal mode-->
|
||||
<div v-else class="container-fluid" id="head">
|
||||
|
||||
<!--header (verb/adjective, radio buttons)-->
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
<table>
|
||||
<tr><h4 id="main-displ-hw">{{ hw }}
|
||||
<span v-if="$root.store.has_se.includes(hw)">se</span>
|
||||
</h4></tr>
|
||||
<tr>{{ calcPos() }}</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="col-sm-8">
|
||||
<table>
|
||||
<tr>Združevanje vezljivostnih vzorcev:</tr>
|
||||
<tr>
|
||||
<label class="radio-inline"><input value="one" v-model="$root.store.radio" v-on:change="reload()" checked="" type="radio" name="optradio">posamezne povedi</label>
|
||||
<label class="radio-inline"><input value="two" v-model="$root.store.radio" v-on:change="reload()" type="radio" name="optradio">skupne udeleženske vloge</label>
|
||||
<label v-if="this.$root.store.navSS === 'words'" class="radio-inline"><input value="three" v-model="$root.store.radio" v-on:change="reload()" type="radio" name="optradio">po meri</label>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--frames-->
|
||||
<div v-if="$root.store.radio === 'three'" class="row">
|
||||
<div class="col-sm-4">
|
||||
<button v-on:click="userEdit">razvrsti po pomenih</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-for="frame in frames">
|
||||
<Frame
|
||||
v-bind:frameData="frame"
|
||||
v-bind:sensData="sens"
|
||||
v-bind:fmode="fmode">
|
||||
</Frame>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Frame from "./Frame"
|
||||
import EditSenses from "./EditSenses"
|
||||
import PulseLoader from 'vue-spinner/src/PulseLoader.vue'
|
||||
export default {
|
||||
name: "MainDispl",
|
||||
components: {
|
||||
Frame: Frame,
|
||||
EditSenses: EditSenses,
|
||||
PulseLoader: PulseLoader,
|
||||
},
|
||||
props: ["hw", "fmode"],
|
||||
data () { return {
|
||||
frames: [],
|
||||
sentences: {},
|
||||
sens: {
|
||||
senses: [],
|
||||
sense_map: {},
|
||||
},
|
||||
state: "loading", // editing, normal
|
||||
request_reload: false,
|
||||
loader_color: "#007bff",
|
||||
}},
|
||||
created: function () {
|
||||
this.reload()
|
||||
},
|
||||
computed: {
|
||||
show_loader: function () {
|
||||
return this.state === "loading" && this.$root.store.api_error !== null
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
hw: function () {
|
||||
this.reload()
|
||||
},
|
||||
frames: function () {
|
||||
this.buildSentences()
|
||||
},
|
||||
request_reload: function () {
|
||||
if (this.request_reload) {
|
||||
this.request_reload = false
|
||||
this.reload()
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getFFrames: function(functor, reduce_fun=null) {
|
||||
// get frames in functor mode
|
||||
if (functor === null || functor === undefined) return
|
||||
if (reduce_fun === null) {
|
||||
switch (this.$root.store.radio) {
|
||||
case "one":
|
||||
reduce_fun = "reduce_0"
|
||||
break
|
||||
case "two":
|
||||
reduce_fun = "reduce_1"
|
||||
break
|
||||
default:
|
||||
reduce_fun = "reduce_0"
|
||||
break
|
||||
}
|
||||
}
|
||||
var component = this
|
||||
this.$http.get(
|
||||
this.$root.storeGet("api_addr") + "/api/functor-frames" +
|
||||
"?functor=" + functor + "&rf=" + reduce_fun)
|
||||
.then(function (response) {
|
||||
component.$root.store.api_error = null
|
||||
component.frames = response.data.frames
|
||||
component.state = "normal"
|
||||
})
|
||||
.catch(function(error) {
|
||||
component.$root.store.api_error = error
|
||||
})
|
||||
},
|
||||
getFrames: function (hw, reduce_fun=null) {
|
||||
if (hw === null || hw === undefined) return
|
||||
if (reduce_fun === null) {
|
||||
switch (this.$root.store.radio) {
|
||||
case "one":
|
||||
reduce_fun = "reduce_0"
|
||||
break
|
||||
case "two":
|
||||
reduce_fun = "reduce_1"
|
||||
break
|
||||
case "three":
|
||||
reduce_fun = "reduce_5"
|
||||
break
|
||||
}
|
||||
}
|
||||
var component = this
|
||||
this.$http.get(
|
||||
this.$root.storeGet("api_addr") + "/api/frames" +
|
||||
"?hw=" + hw + "&rf=" + reduce_fun)
|
||||
.then(function (response) {
|
||||
component.$root.store.api_error = null
|
||||
component.frames = response.data.frames
|
||||
component.state = "normal"
|
||||
})
|
||||
.catch(function(error) {
|
||||
component.$root.store.api_error = error
|
||||
})
|
||||
},
|
||||
buildSentences: function () {
|
||||
if (this.frames.length == 0) {
|
||||
return
|
||||
}
|
||||
this.sentences = {}
|
||||
for (var fi in this.frames) {
|
||||
for (var si in this.frames[fi].sentences) {
|
||||
var sentence = this.frames[fi].sentences[si]
|
||||
// get ssj_id without .t123
|
||||
var ssj_id = sentence[0][0].split(".")
|
||||
ssj_id.splice(-1, 1) // removes last element
|
||||
ssj_id = ssj_id.join(".")
|
||||
var words = []
|
||||
var hw_idx = -1
|
||||
var tmp_hw = this.hw
|
||||
if (tmp_hw[tmp_hw.length - 1] === "_") {
|
||||
tmp_hw = tmp_hw.substr(0, tmp_hw.length - 1)
|
||||
}
|
||||
for (var i in sentence) {
|
||||
words.push(sentence[i][1].word)
|
||||
if (sentence[i][1].lemma === tmp_hw && hw_idx == -1) {
|
||||
hw_idx = i
|
||||
}
|
||||
}
|
||||
this.sentences[ssj_id] = {
|
||||
hw_idx: hw_idx,
|
||||
words: words
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
getSenses: function (hw, callback) {
|
||||
if (hw === null || hw === undefined) {
|
||||
return
|
||||
}
|
||||
var component = this
|
||||
this.$http.get(
|
||||
this.$root.store.api_addr + "/api/senses/get" + "?hw=" + hw)
|
||||
.then(function(response) {
|
||||
// console.log(response.data)
|
||||
component.sens.senses = response.data.senses
|
||||
component.sens.sense_map = response.data.sense_map
|
||||
callback()
|
||||
})
|
||||
},
|
||||
reload: function () {
|
||||
this.state = "loading"
|
||||
this.sentences = {}
|
||||
if (this.$root.store.navSS === "functors") this.getFFrames(this.hw)
|
||||
else {
|
||||
this.getFrames(this.hw)
|
||||
if (this.$root.store.radio === "three") {
|
||||
this.getSenses(this.hw, this.sortBySense)
|
||||
}
|
||||
}
|
||||
this.calcPos()
|
||||
},
|
||||
userEdit: function () {
|
||||
// authenticate the user for this
|
||||
var tthis = this
|
||||
this.$root.checkToken()
|
||||
.then(function (response) {tthis.state = "editing"})
|
||||
.catch(function (err) {alert("Za urejanje je potrebna prijava.")}
|
||||
)
|
||||
},
|
||||
calcPos: function() {
|
||||
var bfmode = this.fmode
|
||||
if (typeof(bfmode) === "string") {
|
||||
bfmode = (bfmode === "true")
|
||||
}
|
||||
if (bfmode) return "udeleženska vloga"
|
||||
else if (this.hw.substr(this.hw.length-1) === "_") return "pridevnik"
|
||||
return "glagol"
|
||||
},
|
||||
sortBySense: function() {
|
||||
// frames with defined senses on top
|
||||
var undefFrames = []
|
||||
var defFrames = []
|
||||
//console.log(Object.keys(this.sens.sense_map))
|
||||
for (var i=0; i<this.frames.length; i++) {
|
||||
var sense_id = this.frames[i].sense_info.sense_id
|
||||
if (sense_id === "nedefinirano") undefFrames.push(this.frames[i])
|
||||
else defFrames.push(this.frames[i])
|
||||
}
|
||||
this.frames = defFrames.concat(undefFrames)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#main-displ-hw {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
</style>
|
||||
74
src_diploma/vue_frontend/src/components/Nav.vue
Normal file
74
src_diploma/vue_frontend/src/components/Nav.vue
Normal file
@@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<nav>
|
||||
<b-navbar toggleable="md" type="light" variant="light">
|
||||
<b-navbar-toggle target="nav_collapse"></b-navbar-toggle>
|
||||
<b-navbar-brand>Vezljivostni vzorci slovenskih glagolov</b-navbar-brand>
|
||||
<b-collapse is-nav id="nav_collapse">
|
||||
|
||||
<b-navbar-nav>
|
||||
<b-nav-item-dropdown text="Prikaz" right>
|
||||
<b-dropdown-item v-for="option in search_options"
|
||||
:value="option.val"
|
||||
:key="option.val"
|
||||
v-on:click="setNavSS(option.val)">
|
||||
{{ option.key }}
|
||||
</b-dropdown-item>
|
||||
</b-nav-item-dropdown>
|
||||
</b-navbar-nav>
|
||||
|
||||
<!-- Right aligned nav items -->
|
||||
<b-navbar-nav class="ml-auto" right v-if="this.loggedIn()">
|
||||
<b-nav-item>
|
||||
Uporabnik: {{ this.$root.store.username }}
|
||||
<a href="#" v-on:click="logOut()">(odjava)</a>
|
||||
</b-nav-item>
|
||||
</b-navbar-nav>
|
||||
<b-navbar-nav class="ml-auto" right v-else>
|
||||
<b-nav-item>
|
||||
<router-link to="/register">
|
||||
Registracija
|
||||
</router-link>
|
||||
</b-nav-item>
|
||||
<b-nav-item>
|
||||
<router-link to="/login">
|
||||
Prijava
|
||||
</router-link>
|
||||
</b-nav-item>
|
||||
</b-navbar-nav>
|
||||
|
||||
</b-collapse>
|
||||
</b-navbar>
|
||||
</nav>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Nav",
|
||||
props: ["appState"],
|
||||
data() {return {
|
||||
search_options: [
|
||||
{key: "besede", val: "words"},
|
||||
{key: "udeleženske vloge", val: "functors"},
|
||||
],
|
||||
}},
|
||||
methods: {
|
||||
setNavSS(val) {
|
||||
this.$root.store.radio = "one"
|
||||
this.$root.store.navSS = val
|
||||
this.$router.push({
|
||||
name: "Home"
|
||||
})
|
||||
},
|
||||
loggedIn() {
|
||||
return (this.$root.store.token !== null)
|
||||
},
|
||||
logOut() {
|
||||
this.$root.store.token = null
|
||||
this.$root.store.username = null
|
||||
this.$router.push({
|
||||
name: "Home"
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
106
src_diploma/vue_frontend/src/components/NewPass.vue
Normal file
106
src_diploma/vue_frontend/src/components/NewPass.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="col-sm-2">
|
||||
<a href="#" v-on:click="this.$root.routeBack">Nazaj</a>
|
||||
</div>
|
||||
<div class="ev-login col-sm-4 offset-sm-4">
|
||||
<div class="alert alert-danger" v-if="error">
|
||||
<p>{{ error }}</p>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="text"
|
||||
data-id="login.username"
|
||||
class="form-control js-login__username"
|
||||
placeholder="Uporabnik"
|
||||
v-model="credentials.username"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="email"
|
||||
class="form-control"
|
||||
placeholder="e-pošta"
|
||||
v-model="credentials.email"
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
<p>Novo geslo bo poslano na vaš e-poštni naslov.</p>
|
||||
</div>
|
||||
<button
|
||||
data-id="new_pass.submit"
|
||||
class="btn btn-primary solid blank js-login__submit"
|
||||
@click="submit()"
|
||||
>
|
||||
Novo geslo<i class="fa fa-arrow-circle-o-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'NewPass',
|
||||
data () {
|
||||
return {
|
||||
credentials: {
|
||||
username: '',
|
||||
email: ''
|
||||
},
|
||||
error: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submit () {
|
||||
this.error = ""
|
||||
//this.loggingIn = true
|
||||
// Auth.login() returns a promise. A redirect will happen on success.
|
||||
// For errors, use .then() to capture the response to output
|
||||
// error_description (if exists) as shown below:
|
||||
/*
|
||||
this.$auth.login(credentials, 'dashboard').then((response) => {
|
||||
this.loggingIn = false
|
||||
this.error = utils.getError(response)
|
||||
})
|
||||
*/
|
||||
|
||||
if ( this.credentials.username === "" ||
|
||||
this.credentials.email === ""
|
||||
) {
|
||||
this.error = "Izpolnite vsa polja."
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
var data = {
|
||||
username: this.credentials.username,
|
||||
email: this.credentials.email
|
||||
}
|
||||
|
||||
var component = this
|
||||
this.$http.post(this.$root.storeGet("api_addr") + "/api/new_pass",
|
||||
data, // the data to post
|
||||
{ headers: {
|
||||
'Content-type': 'application/x-www-form-urlencoded',
|
||||
}
|
||||
})
|
||||
.then(function (response) {
|
||||
component.$root.store.api_error = null
|
||||
var confirmation = response.data.confirmation
|
||||
component.$router.push({
|
||||
name: "Home"
|
||||
})
|
||||
})
|
||||
.catch(function (err) {
|
||||
component.$root.store.api_error = err
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ev-login {
|
||||
margin-top: 100px;
|
||||
}
|
||||
</style>
|
||||
138
src_diploma/vue_frontend/src/components/Register.vue
Normal file
138
src_diploma/vue_frontend/src/components/Register.vue
Normal file
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="col-sm-2">
|
||||
<a href="#" v-on:click="this.$root.routeBack">Nazaj</a>
|
||||
</div>
|
||||
<div class="ev-login col-sm-4 offset-sm-4">
|
||||
<div class="alert alert-danger" v-if="error">
|
||||
<p>{{ error }}</p>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control js-login__username"
|
||||
placeholder="Uporabnik"
|
||||
v-model="credentials.username"
|
||||
autocomplete="off"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="email"
|
||||
class="form-control"
|
||||
placeholder="e-pošta"
|
||||
v-model="credentials.email"
|
||||
autocomplete="off"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control js-login__password "
|
||||
placeholder="Geslo"
|
||||
v-model="credentials.password"
|
||||
autocomplete="off"
|
||||
>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input
|
||||
type="password"
|
||||
class="form-control js-login__password "
|
||||
placeholder="Ponovite geslo."
|
||||
v-model="credentials.snd_password"
|
||||
autocomplete="off"
|
||||
>
|
||||
</div>
|
||||
<button
|
||||
class="btn btn-primary solid blank js-login__submit"
|
||||
@click="submit()"
|
||||
>
|
||||
Registracija<i class="fa fa-arrow-circle-o-right"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Register',
|
||||
data () { return {
|
||||
credentials: {
|
||||
username: "",
|
||||
password: "",
|
||||
snd_password: "",
|
||||
email: ""
|
||||
},
|
||||
error: ""
|
||||
}},
|
||||
methods: {
|
||||
clearFields () {
|
||||
for (var key in this.credentials) {
|
||||
this.credentials[key] = ""
|
||||
}
|
||||
},
|
||||
checkEmail () {
|
||||
// check? ... todo
|
||||
return true
|
||||
},
|
||||
submit () {
|
||||
//console.log(this.credentials.password)
|
||||
//console.log(this.credentials.snd_password)
|
||||
const credentials = {
|
||||
username: this.credentials.username,
|
||||
password: this.credentials.password
|
||||
}
|
||||
|
||||
// check if fields are full
|
||||
for (var key in this.credentials) {
|
||||
if (credentials[key] === "") {
|
||||
this.error = "Izpolnite vsa polja."
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
// check e-mail
|
||||
if (!this.checkEmail(this.credentials.email)) {
|
||||
this.error = "Preverite e-poštni naslov."
|
||||
return
|
||||
}
|
||||
|
||||
// check passwords
|
||||
if (this.credentials.password !== this.credentials.snd_password) {
|
||||
this.error = "Gesli se ne ujemata."
|
||||
this.credentials.password = ""
|
||||
this.credentials.snd_password = ""
|
||||
return
|
||||
}
|
||||
|
||||
var component = this
|
||||
const post_data = {
|
||||
username: this.credentials.username,
|
||||
password: this.credentials.password,
|
||||
email: this.credentials.email,
|
||||
}
|
||||
this.$http.post(this.$root.storeGet("api_addr") + "/api/register",
|
||||
post_data, // the data to post
|
||||
{ headers: {
|
||||
'Content-type': 'application/json',
|
||||
}
|
||||
})
|
||||
.then(function (response) {
|
||||
component.$router.push({
|
||||
name: "Home"
|
||||
})
|
||||
})
|
||||
.catch(function (err) {
|
||||
component.$root.store.api_error = err
|
||||
component.error = "Registracija ni uspela."
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.ev-login {
|
||||
margin-top: 100px;
|
||||
}
|
||||
</style>
|
||||
48
src_diploma/vue_frontend/src/components/Sense.vue
Normal file
48
src_diploma/vue_frontend/src/components/Sense.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<div class="pb-3">
|
||||
<div v-if="sense === undefined">
|
||||
pomen ni definiran
|
||||
</div>
|
||||
<div v-else>
|
||||
<span>{{ sense.desc }}</span>
|
||||
<br>
|
||||
|
||||
<small class="text-secondary">
|
||||
- {{ sense.author }}
|
||||
{{ gen_id() }}
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Sense",
|
||||
props: ["sense"],
|
||||
methods: {
|
||||
gen_id: function() {
|
||||
var id_arr = this.sense.sense_id.split("-")
|
||||
var ret = ""
|
||||
if (this.sense.author === "SSKJ") {
|
||||
if (id_arr[1] !== "0") {
|
||||
ret += ("[" + id_arr[1] + ["] "])
|
||||
}
|
||||
if (id_arr[2] !== "0") {
|
||||
ret += ("pomen " + id_arr[2])
|
||||
if (id_arr[3] !== "0") {
|
||||
ret += ("." + id_arr[3])
|
||||
}
|
||||
}
|
||||
if (id_arr[4] === "sopo") {
|
||||
ret += " (sopomenka)"
|
||||
}
|
||||
}
|
||||
// ret = this.sense.sense_id //debugging
|
||||
if (ret.length > 0) {
|
||||
ret = ": " + ret
|
||||
}
|
||||
return ret
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
140
src_diploma/vue_frontend/src/main.js
Normal file
140
src_diploma/vue_frontend/src/main.js
Normal file
@@ -0,0 +1,140 @@
|
||||
// The Vue build version to load with the `import` command
|
||||
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
|
||||
import Vue from 'vue'
|
||||
import App from './App'
|
||||
import router from './router'
|
||||
import VueCookies from "vue-cookies"
|
||||
|
||||
// bootstrap
|
||||
import BootstrapVue from "bootstrap-vue"
|
||||
import 'bootstrap/dist/css/bootstrap.css'
|
||||
import 'bootstrap-vue/dist/bootstrap-vue.css'
|
||||
|
||||
// ajax
|
||||
import axios from "axios"
|
||||
|
||||
// config
|
||||
import config_data from "../config/config.json"
|
||||
// console.log(config_data)
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
||||
// cokies
|
||||
Vue.use(VueCookies)
|
||||
|
||||
// bootstrap
|
||||
Vue.use(BootstrapVue)
|
||||
|
||||
// CORS
|
||||
// Vue.$http.headers.common['Access-Control-Allow-Origin'] = true
|
||||
|
||||
Vue.prototype.$http = axios
|
||||
|
||||
// hand-made global storage
|
||||
const store = {
|
||||
api_error: null,
|
||||
api_addr: config_data.api_addr,
|
||||
// api_addr: "http://localhost:5004", // development (webpack)
|
||||
// api_addr: "http://193.2.76.103:5004", // production
|
||||
token: null,
|
||||
username: null,
|
||||
navSS: "words",
|
||||
radio: "one",
|
||||
has_se: [], // used for appending (se) to certain verbs
|
||||
}
|
||||
|
||||
const store_methods = {
|
||||
storeSet: function(key, val) {
|
||||
store[key] = val
|
||||
},
|
||||
storeGet: function(key) {
|
||||
// returns undefined if not in dict.
|
||||
// check if (variable)
|
||||
return store[key]
|
||||
}
|
||||
}
|
||||
|
||||
const login_methods = {
|
||||
checkToken: function () {
|
||||
var tthis = this
|
||||
return new Promise(function (resolve, reject) {
|
||||
if (tthis.store.token === null) {
|
||||
tthis.store.username = null
|
||||
reject(false)
|
||||
}
|
||||
var data = {
|
||||
token: tthis.store.token,
|
||||
user: tthis.store.username
|
||||
}
|
||||
tthis.$http.post(tthis.store.api_addr + "/api/token", data,
|
||||
{ headers: {
|
||||
'Content-type': 'application/x-www-form-urlencoded',
|
||||
}}
|
||||
)
|
||||
.then(function (response) {
|
||||
tthis.store.api_error = null
|
||||
if (response.data.confirmation) {
|
||||
resolve(true)
|
||||
} else {
|
||||
tthis.store.username = null
|
||||
tthis.store.token = null
|
||||
reject(false)
|
||||
}
|
||||
})
|
||||
.catch(function (err) {
|
||||
tthis.store.api_error = err
|
||||
reject(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const other_methods = {
|
||||
routeBack: function() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
mkspace: function (idx, word) {
|
||||
var stopwords = [".", ",", ":", ";"]
|
||||
if (stopwords.includes(word)) return false
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
el: '#app',
|
||||
router,
|
||||
components: { App },
|
||||
template: '<App/>',
|
||||
data() { return {
|
||||
store: store,
|
||||
}},
|
||||
methods: Object.assign(store_methods, login_methods, other_methods),
|
||||
beforeCreate: function() {
|
||||
document.title = "Vezljivostni vzorci"
|
||||
if (this.$cookies.isKey("valency_token")) {
|
||||
var cookie_token = this.$cookies.get("valency_token")
|
||||
var data = {
|
||||
token: cookie_token,
|
||||
}
|
||||
var component = this
|
||||
this.$http.post(store.api_addr + "/api/token",
|
||||
data, // the data to post
|
||||
{ headers: {
|
||||
'Content-type': 'application/x-www-form-urlencoded',
|
||||
}
|
||||
})
|
||||
.then(function (response) {
|
||||
if (response.data.confirmation) {
|
||||
store.username = response.data.username
|
||||
store.token = cookie_token
|
||||
} else {
|
||||
this.$cookies.remove("valency_token")
|
||||
}
|
||||
})
|
||||
.catch(function (err) {
|
||||
store.api_error = err
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
48
src_diploma/vue_frontend/src/router/index.js
Normal file
48
src_diploma/vue_frontend/src/router/index.js
Normal file
@@ -0,0 +1,48 @@
|
||||
import Vue from 'vue'
|
||||
import Router from 'vue-router'
|
||||
import Home from "@/components/Home"
|
||||
import Login from "@/components/Login"
|
||||
import Register from "@/components/Register"
|
||||
import NewPass from "@/components/NewPass"
|
||||
import MainDispl from "@/components/MainDispl"
|
||||
import EditSenses from "@/components/EditSenses"
|
||||
|
||||
Vue.use(Router)
|
||||
|
||||
export default new Router({
|
||||
mode: "history",
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
redirect: "/home"
|
||||
},
|
||||
{
|
||||
path: "/home",
|
||||
name: "Home",
|
||||
component: Home,
|
||||
children: [
|
||||
{
|
||||
path: "words/:hw",
|
||||
name: "MainDispl",
|
||||
component: MainDispl,
|
||||
props: true,
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
name: 'Login',
|
||||
component: Login
|
||||
},
|
||||
{
|
||||
path: '/register',
|
||||
name: 'Register',
|
||||
component: Register
|
||||
},
|
||||
{
|
||||
path: '/new_pass',
|
||||
name: 'NewPass',
|
||||
component: NewPass
|
||||
}
|
||||
]
|
||||
})
|
||||
Reference in New Issue
Block a user