changes data structure.

src/components/FirstAttempt.vue

@@ -1,138 +1,137 @@
 <template>
     <v-container>
-        <v-row>
+        <v-sheet max-width="600px" height="800px">
-            <v-col>Rank</v-col>
+            <v-row no-gutters>
-            <v-col>East</v-col>
+                <v-col>East</v-col>
-            <v-col>West</v-col>
+                <v-col>Rank</v-col>
-        </v-row>
+                <v-col>West</v-col>
-        <v-row v-for="rank in ranks" :key="rank.name">
+            </v-row>
-            <v-col>{{ rank.name }}</v-col>
+            <v-row v-for="rank in ranks" :key="rank.name">
-            <v-col>
+                <v-col>
-                <v-chip draggable>{{rank.east}}</v-chip>
+                    <v-chip :color="rank.east.record.wins > rank.east.record.losses + rank.east.record.withdrawls ? 'green' : 'red'" v-if="rank.east" draggable>{{ rank.east.name }}: {{ rank.east.record.wins }}-{{ rank.east.record.losses }}-{{ rank.east.record.withdrawls }}</v-chip>
-            </v-col>
+                </v-col>
-            <v-col>
+                <v-col>{{ rank.name }}</v-col>
-                <v-chip draggable>{{rank.west}}</v-chip>
+                <v-col>
-            </v-col>
+                    <v-chip :color="rank.west.record.wins > rank.west.record.losses + rank.west.record.withdrawls ? 'green' : 'red'" v-if="rank.west" draggable>{{ rank.west.name }}: {{ rank.west.record.wins }}-{{ rank.west.record.losses }}-{{ rank.west.record.withdrawls }}</v-chip>
-        </v-row>
+                </v-col>
+            </v-row>
+        </v-sheet>
     </v-container>
 </template>
 
 <script setup>
+import rikishi from '@/components/rikishi.js';
 const ranks = [
     {
         name: 'Yokozuna',
-        east: 'Terunofuji',
+        east: rikishi.find(x => x.name === 'Terunofuji')
-        west: ''
     },
     {
         name: 'Ozeki',
-        east: 'Takekeisho',
+        east: rikishi.find(x => x.name === 'Takakeisho'),
-        west: 'Kirishima'
+        west: rikishi.find(x => x.name === 'Kirishima')
     },
     {
         name: 'Ozeki',
-        east: '',
+        west: rikishi.find(x => x.name === 'Hoshoryu'),
-        west: 'Hoshoryu'
     },
     {
         name: 'Sekiwake',
-        east: 'Daieisho',
+        east: rikishi.find(x => x.name === 'Daieisho'),
-        west: 'Wakamotoharu',
+        west: rikishi.find(x => x.name === 'Wakamotoharu')
     },
     {
         name: 'Sekiwake',
-        east: 'Kotonowaka',
+        east: rikishi.find(x => x.name === 'Kotonowaka'),
-        west: ''
     },
     {
         name: 'Komosubi',
-        east: 'Abi',
+        east: rikishi.find(x => x.name === 'Abi'),
-        west: 'Hokutofuji'
+        west: rikishi.find(x => x.name === 'Hokutofuji')
     },
     {
         name: 'Maegashira 1',
-        east: 'Asanoyama',
+        east: rikishi.find(x => x.name === 'Asanoyama'),
-        west: 'Ura'
+        west: rikishi.find(x => x.name === 'Ura')
     },
     {
         name: 'Maegashira 2',
-        east: 'Shodai',
+        east: rikishi.find(x => x.name === 'Shodai'),
-        west: 'Meisei'
+        west: rikishi.find(x => x.name === 'Meisei')
     },
     {
         name: 'Maegashira 3',
-        east: 'Takayasu',
+        east: rikishi.find(x => x.name === 'Takayasu'),
-        west: 'Tobizaru'
+        west: rikishi.find(x => x.name === 'Tobizaru')
     },
     {
         name: 'Maegashira 4',
-        east: 'Gonoyama',
+        east: rikishi.find(x => x.name === 'Gonoyama'),
-        west: 'Nishikigi'
+        west: rikishi.find(x => x.name === 'Nishikigi')
     },
     {
         name: 'Maegashira 5',
-        east: 'Onosho',
+        east: rikishi.find(x => x.name === 'Onosho'),
-        west: 'Midorifuji'
+        west: rikishi.find(x => x.name === 'Midorifuji')
     },
     {
         name: 'Maegashira 6',
-        east: 'Shonannoumi',
+        east: rikishi.find(x => x.name === 'Shonannoumi'),
-        west: 'Takanosho'
+        west: rikishi.find(x => x.name === 'Takanosho')
     },
     {
         name: 'Maegashira 7',
-        east: 'Hokuseiho',
+        east: rikishi.find(x => x.name === 'Hokuseiho'),
-        west: 'Kinbozan'
+        west: rikishi.find(x => x.name === 'Kinbozan')
     },
     {
         name: 'Maegashira 8',
-        east: 'Endo',
+        east: rikishi.find(x => x.name === 'Endo'),
-        west: 'Atamifuji'
+        west: rikishi.find(x => x.name === 'Atamifuji')
     },
     {
         name: 'Maegashira 9',
-        east: 'Myogiryu',
+        east: rikishi.find(x => x.name === 'Myogiryu'),
-        west: 'Mitakeumi'
+        west: rikishi.find(x => x.name === 'Mitakeumi')
     },
     {
         name: 'Maegashira 10',
-        east: 'Ryuden',
+        east: rikishi.find(x => x.name === 'Ryuden'),
-        west: 'Kotoeko'
+        west: rikishi.find(x => x.name === 'Kotoeko')
     },
     {
         name: 'Maegashira 11',
-        east: 'Sadanoumi',
+        east: rikishi.find(x => x.name === 'Sadanoumi'),
-        west: 'Hiradoumi'
+        west: rikishi.find(x => x.name === 'Hiradoumi')
     },
     {
         name: 'Maegashira 12',
-        east: 'Oho',
+        east: rikishi.find(x => x.name === 'Oho'),
-        west: 'Tamawashi'
+        west: rikishi.find(x => x.name === 'Tamawashi')
     },
     {
         name: 'Maegashira 13',
-        east: 'Takarafuji',
+        east: rikishi.find(x => x.name === 'Takarafuji'),
-        west: 'Tsurugisho'
+        west: rikishi.find(x => x.name === 'Tsurugisho')
     },
     {
         name: 'Maegashira 14',
-        east: 'Tomokaze',
+        east: rikishi.find(x => x.name === 'Tomokaze'),
-        west: 'Ichiyamamoto'
+        west: rikishi.find(x => x.name === 'Ichiyamamoto')
     },
     {
         name: 'Maegashira 15',
-        east: 'Tohakuyru',
+        east: rikishi.find(x => x.name === 'Tohakuryu'),
-        west: 'Churanoumi'
+        west: rikishi.find(x => x.name === 'Churanoumi')
     },
     {
         name: 'Maegashira 16',
-        east: 'Roga',
+        east: rikishi.find(x => x.name === 'Roga'),
-        west: 'Nishikifuji'
+        west: rikishi.find(x => x.name === 'Nishikifuji')
     },
     {
         name: 'Maegashira 17',
-        east: 'Kitanowaka',
+        east: rikishi.find(x => x.name === 'Kitanowaka')
-        west: ''
     }
-    ];
+];
 </script>

src/components/rikishi.js

@@ -0,0 +1,340 @@
+const rikishi = [
+    {
+        name: 'Terunofuji',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 15
+        }
+    },
+    {
+        name: 'Takakeisho',
+        record: {
+            wins: 9,
+            losses: 6,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Kirishima',
+        record: {
+            wins: 13,
+            losses: 2,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Hoshoryu',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Daieisho',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Wakamotoharu',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Kotonowaka',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Abi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Hokutofuji',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Asanoyama',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Ura',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Shodai',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Meisei',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Takayasu',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Tobizaru',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Gonoyama',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Nishikigi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Onosho',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Midorifuji',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Shonannoumi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Takanosho',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Hokuseiho',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Kinbozan',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Endo',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Atamifuji',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Myogiryu',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Mitakeumi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Ryuden',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Kotoeko',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Sadanoumi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Hiradoumi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Oho',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Tamawashi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Takarafuji',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Tsurugisho',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Tomokaze',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Ichiyamamoto',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Tohakuryu',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Churanoumi',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Roga',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Nishikifuji',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    },
+    {
+        name: 'Kitanowaka',
+        record: {
+            wins: 0,
+            losses: 0,
+            withdrawls: 0
+        }
+    }
+];
+
+export default rikishi;