大师课
Showing
3 changed files
with
63 additions
and
37 deletions
src/assets/images/schedule.png
0 → 100644
56.5 KB
| ... | @@ -7,9 +7,9 @@ | ... | @@ -7,9 +7,9 @@ |
| 7 | > | 7 | > |
| 8 | <div class="boxInvitation pd20"> | 8 | <div class="boxInvitation pd20"> |
| 9 | <el-steps :active="activeStep" align-center class="mb20"> | 9 | <el-steps :active="activeStep" align-center class="mb20"> |
| 10 | <el-step :title="language==0?'报名须知':'Notice'" /> | 10 | <el-step :title="language==0?'报名须知':'Notice'"/> |
| 11 | <el-step :title="language==0?'填写信息':'Information'" /> | 11 | <el-step :title="language==0?'填写信息':'Information'"/> |
| 12 | <el-step :title="language==0?'选择课程':'Courses'" /> | 12 | <el-step :title="language==0?'选择课程':'Courses'"/> |
| 13 | </el-steps> | 13 | </el-steps> |
| 14 | <div v-if="activeStep==0"> | 14 | <div v-if="activeStep==0"> |
| 15 | <div class="mb60 xzRich" style="max-height: 50vh;overflow: auto"> | 15 | <div class="mb60 xzRich" style="max-height: 50vh;overflow: auto"> |
| ... | @@ -26,12 +26,20 @@ | ... | @@ -26,12 +26,20 @@ |
| 26 | <!-- The age limit for Youth Session: Born between 1st Jan, 2006 and 31st Dec., 2009.<br/>--> | 26 | <!-- The age limit for Youth Session: Born between 1st Jan, 2006 and 31st Dec., 2009.<br/>--> |
| 27 | <!-- The age limit for Juvenile Session: Born after 1 Jan., 2010.<br/>--> | 27 | <!-- The age limit for Juvenile Session: Born after 1 Jan., 2010.<br/>--> |
| 28 | Training Camp Venue:Nanjing International Exhibition and Convention Center<br> | 28 | Training Camp Venue:Nanjing International Exhibition and Convention Center<br> |
| 29 | Address:No. 300 Jiangdong Zhong Road, Jianye District, Nanjing City, Jiangsu Province. Nanjing International Exhibition and Conference Center, Room 302, 303, 402, 403.<br> | 29 | Address:No. 300 Jiangdong Zhong Road, Jianye District, Nanjing City, Jiangsu Province. Nanjing International |
| 30 | Exhibition and Conference Center, Room 302, 303, 402, 403.<br> | ||
| 30 | Schooltime:July 13th - July 14th, 2026.<br> | 31 | Schooltime:July 13th - July 14th, 2026.<br> |
| 31 | Check-in:July 12, 2026 13:30 - 17:0.<br> | 32 | Check-in:July 12, 2026 13:30 - 17:0.<br> |
| 32 | Contact Person:Mr.Zhu<br> | 33 | Contact Person:Mr.Zhu<br> |
| 33 | Tel:+86 010-67183764<br> | 34 | Tel:+86 010-67183764<br> |
| 34 | Registration Deadline:<span style="text-decoration: underline">2026-07-10</span><br> | 35 | Registration Deadline:<span style="text-decoration: underline">2026-07-10</span><br> |
| 36 | |||
| 37 | <div> | ||
| 38 | <el-image | ||
| 39 | src="@/assets/images/schedule.png" | ||
| 40 | :preview-src-list="['@/assets/images/schedule.png']" | ||
| 41 | show-progress/> | ||
| 42 | </div> | ||
| 35 | </div> | 43 | </div> |
| 36 | </div> | 44 | </div> |
| 37 | <div v-loading="loading" class="text-center"> | 45 | <div v-loading="loading" class="text-center"> |
| ... | @@ -52,7 +60,7 @@ | ... | @@ -52,7 +60,7 @@ |
| 52 | label-position="right" | 60 | label-position="right" |
| 53 | > | 61 | > |
| 54 | <el-form-item :label="language==0?'姓名':'Name'" prop="name" required> | 62 | <el-form-item :label="language==0?'姓名':'Name'" prop="name" required> |
| 55 | <el-input v-model="form.name" /> | 63 | <el-input v-model="form.name"/> |
| 56 | </el-form-item> | 64 | </el-form-item> |
| 57 | <el-form-item :label="language==0?'性别':'Gender'" prop="gender" required> | 65 | <el-form-item :label="language==0?'性别':'Gender'" prop="gender" required> |
| 58 | <el-radio-group v-model="form.gender"> | 66 | <el-radio-group v-model="form.gender"> |
| ... | @@ -76,13 +84,13 @@ | ... | @@ -76,13 +84,13 @@ |
| 76 | /> | 84 | /> |
| 77 | </el-form-item> | 85 | </el-form-item> |
| 78 | <el-form-item :label="language==0?'手机号':'Phone number'" prop="phone" required> | 86 | <el-form-item :label="language==0?'手机号':'Phone number'" prop="phone" required> |
| 79 | <el-input v-model="form.phone" /> | 87 | <el-input v-model="form.phone"/> |
| 80 | </el-form-item> | 88 | </el-form-item> |
| 81 | <el-form-item :label="language==0?'邮箱':'Email'" prop="email" required> | 89 | <el-form-item :label="language==0?'邮箱':'Email'" prop="email" required> |
| 82 | <el-input v-model="form.email" type="email" /> | 90 | <el-input v-model="form.email" type="email"/> |
| 83 | </el-form-item> | 91 | </el-form-item> |
| 84 | <el-form-item :label="language==0?'证件号':'National license No.'" prop="passportNo" required> | 92 | <el-form-item :label="language==0?'证件号':'National license No.'" prop="passportNo" required> |
| 85 | <el-input v-model="form.passportNo" @blur="checkCard" /> | 93 | <el-input v-model="form.passportNo" @blur="checkCard"/> |
| 86 | </el-form-item> | 94 | </el-form-item> |
| 87 | <el-form-item :label="language==0?'有效证件':'Passport Copy'" prop="passportCopy" required> | 95 | <el-form-item :label="language==0?'有效证件':'Passport Copy'" prop="passportCopy" required> |
| 88 | <image-upload | 96 | <image-upload |
| ... | @@ -105,7 +113,7 @@ | ... | @@ -105,7 +113,7 @@ |
| 105 | <!-- />--> | 113 | <!-- />--> |
| 106 | <!-- </el-form-item>--> | 114 | <!-- </el-form-item>--> |
| 107 | <el-form-item :label="language==0?'备注':'Remark '"> | 115 | <el-form-item :label="language==0?'备注':'Remark '"> |
| 108 | <el-input v-model="form.remark" rows="3" type="textarea" /> | 116 | <el-input v-model="form.remark" rows="3" type="textarea"/> |
| 109 | </el-form-item> | 117 | </el-form-item> |
| 110 | 118 | ||
| 111 | <div class="text-center"> | 119 | <div class="text-center"> |
| ... | @@ -138,7 +146,8 @@ | ... | @@ -138,7 +146,8 @@ |
| 138 | <el-checkbox-group v-model="form.courseId" size="large" @change="courseChange"> | 146 | <el-checkbox-group v-model="form.courseId" size="large" @change="courseChange"> |
| 139 | <div v-for="c in courseList" class="mb20"> | 147 | <div v-for="c in courseList" class="mb20"> |
| 140 | <el-checkbox | 148 | <el-checkbox |
| 141 | :disabled="(form.courseId?.length>=2&&form.courseId.indexOf(c.id)==-1)||disChoose||(form.nationality==240&&c.viewStateCn == 0)||(form.nationality!=240&&c.viewStateEn == 0)" :value="c.id" border | 149 | :disabled="(form.courseId?.length>=2&&form.courseId.indexOf(c.id)==-1)||disChoose||(form.nationality==240&&c.viewStateCn == 0)||(form.nationality!=240&&c.viewStateEn == 0)" |
| 150 | :value="c.id" border | ||
| 142 | class="w100" | 151 | class="w100" |
| 143 | > | 152 | > |
| 144 | <div v-if="language==0" style="display: flex"> | 153 | <div v-if="language==0" style="display: flex"> |
| ... | @@ -184,16 +193,16 @@ | ... | @@ -184,16 +193,16 @@ |
| 184 | </template> | 193 | </template> |
| 185 | 194 | ||
| 186 | <script setup> | 195 | <script setup> |
| 187 | import { useStorage } from '@vueuse/core/index' | 196 | import {useStorage} from '@vueuse/core/index' |
| 188 | import { getCurrentInstance, watch ,onMounted,ref} from 'vue' | 197 | import {getCurrentInstance, watch, onMounted, ref} from 'vue' |
| 189 | import { nextTick } from '@vue/runtime-core' | 198 | import {nextTick} from '@vue/runtime-core' |
| 190 | import { ElMessage, ElMessageBox } from 'element-plus' | 199 | import {ElMessage, ElMessageBox} from 'element-plus' |
| 191 | import { addInvitation, countryList } from '@/apiPc/match' | 200 | import {addInvitation, countryList} from '@/apiPc/match' |
| 192 | import ImageUpload from '@/components/ImageUpload' | 201 | import ImageUpload from '@/components/ImageUpload' |
| 193 | import { masterClassList, getByCard, submitMasterApply, getMasterApply, delByCard } from '@/apiPc/common' | 202 | import {masterClassList, getByCard, submitMasterApply, getMasterApply, delByCard} from '@/apiPc/common' |
| 194 | import dayjs from 'dayjs' | 203 | import dayjs from 'dayjs' |
| 195 | 204 | ||
| 196 | const { proxy } = getCurrentInstance() | 205 | const {proxy} = getCurrentInstance() |
| 197 | const language = useStorage('language', 0) | 206 | const language = useStorage('language', 0) |
| 198 | const form = ref({}) | 207 | const form = ref({}) |
| 199 | const show = ref(false) | 208 | const show = ref(false) |
| ... | @@ -208,24 +217,24 @@ const cptId = ref('') | ... | @@ -208,24 +217,24 @@ const cptId = ref('') |
| 208 | const isMobile = ref(false) | 217 | const isMobile = ref(false) |
| 209 | const rules = ref( | 218 | const rules = ref( |
| 210 | { | 219 | { |
| 211 | nationality: [{ required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose' }], | 220 | nationality: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'}], |
| 212 | name: [{ required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter' }], | 221 | name: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'}], |
| 213 | phone: [{ required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter' }], | 222 | phone: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'}], |
| 214 | gender: [{ required: true, trigger: 'blur', message: language.value == 0 ? '请选择' : 'Please choose' }], | 223 | gender: [{required: true, trigger: 'blur', message: language.value == 0 ? '请选择' : 'Please choose'}], |
| 215 | email: [{ required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter' }], | 224 | email: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'}], |
| 216 | birth: [{ required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose' }], | 225 | birth: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'}], |
| 217 | passportNo: [{ required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter' }], | 226 | passportNo: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'}], |
| 218 | passportCopy: [{ required: true, trigger: 'blur', message: language.value == 0 ? '请上传' : 'Please Upload' }], | 227 | passportCopy: [{required: true, trigger: 'blur', message: language.value == 0 ? '请上传' : 'Please Upload'}], |
| 219 | arrival: [{ required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose' }], | 228 | arrival: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'}], |
| 220 | departure: [{ required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose' }] | 229 | departure: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'}] |
| 221 | }) | 230 | }) |
| 222 | const open = (params) => { | 231 | const open = (params) => { |
| 223 | console.log(params) | 232 | console.log(params) |
| 224 | show.value = true | 233 | show.value = true |
| 225 | title.value = language.value == 0 ? '2026年亚洲青少年体育舞蹈公益课' : '2026 Asian Youth Sports Dance Charity Class' | 234 | title.value = language.value == 0 ? '2026年亚洲青少年体育舞蹈公益课' : '2026 Asian Youth Sports Dance Charity Class' |
| 226 | cptId.value = params.cptId | 235 | cptId.value = params.cptId |
| 227 | form.value={ | 236 | form.value = { |
| 228 | gender:'0' | 237 | gender: '0' |
| 229 | } | 238 | } |
| 230 | getCourse() | 239 | getCourse() |
| 231 | } | 240 | } |
| ... | @@ -236,7 +245,7 @@ onMounted(() => { | ... | @@ -236,7 +245,7 @@ onMounted(() => { |
| 236 | checkMobile() | 245 | checkMobile() |
| 237 | window.addEventListener('resize', checkMobile) | 246 | window.addEventListener('resize', checkMobile) |
| 238 | }) | 247 | }) |
| 239 | defineExpose({ open }) | 248 | defineExpose({open}) |
| 240 | // watch(show, (value) => { | 249 | // watch(show, (value) => { |
| 241 | // if (!value) { | 250 | // if (!value) { |
| 242 | // form.value = { | 251 | // form.value = { |
| ... | @@ -254,7 +263,7 @@ defineExpose({ open }) | ... | @@ -254,7 +263,7 @@ defineExpose({ open }) |
| 254 | function getCourse() { | 263 | function getCourse() { |
| 255 | // '1777256058082189313' | 264 | // '1777256058082189313' |
| 256 | loading.value = true | 265 | loading.value = true |
| 257 | masterClassList({ cptId: cptId.value }).then(res => { | 266 | masterClassList({cptId: cptId.value}).then(res => { |
| 258 | courseList.value = res.data | 267 | courseList.value = res.data |
| 259 | loading.value = false | 268 | loading.value = false |
| 260 | }) | 269 | }) |
| ... | @@ -268,7 +277,7 @@ function setActive(n) { | ... | @@ -268,7 +277,7 @@ function setActive(n) { |
| 268 | activeStep.value = n | 277 | activeStep.value = n |
| 269 | // 在移动设备上,切换步骤时滚动到顶部 | 278 | // 在移动设备上,切换步骤时滚动到顶部 |
| 270 | if (isMobile.value) { | 279 | if (isMobile.value) { |
| 271 | window.scrollTo({ top: 0, behavior: 'smooth' }) | 280 | window.scrollTo({top: 0, behavior: 'smooth'}) |
| 272 | } | 281 | } |
| 273 | } | 282 | } |
| 274 | 283 | ||
| ... | @@ -277,7 +286,7 @@ function courseChange(e) { | ... | @@ -277,7 +286,7 @@ function courseChange(e) { |
| 277 | } | 286 | } |
| 278 | 287 | ||
| 279 | function checkApplyCourse(n) { | 288 | function checkApplyCourse(n) { |
| 280 | getMasterApply({ card: form.value.passportNo }).then(res => { | 289 | getMasterApply({card: form.value.passportNo}).then(res => { |
| 281 | if (res.data?.length > 0) { | 290 | if (res.data?.length > 0) { |
| 282 | form.value.courseId = [] | 291 | form.value.courseId = [] |
| 283 | for (var n of res.data) { | 292 | for (var n of res.data) { |
| ... | @@ -324,7 +333,7 @@ function to2() { | ... | @@ -324,7 +333,7 @@ function to2() { |
| 324 | 333 | ||
| 325 | 334 | ||
| 326 | function checkCard() { | 335 | function checkCard() { |
| 327 | getByCard({ card: form.value.passportNo }).then(res => { | 336 | getByCard({card: form.value.passportNo}).then(res => { |
| 328 | if (res.data) { | 337 | if (res.data) { |
| 329 | form.value = res.data | 338 | form.value = res.data |
| 330 | } else { | 339 | } else { | ... | ... |
| ... | @@ -47,7 +47,7 @@ | ... | @@ -47,7 +47,7 @@ |
| 47 | <!-- 赛事直播--> | 47 | <!-- 赛事直播--> |
| 48 | Live Qrcode | 48 | Live Qrcode |
| 49 | </a> | 49 | </a> |
| 50 | <a class=" btn2" @click.stop="popMaster">Junior &Youth Camp REGISTER | 50 | <a class=" btn2" @click.stop="popMaster">2026 Asia Training Camp |
| 51 | </a> | 51 | </a> |
| 52 | </div> | 52 | </div> |
| 53 | </div> | 53 | </div> |
| ... | @@ -101,7 +101,7 @@ | ... | @@ -101,7 +101,7 @@ |
| 101 | <a class=" btn2-phone" style="z-index: 999999" @click.stop="liveQrcodeShowBtn"> | 101 | <a class=" btn2-phone" style="z-index: 999999" @click.stop="liveQrcodeShowBtn"> |
| 102 | Live Qrcode | 102 | Live Qrcode |
| 103 | </a> | 103 | </a> |
| 104 | <a class=" btn2-phone" @click.stop="popMaster">Junior &Youth Camp REGISTER | 104 | <a class=" btn2-phone" @click.stop="popMaster">2026 Asia Training Camp |
| 105 | </a> | 105 | </a> |
| 106 | </div> | 106 | </div> |
| 107 | </div> | 107 | </div> |
| ... | @@ -129,7 +129,7 @@ | ... | @@ -129,7 +129,7 @@ |
| 129 | v-if="matchData.isCourseView==1" class="zn-btn ml20 btn-q forPc" | 129 | v-if="matchData.isCourseView==1" class="zn-btn ml20 btn-q forPc" |
| 130 | style="font-size: 15px;margin-right: 20px" @click="popMaster" | 130 | style="font-size: 15px;margin-right: 20px" @click="popMaster" |
| 131 | > | 131 | > |
| 132 | Junior &Youth Camp REGISTER | 132 | 2026 Asia Training Camp |
| 133 | <el-icon> | 133 | <el-icon> |
| 134 | <Edit /> | 134 | <Edit /> |
| 135 | </el-icon> | 135 | </el-icon> |
| ... | @@ -1454,6 +1454,21 @@ function applyInvitation() { | ... | @@ -1454,6 +1454,21 @@ function applyInvitation() { |
| 1454 | } | 1454 | } |
| 1455 | 1455 | ||
| 1456 | 1456 | ||
| 1457 | .btn2-phone { | ||
| 1458 | cursor: pointer; | ||
| 1459 | padding: 10px 20px; | ||
| 1460 | font-size: 14px; | ||
| 1461 | align-items: center; | ||
| 1462 | overflow: hidden; | ||
| 1463 | background: url(/src/assets/dance/time_bg.png) no-repeat center; | ||
| 1464 | background-size: 100% 100%; | ||
| 1465 | border-radius: 20px; | ||
| 1466 | display: flex; | ||
| 1467 | flex-wrap: nowrap; | ||
| 1468 | color: #fff; | ||
| 1469 | } | ||
| 1470 | |||
| 1471 | |||
| 1457 | @media (max-width: 767px) { | 1472 | @media (max-width: 767px) { |
| 1458 | .yaoQing { | 1473 | .yaoQing { |
| 1459 | img { | 1474 | img { |
| ... | @@ -1475,4 +1490,6 @@ function applyInvitation() { | ... | @@ -1475,4 +1490,6 @@ function applyInvitation() { |
| 1475 | } | 1490 | } |
| 1476 | } | 1491 | } |
| 1477 | } | 1492 | } |
| 1493 | |||
| 1494 | |||
| 1478 | </style> | 1495 | </style> | ... | ... |
-
Please register or sign in to post a comment