开票

@@ -39,11 +39,12 @@
         </div>
 
 
-        <div v-if="!countDown">
+        <div v-if="timeData>0">
           <!--        倒计时-->
+
           <p class="countDownTitle">
-            <span v-if="language==0">报名截止倒计时</span>
-            <span v-else>REGISTRATION COUNTDOWN</span>
+            <span v-if="language==0">售票倒计时</span>
+            <span v-else>TICKET COUNTDOWN</span>
           </p>
           <van-count-down :time="timeData" format="DD 天 HH 时 mm 分 ss 秒">
             <template #default="timeData">
@@ -109,10 +110,17 @@
               </div>
             </div>
           </div>
-          <!-- button -->
-          <div class="btn forPc" style="margin-left: 40px" @click="toSelectSeat()">
+
+          <div v-if="endTime<=0" class="btn forPc" style="margin-left: 40px;opacity: 0.5;cursor: not-allowed;"
+               @click="toSelectClosed">
+            {{
+              triggerLanguage(language, "售票结束", "Sale closed")
+            }}
+          </div>
+          <div v-else class="btn forPc" style="margin-left: 40px" @click="toSelectSeat()">
             {{ triggerLanguage(language, "添加观影人", "Add Moviegoers") }}
           </div>
+
         </div>
 
       </div>
@@ -148,8 +156,8 @@ const countDown = ref(false)
 const props = defineProps({
   activityId: [String, Number],
 });
-const timeData = ref({})
-const nowData = ref(dayjs().valueOf())
+const timeData = ref()
+const endTime = ref()
 const matchForm = ref({})
 const tickClass = ref([])
 const selectForm = ref({
@@ -166,8 +174,12 @@ getDetail()
 async function getDetail() {
   const res = await getTicketInfoByActivityId({activityId: activeId.value})
   matchForm.value = res.data
-  timeData.value = dayjs(res.data.ticketStart).valueOf()
-  if (timeData.value <= nowData.value) countDown.value = true
+  console.log(res)
+  const today = dayjs().format('YYYY-MM-DD HH:mm:ss')
+  timeData.value = dayjs(res.data.ticketStart).diff(today, 'millisecond')
+  endTime.value = dayjs(res.data.ticketEnd).diff(today, 'millisecond')
+  // if (timeData.value <= nowData.value) countDown.value = true
+  // timeData.value = dayjs('2024-08-10 00:00:00').diff(today, 'millisecond')
 }
 
 // 根据赛事ID获取票档
@@ -204,7 +216,6 @@ function selectTick(v) {
     selectForm.value.price = v.price
     selectForm.value.priceEn = v.priceEn
   }
-
 }
 
 function toSelectSeat() {
@@ -224,6 +235,13 @@ function toSelectSeat() {
   })
 }
 
+function toSelectClosed() {
+  ElMessageBox.confirm(language.value == 0 ? '售票结束' : 'Sale closed', language.value == 0 ? '提示' : 'Tips', {
+    confirmButtonText: language.value == 0 ? '确定' : 'OK',
+    cancelButtonText: language.value == 0 ? '取消' : 'Cancel',
+    type: 'warning'
+  })
+}
 </script>
 
 <style lang="scss" scoped>
@@ -256,6 +274,7 @@ function toSelectSeat() {
 
   .info {
     padding-top: 12px;
+    width: 100%;
 
     .title {
       font-weight: bold;
@@ -299,7 +318,7 @@ function toSelectSeat() {
       }
 
       .forbid {
-        opacity: 0.5;
+        opacity: 0.5 !important;
         cursor: not-allowed !important;
       }
 
@@ -456,7 +475,7 @@ function toSelectSeat() {
   position: relative;
   width: 100%;
   left: 0;
-  font-size: 35px;
+  font-size: 28px;
 }
 
 .countDownTitle span {
@@ -488,6 +507,8 @@ function toSelectSeat() {
 .colon {
   display: inline-block;
   font-size: 20px;
+  height: 110px;
+  line-height: 110px;
   margin: 0 8px;
   color: #7B7F83;
 }
@@ -495,9 +516,9 @@ function toSelectSeat() {
 .block {
   display: inline-block;
   opacity: 0.7;
-  width: 120px;
-  height: 120px;
-  line-height: 120px;
+  width: 100px;
+  height: 110px;
+  line-height: 110px;
   color: #fff;
   font-size: 35px;
   font-weight: bold;
@@ -506,4 +527,5 @@ function toSelectSeat() {
   background-size: 100% 100%;
   text-align: center;
 }
+
 </style>