票务

zhangmeng
Showing 2 changed files with 76 additions and 65 deletions
src/viewsPc/components/homeQuick.vue
src/viewsPc/components/orderRemark.vue
--- a/src/viewsPc/components/homeQuick.vue
View file @89201e1
+++ b/src/viewsPc/components/homeQuick.vue
View file @89201e1
 <template>
  <div v-if="language == 0" class="itemBox">
    <el-row :gutter="20">
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item" @click="popRemark(1)"><img src="@/assets/dance/btn01.png">酒店预订</div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item" @click="popRemark(2)"><img src="@/assets/dance/btn02.png">车辆预订</div>
      </el-col>
      <!--      <el-col :sm="12" :lg="8" :xs="12">-->
      <!--        <div class="item" @click="popRemark(3)"><img src="@/assets/dance/btn03.png">餐饮预订</div>-->
      <!--      </el-col>-->
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item" @click="popRemark(8)"><img src="@/assets/dance/btn08.png">旅游服务</div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item" @click="popRemark(0)"><img src="@/assets/dance/btn04.png">票务预订</div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item" @click="popRemark(4)"><img src="@/assets/dance/btn05.png">化妆预约</div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item" @click="popRemark(5)"><img src="@/assets/dance/btn06.png">拍照预约</div>
      </el-col>
    </el-row>
  </div>
  <div v-else class="itemBox_en">
    <el-row :gutter="20">
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item_en" @click="popRemark(1)"><img src="@/assets/dance/btn01.png">
          <p>HOTEL RESERVATION</p>
        </div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item_en" @click="popRemark(2)"><img src="@/assets/dance/btn02.png">
          <p>TRANSPORTATION RESERVATION</p>
        </div>
      </el-col>
-<!--      <el-col :sm="12" :lg="8" :xs="12">-->
+      <!--      <el-col :sm="12" :lg="8" :xs="12">-->
-<!--        <div class="item_en" @click="popRemark(3)"><img src="@/assets/dance/btn03.png">-->
+      <!--        <div class="item_en" @click="popRemark(3)"><img src="@/assets/dance/btn03.png">-->
-<!--          <p>DINING RESERVATION</p>-->
+      <!--          <p>DINING RESERVATION</p>-->
-<!--        </div>-->
+      <!--        </div>-->
-<!--      </el-col>-->
+      <!--      </el-col>-->
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item_en" @click="popRemark(8)"><img src="@/assets/dance/btn08.png">
          <p>TRAVEL SERVICE</p>
        </div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item_en" @click="popRemark(0)">
          <img src="@/assets/dance/btn04.png">
          <p>TICKET BOOKING</p>
        </div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item_en" @click="popRemark(4)"><img src="@/assets/dance/btn05.png">
          <p>MAKEUP APPOINTMENT</p>
        </div>
      </el-col>
-      <el-col :sm="12" :lg="8" :xs="12">
+      <el-col :lg="8" :sm="12" :xs="12">
        <div class="item_en" @click="popRemark(5)"><img src="@/assets/dance/btn06.png">
          <p>PHOTOGRAPHY APPOINTMENT</p>
        </div>
@@ -109,12 +109,11 @@ watch(matchId, (val) => {
 })
 onMounted(() => {
 })
 function building() {
  ElMessage.warning(language.value == 0 ? '感谢您对本次比赛的关注，该服务暂无可预订信息，敬请期待。' : 'Thank you for your attention to this competition. The service is currently unavailable for booking. Please stay tuned.')
-  return
 }
 function popRemark(type) {
@@ -123,12 +122,12 @@ function popRemark(type) {
    return
  }
  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') ||
-      (form.value.isMealView == 0 && type == '4') ||
+    (form.value.isMealView == 0 && type == '4') ||
-      (form.value.isPhotoView == 0 && type == '5') ||
+    (form.value.isPhotoView == 0 && type == '5') ||
-      (form.value.isTicket == 0 && type == '0') ||
+    (form.value.isTicket == 0 && type == '0') ||
-      (form.value.isScenicView == 0 && type == '8')
+    (form.value.isScenicView == 0 && type == '8')
  ) {
    building()
    return
@@ -180,14 +179,14 @@ function goBooking(n) {
 }
 </script>
-<style scoped lang="scss">
+<style lang="scss" scoped>
 .itemBox {
  padding: 20px 40px;
 }
 .itemBox_en {
  padding: 20px 40px;
  p {
    margin: 0;
    height: 40px;
@@ -206,7 +205,7 @@ function goBooking(n) {
  background: url("@/assets/dance/btn_bg.png") no-repeat left #FFFFFF;
  background-size: 100% 100%;
  border-radius: 15px;
  img {
    margin: 0 5%;
  }
@@ -227,20 +226,20 @@ function goBooking(n) {
  background-size: cover;
  position: relative;
  border-radius: 15px;
  img {
    position: absolute;
    top: -30px;
    transition: all 0.2s;
  }
  &:hover {
    box-shadow: 0 0 10px #333;
    img {
      transform: rotateY(180deg);
    }
    p {
      color: #000;
    }
@@ -248,9 +247,16 @@ function goBooking(n) {
 }
 @media screen and (max-width: 768px) {
-  .itemBox,.itemBox_en{padding: 0 20px 20px}
+  .itemBox, .itemBox_en {
-  .item{font-size: 16px;
+    padding: 0 20px 20px
-    img{width: 50px;height: 50px}
+  }
+  .item {
+    font-size: 16px;
+    img {
+      width: 50px;
+      height: 50px
+    }
  }
 }
 </style>
--- a/src/viewsPc/components/orderRemark.vue
View file @89201e1
+++ b/src/viewsPc/components/orderRemark.vue
View file @89201e1
 <template>
- <el-dialog :title="title"  v-model="show" width="400px" @close="close">
+  <el-dialog v-model="show" :title="title" destroy-on-close width="400px" @close="close">
-   <div>
+    <div>
-     <h2 class="text-warning text-center" v-if="cptName">{{cptName}}</h2>
+      <h2 v-if="cptName" class="text-warning text-center">{{ cptName }}</h2>
-     <div v-if="type==1" class="plr20" v-html="form.reserveDes"></div>
+      <div v-if="type==1" class="plr20" v-html="form.reserveDes" />
-     <div v-if="type==2" class="plr20" v-html="form.reserveDesCar"></div>
+      <div v-if="type==2" class="plr20" v-html="form.reserveDesCar" />
-     <div v-if="type==3" class="plr20" v-html="form.reserveDesFood"></div>
+      <div v-if="type==3" class="plr20" v-html="form.reserveDesFood" />
-     <div v-if="type==4" class="plr20" v-html="form.reserveDesMeal"></div>
+      <div v-if="type==4" class="plr20" v-html="form.reserveDesMeal" />
-     <div v-if="type==5" class="plr20" v-html="form.reserveDesPhoto"></div>
+      <div v-if="type==5" class="plr20" v-html="form.reserveDesPhoto" />
-     <div v-if="type==0" class="plr20" v-html="form.reserveDesTitck"></div>
+      <div v-if="type==0" class="plr20" v-html="form.reserveDesTitck" />
-     <div v-if="type==8" class="plr20" v-html="form.reserveDesTravel"></div>
+      <div v-if="type==8" class="plr20" v-html="form.reserveDesScenic" />
-   </div>
+    </div>
-       <template #footer>
+    <template #footer>
-         <div class="dialog-footer text-center">
+      <div class="dialog-footer text-center">
-           <el-button type="primary" class="btn-lineG w200px" round @click="ok">{{language==0?'确定':'Confirm'}}</el-button>
+        <el-button class="btn-lineG w200px" round type="primary" @click="ok">{{ language == 0 ? '确定' : 'Confirm' }}
-         </div>
+        </el-button>
-       </template>
+      </div>
- </el-dialog>
+    </template>
+  </el-dialog>
 </template>
 <script setup>
-import {getBaseInfoByActiveId} from "@/apiPc/booking";
+import { getBaseInfoByActiveId } from '@/apiPc/booking'
-import {getCurrentInstance} from "@vue/runtime-core";
+import { getCurrentInstance } from '@vue/runtime-core'
-import {useStorage} from "@vueuse/core/index";
+import { useStorage } from '@vueuse/core/index'
-const emit = defineEmits([ 'submit'])
-const {proxy} = getCurrentInstance()
+const emit = defineEmits(['submit'])
-const language= useStorage('language',0)
+const { proxy } = getCurrentInstance()
-import useUserStore from "@/store/modules/user";
+const language = useStorage('language', 0)
+import useUserStore from '@/store/modules/user'
 const user = useUserStore().user
 const title = ref('')
 const cptName = ref('')
@@ -48,28 +51,30 @@ defineExpose({
 function getData() {
  console.log(matchId)
-  getBaseInfoByActiveId(matchId).then(res=>{
+  getBaseInfoByActiveId(matchId).then(res => {
    form.value = res.data || {}
    console.log(form.value)
-  }).catch(err=>{
+  }).catch(err => {
    console.log(err)
  })
 }
 function close() {
  show.value = false
 }
 function ok() {
  // type
  show.value = false
  // if(!user){
  //   useUserStore().setVisitor()
  // } else {
-    emit('submit', type)
+  emit('submit', type)
  // }
 }
 </script>
-<style scoped lang="scss">
+<style lang="scss" scoped>
 </style>