Skip to content

M
million
Commit 0c70cf42 authored by 沈良进's avatar 沈良进
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/viitto/million

parents efe262dd 57a1e419
Show whitespace changes
Inline Side-by-side
Showing with 286 additions and 186 deletions
src/components/car/orderPreview.vue 0 → 100644
View file @ 0c70cf42
<template>
<div class="column full-height">
<div class="col">
<div class="text-right">
<q-btn
color="primary"
icon="refresh"
label="全部重選"
@click="resetHandler"
flat
/>
</div>
<div class="text-grey-6 f12 q-my-md">選擇類型</div>
<div class="row wrap">
<q-btn @click="handleSelect(item)"
:color="item.Id === selectedCar?'primary':'grey-5'"
unelevated
class="car-tag mr"
v-for="item in CarTypeList"
:key="item.Id"
>
{{ item.CarName }}({{ item.PeopleNum }}人)
</q-btn>
</div>
<div class="text-grey-6 f12 q-my-md">選擇數量</div>
<div class="row items-end">
<div class="col" :class="{'column':$q.platform.is.mobile}">
<div v-if="selectedObj">
<span class="text-subtitle2 text-weight-bold">{{selectedObj.CarName}}</span>
<span class="text-grey-6 f12 q-ml-sm"></span>({{ selectedObj.PeopleNum }}人)</span>
</div>
<div v-if="$q.platform.is.mobile">
<span class="text-grey-7 product-price" style="font-size: 13px">
CNY {{ moneyFormat(p.originalB2CPrice, 0) }} /每辆
</span>
</div>
</div>
<div class="row items-end">
<span v-if="$q.platform.is.desktop" class="text-grey-7 product-price" style="font-size: 13px">
CNY {{ moneyFormat(p.originalB2CPrice, 0) }} /每辆
</span>
<q-input
style="width: 150px"
@input="changePeople"
v-model="chosenObj.Count"
class="col"
:class="{
'q-ml-sm q-px-none q-pl-none': $q.platform.is.desktop,
}"
mask="#"
reverse-fill-mask
dense
standout
readonly
>
<template v-slot:prepend>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="remove"
@click="addPeople('Count', -1)"
/>
</template>
<template v-slot:append>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="add"
@click="addPeople('Count', 1)"
/>
</template>
</q-input>
</div>
</div>
<div class="text-grey-6 f12 q-mt-mb" v-if="p.isSupportChildren == 2">
本團只支持成人出遊
</div>
<div
v-if="p.safeMoney > 0"
class="q-pt-md q-mt-md row items-center"
style="border-top: 1px dashed #eee"
>
<div class="text-grey-6 f12 col">保險服務費</div>
<div class="product-money f12">CNY {{ p.safeMoney }}/每人</div>
</div>
</div>
<div class="q-mt-md q-pt-md" style="border-top: 1px dashed #eee">
<div class="row items-center">
<span class="text-subtitle2 text-grey-6 col">總金額</span>
<span class="text-h6 text-primary product-price">CNY {{ moneyFormat(sumPrice,0) }}</span>
</div>
<div class="q-mt-md text-right">
<span class="q-mr-lg f12 text-negative" v-if="!p.startDate" >{{$q.platform.is.mobile?'請選擇上面的出行日期':'請選擇左側的出行日期'}} </span>
<q-btn color="primary" label="立即訂購" unelevated class="q-px-lg" :disable="sumPrice==0"/>
</div>
</div>
</div>
</template>
<script>
export default {
props: ["price","CarTypeList","configId","Month"],
watch: {
price: {
handler(n, o) {
this.p = n;
console.log(n,'-----')
this.chosenObj.startDate = n.startDate;
this.calcMoney()
},
deep: true,
immediate: true
},
CarTypeList: {
handler(n, o) {
this.CarTypeList = n;
this.selectedCar = this.CarTypeList[0].Id
},
deep: true,
immediate: true
},
},
data() {
return {
p: {},
chosenObj: null,
sumPrice:0,
selectedObj: null,
priceList: [],
selectedCar: 0
};
},
created() {
this.initModel();
if(this.p.startDate){
this.chosenObj.startDate = this.p.startDate;
this.calcMoney()
this.getCarPriceData2()
this.selectedCar = this.CarTypeList[0].Id
}
},
methods: {
// 获取车的详情
getCarPriceData2() {
this.priceList = []
this.apipost(
"b2c_get_GetCarSingleProductMonthPrice",
{
ProductId: this.configId,
Month: this.Month,
AirportId: '',
CarTypeId: this.selectedCar
},
(r) => {
if (r.data.resultCode == 1) {
r.data.data.forEach(x=>{
x.startDate = x.Date
x.originalB2CPrice = x.Price
x.remainNum =1
x.Count = 1
x.isSupportChildren = 1
x.safeMoney = 0
this.p.originalB2CPrice = x.Price
})
this.$emit('getPriceList',JSON.stringify(r.data.data),this.selectedCar)
}
},null)
},
handleSelect(item){
this.selectedObj = item
this.selectedCar = item.Id
this.getCarPriceData2()
},
initModel() {
this.sumPrice=0
this.chosenObj = {
startDate: "",
Count: 1,
remark: "",
};
},
resetHandler() {
this.p = {};
this.initModel()
this.$emit("reset");
},
changePeople(val) {},
addPeople(m, i, isDf = false) {
this.chosenObj[m] = parseInt(this.chosenObj[m]) + i;
if(m!='Count'){
this.chosenObj[m] = this.chosenObj[m] < 0 ? 0 : this.chosenObj[m]++;
}else{
this.chosenObj[m] = this.chosenObj[m] < 1 ? 1 : this.chosenObj[m]++;
}
this.calcMoney()
},
calcMoney() {
if (!this.p) return;
let money = this.p.originalB2CPrice * this.chosenObj.Count;
this.sumPrice = money;
},
},
};
</script>
<style></style>
src/components/trip/calendar.vue
View file @ 0c70cf42
......@@ -108,7 +108,7 @@ export default {
},
watch: {
priceList: {
handler(oldValue, newVal) {
handler(newVal, oldValue) {
this.prices = newVal;
this.init();
},
......
src/components/trip/orderPreview.vue
View file @ 0c70cf42
......@@ -273,6 +273,7 @@ export default {
this.calcMoney()
},
deep: true,
immediate: true,
},
},
data() {
......
src/pages/detailsCar.vue
View file @ 0c70cf42
......@@ -22,7 +22,7 @@
class="col product-price text-subtitle1 text-weight-bold"
style="text-align: left"
>
<span>CNY {{ moneyFormat(dataList.MinPrice, 0) }}</span>
<span v-if="dataList&&dataList.MinPrice">CNY {{ moneyFormat(dataList.MinPrice, 0) }}</span>
<span class="q-ml-sm f12 text-grey-7">起</span>
</span>
<q-btn
......@@ -117,7 +117,7 @@
>
<div class="col q-mr-lg">
<div class="text-h6 ellipsis-2-lines">{{ dataList.Name }}</div>
<div class="text-h6 ellipsis-2-lines">{{ dataList.Description }}</div>
<!-- <div class="text-h6 ellipsis-2-lines">{{ dataList.Description }}</div> -->
<div class="q-mt-md f12 text-grey-6">
<q-icon
name="iconfont icondingweixiao"
......@@ -157,7 +157,7 @@
class="transparent q-mr-xl no-padding"
square
icon="iconfont iconcancel"
label="15天前可免費取消"
label="3天前可免費取消"
/>
</div>
</div>
......@@ -268,7 +268,7 @@
<q-popup-proxy ref="qDateProxy">
<calendar
class="bg-white q-pa-md"
:priceList="dataList.priceList"
:priceList="priceList"
@change="changeChosenDateHandler"
ref="calendar"
></calendar>
......@@ -277,139 +277,22 @@
<template v-if="currentPrice && currentPrice.startDate">
<order-preview
class="q-pa-md"
:configId="msg.configId"
:Month="currentYM.str"
:CarTypeList="dataList.CarTypeList"
:price="currentPrice"
@reset="resetHandler"
@getPriceList="getPriceList"
></order-preview>
</template>
</div>
<!--方案选择区 -->
<div class="flex justify-between">
<div class="f20 flex item-center">
湖岩美术馆 & 爱宝乐园 包车一日游
<span class="cancel">3天前可免费取消</span>
</div>
<div>
<div class="f20">
CNY {{ moneyFormat(dataList.MinPrice, 0)
}}<span class="f14">起</span>
</div>
<div>最早可预订日</div>
</div>
</div>
<div class="flex bold mr about">
关于此方案
<div class="flex normal ml">
<div class="ml">3天前可免费取消</div>
</div>
</div>
<div>
<div class="mt mb bold f18">选择日期、选项</div>
<div class="flex">
<div style="width: 50%">
<div>请选择出发日期</div>
<div>
<div class="flex justify-between f20 bold padding">
<span>{{ currentYM.str }}</span>
<div>
<i
class="iconfont iconpreviewleft"
style="font-size: 28px"
:class="{'gray': isCurrent}"
@click="handleMinus"
></i
><i
@click="handlePlus" :class="{'gray': isLast}"
class="iconfont iconpreviewright"
style="font-size: 28px"
></i>
</div>
</div>
<table class="date-table">
<thead>
<tr class="row-day">
<th class="cell-day">日</th>
<th class="cell-day">一</th>
<th class="cell-day">二</th>
<th class="cell-day">三</th>
<th class="cell-day">四</th>
<th class="cell-day">五</th>
<th class="cell-day">六</th>
</tr>
</thead>
<tbody>
<tr
class="row-date"
v-for="(item, index) in daysList"
:key="index"
>
<td
class="cell-date selectable"
v-for="(el, index) in item"
:key="index"
>
<div v-if="el && el.disabled">
<div v-if="el" class="date-num disabled">
{{ el.day }}
</div>
</div>
<div v-else>
<div v-if="el" class="date-num">{{ el.day }}</div>
<div v-if="el" class="price">
{{ el.price || "1566" }} 起
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div style="width: 40%; margin-left: 10%">
<div class="mt mb">车辆选择</div>
<div>
<q-btn @click="handleSelect(item.Id)"
class="car-tag mr"
:class="{'car-select': item.Id === selectedCar}"
v-for="item in dataList.CarTypeList"
:key="item.Id"
>
{{ item.CarName }}({{ item.PeopleNum }}人)
</q-btn>
</div>
<div class="mt mb">选择辆数</div>
<div class="flex justify-between bold f18 mt mb">
<span>辆数</span>
<div>
<span>CNY 1,667 起/每辆</span>
<i
class="iconfont icondingweixiao q-icon notranslate"
style="font-size: 14px; margin-right: 8px"
></i>
<i class="iconfont iconminus"></i>
<span>1</span>
<i class="iconfont iconplus"></i>
</div>
</div>
<q-separator />
<div class="flex justify-between mt mb">
<span>总金额</span>
<span class="f20">CNY 100</span>
</div>
<div class="flex flex-end">
<q-btn class="mr" label="加入购物车"></q-btn>
<q-btn label="立即订购"></q-btn>
</div>
</div>
</div>
<div></div>
</div>
<div class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile">
<!-- <div class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile">
所選方案詳情
</div>
</div> -->
<div
class="bg-white rounded-borders q-mt-md"
v-if="dataList.priceList && dataList.priceList.length > 0"
v-if="priceList && priceList.length > 0"
>
<div class="q-pa-md row">
<div class="col">
......@@ -424,23 +307,23 @@
size="sm"
text-color="grey-2"
class="text-light"
label="15天前可免費取消"
label="3天前可免费取消"
/>
</div>
<div class="text-grey f12">
<!-- <div class="text-grey f12">
<ul class="q-pl-md no-margin">
<li v-for="(x, i) in warnBuy" class="q-mt-md" :key="i">
{{ x }}
</li>
</ul>
</div>
</div> -->
</div>
<div class="" v-if="$q.platform.is.desktop">
<div class="row items-center">
<span class="product-price text-h6 q-mr-md"
>CNY
{{
moneyFormat(dataList.priceList[0].originalB2CPrice, 0)
moneyFormat(priceList[0].originalB2CPrice, 0)
}}</span
>
<q-btn
......@@ -452,7 +335,7 @@
/>
</div>
<div class="text-info q-mt-md text-right">
最早可預訂日期：{{ dataList.priceList[0].startDate }}
最早可預訂日期：{{ priceList[0].startDate }}
</div>
</div>
</div>
......@@ -469,27 +352,25 @@
class="transparent q-mr-xl no-padding"
square
icon="iconfont iconcancel"
label="15天前可免費取消"
/>
<q-chip
class="transparent q-mr-xl no-padding"
square
icon="iconfont iconroundcheck"
label="6個工作日內（不含例休假）確認"
label="3天前可免費取消"
/>
</div>
<div class="q-mt-lg row" v-if="$q.platform.is.desktop">
<div class="col">
<calendar
:priceList="dataList.priceList"
:priceList="priceList"
@change="changeChosenDateHandler"
ref="calendar"
></calendar>
</div>
<div class="col q-ml-xl">
<order-preview
:configId="msg.configId"
:Month="currentYM.str"
:CarTypeList="dataList.CarTypeList"
:price="currentPrice"
@reset="resetHandler"
@getPriceList="getPriceList"
></order-preview>
</div>
</div>
......@@ -508,7 +389,9 @@
<div
:class="{ 'col-8': $q.platform.is.desktop, col: $q.platform.is.mobile }"
>
<div id="product">产品介绍</div>
<div id="product" :class="{
'q-px-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}">產品介紹</div>
<div
class="q-mt-md q-pb-xl"
ref="diyContext"
......@@ -657,7 +540,7 @@
<script>
import { slider, slideritem } from "vue-concise-slider";
import calendar from "../components/trip/calendar.vue";
import OrderPreview from "src/components/trip/orderPreview.vue";
import OrderPreview from "src/components/car/orderPreview.vue";
import smaple from "src/components/trip/smaple.vue";
import Trip from "src/components/trip/trip.vue";
import block from "src/components/trip/block/index";
......@@ -666,6 +549,7 @@ export default {
props: [],
data() {
return {
priceList: [],
selectedCar: '',
currentYM: { year: 2023, month: 2, str: "2023-02" }, // 当前年月
isCurrent: false,
......@@ -777,6 +661,13 @@ export default {
immediate: true,
deep: true,
},
priceList: {
handler: function (val, oldval) {
this.priceList = val;
},
immediate: true,
deep: true,
},
},
created() {
if (this.$route.params.id) {
......@@ -793,52 +684,17 @@ export default {
// this.getData();
window.addEventListener("scroll", this.menu);
this.getCarData();
this.getCarPriceData();
// this.getCarPriceData();
},
methods: {
handleSelect(id) {
getPriceList(Arr,id){
this.priceList = JSON.parse(Arr)
if(this.selectedCar === id) {
this.selectedCar = ''
} else {
this.selectedCar = id
}
},
handleMinus() {
if(this.isCurrent) return;
const { str, year, month } = this.currentYM;
if (month === 1) {
this.currentYM = {
year: year - 1,
month: 12,
str: `${year - 1}-12`,
};
} else {
this.currentYM = {
year: year,
month: month - 1,
str: `${year}-${month - 1 > 10 ? month - 1 : "0" + (month - 1)}`,
};
}
this.getCarPriceData();
},
handlePlus() {
if(this.isLast) return;
const { str, year, month } = this.currentYM;
if (month === 12) {
this.currentYM = {
year: year + 1,
month: 1,
str: `${year + 1}-01`,
};
} else {
this.currentYM = {
year: year,
month: month + 1,
str: `${year}-${month + 1 >= 10 ? month + 1 : "0" + (month + 1)}`,
};
}
this.getCarPriceData();
},
getTopNum(x) {
this.days = JSON.parse(x);
},
......@@ -886,7 +742,9 @@ export default {
changeChosenDateHandler(val) {
val.price.version = new Date().getTime();
this.currentPrice = JSON.parse(JSON.stringify(val.price));
if(this.$q.platform.is.mobile){
this.$refs.qDateProxy.hide();
}
},
showDialog() {
this.isShowDialog = true;
......@@ -900,10 +758,11 @@ export default {
this.$q.loading.show();
this.apipost(
"b2c_get_GetCarSingleProductDetail",
{ ProductId: "16" },
{ ProductId: this.msg.configId },
(r) => {
if (r.data.resultCode == 1) {
this.dataList = r.data.data;
this.selectedCar = this.dataList.CarTypeList[0].Id
this.dataList.imgCover = this.dataList.ImageList;
this.isShow = true;
......@@ -922,6 +781,7 @@ export default {
});
}
this.$nextTick(() => {
this.getCarPriceData2()
if (
this.dataList.feature &&
this.dataList.feature.featureHtml != ""
......@@ -955,6 +815,7 @@ export default {
// console.log('异常信息', error)
}
});
} else {
this.$q.notify({
type: "negative",
......@@ -969,11 +830,36 @@ export default {
);
},
// 获取车的详情
getCarPriceData2() {
this.priceList = []
this.apipost(
"b2c_get_GetCarSingleProductMonthPrice",
{
ProductId: this.msg.configId,
Month: this.currentYM.str,
AirportId: '',
CarTypeId: this.selectedCar
},
(r) => {
if (r.data.resultCode == 1) {
r.data.data.forEach(x=>{
x.startDate = x.Date
x.originalB2CPrice = x.Price
x.remainNum = 1
x.Count = 1
x.isSupportChildren = 1
x.safeMoney = 0
})
this.priceList = JSON.parse(JSON.stringify(r.data.data))
}
},null)
},
getCarPriceData() {
this.$q.loading.show();
this.apipost(
"b2c_get_GetCarSingleProductMonthPriceAll",
{ ProductId: "16", Month: this.currentYM.str },
{ ProductId: this.msg.configId, Month: this.currentYM.str },
(r) => {
let list = [[]];
let y = 0; // 元素纵向下标
......
src/pages/detailsNew.vue
View file @ 0c70cf42
......@@ -786,7 +786,7 @@ export default {
// }
this.stickyHeight = document.querySelector(".q-header--hidden")
? "translateY(0px)"
: "translateY(85px)";
: "translateY(45px)";
this.currentHeight = temp;
if (
this.videoPosition > 0 &&
......
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