vuetify : add edit button on show view

Author: alOneh

templates/vue-common/mixins/ShowMixin.js

@@ -20,7 +20,13 @@ export default {
           .catch(() => {});
       });
     },
-    formatDateTime
+    formatDateTime,
+    editHandler() {
+      this.$router.push({
+        name: `${this.$options.servicePrefix}Update`,
+        params: { id: this.item['@id'] }
+      });
+    }
   },
   watch: {
     error(message) {

templates/vuetify/components/Toolbar.vue

@@ -3,6 +3,14 @@
     <slot name="left"></slot>
     <v-spacer />
     <div>
+      <v-btn
+        v-if="handleEdit"
+        :loading="isLoading"
+        color="primary"
+        @click="editItem"
+      >
+        {{ $t('Edit') }}
+      </v-btn>
       <v-btn
         v-if="handleSubmit"
         :loading="isLoading"
@@ -55,6 +63,10 @@ export default {
     };
   },
   props: {
+    handleEdit: {
+      type: Function,
+      required: false
+    },
     handleSubmit: {
       type: Function,
       required: false
@@ -87,6 +99,11 @@ export default {
         this.handleAdd();
       }
     },
+    editItem() {
+      if (this.handleEdit) {
+        this.handleEdit();
+      }
+    },
     submitItem() {
       if (this.handleSubmit) {
         this.handleSubmit();

templates/vuetify/views/foo/Show.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <Toolbar :handle-delete="del">
+    <Toolbar :handle-edit="editHandler"  :handle-delete="del">
       <template slot="left">
         <v-toolbar-title v-if="item">\{{
           `${$options.servicePrefix} ${item['@id']}`