Commit 653e956a authored by 黄奎's avatar 黄奎

页面修改

parent bdfc2f49
<template> <template>
<div> <div>
<div class="ListCar-form"></div> <div class="ListCar-form"></div>
<div class="ListCar-form-box"> <div class="ListCar-form-box">
<div class="ListCar-box"> <div class="ListCar-box">
<div class="normalBtn ListCar-close" @click="close"> <div class="normalBtn ListCar-close" @click="close">
<i class="el-icon-close"></i> <i class="el-icon-close"></i>
</div>
<div class="row-JCSB ListCar-header paddinglr15">
<span class="fz16 fbold">酒店采购单</span>
<div class="ListCar-header-right fz12">
本次行程
<span class="colore65100">{{cars&&cars.length}}</span>
天,入住
<span class="color009ef7">{{HotelLength}}</span>
個酒店
</div>
</div>
<div class="ListCar-content">
<div class="ListCar-list" v-for="(x,xi) in cars">
<div class="colorffffff list-time">{{ x.Date }}</div>
<div class="list-content-box" v-for="(y,i) in x.Hotels">
<div class="list-operation">
<div>
<button v-if="x.Date>=OptionalTime" class="hollowFixedBtn" type="primary"
@click="setEditorHandler(y)">
<i class="el-icon-edit"></i>
</button>
<button class="normalBtn" type="primary" @click="removeHotelHandler(xi,i)">
<i class="el-icon-delete"></i>
</button>
</div> </div>
<div class="row-JCSB ListCar-header paddinglr15"> </div>
<span class="fz16 fbold">酒店采购单</span> <div class="list-content">
<div class="ListCar-header-right fz12"> <div class="color009ef7 row-JCSB list-content-title">
本次行程 <span class="fbold content-title fz15">{{ y.HotelName }}</span>
<span class="colore65100">{{cars&&cars.length}}</span> <div class="fz12 fbold">
天,入住 已选
<span class="color009ef7">{{HotelLength}}</span> <span class="coloref44336">{{ y.SumPeople }}</span>
個酒店
</div> <span class="coloref1416c">{{ y.Total }}</span>
</div>
</div> </div>
<div class="ListCar-content"> <div class="list-content-rooms fz14">
<div class="ListCar-list" v-for="(x,xi) in cars"> <div v-for="z in y.DetailList">
<div class="colorffffff list-time">{{ x.Date }}</div> <el-row :gutter="20">
<div class="list-content-box" v-for="(y,i) in x.Hotels"> <el-col :span="6">{{ z.RoomName }}</el-col>
<div class="list-operation"> <el-col :span="6">
<div> {{ moneyFormat(z.Unit_Price) }}/人
</el-col>
<button v-if="x.Date>=OptionalTime" class="hollowFixedBtn" type="primary" @click="setEditorHandler(y)"> <el-col :span="5">
<i class="el-icon-edit"></i> {{ z.PeopleNumber }}{{ z.Number }}
</button> </el-col>
<button class="normalBtn" type="primary" @click="removeHotelHandler(xi,i)"> <el-col :span="7" class="row-JCE">
<i class="el-icon-delete"></i> <span>小计:{{ moneyFormat(z.Unit_Price * z.PeopleNumber) }}</span>
</button> </el-col>
</div> </el-row>
</div> </div>
<div class="list-content">
<div class="color009ef7 row-JCSB list-content-title">
<span class="fbold content-title fz15">{{ y.HotelName }}</span>
<div class="fz12 fbold">
已选
<span class="coloref44336">{{ y.SumPeople }}</span>
<span class="coloref1416c">{{ y.Total }}</span>
</div>
</div>
<div class="list-content-rooms fz14">
<div v-for="z in y.DetailList">
<el-row :gutter="20">
<el-col :span="6">{{ z.RoomName }}</el-col>
<el-col :span="6">
{{ moneyFormat(z.Unit_Price) }}/人
</el-col>
<el-col :span="5">
{{ z.PeopleNumber }}{{ z.Number }}
</el-col>
<el-col :span="7" class="row-JCE">
<span>小计:{{ moneyFormat(z.Unit_Price * z.PeopleNumber) }}</span>
</el-col>
</el-row>
</div>
</div>
<div class="row-JCE color009ef7 fz14 list-content-num">
<span>合计:{{ moneyFormat(y.Money) }}</span>
</div>
</div>
</div>
</div>
<div v-if="cars.length==0" style="text-align: center;padding: 20px 0;">暂无数据</div>
</div> </div>
<div class="row-JCE color009ef7 fz14 list-content-num">
<div class="ListCar-bottom" v-if="cars.length>0"> <span>合计:{{ moneyFormat(y.Money) }}</span>
<div v-if="crmOrderObj" style="margin-bottom: 10px;">
<span style="color: red;">引流人:{{crmOrderObj.LureEmpNmae}} </span>
<span style="color: #2AAEF2;">/客人:{{crmOrderObj.CRMGuestName}}</span>
</div>
<el-form label-width="60px" :model="parameters" :rules="rules" ref="parameters">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="类型" prop="OrderType">
<el-select v-model="parameters.OrderType">
<el-option v-for="item in cacheHotels" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
</el-select>
</el-form-item>
</el-col>
<template v-if="parameters.OrderType==1">
<el-col :span="12">
<el-form-item label="姓名" prop="ContactName">
<el-input v-model="parameters.ContactName"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="电话" prop="ContactNumber">
<el-input v-model="parameters.ContactNumber"></el-input>
</el-form-item>
</el-col>
</template>
<el-col :span="12" v-else>
<el-form-item label="团号" prop="TCNum">
<el-input v-model="parameters.TCNum"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="">
<el-input type="textarea" :rows="1"
placeholder="请输入备注" v-model="parameters.Remark"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="row-JCSB bottom-num">
<div>
<span class="coloref1416c fz12">订单总金额:</span>
<span class="coloref1416c fbold">
<span class="fz18">{{parameters.Money}}</span>
<span class="fz13"><!-- ¥ -->{{cars[0].CurrencyName}}</span>
</span>
</div>
<div>
<button :class="{'normalBtn':!loading,'hollowFixedBtn':loading}" type="primary" @click="submit">
确认下单
</button>
</div>
</div>
</div> </div>
</div>
</div>
</div>
<div v-if="cars.length==0" style="text-align: center;padding: 20px 0;">暂无数据</div>
</div>
<div class="ListCar-bottom" v-if="cars.length>0">
<div v-if="crmOrderObj" style="margin-bottom: 10px;">
<span style="color: red;">引流人:{{crmOrderObj.LureEmpNmae}} </span>
<span style="color: #2AAEF2;">/客人:{{crmOrderObj.CRMGuestName}}</span>
</div>
<el-form label-width="60px" :model="parameters" :rules="rules" ref="parameters">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="类型" prop="OrderType">
<el-select v-model="parameters.OrderType">
<el-option v-for="item in cacheHotels" :key="item.ID" :label="item.Name" :value="item.ID">
</el-option>
</el-select>
</el-form-item>
</el-col>
<template v-if="parameters.OrderType==1">
<el-col :span="12">
<el-form-item label="姓名" prop="ContactName">
<el-input v-model="parameters.ContactName"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="电话" prop="ContactNumber">
<el-input v-model="parameters.ContactNumber"></el-input>
</el-form-item>
</el-col>
</template>
<el-col :span="12" v-else>
<el-form-item label="团号" prop="TCNum">
<el-input v-model="parameters.TCNum"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="">
<el-input type="textarea" :rows="1" placeholder="请输入备注" v-model="parameters.Remark"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="row-JCSB bottom-num">
<div>
<span class="coloref1416c fz12">订单总金额:</span>
<span class="coloref1416c fbold">
<span class="fz18">{{parameters.Money}}</span>
<span class="fz13">
<!-- ¥ -->{{cars[0].CurrencyName}}</span>
</span>
</div>
<div>
<button :class="{'normalBtn':!loading,'hollowFixedBtn':loading}" type="primary" @click="submit">
确认下单
</button>
</div> </div>
</div>
</div> </div>
</div>
</div> </div>
</template> </div>
<script> </template>
export default { <script>
props: { export default {
// crmOrderObj: { props: {
// type: Object, // crmOrderObj: {
// require: false // type: Object,
// }, // require: false
HotelRow: { // },
type: Object, HotelRow: {
require: false type: Object,
}, require: false
hotelInfor: {
type: Object,
require: false
}
}, },
data() { hotelInfor: {
return { type: Object,
crmOrderObj:null, require: false
OptionalTime: this.getBeforeDate(0,new Date().Format('yyyy-MM-dd')),//可编辑时间 }
cars: [], },
HotelLength: 0, data() {
addNum: 1, return {
parameters: { crmOrderObj: null,
Money: 0, OptionalTime: this.getBeforeDate(0, new Date().Format('yyyy-MM-dd')), //可编辑时间
DetailList: [], cars: [],
Remark: '', HotelLength: 0,
OrderType: 1, //订单类型 1散客 2团队 addNum: 1,
TCNum: '', //=团队时 传递 组团号 parameters: {
ContactName: '', //=散客时 传递 联系人 Money: 0,
ContactNumber: '', //=散客时 传递 联系人电话 DetailList: [],
OrderId: 0, Remark: '',
LureEmpId: 0, OrderType: 1, //订单类型 1散客 2团队
CRMGuestId: 0, TCNum: '', //=团队时 传递 组团号
}, ContactName: '', //=散客时 传递 联系人
currentIndex: 0, ContactNumber: '', //=散客时 传递 联系人电话
currentI: 0, OrderId: 0,
currentS: 0, LureEmpId: 0,
RemainingInventory: 0, CRMGuestId: 0,
loading: false, },
cacheHotels: [ currentIndex: 0,
{ Name: '散客', ID: 1 }, currentI: 0,
{ Name: '团队', ID: 2 } currentS: 0,
], RemainingInventory: 0,
rules:{ loading: false,
OrderType: [{ cacheHotels: [{
required: true, Name: '散客',
message: '请选择类型', ID: 1
trigger: 'change' },
}], {
ContactName: [{ Name: '团队',
required: true, ID: 2
message: '请输入散客姓名', }
trigger: 'blur' ],
}], rules: {
ContactNumber: [ OrderType: [{
{ required: true, message: "请输入联系电话", trigger: "blur" }, required: true,
{ message: '请选择类型',
pattern: this.$commonUtils.Regex.el_ISphone, trigger: 'change'
message: "请输入正确的电话" }],
} ContactName: [{
], required: true,
TCNum: [{ message: '请输入散客姓名',
required: true, trigger: 'blur'
message: '请输入团号', }],
trigger: 'blur' ContactNumber: [{
}], required: true,
message: "请输入联系电话",
trigger: "blur"
} }
};
],
TCNum: [{
required: true,
message: '请输入团号',
trigger: 'blur'
}],
}
};
},
watch: {
// crmOrderObj: {
// handler: function (val, oldVal) {
// this.crmOrderObj = val
// if(this.crmOrderObj){
// this.parameters.LureEmpId = val.LureEmpId//引流id
// this.parameters.CRMGuestId = val.CRMGuestId //客人ID
// }
// },
// deep: true,
// immediate: true
// },
cars: {
handler: function (val, oldVal) {
this.HotelLength = this.cars.length
localStorage.setItem("HotelLength", this.HotelLength)
this.getMoney()
},
deep: true
}, },
watch: { parameters: {
// crmOrderObj: { handler: function (val, oldVal) {
// handler: function (val, oldVal) {
// this.crmOrderObj = val
// if(this.crmOrderObj){
// this.parameters.LureEmpId = val.LureEmpId//引流id
// this.parameters.CRMGuestId = val.CRMGuestId //客人ID
// }
// },
// deep: true,
// immediate: true
// },
cars: {
handler: function (val, oldVal) {
this.HotelLength = this.cars.length
localStorage.setItem("HotelLength",this.HotelLength)
this.getMoney()
},
deep: true
}, },
parameters: { deep: true
handler: function (val, oldVal) { }
},
}, created() {
deep: true // crm自动登陆传过来的参数
} if (this.$route.query.crmOrderObj) {
let crmOrderObj = JSON.parse(this.$route.query.crmOrderObj)
this.crmOrderObj = crmOrderObj
this.parameters.LureEmpId = crmOrderObj.LureEmpId //引流id
this.parameters.CRMGuestId = crmOrderObj.CRMGuestId //客人ID
}
this.cars = JSON.parse(localStorage.getItem("cars"))
this.HotelLength = localStorage.getItem("HotelLength")
},
mounted() {
},
methods: {
// 关闭购物车
close() {
localStorage.removeItem('editor')
this.$emit('close')
}, },
created() { // 合计
// crm自动登陆传过来的参数 getMoney() {
if(this.$route.query.crmOrderObj){ this.parameters.Money = 0
let crmOrderObj = JSON.parse(this.$route.query.crmOrderObj) this.cars.forEach((item) => {
this.crmOrderObj = crmOrderObj item.Hotels.forEach((t) => {
this.parameters.LureEmpId = crmOrderObj.LureEmpId//引流id this.parameters.Money += t.Money
this.parameters.CRMGuestId = crmOrderObj.CRMGuestId //客人ID })
} })
this.cars = JSON.parse(localStorage.getItem("cars"))
this.HotelLength = localStorage.getItem("HotelLength")
}, },
mounted() { // 确定下单
submit() {
this.$refs['parameters'].validate((valid) => {
if (valid) {
this.setFormMsg()
} else {
return false;
}
});
}, },
methods: { setFormMsg() {
// 关闭购物车 let temp = JSON.parse(JSON.stringify(this.cars))
close(){ if (this.loading || this.cars.length == 0) return
localStorage.removeItem('editor') this.loading = true
this.$emit('close') this.parameters.DetailList = []
}, temp.forEach((x) => {
// 合计 x.Hotels.forEach((y) => {
getMoney() { y.RoomList = JSON.parse(JSON.stringify(y.DetailList))
this.parameters.Money = 0 delete y.DetailList
this.cars.forEach((item) => { this.parameters.DetailList.push(y)
item.Hotels.forEach((t) => { })
this.parameters.Money += t.Money })
})
}) this.apipost("dict_post_SetSaleCustomerOrder", this.parameters,
}, res => {
// 确定下单 this.loading = false;
submit() { if (res.data.resultCode == 1) {
this.$refs['parameters'].validate((valid) => { this.Success('下单成功');
if (valid) { localStorage.removeItem('cars')
this.setFormMsg() localStorage.removeItem('editor')
} else { localStorage.removeItem('HotelLength')
return false; this.cars = []
} this.HotelLength = 0
}); this.$emit('success')
}, } else {
setFormMsg(){ this.Error('下单失败')
let temp = JSON.parse(JSON.stringify(this.cars)) }
if(this.loading||this.cars.length==0) return },
this.loading = true err => {
this.parameters.DetailList = [] this.Error(err.message)
temp.forEach((x)=>{ this.loading = false
x.Hotels.forEach((y)=>{ }
y.RoomList = JSON.parse(JSON.stringify(y.DetailList)) );
delete y.DetailList },
this.parameters.DetailList.push(y) removeHotelHandler(x, y) {
}) let that = this
}) that.$confirm('是否确定删除?', '提示', {
confirmButtonText: '确定',
this.apipost("dict_post_SetSaleCustomerOrder", this.parameters, cancelButtonText: '取消',
res => { type: 'warning'
this.loading = false; }).then(() => {
if (res.data.resultCode == 1) { if (this.cars[x].Hotels.length == 1) {
this.Success('下单成功'); this.cars.splice(x, 1)
localStorage.removeItem('cars') } else {
localStorage.removeItem('editor') this.cars[x].Hotels.splice(y, 1)
localStorage.removeItem('HotelLength') }
this.cars=[] this.HotelLength = this.cars.length
this.HotelLength = 0 localStorage.removeItem('cars')
this.$emit('success') localStorage.setItem('cars', JSON.stringify(this.cars))
} else { localStorage.removeItem('HotelLength')
this.Error('下单失败') localStorage.setItem('HotelLength', JSON.stringify(this.HotelLength))
}
}, }).catch(() => {
err => {
this.Error(err.message) });
this.loading = false },
} // 编辑
); setEditorHandler(x) {
}, localStorage.setItem('editor', JSON.stringify(x))
removeHotelHandler(x,y){ this.$emit('editor', x)
let that = this
that.$confirm('是否确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
if(this.cars[x].Hotels.length==1){
this.cars.splice(x,1)
}else{
this.cars[x].Hotels.splice(y,1)
}
this.HotelLength = this.cars.length
localStorage.removeItem('cars')
localStorage.setItem('cars',JSON.stringify(this.cars))
localStorage.removeItem('HotelLength')
localStorage.setItem('HotelLength',JSON.stringify(this.HotelLength))
}).catch(() => {
});
},
// 编辑
setEditorHandler(x){
localStorage.setItem('editor',JSON.stringify(x))
this.$emit('editor',x)
}
} }
};
</script>
<style scoped>
.fz12{
font-size: 12px;
}
.fz13{
font-size: 13px;
}
.fz14{
font-size: 14px;
}
.fz15{
font-size: 15px;
}
.fz16{
font-size: 16px;
}
.fz18{
font-size: 18px;
}
.fbold{
font-weight: bold;
}
.paddinglr15{
padding: 0 15px;
}
.row-JCSB{
display: flex;
justify-content: space-between;
}
.row-JCE{
display: flex;
justify-content: end;
}
.colorffffff{
color: #ffffff;
}
.color009ef7{
color: #009ef7;
}
.colore65100{
color: #e65100;
}
.coloref44336{
color: #f44336;
}
.coloref1416c{
color: #f1416c;
}
.ListCar-form{
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(23,23,23,.5);
z-index: 3;
}
.ListCar-form-box{
position: fixed;
top: 0;
right: 0;
bottom: 0;
width: 550px;
background: #ffffff;
z-index: 100;
}
.ListCar-box{
width: 100%;
height: 100%;
position: relative;
}
.ListCar-close{
position: absolute;
left: -47px;
top: 20%;
line-height: 26px;
}
.ListCar-close i{
margin-left: 3px;
}
.normalBtn.ListCar-close{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
padding: 0 8px !important;
}
.ListCar-box{
padding: 15px 0;
}
.ListCar-header{
border-bottom: -;
}
.ListCar-header-right{
border-radius: 3px;
padding: 5px 8px;
background: #fff3e0;
}
.ListCar-content{
padding: 20px 15px;
height: calc(100% - 230px);
overflow: auto;
} }
.ListCar-list{ };
border-radius: 3px;
background: black; </script>
padding: 0 10px 10px 10px;
margin: 0 0 10px 0; <style scoped>
} .fz12 {
.list-time{ font-size: 12px;
padding: 10px 0 5px 0; }
}
.list-content-box{ .fz13 {
background: #e1f5fe; font-size: 13px;
position: relative; }
border-radius: 3px;
cursor: pointer; .fz14 {
margin-bottom: 5px; font-size: 14px;
} }
.list-content-box:last-child{
margin-bottom: 0; .fz15 {
} font-size: 15px;
.list-content{ }
padding: 8px 10px;
} .fz16 {
.list-content-title{ font-size: 16px;
border-bottom: 1px dashed #009ef7; }
padding: 0 0 8px 0;
} .fz18 {
.content-title{ font-size: 18px;
width: 300px; }
overflow: hidden;
white-space: nowrap; .fbold {
text-overflow: ellipsis; font-weight: bold;
} }
.list-content-rooms{
border-bottom: 1px dashed #009ef7; .paddinglr15 {
padding: 6px 0; padding: 0 15px;
} }
.list-content-rooms>div{
margin-bottom: 5px; .row-JCSB {
} display: flex;
.list-content-rooms>div:last-child{ justify-content: space-between;
margin-bottom: 0; }
}
.list-content-num{ .row-JCE {
padding: 6px 0 0 0; display: flex;
} justify-content: end;
.list-operation{ }
position: absolute;
top: 0; .colorffffff {
left: 0; color: #ffffff;
bottom: 0; }
right: 0;
background: rgba(23,23,23,.5); .color009ef7 {
border-radius: 3px; color: #009ef7;
display: none; }
z-index: 1;
} .colore65100 {
.list-operation div{ color: #e65100;
height: 100%; }
display: flex;
justify-content: center; .coloref44336 {
align-items: center; color: #f44336;
} }
.list-content-box:hover .list-operation{
display: block; .coloref1416c {
} color: #f1416c;
.ListCar-bottom{ }
padding: 15px 15px 0 15px;
} .ListCar-form {
.bottom-num{ position: fixed;
align-items: center; top: 0;
} left: 0;
right: 0;
bottom: 0;
</style> background: rgba(23, 23, 23, .5);
z-index: 3;
\ No newline at end of file }
.ListCar-form-box {
position: fixed;
top: 0;
right: 0;
bottom: 0;
width: 550px;
background: #ffffff;
z-index: 100;
}
.ListCar-box {
width: 100%;
height: 100%;
position: relative;
}
.ListCar-close {
position: absolute;
left: -47px;
top: 20%;
line-height: 26px;
}
.ListCar-close i {
margin-left: 3px;
}
.normalBtn.ListCar-close {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
padding: 0 8px !important;
}
.ListCar-box {
padding: 15px 0;
}
.ListCar-header {
border-bottom: -;
}
.ListCar-header-right {
border-radius: 3px;
padding: 5px 8px;
background: #fff3e0;
}
.ListCar-content {
padding: 20px 15px;
height: calc(100% - 230px);
overflow: auto;
}
.ListCar-list {
border-radius: 3px;
background: black;
padding: 0 10px 10px 10px;
margin: 0 0 10px 0;
}
.list-time {
padding: 10px 0 5px 0;
}
.list-content-box {
background: #e1f5fe;
position: relative;
border-radius: 3px;
cursor: pointer;
margin-bottom: 5px;
}
.list-content-box:last-child {
margin-bottom: 0;
}
.list-content {
padding: 8px 10px;
}
.list-content-title {
border-bottom: 1px dashed #009ef7;
padding: 0 0 8px 0;
}
.content-title {
width: 300px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.list-content-rooms {
border-bottom: 1px dashed #009ef7;
padding: 6px 0;
}
.list-content-rooms>div {
margin-bottom: 5px;
}
.list-content-rooms>div:last-child {
margin-bottom: 0;
}
.list-content-num {
padding: 6px 0 0 0;
}
.list-operation {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(23, 23, 23, .5);
border-radius: 3px;
display: none;
z-index: 1;
}
.list-operation div {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.list-content-box:hover .list-operation {
display: block;
}
.ListCar-bottom {
padding: 15px 15px 0 15px;
}
.bottom-num {
align-items: center;
}
</style>
<style scoped> <style scoped>
.image-slot{ .image-slot {
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.time-box.time-box2 .time-box-width span{
width: auto;
}
.flexOne{
margin: auto;
width: 70%;
min-width: 1300px;
display: flex;
justify-content: space-between;
margin-top: 15px;
align-items: flex-start;
}
.flexOne-left{
flex-grow: 1;
}
.flexOne-form-bj{
border-radius: 5px;
background: #ffffff;
padding: 15px;
margin-bottom: 20px;
}
.flexOne-form-bj h3{
font-size: 18px;
color: black;
padding: 0 0 20px 0;
font-weight: 400;
}
.listone-form{
padding: 5px 0 15px 0;
border-radius: 5px;
background: #ffffff;
display: flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 10px;
overflow: hidden;
border-bottom: 1px solid #eeeeee;
}
.listone-img{
width: 130px;
flex-shrink: 0;
margin-right: 15px;
border-radius: 5px;
display: block;
}
.listone-list{
flex-grow: 1;
display: flex;
justify-content: space-between;
}
.list-left h6,.card-centent h6{
font-size: 16px;
margin-bottom: 5px;
cursor: pointer;
}
.list-left div{
color: #7E8299;
font-size: 13px;
margin-top: 7px;
}
.list-left div a{
color: #009EF7;
font-size: 12px;
margin-left: 15px;
cursor: pointer;
}
.flexOne-time{
padding: 20px;
}
.time-box{
display: flex;
flex-direction: row;
margin-bottom: 15px;
border: 0;
}
.time-box.center{
align-items: center;
}
.time-box>span{
/* width: 100px; */
flex-shrink: 0;
font-size: 13px;
color: #181C32;
margin-right: 40px;
}
.flexOne-type{
display: flex;
align-items: center;
padding: 0 0 20px 0;
}
.flexOne-type b{
font-size: 13px;
width: 100px;
flex-shrink: 0;
}
.flexOne-type div{
display: flex;
}
.flexOne-description{
padding: 15px 15px;
border-radius: 5px;
background: #E1F5FE;
margin-bottom: 20px;
}
.flexOne-description b{
font-size: 14px;
}
.flexOne-description p{
font-size: 12px;
color: #4C5759;
padding: 10px 0 0 0;
}
.flexOne-infor-box b{
font-size: 13px;
}
.infor-list{
display: flex;
flex-direction: column;
}
.list-title{
padding: 20px 0;
border-bottom: 1px dashed #eeeeee;
color: #7E8299;
font-size: 13px;
}
.list-title,.list-centent{
display: flex;
flex-wrap: wrap;
margin-top: 20px;
}
.infor-list li{
position: relative;
width: 25%;
}
.list-centent li {
display: flex;
width: 33.33%;
}
.list-centent.active li {
width: 25%;
}
.list-centent.activeB li {
width: 20%;
}
.list-centent.activeC li {
width: 50%;
}
.bottom .el-form-item{
margin-bottom: 0;
}
.notice{
border-radius: 5px;
border: 1px dashed #FFA500;
background: #FFF3E0;
margin-bottom: 15px;
padding: 15px;
}
.notice b{
font-size: 13px;
}
.notice p{
color: #5E6278;
font-size: 12px;
padding: 10px 0 0 0;
}
.flexOne-right{ .time-box.time-box2 .time-box-width span {
width: 300px; width: auto;
flex-shrink: 0; }
margin-left: 20px;
border-radius: 5px; .flexOne {
background: #ffffff; margin: auto;
padding: 15px; width: 70%;
} min-width: 1300px;
.flexOne-right h4{ display: flex;
padding: 10px 0 20px 0; justify-content: space-between;
color: #181C32; margin-top: 15px;
} align-items: flex-start;
.right-text{ }
border: 1px dashed #F1416C;
padding: 15px 10px; .flexOne-left {
background: #FFEBEE; flex-grow: 1;
font-size: 13px; }
color: black;
margin-bottom: 20px; .flexOne-form-bj {
border-radius: 5px; border-radius: 5px;
} background: #ffffff;
.right-text p{ padding: 15px;
color: #6D6E83; margin-bottom: 20px;
font-size: 12px; }
padding: 10px 0 0 0;
} .flexOne-form-bj h3 {
.right-form{ font-size: 18px;
border-top: 1px dashed #EEEEEE; color: black;
border-bottom: 1px dashed #EEEEEE; padding: 0 0 20px 0;
padding: 20px 0; font-weight: 400;
} }
.right-form h6{
font-size: 14px; .listone-form {
color: black; padding: 5px 0 15px 0;
} border-radius: 5px;
.noData{ background: #ffffff;
text-align: center; display: flex;
color: #7E8299; flex-direction: row;
font-size: 14px; justify-content: space-between;
} margin-bottom: 10px;
.right-form-list{ overflow: hidden;
display: flex; border-bottom: 1px solid #eeeeee;
flex-direction: column; }
padding: 20px 0;
} .listone-img {
.right-list{ width: 130px;
display: flex; flex-shrink: 0;
flex-direction: row; margin-right: 15px;
justify-content: space-between; border-radius: 5px;
align-items: center; display: block;
margin-bottom: 6px; }
}
.right-list-left{ .listone-list {
flex: 1; flex-grow: 1;
display: flex; display: flex;
flex-wrap: wrap; justify-content: space-between;
} }
.leftText{
width: 150px; .list-left h6,
text-overflow: ellipsis; .card-centent h6 {
overflow: hidden; font-size: 16px;
} margin-bottom: 5px;
.right-list-right{ cursor: pointer;
flex-shrink: 0; }
font-size: 13px;
color: #181C32; .list-left div {
} color: #7E8299;
.right-Money{ font-size: 13px;
padding: 20px 0; margin-top: 7px;
font-size: 14px; }
color: #181C32;
} .list-left div a {
.right-Money b{ color: #009EF7;
font-size: 18px; font-size: 12px;
color: #F1416C; margin-left: 15px;
margin-left: 5px; cursor: pointer;
} }
.right-Money,.right-Submit{
display: flex; .flexOne-time {
flex-direction: row-reverse; padding: 20px;
} }
/deep/.el-input-number{
width: 200px; .time-box {
height: 32px; display: flex;
line-height: 32px; flex-direction: row;
} margin-bottom: 15px;
/deep/.el-input-number .el-input__inner{ border: 0;
text-align: center; }
height: 34px;
} .time-box.center {
/deep/.line-heigh .el-input-number{ align-items: center;
line-height: 32px; }
}
/deep/.el-date-editor.el-input, .el-date-editor.el-input__inner{ .time-box>span {
width: auto; /* width: 100px; */
} flex-shrink: 0;
font-size: 13px;
color: #181C32;
margin-right: 40px;
}
.flexOne-type {
display: flex;
align-items: center;
padding: 0 0 20px 0;
}
.flexOne-type b {
font-size: 13px;
width: 100px;
flex-shrink: 0;
}
.flexOne-type div {
display: flex;
}
.flexOne-description {
padding: 15px 15px;
border-radius: 5px;
background: #E1F5FE;
margin-bottom: 20px;
}
.flexOne-description b {
font-size: 14px;
}
</style> .flexOne-description p {
<template> font-size: 12px;
<div class="flexOne"> color: #4C5759;
<div class="flexOne-left"> padding: 10px 0 0 0;
<div class="flexOne-form-bj"> }
<h3>
<template v-if="detailsObj.CarType==1">接机</template><template v-if="detailsObj.CarType==2">送机</template><template v-if="detailsObj.CarType==3">包车</template>信息 .flexOne-infor-box b {
</h3> font-size: 13px;
<div class="listone-form"> }
<el-image v-if="detailsObj.ImageList" class="listone-img" :src="detailsObj.ImageList[0]" fit="contain">
<div slot="placeholder" class="image-slot"> .infor-list {
<span> display: flex;
加载中<span class="dot">...</span> flex-direction: column;
</span> }
</div>
<div slot="error" class="image-slot"> .list-title {
<i class="el-icon-picture-outline"></i> padding: 20px 0;
</div> border-bottom: 1px dashed #eeeeee;
</el-image> color: #7E8299;
<div class="listone-list"> font-size: 13px;
<div class="list-left"> }
<h6 @click="showCardHandler">{{detailsObj.Name}}</h6>
<p style="color: #9e9e9e;font-size: 13px;">请在出发前一天的23:00前完成预定</p> .list-title,
<div v-if="crmOrderObj"> .list-centent {
<span style="color: red;">引流人:{{crmOrderObj.LureEmpNmae}} </span> display: flex;
<span style="color: #2AAEF2;">/客人:{{crmOrderObj.CRMGuestName}}</span> flex-wrap: wrap;
</div> margin-top: 20px;
<!-- <div> }
.infor-list li {
position: relative;
width: 25%;
}
.list-centent li {
display: flex;
width: 33.33%;
}
.list-centent.active li {
width: 25%;
}
.list-centent.activeB li {
width: 20%;
}
.list-centent.activeC li {
width: 50%;
}
.bottom .el-form-item {
margin-bottom: 0;
}
.notice {
border-radius: 5px;
border: 1px dashed #FFA500;
background: #FFF3E0;
margin-bottom: 15px;
padding: 15px;
}
.notice b {
font-size: 13px;
}
.notice p {
color: #5E6278;
font-size: 12px;
padding: 10px 0 0 0;
}
.flexOne-right {
width: 300px;
flex-shrink: 0;
margin-left: 20px;
border-radius: 5px;
background: #ffffff;
padding: 15px;
}
.flexOne-right h4 {
padding: 10px 0 20px 0;
color: #181C32;
}
.right-text {
border: 1px dashed #F1416C;
padding: 15px 10px;
background: #FFEBEE;
font-size: 13px;
color: black;
margin-bottom: 20px;
border-radius: 5px;
}
.right-text p {
color: #6D6E83;
font-size: 12px;
padding: 10px 0 0 0;
}
.right-form {
border-top: 1px dashed #EEEEEE;
border-bottom: 1px dashed #EEEEEE;
padding: 20px 0;
}
.right-form h6 {
font-size: 14px;
color: black;
}
.noData {
text-align: center;
color: #7E8299;
font-size: 14px;
}
.right-form-list {
display: flex;
flex-direction: column;
padding: 20px 0;
}
.right-list {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 6px;
}
.right-list-left {
flex: 1;
display: flex;
flex-wrap: wrap;
}
.leftText {
width: 150px;
text-overflow: ellipsis;
overflow: hidden;
}
.right-list-right {
flex-shrink: 0;
font-size: 13px;
color: #181C32;
}
.right-Money {
padding: 20px 0;
font-size: 14px;
color: #181C32;
}
.right-Money b {
font-size: 18px;
color: #F1416C;
margin-left: 5px;
}
.right-Money,
.right-Submit {
display: flex;
flex-direction: row-reverse;
}
/deep/.el-input-number {
width: 200px;
height: 32px;
line-height: 32px;
}
/deep/.el-input-number .el-input__inner {
text-align: center;
height: 34px;
}
/deep/.line-heigh .el-input-number {
line-height: 32px;
}
/deep/.el-date-editor.el-input,
.el-date-editor.el-input__inner {
width: auto;
}
</style>
<template>
<div class="flexOne">
<div class="flexOne-left">
<div class="flexOne-form-bj">
<h3>
<template v-if="detailsObj.CarType==1">接机</template><template
v-if="detailsObj.CarType==2">送机</template><template v-if="detailsObj.CarType==3">包车</template>信息
</h3>
<div class="listone-form">
<el-image v-if="detailsObj.ImageList" class="listone-img" :src="detailsObj.ImageList[0]" fit="contain">
<div slot="placeholder" class="image-slot">
<span>
加载中<span class="dot">...</span>
</span>
</div>
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
<div class="listone-list">
<div class="list-left">
<h6 @click="showCardHandler">{{detailsObj.Name}}</h6>
<p style="color: #9e9e9e;font-size: 13px;">请在出发前一天的23:00前完成预定</p>
<div v-if="crmOrderObj">
<span style="color: red;">引流人:{{crmOrderObj.LureEmpNmae}} </span>
<span style="color: #2AAEF2;">/客人:{{crmOrderObj.CRMGuestName}}</span>
</div>
<!-- <div>
<span>地址: {{detailsObj.CityList2[0].CountryName }}{{detailsObj.CityList2[0].CityName}}</span> <span>地址: {{detailsObj.CityList2[0].CountryName }}{{detailsObj.CityList2[0].CityName}}</span>
<a @click="showCardHandler"><i class="el-icon-map-location"></i> 地图</a> <a @click="showCardHandler"><i class="el-icon-map-location"></i> 地图</a>
</div> --> </div> -->
</div>
</div>
</div> </div>
<div class="flexOne-time"> </div>
<div class="time-box center"> </div>
<span>包车日期:</span> <div class="flexOne-time">
<div> <div class="time-box center">
<el-date-picker class="w150" v-model='SetOutTime' format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" <span>包车日期:</span>
:picker-options="beforeCheck" laceholder="包车日期" @change="getQuotation"> <div>
</el-date-picker> <el-date-picker class="w150" v-model='SetOutTime' format="yyyy-MM-dd" value-format="yyyy-MM-dd"
</div> type="date" :picker-options="beforeCheck" laceholder="包车日期" @change="getQuotation">
</div> </el-date-picker>
<div class="time-box time-box2 center" v-if="msg.OrderType!=3">
<span>选择机场:</span>
<div style="display: flex;">
<template v-for="x in AirportTypes">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
@click="msg.OrderId?changeDetailListHandler():changeDetailListHandler(x,1,msg.OrderId)">
<a>{{ x.AirportName }}</a>
</el-tag>
</template>
</div>
</div>
<!-- v-if="msg.OrderType!=1" -->
<div class="time-box time-box2 center" v-if="msg.OrderType!=1">
<span>上车范围:</span>
<div style="display: flex;">
<template v-for="x in PlaceTypes">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
@click="msg.OrderId?changeDetailListHandler(x,2,msg.OrderId):changeDetailListHandler(x,2,msg.OrderId)">
<a>{{ x.Address }}</a>
<span>{{ x.Range }}m范围</span>
</el-tag>
</template>
</div>
</div>
<!-- v-if="msg.OrderType!=2" -->
<div class="time-box time-box2 center" v-if="msg.OrderType!=2">
<span>下车范围:</span>
<div style="display: flex;">
<template v-for="x in PlaceTypes2">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
@click="msg.OrderId?changeDetailListHandler(x,4,msg.OrderId):changeDetailListHandler(x,4,msg.OrderId)">
<a>{{ x.Address }}</a>
<span>{{ x.Range }}m范围</span>
</el-tag>
</template>
</div>
</div>
<div class="time-box time-box2 center">
<span>选择车型:</span>
<div style="display: flex;">
<template v-for="x in types">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
@click="changeDetailListHandler(x,3)">
<a>{{ x.CarName }}</a>
<span v-if="x.B2BPrice>0">{{ x.B2BPrice.toFixed(2) }}</span>
</el-tag>
</template>
</div>
</div>
<div class="time-box">
<span>购买辆数:</span>
<div style="display: flex;flex-direction: column;">
<template v-for="x in types">
<el-input-number v-if="x.checked" v-model="x.num" @change="changePeople" :min="1" label="购买数量"
style="margin-bottom: 10px;"></el-input-number>
</template>
</div>
</div>
</div> </div>
</div> </div>
<div class="flexOne-form-bj"> <div class="time-box time-box2 center" v-if="msg.OrderType!=3">
<h3>订单信息</h3> <span>选择机场:</span>
<div class="flexOne-type"> <div style="display: flex;">
<b>訂單類型:</b> <template v-for="x in AirportTypes">
<div> <el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
<el-radio v-if="msg.OrderType==1" v-model="msg.OrderType" label="1">接机</el-radio> @click="msg.OrderId?changeDetailListHandler():changeDetailListHandler(x,1,msg.OrderId)">
<el-radio v-if="msg.OrderType==2" v-model="msg.OrderType" label="2" >送机</el-radio> <a>{{ x.AirportName }}</a>
<el-radio v-if="msg.OrderType==3" v-model="msg.OrderType" label="3" >包车</el-radio> </el-tag>
</div> </template>
</div> </div>
<div class="flexOne-description"> </div>
<b>产品详情</b> <!-- v-if="msg.OrderType!=1" -->
<p>{{detailsObj.Description}}</p> <div class="time-box time-box2 center" v-if="msg.OrderType!=1">
<span>上车范围:</span>
<div style="display: flex;">
<template v-for="x in PlaceTypes">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
@click="msg.OrderId?changeDetailListHandler(x,2,msg.OrderId):changeDetailListHandler(x,2,msg.OrderId)">
<a>{{ x.Address }}</a>
<span>{{ x.Range }}m范围</span>
</el-tag>
</template>
</div> </div>
<el-form label-width="80px" :model="msg" :rules="rules" ref="msg"> </div>
<div class="flexOne-infor-box" v-if="msg.OrderType!=3"> <!-- v-if="msg.OrderType!=2" -->
<b>航班信息</b> <div class="time-box time-box2 center" v-if="msg.OrderType!=2">
<div class="infor-list"> <span>下车范围:</span>
<div class="list-centent active"> <div style="display: flex;">
<li> <template v-for="x in PlaceTypes2">
<el-form-item label="航厦" prop="AirportTerminal"> <el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
<el-input v-model="msg.AirportTerminal" placeholder="输入航厦"/> @click="msg.OrderId?changeDetailListHandler(x,4,msg.OrderId):changeDetailListHandler(x,4,msg.OrderId)">
</el-form-item> <a>{{ x.Address }}</a>
</li> <span>{{ x.Range }}m范围</span>
<li> </el-tag>
<el-form-item label="航空公司" prop="AirLine"> </template>
<el-input v-model="msg.AirLine" placeholder="输入航空公司"/> </div>
</el-form-item> </div>
</li> <div class="time-box time-box2 center">
<li> <span>选择车型:</span>
<el-form-item label="航班号" prop="FlightNumber"> <div style="display: flex;">
<el-input v-model="msg.FlightNumber" placeholder="输入航班号"/> <template v-for="x in types">
</el-form-item> <el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;cursor: pointer;"
</li> @click="changeDetailListHandler(x,3)">
<li class="bottom"> <a>{{ x.CarName }}</a>
<el-form-item :label="msg.OrderType==1?'抵达时间':'出发时间'" prop="FlightTime"> <span v-if="x.B2BPrice>0">{{ x.B2BPrice.toFixed(2) }}</span>
<el-date-picker </el-tag>
v-model="msg.FlightTime" </template>
type="datetime" </div>
format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm" </div>
:placeholder="msg.OrderType==1?'选择抵达时间':'选择送机时间'" :picker-options="beforeCheck"> <div class="time-box">
</el-date-picker> <span>购买辆数:</span>
</el-form-item> <div style="display: flex;flex-direction: column;">
</li> <template v-for="x in types">
</div> <el-input-number v-if="x.checked" v-model="x.num" @change="changePeople" :min="1" label="购买数量"
</div> style="margin-bottom: 10px;"></el-input-number>
</template>
</div>
</div>
</div>
</div>
<div class="flexOne-form-bj">
<h3>订单信息</h3>
<div class="flexOne-type">
<b>訂單類型:</b>
<div>
<el-radio v-if="msg.OrderType==1" v-model="msg.OrderType" label="1">接机</el-radio>
<el-radio v-if="msg.OrderType==2" v-model="msg.OrderType" label="2">送机</el-radio>
<el-radio v-if="msg.OrderType==3" v-model="msg.OrderType" label="3">包车</el-radio>
</div>
</div>
<div class="flexOne-description">
<b>产品详情</b>
<p>{{detailsObj.Description}}</p>
</div>
<el-form label-width="80px" :model="msg" :rules="rules" ref="msg">
<div class="flexOne-infor-box" v-if="msg.OrderType!=3">
<b>航班信息</b>
<div class="infor-list">
<div class="list-centent active">
<li>
<el-form-item label="航厦" prop="AirportTerminal">
<el-input v-model="msg.AirportTerminal" placeholder="输入航厦" />
</el-form-item>
</li>
<li>
<el-form-item label="航空公司" prop="AirLine">
<el-input v-model="msg.AirLine" placeholder="输入航空公司" />
</el-form-item>
</li>
<li>
<el-form-item label="航班号" prop="FlightNumber">
<el-input v-model="msg.FlightNumber" placeholder="输入航班号" />
</el-form-item>
</li>
<li class="bottom">
<el-form-item :label="msg.OrderType==1?'抵达时间':'出发时间'" prop="FlightTime">
<el-date-picker v-model="msg.FlightTime" type="datetime" format="yyyy-MM-dd HH:mm"
value-format="yyyy-MM-dd HH:mm" :placeholder="msg.OrderType==1?'选择抵达时间':'选择送机时间'"
:picker-options="beforeCheck">
</el-date-picker>
</el-form-item>
</li>
</div> </div>
<div class="flexOne-infor-box"> </div>
<b><template v-if="msg.OrderType==1">接机</template><template v-if="msg.OrderType==2">送机</template><template v-if="msg.OrderType==3">包机</template>信息</b> </div>
<div class="infor-list"> <div class="flexOne-infor-box">
<div class="list-centent active"> <b><template v-if="msg.OrderType==1">接机</template><template v-if="msg.OrderType==2">送机</template><template
<li v-if="msg.OrderType!=1"> v-if="msg.OrderType==3">包机</template>信息</b>
<el-form-item label="上车地点" prop="GetonAddress"> <div class="infor-list">
<el-input type="textarea" :autosize="{ minRows: 1, maxRows: 4}" v-model="msg.GetonAddress" <div class="list-centent active">
placeholder="请输入上车地点"> <li v-if="msg.OrderType!=1">
<el-form-item label="上车地点" prop="GetonAddress">
</el-input> <el-input type="textarea" :autosize="{ minRows: 1, maxRows: 4}" v-model="msg.GetonAddress"
<!-- <span @click="clickMapAddress(1,1,msg.GetonAddress)" placeholder="请输入上车地点">
</el-input>
<!-- <span @click="clickMapAddress(1,1,msg.GetonAddress)"
class="el-icon-location" style="font-size: 16px;color: #E95252;position: absolute;right: 10px;top: 15px;"></span> --> class="el-icon-location" style="font-size: 16px;color: #E95252;position: absolute;right: 10px;top: 15px;"></span> -->
</el-form-item> </el-form-item>
</li> </li>
<li v-if="msg.OrderType!=2"> <li v-if="msg.OrderType!=2">
<el-form-item label="下车地点" prop="GetoffAddress" > <el-form-item label="下车地点" prop="GetoffAddress">
<el-input type="textarea" :autosize="{ minRows: 1, maxRows: 4}" v-model="msg.GetoffAddress" <el-input type="textarea" :autosize="{ minRows: 1, maxRows: 4}" v-model="msg.GetoffAddress"
placeholder="请输入下车地点"> placeholder="请输入下车地点">
</el-input> </el-input>
<!-- <span @click="clickMapAddress(2,2,msg.GetoffAddress)" <!-- <span @click="clickMapAddress(2,2,msg.GetoffAddress)"
class="el-icon-location" style="font-size: 16px;color: #E95252;position: absolute;right: 10px;top: 15px;"></span> --> class="el-icon-location" style="font-size: 16px;color: #E95252;position: absolute;right: 10px;top: 15px;"></span> -->
</el-form-item> </el-form-item>
</li> </li>
<li class="bottom"> <li class="bottom">
<el-form-item label="预定时间" prop="OrderDate"> <el-form-item label="预定时间" prop="OrderDate">
<el-date-picker <el-date-picker v-model="msg.OrderDate" type="datetime" format="yyyy-MM-dd HH:mm"
v-model="msg.OrderDate" value-format="yyyy-MM-dd HH:mm" placeholder="选择预定时间" :picker-options="beforeCheck"
type="datetime" @change="getTime">
format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm" </el-date-picker>
placeholder="选择预定时间" :picker-options="beforeCheck" @change="getTime"> </el-form-item>
</el-date-picker> </li>
</el-form-item>
</li>
</div>
</div>
</div> </div>
<div class="flexOne-infor-box"> </div>
<b>乘客信息</b> </div>
<div class="infor-list"> <div class="flexOne-infor-box">
<!-- :class="{'activeB':msg.OrderType!=3}" --> <b>乘客信息</b>
<div class="list-centent active"> <div class="infor-list">
<li> <!-- :class="{'activeB':msg.OrderType!=3}" -->
<el-form-item label="成人数" prop="ManNum"> <div class="list-centent active">
<el-input type="Number" v-model="msg.ManNum" placeholder="输入成人数"/> <li>
</el-form-item> <el-form-item label="成人数" prop="ManNum">
</li> <el-input type="Number" v-model="msg.ManNum" placeholder="输入成人数" />
<li> </el-form-item>
<el-form-item label="儿童数" prop=""> </li>
<el-input type="Number" v-model="msg.ChildNum" placeholder="输入儿童数"/> <li>
</el-form-item> <el-form-item label="儿童数" prop="">
</li> <el-input type="Number" v-model="msg.ChildNum" placeholder="输入儿童数" />
<li> </el-form-item>
<el-form-item label="婴儿数" prop=""> </li>
<el-input type="Number" v-model="msg.BabyNum" placeholder="输入婴儿数"/> <li>
</el-form-item> <el-form-item label="婴儿数" prop="">
</li> <el-input type="Number" v-model="msg.BabyNum" placeholder="输入婴儿数" />
<template v-if="msg.OrderType!=3"> </el-form-item>
</li>
<template v-if="msg.OrderType!=3">
<li> <li>
<el-form-item label="手提行李" prop=""> <el-form-item label="手提行李" prop="">
<el-input type="Number" v-model="msg.HandLuggageNum" placeholder="手提行李数"/> <el-input type="Number" v-model="msg.HandLuggageNum" placeholder="手提行李数" />
</el-form-item> </el-form-item>
</li> </li>
<li> <li>
<el-form-item label="托运行李" prop=""> <el-form-item label="托运行李" prop="">
<el-input type="Number" v-model="msg.RegisteredLuggageNum" placeholder="托运行李数"/> <el-input type="Number" v-model="msg.RegisteredLuggageNum" placeholder="托运行李数" />
</el-form-item> </el-form-item>
</li> </li>
</template> </template>
</div>
</div>
</div> </div>
<div class="flexOne-infor-box"> </div>
<b>联络信息</b> </div>
<div class="infor-list"> <div class="flexOne-infor-box">
<div class="list-centent active"> <b>联络信息</b>
<li> <div class="infor-list">
<el-form-item label="姓" prop="SurName"> <div class="list-centent active">
<el-input v-model="msg.SurName" placeholder="请输入姓"/> <li>
</el-form-item> <el-form-item label="姓" prop="SurName">
</li> <el-input v-model="msg.SurName" placeholder="请输入姓" />
<li> </el-form-item>
<el-form-item label="名" prop="Name"> </li>
<el-input v-model="msg.Name" placeholder="请输入名"/> <li>
</el-form-item> <el-form-item label="名" prop="Name">
<el-input v-model="msg.Name" placeholder="请输入名" />
</el-form-item>
</li>
<li>
<el-form-item label="电话" prop="Mobile">
<el-input type="Number" v-model="msg.Mobile" placeholder="请输入电话" />
</el-form-item>
</li>
<li class="bottom">
<el-form-item label="性别" prop="Sex">
<el-radio v-model="msg.Sex" label="1"></el-radio>
<el-radio v-model="msg.Sex" label="2"></el-radio>
</el-form-item>
</li> </li>
<li>
<el-form-item label="电话" prop="Mobile">
<el-input type="Number" v-model="msg.Mobile" placeholder="请输入电话"/>
</el-form-item>
</li>
<li class="bottom">
<el-form-item label="性别" prop="Sex">
<el-radio v-model="msg.Sex" label="1"></el-radio>
<el-radio v-model="msg.Sex" label="2" ></el-radio>
</el-form-item>
</li>
</div>
</div>
<div style="margin-top: 20px;">
<el-input style="width: 100%;" type="textarea" :autosize="{ minRows: 2, maxRows: 4}"
v-model="msg.Remark" placeholder="订单备注"/>
</div> </div>
</div> </div>
</el-form> <div style="margin-top: 20px;">
<el-input style="width: 100%;" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" v-model="msg.Remark"
placeholder="订单备注" />
</div>
</div> </div>
</el-form>
</div>
<div class="notice"> <div class="notice">
<b>预定须知</b> <b>预定须知</b>
<p>{{detailsObj.BuyNotes}}</p> <p>{{detailsObj.BuyNotes}}</p>
</div> </div>
</div> </div>
<div class="flexOne-right"> <div class="flexOne-right">
<h4>结算账单</h4> <h4>结算账单</h4>
<div class="right-text"> <div class="right-text">
<b>取消限制</b> <b>取消限制</b>
<p>{{detailsObj.CancelPolicy}}</p> <p>{{detailsObj.CancelPolicy}}</p>
</div> </div>
<div class="right-form"> <div class="right-form">
<h6>订单明细</h6> <h6>订单明细</h6>
<div class="right-form-list"> <div class="right-form-list">
<template v-if="isCheck"> <template v-if="isCheck">
<template v-for="x in types"> <template v-for="x in types">
<div class="right-list" v-if="x.checked"> <div class="right-list" v-if="x.checked">
<div class="right-list-left"> <div class="right-list-left">
<el-tag class="leftText" size="mini" type="danger">{{x.CarName}}</el-tag> <el-tag class="leftText" size="mini" type="danger">{{x.CarName}}</el-tag>
</div>
<div class="right-list-right">
{{x.B2BPrice.toFixed(2)}} x {{x.num}}
</div>
</div> </div>
</template> <div class="right-list-right">
</template> {{x.B2BPrice.toFixed(2)}} x {{x.num}}
<div v-else class="noData">没有选择车型</div> </div>
</div> </div>
</div> </template>
<div class="right-Money"> </template>
<div> <div v-else class="noData">没有选择车型</div>
<span>订单总金额:</span> </div>
<b>{{ msg.Money.toFixed(2) }} <span class="fz12">{{detailsObj.CurrencyName}}</span></b> </div>
</div> <div class="right-Money">
</div> <div>
<div class="right-Submit"> <span>订单总金额:</span>
<!-- <el-button v-if="!isCheck" class="hollowFixedBtn" type="primary"> <b>{{ msg.Money.toFixed(2) }} <span class="fz12">{{detailsObj.CurrencyName}}</span></b>
</div>
</div>
<div class="right-Submit">
<!-- <el-button v-if="!isCheck" class="hollowFixedBtn" type="primary">
提交订单 提交订单
</el-button> --> </el-button> -->
<el-button :disabled="!isCheck" <el-button :disabled="!isCheck" :loading="loading" class="normalBtn" type="primary" @click="submit">
:loading="loading" 提交订单
class="normalBtn" type="primary" @click="submit"> </el-button>
提交订单 </div>
</el-button> </div>
</div> <!-- 选择地址 -->
</div> <el-dialog custom-class="mapList" title="地图选址" center :visible.sync="selectAddress">
<!-- 选择地址 --> <Map @refList="selectAddress = false" v-on:headCallBack="headCall" v-bind:Address="Address" :type="MapType"
<el-dialog custom-class="mapList" title="地图选址" center :visible.sync="selectAddress"> :index="index" :GetOff="MapType==1?GetOnTheBusObj:GetOffTheBusIdObj"></Map>
<Map @refList="selectAddress = false" v-on:headCallBack="headCall" v-bind:Address="Address" </el-dialog>
:type="MapType" :index="index" :GetOff="MapType==1?GetOnTheBusObj:GetOffTheBusIdObj"></Map> <!-- 包车产品详情信息 -->
</el-dialog> <el-dialog custom-class="w1000" title="包车产品详情" :visible.sync="showDetails" center @close="showDetails=false">
<!-- 包车产品详情信息 -->
<el-dialog custom-class="w1000" title="包车产品详情" :visible.sync="showDetails" center @close="showDetails=false">
<Details :detailsObj="detailsRow"></Details> <Details :detailsObj="detailsRow"></Details>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import Map from "../../public/Map.vue"; import Map from "../../public/Map.vue";
import Details from './components/Details.vue' import Details from './components/Details.vue'
export default { export default {
components: { Details,Map }, components: {
data() { Details,
return { Map
index: 1, },
Address: '', data() {
selectAddress: false, return {
MapType: 1, index: 1,
GetOnTheBusObj: '', Address: '',
GetOffTheBusIdObj: '', selectAddress: false,
PlaceTypes2:[], MapType: 1,
PlaceTypes:[], GetOnTheBusObj: '',
AirportTypes:[], GetOffTheBusIdObj: '',
isCheck:true, PlaceTypes2: [],
showDetails: false, PlaceTypes: [],
loading: false, AirportTypes: [],
msg: { isCheck: true,
OrderId: 0, showDetails: false,
OrderType: 0, loading: false,
OrderDate:'',//预定日期 msg: {
Unit_Price: '',//单价 OrderId: 0,
Num: '',//数量 OrderType: 0,
Money: 0.0, OrderDate: '', //预定日期
Sex: '1',//1男2女 Unit_Price: '', //单价
SurName: '',//姓 Num: '', //数量
Name: '',//名 Money: 0.0,
Remark: '', Sex: '1', //1男2女
AirportId: '', SurName: '', //姓
AirportTerminal: '',//航厦 Name: '', //名
AirLine: '',//航空公司名称 Remark: '',
FlightNumber: '',//航班号 AirportId: '',
FlightTime: '',//航班时间 AirportTerminal: '', //航厦
GetonAddress: '',//上车点 AirLine: '', //航空公司名称
GetoffAddress: '',//下车点 FlightNumber: '', //航班号
ManNum: null,//成人数 FlightTime: '', //航班时间
ChildNum: null,//儿童数 GetonAddress: '', //上车点
BabyNum: null,//婴儿数 GetoffAddress: '', //下车点
HandLuggageNum: null,//手提行李数量 ManNum: null, //成人数
RegisteredLuggageNum: null,//托运行李数量 ChildNum: null, //儿童数
ContactWay: '',//联络方式 WeChat BabyNum: null, //婴儿数
Mobile:'',//电话 HandLuggageNum: null, //手提行李数量
ProductId: '', RegisteredLuggageNum: null, //托运行李数量
CarId: '',//产品类型ID ContactWay: '', //联络方式 WeChat
LureEmpId: 0, Mobile: '', //电话
CRMGuestId: 0, ProductId: '',
}, CarId: '', //产品类型ID
types: [], LureEmpId: 0,
isCheck: false, CRMGuestId: 0,
SetOutTime: '', },
detailsObj: {}, types: [],
beforeCheck: { isCheck: false,
disabledDate: time => { SetOutTime: '',
let endTime = new Date(this.getBeforeDate(1,new Date().Format("yyyy-MM-dd"))); detailsObj: {},
return time && endTime.getTime() >= time.getTime(); beforeCheck: {
} disabledDate: time => {
}, let endTime = new Date(this.getBeforeDate(1, new Date().Format("yyyy-MM-dd")));
rules:{ return time && endTime.getTime() >= time.getTime();
AirportTerminal: [{ }
required: true, },
message: '请输入航厦', rules: {
trigger: 'blur' AirportTerminal: [{
}], required: true,
AirLine: [{ message: '请输入航厦',
required: true, trigger: 'blur'
message: '请输入航空公司名称', }],
trigger: 'blur' AirLine: [{
}], required: true,
FlightNumber: [{ message: '请输入航空公司名称',
required: true, trigger: 'blur'
message: '请输入航班号', }],
trigger: 'blur' FlightNumber: [{
}], required: true,
FlightTime: [{ message: '请输入航班号',
required: true, trigger: 'blur'
message: '请选择时间', }],
trigger: 'change' FlightTime: [{
}], required: true,
GetonAddress: [{ message: '请选择时间',
required: true, trigger: 'change'
message: '请输入上车地点', }],
trigger: 'blur' GetonAddress: [{
}], required: true,
GetoffAddress: [{ message: '请输入上车地点',
required: true, trigger: 'blur'
message: '请输入下车地点', }],
trigger: 'blur' GetoffAddress: [{
}], required: true,
OrderDate: [{ message: '请输入下车地点',
required: true, trigger: 'blur'
message: '请选择预定时间', }],
trigger: 'blur' OrderDate: [{
}], required: true,
ManNum:[{ message: '请选择预定时间',
required: true, trigger: 'blur'
message: '输入成人数', }],
trigger: 'blur' ManNum: [{
}], required: true,
SurName: [{ message: '输入成人数',
required: true, trigger: 'blur'
message: '请输入姓', }],
trigger: 'blur' SurName: [{
}], required: true,
Name: [{ message: '请输入姓',
required: true, trigger: 'blur'
message: '请输入名', }],
trigger: 'blur' Name: [{
}], required: true,
EName: [{ message: '请输入名',
required: true, trigger: 'blur'
message: '请输入英文名', }],
trigger: 'blur' EName: [{
}], required: true,
Mobile: [ message: '请输入英文名',
{ required: true, message: "请输入联系电话", trigger: "blur" }, trigger: 'blur'
{ }],
pattern: this.$commonUtils.Regex.el_ISphone, Mobile: [{
message: "请输入正确的电话" required: true,
} message: "请输入联系电话",
], trigger: "blur"
}, },
detailsRow: null,
crmOrderObj: null ],
};
}, },
methods: { detailsRow: null,
clickMapAddress(type, index, Address) { crmOrderObj: null
this.index = index };
this.MapType = type },
this.Address = Address methods: {
this.selectAddress = true clickMapAddress(type, index, Address) {
}, this.index = index
headCall(msg, type, index, address_detail) { this.MapType = type
if(type==1){ this.Address = Address
this.msg.GetonAddress = address_detail this.selectAddress = true
}else{ },
this.msg.GetoffAddress = address_detail headCall(msg, type, index, address_detail) {
} if (type == 1) {
}, this.msg.GetonAddress = address_detail
getTime(){ } else {
this.SetOutTime = this.msg.OrderDate this.msg.GetoffAddress = address_detail
}, }
submit(){ },
this.$refs['msg'].validate((valid) => { getTime() {
if (valid) { this.SetOutTime = this.msg.OrderDate
this.setFormMsg() },
} else { submit() {
return false; this.$refs['msg'].validate((valid) => {
} if (valid) {
this.setFormMsg()
} else {
return false;
}
});
},
setFormMsg() {
this.types.forEach(x => {
if (x.checked) {
this.msg.Unit_Price = x.B2BPrice
this.msg.Num = x.num
}
})
this.loading = true
this.apipost("CarSingle_post_SetSaleCarOrder", this.msg,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.Success('下单成功');
this.$router.push({
path: `/CharterOrderList?Type=${this.msg.OrderType}`,
}); });
} else {
this.Error(res.data.message)
}
}, },
setFormMsg(){ err => {
this.types.forEach(x=>{ this.Error(err.message)
if(x.checked){ });
this.msg.Unit_Price = x.B2BPrice },
this.msg.Num = x.num changePeople(val) {
} this.getNum()
}) },
this.loading = true getNum() {
this.apipost("CarSingle_post_SetSaleCarOrder", this.msg, this.types.forEach(x => {
res => { if (x.num > x.RemainingInventory) {
this.loading = false; x.num = x.RemainingInventory
if (res.data.resultCode == 1) { }
this.Success('下单成功'); })
this.$router.push({ setTimeout(() => {
path: `/CharterOrderList?Type=${this.msg.OrderType}`, this.calcMoneyHandler()
}); }, 50)
} else { },
this.Error(res.data.message) calcMoneyHandler() {
} this.msg.Money = 0.0
}, this.types.forEach(x => {
err => { if (x.checked) {
this.Error(err.message) this.msg.Money += x.B2BPrice * x.num
}); }
}, })
changePeople(val) { },
this.getNum() changeDetailListHandler(e, i, OrderId) {
}, if (i == 1) {
getNum(){ if (!OrderId) {
this.types.forEach(x=>{ this.AirportTypes.forEach(x => {
if(x.num>x.RemainingInventory){ x.checked = false
x.num = x.RemainingInventory
}
})
setTimeout(()=>{
this.calcMoneyHandler()
},50)
},
calcMoneyHandler(){
this.msg.Money=0.0
this.types.forEach(x=>{
if(x.checked){
this.msg.Money+=x.B2BPrice*x.num
}
}) })
}, e.checked = !e.checked
changeDetailListHandler(e,i,OrderId) { let AirportTypes = this.AirportTypes.filter(x => x.checked)
if(i==1){ if (AirportTypes && AirportTypes[0]) {
if(!OrderId){ this.msg.AirportId = AirportTypes[0].AirportId
this.AirportTypes.forEach(x=>{
x.checked = false
})
e.checked = !e.checked
let AirportTypes = this.AirportTypes.filter(x => x.checked)
if(AirportTypes&&AirportTypes[0]){
this.msg.AirportId = AirportTypes[0].AirportId
}
if(this.AirportTypes.findIndex(x => x.checked) > -1) this.getQuotation()
}
}
if(i==2){
// if(!OrderId){
this.PlaceTypes.forEach(x=>{
x.checked = false
})
e.checked = !e.checked
let PlaceTypes = this.PlaceTypes.filter(x => x.checked)
if(PlaceTypes&&PlaceTypes[0]){
this.GetOnTheBusObj = PlaceTypes[0]
}
// }
}
if(i==4){
// if(!OrderId){
this.PlaceTypes2.forEach(x=>{
x.checked = false
})
e.checked = !e.checked
let PlaceTypes2 = this.PlaceTypes2.filter(x => x.checked)
if(PlaceTypes2&&PlaceTypes2[0]){
this.GetOffTheBusIdObj = PlaceTypes2[0]
}
// }
} }
if(i==3){ if (this.AirportTypes.findIndex(x => x.checked) > -1) this.getQuotation()
this.types.forEach(x=>{ }
if(x.Id!=e.Id){ }
x.checked = false if (i == 2) {
} // if(!OrderId){
}) this.PlaceTypes.forEach(x => {
if (e.checked) { x.checked = false
e.num = 1 })
} e.checked = !e.checked
e.checked = !e.checked let PlaceTypes = this.PlaceTypes.filter(x => x.checked)
let types = this.types.filter(x => x.checked) if (PlaceTypes && PlaceTypes[0]) {
if(types&&types[0]){ this.GetOnTheBusObj = PlaceTypes[0]
this.msg.CarId = types[0].Id }
this.getQuotation() // }
} }
this.isCheck = this.types.findIndex(x => x.checked) > -1 if (i == 4) {
// if(!OrderId){
this.PlaceTypes2.forEach(x => {
x.checked = false
})
e.checked = !e.checked
let PlaceTypes2 = this.PlaceTypes2.filter(x => x.checked)
if (PlaceTypes2 && PlaceTypes2[0]) {
this.GetOffTheBusIdObj = PlaceTypes2[0]
}
// }
}
if (i == 3) {
this.types.forEach(x => {
if (x.Id != e.Id) {
x.checked = false
} }
})
if (e.checked) {
e.num = 1
}
e.checked = !e.checked
let types = this.types.filter(x => x.checked)
if (types && types[0]) {
this.msg.CarId = types[0].Id
this.getQuotation()
}
this.isCheck = this.types.findIndex(x => x.checked) > -1
}
this.changePeople() this.changePeople()
this.$forceUpdate() this.$forceUpdate()
},
// 获取报价
getQuotation() {
this.apipost(
"CarSingle_post_GetSaleCarSingleProductMonthPrice", {
AirportId: this.msg.AirportId,
CarTypeId: this.msg.CarId,
Month: this.SetOutTime,
ProductId: this.msg.ProductId,
}, },
// 获取报价 res => {
getQuotation(){ if (res.data.resultCode == 1) {
this.apipost( let SetOutTime = this.SetOutTime.length > 10 ? this.SetOutTime.slice(0, 10) : this.SetOutTime
"CarSingle_post_GetSaleCarSingleProductMonthPrice", let newData = res.data.data.filter(x => x.Date == SetOutTime)
{ let types = this.types.filter(x => x.checked)
AirportId: this.msg.AirportId, newData.length > 0 && this.types.forEach((item, index) => {
CarTypeId: this.msg.CarId, if (this.msg.CarId == item.Id && newData[0].Price) {
Month: this.SetOutTime, item.B2BPrice = newData[0].Price
ProductId: this.msg.ProductId, this.msg.Unit_Price = newData[0].Price
}, } else {
res => { item.B2BPrice = 0.0
if (res.data.resultCode == 1) {
let SetOutTime = this.SetOutTime.length>10?this.SetOutTime.slice(0,10):this.SetOutTime
let newData = res.data.data.filter(x=>x.Date==SetOutTime)
let types = this.types.filter(x => x.checked)
newData.length>0&&this.types.forEach((item,index) => {
if(this.msg.CarId==item.Id&&newData[0].Price){
item.B2BPrice = newData[0].Price
this.msg.Unit_Price = newData[0].Price
}else{
item.B2BPrice = 0.0
}
});
this.calcMoneyHandler()
} }
});
this.calcMoneyHandler()
}
}) })
}, },
getInfo(){ getInfo() {
this.apipost( this.apipost(
"CarSingle_post_GetSaleCarSingleProductInfo", "CarSingle_post_GetSaleCarSingleProductInfo", {
{ ProductId: this.msg.ProductId,
ProductId: this.msg.ProductId,
},
res => {
if (res.data.resultCode == 1) {
this.detailsObj = res.data.data
this.msg.OrderType = String(this.detailsObj.CarType)
let addList = function (arr) {
arr.forEach(item => {
item.checked = false
item.num = 1
item.B2BPrice = 0
});
};
addList(res.data.data.AirportList);
addList(res.data.data.PlaceList);
addList(res.data.data.CarTypeList);
this.AirportTypes = res.data.data.AirportList
if(this.AirportTypes.length>0){
this.changeDetailListHandler(this.AirportTypes[0],1,this.msg.OrderId)
}
this.PlaceTypes = JSON.parse(JSON.stringify(res.data.data.PlaceList))
if(this.PlaceTypes.length>0){
this.changeDetailListHandler(this.PlaceTypes[0],2,this.msg.OrderId)
}
this.PlaceTypes2 = JSON.parse(JSON.stringify(res.data.data.PlaceList))
if(this.PlaceTypes2.length>0){
this.changeDetailListHandler(this.PlaceTypes2[0],4,this.msg.OrderId)
}
this.types = res.data.data.CarTypeList
if(this.types&&this.types.length==0){
message.errorMsg(`${t('v102.ticket.nobj')}`)
}
}else{
this.Error(res.data.message)
}
},
err => {}
);
}, },
// 获取订单详情 res => {
getOrderInfo(){ if (res.data.resultCode == 1) {
this.apipost( this.detailsObj = res.data.data
"CarSingle_post_GetSaleMyCarOrderInfo", this.msg.OrderType = String(this.detailsObj.CarType)
{ let addList = function (arr) {
OrderId: this.msg.OrderId, arr.forEach(item => {
}, item.checked = false
res => { item.num = 1
if (res.data.resultCode == 1) { item.B2BPrice = 0
this.SetOutTime = res.data.data.OrderDate.substr(0,10) });
this.msg = { };
OrderId: res.data.data.OrderId, addList(res.data.data.AirportList);
OrderType: String(res.data.data.OrderType), addList(res.data.data.PlaceList);
OrderDate: res.data.data.OrderDate,//预定日期 addList(res.data.data.CarTypeList);
Unit_Price: res.data.data.Unit_Price,//单价 this.AirportTypes = res.data.data.AirportList
Num: res.data.data.Num,//数量 if (this.AirportTypes.length > 0) {
Money: res.data.data.Money, this.changeDetailListHandler(this.AirportTypes[0], 1, this.msg.OrderId)
Sex: String(res.data.data.Sex),//1男2女 }
SurName: res.data.data.SurName,//姓 this.PlaceTypes = JSON.parse(JSON.stringify(res.data.data.PlaceList))
Name: res.data.data.Name,//名 if (this.PlaceTypes.length > 0) {
Remark: res.data.data.Remark, this.changeDetailListHandler(this.PlaceTypes[0], 2, this.msg.OrderId)
AirportId: res.data.data.AirportId, }
AirportTerminal: res.data.data.AirportTerminal,//航厦 this.PlaceTypes2 = JSON.parse(JSON.stringify(res.data.data.PlaceList))
AirLine: res.data.data.AirLine,//航空公司名称 if (this.PlaceTypes2.length > 0) {
FlightNumber: res.data.data.FlightNumber,//航班号 this.changeDetailListHandler(this.PlaceTypes2[0], 4, this.msg.OrderId)
FlightTime: res.data.data.FlightTime,//航班时间 }
GetonAddress: res.data.data.GetonAddress,//上车点 this.types = res.data.data.CarTypeList
GetoffAddress: res.data.data.GetoffAddress,//下车点 if (this.types && this.types.length == 0) {
ManNum: String(res.data.data.ManNum),//成人数 message.errorMsg(`${t('v102.ticket.nobj')}`)
ChildNum: String(res.data.data.ChildNum),//儿童数 }
BabyNum: String(res.data.data.BabyNum),//婴儿数
HandLuggageNum: String(res.data.data.HandLuggageNum),//手提行李数量
RegisteredLuggageNum: String(res.data.data.RegisteredLuggageNum),//托运行李数量
ContactWay: res.data.data.ContactWay,//联络方式 WeChat
Mobile: res.data.data.Mobile,//电话
ProductId: res.data.data.ProductId,
CarId: res.data.data.CarId,//产品类型ID
}
this.getQuotation()
this.AirportTypes.forEach(x=>{
if(x.AirportId==res.data.data.AirportId){
this.changeDetailListHandler(x,1)
}
})
this.types.forEach(x=>{
if(x.Id==res.data.data.CarId){
x.num = res.data.data.Num
x.B2BPrice = res.data.data.Unit_Price
this.changeDetailListHandler(x,3)
}
})
}
}) } else {
}, this.Error(res.data.message)
showCardHandler() { }
this.detailsRow = JSON.parse(JSON.stringify(this.detailsObj))
this.showDetails = true
}, },
err => {}
);
},
// 获取订单详情
getOrderInfo() {
this.apipost(
"CarSingle_post_GetSaleMyCarOrderInfo", {
OrderId: this.msg.OrderId,
},
res => {
if (res.data.resultCode == 1) {
this.SetOutTime = res.data.data.OrderDate.substr(0, 10)
this.msg = {
OrderId: res.data.data.OrderId,
OrderType: String(res.data.data.OrderType),
OrderDate: res.data.data.OrderDate, //预定日期
Unit_Price: res.data.data.Unit_Price, //单价
Num: res.data.data.Num, //数量
Money: res.data.data.Money,
Sex: String(res.data.data.Sex), //1男2女
SurName: res.data.data.SurName, //姓
Name: res.data.data.Name, //名
Remark: res.data.data.Remark,
AirportId: res.data.data.AirportId,
AirportTerminal: res.data.data.AirportTerminal, //航厦
AirLine: res.data.data.AirLine, //航空公司名称
FlightNumber: res.data.data.FlightNumber, //航班号
FlightTime: res.data.data.FlightTime, //航班时间
GetonAddress: res.data.data.GetonAddress, //上车点
GetoffAddress: res.data.data.GetoffAddress, //下车点
ManNum: String(res.data.data.ManNum), //成人数
ChildNum: String(res.data.data.ChildNum), //儿童数
BabyNum: String(res.data.data.BabyNum), //婴儿数
HandLuggageNum: String(res.data.data.HandLuggageNum), //手提行李数量
RegisteredLuggageNum: String(res.data.data.RegisteredLuggageNum), //托运行李数量
ContactWay: res.data.data.ContactWay, //联络方式 WeChat
Mobile: res.data.data.Mobile, //电话
ProductId: res.data.data.ProductId,
CarId: res.data.data.CarId, //产品类型ID
}
this.getQuotation()
this.AirportTypes.forEach(x => {
if (x.AirportId == res.data.data.AirportId) {
this.changeDetailListHandler(x, 1)
}
})
this.types.forEach(x => {
if (x.Id == res.data.data.CarId) {
x.num = res.data.data.Num
x.B2BPrice = res.data.data.Unit_Price
this.changeDetailListHandler(x, 3)
}
})
}, }
mounted() {
// crm自动登陆传过来的参数 })
if(this.$route.query.crmOrderObj){ },
this.crmOrderObj = JSON.parse(this.$route.query.crmOrderObj) showCardHandler() {
this.msg.LureEmpId = this.crmOrderObj.LureEmpId//引流id this.detailsRow = JSON.parse(JSON.stringify(this.detailsObj))
this.msg.CRMGuestId = this.crmOrderObj.CRMGuestId //客人ID this.showDetails = true
} },
},
created() { },
this.msg.OrderId = this.$route.query.OrderId mounted() {
this.msg.ProductId = this.$route.query.id // crm自动登陆传过来的参数
this.SetOutTime = this.$route.query.OrderDate if (this.$route.query.crmOrderObj) {
// this.msg.OrderDate = this.$route.query.OrderDate+ ' 00:00' this.crmOrderObj = JSON.parse(this.$route.query.crmOrderObj)
this.getInfo() this.msg.LureEmpId = this.crmOrderObj.LureEmpId //引流id
if(this.msg.OrderId){ this.msg.CRMGuestId = this.crmOrderObj.CRMGuestId //客人ID
this.getOrderInfo() }
} },
} created() {
}; this.msg.OrderId = this.$route.query.OrderId
this.msg.ProductId = this.$route.query.id
this.SetOutTime = this.$route.query.OrderDate
// this.msg.OrderDate = this.$route.query.OrderDate+ ' 00:00'
this.getInfo()
if (this.msg.OrderId) {
this.getOrderInfo()
}
}
};
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment