From ef6cc44d5035395c93ef9143ff226da467fecf69 Mon Sep 17 00:00:00 2001
From: "maxiaozhe@alicorns.co.jp" <maxiaozhe@alicorns.co.jp>
Date: Wed, 6 Sep 2023 22:05:47 +0900
Subject: [PATCH] Main Component added

---
 frontend/src/components/ActionNode.vue      | 38 +++++++++++++++++++++
 frontend/src/components/main/ActionNode.vue |  0
 2 files changed, 38 insertions(+)
 create mode 100644 frontend/src/components/ActionNode.vue
 create mode 100644 frontend/src/components/main/ActionNode.vue

diff --git a/frontend/src/components/ActionNode.vue b/frontend/src/components/ActionNode.vue
new file mode 100644
index 0000000..697f990
--- /dev/null
+++ b/frontend/src/components/ActionNode.vue
@@ -0,0 +1,38 @@
+<template>
+  <div class="q-pa-md" style="max-width: 350px">
+    <q-expansion-item
+      class="shadow-1 overflow-hidden"
+      style="border-radius: 30px"
+      icon="explore"
+      label="Counter"
+      @show="startCounting"
+      @hide="stopCounting"
+      header-class="bg-primary text-white"
+      expand-icon-class="text-white"
+    >
+      <q-card>
+        <q-card-section>
+          Counting: <q-badge color="secondary">{{ counter }}</q-badge>.
+          Will only count when opened, using the show/hide events to control count timer.
+        </q-card-section>
+      </q-card>
+    </q-expansion-item>
+  </div>
+</template>
+<script lang="ts">
+import { defineComponent} from "vue"
+export default defineComponent({
+  props:{
+    icon:String,
+
+  },
+  setup() {
+    return {
+
+    }
+  }
+});
+</script>
+<style lang="">
+
+</style>
diff --git a/frontend/src/components/main/ActionNode.vue b/frontend/src/components/main/ActionNode.vue
new file mode 100644
index 0000000..e69de29