66 lines
1.6 KiB
Vue
66 lines
1.6 KiB
Vue
<template>
|
|
<DialogWidget ref="dialog" title="socialnetwork.gallery.show_image_dialog.title" icon="image16.png"
|
|
:show-close="true" :buttons="buttons" :modal="true" :isTitleTranslated="true" @close="closeDialog"
|
|
name="ImageDialog">
|
|
<div>
|
|
<div class="image-container">
|
|
<img :src="image.url" alt="Image" :style="{ maxWidth: '600px', maxHeight: '600px' }" />
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="imageTitle">{{ $t('socialnetwork.gallery.imagedialog.image_title') }} <span type="text">{{
|
|
imageTitle }}</span></label>
|
|
</div>
|
|
</div>
|
|
</DialogWidget>
|
|
</template>
|
|
|
|
<script>
|
|
import DialogWidget from '@/components/DialogWidget.vue';
|
|
|
|
export default {
|
|
name: "ShowImageDialog",
|
|
components: {
|
|
DialogWidget,
|
|
},
|
|
data() {
|
|
return {
|
|
image: null,
|
|
imageTitle: '',
|
|
};
|
|
},
|
|
computed: {
|
|
buttons() {
|
|
return [
|
|
{ text: this.$t('socialnetwork.gallery.imagedialog.close'), action: this.closeDialog }
|
|
];
|
|
},
|
|
},
|
|
methods: {
|
|
open(image) {
|
|
this.image = image;
|
|
this.imageTitle = image.title;
|
|
this.$refs.dialog.open();
|
|
},
|
|
closeDialog() {
|
|
this.$refs.dialog.close();
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.form-group {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
.image-container {
|
|
text-align: center;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.multiselect {
|
|
display: inline-block;
|
|
width: auto;
|
|
}
|
|
</style>
|