63 lines
1.2 KiB
Vue
63 lines
1.2 KiB
Vue
<script setup>
|
|
import {ref, watch} from "vue";
|
|
import {slugify} from "src/composables/slugify";
|
|
|
|
const props = defineProps({
|
|
modelValue: {
|
|
type: String
|
|
},
|
|
slugSource: {
|
|
type: String,
|
|
required: false,
|
|
},
|
|
url : {
|
|
type: String,
|
|
required: false,
|
|
default: null
|
|
},
|
|
label: {
|
|
type: String,
|
|
required: false,
|
|
default: "URL"
|
|
},
|
|
rules: {
|
|
type: Array,
|
|
required: false,
|
|
default: () => ([])
|
|
}
|
|
});
|
|
|
|
const emit = defineEmits(['update:modelValue']);
|
|
const model = ref("");
|
|
|
|
const emitValue = (val) => {
|
|
emit("update:modelValue", val);
|
|
}
|
|
watch(() => model.value, (newVal) => {
|
|
model.value = slugify(newVal);
|
|
emitValue(newVal);
|
|
})
|
|
|
|
|
|
|
|
watch(() => props.slugSource, (newVal, oldVal) => {
|
|
if (model.value === "" || slugify(oldVal) === model.value) {
|
|
// pokud puvodni vychozi hodnota je stejna jako aktualne nastaveny slug, zmenime model
|
|
model.value = slugify(newVal);
|
|
}
|
|
}, {immediate: true});
|
|
</script>
|
|
|
|
<template>
|
|
<q-input
|
|
v-model="model"
|
|
:label="label"
|
|
:rules="rules"
|
|
hint="Veřejná URL adresa"
|
|
>
|
|
<template #prepend>
|
|
{{ url }}
|
|
</template>
|
|
</q-input>
|
|
</template>
|