版本优化

@@ -174,7 +174,7 @@ import * as booking from '@/apiPc/booking'
 import { useRouter, useRoute } from 'vue-router'
 import { useRouter, useRoute } from 'vue-router'
 import { useStorage } from '@vueuse/core/index'
 import { useStorage } from '@vueuse/core/index'
 import useUserStore from '@/store/modules/user'
 import useUserStore from '@/store/modules/user'
-import { getVehicleByCheckIn } from '@/apiPc/booking'
+import { getBaseInfoByActiveId, getVehicleByCheckIn } from '@/apiPc/booking'
 import { computed } from 'vue'
 import { computed } from 'vue'
 
 
 const useStore = useUserStore()
 const useStore = useUserStore()
@@ -211,6 +211,7 @@ onMounted(() => {
   getVehicleMap()
   getVehicleMap()
 })
 })
 
 
+
 function getList() {
 function getList() {
   // if (language.value!=0)return
   // if (language.value!=0)return
   loading.value = true
   loading.value = true
@@ -253,6 +254,11 @@ async function handleSubmit(v) {
     return
     return
   }
   }
   
   
+  const { data } = await booking.getBaseInfoByActiveId(route.params.cptId)
+  if (data.isCarView == 0) {
+    return proxy.$modal.confirm(language.value == 0 ? '感谢您对本次比赛的关注，该服务暂无可预订信息，敬请期待。' : 'Thank you for your attention to this competition. The service is currently unavailable for booking. Please stay tuned.')
+  }
+  
   let checkOut = {}
   let checkOut = {}
   let obj = {}
   let obj = {}
   if (v == 0) {
   if (v == 0) {

@@ -132,6 +132,7 @@ import { getBaseInfoByActiveId, submitOrderCar, vehicleConfigList } from '@/apiP
 import dayjs from 'dayjs'
 import dayjs from 'dayjs'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import useUserStore from '@/store/modules/user'
 import useUserStore from '@/store/modules/user'
+import * as booking from '/@/apiPc/booking'
 
 
 const { proxy } = getCurrentInstance()
 const { proxy } = getCurrentInstance()
 const payLoading = ref(false)
 const payLoading = ref(false)
@@ -240,6 +241,11 @@ function disabledDate(date) {
 }
 }
 
 
 async function submit() {
 async function submit() {
+  const { data } = await booking.getBaseInfoByActiveId(route.params.cptId)
+  if (data.isCarView == 0) {
+    return proxy.$modal.confirm(language.value == 0 ? '感谢您对本次比赛的关注，该服务暂无可预订信息，敬请期待。' : 'Thank you for your attention to this competition. The service is currently unavailable for booking. Please stay tuned.')
+  }
+  
   await proxy.$refs['formRef'].validate()
   await proxy.$refs['formRef'].validate()
   if (!user) {
   if (!user) {
     useUserStore().setReLogin()
     useUserStore().setReLogin()

 <template>
 <template>
   <div v-if="language == 0" class="itemBox">
   <div v-if="language == 0" class="itemBox">
-    <el-row :gutter="20">
+    <el-row v-loading="loading" :gutter="20">
       <el-col :lg="8" :sm="12" :xs="12">
       <el-col :lg="8" :sm="12" :xs="12">
         <div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn01.png">酒店预订</div>
         <div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn01.png">酒店预订</div>
       </el-col>
       </el-col>
@@ -78,7 +78,7 @@ const { proxy } = getCurrentInstance()
 import { useStorage } from '@vueuse/core/index'
 import { useStorage } from '@vueuse/core/index'
 import { ElMessage } from 'element-plus'
 import { ElMessage } from 'element-plus'
 import { getCurrentInstance } from '@vue/runtime-core'
 import { getCurrentInstance } from '@vue/runtime-core'
-import { computed, onMounted, watch } from 'vue'
+import { computed, onMounted, watch, ref } from 'vue'
 import { getBaseInfoByActiveId } from '@/apiPc/booking'
 import { getBaseInfoByActiveId } from '@/apiPc/booking'
 
 
 const props = defineProps({
 const props = defineProps({
@@ -96,12 +96,15 @@ const props = defineProps({
 const language = useStorage('language', 0)
 const language = useStorage('language', 0)
 const form = ref({})
 const form = ref({})
 const matchId = computed(() => props.matchId)
 const matchId = computed(() => props.matchId)
-
+const loading = ref(true)
 watch(matchId, (val) => {
 watch(matchId, (val) => {
   if (val && val != '0') {
   if (val && val != '0') {
+    loading.value = true
     getBaseInfoByActiveId(props.matchId).then(res => {
     getBaseInfoByActiveId(props.matchId).then(res => {
+      loading.value = false
       form.value = res.data || null
       form.value = res.data || null
     }).catch(err => {
     }).catch(err => {
+      loading.value = false
       console.log(err)
       console.log(err)
       form.value = null
       form.value = null
     })
     })
@@ -109,7 +112,7 @@ watch(matchId, (val) => {
 })
 })
 
 
 onMounted(() => {
 onMounted(() => {
-
+  
 })
 })
 
 
 function building() {
 function building() {
@@ -186,7 +189,7 @@ function goBooking(n) {
 
 
 .itemBox_en {
 .itemBox_en {
   padding: 20px 40px;
   padding: 20px 40px;
-
+  
   p {
   p {
     margin: 0;
     margin: 0;
     height: 40px;
     height: 40px;
@@ -205,7 +208,7 @@ function goBooking(n) {
   background: url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF;
   background: url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF;
   background-size: 100% 100%;
   background-size: 100% 100%;
   border-radius: 15px;
   border-radius: 15px;
-
+  
   img {
   img {
     margin: 0 5%;
     margin: 0 5%;
   }
   }
@@ -226,20 +229,20 @@ function goBooking(n) {
   background-size: cover;
   background-size: cover;
   position: relative;
   position: relative;
   border-radius: 15px;
   border-radius: 15px;
-
+  
   img {
   img {
     position: absolute;
     position: absolute;
     top: -30px;
     top: -30px;
     transition: all 0.2s;
     transition: all 0.2s;
   }
   }
-
+  
   &:hover {
   &:hover {
     box-shadow: 0 0 10px #333;
     box-shadow: 0 0 10px #333;
-
+    
     img {
     img {
       transform: rotateY(180deg);
       transform: rotateY(180deg);
     }
     }
-
+    
     p {
     p {
       color: #000;
       color: #000;
     }
     }
@@ -252,7 +255,7 @@ function goBooking(n) {
   }
   }
   .item {
   .item {
     font-size: 16px;
     font-size: 16px;
-
+    
     img {
     img {
       width: 50px;
       width: 50px;
       height: 50px
       height: 50px

 <template>
 <template>
-  <div style="filter: opacity(1)">
-    <el-row v-if="language==0" class="btnbox" justify="space-between" :gutter="15">
+  <div v-loading="loading" style="filter: opacity(1)">
+    <el-row v-if="language==0" :gutter="15" class="btnbox" justify="space-between">
       <el-col :lg="3" :md="6" :sm="12" :xs="12">
       <el-col :lg="3" :md="6" :sm="12" :xs="12">
         <div class="funcBtn" @click="popRemark(0)">
         <div class="funcBtn" @click="popRemark(0)">
           <img src="@/assets/dance/btn04.png">
           <img src="@/assets/dance/btn04.png">
@@ -50,9 +50,9 @@
         </div>
         </div>
       </el-col>
       </el-col>
     </el-row>
     </el-row>
-
-
-    <el-row v-else class="btnbox enBtnbox" justify="space-between" :gutter="15">
+    
+    
+    <el-row v-else :gutter="15" class="btnbox enBtnbox" justify="space-between">
       <el-col :lg="3" :md="8" :sm="12" :xs="12">
       <el-col :lg="3" :md="8" :sm="12" :xs="12">
         <div class="funcBtn" @click="popRemark(0)">
         <div class="funcBtn" @click="popRemark(0)">
           <img src="@/assets/dance/btn04.png">
           <img src="@/assets/dance/btn04.png">
@@ -104,7 +104,7 @@
     </el-row>
     </el-row>
   </div>
   </div>
   <order-remark ref="orderRemarkRef" @submit="goBooking" />
   <order-remark ref="orderRemarkRef" @submit="goBooking" />
-
+  
   <!--  <div class="fixedKP" @click="addInvoice">-->
   <!--  <div class="fixedKP" @click="addInvoice">-->
   <!--    <img src="@/assets/img/kp.svg"/>-->
   <!--    <img src="@/assets/img/kp.svg"/>-->
   <!--    开票-->
   <!--    开票-->
@@ -117,7 +117,7 @@ import { useRouter } from 'vue-router'
 import { useStorage } from '@vueuse/core/index'
 import { useStorage } from '@vueuse/core/index'
 import OrderRemark from '@/viewsPc/components/orderRemark'
 import OrderRemark from '@/viewsPc/components/orderRemark'
 import { getBaseInfoByActiveId } from '@/apiPc/booking'
 import { getBaseInfoByActiveId } from '@/apiPc/booking'
-import { getCurrentInstance } from '@vue/runtime-core'
+import { getCurrentInstance, ref } from '@vue/runtime-core'
 import { onMounted } from 'vue'
 import { onMounted } from 'vue'
 
 
 const { proxy } = getCurrentInstance()
 const { proxy } = getCurrentInstance()
@@ -136,12 +136,16 @@ const props = defineProps({
     default: ''
     default: ''
   }
   }
 })
 })
+const loading = ref(true)
 const form = ref()
 const form = ref()
 onMounted(() => {
 onMounted(() => {
+  loading.value = true
   getBaseInfoByActiveId(props.matchId).then(res => {
   getBaseInfoByActiveId(props.matchId).then(res => {
     form.value = res.data || null
     form.value = res.data || null
+    loading.value = false
   }).catch(err => {
   }).catch(err => {
     form.value = null
     form.value = null
+    loading.value = false
     console.log(err)
     console.log(err)
   })
   })
 })
 })
@@ -163,7 +167,7 @@ function popRemark(type) {
     building()
     building()
     return
     return
   }
   }
-
+  
   if ((form.value.isJdView == 0 && type == '1') ||
   if ((form.value.isJdView == 0 && type == '1') ||
     (form.value.isCarView == 0 && type == '2') ||
     (form.value.isCarView == 0 && type == '2') ||
     (form.value.isFoodView == 0 && type == '3') ||
     (form.value.isFoodView == 0 && type == '3') ||
@@ -175,7 +179,7 @@ function popRemark(type) {
     building()
     building()
     return
     return
   }
   }
-
+  
   const params = {
   const params = {
     matchId: props.matchId,
     matchId: props.matchId,
     title: language.value == 0 ? '预订说明' : 'Booking Instructions',
     title: language.value == 0 ? '预订说明' : 'Booking Instructions',
@@ -253,31 +257,44 @@ h4 {
   width: 60px;
   width: 60px;
   height: 60px;
   height: 60px;
   text-align: center;
   text-align: center;
-
+  
   img {
   img {
     width: 26px;
     width: 26px;
     height: 26px;
     height: 26px;
     display: block;
     display: block;
     margin: 10px auto 0px;
     margin: 10px auto 0px;
   }
   }
-
+  
   font-size: 13px;
   font-size: 13px;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
 }
 }
 
 
-.enBtnbox{
-  .funcBtn{
-    h4{font-size:16px;display: flex;align-items: center;width: 100%;justify-content: center;height: 36px;}
+.enBtnbox {
+  .funcBtn {
+    h4 {
+      font-size: 16px;
+      display: flex;
+      align-items: center;
+      width: 100%;
+      justify-content: center;
+      height: 36px;
+    }
   }
   }
 }
 }
+
 @media screen and (max-width: 1400px) {
 @media screen and (max-width: 1400px) {
-  .enBtnbox .funcBtn{
-    h4{font-size:14px;}
+  .enBtnbox .funcBtn {
+    h4 {
+      font-size: 14px;
+    }
   }
   }
 }
 }
+
 @media screen and (max-width: 1250px) {
 @media screen and (max-width: 1250px) {
-  .enBtnbox .funcBtn{
-    h4{font-size:12px;}
+  .enBtnbox .funcBtn {
+    h4 {
+      font-size: 12px;
+    }
   }
   }
 }
 }
 </style>
 </style>