Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
d9e0d64e by zhangmeng
Options

接机

1 parent e39c62c3
Inline Side-by-side
Showing 5 changed files with 500 additions and 4 deletions
src/apiPc/common.js
......@@ -105,5 +105,14 @@ export function delByCard(card) {
method: 'delete'
})
}
export function addPickup(data) {
return request({
url: `/league/pickup`,
method: 'post',
data
})
}
......
src/viewsPc/components/pickup.vue 0 → 100644
<template>
<el-dialog
v-model="show" :close-on-click-modal="false" :title="title" append-to-body center class="pcloginpop"
close-icon="CircleClose" destroy-on-close
width="800px"
>
<div class="boxInvitation pd20" >
<div v-if="!showR" >
<el-form ref="iformRef" :label-width="language==0?'120px':'240px'" :model="form" :rules="rules"
label-position="right">
<el-form-item :label="language==0?'服务类型':'Service Type (Pick-Up/Drop-Off)'" prop="type" required>
<el-checkbox-group v-model="form.type">
<el-checkbox label="1">{{ language == 0 ? '接机' : 'airport pickup' }}</el-checkbox>
<el-checkbox label="2">{{ language == 0 ? '送机' : 'airport drop-off' }}</el-checkbox>
</el-checkbox-group>
</el-form-item>
<div v-if="form.type?.some(v=>v==1)">
<h3 style="text-align: center">{{ language == 0 ? '接机' : 'airport pickup' }}</h3>
<el-form-item :label="language==0?'抵达人员身份':'Role of Person-Arrival'" prop="pickUpBo.standing" required>
<el-checkbox-group v-model="form.pickUpBo.standing">
<el-checkbox :label="language==0?'运动员':'Athlete'" name="1"/>
<el-checkbox :label="language==0?'随队人员':'Accompanying Person'" name="2"/>
<el-checkbox :label="language==0?'官员':'Official'" name="3"/>
<el-checkbox :label="language==0?'其他':'Others'" name="4"/>
</el-checkbox-group>
</el-form-item>
<el-form-item :label="language==0?'国家/地区':'Country/Region'" prop="pickUpBo.nationalitys" required>
<el-select v-model="form.pickUpBo.nationalitys" filterable multiple style="width: 100%;">
<el-option v-for="item in countrys"
:key="item.id"
:label="language==0?item.name:item.enName"
:value="language==0?item.name :item.enName"/>
</el-select>
</el-form-item>
<el-form-item :label="language==0?'联系人':'Contact Person'" prop="pickUpBo.name" required>
<el-input v-model="form.pickUpBo.name"/>
</el-form-item>
<el-form-item :label="language==0?'联系电话':'Contact Phone Number'" prop="pickUpBo.phone" required>
<el-input v-model="form.pickUpBo.phone"/>
</el-form-item>
<el-form-item :label="language==0?'人数':'Number of People'" prop="pickUpBo.counts" required>
<el-input-number v-model="form.pickUpBo.counts"/>
</el-form-item>
<el-form-item :label="language==0?'抵达日期':'Flight/Train Arrival Date'" prop="pickUpBo.arrivalDate"
required>
<el-date-picker
v-model="form.pickUpBo.arrivalDate" format="YYYY-MM-DD"
placeholder="YYYY-MM-DD"
style="width: 100%;" type="date" value-format="YYYY-MM-DD"
/>
</el-form-item>
<el-form-item :label="language==0?'抵达时间':'Flight/Train Arrival Time'" prop="pickUpBo.arrivaTime"
required>
<!-- <el-date-picker-->
<!-- v-model="form.pickUpBo.arrivaTime"-->
<!-- format="YYYY-MM-DD" placeholder="YYYY-MM-DD"-->
<!-- style="width: 100%;" type="date" value-format="YYYY-MM-DD"-->
<!-- />-->
<el-time-picker v-model="form.pickUpBo.arrivaTime" placeholder="HH:mm:ss" value-format="HH:mm:ss" format="HH:mm:ss" style="width: 100%;"/>
</el-form-item>
<el-form-item :label="language==0?'航班/车次':'Flight/Train Number'" prop="pickUpBo.flight" required>
<el-input v-model="form.pickUpBo.flight"/>
</el-form-item>
<el-form-item :label="language==0?'机场/火车站':'Airport/Train Station'" prop="pickUpBo.stationName"
required>
<el-input v-model="form.pickUpBo.stationName"/>
</el-form-item>
<el-form-item :label="language==0?'航站楼':'Air Terminal'" prop="pickUpBo.terminal" required>
<el-input v-model="form.pickUpBo.terminal"/>
</el-form-item>
<el-form-item :label="language==0?'送达酒店':'Destination Hotel'" prop="pickUpBo.hotle" required>
<el-input v-model="form.pickUpBo.hotle"/>
</el-form-item>
<el-form-item :label="language==0?'行程单':'Round-Trip Itinerary'" prop="pickUpBo.itinerary" required>
<image-upload v-model="form.pickUpBo.itinerary" :button-text="language==0?'上传':'Upload'"
:is-show-tip="false"
:limit="1"/>
</el-form-item>
</div>
<div v-if="form.type?.some(v=>v==2)">
<h3 style="text-align: center">{{ language == 0 ? '送机' : 'airport drop-off' }}</h3>
<el-form-item
:label="language==0?'离会人员身份':'Role of Person-Departure'"
prop="downOffBo.standing" required>
<!-- <el-input v-model="form.downOffBo.standing"/>-->
<el-checkbox-group v-model="form.downOffBo.standing">
<el-checkbox :label="language==0?'运动员':'Athlete'" name="1"/>
<el-checkbox :label="language==0?'随队人员':'Accompanying Person'" name="2"/>
<el-checkbox :label="language==0?'官员':'Official'" name="3"/>
<el-checkbox :label="language==0?'其他':'Others'" name="4"/>
</el-checkbox-group>
</el-form-item>
<el-form-item :label="language==0?'国家/地区':'Nationality'" prop="downOffBo.nationalitys" required >
<el-select v-model="form.downOffBo.nationalitys" filterable multiple style="width: 100%;">
<el-option v-for="item in countrys"
:key="item.id"
:label="language==0?item.name:item.enName"
:value="language==0?item.name:item.enName"/>
</el-select>
</el-form-item>
<el-form-item :label="language==0?'联系人':'Contact Person'" prop="downOffBo.name" required>
<el-input v-model="form.downOffBo.name"/>
</el-form-item>
<el-form-item :label="language==0?'联系电话':'Contact Phone Number'" prop="downOffBo.phone" required>
<el-input v-model="form.downOffBo.phone"/>
</el-form-item>
<el-form-item :label="language==0?'人数':'Number of People'" prop="downOffBo.counts" required>
<el-input-number v-model="form.downOffBo.counts"/>
</el-form-item>
<el-form-item :label="language==0?'离开日期':'Departure Date from Hotel'" prop="downOffBo.arrivalDate"
required>
<el-date-picker
v-model="form.downOffBo.arrivalDate" format="YYYY-MM-DD"
placeholder="YYYY-MM-DD"
style="width: 100%;" type="date" value-format="YYYY-MM-DD"
/>
</el-form-item>
<el-form-item :label="language==0?'离开时间':'Departure Time from Hotel'" prop="downOffBo.arrivaTime" required>
<!-- <el-date-picker-->
<!-- v-model="form.downOffBo.rrivaTime"-->
<!-- format="YYYY-MM-DD" placeholder="YYYY-MM-DD"-->
<!-- style="width: 100%;" type="date" value-format="YYYY-MM-DD"-->
<!-- />-->
<el-time-picker v-model="form.downOffBo.arrivaTime" placeholder="HH:mm:ss" value-format="HH:mm:ss" format="HH:mm:ss" style="width: 100%;"/>
</el-form-item>
<el-form-item :label="language==0?'航班/车次':'Flight/Train Number'" prop="downOffBo.flight" required>
<el-input v-model="form.downOffBo.flight"/>
</el-form-item>
<el-form-item :label="language==0?'机场/火车站':'Airport/Train Station'" prop="downOffBo.stationName"
required>
<el-input v-model="form.downOffBo.stationName"/>
</el-form-item>
<el-form-item :label="language==0?'航站楼':'Air Terminal'" prop="downOffBo.terminal" required>
<el-input v-model="form.downOffBo.terminal"/>
</el-form-item>
<el-form-item :label="language==0?'出发酒店':'Departure Hotel'" prop="downOffBo.hotle" required>
<el-input v-model="form.downOffBo.hotle"/>
</el-form-item>
<el-form-item :label="language==0?'行程单':'Round-Trip Itinerary'" prop="downOffBo.itinerary" required>
<image-upload v-model="form.downOffBo.itinerary" :button-text="language==0?'上传':'Upload'"
:is-show-tip="false"
:limit="1"/>
</el-form-item>
</div>
<div class="text-center">
<el-button class="btn-lineG" round size="large" type="primary" @click="submitForm()">
{{ language == 0 ? '提交' : 'submit' }}
</el-button>
</div>
</el-form>
</div>
<div >
<div v-if="showR" class="text-center pd20">
<img class="mauto" src="@/assets/dance/ok.png"/>
<h2 class="text-center">{{ language == 0 ? '境外及港澳台选手接送信息登记已提交' : 'Request Form for Overseas, HKT, Mau, China and TPE Athletes Arrival and Departure' }}</h2>
<h4 v-if="language == 0" class="text-center">
我们已收到您的申请
</h4>
<h4 v-else>
Your application has been received
<!-- <br/>-->
<!-- Please register in Wuxi on July 14.-->
</h4>
</div>
</div>
</div>
</el-dialog>
</template>
<script setup>
import {useStorage} from "@vueuse/core/index";
import {getCurrentInstance, watch, ref} from "vue";
import {nextTick} from "@vue/runtime-core";
import {ElMessage, ElMessageBox} from "element-plus";
import {addInvitation, countryList} from "@/apiPc/match";
import ImageUpload from "@/components/ImageUpload";
import {masterClassList, getByCard, submitMasterApply, getMasterApply, delByCard,addPickup} from "@/apiPc/common";
const {proxy} = getCurrentInstance()
const language = useStorage('language', 0)
const form = ref({
pickUpBo: {
serviceType:1
},
downOffBo: {
serviceType:2
},
type: ['1']
})
const show = ref(false)
const showR = ref(false)
const title = ref('')
const activeStep = ref(0)
const countrys = ref([])
const courseList = ref([])
const cptId = ref('')
const rules = ref(
{
type: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
'pickUpBo.standing': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.nationalitys': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.name': [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
'pickUpBo.phone': [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
'pickUpBo.counts': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.arrivalDate': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.arrivaTime': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.flight': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.stationName': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.terminal': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'pickUpBo.hotle': [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
'pickUpBo.itinerary': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.nationalitys': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.standing': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.name': [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
'downOffBo.phone': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.counts': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.arrivalDate': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.arrivaTime': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.flight': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.stationName': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.terminal': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.hotle': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
'downOffBo.itinerary': [{
required: true,
trigger: 'change',
message: language.value == 0 ? '请选择' : 'Please choose'
},],
name: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'},],
email: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'},],
birth: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
passportNo: [{required: true, trigger: 'blur', message: language.value == 0 ? '请输入' : 'Please enter'},],
passportCopy: [{required: true, trigger: 'blur', message: language.value == 0 ? '请上传' : 'Please Upload'},],
arrival: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
departure: [{required: true, trigger: 'change', message: language.value == 0 ? '请选择' : 'Please choose'},],
})
const open = (params) => {
show.value = true
showR.value=false
form.value={
pickUpBo: {
serviceType:1
},
downOffBo: {
serviceType:2
},
type: ['1'],
}
title.value = language.value == 0 ? '境外及港澳台选手接送信息登记已提交' : 'Request Form for Overseas, HKT, Mau, China and TPE Athletes Arrival and Departure'
cptId.value = params.cptId
getCourse()
// proxy.$refs['iformRef']
}
defineExpose({open})
watch(show, (value) => {
if (!value) {
form.value = {
sex: '0'
}
if (language.value == 0) {
form.value.countryId = 240
}
}
})
function getCourse() {
masterClassList({cptId: cptId.value}).then(res => {
courseList.value = res.data
})
}
function setActive(n) {
activeStep.value = n
}
function submitForm() {
proxy.$refs['iformRef'].validate(async valid => {
if (valid) {
form.value.pickUpBo.cptId=cptId.value
form.value.downOffBo.cptId=cptId.value
// form.value.pickUpBo.serviceType=1
// form.value.downOffBo.serviceType=2
console.log(form.value)
let forms=JSON.parse(JSON.stringify(form.value))
forms.pickUpBo.nationalitys=forms.pickUpBo.nationalitys?.join(',')
forms.pickUpBo.standing=forms.pickUpBo.standing?.join(',')
forms.downOffBo.nationalitys=forms.downOffBo.nationalitys?.join(',')
forms.downOffBo.standing=forms.downOffBo.standing?.join(',')
forms.type=null
if(!form.value.type.includes('1')) forms.pickUpBo={}
if(!form.value.type.includes('2')) forms.downOffBo={}
const res=await addPickup(forms)
if (res.code==200) {
proxy.$modal.msgSuccess('操作成功！')
showR.value=true
// show.value=false
}
} else {
proxy.$modal.msgError('请完善信息！')
}
}
)
}
// function checkApplyCourse(n) {
// getMasterApply({card: form.value.passportNo}).then(res => {
// if (res.data?.length > 0) {
// form.value.courseId = []
// for (var n of res.data) {
// form.value.courseId.push(n.itemId)
// }
// ElMessageBox.confirm(
// language.value == 0 ? '您已提交过信息，是否更新？' : 'You have submitted the information, do you want to update?',
// language.value == 0 ? '提示' : 'Tips', {
// confirmButtonText: language.value == 0 ? '是' : 'Confirm',
// cancelButtonText: language.value == 0 ? '否' : 'Cancel',
// type: 'warning'
// }).then(() => {
// //删除原记录
// delByCard(form.value.passportNo).then(res => {
// form.value.courseId = []
// disChoose.value = false
// to2()
// })
// }).catch(() => {
// disChoose.value = true
// to2()
// })
// } else {
// to2()
// }
// })
//
// }
function to2() {
proxy.$refs.iformRef.validate(valid => {
if (form.value.email.indexOf('@') == -1) {
if (language.value == 0) {
ElMessage.warning('请填写正确的邮箱')
} else {
ElMessage.warning('Please fill in the correct email')
}
return
}
if (valid) {
setActive(2)
}
})
}
getCountryList()
function getCountryList() {
countryList().then(res => {
countrys.value = res.data
})
}
</script>
<style scoped>
.xzRich {
line-height: 2;
font-size: 14px;
}
.boxInvitation {
width: 90%;
margin: auto
}
h4 {
font-size: 15px;
line-height: 1.6;
}
</style>
src/viewsPc/home.vue
<template>
<div>
<index-Ch v-if="language ==0" @pop="openMaster"/>
<index-En v-else @pop="openMaster"/>
<index-Ch v-if="language ==0" @pop="openMaster" @pickup="openPickup"/>
<index-En v-else @pop="openMaster" @pickup="openPickup"/>
<div v-if="showgg" class="fixed_gg">
<!--天气-->
<el-icon class="cclose" @click.stop="showgg=false"><circle-close /></el-icon>
......@@ -61,6 +61,7 @@
</div>
<dialog-master-class ref="masterClassRef"/>
<pickup ref="pickupRef"></pickup>
</div>
</template>
......@@ -70,6 +71,7 @@ import IndexCh from '/src/viewsPc/index'
import IndexEn from '/src/viewsPc/index_en'
import WeatherIcon from '@/viewsPc/components/weatherIcon'
import DialogMasterClass from '@/viewsPc/components/masterClass'
import pickup from '@/viewsPc/components/pickup'
import {useStorage} from "@vueuse/core/index";
import {ref} from "vue";
import {getWeather} from "@/apiPc/webSite";
......@@ -103,6 +105,15 @@ const openMaster = (params) => {
}
proxy.$refs['masterClassRef'].open(obj)
}
const openPickup= (params) => {
console.log(params)
const obj = {
title:'接送机服务',
cptId:params.cptId
}
proxy.$refs['pickupRef'].open(obj)
}
</script>
<style scoped lang="scss">
......
src/viewsPc/index.vue
......@@ -95,6 +95,8 @@
</a>
<!-- <el-button type="primary" @click="popMaster">青少年公益课</el-button>-->
<a class="zn-btn ml20 btn-q" @click="popMaster">青少年公益课报名</a>
<a class="zn-btn ml20 btn-q" @click="handlePickup">接/送机服务</a>
</div>
</el-col>
<el-col :sm="24" :lg="14">
......@@ -377,7 +379,7 @@ const navigationPic = ref({
})
const router = useRouter()
const {proxy} = getCurrentInstance()
const emit = defineEmits(['pop'])
const emit = defineEmits(['pop','pickup'])
const time = ref(0)
const personList = ref([
{ name: 'Wolfgang Eliasch', pp: '拉丁舞裁判长 奥地利', src: '/img/1.png' },
......@@ -500,6 +502,13 @@ const popMaster = () => {
emit('pop',params)
}
const handlePickup=()=>{
const params={
cptId :matchData.value.id
}
emit('pickup',params)
}
</script>
<style scoped lang="scss">
......
src/viewsPc/index_en.vue
......@@ -88,7 +88,10 @@
<div style="margin-bottom: 30px">
<a class="zn-btn" style="font-size: 15px" @click="goGuide">GUIDELINE<el-icon><download /></el-icon>
</a>
<a class="zn-btn ml20 btn-q" style="font-size: 15px" @click="popMaster">Junior &Youth Camp REGISTER<el-icon><Edit /></el-icon>
<a class="zn-btn ml20 btn-q" style="font-size: 15px;margin-right: 20px" @click="popMaster">Junior &Youth Camp REGISTER<el-icon><Edit /></el-icon>
</a>
<a class="zn-btn btn-q" style="font-size: 15px;margin-top: 10px" @click="handlePickup">Pick-up/drop-off service
</a>
</div>
......@@ -508,6 +511,13 @@ const popMaster = () => {
}
emit('pop',params)
}
const handlePickup=()=>{
const params={
cptId :matchData.value.id
}
emit('pickup',params)
}
</script>
<style scoped lang="scss">
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!