103 lines
2.3 KiB
Vue
103 lines
2.3 KiB
Vue
<template>
|
|
<div>
|
|
<div class="form-group mb-3">
|
|
<label
|
|
v-if="id < 1"
|
|
class="col-4"
|
|
>Tworzysz nowy szablon</label
|
|
>
|
|
<label
|
|
v-if="id > 0"
|
|
class="col-4"
|
|
>Nadpiszesz istniejacy szablon</label
|
|
>
|
|
<div class="col-8">
|
|
<b
|
|
v-if="id > 0"
|
|
class=""
|
|
>{{ name2 }}</b
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="form form-group mb-3">
|
|
<label class="w-100">Wyszukaj istniejący lub zapisz jako nowy</label>
|
|
<select
|
|
v-model="itemselected"
|
|
@change="changeSelect"
|
|
class="form-control"
|
|
>
|
|
<option :value="{ new: 1 }">Stwórz nowy szablon</option>
|
|
<option
|
|
:key="ii"
|
|
v-for="(item, ii) in items"
|
|
:value="item"
|
|
>
|
|
Nadpisz: {{ item.name }}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
<div v-show="itemselected.new == 1">
|
|
<div class="form form-group mb-3">
|
|
<label class="w-100">Nazwa szablonu</label
|
|
><input
|
|
@change="change"
|
|
class="form-control"
|
|
type="text"
|
|
v-model="name"
|
|
/>
|
|
</div>
|
|
<div class="form form-group mb-3">
|
|
<label class="w-100">Opis</label
|
|
><input
|
|
@change="change"
|
|
class="form-control"
|
|
type="text"
|
|
v-model="description"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
created() {
|
|
this.getPost();
|
|
},
|
|
data: function () {
|
|
return {
|
|
items: [],
|
|
itemselected: { new: 1 },
|
|
name: "",
|
|
description: "",
|
|
id: 0,
|
|
};
|
|
},
|
|
emits: ['update:modelValue','change'],
|
|
methods: {
|
|
change() {
|
|
this.$emit("update:modelValue", {
|
|
id: this.id,
|
|
name: this.name,
|
|
description: this.description,
|
|
});
|
|
},
|
|
changeSelect() {
|
|
this.id = this.itemselected.id;
|
|
this.name = this.itemselected.name;
|
|
this.name2 = this.itemselected.naem;
|
|
this.description = this.itemselected.description;
|
|
this.change();
|
|
},
|
|
getPost() {
|
|
if (this.$pagebuilder.axios) {
|
|
this.$pagebuilder.axios.get("api/v1/pagebuilder/template").then((response) => {
|
|
this.items = response.data.data;
|
|
});
|
|
} else {
|
|
console.error("NO AXIOS INSTACE PROVIDED TO PAGEBUILDER");
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|