Frontend: Disable edit fields depending on feature flag
Signed-off-by: Michael Mayer <michael@liquidbytes.net>
This commit is contained in:
parent
c2fa3a7246
commit
463498c6d0
4 changed files with 61 additions and 20 deletions
|
@ -31,7 +31,7 @@
|
|||
<translate>Details</translate>
|
||||
</v-tab>
|
||||
|
||||
<v-tab id="tab-edit-labels" ripple>
|
||||
<v-tab id="tab-edit-labels" ripple :disabled="!$config.feature('labels')">
|
||||
<translate>Labels</translate>
|
||||
</v-tab>
|
||||
|
||||
|
@ -46,11 +46,11 @@
|
|||
</v-tab-item>
|
||||
|
||||
<v-tab-item lazy>
|
||||
<p-tab-photo-edit-labels :model="model"></p-tab-photo-edit-labels>
|
||||
<p-tab-photo-edit-labels :model="model" @close="close"></p-tab-photo-edit-labels>
|
||||
</v-tab-item>
|
||||
|
||||
<v-tab-item lazy>
|
||||
<p-tab-photo-edit-files :model="model"></p-tab-photo-edit-files>
|
||||
<p-tab-photo-edit-files :model="model" @close="close"></p-tab-photo-edit-files>
|
||||
</v-tab-item>
|
||||
</v-tabs-items>
|
||||
</v-tabs>
|
||||
|
|
|
@ -36,6 +36,7 @@
|
|||
<v-layout row wrap>
|
||||
<v-flex xs12 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
label="Title"
|
||||
placeholder=""
|
||||
|
@ -48,6 +49,7 @@
|
|||
<v-flex xs12 sm6 md3 pa-2 class="p-date-select">
|
||||
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
:value="timeLocalFormatted"
|
||||
browser-autocomplete="off"
|
||||
label="Local Time"
|
||||
|
@ -59,6 +61,7 @@
|
|||
</v-flex>
|
||||
<v-flex xs12 sm6 md3 pa-2 class="p-date-select">
|
||||
<v-menu
|
||||
:disabled="disabled"
|
||||
v-model="showTimePicker"
|
||||
:close-on-content-click="false"
|
||||
full-width
|
||||
|
@ -66,6 +69,7 @@
|
|||
>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
:value="timeFormatted"
|
||||
label="UTC Time"
|
||||
readonly
|
||||
|
@ -85,12 +89,14 @@
|
|||
</v-flex>
|
||||
<v-flex xs12 sm6 md3 class="pa-2 p-date-select">
|
||||
<v-menu
|
||||
:disabled="disabled"
|
||||
:close-on-content-click="false"
|
||||
full-width
|
||||
max-width="290"
|
||||
>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
:value="dateFormatted"
|
||||
browser-autocomplete="off"
|
||||
label="UTC Date"
|
||||
|
@ -110,6 +116,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2 p-timezone-select">
|
||||
<v-autocomplete
|
||||
:disabled="disabled"
|
||||
:label="labels.timezone"
|
||||
hide-details
|
||||
color="secondary-dark"
|
||||
|
@ -122,6 +129,7 @@
|
|||
|
||||
<v-flex xs12 md6 pa-2 class="p-camera-select">
|
||||
<v-select
|
||||
:disabled="disabled"
|
||||
:label="labels.camera"
|
||||
browser-autocomplete="off"
|
||||
hide-details
|
||||
|
@ -134,6 +142,7 @@
|
|||
</v-flex>
|
||||
<v-flex xs12 md6 pa-2 class="p-lens-select">
|
||||
<v-select
|
||||
:disabled="disabled"
|
||||
:label="labels.lens"
|
||||
browser-autocomplete="off"
|
||||
hide-details
|
||||
|
@ -147,6 +156,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Latitude"
|
||||
|
@ -157,6 +167,7 @@
|
|||
</v-flex>
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Longitude"
|
||||
|
@ -167,6 +178,7 @@
|
|||
</v-flex>
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Altitude (m)"
|
||||
|
@ -178,6 +190,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2 p-countries-select">
|
||||
<v-select
|
||||
:disabled="disabled"
|
||||
:label="labels.country"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
|
@ -191,6 +204,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Focal Length"
|
||||
|
@ -202,6 +216,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="F Number"
|
||||
|
@ -213,6 +228,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="ISO"
|
||||
|
@ -224,6 +240,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Exposure"
|
||||
|
@ -235,6 +252,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-textarea
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
auto-grow
|
||||
|
@ -248,6 +266,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Artist"
|
||||
|
@ -259,6 +278,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-text-field
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
label="Copyright"
|
||||
|
@ -270,6 +290,7 @@
|
|||
|
||||
<v-flex xs12 sm6 md3 class="pa-2">
|
||||
<v-textarea
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
auto-grow
|
||||
|
@ -283,6 +304,7 @@
|
|||
|
||||
<v-flex xs12 class="pa-2">
|
||||
<v-textarea
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
auto-grow
|
||||
|
@ -296,6 +318,7 @@
|
|||
|
||||
<v-flex xs12 md6 class="pa-2">
|
||||
<v-textarea
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
auto-grow
|
||||
|
@ -309,6 +332,7 @@
|
|||
|
||||
<v-flex xs12 md6 class="pa-2">
|
||||
<v-textarea
|
||||
:disabled="disabled"
|
||||
hide-details
|
||||
browser-autocomplete="off"
|
||||
auto-grow
|
||||
|
@ -320,7 +344,7 @@
|
|||
></v-textarea>
|
||||
</v-flex>
|
||||
|
||||
<v-flex xs12 text-xs-right class="pt-3">
|
||||
<v-flex xs12 text-xs-right class="pt-3" v-if="!disabled">
|
||||
<v-btn @click.stop="close" depressed color="secondary-light"
|
||||
class="p-photo-dialog-close">
|
||||
<translate>Close</translate>
|
||||
|
@ -355,6 +379,7 @@
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
disabled: !this.$config.feature("edit"),
|
||||
config: this.$config.values,
|
||||
all: {
|
||||
countries: [{code: "", name: ""}],
|
||||
|
|
|
@ -12,9 +12,12 @@
|
|||
>
|
||||
<template slot="items" slot-scope="props" class="p-file">
|
||||
<td>
|
||||
<a :href="'/api/v1/download/' + props.item.FileHash" class="secondary-dark--text" target="_blank">
|
||||
<a :href="'/api/v1/download/' + props.item.FileHash" class="secondary-dark--text" target="_blank" v-if="$config.feature('download')">
|
||||
{{ props.item.FileName }}
|
||||
</a>
|
||||
<span v-else>
|
||||
{{ props.item.FileName }}
|
||||
</span>
|
||||
</td>
|
||||
<td>{{ props.item.FileWidth ? props.item.FileWidth : "" }}</td>
|
||||
<td>{{ props.item.FileHeight ? props.item.FileHeight : "" }}</td>
|
||||
|
|
|
@ -14,13 +14,20 @@
|
|||
<td>{{ props.item.Label.LabelName }}</td>
|
||||
<td class="text-xs-left">{{ props.item.LabelSource }}</td>
|
||||
<td class="text-xs-center">{{ 100 - props.item.LabelUncertainty }}%</td>
|
||||
<td class="text-xs-center"><v-btn icon small flat :ripple="false"
|
||||
class="p-photo-label-remove"
|
||||
@click.stop.prevent="removeLabel(props.item.Label)">
|
||||
<v-icon color="secondary-dark">delete</v-icon>
|
||||
</v-btn></td>
|
||||
<td class="text-xs-center">
|
||||
<v-btn v-if="!disabled" icon small flat :ripple="false"
|
||||
class="p-photo-label-remove"
|
||||
@click.stop.prevent="removeLabel(props.item.Label)">
|
||||
<v-icon color="secondary-dark">delete</v-icon>
|
||||
</v-btn>
|
||||
<v-btn v-else icon small flat :ripple="false"
|
||||
class="action-view"
|
||||
@click.stop.prevent="searchLabel(props.item.Label)">
|
||||
<v-icon color="secondary-dark">search</v-icon>
|
||||
</v-btn>
|
||||
</td>
|
||||
</template>
|
||||
<template v-slot:footer>
|
||||
<template v-slot:footer v-if="!disabled">
|
||||
<td>
|
||||
<v-text-field
|
||||
v-model="newLabel"
|
||||
|
@ -36,11 +43,13 @@
|
|||
</td>
|
||||
<td class="text-xs-left">manual</td>
|
||||
<td class="text-xs-center">100%</td>
|
||||
<td class="text-xs-center"><v-btn icon small flat :ripple="false"
|
||||
class="p-photo-label-remove"
|
||||
@click.stop.prevent="addLabel">
|
||||
<v-icon color="secondary-dark">add</v-icon>
|
||||
</v-btn></td>
|
||||
<td class="text-xs-center">
|
||||
<v-btn icon small flat :ripple="false"
|
||||
class="p-photo-label-remove"
|
||||
@click.stop.prevent="addLabel">
|
||||
<v-icon color="secondary-dark">add</v-icon>
|
||||
</v-btn>
|
||||
</td>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</div>
|
||||
|
@ -56,6 +65,7 @@
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
disabled: !this.$config.feature("edit"),
|
||||
config: this.$config.values,
|
||||
readonly: this.$config.getValue("readonly"),
|
||||
selected: [],
|
||||
|
@ -72,13 +82,12 @@
|
|||
nameRule: v => v.length <= 25 || this.$gettext("Name too long"),
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
refresh() {
|
||||
},
|
||||
removeLabel(label) {
|
||||
if(!label) {
|
||||
if (!label) {
|
||||
return
|
||||
}
|
||||
|
||||
|
@ -89,7 +98,7 @@
|
|||
});
|
||||
},
|
||||
addLabel() {
|
||||
if(!this.newLabel) {
|
||||
if (!this.newLabel) {
|
||||
return
|
||||
}
|
||||
|
||||
|
@ -99,6 +108,10 @@
|
|||
this.newLabel = "";
|
||||
});
|
||||
},
|
||||
searchLabel(label) {
|
||||
this.$router.push({name: 'photos', query: {q: 'label:' + label.LabelSlug}}).catch(err => {});
|
||||
this.$emit('close');
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
Loading…
Reference in a new issue