Skip to content

M
million
Commit 349d07d1 authored by 黄奎's avatar 黄奎
Browse files
Options

111

parent 7abed8b6
Show whitespace changes
Inline Side-by-side
Showing with 614 additions and 712 deletions
src/components/searchProductdata/kkday.vue
View file @ 349d07d1
...@@ -5,12 +5,31 @@ ...@@ -5,12 +5,31 @@
> >
<!-- 移动端 --> <!-- 移动端 -->
<div v-if="$q.platform.is.mobile"> <div v-if="$q.platform.is.mobile">
<div class="flex"> <div class="flex">
<div @click="showAddress = true" class="nav-item">目的地<i class="iconfont iconarrowdown text-grey-6" style="margin-top: 3px; margin-left:4px"></i></div> <div @click="showAddress = true" class="nav-item">
<div @click="showCategory = true" class="nav-item">商品類別<i class="iconfont iconarrowdown text-grey-6" style="margin-top: 3px; margin-left:4px"></i></div> 目的地<i
<div @click="showDate = true" class="nav-item">旅程時間<i class="iconfont iconarrowdown text-grey-6" style="margin-top: 3px; margin-left:4px"></i></div> class="iconfont iconarrowdown text-grey-6"
<div @click="showPrice = true" class="nav-item">價錢/时间<i class="iconfont iconarrowdown text-grey-6" style="margin-top: 3px; margin-left:4px"></i></div> style="margin-top: 3px; margin-left: 4px"
></i>
</div>
<div @click="showCategory = true" class="nav-item">
商品類別<i
class="iconfont iconarrowdown text-grey-6"
style="margin-top: 3px; margin-left: 4px"
></i>
</div>
<div @click="showDate = true" class="nav-item">
旅程時間<i
class="iconfont iconarrowdown text-grey-6"
style="margin-top: 3px; margin-left: 4px"
></i>
</div>
<div @click="showPrice = true" class="nav-item">
價錢/时间<i
class="iconfont iconarrowdown text-grey-6"
style="margin-top: 3px; margin-left: 4px"
></i>
</div>
</div> </div>
<popup mode="top" v-model="showAddress"> <popup mode="top" v-model="showAddress">
<q-card flat class="rounded-borders q-py-md"> <q-card flat class="rounded-borders q-py-md">
...@@ -51,8 +70,8 @@ ...@@ -51,8 +70,8 @@
tick-strategy="leaf" tick-strategy="leaf"
@update:ticked="handleTicked" @update:ticked="handleTicked"
:ticked="ticked" :ticked="ticked"
/> /> </q-card
</q-card></popup> ></popup>
<popup mode="top" v-model="showDate"> <popup mode="top" v-model="showDate">
<q-card flat class="rounded-borders q-mt-lg overflow-hidden"> <q-card flat class="rounded-borders q-mt-lg overflow-hidden">
<div class="q-my-sm q-mx-lg f20 bold">旅程時間</div> <div class="q-my-sm q-mx-lg f20 bold">旅程時間</div>
...@@ -61,11 +80,7 @@ ...@@ -61,11 +80,7 @@
v-for="(y, yi) in dayArray" v-for="(y, yi) in dayArray"
:key="yi" :key="yi"
> >
<q-checkbox <q-checkbox v-model="y.checked" size="xs" @input="changeTripDayHandler" />
v-model="y.checked"
size="xs"
@input="changeTripDayHandler"
/>
<span <span
class="col text-grey-8 text-subtitle2 text-regular q-mt-xs" class="col text-grey-8 text-subtitle2 text-regular q-mt-xs"
style="font-weight: 400" style="font-weight: 400"
...@@ -76,7 +91,6 @@ ...@@ -76,7 +91,6 @@
</q-card> </q-card>
</popup> </popup>
<popup mode="top" v-model="showPrice"> <popup mode="top" v-model="showPrice">
<q-card flat class="rounded-borders q-pa-md q-mt-lg"> <q-card flat class="rounded-borders q-pa-md q-mt-lg">
<div class="text-subtitle1 text-weight-bold">價錢篩選（CNY）</div> <div class="text-subtitle1 text-weight-bold">價錢篩選（CNY）</div>
<div class="q-mt-md text-grey-6 text-subtitle2 text-regular"> <div class="q-mt-md text-grey-6 text-subtitle2 text-regular">
...@@ -90,21 +104,17 @@ ...@@ -90,21 +104,17 @@
@change="testHandler" @change="testHandler"
color="primary" color="primary"
class="q-mt-md" class="q-mt-md"
/> /> </q-card
</q-card><q-card flat class="rounded-borders q-mt-lg row no-padding q-mb-lg"> ><q-card flat class="rounded-borders q-mt-lg row no-padding q-mb-lg">
<div <div
class="q-px-md q-py-sm " class="q-px-md q-py-sm"
style="border-right: 1px solid #eee; border-radius: 0 !important" style="border-right: 1px solid #eee; border-radius: 0 !important"
> >
<q-icon name="iconfont iconigw-l-date-trade" size="24px" /> <q-icon name="iconfont iconigw-l-date-trade" size="24px" />
</div> </div>
<div class="row items-center justify-center col"> <div class="row items-center justify-center col">
<span class="text-grey-8"> <span class="text-grey-8">
{{ {{ msg.startDate ? `${msg.startDate} - ${msg.endDate}` : "篩選出發日期" }}
msg.startDate
? `${msg.startDate} - ${msg.endDate}`
: "篩選出發日期"
}}
</span> </span>
<q-popup-proxy :offset="[0, 0]" ref="qDateProxy"> <q-popup-proxy :offset="[0, 0]" ref="qDateProxy">
<div> <div>
...@@ -117,8 +127,8 @@ ...@@ -117,8 +127,8 @@
></q-date> ></q-date>
</div> </div>
</q-popup-proxy> </q-popup-proxy>
</div> </div> </q-card
</q-card></popup> ></popup>
</div> </div>
<div v-else class="col-3" :class="$q.platform.is.desktop ? 'q-mr-lg' : 'q-ma-md'"> <div v-else class="col-3" :class="$q.platform.is.desktop ? 'q-mr-lg' : 'q-ma-md'">
<q-card flat class="rounded-borders q-py-md"> <q-card flat class="rounded-borders q-py-md">
...@@ -168,11 +178,7 @@ ...@@ -168,11 +178,7 @@
</div> </div>
<div class="row items-center justify-center col"> <div class="row items-center justify-center col">
<span class="text-grey-8"> <span class="text-grey-8">
{{ {{ msg.startDate ? `${msg.startDate} - ${msg.endDate}` : "篩選出發日期" }}
msg.startDate
? `${msg.startDate} - ${msg.endDate}`
: "篩選出發日期"
}}
</span> </span>
<q-popup-proxy :offset="[0, 0]" ref="qDateProxy"> <q-popup-proxy :offset="[0, 0]" ref="qDateProxy">
<div> <div>
...@@ -214,11 +220,7 @@ ...@@ -214,11 +220,7 @@
v-for="(y, yi) in dayArray" v-for="(y, yi) in dayArray"
:key="yi" :key="yi"
> >
<q-checkbox <q-checkbox v-model="y.checked" size="xs" @input="changeTripDayHandler" />
v-model="y.checked"
size="xs"
@input="changeTripDayHandler"
/>
<span <span
class="col text-grey-8 text-subtitle2 text-regular q-mt-xs" class="col text-grey-8 text-subtitle2 text-regular q-mt-xs"
style="font-weight: 400" style="font-weight: 400"
...@@ -248,10 +250,7 @@ ...@@ -248,10 +250,7 @@
:label="x.Name" :label="x.Name"
/> />
</div> </div>
<div <div class="q-pa-md row items-center" style="border-top: 1px solid #eee">
class="q-pa-md row items-center"
style="border-top: 1px solid #eee"
>
<span class="f12">排序：</span> <span class="f12">排序：</span>
<q-chip <q-chip
square square
...@@ -270,13 +269,14 @@ ...@@ -270,13 +269,14 @@
> >
</div> </div>
</div> </div>
<div class="q-mt-lg" v-if="!$q.loading.isActive &&DataList&& DataList.length > 0"> <div class="q-mt-lg" v-if="!$q.loading.isActive && DataList && DataList.length > 0">
<div <div
class="rounded-borders cursor-pointer overflow-hidden bg-white" class="rounded-borders cursor-pointer overflow-hidden bg-white"
:class="$q.platform.is.desktop ? 'row q-mb-md' : 'colmuns q-ma-md'" :class="$q.platform.is.desktop ? 'row q-mb-md' : 'colmuns q-ma-md'"
v-for="(x, i) in DataList" :key="i" > v-for="(x, i) in DataList"
:key="i"
<template v-if="x.imgCover&&x.imgCover.length>0"> >
<template v-if="x.imgCover && x.imgCover.length > 0">
<q-img <q-img
:src="x.imgCover[0].url" :src="x.imgCover[0].url"
:ratio="1" :ratio="1"
...@@ -298,10 +298,13 @@ ...@@ -298,10 +298,13 @@
/> />
</template> </template>
<div class="q-pa-md col column"> <div class="q-pa-md col column">
<div class="text-subtitle1 text-weight-bold text-grey-9" @click="GotoDetails(x)"> <div
class="text-subtitle1 text-weight-bold text-grey-9"
@click="GotoDetails(x)"
>
{{ x.title }} {{ x.title }}
</div> </div>
<div class="col" > <div class="col">
<div class="row items-center q-my-sm" @click="GotoDetails(x)"> <div class="row items-center q-my-sm" @click="GotoDetails(x)">
<q-chip <q-chip
style="background: #26a69a1a" style="background: #26a69a1a"
...@@ -317,31 +320,38 @@ ...@@ -317,31 +320,38 @@
:label="x.ltName" :label="x.ltName"
/> />
</div> </div>
<div class="text-subtitle2 text-grey-6 text-weight-regular ellipsis-2-lines" style="line-height: 1.6" @click="GotoDetails(x)" > <div
class="text-subtitle2 text-grey-6 text-weight-regular ellipsis-2-lines"
style="line-height: 1.6"
@click="GotoDetails(x)"
>
{{ x.productRecommend }} {{ x.productRecommend }}
</div> </div>
<div class="row items-center f12 text-grey-6 q-mt-md"> <div class="row items-center f12 text-grey-6 q-mt-md">
<q-icon <q-icon size="12px" name="iconfont icondingweixiao" class="q-mr-sm" />
size="12px"
name="iconfont icondingweixiao"
class="q-mr-sm"
/>
<span class="q-mr-lg" @click="GotoDetails(x)">{{ x.countryName }}</span> <span class="q-mr-lg" @click="GotoDetails(x)">{{ x.countryName }}</span>
<q-icon <q-icon
size="12px" size="12px"
name="iconfont iconigw-l-date-trade" name="iconfont iconigw-l-date-trade"
class="q-mr-sm" class="q-mr-sm"
></q-icon> ></q-icon>
<template v-if="x.startDateList&&x.startDateList.length>0"> <template v-if="x.startDateList && x.startDateList.length > 0">
<template v-if="x.startDateList.length>1"> <template v-if="x.startDateList.length > 1">
<q-badge outline :color="x.index==index?'secondary':'blue-grey-11'" :label="item" v-for="(item,index) in x.startDateList" :key="index" style="margin-right:5px;margin-bottom:7px;" @click="SwitchTCID(x,i,index)"/> <q-badge
outline
:color="x.index == index ? 'secondary' : 'blue-grey-11'"
:label="item"
v-for="(item, index) in x.startDateList"
:key="index"
style="margin-right: 5px; margin-bottom: 7px"
@click="SwitchTCID(x, i, index)"
/>
</template> </template>
<template v-else> <template v-else>
<q-badge outline color="secondary" :label="x.startDateList[0]"/> <q-badge outline color="secondary" :label="x.startDateList[0]" />
</template> </template>
</template> </template>
</div> </div>
</div> </div>
<div class="row items-end" @click="GotoDetails(x)"> <div class="row items-end" @click="GotoDetails(x)">
<div class="col f12"> <div class="col f12">
...@@ -351,9 +361,7 @@ ...@@ -351,9 +361,7 @@
style="border-right: 1px solid #efefef" style="border-right: 1px solid #efefef"
>{{ x.surplus }}</span> --> >{{ x.surplus }}</span> -->
<span>行程天數：</span> <span>行程天數：</span>
<span class="text-secondary text-weight-bold" <span class="text-secondary text-weight-bold">{{ x.dayNum }} 天</span>
>{{ x.dayNum }} 天</span
>
</div> </div>
<div class="text-h6 product-price"> <div class="text-h6 product-price">
CNY：{{ x.b2CPrice }}<span class="price-stuff">元</span> CNY：{{ x.b2CPrice }}<span class="price-stuff">元</span>
...@@ -407,7 +415,7 @@ import popup from "../props/index"; ...@@ -407,7 +415,7 @@ import popup from "../props/index";
import { date } from "quasar"; import { date } from "quasar";
export default { export default {
props: ["qMsg"], props: ["qMsg"],
components: {popup}, components: { popup },
data() { data() {
return { return {
showAddress: false, showAddress: false,
...@@ -482,7 +490,7 @@ export default { ...@@ -482,7 +490,7 @@ export default {
text: "10天以上", text: "10天以上",
}, },
], ],
dataList: [], DataList: [],
sortArray: [ sortArray: [
{ {
label: "默认排序", label: "默认排序",
...@@ -522,46 +530,42 @@ export default { ...@@ -522,46 +530,42 @@ export default {
this.dayArray.forEach((x) => { this.dayArray.forEach((x) => {
x.checked = false; x.checked = false;
}); });
this.msg.startDate = date.formatDate(new Date(this.qMsg.startDate), "YYYY/MM/DD") this.msg.startDate = date.formatDate(new Date(this.qMsg.startDate), "YYYY/MM/DD");
this.msg.endDate = date.formatDate(new Date(this.qMsg.endDate), "YYYY/MM/DD") this.msg.endDate = date.formatDate(new Date(this.qMsg.endDate), "YYYY/MM/DD");
this.dateRange = { from: this.msg.startDate, to: this.msg.endDate }; this.dateRange = { from: this.msg.startDate, to: this.msg.endDate };
}, },
mounted() { mounted() {
let LineIdList=[]; let LineIdList = [];
if( this.msg.LineIds&& this.msg.LineIds.length>0) if (this.msg.LineIds && this.msg.LineIds.length > 0) {
{ LineIdList = this.msg.LineIds.split(";");
LineIdList= this.msg.LineIds.split(";"); }
} let SeriesIdList = [];
let SeriesIdList= []; if (this.msg.SeriesIds && this.msg.SeriesIds.length > 0) {
if( this.msg.SeriesIds&& this.msg.SeriesIds.length>0) SeriesIdList = this.msg.SeriesIds.split(";");
{ }
SeriesIdList= this.msg.SeriesIds.split(";"); if (
} (LineIdList && LineIdList.length > 0) ||
if((LineIdList&&LineIdList.length>0)||(SeriesIdList&&SeriesIdList.length>0)){ (SeriesIdList && SeriesIdList.length > 0)
) {
let arr = []; let arr = [];
this.goodsType.forEach((x) => { this.goodsType.forEach((x) => {
let lineIdIndex= LineIdList.findIndex(yId=>x.Id.slice(2)==yId); let lineIdIndex = LineIdList.findIndex((yId) => x.Id.slice(2) == yId);
if (lineIdIndex!=-1) { if (lineIdIndex != -1) {
arr.push(x.Id); arr.push(x.Id);
} }
x.children.forEach((y) => { x.children.forEach((y) => {
if (lineIdIndex != -1) {
if(lineIdIndex!=-1){
arr.push(y.Id); arr.push(y.Id);
} } else {
else{ let seriesIdIndex = SeriesIdList.findIndex((yId) => y.Id.slice(2) == yId);
let seriesIdIndex= SeriesIdList.findIndex(yId=>y.Id.slice(2)==yId);
if (seriesIdIndex!=-1) { if (seriesIdIndex != -1) {
arr.push(y.Id); arr.push(y.Id);
} }
} }
}); });
}); });
this.ticked = arr; this.ticked = arr;
console.log("this.ticked",this.ticked);
} }
}, },
methods: { methods: {
...@@ -569,12 +573,12 @@ export default { ...@@ -569,12 +573,12 @@ export default {
console.log("handleSelected", target); console.log("handleSelected", target);
}, },
handleTicked(target) { handleTicked(target) {
this.msg.pageIndex = 1 this.msg.pageIndex = 1;
this.ticked = target; this.ticked = target;
this.goSearchHandler(); this.goSearchHandler();
}, },
handleAreaTicked(target) { handleAreaTicked(target) {
this.msg.pageIndex = 1 this.msg.pageIndex = 1;
this.msg.placeIds = this.getChoseAddressCity().join(","); this.msg.placeIds = this.getChoseAddressCity().join(",");
this.goSearchHandler(); this.goSearchHandler();
}, },
...@@ -623,7 +627,7 @@ export default { ...@@ -623,7 +627,7 @@ export default {
chosenSortHandler(x) { chosenSortHandler(x) {
this.msg.orderBy = x.value; this.msg.orderBy = x.value;
this.msg.pageIndex = 1 this.msg.pageIndex = 1;
this.goSearchHandler(); this.goSearchHandler();
}, },
getChoseAddressCity() { getChoseAddressCity() {
...@@ -631,10 +635,7 @@ export default { ...@@ -631,10 +635,7 @@ export default {
function treeToArray(tree) { function treeToArray(tree) {
return tree.reduce((res, item) => { return tree.reduce((res, item) => {
const { children, ...i } = item; const { children, ...i } = item;
return res.concat( return res.concat(i, children && children.length ? treeToArray(children) : []);
i,
children && children.length ? treeToArray(children) : []
);
}, []); }, []);
} }
const areaList = treeToArray(this.areaList); const areaList = treeToArray(this.areaList);
...@@ -648,20 +649,6 @@ export default { ...@@ -648,20 +649,6 @@ export default {
}, },
changeTripDayHandler() { changeTripDayHandler() {
this.$forceUpdate(); this.$forceUpdate();
// this.msg.minTripDay = "0";
// this.msg.maxTripDay = "0";
// this.dayArray.forEach(x => {
// if (x.checked) {
// this.msg.minPrice =
// this.msg.minPrice > x.min ? x.min : this.msg.minPrice;
// this.msg.maxPrice =
// this.msg.maxPrice < x.max ? x.max : this.msg.maxPrice;
// }
// });
// this.msg.minTripDay =
// this.msg.minTripDay == "0" ? "" : this.msg.minTripDay;
// this.msg.maxTripDay =
// this.msg.maxTripDay == "0" ? "" : this.msg.maxTripDay;
let arr = []; let arr = [];
this.dayArray.forEach((item) => { this.dayArray.forEach((item) => {
if (item.checked) { if (item.checked) {
...@@ -669,117 +656,78 @@ export default { ...@@ -669,117 +656,78 @@ export default {
} }
}); });
this.msg.dayNumList = arr; this.msg.dayNumList = arr;
this.msg.pageIndex = 1 this.msg.pageIndex = 1;
this.goSearchHandler(); this.goSearchHandler();
}, },
optionsFn(cd) { optionsFn(cd) {
return ( return cd >= date.formatDate(date.addToDate(new Date(), { days: 1 }), "YYYY/MM/DD");
cd >=
date.formatDate(date.addToDate(new Date(), { days: 1 }), "YYYY/MM/DD")
);
}, },
testHandler(e) { testHandler(e) {
this.$forceUpdate(); this.$forceUpdate();
this.msg.minPrice = e.min; this.msg.minPrice = e.min;
this.msg.maxPrice = e.max; this.msg.maxPrice = e.max;
this.msg.pageIndex = 1 this.msg.pageIndex = 1;
this.goSearchHandler(); this.goSearchHandler();
}, },
dateRangeHandler(e) { dateRangeHandler(e) {
this.msg.startDate = `${e.from.year}/${e.from.month}/${e.from.day}`; this.msg.startDate = `${e.from.year}/${e.from.month}/${e.from.day}`;
this.msg.endDate = `${e.to.year}/${e.to.month}/${e.to.day} `; this.msg.endDate = `${e.to.year}/${e.to.month}/${e.to.day} `;
this.$refs.qDateProxy.hide(); this.$refs.qDateProxy.hide();
this.msg.pageIndex = 1 this.msg.pageIndex = 1;
this.goSearchHandler(); this.goSearchHandler();
}, },
initGoods() { initGoods() {
let arr = []; let arr = [];
// SeriesIds:"", let LineIdList = [];
//LineIds:"", if (this.msg.LineIds && this.msg.LineIds.length > 0) {
let LineIdList=[]; LineIdList = this.msg.LineIds.split(";");
if( this.msg.LineIds&& this.msg.LineIds.length>0)
{
LineIdList= this.msg.LineIds.split(";");
} }
let SeriesIdList= []; let SeriesIdList = [];
if( this.msg.SeriesIds&& this.msg.SeriesIds.length>0) if (this.msg.SeriesIds && this.msg.SeriesIds.length > 0) {
{ SeriesIdList = this.msg.SeriesIds.split(";");
SeriesIdList= this.msg.SeriesIds.split(";");
} }
this.apipost( this.apipost(
"b2c_get_GetAllLineList", "b2c_get_GetB2CQueryCondition",
this.msg, this.msg,
(res) => { (res) => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
var jObj = res.data.data; var jObj = res.data.data.LineList;
jObj.forEach((x) => { jObj.forEach((x) => {
x.checked = false; x.checked = false;
x.explsed = false; x.explsed = false;
x.isShow = true; x.isShow = true;
x.children = x.SubList; x.children = x.SubList;
let lineIdIndex= LineIdList.findIndex(yId=>x.Id.slice(2)==yId); let lineIdIndex = LineIdList.findIndex((yId) => x.Id.slice(2) == yId);
x.children.forEach((y) => { x.children.forEach((y) => {
y.checked = false; y.checked = false;
y.explsed = false; y.explsed = false;
y.isShow = true; y.isShow = true;
if(lineIdIndex!=-1){ if (lineIdIndex != -1) {
arr.push(y.Id); arr.push(y.Id);
this.ticked.push(y.Id); this.ticked.push(y.Id);
} } else {
else{ let seriesIdIndex = SeriesIdList.findIndex(
let seriesIdIndex= SeriesIdList.findIndex(yId=>y.Id.slice(2)==yId); (yId) => y.Id.slice(2) == yId
if (seriesIdIndex!=-1) { );
if (seriesIdIndex != -1) {
arr.push(y.Id); arr.push(y.Id);
this.ticked.push(y.Id); this.ticked.push(y.Id);
} }
} }
}); });
this.goodsType.push(x); this.goodsType.push(x);
}); });
console.log("arr",arr); if (this.ticked && this.ticked.length > 0) {
if(this.ticked&&this.ticked.length>0){
this.msg.webSiteCategoryIds = this.ticked.join(","); this.msg.webSiteCategoryIds = this.ticked.join(",");
this.goSearchHandler(); this.goSearchHandler();
}else{ } else {
this.goSearchHandler(); this.goSearchHandler();
} }
}else this.goSearchHandler() } else this.goSearchHandler();
}, },
(err) => {} (err) => {}
); );
//let jObj = JSON.parse(window.localStorage.getItem("baseifo"));
// jObj.CategoryList.forEach((x) => {
// x.checked = false;
// x.explsed = false;
// x.isShow = true;
// x.children = x.SubList;
// x.children.forEach((y) => {
// y.checked = false;
// y.explsed = false;
// y.isShow = true;
// if (y.Id === this.msg.categoryId) {
// arr.push(y.Id);
// }
// if (y.SubList && y.SubList.length) {
// y.children = y.SubList;
// y.children.forEach((z) => {
// z.checked = false;
// z.explsed = false;
// z.isShow = true;
// if (z.Id === this.msg.categoryId) {
// arr.push(z.Id);
// }
// if (y.Id === this.msg.categoryId) {
// arr.push(z.Id);
// }
// });
// }
// });
// this.goodsType.push(x);
// console.log("goodsType",this.goodsType);
// });
this.goodsTypeJSON = JSON.stringify(this.goodsType); this.goodsTypeJSON = JSON.stringify(this.goodsType);
if (this.msg.categoryId) { if (this.msg.categoryId) {
this.$nextTick(() => { this.$nextTick(() => {
...@@ -840,21 +788,8 @@ export default { ...@@ -840,21 +788,8 @@ export default {
} }
); );
this.areaList = tree.children; this.areaList = tree.children;
// this.areaList.forEach(x => {
// x.isShow = x.Name.indexOf(v) != -1;
// x.isShowChild = false;
// x.SubList.forEach(y => {
// y.isShow = y.Name.indexOf(v) != -1;
// if (y.isShow) {
// x.isShow = true;
// x.isShowChild = true;
// }
// });
// });
}, },
goSearchHandler() { goSearchHandler() {
// this.msg.placeIds = this.areaTicked.join(",");
this.$q.loading.show(); this.$q.loading.show();
this.DataList = []; this.DataList = [];
let minTripDay = -1, let minTripDay = -1,
...@@ -893,12 +828,11 @@ export default { ...@@ -893,12 +828,11 @@ export default {
this.msg, this.msg,
(res) => { (res) => {
this.$q.loading.hide(); this.$q.loading.hide();
console.log("b2c_get_GetB2C2024TravelProductPage", res);
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.PageCount = res.data.data.pageCount; this.PageCount = res.data.data.pageCount;
this.TotalCount = res.data.data.count; this.TotalCount = res.data.data.count;
var tempArray = res.data.data.pageData.list; var tempArray = res.data.data.pageData.list;
console.log("getSearch data", tempArray);
if (tempArray && tempArray.length > 0) { if (tempArray && tempArray.length > 0) {
this.DataList = tempArray; this.DataList = tempArray;
this.renderSearchInfo(res.data.data.pageData.condition); this.renderSearchInfo(res.data.data.pageData.condition);
...@@ -964,8 +898,7 @@ export default { ...@@ -964,8 +898,7 @@ export default {
} }
); );
this.goodsType = category.children; this.goodsType = category.children;
// this.ticked = categoryInfo;
console.log("this.areaListJSONTMP", this.areaListJSONTMP, this.areaList);
this.priceModel = { min: priceInfo.minPrice, max: priceInfo.maxPrice }; this.priceModel = { min: priceInfo.minPrice, max: priceInfo.maxPrice };
let arr = []; let arr = [];
dayInfo.forEach((item) => { dayInfo.forEach((item) => {
...@@ -983,18 +916,21 @@ export default { ...@@ -983,18 +916,21 @@ export default {
}, },
GotoDetails(item) { GotoDetails(item) {
this.CommonJump('/detailsProduct/' + encodeURIComponent(item.id)+ "/" + item.configId,{}, "blank"); this.CommonJump(
"/detailsProduct/" + encodeURIComponent(item.id) + "/" + item.configId,
{},
"blank"
);
}, },
SwitchTCID(obj,i,index) { SwitchTCID(obj, i, index) {
if(this.DataList&&this.DataList.length>0){ if (this.DataList && this.DataList.length > 0) {
let nowobj= JSON.parse(JSON.stringify(obj)); let nowobj = JSON.parse(JSON.stringify(obj));
console.log("nowobj",nowobj.startDateList);
this.DataList[i] = { this.DataList[i] = {
...nowobj.priceList[index] ...nowobj.priceList[index],
} };
this.DataList[i].index=index; this.DataList[i].index = index;
this.DataList[i].startDateList=nowobj.startDateList; this.DataList[i].startDateList = nowobj.startDateList;
this.DataList[i].priceList=nowobj.priceList; this.DataList[i].priceList = nowobj.priceList;
this.$forceUpdate(); this.$forceUpdate();
} }
}, },
...@@ -1004,7 +940,7 @@ export default { ...@@ -1004,7 +940,7 @@ export default {
<style> <style>
.addr-list:hover { .addr-list:hover {
background: #E3F2FD; background: #e3f2fd;
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
......
src/components/searchProductdata/list.vue
View file @ 349d07d1
...@@ -2,39 +2,50 @@ ...@@ -2,39 +2,50 @@
<!-- 列表 --> <!-- 列表 -->
<div class="group-result-list"> <div class="group-result-list">
<div class="group-statis-block"> <div class="group-statis-block">
<div class="group-share" style="display:none;"></div> <div class="group-share" style="display: none"></div>
<div class="group-statis-detail"> <div class="group-statis-detail">
<span class="title" v-if="qMsg.searchKey">{{qMsg.searchKey}} :</span> <span class="title" v-if="qMsg.searchKey">{{ qMsg.searchKey }} :</span>
找到 找到
<span class="num"> {{qMsg.TotalCount}} </span>個行程 <span class="num"> {{ qMsg.TotalCount }} </span>個行程
<span class="pc">，目前在第<span style="color: #7f7f7f;"> {{qMsg.pageIndex}} </span>頁</span> <span class="pc"
>，目前在第<span style="color: #7f7f7f"> {{ qMsg.pageIndex }} </span>頁</span
>
</div> </div>
</div> </div>
<div> <div>
<div class="group-box" v-for="(itemf,indexf) in DataList" :key="indexf"> <div class="group-box" v-for="(itemf, indexf) in DataList" :key="indexf">
<a class="group-cover" > <a class="group-cover">
<template v-if="itemf.imgCover&&itemf.imgCover.length>0"> <template v-if="itemf.imgCover && itemf.imgCover.length > 0">
<img :src="itemf.imgCover[0].url" /> <img :src="itemf.imgCover[0].url" />
</template> </template>
</a> </a>
<div class="group-main"> <div class="group-main">
<div class="group-info"> <div class="group-info">
<div class="group-name" style="margin-bottom:5px;cursor:pointer" @click="GotoDetails(itemf)"> <div
{{itemf.title}} class="group-name"
style="margin-bottom: 5px; cursor: pointer"
@click="GotoDetails(itemf)"
>
{{ itemf.title }}
</div> </div>
<div class="group-detail" @click="GotoDetails(itemf)"> <div class="group-detail" @click="GotoDetails(itemf)">
<i class="iconfont iconaddress"></i> <i class="iconfont iconaddress"></i>
<span>{{itemf.countryName}}</span> <span>{{ itemf.countryName }}</span>
</div> </div>
<div class="group-detail" @click="GotoDetails(itemf)"> <div class="group-detail" @click="GotoDetails(itemf)">
<i class="iconfont icontime"></i> <i class="iconfont icontime"></i>
<span>{{itemf.dayNum}} 天</span> <span>{{ itemf.dayNum }} 天</span>
</div> </div>
<ul class="group-list"> <ul class="group-list">
<li> <li>
<template v-if="itemf.PriceList&&itemf.PriceList.length>0"> <template v-if="itemf.PriceList && itemf.PriceList.length > 0">
<div v-for="(item,index) in itemf.priceList" :key="index" style="margin-right:5px;margin-bottom:7px;" @click="SwitchTCID(itemf,indexf,index)"> <div
<a>{{item.StartDate}}</a> v-for="(item, index) in itemf.priceList"
:key="index"
style="margin-right: 5px; margin-bottom: 7px"
@click="SwitchTCID(itemf, indexf, index)"
>
<a>{{ item.StartDate }}</a>
</div> </div>
</template> </template>
</li> </li>
...@@ -43,52 +54,58 @@ ...@@ -43,52 +54,58 @@
<div class="price-info" @click="GotoDetails(itemf)"> <div class="price-info" @click="GotoDetails(itemf)">
<div class="price-wrap"> <div class="price-wrap">
<div class="price_Search"> <div class="price_Search">
<small class="price_unit">TWD$</small> {{itemf.b2BPrice}} <small class="price_unit">TWD$</small> {{ itemf.b2BPrice }}
</div> </div>
<a class="btn_warning" @click="GotoDetails(itemf)" style="cursor:pointer">更多出發日</a> <a class="btn_warning" @click="GotoDetails(itemf)" style="cursor: pointer"
>更多出發日</a
>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div style="display:flex;justify-content: center;"> <div style="display: flex; justify-content: center">
<q-pagination v-if="qMsg.PageCount>1" v-model="qMsg.pageIndex" :max="qMsg.PageCount" @input="gerOrderList()" <q-pagination
:direction-links="true"> v-if="qMsg.PageCount > 1"
v-model="qMsg.pageIndex"
:max="qMsg.PageCount"
@input="gerOrderList()"
:direction-links="true"
>
</q-pagination> </q-pagination>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: ["DataList", "qMsg"], props: ["DataList", "qMsg"],
data() { data() {
return { return {};
};
}, },
methods: { methods: {
GotoDetails(item) { GotoDetails(item) {
this.CommonJump('/details/' + encodeURIComponent(item.id) + "/" + item.configId, {}, "blank"); this.CommonJump(
"/details/" + encodeURIComponent(item.id) + "/" + item.configId,
{},
"blank"
);
}, },
//调用 //调用
gerOrderList(){ gerOrderList() {
this.$emit('getPage') this.$emit("getPage");
}, },
SwitchTCID(obj,i,index) { SwitchTCID(obj, i, index) {
if(this.DataList&&this.DataList.length>0){ if (this.DataList && this.DataList.length > 0) {
let nowobj= JSON.parse(JSON.stringify(obj)); let nowobj = JSON.parse(JSON.stringify(obj));
console.log("nowobj",nowobj.startDateList);
this.DataList[i] = { this.DataList[i] = {
...nowobj.priceList[index] ...nowobj.priceList[index],
} };
this.DataList[i].index=index; this.DataList[i].index = index;
this.DataList[i].startDateList=nowobj.startDateList; this.DataList[i].startDateList = nowobj.startDateList;
this.DataList[i].priceList=nowobj.priceList; this.DataList[i].priceList = nowobj.priceList;
this.$forceUpdate(); this.$forceUpdate();
} }
}, },
} },
} };
</script> </script>
src/pages/detailsProduct.vue
View file @ 349d07d1
<template> <template>
<div class="" style="min-height: 80vh;overflow: hidden;"> <div class="" style="min-height: 80vh; overflow: hidden">
<div v-if="dataList && !$q.loading.isActive" <div
v-if="dataList && !$q.loading.isActive"
class="relative" class="relative"
style="margin: auto;" style="margin: auto"
:style="{'max-width': $q.platform.is.desktop?'1200px':'100%'}"> :style="{ 'max-width': $q.platform.is.desktop ? '1200px' : '100%' }"
>
<div <div
style=" style="
position: fixed; position: fixed;
...@@ -31,12 +33,9 @@ ...@@ -31,12 +33,9 @@
<span <span
class="col product-price text-subtitle1 text-weight-bold" class="col product-price text-subtitle1 text-weight-bold"
style="text-align: left" style="text-align: left"
v-if="dataList.priceList.length>0" v-if="dataList.priceList.length > 0"
>
<span
>CNY
{{ moneyFormat(dataList.priceList[0].originalB2CPrice, 0) }}</span
> >
<span>CNY {{ moneyFormat(dataList.priceList[0].originalB2CPrice, 0) }}</span>
<span class="q-ml-sm f12 text-grey-7">起</span> <span class="q-ml-sm f12 text-grey-7">起</span>
</span> </span>
<q-btn <q-btn
...@@ -51,7 +50,7 @@ ...@@ -51,7 +50,7 @@
<div <div
v-if="dataList" v-if="dataList"
style="margin-left: auto; margin-right: auto" style="margin-left: auto; margin-right: auto"
:style="{'max-width': $q.platform.is.desktop?'1200px':'100%'}" :style="{ 'max-width': $q.platform.is.desktop ? '1200px' : '100%' }"
:class="{ 'q-px-md': $q.screen.width < 1220 }" :class="{ 'q-px-md': $q.screen.width < 1220 }"
> >
<div class="row items-center q-mt-md q-mb-lg"> <div class="row items-center q-mt-md q-mb-lg">
...@@ -66,16 +65,8 @@ ...@@ -66,16 +65,8 @@
class="cursor-pointer" class="cursor-pointer"
@click="CommonJump('/index', {})" @click="CommonJump('/index', {})"
/> />
<q-breadcrumbs-el <q-breadcrumbs-el :label="dataList.aimPlaceName" class="cursor-pointer" />
:label="dataList.aimPlaceName"
class="cursor-pointer"
/>
<!-- <q-breadcrumbs-el>
<span v-for="(x, i) in citys" :key="i">
<span class="cursor-pointer">{{ x }} </span>
<span v-if="i + 1 != citys.length" class="q-mr-sm">，</span>
</span>
</q-breadcrumbs-el> -->
<q-breadcrumbs-el <q-breadcrumbs-el
v-if="$q.platform.is.desktop" v-if="$q.platform.is.desktop"
:label="dataList.title" :label="dataList.title"
...@@ -122,11 +113,7 @@ ...@@ -122,11 +113,7 @@
style="width: 80%" style="width: 80%"
class="q-mx-sm" class="q-mx-sm"
> >
<q-img <q-img :src="item.Url" spinner-color="grey" spinner-size="20px" />
:src="item.Url"
spinner-color="grey"
spinner-size="20px"
/>
</slideritem> </slideritem>
<div slot="loading">loading...</div> <div slot="loading">loading...</div>
</slider> </slider>
...@@ -143,15 +130,11 @@ ...@@ -143,15 +130,11 @@
<div class="col q-mr-lg"> <div class="col q-mr-lg">
<div class="text-h6 ellipsis-2-lines">{{ dataList.title }}</div> <div class="text-h6 ellipsis-2-lines">{{ dataList.title }}</div>
<div class="q-mt-md f12 text-grey-6"> <div class="q-mt-md f12 text-grey-6">
<q-icon <q-icon name="iconfont icondingweixiao" size="16px" class="q-mr-sm" />
name="iconfont icondingweixiao"
size="16px"
class="q-mr-sm"
/>
<span <span
>{{ dataList.aimPlaceName }} >{{ dataList.aimPlaceName }}
<template v-if="citys.length>0"> <template v-if="citys.length > 0">
<span class="q-mx-sm">途徑：</span> <span class="q-mx-sm">途徑：</span>
<span v-for="(x, i) in citys" :key="i"> <span v-for="(x, i) in citys" :key="i">
...@@ -175,12 +158,6 @@ ...@@ -175,12 +158,6 @@
icon="iconfont icontime" icon="iconfont icontime"
:label="` 行程時間 ${dataList.dayList.length} 天`" :label="` 行程時間 ${dataList.dayList.length} 天`"
/> />
<!-- <q-chip
class="transparent q-mr-xl no-padding"
square
icon="iconfont iconnetwork-fill"
label="日本語/中文 導覽"
/> -->
<q-chip <q-chip
class="transparent q-mr-xl no-padding" class="transparent q-mr-xl no-padding"
square square
...@@ -194,15 +171,10 @@ ...@@ -194,15 +171,10 @@
class="bg-grey-3 rounded-borders q-px-md" class="bg-grey-3 rounded-borders q-px-md"
:class="{ :class="{
'q-py-lg': $q.platform.is.desktop, 'q-py-lg': $q.platform.is.desktop,
'row justify-between items-center q-mt-sm q-py-sm': 'row justify-between items-center q-mt-sm q-py-sm': $q.platform.is.mobile,
$q.platform.is.mobile,
}" }"
> >
<div <div class="product-price text-h6" v-if="dataList.priceList.length > 0">
class="product-price text-h6"
v-if="dataList.priceList.length > 0"
>
<!-- CNY：{{ dataList. }} -->
CNY：{{ moneyFormat(dataList.priceList[0].originalB2CPrice, 0) }} CNY：{{ moneyFormat(dataList.priceList[0].originalB2CPrice, 0) }}
<span class="f12 text-grey-6">起</span> <span class="f12 text-grey-6">起</span>
</div> </div>
...@@ -265,24 +237,14 @@ ...@@ -265,24 +237,14 @@
></q-tab> ></q-tab>
</q-tabs> </q-tabs>
</div> </div>
<div <div v-if="dataList" class="q-pa-lg bg-grey-3 q-mt-lg text-grey-9" ref="pricelist">
v-if="dataList"
class="q-pa-lg bg-grey-3 q-mt-lg text-grey-9"
ref="pricelist"
>
<div style="max-width: 1200px; margin-left: auto; margin-right: auto"> <div style="max-width: 1200px; margin-left: auto; margin-right: auto">
<div class="text-h6">選擇方案</div> <div class="text-h6">選擇方案</div>
<div <div
class="rounded-borders bg-white q-pa-md q-mt-md" class="rounded-borders bg-white q-pa-md q-mt-md"
v-if="$q.platform.is.mobile" v-if="$q.platform.is.mobile"
> >
<q-field <q-field class="q-mt-md" stack-label label="選擇日期、選項" standout dense>
class="q-mt-md"
stack-label
label="選擇日期、選項"
standout
dense
>
<div class="self-center full-width no-outline" tabindex="0"> <div class="self-center full-width no-outline" tabindex="0">
{{ currentPrice.startDate }} {{ currentPrice.startDate }}
</div> </div>
...@@ -304,9 +266,7 @@ ...@@ -304,9 +266,7 @@
></order-preview> ></order-preview>
</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 <div
class="bg-white rounded-borders q-mt-md" class="bg-white rounded-borders q-mt-md"
v-if="dataList.priceList.length > 0" v-if="dataList.priceList.length > 0"
...@@ -333,8 +293,7 @@ ...@@ -333,8 +293,7 @@
v-for="(x, i) in warnBuy" v-for="(x, i) in warnBuy"
:class="{ :class="{
'q-mt-md': 'q-mt-md':
$q.platform.is.desktop $q.platform.is.desktop | (i != 0 && $q.platform.is.mobile),
| (i != 0 && $q.platform.is.mobile),
}" }"
:key="i" :key="i"
> >
...@@ -345,11 +304,11 @@ ...@@ -345,11 +304,11 @@
</div> </div>
<div class="" v-if="$q.platform.is.desktop"> <div class="" v-if="$q.platform.is.desktop">
<div class="row items-center"> <div class="row items-center">
<span class="product-price text-h6 q-mr-md" <span
v-if="dataList.priceList.length>0">CNY class="product-price text-h6 q-mr-md"
{{ v-if="dataList.priceList.length > 0"
moneyFormat(dataList.priceList[0].originalB2CPrice, 0) >CNY
}}</span {{ moneyFormat(dataList.priceList[0].originalB2CPrice, 0) }}</span
> >
<q-btn <q-btn
color="primary" color="primary"
...@@ -370,9 +329,7 @@ ...@@ -370,9 +329,7 @@
v-if="showOrderPreview" v-if="showOrderPreview"
> >
<div class="q-pa-md bg-grey-2 row items-center rounded-borders"> <div class="q-pa-md bg-grey-2 row items-center rounded-borders">
<div class="text-subtitle2 text-weight-bold q-mr-xl"> <div class="text-subtitle2 text-weight-bold q-mr-xl">關於此方案</div>
關於此方案
</div>
<q-chip <q-chip
class="transparent q-mr-xl no-padding" class="transparent q-mr-xl no-padding"
square square
...@@ -412,28 +369,37 @@ ...@@ -412,28 +369,37 @@
<div <div
v-if="dataList" v-if="dataList"
style="margin-left: auto; margin-right: auto" style="margin-left: auto; margin-right: auto"
:style="{'width': $q.platform.is.desktop?'1200px':'100%'}" :style="{ width: $q.platform.is.desktop ? '1200px' : '100%' }"
class="q-mt-xl row" class="q-mt-xl row"
:class="{ 'q-px-md': $q.screen.width < 1220 && $q.screen.width > 760 }" :class="{ 'q-px-md': $q.screen.width < 1220 && $q.screen.width > 760 }"
> >
<!-- col q-ml-xl position-relative -->
<div <div
class="absolute" style="z-index: 999;left: -150px;" class="absolute"
:style="{'top':currentHeight>navs[1].top?(currentHeight+100)+'px':(currentHeight+200)+'px'}" style="z-index: 999; left: -150px"
v-if="$q.platform.is.desktop&& :style="{
currentHeight>navs[1].top-400 top:
&&currentHeight<navs[2].top&&dataList.dayList.length>3 currentHeight > navs[1].top
? currentHeight + 100 + 'px'
: currentHeight + 200 + 'px',
}"
v-if="
$q.platform.is.desktop &&
currentHeight > navs[1].top - 400 &&
currentHeight < navs[2].top &&
dataList.dayList.length > 3
" "
> >
<!-- style="position: sticky; top: 100px" -->
<div v-if="true"> <div v-if="true">
<div v-for="(x, i) in days" :key="i"> <div v-for="(x, i) in days" :key="i">
<div v-if="moreDays==2&&i==0" style="text-align: center;margin-bottom: 21px;cursor: pointer;" <div
@click="goScrollHandler(x.top + 50),moreDays=1"> v-if="moreDays == 2 && i == 0"
style="text-align: center; margin-bottom: 21px; cursor: pointer"
@click="goScrollHandler(x.top + 50), (moreDays = 1)"
>
... ...
</div> </div>
<div <div
v-if="(moreDays&&moreDays==1||!moreDays)&&i<8" v-if="((moreDays && moreDays == 1) || !moreDays) && i < 8"
class="trip-module text-subtitle2 cursor-pointer q-mb-lg" class="trip-module text-subtitle2 cursor-pointer q-mb-lg"
@click="goScrollHandler(x.top + 50)" @click="goScrollHandler(x.top + 50)"
:class="{ :class="{
...@@ -446,7 +412,7 @@ ...@@ -446,7 +412,7 @@
</div> </div>
<div <div
v-if="moreDays&&moreDays==2&&i>=8" v-if="moreDays && moreDays == 2 && i >= 8"
class="trip-module text-subtitle2 cursor-pointer q-mb-lg" class="trip-module text-subtitle2 cursor-pointer q-mb-lg"
@click="goScrollHandler(x.top + 50)" @click="goScrollHandler(x.top + 50)"
:class="{ :class="{
...@@ -457,17 +423,20 @@ ...@@ -457,17 +423,20 @@
> >
{{ x.display }} {{ x.display }}
</div> </div>
<div v-if="(!moreDays||moreDays==1)&&days.length>8&&i==8" style="text-align: center;cursor: pointer;" <div
@click="goScrollHandler(x.top + 50),moreDays=2"> v-if="(!moreDays || moreDays == 1) && days.length > 8 && i == 8"
style="text-align: center; cursor: pointer"
@click="goScrollHandler(x.top + 50), (moreDays = 2)"
>
... ...
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div <div
style="width: 100%;" style="width: 100%"
:class="{ :class="{
'col': $q.platform.is.desktop, col: $q.platform.is.desktop,
col: $q.platform.is.mobile, col: $q.platform.is.mobile,
}" }"
> >
...@@ -482,14 +451,21 @@ ...@@ -482,14 +451,21 @@
行程特色 行程特色
</div> </div>
<div> <div>
<div
<div class="q-pb-xl" v-if="tripImages&&tripImages.length>0" class="q-pb-xl"
ref="diyContext"> v-if="tripImages && tripImages.length > 0"
<div v-for="(x,i) in tripImages"> ref="diyContext"
<img v-if="dataList.teamType!=2" class="block" :src="x.header" width="100%"> >
<img class="block" :src="x.page" style="width: 100%"> <div v-for="(x, i) in tripImages">
<div v-if="dataList.teamType!=2" class="tripImages-footer"> <img
<img class="block" :src="x.footer" style="width: 100%"> v-if="dataList.teamType != 2"
class="block"
:src="x.header"
width="100%"
/>
<img class="block" :src="x.page" style="width: 100%" />
<div v-if="dataList.teamType != 2" class="tripImages-footer">
<img class="block" :src="x.footer" style="width: 100%" />
</div> </div>
</div> </div>
</div> </div>
...@@ -504,7 +480,10 @@ ...@@ -504,7 +480,10 @@
ref="diyContext" ref="diyContext"
:style="{ zoom: zoomDiyContext }" :style="{ zoom: zoomDiyContext }"
v-html="dataList.feature.featureHtml" v-html="dataList.feature.featureHtml"
v-else-if="dataList.feature.featureHtml != '' && (!tripImages || tripImages.length==0)" v-else-if="
dataList.feature.featureHtml != '' &&
(!tripImages || tripImages.length == 0)
"
></div> ></div>
</div> </div>
...@@ -522,49 +501,34 @@ ...@@ -522,49 +501,34 @@
v-if="dataList" v-if="dataList"
:trip="dataList" :trip="dataList"
class="q-pb-xl" class="q-pb-xl"
:class="{'q-px-md':$q.platform.is.mobile}" :class="{ 'q-px-md': $q.platform.is.mobile }"
></smaple> ></smaple>
<template v-if="detailsImageList&&detailsImageList.length>0"> <template v-if="detailsImageList && detailsImageList.length > 0">
<div v-for="(x, i) in detailsImageList" :id="`days_${i}`">
<div <div
v-for="(x,i) in detailsImageList" class="tripImages-footer"
:id="`days_${i}`"> v-if="!dataList.tripColor"
<div class="tripImages-footer" v-if="!dataList.tripColor" style="padding: 20px 0;"> style="padding: 20px 0"
</div> ></div>
<!-- <img v-if="dataList.teamType!=2" class="block" :src="x.header" width="100%"> --> <img class="block" :src="x.page" style="width: 100%" />
<img class="block" :src="x.page" style="width: 100%"> <div class="tripImages-footer"></div>
<div class="tripImages-footer">
<!-- <img v-if="dataList.tripColor" class="block" :src="x.footer" style="width: 100%"> -->
</div>
</div> </div>
</template> </template>
<template v-else> <template v-else>
<template v-if="dataList.dayList.length<=3"> <template v-if="dataList.dayList.length <= 3">
<trip :trip="dataList" @change="changeTripShowHandler"></trip> <trip :trip="dataList" @change="changeTripShowHandler"></trip>
</template> </template>
<template v-if="dataList.dayList.length>3"> <template v-if="dataList.dayList.length > 3">
<block v-if="false" :currentHeightDay="currentHeight" :days="days" :tripList="dayList" :isDirect="isDirect" :clickDate="clickDate"></block>
</template>
</template>
<!--
<template
v-if="
(dataList.priceList.length > 0 &&
dataList.priceList &&
dataList.priceList[0].teamType == 2) ||
(dataList.currentPrice && dataList.currentPrice.teamType == 2)
"
>
<trip :trip="dataList" @change="changeTripShowHandler"></trip>
</template>
<template v-else>
<block <block
v-if="false"
:currentHeightDay="currentHeight" :currentHeightDay="currentHeight"
:days="days" :days="days"
:tripList="dayList" :tripList="dayList"
:isDirect="isDirect" :isDirect="isDirect"
:clickDate="clickDate" :clickDate="clickDate"
></block> ></block>
</template> --> </template>
</template>
</div> </div>
<div <div
...@@ -622,16 +586,19 @@ ...@@ -622,16 +586,19 @@
'q-mx-md': $q.screen.width < 1220 && $q.platform.is.mobile, 'q-mx-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}" }"
> >
<div v-html=" <div
dataList.feature.shopRemark v-html="
? dataList.feature.shopRemark dataList.feature.shopRemark ? dataList.feature.shopRemark : '暫無購買說明'
: '暫無購買說明' "
"></div> ></div>
<div class="q-mb-lg text-weight-bold fz18">購物安排</div> <div class="q-mb-lg text-weight-bold fz18">購物安排</div>
<q-table :data="dataList.shopList" :columns="columns" <q-table
:data="dataList.shopList"
:columns="columns"
bordered bordered
class="my-sticky-header-table no-shadow" class="my-sticky-header-table no-shadow"
:hide-bottom="true"> :hide-bottom="true"
>
<template v-slot:header> <template v-slot:header>
<q-tr class="bg-orange-1"> <q-tr class="bg-orange-1">
<q-th v-for="(item, i) in columns" :key="i" class="text-left"> <q-th v-for="(item, i) in columns" :key="i" class="text-left">
...@@ -692,11 +659,11 @@ ...@@ -692,11 +659,11 @@
}" }"
> >
<div class="text-weight-bold fz18 q-mb-md">簽字須知</div> <div class="text-weight-bold fz18 q-mb-md">簽字須知</div>
<div v-html=" <div
dataList.feature.visaRemark v-html="
? dataList.feature.visaRemark dataList.feature.visaRemark ? dataList.feature.visaRemark : '暫無簽字須知'
: '暫無簽字須知' "
"></div> ></div>
</div> </div>
<div <div
class="text-h5 text-weight-bold text-left q-mt-xl" class="text-h5 text-weight-bold text-left q-mt-xl"
...@@ -710,16 +677,11 @@ ...@@ -710,16 +677,11 @@
<div <div
class="q-mt-lg trip-text bg-white q-pa-md rounded-borders q-mb-xl" class="q-mt-lg trip-text bg-white q-pa-md rounded-borders q-mb-xl"
style="border: 1px dashed var(--q-color-info)" style="border: 1px dashed var(--q-color-info)"
v-html=" v-html="dataList.feature.warmTip ? dataList.feature.warmTip : '暂无溫馨提示'"
dataList.feature.warmTip
? dataList.feature.warmTip
: '暂无溫馨提示'
"
:class="{ :class="{
'q-mx-md': $q.screen.width < 1220 && $q.platform.is.mobile, 'q-mx-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}" }"
> ></div>
</div>
<!-- <div <!-- <div
class="text-h5 text-weight-bold text-left q-mt-xl" class="text-h5 text-weight-bold text-left q-mt-xl"
ref="cancelTips" ref="cancelTips"
...@@ -766,14 +728,19 @@ ...@@ -766,14 +728,19 @@
</div> </div>
</div> --> </div> -->
</div> </div>
<template v-if="$q.platform.is.desktop&&currentHeight>130 <template
&&$refs.journeyLookOut.getBoundingClientRect().top+currentHeight-280>currentHeight"> v-if="
<!-- <div class="col-1"></div> --> $q.platform.is.desktop &&
<!-- col q-ml-xl position-relative --> currentHeight > 130 &&
$refs.journeyLookOut.getBoundingClientRect().top + currentHeight - 280 >
currentHeight
"
>
<div <div
class="absolute" style="z-index: 999;right: -150px;" class="absolute"
:style="{'top':currentHeight<1000?'1000px':(currentHeight+100)+'px'}"> style="z-index: 999; right: -150px"
<!-- style="position: sticky; top: 100px" --> :style="{ top: currentHeight < 1000 ? '1000px' : currentHeight + 100 + 'px' }"
>
<div> <div>
<div <div
class="text-subtitle2 text-grey-6 cursor-pointer q-mb-md" class="text-subtitle2 text-grey-6 cursor-pointer q-mb-md"
...@@ -818,7 +785,8 @@ export default { ...@@ -818,7 +785,8 @@ export default {
props: [], props: [],
data() { data() {
return { return {
columns: [{ columns: [
{
name: "cityName", name: "cityName",
required: true, required: true,
label: "城市", label: "城市",
...@@ -845,7 +813,7 @@ export default { ...@@ -845,7 +813,7 @@ export default {
configId: 0, configId: 0,
cityId: 0, cityId: 0,
preview: 0, preview: 0,
tcid:'', tcid: "",
teamType: 0, teamType: 0,
isGetPriceFlight: true, isGetPriceFlight: true,
pType: 1, //类型 1 来源B2C pType: 1, //类型 1 来源B2C
...@@ -945,8 +913,8 @@ export default { ...@@ -945,8 +913,8 @@ export default {
priceListHeight: 0, priceListHeight: 0,
stickyHeight: 0, stickyHeight: 0,
zoomDiyContext: 1, zoomDiyContext: 1,
detailsImageList:[], detailsImageList: [],
tripImages:[], tripImages: [],
moreDays: 0, moreDays: 0,
}; };
}, },
...@@ -959,26 +927,26 @@ export default { ...@@ -959,26 +927,26 @@ export default {
Trip, Trip,
block, block,
Flight, Flight,
NoneData NoneData,
}, },
watch: { watch: {
days: { days: {
handler: function (val, oldval) { handler: function (val, oldval) {
this.days = val; this.days = val;
let that = this let that = this;
this.$nextTick(()=>{ this.$nextTick(() => {
try{ try {
that.days.forEach((x,i)=>{ that.days.forEach((x, i) => {
var object=document.getElementById(`days_${i}`); var object = document.getElementById(`days_${i}`);
x.top = object.getBoundingClientRect().top+60 x.top = object.getBoundingClientRect().top + 60;
}) });
} catch (error) { } catch (error) {
console.log('----异常') console.log("----异常");
} }
// setTimeout(()=>{ // setTimeout(()=>{
// that.getTopNum(JSON.stringify(that.days)) // that.getTopNum(JSON.stringify(that.days))
// },1000) // },1000)
}) });
}, },
immediate: true, immediate: true,
deep: true, deep: true,
...@@ -989,8 +957,7 @@ export default { ...@@ -989,8 +957,7 @@ export default {
if ( if (
x.top && x.top &&
this.currentHeight >= x.top && this.currentHeight >= x.top &&
(i == this.navs.length - 1 || (i == this.navs.length - 1 || this.currentHeight < this.navs[i + 1].top)
this.currentHeight < this.navs[i + 1].top)
) { ) {
if (this.tab != x.display) { if (this.tab != x.display) {
this.tab = x.display; this.tab = x.display;
...@@ -1026,43 +993,44 @@ export default { ...@@ -1026,43 +993,44 @@ export default {
// this.getCarData(); // this.getCarData();
}, },
methods: { methods: {
getTripFeatureImageHandler(configId){ getTripFeatureImageHandler(configId) {
this.$axios.get("http://upload.oytour.com/Home/GetTripImage?configId="+configId).then(r=>{ this.$axios
console.log(r.data,'r.data.data.id') .get("http://upload.oytour.com/Home/GetTripImage?configId=" + configId)
if(r.data.OtherFile){ .then((r) => {
this.tripImages = [] console.log(r.data, "r.data.data.id");
let OtherFile = r.data.OtherFile if (r.data.OtherFile) {
let length = OtherFile.length this.tripImages = [];
let header = OtherFile[length-1] let OtherFile = r.data.OtherFile;
let footer = OtherFile[length-2] let length = OtherFile.length;
if(OtherFile[0].indexOf('footer')!=-1){ let header = OtherFile[length - 1];
header = OtherFile[1] let footer = OtherFile[length - 2];
footer = OtherFile[0] if (OtherFile[0].indexOf("footer") != -1) {
header = OtherFile[1];
footer = OtherFile[0];
} }
OtherFile.forEach((x,i)=>{ OtherFile.forEach((x, i) => {
let obj = { let obj = {
header: header, header: header,
page: x, page: x,
footer: footer, footer: footer,
};
if (OtherFile[0].indexOf("footer") != -1) {
if (i > 1) {
this.tripImages.push(obj);
} }
if(OtherFile[0].indexOf('footer')!=-1){ } else {
if(i>1){ if (i < length - 2) {
this.tripImages.push(obj) this.tripImages.push(obj);
}
}else{
if(i<length-2){
this.tripImages.push(obj)
} }
} }
}) });
this.$forceUpdate(); this.$forceUpdate();
} }
}) });
}, },
changeShowOrderPreviewHandler() { changeShowOrderPreviewHandler() {
this.showOrderPreview = !this.showOrderPreview; this.showOrderPreview = !this.showOrderPreview;
if (!this.showOrderPreview) { if (!this.showOrderPreview) {
// this.currentPrice=null
if (this.currentPrice) { if (this.currentPrice) {
this.currentPrice.isSupportChildren = null; this.currentPrice.isSupportChildren = null;
this.currentPrice.unionCityList = null; this.currentPrice.unionCityList = null;
...@@ -1078,20 +1046,12 @@ export default { ...@@ -1078,20 +1046,12 @@ export default {
changeTripShowHandler() { changeTripShowHandler() {
this.$nextTick(() => { this.$nextTick(() => {
this.navs.forEach((x) => { this.navs.forEach((x) => {
x.top = x.top = this.$refs[x.val].getBoundingClientRect().top + this.currentHeight - 60;
this.$refs[x.val].getBoundingClientRect().top +
this.currentHeight -
60;
}); });
}); });
}, },
handleScroll(e) { handleScroll(e) {
let temp = this.getScroll().top; let temp = this.getScroll().top;
// if(temp-this.currentHeight>0){
// this.scrollDirection='down'
// }else{
// this.scrollDirection='up'
// }
this.stickyHeight = document.querySelector(".q-header--hidden") this.stickyHeight = document.querySelector(".q-header--hidden")
? "translateY(0px)" ? "translateY(0px)"
: "translateY(45px)"; : "translateY(45px)";
...@@ -1144,11 +1104,7 @@ export default { ...@@ -1144,11 +1104,7 @@ export default {
}, },
slideHandler(e) { slideHandler(e) {
this.options.currentPage = e.currentPage; this.options.currentPage = e.currentPage;
if ( if (e.currentPage != 0 && this.$refs.video && this.$refs.video.isPlaying) {
e.currentPage != 0 &&
this.$refs.video &&
this.$refs.video.isPlaying
) {
this.$refs.video.pause(); this.$refs.video.pause();
} }
}, },
...@@ -1212,39 +1168,38 @@ export default { ...@@ -1212,39 +1168,38 @@ export default {
}, },
getData() { getData() {
this.$q.loading.show(); this.$q.loading.show();
let that = this let that = this;
console.log(this.$q.loading)
this.apipost( this.apipost(
"b2b_get_Get2024B2BTravelInfoV1", "b2b_get_Get2024B2BTravelInfoV1",
this.msg, this.msg,
(r) => { (r) => {
try { try {
if (r.data.resultCode == 1 && r.data.data.id>0) { if (r.data.resultCode == 1 && r.data.data.id > 0) {
this.tripImages = [] this.tripImages = [];
this.detailsImageList = [] this.detailsImageList = [];
let header = r.data.data.feature.headerImage let header = r.data.data.feature.headerImage;
let footer = r.data.data.feature.footerImage let footer = r.data.data.feature.footerImage;
if(r.data.data.feature.tripImageList.length>0){ if (r.data.data.feature.tripImageList.length > 0) {
let OtherFile = r.data.data.feature.tripImageList let OtherFile = r.data.data.feature.tripImageList;
OtherFile.forEach((x,i)=>{ OtherFile.forEach((x, i) => {
let obj = { let obj = {
header: header, header: header,
page: x, page: x,
footer: footer, footer: footer,
};
this.tripImages.push(obj);
});
} }
this.tripImages.push(obj) if (r.data.data.feature.detailsImageList.length > 0) {
}) let OtherFile = r.data.data.feature.detailsImageList;
} OtherFile.forEach((x, i) => {
if(r.data.data.feature.detailsImageList.length>0){
let OtherFile = r.data.data.feature.detailsImageList
OtherFile.forEach((x,i)=>{
let obj = { let obj = {
header: header, header: header,
page: x, page: x,
footer: footer, footer: footer,
} };
this.detailsImageList.push(obj) this.detailsImageList.push(obj);
}) });
} }
// tripImageList detailsImageList headerImage footerImage // tripImageList detailsImageList headerImage footerImage
// this.getTripFeatureImageHandler(r.data.data.id) // this.getTripFeatureImageHandler(r.data.data.id)
...@@ -1284,8 +1239,7 @@ export default { ...@@ -1284,8 +1239,7 @@ export default {
} }
this.$nextTick(() => { this.$nextTick(() => {
if (that.dataList.feature.featureHtml != "") { if (that.dataList.feature.featureHtml != "") {
let tw = let tw = parseFloat(
parseFloat(
that.$refs.diyContext.getBoundingClientRect().width that.$refs.diyContext.getBoundingClientRect().width
); // / 1123.0 ); // / 1123.0
...@@ -1296,14 +1250,13 @@ export default { ...@@ -1296,14 +1250,13 @@ export default {
div.style.zoom = div.style.zoom =
div.offsetWidth > 1000 div.offsetWidth > 1000
? 0.999 ? 0.999
: document.documentElement.clientWidth;/// 1123.0 : document.documentElement.clientWidth; /// 1123.0
} else { } else {
div.style.zoom = 1; div.style.zoom = 1;
} }
} }
that.zoomDiyContext = tw > 1 ? 1 : tw.toFixed(2); that.zoomDiyContext = tw > 1 ? 1 : tw.toFixed(2);
} }
setTimeout(() => { setTimeout(() => {
this.navs.forEach((x) => { this.navs.forEach((x) => {
...@@ -1311,13 +1264,13 @@ export default { ...@@ -1311,13 +1264,13 @@ export default {
// this.$refs[x.val].getBoundingClientRect().top + // this.$refs[x.val].getBoundingClientRect().top +
// this.currentHeight - // this.currentHeight -
// 60; // 60;
x.top = this.$refs[x.val].getBoundingClientRect().top x.top = this.$refs[x.val].getBoundingClientRect().top;
}); });
// this.priceListHeight = // this.priceListHeight =
// this.$refs.pricelist.getBoundingClientRect().top + // this.$refs.pricelist.getBoundingClientRect().top +
// this.currentHeight - // this.currentHeight -
// 60; // 60;
this.priceListHeight = this.$refs.pricelist.getBoundingClientRect().top this.priceListHeight = this.$refs.pricelist.getBoundingClientRect().top;
this.days = []; this.days = [];
this.dayList.forEach((x) => { this.dayList.forEach((x) => {
let dayListObj = { let dayListObj = {
...@@ -1329,10 +1282,10 @@ export default { ...@@ -1329,10 +1282,10 @@ export default {
this.days.push(dayListObj); this.days.push(dayListObj);
}); });
if(this.days.length>8){ if (this.days.length > 8) {
this.moreDays = 0 this.moreDays = 0;
}else { } else {
this.moreDays = 1 this.moreDays = 1;
} }
}, 1000); }, 1000);
...@@ -1340,7 +1293,6 @@ export default { ...@@ -1340,7 +1293,6 @@ export default {
document document
.querySelector("#scrollId .q-page-container") .querySelector("#scrollId .q-page-container")
.addEventListener("scroll", this.handleScrollDay); .addEventListener("scroll", this.handleScrollDay);
} catch (error) { } catch (error) {
// console.log(document.querySelector('#scrollId .q-page-container')) // console.log(document.querySelector('#scrollId .q-page-container'))
// console.log('异常信息', error) // console.log('异常信息', error)
...@@ -1350,7 +1302,7 @@ export default { ...@@ -1350,7 +1302,7 @@ export default {
} catch (error) {} } catch (error) {}
this.$q.loading.hide(); this.$q.loading.hide();
}, },
e=>{ (e) => {
this.$q.loading.hide(); this.$q.loading.hide();
} }
); );
...@@ -1365,7 +1317,6 @@ export default { ...@@ -1365,7 +1317,6 @@ export default {
this.currentPrice.originalB2CPrice += unionCity.goFlight.addPrice; this.currentPrice.originalB2CPrice += unionCity.goFlight.addPrice;
} }
} }
console.log(this.$refs);
if (this.$q.platform.is.desktop) if (this.$q.platform.is.desktop)
this.$refs.calendar.changePriceHandler( this.$refs.calendar.changePriceHandler(
this.currentPrice.startDate, this.currentPrice.startDate,
...@@ -1415,9 +1366,8 @@ export default { ...@@ -1415,9 +1366,8 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
if (this.dataList.feature.featureHtml != "") { if (this.dataList.feature.featureHtml != "") {
let tw = let tw =
parseFloat( parseFloat(this.$refs.diyContext.getBoundingClientRect().width) /
this.$refs.diyContext.getBoundingClientRect().width 1123.0;
) / 1123.0;
let divArr = document.querySelectorAll("#setZoom>div"); let divArr = document.querySelectorAll("#setZoom>div");
for (let i = 0; i < divArr.length; i++) { for (let i = 0; i < divArr.length; i++) {
...@@ -1467,7 +1417,7 @@ export default { ...@@ -1467,7 +1417,7 @@ export default {
} }
}); });
} else { } else {
this.$message.error(r.data.message) this.$message.error(r.data.message);
} }
this.$q.loading.hide(); this.$q.loading.hide();
}, },
...@@ -1475,8 +1425,7 @@ export default { ...@@ -1475,8 +1425,7 @@ export default {
); );
}, },
menu() { menu() {
this.scroll = this.scroll = document.documentElement.scrollTop || document.body.scrollTop;
document.documentElement.scrollTop || document.body.scrollTop;
if (this.scroll > 300) { if (this.scroll > 300) {
this.isShowNav = true; this.isShowNav = true;
} else { } else {
...@@ -1495,7 +1444,7 @@ export default { ...@@ -1495,7 +1444,7 @@ export default {
.line-feature * { .line-feature * {
line-height: normal !important; line-height: normal !important;
} }
.line-feature .draggable{ .line-feature .draggable {
position: absolute; position: absolute;
} }
.slider-item { .slider-item {
...@@ -1570,11 +1519,11 @@ export default { ...@@ -1570,11 +1519,11 @@ export default {
#setZoom > div { #setZoom > div {
zoom: calc(100 / 1000); zoom: calc(100 / 1000);
} }
.large-feature img{ .large-feature img {
width:100% !important width: 100% !important;
} }
.tripImages-footer{ .tripImages-footer {
background: url('../assets/img/trip/otherBjThree.jpg') repeat; background: url("../assets/img/trip/otherBjThree.jpg") repeat;
padding: 115px 0 32px 0; padding: 115px 0 32px 0;
} }
</style> </style>
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