91 lines
2.8 KiB
Vue
91 lines
2.8 KiB
Vue
<template>
|
|
<div class="w-full py-2">
|
|
<div class="flex -mb-px">
|
|
<div class="w-1/2 h-6 rounded-tl-md relative border border-black-200 flex items-center justify-center cursor-pointer" :class="!showAdvancedView ? 'text-white bg-bg hover:bg-opacity-60 border-b-bg' : 'text-gray-400 hover:text-gray-300 bg-primary bg-opacity-70 hover:bg-opacity-60'" @click="showAdvancedView = false">
|
|
<p class="text-sm">{{ $strings.HeaderRSSFeedGeneral }}</p>
|
|
</div>
|
|
<div class="w-1/2 h-6 rounded-tr-md relative border border-black-200 flex items-center justify-center -ml-px cursor-pointer" :class="showAdvancedView ? 'text-white bg-bg hover:bg-opacity-60 border-b-bg' : 'text-gray-400 hover:text-gray-300 bg-primary bg-opacity-70 hover:bg-opacity-60'" @click="showAdvancedView = true">
|
|
<p class="text-sm">{{ $strings.HeaderAdvanced }}</p>
|
|
</div>
|
|
</div>
|
|
<div class="px-2 py-4 md:p-4 border border-black-200 rounded-b-md mr-px" style="min-height: 200px">
|
|
<template v-if="!showAdvancedView">
|
|
<div class="flex-grow pt-2 mb-2">
|
|
<ui-checkbox v-model="preventIndexing" :label="$strings.LabelPreventIndexing" checkbox-bg="primary" border-color="gray-600" label-class="pl-2" />
|
|
</div>
|
|
</template>
|
|
<template v-else>
|
|
<div class="flex-grow pt-2 mb-2">
|
|
<ui-checkbox v-model="preventIndexing" :label="$strings.LabelPreventIndexing" checkbox-bg="primary" border-color="gray-600" label-class="pl-2" />
|
|
</div>
|
|
<div class="w-full relative mb-1">
|
|
<ui-text-input-with-label v-model="ownerName" :label="$strings.LabelRSSFeedCustomOwnerName" />
|
|
</div>
|
|
<div class="w-full relative mb-1">
|
|
<ui-text-input-with-label v-model="ownerEmail" :label="$strings.LabelRSSFeedCustomOwnerEmail" />
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
value: {
|
|
type: Object,
|
|
default: () => {
|
|
return {
|
|
preventIndexing: true,
|
|
ownerName: '',
|
|
ownerEmail: ''
|
|
}
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
showAdvancedView: false
|
|
}
|
|
},
|
|
watch: {},
|
|
computed: {
|
|
preventIndexing: {
|
|
get() {
|
|
return this.value.preventIndexing
|
|
},
|
|
set(value) {
|
|
this.$emit('input', {
|
|
...this.value,
|
|
preventIndexing: value
|
|
})
|
|
}
|
|
},
|
|
ownerName: {
|
|
get() {
|
|
return this.value.ownerName
|
|
},
|
|
set(value) {
|
|
this.$emit('input', {
|
|
...this.value,
|
|
ownerName: value
|
|
})
|
|
}
|
|
},
|
|
ownerEmail: {
|
|
get() {
|
|
return this.value.ownerEmail
|
|
},
|
|
set(value) {
|
|
this.$emit('input', {
|
|
...this.value,
|
|
ownerEmail: value
|
|
})
|
|
}
|
|
}
|
|
},
|
|
methods: {},
|
|
mounted() {}
|
|
}
|
|
</script>
|