ayanova/devdocs/todo.txt

@@ -52,8 +52,9 @@ http://localhost:8080/login
 
 
 CURRENT WORK: 
-- Mini login screen layout fucked
+
 - Replace dialog, confirm etc with my own implementations as stock as possible
+- Get edit form existing features completely working
 
 
 =================================================

ayanova/src/App.vue

@@ -1,7 +1,7 @@
 <template>
   <v-app>
     <gznotify ref="gznotify"></gznotify>
-    <!-- <gzconfirm ref="gzconfirm"></gzconfirm> -->
+    <gzconfirm ref="gzconfirm"></gzconfirm>
     <!-- <gztest ref="gztest"></gztest> -->
     <v-navigation-drawer v-if="isAuthenticated" v-model="drawer" app>
       <v-list dense>
@@ -117,15 +117,14 @@
 <script>
 /*  xeslint-disable    */
 import aboutInfo from "./api/aboutinfo";
-//import gzconfirm from "./components/gzconfirm";
+import gzconfirm from "./components/gzconfirm";
 import gznotify from "./components/gznotify";
 //import gztest from "./components/gztest";
 
 export default {
   components: {
     //gztest
-    //gzconfirm
+    gzconfirm,
-    // ,
     gznotify
   },
   data() {
@@ -155,7 +154,7 @@ export default {
     window.$gz.eventBus.$off();
   },
   mounted() {
-    //this.$root.$gzconfirm = this.$refs.gzconfirm.open;
+    this.$root.$gzconfirm = this.$refs.gzconfirm.open;
     this.$root.$gznotify = this.$refs.gznotify.addNotification;
 
     //redirect to login if not authenticated

ayanova/src/components/gzconfirm.vue

@@ -1,6 +1,7 @@
+<!--
 <template>
   <v-dialog
-    v-model="dialog"
+    v-model="isVisible"
     :max-width="options.width"
     :style="{ zIndex: options.zIndex }"
     @keydown.esc="cancel"
@@ -18,7 +19,40 @@
     </v-card>
   </v-dialog>
 </template>
+-->
+<template>
+  <div class="text-center">
+    <v-dialog
+      persistent
+      v-model="isVisible"
+      :max-width="options.width"
+      @keydown.esc="cancel"
+    >
+      <v-card>
+        <v-card-title
+          class="headline lighten-2"
+          v-bind:class="options.type"
+          primary-title
+        >
+          {{ title }}
+        </v-card-title>
 
+        <v-card-text>
+          {{ message }}
+        </v-card-text>
+
+        <v-divider></v-divider>
+
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="primary" text @click="isVisible = false">
+            I accept
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </div>
+</template>
 <script>
 /**
  * Vuetify Confirm Dialog component
@@ -50,20 +84,20 @@
  */
 export default {
   data: () => ({
-    dialog: false,
+    isVisible: false,
     resolve: null,
     reject: null,
     message: null,
     title: null,
     options: {
-      color: "primary",
+      type: "warning", //one of success, info, warning, and error, see v-alert docs for more info
       width: 290,
       zIndex: 200
     }
   }),
   methods: {
     open(title, message, options) {
-      this.dialog = true;
+      this.isVisible = true;
       this.title = title;
       this.message = message;
       this.options = Object.assign(this.options, options);
@@ -74,11 +108,11 @@ export default {
     },
     agree() {
       this.resolve(true);
-      this.dialog = false;
+      this.isVisible = false;
     },
     cancel() {
       this.resolve(false);
-      this.dialog = false;
+      this.isVisible = false;
     }
   }
 };