Add more components + base for history

2024-10-01 15:42:18 +02:00
parent fb4d566007
commit 8f9c83dc2a
38 changed files with 1374 additions and 665 deletions
@@ -1 +1,61 @@
-<div>PropertyDetail</div>
+{% load i18n %}
+
+<div>
+    <div class="card mt-4 pt-2 ps-lg-2">
+        <h5 class="card-header">{% trans "Property" %} [[ this.$route.params.id ]]</h5>
+        <div class="card-body">
+
+            <v-container fluid v-if="object">
+                <template v-for="field in headers">
+                    <v-row v-if="field.details">
+                        <v-col cols="4">
+                            <v-subheader>[[ field.text ]]</v-subheader>
+                        </v-col>
+                        <v-col cols="8">
+                            <v-text-field :value="object[field.value]" readonly dense></v-text-field>
+                        </v-col>
+                    </v-row>
+                </template>
+            </v-container>
+
+        </div>
+    </div>
+
+    <div class="card mt-4 pt-2 ps-lg-2">
+        <h5 class="card-header">{% trans "Item Properties" %}</h5>
+        <div class="card-body">
+            <LinkedPropertyList
+                :items="linked_properties"
+                :items_headers="linked_properties_headers"
+                :items_relations="{'item': all_items, 'property': [object]}"
+                :hidden_fields="['name', 'description', 'custom_identifier']"
+                :non_editable_fields="[]"
+                show_item="item"
+                show_url="ItemDetail"
+                group-by="property__name"
+                @deleteItem="deleteLinkedProperty"
+                @createItem="createLinkedProperty"
+                @editItem="editLinkedProperty"
+            ></LinkedPropertyList>
+        </div>
+    </div>
+
+    <div class="card mt-4 pt-2 ps-lg-2">
+        <h5 class="card-header">{% trans "Relation Properties" %}</h5>
+        <div class="card-body">
+            <LinkedPropertyList
+                :items="relation_properties"
+                :items_headers="relation_properties_headers"
+                :items_relations="{'item': all_items, 'property': [object]}"
+                :hidden_fields="['name', 'description', 'custom_identifier']"
+                :non_editable_fields="[]"
+                show_item="relation"
+                show_url="ItemRelationDetail"
+                group-by="property__name"
+                @deleteItem="deleteRelationProperty"
+                @createItem="createRelationProperty"
+                @editItem="editRelationProperty"
+            ></LinkedPropertyList>
+        </div>
+    </div>
+</div>
@@ -1,4 +1,79 @@
 PropertyDetail = {
    template: "#PropertyDetail",
    router_path: "/PropertyDetail/:id",
+    delimiters: ["[[", "]]"],
+
+    computed: {
+        object: function() {
+            return this.$store.state.properties.items.find(i => i.id == this.$route.params.id)
+        },
+
+        headers: function() {
+            return this.$store.state.properties.headers
+        },
+
+        linked_properties: function() {
+            return this.$store.state.linkedProperties.items.filter(i => i.property == this.$route.params.id)
+        },
+
+        linked_properties_headers: function() {
+            return this.$store.state.linkedProperties.headers
+        },
+
+        relation_properties: function() {
+            return this.$store.state.relationProperties.items.filter(i => i.property == this.$route.params.id)
+        },
+
+        relation_properties_headers: function() {
+            return this.$store.state.relationProperties.headers
+        },
+
+        all_items: function() {
+            return this.$store.state.items.items
+        }
+    },
+
+    methods: {
+        linkedPropertyEdition (method, item) {
+            return this.object_edit("items:linked.property.edit", "items:linked.property.create", 'linkedProperties', method, item)
+        },
+
+        relationPropertyEdition (method, item) {
+            return this.object_edit("items:relation.property.edit", "items:relation.property.create", 'relationProperties', method, item)
+        },
+
+        async deleteLinkedProperty (item) {
+            await this.linkedPropertyEdition("delete", item)
+            this.$store.commit("linkedProperties/removeItem", item.id)
+        },
+
+        async createLinkedProperty (item) {
+            item.property = this.$route.params.id
+            const new_item = await this.linkedPropertyEdition("post", item)
+            this.$store.commit("linkedProperties/addItem", new_item)
+        },
+
+        async editLinkedProperty (item) {
+            item.property = this.$route.params.id
+            const new_item = await this.linkedPropertyEdition("post", item)
+            this.$store.commit("linkedProperties/editItem", new_item)
+        },
+
+        async deleteRelationProperty (item) {
+            await this.relationPropertyEdition("delete", item)
+            this.$store.commit("relationProperties/removeItem", item.id)
+        },
+
+        async createRelationProperty (item) {
+            item.property = this.$route.params.id
+            const new_item = await this.relationPropertyEdition("post", item)
+            this.$store.commit("relationProperties/addItem", new_item)
+        },
+
+        async editRelationProperty (item) {
+            item.property = this.$route.params.id
+            const new_item = await this.relationPropertyEdition("post", item)
+            this.$store.commit("relationProperties/editItem", new_item)
+        },
+    }
 },