V0.1

k356/templates/base_components/glist/template.html

@@ -2,7 +2,7 @@
 
 {% block component %}
 <v-data-table
-    :headers="items_headers"
+    :headers="citems_headers"
     :items="items"
     :items-per-page="50"
     :search="search"
@@ -34,17 +34,29 @@
                             <v-row>
                                 <template v-for="field in editable_fields">
                                     <template v-if="field.field_widget == 'v-select'">
-                                        <v-select
-                                            v-model="editedItem[field.value]"
-                                            :items="items_relations[field.value]"
-                                            :label="field.text"
-                                            item-text="name"
-                                            item-value="id"
-                                            persistent-hint>
-                                            <template slot="item" slot-scope="data">
-                                                [[ data.item.name ]] - [[ data.item.custom_identifier ]]
-                                            </template>
-                                        </v-select>
+                                        <template v-if="field.choices">
+                                            <v-select
+                                                v-model="editedItem[field.value]"
+                                                :items="field.choices"
+                                                :label="field.text"
+                                                item-text="text"
+                                                item-value="value"
+                                                persistent-hint>
+                                            </v-select>
+                                        </template>
+                                        <template v-else>
+                                            <v-select
+                                                v-model="editedItem[field.value]"
+                                                :items="items_relations[field.value]"
+                                                :label="field.text"
+                                                item-text="name"
+                                                item-value="id"
+                                                persistent-hint>
+                                                <template slot="item" slot-scope="data">
+                                                    [[ data.item.name ]] - [[ data.item.custom_identifier ]]
+                                                </template>
+                                            </v-select>
+                                        </template>
                                     </template>
                                     <template v-else>
                                         <component :is="field.field_widget" v-model="editedItem[field.value]" :label="field.text"></component>
@@ -91,7 +103,23 @@
     <template v-slot:item.id="{ item }">
         [[ item.id.slice(0, 8) ]]...
     </template>
+    <template v-slot:item.description="{ item }">
+        <template v-if="item.description && item.description.length > 15">
+            [[ item.description.slice(0, 15) ]]...
+        </template>
+        <template v-else>
+            [[ item.description ]]
+        </template>
+    </template>
+    <template v-slot:item.last_modified_at="{ item }">
+        [[ formatDate(item.last_modified_at) ]]
+    </template>
+    <template v-slot:item.created_at="{ item }">
+        [[ formatDate(item.created_at) ]]
+    </template>
+
     <template v-slot:item.actions="{ item }">
+        <v-icon v-if="show_url" small class="mr-2" @click="showItem(item)">mdi-eye</v-icon>
         <v-icon small class="mr-2" @click="editItem(item)">mdi-pencil</v-icon>
         <v-icon small @click="deleteItem(item)">mdi-delete</v-icon>
     </template>

k356/templates/base_components/glist/vue.js

@@ -1,8 +1,9 @@
 {% block component %}
 {{ name }} = {
     template: "#{{ name }}",
+    router_path: "/{{ name }}",
     delimiters: ["[[", "]]"],
-    props: ["crypto_key", "items", "items_headers", "items_relations", "group_by"],
+    props: ["crypto_key", "items", "items_headers", "items_relations", "group_by", "hidden_fields"],
 
     data: function() {
         return {
@@ -12,6 +13,8 @@
             defaultItem: {},
             editedItem: {},
             search: null,
+            show_url: "{{ show_url|default:'' }}",
+            default_hidden_fields: [{% for field in default_hidden_fields %}"{{ field }}",{% endfor %}]
         }
     },
 
@@ -19,6 +22,10 @@
         editable_fields: function() {
             return this.items_headers.filter(e => e.editable)
         },
+
+        citems_headers: function() {
+            return this.items_headers.filter(e => !this.hidden_fields.includes(e.value) && !this.default_hidden_fields.includes(e.value))
+        },
     },
 
     watch: {
@@ -32,6 +39,14 @@
 
     methods: {
 
+        formatDate (date) {
+            return formatDate(date)
+        },
+
+        showItem (item) {
+            this.$router.replace({ name: this.show_url, params: { id: item.id }})
+        },
+
         editItem (item) {
             this.editedIndex = this.items.indexOf(item)
             this.editedItem = Object.assign({}, item)
@@ -45,9 +60,6 @@
         },
 
         deleteItemConfirm () {
-            var self = this
-            var item = this.items[this.editedIndex]
-
             this.$emit("deleteItem", this.editedIndex)
             this.closeDelete()
 
@@ -74,7 +86,6 @@
 
             } else {
 
-                console.log('createItem emit', this.editedItem)
                 this.$emit("createItem", this.editedItem)
 
             }