Skip to content

S
SuperMan
Commit eb7e1677 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 4c209a7b
Hide whitespace changes
Inline Side-by-side
Showing with 660 additions and 608 deletions
src/components/scenicSpot/Singleticket/OrderPreview.vue
View file @ eb7e1677
<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{
.time-box.time-box2 .time-box-width span {
width: auto; 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 !important;
}
.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{
width: 25%;
}
.list-centent li {
width: 33.33%;
}
.list-centent.active li {
width: 25%;
}
.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 {
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 !important;
}
.time-box.center {
align-items: center;
}
.time-box>span {
/* width: 100px; */
flex-shrink: 0;
font-size: 13px;
color: #181C32;
margin-right: 40px;
}
.flexOne-right{ .flexOne-type {
width: 300px; display: flex;
flex-shrink: 0; align-items: center;
margin-left: 20px; padding: 0 0 20px 0;
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{
padding: 20px 0;
}
.right-list{
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 6px;
}
.right-list-right{
font-size: 13px;
color: #181C32;
padding: 0 0 0 5px;
}
.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;
}
</style> .flexOne-type b {
<template> font-size: 13px;
<div class="flexOne"> width: 100px;
<div class="flexOne-left"> flex-shrink: 0;
<div class="flexOne-form-bj"> }
<h3>票券信息</h3>
<div class="listone-form"> .flexOne-type div {
<el-image v-if="detailsObj.PicPathList" class="listone-img" :src="detailsObj.PicPathList[0]" fit="contain"> display: flex;
<div slot="placeholder" class="image-slot"> }
<span>
加载中<span class="dot">...</span> .flexOne-description {
</span> padding: 15px 15px;
</div> border-radius: 5px;
<div slot="error" class="image-slot"> background: #E1F5FE;
<i class="el-icon-picture-outline"></i> margin-bottom: 20px;
</div> }
</el-image>
<div class="listone-list"> .flexOne-description b {
<div class="list-left"> font-size: 14px;
<h6 @click="showCardHandler">{{detailsObj.Name}}</h6> }
<p style="color: #9e9e9e;font-size: 13px;">请在游玩前一天的23:00前完成预定</p>
<div v-if="crmOrderObj"> .flexOne-description p {
<span style="color: red;">引流人：{{crmOrderObj.LureEmpNmae}} </span> font-size: 12px;
<span style="color: #2AAEF2;">/客人：{{crmOrderObj.CRMGuestName}}</span> color: #4C5759;
</div> padding: 10px 0 0 0;
<!-- <div> }
.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 {
width: 25%;
}
.list-centent li {
width: 33.33%;
}
.list-centent.active li {
width: 25%;
}
.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 {
padding: 20px 0;
}
.right-list {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 6px;
}
.right-list-right {
font-size: 13px;
color: #181C32;
padding: 0 0 0 5px;
}
.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;
}
</style>
<template>
<div class="flexOne">
<div class="flexOne-left">
<div class="flexOne-form-bj">
<h3>票券信息</h3>
<div class="listone-form">
<el-image v-if="detailsObj.PicPathList" class="listone-img" :src="detailsObj.PicPathList[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.CityName}} {{detailsObj.Address}}</span> <span>地址： {{detailsObj.CityName}} {{detailsObj.Address}}</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>
<div class="flexOne-time"> </div>
<div class="time-box center"> <div class="flexOne-time">
<span>游玩日期：</span> <div class="time-box center">
<div> <span>游玩日期：</span>
<el-date-picker class="w150" v-model='msg.UseDate' format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date" <div>
:picker-options="beforeCheck" laceholder="门票日期" @change="getInfo"> <el-date-picker class="w150" v-model='msg.UseDate' format="yyyy-MM-dd" value-format="yyyy-MM-dd"
</el-date-picker> type="date" :picker-options="beforeCheck" laceholder="门票日期" @change="getInfo">
</div> </el-date-picker>
</div> </div>
<div class="time-box time-box2 center"> </div>
<span>选择票型：</span> <div class="time-box time-box2 center">
<div style="display: flex;flex-wrap: wrap;"> <span>选择票型：</span>
<template v-for="x in types"> <div style="display: flex;flex-wrap: wrap;">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;margin-bottom: 5px; cursor: pointer;" <template v-for="x in types">
@click="changeDetailListHandler(x)"> <el-tag class="time-box-width" :type="x.checked?'':'info'"
<a>{{ x.TicketName }}</a> style="margin-right: 10px;margin-bottom: 5px; cursor: pointer;" @click="changeDetailListHandler(x)">
<p style="display: inline-block;margin-left: 5px;"> <a>{{ x.TicketName }}</a>
<a style="display: inline-block;border-left: 1px solid #E9E9EB;line-height: 17px;padding: 0 0 0 8px;"> <p style="display: inline-block;margin-left: 5px;">
<a
style="display: inline-block;border-left: 1px solid #E9E9EB;line-height: 17px;padding: 0 0 0 8px;">
{{x.B2BPrice.toFixed(2)}}</a> {{x.B2BPrice.toFixed(2)}}</a>
</p> </p>
</el-tag> </el-tag>
</template> </template>
</div>
</div>
<div class="time-box">
<span>购买张数：</span>
<div style="display: flex;flex-direction: column;">
<template v-for="x in types">
<div style="flex-direction: row;" v-if="x.checked">
<el-input-number v-model="x.num" @change="changePeople" :min="1" label="购买数量"
style="margin-bottom: 10px;"></el-input-number>
<!-- <span> {{x.CurrencyName
}} </span> -->
</div>
</template>
</div>
</div> </div>
</div> </div>
</div> <div class="time-box">
<div class="flexOne-form-bj"> <span>购买张数：</span>
<h3>取票方式</h3> <div style="display: flex;flex-direction: column;">
<div class="flexOne-type"> <template v-for="x in types">
<b>取票方式：</b> <div style="flex-direction: row;" v-if="x.checked">
<div> {{x.TicketName}}：
<el-radio v-model="msg.MailingState" label="1" @change="changePeople">自行取票</el-radio> <el-input-number v-model="x.num" @change="changePeople" :min="1" label="购买数量"
<el-radio v-model="msg.MailingState" label="2" @change="changePeople">邮寄票券</el-radio> style="margin-bottom: 10px;"></el-input-number>
<el-radio v-model="msg.MailingState" label="4" @change="changePeople">电子券</el-radio> </div>
</template>
</div> </div>
</div> </div>
<div class="flexOne-description" v-if="msg.MailingState==1"> </div>
<b>自行取票说明</b> </div>
<!-- <p>自行前往指定位置取票，當您完成付款後我們將通過郵件通知您取票的門票訊息</p> --> <div class="flexOne-form-bj">
<p>自取地址：{{SelffetchAddress}}</p> <h3>取票方式</h3>
<div class="flexOne-type">
<b>取票方式：</b>
<div>
<el-radio v-model="msg.MailingState" label="1" @change="changePeople">自行取票</el-radio>
<el-radio v-model="msg.MailingState" label="2" @change="changePeople">邮寄票券</el-radio>
<el-radio v-model="msg.MailingState" label="4" @change="changePeople">电子券</el-radio>
</div> </div>
<div class="flexOne-infor-box"> </div>
<b> {{msg.MailingState==1?'客人讯息':msg.MailingState==2?'邮寄讯息':''}}</b> <div class="flexOne-description" v-if="msg.MailingState==1">
<el-form v-if="msg.MailingState!=4" label-width="80px" :model="msg" :rules="rules" ref="msg"> <b>自行取票说明</b>
<!-- <p>自行前往指定位置取票，當您完成付款後我們將通過郵件通知您取票的門票訊息</p> -->
<p>自取地址：{{SelffetchAddress}}</p>
</div>
<div class="flexOne-infor-box">
<b> {{msg.MailingState==1?'客人讯息':msg.MailingState==2?'邮寄讯息':''}}</b>
<el-form v-if="msg.MailingState!=4" label-width="80px" :model="msg" :rules="rules" ref="msg">
<div class="infor-list"> <div class="infor-list">
<!-- <div class="list-title">
<li>中文姓名</li>
<li>英文姓名</li>
<li>性别</li>
<li>联络电话</li>
<li>收件地址</li>
</div> -->
<div class="list-centent" :class="{'active':msg.MailingState==1}"> <div class="list-centent" :class="{'active':msg.MailingState==1}">
<li> <li>
<el-form-item label="中文名" prop="Name"> <el-form-item label="中文名" prop="Name">
<el-input v-model="msg.Name" placeholder="请输入名称"/> <el-input v-model="msg.Name" placeholder="请输入名称" />
</el-form-item> </el-form-item>
</li> </li>
<li> <li>
<el-form-item label="英文名" prop="EName"> <el-form-item label="英文名" prop="EName">
<el-input v-model="msg.EName" placeholder="请输入英文名"/> <el-input v-model="msg.EName" 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.Mobile" placeholder="请输入电话"/> <el-input type="Number" v-model="msg.Mobile" placeholder="请输入电话" />
</el-form-item> </el-form-item>
</li> </li>
<li v-if="msg.MailingState==2"> <li v-if="msg.MailingState==2">
<el-popover trigger="click" placement="MailingAddress"> <el-popover trigger="click" placement="MailingAddress">
<el-input type="textarea" v-model="msg.MailingAddress" <el-input type="textarea" v-model="msg.MailingAddress" :autosize="{ minRows: 3, maxRows: 100}"
:autosize="{ minRows: 3, maxRows: 100}" placeholder="输入邮寄地址" />
placeholder="输入邮寄地址"/>
<div slot="reference" class="name-wrapper"> <div slot="reference" class="name-wrapper">
<el-form-item label="邮寄地址" prop="MailingAddress"> <el-form-item label="邮寄地址" prop="MailingAddress">
<el-input v-model="msg.MailingAddress" placeholder="输入邮寄地址" readonly/> <el-input v-model="msg.MailingAddress" placeholder="输入邮寄地址" readonly />
</el-form-item> </el-form-item>
</div> </div>
</el-popover> </el-popover>
</li> </li>
<li class="bottom"> <li class="bottom">
<el-form-item label="性别" prop="Sex"> <el-form-item label="性别" prop="Sex">
<el-radio v-model="msg.Sex" label="1">男</el-radio> <el-radio v-model="msg.Sex" label="1">男</el-radio>
<el-radio v-model="msg.Sex" label="2" >女</el-radio> <el-radio v-model="msg.Sex" label="2">女</el-radio>
</el-form-item> </el-form-item>
</li> </li>
</div> </div>
</div> </div>
</el-form> </el-form>
<div style="margin-top: 20px;"> <div style="margin-top: 20px;">
<el-input style="width: 100%;" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" <el-input style="width: 100%;" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" v-model="msg.Remark"
v-model="msg.Remark" placeholder="订单备注"/> placeholder="订单备注" />
</div>
</div> </div>
</div> </div>
</div>
<div class="notice"> <div class="notice">
<b>预定须知</b> <b>预定须知</b>
<p>{{detailsObj.BookingInfo}}</p> <p>{{detailsObj.BookingInfo}}</p>
</div> </div>
</div>
<div class="flexOne-right">
<h4>结算账单</h4>
<div class="right-text">
<b>退票限制</b>
<p>未消费随时可退，多张票订单不支持部分退款</p>
</div> </div>
<div class="flexOne-right"> <div class="right-form">
<h4>结算账单</h4> <h6>订单明细</h6>
<div class="right-text"> <div class="right-form-list">
<b>退票限制</b> <template v-if="isCheck">
<p>未消费随时可退，多张票订单不支持部分退款</p>
</div>
<div class="right-form">
<h6>订单明细</h6>
<div class="right-form-list">
<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> <div>
...@@ -426,221 +469,228 @@ ...@@ -426,221 +469,228 @@
</div> </div>
</div> </div>
</template> </template>
</template> </template>
<div v-else class="noData">没有选择票券</div> <div v-else class="noData">没有选择票券</div>
<div class="right-list" v-if="msg.MailingMoney>0&&msg.Money>msg.MailingMoney"> <div class="right-list" v-if="msg.MailingMoney>0&&msg.Money>msg.MailingMoney">
<div> <div>
<el-tag size="mini" type="warning">邮寄费</el-tag> <el-tag size="mini" type="warning">邮寄费</el-tag>
</div> </div>
<div class="right-list-right"> <div class="right-list-right">
{{msg.MailingMoney}} {{msg.MailingMoney}}
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="right-Money"> </div>
<div class="right-Money">
<div> <div>
<span>订单总金额：</span> <span>订单总金额：</span>
<b>{{ msg.Money>msg.MailingMoney?msg.Money.toFixed(2):0.0 }} <b>{{ msg.Money>msg.MailingMoney?msg.Money.toFixed(2):0.0 }}
<span class="fz12" v-if="types&&types.length>0"> <span class="fz12" v-if="types&&types.length>0">
<template v-for="x in types" v-if="checkedTyps==1&&x.checked"> <template v-for="x in types" v-if="checkedTyps==1&&x.checked">
{{x.CurrencyName}} {{x.CurrencyName}}
</template> </template>
<template v-if="checkedTyps>1"> <template v-if="checkedTyps>1">
{{types[0].CurrencyName}} {{types[0].CurrencyName}}
</template> </template>
</span></b> </span></b>
</div>
</div> </div>
<div class="right-Submit"> </div>
<!-- <button v-else class="normalBtn" type="primary" @click="submit"> <div class="right-Submit">
<!-- <button v-else class="normalBtn" type="primary" @click="submit">
提交订单 提交订单
</button> --> </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>
提交订单
</el-button>
</div>
</div> </div>
<!-- 门票详情信息 -->
<el-dialog custom-class="w800" title="门票详情" :visible.sync="showDetails" center @close="showDetails=false">
<ticket-card :ticket="detailsRow"></ticket-card>
</el-dialog>
</div> </div>
</template> <!-- 门票详情信息 -->
<script> <el-dialog custom-class="w800" title="门票详情" :visible.sync="showDetails" center @close="showDetails=false">
import TicketCard from './components/OrderDetails.vue' <ticket-card :ticket="detailsRow"></ticket-card>
export default { </el-dialog>
components: { TicketCard }, </div>
data() { </template>
return { <script>
checkedTyps:0,//记录选多币种票型 import TicketCard from './components/OrderDetails.vue'
isCheck:true, export default {
showDetails: false, components: {
loading: false, TicketCard
SelffetchAddress: '', },
msg: { data() {
OrderId: 0, return {
Money: 0.0, checkedTyps: 0, //记录选多币种票型
Remark: '', isCheck: true,
MailingState: '1',//邮寄状态 1自取 2邮寄 showDetails: false,
MailingAddress: '',//MailingState =2 填写邮寄 loading: false,
MailingMoney: null, SelffetchAddress: '',
SelffetchAddress: '',//自取地址 msg: {
UseDate:'',//门票日期 OrderId: 0,
Name:'', Money: 0.0,
EName:'', Remark: '',
Sex: '1',//1男2女 MailingState: '1', //邮寄状态 1自取 2邮寄
Birthday: '', MailingAddress: '', //MailingState =2 填写邮寄
Mobile:'', MailingMoney: null,
CouponsId:'',//景点id SelffetchAddress: '', //自取地址
DetailList:[], UseDate: '', //门票日期
LureEmpId: 0, Name: '',
CRMGuestId: 0, EName: '',
}, Sex: '1', //1男2女
types: [], Birthday: '',
isCheck: false, Mobile: '',
OpenTime: '', CouponsId: '', //景点id
detailsObj: {}, DetailList: [],
beforeCheck: { LureEmpId: 0,
disabledDate: time => { CRMGuestId: 0,
let endTime = new Date(this.getBeforeDate(1,new Date().Format("yyyy-MM-dd")));
return time && endTime.getTime() >= time.getTime();
}
},
rules:{
Name: [{
required: true,
message: '请输入中文名',
trigger: 'blur'
}],
EName: [{
required: true,
message: '请输入英文名',
trigger: 'blur'
}],
Mobile: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
{
pattern: this.$commonUtils.Regex.el_ISphone,
message: "请输入正确的电话"
}
],
MailingAddress: [{
required: true,
message: '请输入邮寄地址',
trigger: 'blur'
}],
},
detailsRow: null,
crmOrderObj: null
};
},
methods: {
submit(){
if(this.msg.MailingState!=4){
this.$refs['msg'].validate((valid) => {
if (valid) {
this.setFormMsg()
} else {
return false;
}
});
}else{
this.setFormMsg()
}
}, },
setFormMsg(){ types: [],
if(this.msg.MailingState!='2'){ isCheck: false,
this.msg.MailingAddress = '' OpenTime: '',
this.msg.MailingMoney = null detailsObj: {},
}if(this.msg.MailingState!='1'){ beforeCheck: {
this.msg.SelffetchAddress = '' disabledDate: time => {
let endTime = new Date(this.getBeforeDate(1, new Date().Format("yyyy-MM-dd")));
return time && endTime.getTime() >= time.getTime();
} }
this.msg.DetailList = []
this.types.forEach(x=>{
if(x.checked){
let y = {
TicketType: x.TicketCouponsType,
TicketName: x.TicketName,
Unit_Price: x.B2BPrice,
Num: x.num,
Money: x.B2BPrice*x.num,
TicketId: x.TicketID
}
this.msg.DetailList.push(y)
}
})
this.loading = true
this.apipost("ticket_post_SetSaleTicketOrder", this.msg,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.Success('下单成功');
this.$router.push({
path: "/SingleticketOrderList",
});
} else {
this.Error('下单失败')
}
},
err => {
this.Error(err.message)
});
},
changePeople(val) {
this.getNum()
}, },
getNum(){ rules: {
// 控制门票张数 Name: [{
// this.types.forEach(x=>{ required: true,
// if(x.num>x.RemainingInventory){ message: '请输入中文名',
// x.num = x.RemainingInventory trigger: 'blur'
// } }],
// }) EName: [{
setTimeout(()=>{ required: true,
this.calcMoneyHandler() message: '请输入英文名',
},50) trigger: 'blur'
}],
Mobile: [{
required: true,
message: "请输入联系电话",
trigger: "blur"
},
{
pattern: this.$commonUtils.Regex.el_ISphone,
message: "请输入正确的电话"
}
],
MailingAddress: [{
required: true,
message: '请输入邮寄地址',
trigger: 'blur'
}],
}, },
calcMoneyHandler(){ detailsRow: null,
this.msg.Money=0.0 crmOrderObj: null
let Money= 0 };
if(this.msg.MailingState == 2){ },
this.msg.MailingMoney = this.detailsObj.MailingMoney methods: {
}else{ submit() {
this.msg.MailingMoney = 0 if (this.msg.MailingState != 4) {
this.$refs['msg'].validate((valid) => {
if (valid) {
this.setFormMsg()
} else {
return false;
}
});
} else {
this.setFormMsg()
}
},
setFormMsg() {
if (this.msg.MailingState != '2') {
this.msg.MailingAddress = ''
this.msg.MailingMoney = null
}
if (this.msg.MailingState != '1') {
this.msg.SelffetchAddress = ''
}
this.msg.DetailList = []
this.types.forEach(x => {
if (x.checked) {
let y = {
TicketType: x.TicketCouponsType,
TicketName: x.TicketName,
Unit_Price: x.B2BPrice,
Num: x.num,
Money: x.B2BPrice * x.num,
TicketId: x.TicketID
}
this.msg.DetailList.push(y)
} }
this.types.forEach(x=>{ })
if(x.checked){ this.loading = true
Money+=x.B2BPrice*x.num this.apipost("ticket_post_SetSaleTicketOrder", this.msg,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.Success('下单成功');
this.$router.push({
path: "/SingleticketOrderList",
});
} else {
this.Error('下单失败')
} }
}) },
this.msg.Money = Number(Money)+Number(this.msg.MailingMoney) err => {
}, this.Error(err.message)
changeDetailListHandler(e) { });
e.checked = !e.checked },
this.isCheck = this.types.findIndex(x => x.checked) > -1 changePeople(val) {
this.checkedTyps = 0 this.getNum()
this.types.forEach(item=>{ if(item.checked==true){ this.checkedTyps++}}) },
if(this.isCheck){ getNum() {
this.calcMoneyHandler() // 控制门票张数
}else{ // this.types.forEach(x=>{
this.msg.Money=0.0 // if(x.num>x.RemainingInventory){
// x.num = x.RemainingInventory
// }
// })
setTimeout(() => {
this.calcMoneyHandler()
}, 50)
},
calcMoneyHandler() {
this.msg.Money = 0.0
let Money = 0
if (this.msg.MailingState == 2) {
this.msg.MailingMoney = this.detailsObj.MailingMoney
} else {
this.msg.MailingMoney = 0
}
this.types.forEach(x => {
if (x.checked) {
Money += x.B2BPrice * x.num
} }
}, })
getInfo(){ this.msg.Money = Number(Money) + Number(this.msg.MailingMoney)
let time },
if(this.OpenTime!=this.msg.UseDate){ changeDetailListHandler(e) {
time = this.msg.UseDate e.checked = !e.checked
}else{ this.isCheck = this.types.findIndex(x => x.checked) > -1
time = this.OpenTime this.checkedTyps = 0
this.types.forEach(item => {
if (item.checked == true) {
this.checkedTyps++
} }
if(time){ })
if (this.isCheck) {
this.calcMoneyHandler()
} else {
this.msg.Money = 0.0
}
},
getInfo() {
let time
if (this.OpenTime != this.msg.UseDate) {
time = this.msg.UseDate
} else {
time = this.OpenTime
}
if (time) {
this.apipost( this.apipost(
"ticket_post_GetTicketCouponsInfo", "ticket_post_GetTicketCouponsInfo", {
{
CouponsId: this.msg.CouponsId, CouponsId: this.msg.CouponsId,
OpenTime: time, OpenTime: time,
}, },
...@@ -650,76 +700,78 @@ ...@@ -650,76 +700,78 @@
this.msg.SelffetchAddress = this.detailsObj.SelffetchAddress this.msg.SelffetchAddress = this.detailsObj.SelffetchAddress
this.SelffetchAddress = this.detailsObj.SelffetchAddress this.SelffetchAddress = this.detailsObj.SelffetchAddress
let addList = function (arr) { let addList = function (arr) {
arr.forEach(item => { arr.forEach(item => {
item.checked = false item.checked = false
item.num = 1 item.num = 1
}); });
}; };
addList(res.data.data.TicketPriceList); addList(res.data.data.TicketPriceList);
this.msg.Money = 0.00 this.msg.Money = 0.00
this.types = res.data.data.TicketPriceList.filter(x=>{ return x.B2BPrice>0}) this.types = res.data.data.TicketPriceList.filter(x => {
if(this.types&&this.types.length>0){ return x.B2BPrice > 0
})
if (this.types && this.types.length > 0) {
this.changeDetailListHandler(this.types[0]) this.changeDetailListHandler(this.types[0])
} }
if(this.types&&this.types.length==0){ if (this.types && this.types.length == 0) {
this.Error('暂无报价，无法下单') this.Error('暂无报价，无法下单')
} }
}else{ } else {
this.Error(res.data.message) this.Error(res.data.message)
} }
}, },
err => {} err => {}
); );
} }
},
showCardHandler() {
this.detailsRow = JSON.parse(JSON.stringify(this.detailsObj))
this.showDetails = true
},
getProvinceList(ID, type) {
//根据省份获取城市
let msg = {
Id: ID
};
if (type == 1) {
this.msg.QProvince = 0;
this.msg.QCity = 0;
this.provinceList = [];
this.cityList = [];
} else if (type == 2) {
this.msg.City = 0;
this.cityList = [];
}
this.apipost(
"dict_post_Destination_GetChildList",
msg,
res => {
if (type == 1) {
this.provinceList = res.data.data;
} else if (type == 2) {
this.cityList = res.data.data;
}
},
err => {}
);
},
}, },
mounted() { showCardHandler() {
// crm自动登陆传过来的参数 this.detailsRow = JSON.parse(JSON.stringify(this.detailsObj))
if(this.$route.query.crmOrderObj){ this.showDetails = true
this.crmOrderObj = JSON.parse(this.$route.query.crmOrderObj) },
this.msg.LureEmpId = this.crmOrderObj.LureEmpId getProvinceList(ID, type) {
this.msg.CRMGuestId = this.crmOrderObj.CRMGuestId //根据省份获取城市
let msg = {
Id: ID
};
if (type == 1) {
this.msg.QProvince = 0;
this.msg.QCity = 0;
this.provinceList = [];
this.cityList = [];
} else if (type == 2) {
this.msg.City = 0;
this.cityList = [];
} }
this.apipost(
"dict_post_Destination_GetChildList",
msg,
res => {
if (type == 1) {
this.provinceList = res.data.data;
} else if (type == 2) {
this.cityList = res.data.data;
}
},
err => {}
);
}, },
created() {
this.msg.CouponsId = this.$route.query.id },
this.OpenTime = this.$route.query.OpenTime mounted() {
this.msg.UseDate = this.$route.query.OpenTime // crm自动登陆传过来的参数
this.getInfo() if (this.$route.query.crmOrderObj) {
this.crmOrderObj = JSON.parse(this.$route.query.crmOrderObj)
this.msg.LureEmpId = this.crmOrderObj.LureEmpId
this.msg.CRMGuestId = this.crmOrderObj.CRMGuestId
} }
}; },
created() {
this.msg.CouponsId = this.$route.query.id
this.OpenTime = this.$route.query.OpenTime
this.msg.UseDate = this.$route.query.OpenTime
this.getInfo()
}
};
</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