129 lines
3.0 KiB
Vue
129 lines
3.0 KiB
Vue
<template>
|
||
<tr>
|
||
<th class="text-end" scope="row">{{ index + 1 }}</th>
|
||
<td class="text-center">{{ name }}</td>
|
||
<td class="text-start">
|
||
<template v-if="publicated">
|
||
<InfobaseURLEditor
|
||
v-if="url_edit"
|
||
:infobase_name="name"
|
||
:key="name"
|
||
:init_url="url"
|
||
@submit="apply_edit_url"
|
||
@cancel="cancel_edit_url"
|
||
/>
|
||
<a
|
||
class="text-break"
|
||
v-if="!url_edit"
|
||
v-bind:href="url_base + url"
|
||
target="blank"
|
||
>{{ infobase.url }}</a
|
||
>
|
||
</template>
|
||
</td>
|
||
<td class="text-end">
|
||
<div v-if="!url_edit && !is_locked" class="btn-group shadow" role="group">
|
||
<button
|
||
v-if="publicated"
|
||
type="button"
|
||
class="btn btn-warning"
|
||
@click="start_edit_url"
|
||
title="Изменить URL"
|
||
>
|
||
Изменить
|
||
</button>
|
||
<button
|
||
v-if="publicated"
|
||
type="button"
|
||
class="btn btn-danger"
|
||
@click="remove_publication"
|
||
title="Снять с публикации"
|
||
>
|
||
Отменить
|
||
</button>
|
||
<button
|
||
v-if="!publicated"
|
||
type="button"
|
||
class="btn btn-primary"
|
||
@click="add_publication"
|
||
title="Опубликовать базу"
|
||
>
|
||
Публиковать
|
||
</button>
|
||
</div>
|
||
<ItemLoading v-if="is_locked" />
|
||
</td>
|
||
</tr>
|
||
</template>
|
||
|
||
<script>
|
||
import { mapGetters, mapMutations, mapActions } from "vuex";
|
||
|
||
import InfobaseURLEditor from "@/components/InfobaseURLEditor.vue";
|
||
import ItemLoading from "@/components/ItemLoading.vue";
|
||
|
||
export default {
|
||
name: "InfobaseListItem",
|
||
components: {
|
||
InfobaseURLEditor,
|
||
ItemLoading,
|
||
},
|
||
data: () => ({
|
||
url_base: "http://localhost:11111",
|
||
url_edit: false,
|
||
}),
|
||
props: {
|
||
index: {
|
||
type: Number,
|
||
required: true,
|
||
},
|
||
infobase: {
|
||
type: Object,
|
||
required: true,
|
||
},
|
||
},
|
||
computed: {
|
||
...mapGetters(["getInfobaseByName"]),
|
||
name() {
|
||
return this.infobase.name;
|
||
},
|
||
publicated() {
|
||
return this.infobase.publicated;
|
||
},
|
||
url() {
|
||
return this.infobase.url;
|
||
},
|
||
is_locked() {
|
||
return this.$store.getters.isInfobaseLocked(this.infobase.name);
|
||
},
|
||
},
|
||
methods: {
|
||
...mapMutations({
|
||
//set_url: "setInfobaseURL",
|
||
set_publication: "setInfobasePublication",
|
||
}),
|
||
...mapActions({
|
||
set_url: "updateInfobaseURL",
|
||
}),
|
||
add_publication() {
|
||
let name = this.name;
|
||
this.set_publication({ name, publicated: true });
|
||
},
|
||
remove_publication() {
|
||
let name = this.name;
|
||
this.set_publication({ name, publicated: false });
|
||
},
|
||
start_edit_url() {
|
||
this.url_edit = true;
|
||
},
|
||
cancel_edit_url() {
|
||
this.url_edit = false;
|
||
},
|
||
apply_edit_url({ name, url }) {
|
||
this.set_url({ name, url });
|
||
this.url_edit = false;
|
||
},
|
||
},
|
||
};
|
||
</script>
|