ダイアログに検索追加

frontend/src/components/ActionSelect.vue

@@ -3,13 +3,15 @@
     <div v-if="!isLoaded" class="spinner flex flex-center">
       <q-spinner  color="primary" size="3em" />
     </div>
-    <q-table v-else  row-key="name" :selection="type" v-model:selected="selected" :columns="columns" :rows="rows"
+    <q-table v-else  row-key="index" :selection="type" v-model:selected="selected" :columns="columns" :rows="rows"
     class="action-table"
     flat bordered
     virtual-scroll
     :pagination="pagination"
     :rows-per-page-options="[0]"
-    />
+    :filter="filter"
+    >
+    </q-table>
   </div>
 </template>
 <script>
@@ -20,9 +22,10 @@ export default {
   name: 'actionSelect',
   props: {
     name: String,
-    type: String
+    type: String,
+    filter:String
   },
-  setup() {
+  setup(props) {
     const isLoaded=ref(false);
     const columns = [
     { name: 'name', required: true,label: 'アクション名',align: 'left',field: 'name',sortable: true},
@@ -32,9 +35,9 @@ export default {
     const rows = reactive([])
     onMounted(async () => {
         const res =await api.get('api/actions');
-        res.data.forEach((item) =>
+        res.data.forEach((item,index) =>
         {
-          rows.push({name:item.name,desc:item.title,outputPoints:item.outputpoints,property:item.property});
+          rows.push({index,name:item.name,desc:item.title,outputPoints:item.outputpoints,property:item.property});
         });
         isLoaded.value=true;
       });
@@ -54,5 +57,6 @@ export default {
 <style lang="scss">
 .action-table{
   height: 100%;
+  max-height: 540px;
 }
 </style>