From 781608b6a116dbf7d1864f3b265b84201b95eaee Mon Sep 17 00:00:00 2001
From: 24take <takechi12231223@gmail.com>
Date: Sat, 16 Dec 2023 17:41:41 +0900
Subject: [PATCH 1/4] =?UTF-8?q?feat:```questionnaire-list.vue```=E3=82=92?=
 =?UTF-8?q?=E4=BD=9C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/questionnaire-list/questionnaire-list.vue | 9 +++++++++
 pages/questionnaires/index.vue                       | 4 +++-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 components/questionnaire-list/questionnaire-list.vue

diff --git a/components/questionnaire-list/questionnaire-list.vue b/components/questionnaire-list/questionnaire-list.vue
new file mode 100644
index 0000000..5476183
--- /dev/null
+++ b/components/questionnaire-list/questionnaire-list.vue
@@ -0,0 +1,9 @@
+<script lang="ts" setup></script>
+
+<template>
+  <div>
+    hello
+  </div>
+</template>
+
+<style></style>
diff --git a/pages/questionnaires/index.vue b/pages/questionnaires/index.vue
index ab5393e..e5ddbe1 100644
--- a/pages/questionnaires/index.vue
+++ b/pages/questionnaires/index.vue
@@ -1,7 +1,9 @@
 <script lang="ts" setup></script>
 
 <template>
-  <div/>
+  <div>
+    <questionnaire-list />
+  </div>
 </template>
 
 <style></style>

From 18fa97608a19c220a00323ec0ff052a65c4d4592 Mon Sep 17 00:00:00 2001
From: 24take <takechi12231223@gmail.com>
Date: Sun, 17 Dec 2023 00:21:05 +0900
Subject: [PATCH 2/4] =?UTF-8?q?wip:12/17-0:20=E6=99=82=E7=82=B9(500?=
 =?UTF-8?q?=E3=82=A8=E3=83=A9=E3=83=BC=E3=81=8C=E5=B8=B0=E3=81=A3=E3=81=A6?=
 =?UTF-8?q?=E3=81=8F=E3=82=8B)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../questionnaire-list/questionnaire-list.vue | 112 +++++++++++++++++-
 pages/questionnaires/index.vue                |  13 +-
 2 files changed, 120 insertions(+), 5 deletions(-)

diff --git a/components/questionnaire-list/questionnaire-list.vue b/components/questionnaire-list/questionnaire-list.vue
index 5476183..6a2c013 100644
--- a/components/questionnaire-list/questionnaire-list.vue
+++ b/components/questionnaire-list/questionnaire-list.vue
@@ -1,8 +1,114 @@
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+import { FilterMatchMode } from 'primevue/api';
+import { ref } from 'vue';
+
+const props = defineProps<{
+  customers: {
+    title: string;
+    response_due_date_time: string;
+    modified_at: string;
+    questionnaire_id: string;
+  }[];
+}>();
+const filters = ref({
+  global: { value: null, matchMode: FilterMatchMode.CONTAINS },
+  title: { value: null, matchMode: FilterMatchMode.STARTS_WITH },
+  response_due_date_time: {
+    value: null,
+    matchMode: FilterMatchMode.STARTS_WITH,
+  },
+  modified_at: { value: null, matchMode: FilterMatchMode.STARTS_WITH },
+  questionnaire_id: { value: null, matchMode: FilterMatchMode.STARTS_WITH },
+});
+const loading = ref(false);
+</script>
 
 <template>
-  <div>
-    hello
+  <div class="card">
+    <DataTable
+      v-model:filters="filters"
+      :value="customers"
+      paginator
+      :rows="10"
+      data-key="id"
+      filter-display="row"
+      :loading="loading"
+      :global-filter-fields="[
+        'title',
+        'response_due_date_time',
+        'modified_at',
+        'questionnaire_id',
+      ]"
+    >
+      <template #header>
+        <div class="flex justify-content-end">
+          <span class="p-input-icon-left">
+            <i class="pi pi-search" />
+            <InputText
+              v-model="filters['global'].value"
+              placeholder="Keyword Search"
+            />
+          </span>
+        </div>
+      </template>
+      <Column field="title" header="アンケート名">
+        <template #body="{ data }">
+          {{ data.title }}
+        </template>
+        <template #filter="{ filterModel, filterCallback }">
+          <InputText
+            v-model="filterModel.value"
+            type="text"
+            class="p-column-filter"
+            placeholder="Search by name"
+            @input="filterCallback()"
+          />
+        </template>
+      </Column>
+
+      <Column field="response_due_date_time" header="回答期限">
+        <template #body="{ data }">
+          {{ data.response_due_date_time }}
+        </template>
+        <template #filter="{ filterModel, filterCallback }">
+          <InputText
+            v-model="filterModel.value"
+            type="text"
+            class="p-column-filter"
+            placeholder="Search by name"
+            @input="filterCallback()"
+          />
+        </template>
+      </Column>
+      <Column field="modified_at" header="最終更新日時">
+        <template #body="{ data }">
+          {{ data.modified_at }}
+        </template>
+        <template #filter="{ filterModel, filterCallback }">
+          <InputText
+            v-model="filterModel.value"
+            type="text"
+            class="p-column-filter"
+            placeholder="Search by name"
+            @input="filterCallback()"
+          />
+        </template>
+      </Column>
+      <Column field=" questionnaire_id " header="リンク">
+        <template #body="{ data }">
+          {{ data.questionnaire_id }}
+        </template>
+        <template #filter="{ filterModel, filterCallback }">
+          <InputText
+            v-model="filterModel.value"
+            type="text"
+            class="p-column-filter"
+            placeholder="Search by name"
+            @input="filterCallback()"
+          />
+        </template>
+      </Column>
+    </DataTable>
   </div>
 </template>
 
diff --git a/pages/questionnaires/index.vue b/pages/questionnaires/index.vue
index e5ddbe1..5e81a9e 100644
--- a/pages/questionnaires/index.vue
+++ b/pages/questionnaires/index.vue
@@ -1,8 +1,17 @@
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+const customer = ref([
+  {
+    title:"ああああああああああああああ",
+    response_due_date_time:"2021/10/10",
+    modified_at:"2021/10/10",
+    questionnaire_id:"1",
+  },
+]);
+</script>
 
 <template>
   <div>
-    <questionnaire-list />
+    <questionnaire-list :customers="customer" />
   </div>
 </template>
 

From 373b00c535f1c2e0e1e85a40226a4bed9e7b9dda Mon Sep 17 00:00:00 2001
From: cp-20 <47262658+mario-hsp@users.noreply.github.com>
Date: Sun, 17 Dec 2023 00:27:15 +0900
Subject: [PATCH 3/4] =?UTF-8?q?fix:=20500=E3=82=A8=E3=83=A9=E3=83=BC?=
 =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/questionnaire-list/questionnaire-list.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/questionnaire-list/questionnaire-list.vue b/components/questionnaire-list/questionnaire-list.vue
index 6a2c013..4ebfc64 100644
--- a/components/questionnaire-list/questionnaire-list.vue
+++ b/components/questionnaire-list/questionnaire-list.vue
@@ -94,7 +94,7 @@ const loading = ref(false);
           />
         </template>
       </Column>
-      <Column field=" questionnaire_id " header="リンク">
+      <Column field="questionnaire_id" header="リンク">
         <template #body="{ data }">
           {{ data.questionnaire_id }}
         </template>

From 7509c3c4d97344a01ec211444fda7b33e0e12a9e Mon Sep 17 00:00:00 2001
From: 24take <takechi12231223@gmail.com>
Date: Sun, 17 Dec 2023 01:02:25 +0900
Subject: [PATCH 4/4] =?UTF-8?q?feat:```questionnaires```=E3=81=AE=E7=94=BB?=
 =?UTF-8?q?=E9=9D=A2=E3=82=92=E4=BB=AE=E4=BD=9C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../questionnaire-list/questionnaire-list.vue | 53 ++-----------------
 1 file changed, 3 insertions(+), 50 deletions(-)

diff --git a/components/questionnaire-list/questionnaire-list.vue b/components/questionnaire-list/questionnaire-list.vue
index 4ebfc64..1ff33e7 100644
--- a/components/questionnaire-list/questionnaire-list.vue
+++ b/components/questionnaire-list/questionnaire-list.vue
@@ -12,13 +12,6 @@ const props = defineProps<{
 }>();
 const filters = ref({
   global: { value: null, matchMode: FilterMatchMode.CONTAINS },
-  title: { value: null, matchMode: FilterMatchMode.STARTS_WITH },
-  response_due_date_time: {
-    value: null,
-    matchMode: FilterMatchMode.STARTS_WITH,
-  },
-  modified_at: { value: null, matchMode: FilterMatchMode.STARTS_WITH },
-  questionnaire_id: { value: null, matchMode: FilterMatchMode.STARTS_WITH },
 });
 const loading = ref(false);
 </script>
@@ -29,15 +22,11 @@ const loading = ref(false);
       v-model:filters="filters"
       :value="customers"
       paginator
-      :rows="10"
+      :rows="20"
       data-key="id"
-      filter-display="row"
       :loading="loading"
       :global-filter-fields="[
-        'title',
-        'response_due_date_time',
-        'modified_at',
-        'questionnaire_id',
+        'title'
       ]"
     >
       <template #header>
@@ -46,7 +35,7 @@ const loading = ref(false);
             <i class="pi pi-search" />
             <InputText
               v-model="filters['global'].value"
-              placeholder="Keyword Search"
+              placeholder="アンケート名で検索"
             />
           </span>
         </div>
@@ -55,58 +44,22 @@ const loading = ref(false);
         <template #body="{ data }">
           {{ data.title }}
         </template>
-        <template #filter="{ filterModel, filterCallback }">
-          <InputText
-            v-model="filterModel.value"
-            type="text"
-            class="p-column-filter"
-            placeholder="Search by name"
-            @input="filterCallback()"
-          />
-        </template>
       </Column>
 
       <Column field="response_due_date_time" header="回答期限">
         <template #body="{ data }">
           {{ data.response_due_date_time }}
         </template>
-        <template #filter="{ filterModel, filterCallback }">
-          <InputText
-            v-model="filterModel.value"
-            type="text"
-            class="p-column-filter"
-            placeholder="Search by name"
-            @input="filterCallback()"
-          />
-        </template>
       </Column>
       <Column field="modified_at" header="最終更新日時">
         <template #body="{ data }">
           {{ data.modified_at }}
         </template>
-        <template #filter="{ filterModel, filterCallback }">
-          <InputText
-            v-model="filterModel.value"
-            type="text"
-            class="p-column-filter"
-            placeholder="Search by name"
-            @input="filterCallback()"
-          />
-        </template>
       </Column>
       <Column field="questionnaire_id" header="リンク">
         <template #body="{ data }">
           {{ data.questionnaire_id }}
         </template>
-        <template #filter="{ filterModel, filterCallback }">
-          <InputText
-            v-model="filterModel.value"
-            type="text"
-            class="p-column-filter"
-            placeholder="Search by name"
-            @input="filterCallback()"
-          />
-        </template>
       </Column>
     </DataTable>
   </div>