修改审核比赛弹窗界面、修改个人界面上传头像位置、修改后端审核不通过比赛逻辑

vuetify-project/src/audit_games.vue

@@ -2,8 +2,8 @@
   <v-app>
     <!-- {{ filteredMatches }} -->
     <v-container>
-      <v-data-table class="overflow-auto " :headers="headers" :items="filteredMatches" item-key="id" :search="search.value"
-        :items-per-page="10">
+      <v-data-table class="overflow-auto " :headers="headers" :items="filteredMatches" item-key="id"
+        :search="search.value" :items-per-page="10">
         <template v-slot:top>
           <v-toolbar flat>
             <v-toolbar-title>比赛</v-toolbar-title>
@@ -13,7 +13,7 @@
           </v-toolbar>
         </template>
         <template v-slot:item.date="{ item }">
-          <p style="width:60px" >{{ item.date }}</p>
+          <p style="width:60px">{{ item.date }}</p>
         </template>
         <template v-slot:item.team="{ item }">
           <p style="width:120px">{{ item.homeTeam }} VS {{ item.awayTeam }}</p>
@@ -26,8 +26,10 @@
         <template v-slot:item.actions="{ item }">
           <div style="width:45px"> <v-icon v-if="!item.shenhe" small color="green" @click="opendialog(item, 'approve')"
               style="padding-right: 20px;">mdi-check</v-icon>
-          <v-icon v-if="!item.shenhe" small color="red" @click="opendialog(item, 'reject')" style="padding-left: 20px;">mdi-close</v-icon>
-          <div v-if="item.shenhe" variant="text">已审核</div></div>
+            <v-icon v-if="!item.shenhe" small color="red" @click="opendialog(item, 'reject')"
+              style="padding-left: 20px;">mdi-close</v-icon>
+            <div v-if="item.shenhe" variant="text">已审核</div>
+          </div>
 
         </template>
       </v-data-table>
@@ -39,10 +41,11 @@
           <v-card-text>
             {{ cardtext }}
           </v-card-text>
-          <template v-slot:actions>
-            <v-btn class="ms-auto" variant="flat" color="indigo" text="确定" @click="confirmAction"></v-btn>
-            <v-btn class="ms-auto" variant="flat" color="indigo" text="取消" @click="dialog = false"></v-btn>
-          </template>
+          <v-card-actions>
+            <v-spacer></v-spacer>
+            <v-btn color="indigo" text="取消" @click="dialog = false"></v-btn>
+            <v-btn color="indigo" text="确定" @click="confirmAction"></v-btn>
+          </v-card-actions>
         </v-card>
       </v-dialog>
     </v-container>
@@ -52,13 +55,6 @@
 
 </template>
 
-<style>
-.table{
-  width: 60px;
-
-}
-</style>
-
 <script setup>
 import { ref } from 'vue';
 import { reactive } from 'vue';
@@ -154,7 +150,7 @@ function confirmAction() {
         console.log(error);
       })
   }
-  else if(actiontype.value === 'reject') {
+  else if (actiontype.value === 'reject') {
     verify.value = false;
     selectedMatch.value.shenhe = true;
     axios.post('/api/confirmGame', {

vuetify-project/src/components/space.vue

 <template>
   <div class="background" @click="dialog2 = true">
-    <img :src="pre_background_image" class="img1" alt="上传背景图">
+    <img v-if="pre_background_image" :src="pre_background_image" class="img1" alt="上传背景图">
+    <div v-if="!pre_background_image">点击头像处上传背景图</div>
     <!-- <v-overlay activator="parent" /> -->
   </div>
   <!-- <v-overlay activator=".img1" /> -->
@@ -12,7 +13,8 @@
         <template v-slot:activator="{ props }">
           <v-btn icon v-bind="props" class="float-left" size="80px">
             <v-avatar size="80px" style="border:3px solid white">
-              <img :src="pre_avatar_image" class="img2" alt="上传头像">
+              <img v-if="pre_avatar_image" :src="pre_avatar_image" class="img2" alt="上传头像">
+              <div v-if="!pre_avatar_image" class="alt-text">上传头像</div>
             </v-avatar>
           </v-btn>
         </template>
@@ -20,7 +22,8 @@
           <v-card-text>
             <div class="mx-auto text-center">
               <v-avatar size="50px">
-                <img :src="pre_avatar_image" class="img2" alt="上传头像">
+                <img v-if="pre_avatar_image" :src="pre_avatar_image" class="img2" alt="上传头像">
+                <div v-if="!pre_avatar_image" class="alt-text">上传头像</div>
               </v-avatar>
               <div class="text-h5 relative1">
                 {{ username }}
@@ -99,6 +102,7 @@
       </v-card-actions>
     </v-card>
   </v-dialog>
+  
   <v-dialog v-model="dialog2" width="auto">
     <v-card width="300px">
       <v-card-text>
@@ -300,4 +304,9 @@ function setBackground() {
   width: 10%;
   text-align: center;
 }
+
+.alt-text{
+  top:50%;
+  left:50%;
+}
 </style>
\ No newline at end of file