123 lines
2.5 KiB
Vue
123 lines
2.5 KiB
Vue
<script setup="setup">
|
|
|
|
const { etherFetch } = useEtherpadApi()
|
|
|
|
const store = usePojmiStore()
|
|
|
|
const props = defineProps({
|
|
revisionId: String,
|
|
pojem: Object,
|
|
onZapri: Function
|
|
})
|
|
|
|
let naslov = ref(props.pojem.naslov)
|
|
let email = ref('')
|
|
|
|
const oddajPredlog = async data => {
|
|
// @TODO vsebina pada v tekst, testirat
|
|
if (!naslov.value) {
|
|
alert("Manjka naslov pojma!")
|
|
return
|
|
}
|
|
|
|
const starNaslov = props.pojem.naslov
|
|
|
|
const resp = await etherFetch('/getText', { padID: props.revisionId })
|
|
const stvarjenje = store.ustvariPojem({
|
|
title: naslov.value,
|
|
email: email.value,
|
|
text: resp.data.text,
|
|
uuid: props.revisionId
|
|
})
|
|
console.log(stvarjenje)
|
|
alert("sprememba predlagana!")
|
|
|
|
stvarjenje.then(() => {
|
|
console.log('NOV NASLOV?', starNaslov, props.pojem.naslov)
|
|
if (starNaslov !== props.pojem.naslov) {
|
|
navigateTo(localePath({ name: 'pojem_poglej', params: { naslov: props.pojem.naslov }}))
|
|
}
|
|
})
|
|
|
|
props.onZapri()
|
|
}
|
|
|
|
// @TODO tole raje v pojmi.vue oz nov_pojem.vue - page!
|
|
const etherNalozen = ev => {
|
|
if (props.pojem.nov) {
|
|
navigateTo(localePath({ name: 'pojem_dodaj', params: { guid: revisionId }}), {
|
|
replace: true
|
|
})
|
|
} else {
|
|
navigateTo(localePath({ name: 'pojem_uredi', params: {
|
|
naslov: props.pojem.naslov,
|
|
guid: props.revisionId
|
|
}}), { replace: true })
|
|
}
|
|
//window.location.hash = props.revisionId
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<form class="pojem" @submit.prevent>
|
|
<input name="naslov" type="text" placeholder="Naslov" v-model="naslov" @keydown.enter.prevent>
|
|
|
|
<EtherpadTextarea :onLoad="etherNalozen" :revisionId="props.revisionId" />
|
|
|
|
<input name="email" type="email" placeholder="E-poštni naslov" v-model="email" @keydown.enter="oddajPredlog">
|
|
<div class="gumbi">
|
|
<button class="gumb" @click="props.onZapri">
|
|
{{ props.zapriLabel ?? $t('Zapri') }}
|
|
</button>
|
|
<button class="gumb oddaj" @click="oddajPredlog">
|
|
{{ $t("Predlagaj") }}
|
|
</button>
|
|
</div>
|
|
|
|
</form>
|
|
</template>
|
|
|
|
<style>
|
|
form {
|
|
gap: 1rem;
|
|
}
|
|
|
|
.etherpad-textarea {
|
|
width: 100%;
|
|
flex-grow: 1;
|
|
border-radius: 16px;
|
|
border: 2px solid var(--siva);
|
|
box-sizing: border-box;
|
|
min-height: 500px;
|
|
}
|
|
|
|
input {
|
|
border: 2px solid var(--siva);
|
|
border-radius: 8px;
|
|
padding: 15px;
|
|
}
|
|
|
|
.gumbi {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
}
|
|
.gumb,
|
|
.gumbi input,
|
|
.gumbi button {
|
|
text-transform: uppercase;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.pojem.form .gumb {
|
|
width: 50%;
|
|
}
|
|
|
|
.pojem button.oddaj {
|
|
color: var(--roza);
|
|
}
|
|
|
|
</style>
|