对阵图（新建文件）

src/pages/matchTree.vue

+<template>
+    <uni-card
+        :is-full = 'true'
+        title = '对阵图'
+    >
+    </uni-card>
+</template>
+<script setup lang = 'ts'>
+    import { defineProps, onMounted, watch } from 'vue';
+    import Match from '../script/match';
+    import Participant from '../script/participant';
+
+    const props = defineProps(['matches', 'participants']) as {
+        matches : Array<Match>,
+        participants : Array<Participant>
+    };
+
+    const getName = (id : number) : string => {
+        const p = props.participants.find(i => i.id == id);
+        return p?.name ?? '';
+    }
+</script>
+<style scoped lang = 'scss'>
+</style>
\ No newline at end of file

src/pages/tournament.vue

@@ -277,6 +277,15 @@
                         </uni-pagination>
                     </uni-card>
                 </transition>
+                <!--
+                <transition name = 'switch'>
+                    <MatchTree
+                        v-show = "match.array.length > 0 && tournament.this.rule == 'SingleElimination'"
+                        :matches = 'match.array'
+                        :participants = 'participant.array'
+                    ></MatchTree>
+                </transition>
+                -->
             </uni-card>
         </transition>
     </view>
@@ -292,6 +301,8 @@
     import Const from '../script/const.ts'
     import Mycard from '../script/mycard.ts';
     import {TournamentCreateObject, MatchUpdateObject, TournamentGet, ParticipantUpdateObject} from '../script/type.ts'
+    import MatchTree from './matchTree.vue';
+
     let tournament = reactive({
         this : undefined as undefined | Tournament,
         status : {