[add] Vue版本

static/style/default/index.css

@@ -0,0 +1,8 @@
+#text {
+    color: var(--color-normal-contrast-weakest);
+    margin: auto;
+    width: 180px;
+}
+.counter {
+    text-align: center;
+}

static/template/default/index.html

@@ -0,0 +1,6 @@
+<div>
+    <link href="style/default/bootstrap.min.css" rel="stylesheet">
+    <div id="app">
+        <counter></counter>
+    </div>
+</div>

static/template/vue/counter.html

@@ -0,0 +1,18 @@
+<div class="counter">
+    <h1 style="text-align:center">Uuid Convert</h1>
+    <hr />
+    <div>
+        <h2 style="text-align:left">1. 填入要轉換的UUID</h2>
+    </div>
+    <hr />
+    <div>
+        <h1 style="text-align:left">要轉換的UUID</h1>
+        <div class="input-group input-group-lg">
+            <input id="uuid" v-model="uuid" type="text" class="form-control" placeholder="UUID">
+        </div>
+    </div>
+    <hr />
+    <div style="text-align:right">
+        <button id="run" @click="run()" type="button" class="btn btn-primary btn-lg btn-block">執行</button>
+    </div>
+</div>

static/template/vue/counter.js

@@ -0,0 +1,36 @@
+const PACKAGE_NAME = "uuidconvert";
+const fs = require("fs");
+
+module.exports = {
+    name: "counter",
+
+    template: fs.readFileSync(Editor.url(`packages://${PACKAGE_NAME}/static/template/vue/counter.html`), 'utf-8'),
+
+    created: function () {
+
+    },
+
+    data: function () {
+        return {
+            uuid: ""
+        }
+    },
+
+    props: {
+
+    },
+
+    methods: {
+        run() {
+            if (!this.uuid) {
+                Editor.error("請輸入要轉換的UUID");
+                return;
+            }
+            Editor.Ipc.sendToMain("uuidconvert:run-click", this.uuid);
+        },
+    },
+
+    watch: {
+
+    }
+}