DB連動実装

frontend/src/components/left/AppSelector.vue

@@ -0,0 +1,50 @@
+<template>
+  <div
+    class="row"
+    style="
+      border-radius: 2px;
+      box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset,
+        rgba(0, 0, 0, 0.3) 0px 0px 0px 1px;
+    ">
+    <q-icon
+      class="self-center q-ma-sm"
+      name="widgets"
+      color="grey-9"
+      style="font-size: 2em"
+    />
+
+    <div class="col-7 self-center ellipsis">
+      {{ selectedApp.name }}
+    </div>
+
+    <div class="self-center">
+      <q-btn
+        outline
+        dense
+        label="変 更"
+        padding="none sm"
+        color="primary"
+      ></q-btn>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent,ref } from 'vue';
+import {AppInfo} from '../../types/ActionTypes'
+export default defineComponent({
+  name: 'AppSelector',
+  emits:[
+    "appSelected"
+  ],
+  setup(props, context) {
+    const selectedApp =ref<AppInfo>({
+      appId:"",
+      name:"",
+    });
+    return {
+      selectedApp
+    }
+  }
+});
+</script>