Merge pull request 'First draft of Vue3 version. WIll finish after error-logging merge' (#31) from gifted-dialog-conversion into master

Reviewed-on: https://gitea.anomalistdesign.com/trent_larson/kick-starter-for-time-pwa/pulls/31

src/components/GiftedDialog.vue

@@ -40,50 +40,60 @@
   </div>
 </template>
 
-<script>
+<script lang="ts">
-export default {
+import {Vue, Component, Prop, Emit} from "vue-facing-decorator";
-  props: ["message"],
+
-  data() {
+@Component
-    return {
+export default class GiftedDialog extends Vue {
-      giver: null,
+  @Prop message = "";
-      description: "",
+
-      hours: "0",
+  giver = null;
-      visible: false,
+  description = "";
+  hours = "0";
+  visible = false;
+
+  open(giver) {
+    // giver: GiverInputInfo
+    this.giver = giver;
+    this.visible = true;
+  }
+  
+  close() {
+    this.visible = false;
+  }
+
+  increment() {
+    this.hours = `${(parseFloat(this.hours) || 0) + 1}`;
+  }
+
+  decrement() {
+    this.hours = `${Math.max(0, (parseFloat(this.hours) || 1) - 1)}`;
+  }
+
+  @Emit("dialog-result")
+  confirm() {
+    result = {
+      action: "confirm",
+      giver: this.giver,
+      hours: parseFloat(this.hours),
+      description: this.description,
     };    
-  },
+    this.close();
-  methods: {
+    this.description = "";
-    open(giver) {
+    this.giver = null;
-      // giver: GiverInputInfo
+    this.hours = "0";
-      this.giver = giver;
+
-      this.visible = true;
+    return result;
-    },
+  }
-    close() {
+
-      this.visible = false;
+  @Emit("dialog-result")
-    },
+  cancel() {
-    increment() {
+    result = { action: "cancel" };
-      this.hours = `${(parseFloat(this.hours) || 0) + 1}`;
+    this.close();
-    },
+    return result;
-    decrement() {
+  }
-      this.hours = `${Math.max(0, (parseFloat(this.hours) || 1) - 1)}`;
+
-    },
+}
-    confirm() {
-      this.close();
-      this.$emit("dialog-result", {
-        action: "confirm",
-        giver: this.giver,
-        hours: parseFloat(this.hours),
-        description: this.description,
-      });
-      this.description = "";
-      this.giver = null;
-      this.hours = "0";
-    },
-    cancel() {
-      this.close();
-      this.$emit("dialog-result", { action: "cancel" });
-    },
-  },
-};
 </script>
 
 <style>