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>
.image-slot{
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.time-box.time-box2 .time-box-width span{
.image-slot {
height: 100%;
display: flex;
justify-content: 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 !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{
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;
}
.flexOne-type {
display: flex;
align-items: center;
padding: 0 0 20px 0;
}
</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>
.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-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>
<a @click="showCardHandler"><i class="el-icon-map-location"></i> 地图</a>
</div> -->
</div>
</div>
</div>
<div class="flexOne-time">
<div class="time-box center">
<span>游玩日期：</span>
<div>
<el-date-picker class="w150" v-model='msg.UseDate' format="yyyy-MM-dd" value-format="yyyy-MM-dd" type="date"
:picker-options="beforeCheck" laceholder="门票日期" @change="getInfo">
</el-date-picker>
</div>
</div>
<div class="flexOne-time">
<div class="time-box center">
<span>游玩日期：</span>
<div>
<el-date-picker class="w150" v-model='msg.UseDate' format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="date" :picker-options="beforeCheck" laceholder="门票日期" @change="getInfo">
</el-date-picker>
</div>
<div class="time-box time-box2 center">
<span>选择票型：</span>
<div style="display: flex;flex-wrap: wrap;">
<template v-for="x in types">
<el-tag class="time-box-width" :type="x.checked?'':'info'" style="margin-right: 10px;margin-bottom: 5px; cursor: pointer;"
@click="changeDetailListHandler(x)">
<a>{{ x.TicketName }}</a>
<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;">
</div>
<div class="time-box time-box2 center">
<span>选择票型：</span>
<div style="display: flex;flex-wrap: wrap;">
<template v-for="x in types">
<el-tag class="time-box-width" :type="x.checked?'':'info'"
style="margin-right: 10px;margin-bottom: 5px; cursor: pointer;" @click="changeDetailListHandler(x)">
<a>{{ x.TicketName }}</a>
<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>
</p>
</el-tag>
</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>
</p>
</el-tag>
</template>
</div>
</div>
</div>
<div class="flexOne-form-bj">
<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 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">
{{x.TicketName}}：
<el-input-number v-model="x.num" @change="changePeople" :min="1" label="购买数量"
style="margin-bottom: 10px;"></el-input-number>
</div>
</template>
</div>
</div>
<div class="flexOne-description" v-if="msg.MailingState==1">
<b>自行取票说明</b>
<!-- <p>自行前往指定位置取票，當您完成付款後我們將通過郵件通知您取票的門票訊息</p> -->
<p>自取地址：{{SelffetchAddress}}</p>
</div>
</div>
<div class="flexOne-form-bj">
<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 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>
<div class="flexOne-description" v-if="msg.MailingState==1">
<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="list-title">
<li>中文姓名</li>
<li>英文姓名</li>
<li>性别</li>
<li>联络电话</li>
<li>收件地址</li>
</div> -->
<div class="list-centent" :class="{'active':msg.MailingState==1}">
<li>
<el-form-item label="中文名" prop="Name">
<el-input v-model="msg.Name" placeholder="请输入名称"/>
</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="EName">
<el-input v-model="msg.EName" placeholder="请输入英文名"/>
<el-input v-model="msg.EName" placeholder="请输入英文名" />
</el-form-item>
</li>
<li>
<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>
</li>
<li v-if="msg.MailingState==2">
<el-popover trigger="click" placement="MailingAddress">
<el-input type="textarea" v-model="msg.MailingAddress"
:autosize="{ minRows: 3, maxRows: 100}"
placeholder="输入邮寄地址"/>
<el-input type="textarea" v-model="msg.MailingAddress" :autosize="{ minRows: 3, maxRows: 100}"
placeholder="输入邮寄地址" />
<div slot="reference" class="name-wrapper">
<el-form-item label="邮寄地址" prop="MailingAddress">
<el-input v-model="msg.MailingAddress" placeholder="输入邮寄地址" readonly/>
</el-form-item>
<el-form-item label="邮寄地址" prop="MailingAddress">
<el-input v-model="msg.MailingAddress" placeholder="输入邮寄地址" readonly />
</el-form-item>
</div>
</el-popover>
</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-radio v-model="msg.Sex" label="2">女</el-radio>
</el-form-item>
</li>
</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>
</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>
<div class="notice">
<b>预定须知</b>
<p>{{detailsObj.BookingInfo}}</p>
</div>
<div class="notice">
<b>预定须知</b>
<p>{{detailsObj.BookingInfo}}</p>
</div>
</div>
<div class="flexOne-right">
<h4>结算账单</h4>
<div class="right-text">
<b>退票限制</b>
<p>未消费随时可退，多张票订单不支持部分退款</p>
</div>
<div class="flexOne-right">
<h4>结算账单</h4>
<div class="right-text">
<b>退票限制</b>
<p>未消费随时可退，多张票订单不支持部分退款</p>
</div>
<div class="right-form">
<h6>订单明细</h6>
<div class="right-form-list">
<template v-if="isCheck">
<div class="right-form">
<h6>订单明细</h6>
<div class="right-form-list">
<template v-if="isCheck">
<template v-for="x in types">
<div class="right-list" v-if="x.checked">
<div>
......@@ -426,221 +469,228 @@
</div>
</div>
</template>
</template>
<div v-else class="noData">没有选择票券</div>
<div class="right-list" v-if="msg.MailingMoney>0&&msg.Money>msg.MailingMoney">
<div>
<el-tag size="mini" type="warning">邮寄费</el-tag>
</div>
<div class="right-list-right">
{{msg.MailingMoney}}
</div>
</template>
<div v-else class="noData">没有选择票券</div>
<div class="right-list" v-if="msg.MailingMoney>0&&msg.Money>msg.MailingMoney">
<div>
<el-tag size="mini" type="warning">邮寄费</el-tag>
</div>
<div class="right-list-right">
{{msg.MailingMoney}}
</div>
</div>
</div>
<div class="right-Money">
</div>
<div class="right-Money">
<div>
<span>订单总金额：</span>
<b>{{ msg.Money>msg.MailingMoney?msg.Money.toFixed(2):0.0 }}
<span class="fz12" v-if="types&&types.length>0">
<template v-for="x in types" v-if="checkedTyps==1&&x.checked">
{{x.CurrencyName}}
</template>
<template v-if="checkedTyps>1">
{{types[0].CurrencyName}}
</template>
</span></b>
</div>
<div>
<span>订单总金额：</span>
<b>{{ msg.Money>msg.MailingMoney?msg.Money.toFixed(2):0.0 }}
<span class="fz12" v-if="types&&types.length>0">
<template v-for="x in types" v-if="checkedTyps==1&&x.checked">
{{x.CurrencyName}}
</template>
<template v-if="checkedTyps>1">
{{types[0].CurrencyName}}
</template>
</span></b>
</div>
<div class="right-Submit">
<!-- <button v-else class="normalBtn" type="primary" @click="submit">
</div>
<div class="right-Submit">
<!-- <button v-else class="normalBtn" type="primary" @click="submit">
提交订单
</button> -->
<el-button :disabled="!isCheck"
:loading="loading"
class="normalBtn" type="primary" @click="submit">
提交订单
</el-button>
</div>
<el-button :disabled="!isCheck" :loading="loading" class="normalBtn" type="primary" @click="submit">
提交订单
</el-button>
</div>
<!-- 门票详情信息 -->
<el-dialog custom-class="w800" title="门票详情" :visible.sync="showDetails" center @close="showDetails=false">
<ticket-card :ticket="detailsRow"></ticket-card>
</el-dialog>
</div>
</template>
<script>
import TicketCard from './components/OrderDetails.vue'
export default {
components: { TicketCard },
data() {
return {
checkedTyps:0,//记录选多币种票型
isCheck:true,
showDetails: false,
loading: false,
SelffetchAddress: '',
msg: {
OrderId: 0,
Money: 0.0,
Remark: '',
MailingState: '1',//邮寄状态 1自取 2邮寄
MailingAddress: '',//MailingState =2 填写邮寄
MailingMoney: null,
SelffetchAddress: '',//自取地址
UseDate:'',//门票日期
Name:'',
EName:'',
Sex: '1',//1男2女
Birthday: '',
Mobile:'',
CouponsId:'',//景点id
DetailList:[],
LureEmpId: 0,
CRMGuestId: 0,
},
types: [],
isCheck: false,
OpenTime: '',
detailsObj: {},
beforeCheck: {
disabledDate: time => {
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()
}
<!-- 门票详情信息 -->
<el-dialog custom-class="w800" title="门票详情" :visible.sync="showDetails" center @close="showDetails=false">
<ticket-card :ticket="detailsRow"></ticket-card>
</el-dialog>
</div>
</template>
<script>
import TicketCard from './components/OrderDetails.vue'
export default {
components: {
TicketCard
},
data() {
return {
checkedTyps: 0, //记录选多币种票型
isCheck: true,
showDetails: false,
loading: false,
SelffetchAddress: '',
msg: {
OrderId: 0,
Money: 0.0,
Remark: '',
MailingState: '1', //邮寄状态 1自取 2邮寄
MailingAddress: '', //MailingState =2 填写邮寄
MailingMoney: null,
SelffetchAddress: '', //自取地址
UseDate: '', //门票日期
Name: '',
EName: '',
Sex: '1', //1男2女
Birthday: '',
Mobile: '',
CouponsId: '', //景点id
DetailList: [],
LureEmpId: 0,
CRMGuestId: 0,
},
setFormMsg(){
if(this.msg.MailingState!='2'){
this.msg.MailingAddress = ''
this.msg.MailingMoney = null
}if(this.msg.MailingState!='1'){
this.msg.SelffetchAddress = ''
types: [],
isCheck: false,
OpenTime: '',
detailsObj: {},
beforeCheck: {
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(){
// 控制门票张数
// this.types.forEach(x=>{
// if(x.num>x.RemainingInventory){
// x.num = x.RemainingInventory
// }
// })
setTimeout(()=>{
this.calcMoneyHandler()
},50)
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'
}],
},
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
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() {
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){
Money+=x.B2BPrice*x.num
})
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('下单失败')
}
})
this.msg.Money = Number(Money)+Number(this.msg.MailingMoney)
},
changeDetailListHandler(e) {
e.checked = !e.checked
this.isCheck = this.types.findIndex(x => x.checked) > -1
this.checkedTyps = 0
this.types.forEach(item=>{ if(item.checked==true){ this.checkedTyps++}})
if(this.isCheck){
this.calcMoneyHandler()
}else{
this.msg.Money=0.0
},
err => {
this.Error(err.message)
});
},
changePeople(val) {
this.getNum()
},
getNum() {
// 控制门票张数
// this.types.forEach(x=>{
// 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(){
let time
if(this.OpenTime!=this.msg.UseDate){
time = this.msg.UseDate
}else{
time = this.OpenTime
})
this.msg.Money = Number(Money) + Number(this.msg.MailingMoney)
},
changeDetailListHandler(e) {
e.checked = !e.checked
this.isCheck = this.types.findIndex(x => x.checked) > -1
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(
"ticket_post_GetTicketCouponsInfo",
{
"ticket_post_GetTicketCouponsInfo", {
CouponsId: this.msg.CouponsId,
OpenTime: time,
},
......@@ -650,76 +700,78 @@
this.msg.SelffetchAddress = this.detailsObj.SelffetchAddress
this.SelffetchAddress = this.detailsObj.SelffetchAddress
let addList = function (arr) {
arr.forEach(item => {
item.checked = false
item.num = 1
});
arr.forEach(item => {
item.checked = false
item.num = 1
});
};
addList(res.data.data.TicketPriceList);
this.msg.Money = 0.00
this.types = res.data.data.TicketPriceList.filter(x=>{ return x.B2BPrice>0})
if(this.types&&this.types.length>0){
this.types = res.data.data.TicketPriceList.filter(x => {
return x.B2BPrice > 0
})
if (this.types && this.types.length > 0) {
this.changeDetailListHandler(this.types[0])
}
if(this.types&&this.types.length==0){
if (this.types && this.types.length == 0) {
this.Error('暂无报价，无法下单')
}
}else{
} else {
this.Error(res.data.message)
}
},
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() {
// crm自动登陆传过来的参数
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
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 => {}
);
},
created() {
this.msg.CouponsId = this.$route.query.id
this.OpenTime = this.$route.query.OpenTime
this.msg.UseDate = this.$route.query.OpenTime
this.getInfo()
},
mounted() {
// crm自动登陆传过来的参数
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