v-slot:bodyで定義したth, tdにクラスを付与

kazuomatz · Apr 11, 2020 · c44d530 · c44d530
1 parent 349adcd
commit c44d530
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 18 deletions.
diff --git a/components/AgencyBarChart.vue b/components/AgencyBarChart.vue
@@ -32,10 +32,10 @@
       <template v-slot:body="{ items }">
         <tbody>
           <tr v-for="item in items" :key="item.text">
-            <th>{{ item.text }}</th>
-            <td>{{ item[0] }}</td>
-            <td>{{ item[1] }}</td>
-            <td>{{ item[2] }}</td>
+            <th class="text-start">{{ item.text }}</th>
+            <td class="text-start">{{ item[0] }}</td>
+            <td class="text-start">{{ item[1] }}</td>
+            <td class="text-start">{{ item[2] }}</td>
           </tr>
         </tbody>
       </template>

diff --git a/components/DataTable.vue b/components/DataTable.vue
@@ -18,11 +18,11 @@
       <template v-slot:body="{ items }">
         <tbody>
           <tr v-for="item in items" :key="item.text">
-            <th>{{ item['公表日'] }}</th>
-            <td>{{ item['居住地'] }}</td>
-            <td>{{ item['年代'] }}</td>
-            <td>{{ item['性別'] }}</td>
-            <td>{{ item['退院'] }}</td>
+            <th class="text-start">{{ item['公表日'] }}</th>
+            <td class="text-start">{{ item['居住地'] }}</td>
+            <td class="text-start">{{ item['年代'] }}</td>
+            <td class="text-start">{{ item['性別'] }}</td>
+            <td class="text-center">{{ item['退院'] }}</td>
           </tr>
         </tbody>
       </template>

diff --git a/components/MetroBarChart.vue b/components/MetroBarChart.vue
@@ -32,10 +32,10 @@
       <template v-slot:body="{ items }">
         <tbody>
           <tr v-for="item in items" :key="item.text">
-            <th>{{ item.text }}</th>
-            <td>{{ item[0] }}</td>
-            <td>{{ item[1] }}</td>
-            <td>{{ item[2] }}</td>
+            <th class="text-start">{{ item.text }}</th>
+            <td class="text-start">{{ item[0] }}</td>
+            <td class="text-start">{{ item[1] }}</td>
+            <td class="text-start">{{ item[2] }}</td>
           </tr>
         </tbody>
       </template>

diff --git a/components/TimeBarChart.vue b/components/TimeBarChart.vue
@@ -50,8 +50,8 @@
       <template v-slot:body="{ items }">
         <tbody>
           <tr v-for="item in items" :key="item.text">
-            <th>{{ item.text }}</th>
-            <td>{{ item['0'] }}</td>
+            <th class="text-start">{{ item.text }}</th>
+            <td class="text-start">{{ item['0'] }}</td>
           </tr>
         </tbody>
       </template>

diff --git a/components/TimeStackedBarChart.vue b/components/TimeStackedBarChart.vue
@@ -85,9 +85,9 @@
       <template v-slot:body="{ items }">
         <tbody>
           <tr v-for="item in items" :key="item.text">
-            <th>{{ item.text }}</th>
-            <td>{{ item['0'] }}</td>
-            <td>{{ item['1'] }}</td>
+            <th class="text-start">{{ item.text }}</th>
+            <td class="text-start">{{ item['0'] }}</td>
+            <td class="text-start">{{ item['1'] }}</td>
           </tr>
         </tbody>
       </template>