Frontend: Add advaned tab to photo edit dialog
Signed-off-by: Michael Mayer <michael@liquidbytes.net>
This commit is contained in:
Michael Mayer
parent
ef876e0754
commit
f0c51abc21
4 changed files with 127 additions and 0 deletions
|
|
@ -41,6 +41,10 @@
|
|||
<translate key="Files">Files</translate>
|
||||
</v-tab>
|
||||
|
||||
<v-tab id="tab-info" ripple v-if="$config.feature('edit')">
|
||||
<translate key="Advanced">Advanced</translate>
|
||||
</v-tab>
|
||||
|
||||
<v-tabs-items touchless>
|
||||
<v-tab-item>
|
||||
<p-tab-photo-edit :model="model" ref="edit"
|
||||
|
|
@ -54,6 +58,10 @@
|
|||
<v-tab-item lazy>
|
||||
<p-tab-photo-files :model="model" @close="close"></p-tab-photo-files>
|
||||
</v-tab-item>
|
||||
|
||||
<v-tab-item lazy v-if="$config.feature('edit')">
|
||||
<p-tab-photo-advanced :model="model" @close="close"></p-tab-photo-advanced>
|
||||
</v-tab-item>
|
||||
</v-tabs-items>
|
||||
</v-tabs>
|
||||
</v-card>
|
||||
|
|
@ -64,6 +72,7 @@
|
|||
import PhotoEdit from "./photo/edit.vue";
|
||||
import PhotoLabels from "./photo/labels.vue";
|
||||
import PhotoFiles from "./photo/files.vue";
|
||||
import PhotoAdvanced from "./photo/advanced.vue";
|
||||
|
||||
export default {
|
||||
name: 'p-photo-edit-dialog',
|
||||
|
|
@ -77,6 +86,7 @@
|
|||
'p-tab-photo-edit': PhotoEdit,
|
||||
'p-tab-photo-labels': PhotoLabels,
|
||||
'p-tab-photo-files': PhotoFiles,
|
||||
'p-tab-photo-advanced': PhotoAdvanced,
|
||||
},
|
||||
computed: {
|
||||
title: function () {
|
||||
|
|
|
|||
101
frontend/src/dialog/photo/advanced.vue
Normal file
101
frontend/src/dialog/photo/advanced.vue
Normal file
|
|
@ -0,0 +1,101 @@
|
|||
<template>
|
||||
<div class="p-tab p-tab-photo-advanced">
|
||||
<div class="v-table__overflow">
|
||||
<table class="v-datatable v-table theme--light">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>UID</td>
|
||||
<td>{{ model.UID | uppercase }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Path</td>
|
||||
<td>{{ model.Path }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Name</td>
|
||||
<td>{{ model.Name }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Original</td>
|
||||
<td><v-text-field
|
||||
@change="save"
|
||||
flat solo dense hide-details v-model="model.OriginalName"
|
||||
color="secondary-dark"
|
||||
style="font-weight: 400; font-size: 13px;"
|
||||
></v-text-field></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Country</td>
|
||||
<td>{{ model.countryName() }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Year</td>
|
||||
<td><v-text-field
|
||||
@change="save"
|
||||
flat solo dense hide-details v-model="model.Year"
|
||||
color="secondary-dark"
|
||||
style="font-weight: 400; font-size: 13px;"
|
||||
></v-text-field></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Month</td>
|
||||
<td><v-select @change="save"
|
||||
label="Month"
|
||||
flat solo dense hide-details
|
||||
color="secondary-dark"
|
||||
style="font-weight: 400; font-size: 13px;"
|
||||
item-value="Month"
|
||||
item-text="Name"
|
||||
v-model="model.Month"
|
||||
:items="monthOptions">
|
||||
</v-select></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Thumb from "model/thumb";
|
||||
import {DateTime, Info} from "luxon";
|
||||
|
||||
export default {
|
||||
name: 'p-tab-photo-advanced',
|
||||
props: {
|
||||
model: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
config: this.$config.values,
|
||||
readonly: this.$config.get("readonly"),
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
monthOptions() {
|
||||
let result = [
|
||||
{"Month": -1, "Name": this.$gettext("Unknown")},
|
||||
];
|
||||
|
||||
const months = Info.months("long");
|
||||
|
||||
for (let i = 0; i < months.length; i++) {
|
||||
result.push({"Month": i + 1, "Name": months[i]});
|
||||
}
|
||||
|
||||
return result;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
save() {
|
||||
this.model.update();
|
||||
},
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
openPhoto() {
|
||||
this.$viewer.show(Thumb.fromFiles([this.model]), 0)
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -28,6 +28,7 @@ export class Photo extends RestModel {
|
|||
Path: "",
|
||||
Color: "",
|
||||
Name: "",
|
||||
OriginalName: "",
|
||||
Title: "",
|
||||
TitleSrc: "",
|
||||
Description: "",
|
||||
|
|
@ -316,6 +317,18 @@ export class Photo extends RestModel {
|
|||
return this.Lat !== 0 || this.Lng !== 0;
|
||||
}
|
||||
|
||||
countryName() {
|
||||
if (this.Country !== "zz") {
|
||||
const country = countries.find(c => c.Code === this.Country);
|
||||
|
||||
if (country) {
|
||||
return country.Name;
|
||||
}
|
||||
}
|
||||
|
||||
return "Unknown";
|
||||
}
|
||||
|
||||
locationInfo() {
|
||||
if (this.PlaceID === "zz" && this.Country !== "zz") {
|
||||
const country = countries.find(c => c.Code === this.Country);
|
||||
|
|
|
|||
|
|
@ -45,6 +45,9 @@ type Photo struct {
|
|||
CameraID uint `json:"CameraID"`
|
||||
CameraSrc string `json:"CameraSrc"`
|
||||
LensID uint `json:"LensID"`
|
||||
PhotoYear int `json:"Year"`
|
||||
PhotoMonth int `json:"Month"`
|
||||
OriginalName string `json:"OriginalName"`
|
||||
}
|
||||
|
||||
func NewPhoto(m interface{}) (f Photo, err error) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue