Add history + more components
This commit is contained in:
@@ -8,14 +8,82 @@
|
||||
<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>
|
||||
|
||||
<template v-if="field.value == 'type'">
|
||||
<v-col cols="4">
|
||||
<v-subheader>[[ field.text ]]</v-subheader>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<v-text-field :value="object[field.value]" readonly dense></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="2" class="d-flex">
|
||||
<v-btn color="primary" dark class="mb-2 flex-grow-1 flex-shrink-1" @click="showType">
|
||||
<v-icon small class="mr-2">mdi-eye</v-icon>
|
||||
{% trans "Link" %}
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<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>
|
||||
</template>
|
||||
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<v-row v-if="object?.history">
|
||||
<v-col cols="4">
|
||||
<v-subheader>{% trans "History version" %}</v-subheader>
|
||||
</v-col>
|
||||
<v-col cols="6">
|
||||
<v-text-field :value="object.history.length" readonly dense></v-text-field>
|
||||
</v-col>
|
||||
|
||||
<v-col cols="2" class="d-flex">
|
||||
<v-btn color="primary" dark class="mb-2 flex-grow-1 flex-shrink-1" @click="showHistory">
|
||||
<v-icon small class="mr-2">mdi-eye</v-icon>
|
||||
{% trans "View history" %}
|
||||
</v-btn>
|
||||
|
||||
<v-dialog v-model="dialog" max-width="1200px">
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
<span class="text-h5">{% trans "History for" %} [[ $route.params.id ]]</span>
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-container>
|
||||
|
||||
<v-data-table
|
||||
:headers="headers.filter(i => i.value != 'id')"
|
||||
:items="history"
|
||||
:items-per-page="50"
|
||||
dense>
|
||||
<template v-slot:item.actions="{ item }">
|
||||
<v-icon small class="mr-2" @click="deleteVersion(item)">mdi-delete</v-icon>
|
||||
<v-icon small @click="useVersion(item)">mdi-content-save-edit</v-icon>
|
||||
</template>
|
||||
</v-data-table>
|
||||
|
||||
</v-container>
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="blue darken-1" text @click="closeDialog">
|
||||
<v-icon small class="mr-2">mdi-arrow-left</v-icon>
|
||||
{% trans "Go back" %}
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -3,6 +3,12 @@ ItemDetail = {
|
||||
router_path: "/ItemDetail/:id",
|
||||
delimiters: ["[[", "]]"],
|
||||
|
||||
data: function() {
|
||||
return {
|
||||
dialog: false,
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
object: function() {
|
||||
return this.$store.state.items.items.find(i => i.id == this.$route.params.id)
|
||||
@@ -47,10 +53,51 @@ ItemDetail = {
|
||||
all_properties: function() {
|
||||
return this.$store.state.properties.items
|
||||
},
|
||||
|
||||
history: function() {
|
||||
return this.$store.state.history.items
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
async showHistory () {
|
||||
const response = await this.$http.get(Urls["items:history"](this.$route.params.id))
|
||||
|
||||
this.$store.state.history.headers = response.data.headers
|
||||
this.$store.dispatch("history/setItems", { self: this, items: response.data.history })
|
||||
this.dialog = true
|
||||
},
|
||||
|
||||
showType () {
|
||||
this.$router.push({ name: "ItemTypeDetail", params: { id: this.object.type }})
|
||||
},
|
||||
|
||||
closeDialog () {
|
||||
this.dialog = false
|
||||
this.$store.state.history.items = []
|
||||
},
|
||||
|
||||
async deleteVersion(version) {
|
||||
const response = await this.$http.delete(Urls["items:history.edit"](this.$route.params.id, version.history_id))
|
||||
|
||||
Swal.fire({title: "{{_('Version successfully deleted') | escapejs}}", icon: "success", position:"top-end", showConfirmButton: false, toast: true, timer: 1000})
|
||||
|
||||
this.closeDialog()
|
||||
},
|
||||
|
||||
async useVersion(version) {
|
||||
const response = await this.$http.post(Urls["items:history.edit"](this.$route.params.id, version.history_id))
|
||||
const efields = this.$store.getters["items/encryptedFields"]
|
||||
const new_item = await this.decryptObject(efields, response.data.object)
|
||||
|
||||
this.$store.commit("items/editItem", new_item)
|
||||
|
||||
Swal.fire({title: "{{_('Version successfully restored') | escapejs}}", icon: "success", position:"top-end", showConfirmButton: false, toast: true, timer: 1000})
|
||||
|
||||
this.closeDialog()
|
||||
},
|
||||
|
||||
linkedPropertyEdition (method, item) {
|
||||
return this.object_edit("items:linked.property.edit", "items:linked.property.create", 'linkedProperties', method, item)
|
||||
},
|
||||
|
||||
@@ -12,11 +12,11 @@
|
||||
<v-subheader>[[ field.text ]]</v-subheader>
|
||||
</v-col>
|
||||
<template v-if="field.value == 'parent' || field.value == 'child'">
|
||||
<v-col cols="7">
|
||||
<v-col cols="6">
|
||||
<v-text-field :value="object[field.value]" readonly dense></v-text-field>
|
||||
</v-col>
|
||||
<v-col cols="1">
|
||||
<v-btn color="primary" dark class="mb-2" @click="showItem(object[field.value])">
|
||||
<v-col cols="2" class="d-flex">
|
||||
<v-btn color="primary" dark class="mb-2 flex-grow-1 flex-shrink-1" @click="showItem(object[field.value])">
|
||||
<v-icon small class="mr-2">mdi-eye</v-icon>
|
||||
{% trans "Link" %}
|
||||
</v-btn>
|
||||
|
||||
@@ -0,0 +1,40 @@
|
||||
{% load i18n %}
|
||||
|
||||
<div>
|
||||
<div class="card mt-4 pt-2 ps-lg-2">
|
||||
<h5 class="card-header">{% trans "Type" %} [[ 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 "Items" %}</h5>
|
||||
<div class="card-body">
|
||||
|
||||
<ItemList
|
||||
:items="all_items"
|
||||
:items_headers="items_headers"
|
||||
:items_relations="{'type': [object]}"
|
||||
group_by="type__name"
|
||||
@deleteItem="deleteItem"
|
||||
@createItem="createItem"
|
||||
@editItem="editItem"
|
||||
></ItemList>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,46 @@
|
||||
ItemTypeDetail = {
|
||||
template: "#ItemTypeDetail",
|
||||
router_path: "/ItemTypeDetail/:id",
|
||||
delimiters: ["[[", "]]"],
|
||||
|
||||
computed: {
|
||||
object: function() {
|
||||
return this.$store.state.types.items.find(i => i.id == this.$route.params.id)
|
||||
},
|
||||
|
||||
headers: function() {
|
||||
return this.$store.state.types.headers
|
||||
},
|
||||
|
||||
all_items: function() {
|
||||
return this.$store.state.items.items.filter(i => i.type == this.$route.params.id)
|
||||
},
|
||||
|
||||
items_headers: function() {
|
||||
return this.$store.state.items.headers
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
item_edition (method, item) {
|
||||
return this.object_edit("items:edit", "items:create", "items", method, item)
|
||||
},
|
||||
|
||||
async createItem (item) {
|
||||
const new_item = await this.item_edition("post", item)
|
||||
this.$store.commit("items/addItem", new_item)
|
||||
},
|
||||
|
||||
async editItem (item) {
|
||||
const new_item = await this.item_edition("post", item)
|
||||
this.$store.commit("items/editItem", new_item)
|
||||
},
|
||||
|
||||
async deleteItem (item) {
|
||||
await this.item_edition("delete", item)
|
||||
this.$store.commit("items/removeItem", item.id)
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
@@ -26,6 +26,7 @@
|
||||
:items="types"
|
||||
:items_headers="types_headers"
|
||||
group_by="[]"
|
||||
show_url="ItemTypeDetail"
|
||||
@deleteItem="deleteType"
|
||||
@createItem="createType"
|
||||
@editItem="editType"
|
||||
|
||||
Reference in New Issue
Block a user