Commit 027798a5 authored by 黄奎's avatar 黄奎

页面修改

parent f81c0b15
<template>
<!-- f豆腐块 -->
<div class="Search_center" style="display:none;">
<ul class="pd-list">
<li class="pd-box">
<a class="pd-link">
<div class="pd-img"
:style="{backgroundImage:`url('http://de0s2vtm6rzpn.cloudfront.net/b2b/112083/tour_cover/11208315385464307090_rsz.jpg')`}">
<div class="pd-price">
<div class="price">
11
<small class="unit"></small> 50900
<small class="unit">元起</small>
</div>
</div>
</div>
<div class="pd-content">
<h3 class="pd-title">魅力歐洲~法比荷、最愛羅浮宮、特色三遊船、絕美羊角村、魅力風車城8日</h3>
<div class="pd-departure">
出發日期:2021-01-01
<span class="more">...更多</span>
</div>
</div>
</a>
</li>
<li class="pd-box">
<a class="pd-link">
<div class="pd-img"
:style="{backgroundImage:`url('http://de0s2vtm6rzpn.cloudfront.net/b2b/112083/tour_cover/11208315385464307090_rsz.jpg')`}">
<div class="pd-price">
<div class="price">
11
<small class="unit"></small> 50900
<small class="unit">元起</small>
</div>
</div>
</div>
<div class="pd-content">
<h3 class="pd-title">魅力歐洲~法比荷、最愛羅浮宮、特色三遊船、絕美羊角村、魅力風車城8日</h3>
<div class="pd-departure">
出發日期:2021-01-01
<span class="more">...更多</span>
</div>
</div>
</a>
</li>
</ul>
</div>
</template>
<template>
<!-- 模式二 -->
<div class="wl-section-block search-content">
<div class="search-filter-aside">
<div class="search-header">
篩選項目
<span class="clear-filter">清除所有篩選</span>
</div>
<div class="search-body">
<div class="search-type">
<div class="search-title">
價格
<span class="clear-filter">清除篩選</span>
</div>
<div style="width:100%;height:57px;">
</div>
<div class="range-text">
<div class="min">50,900</div>
<div class="max">50,900</div>
</div>
</div>
<div class="search-type">
<div class="search-title">
天數
<span class="clear-filter">清除篩選</span>
</div>
<q-checkbox right-label v-model="dayNum" label="11天" />
</div>
<div class="search-type">
<div class="search-title">
出發機場
<span class="clear-filter">清除篩選</span>
</div>
</div>
<div class="search-type">
<div class="search-title">
主要航班
<span class="clear-filter">清除篩選</span>
</div>
<q-checkbox right-label v-model="flight" label="長榮" />
</div>
<div class="search-type">
<div class="search-title">
主要航班
<span class="clear-filter">清除篩選</span>
</div>
<div class="q-gutter-sm">
<q-checkbox v-model="StartWeek" v-for="(item,index) in weekList" val="teal" :label="item.label" :key="index"
color="teal" />
</div>
</div>
</div>
</div>
<div class="group-result-list">
<div class="group-statis-block">
<div class="group-share"></div>
<div class="group-statis-detail">
<span class="title">全區 歐</span>
:找到
<span class="num"> 1 </span>個行程
<span class="pc">,目前在第<span style="color: #7f7f7f;"> 1 </span></span>
</div>
</div>
<div>
<div class="group-box">
<a class="group-cover">
<img src="http://de0s2vtm6rzpn.cloudfront.net/b2b/112083/tour_cover/11208315385464307090_rsz.jpg">
</a>
<div class="group-main">
<div class="group-info">
<div class="group-name" style="margin-bottom:5px;">
魅力歐洲~法比荷、最愛羅浮宮、特色三遊船、絕美羊角村、魅力風車城8日
</div>
<div class="group-detail">
<i class="iconfont iconaddress"></i>
<span>巴黎省</span>
</div>
<div class="group-detail">
<i class="iconfont icontime"></i>
<span>11 天</span>
</div>
<ul class="group-list">
<li>
<a>2021-01-01</a>
</li>
</ul>
</div>
<div class="price-info">
<div class="price-wrap">
<div class="price_Search">
<small class="price_unit">TWD$</small>50900
</div>
<a class="btn_warning">更多出發日</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
......@@ -641,7 +641,7 @@
<div v-if="$q.screen.xs">
<div class="search-bar-m">
<i class="iconfont iconchazhao"></i>
<input type="text" placeholder="搜尋" value="" @click="showPopup=true" readonly="readonly"
<input type="text" placeholder="搜尋" value="" @click="showPopup=true,goSearchHandler" readonly="readonly"
class="keyword-input">
</div>
<div class="sortDiv">
......@@ -650,153 +650,14 @@
</div>
</div>
</div>
<!-- 模式一 -->
<div class="Search_center" style="display:none;">
<ul class="pd-list">
<li class="pd-box">
<a class="pd-link">
<div class="pd-img"
:style="{backgroundImage:`url('http://de0s2vtm6rzpn.cloudfront.net/b2b/112083/tour_cover/11208315385464307090_rsz.jpg')`}">
<div class="pd-price">
<div class="price">
11
<small class="unit"></small> 50900
<small class="unit">元起</small>
</div>
</div>
</div>
<div class="pd-content">
<h3 class="pd-title">魅力歐洲~法比荷、最愛羅浮宮、特色三遊船、絕美羊角村、魅力風車城8日</h3>
<div class="pd-departure">
出發日期:2021-01-01
<span class="more">...更多</span>
</div>
</div>
</a>
</li>
<li class="pd-box">
<a class="pd-link">
<div class="pd-img"
:style="{backgroundImage:`url('http://de0s2vtm6rzpn.cloudfront.net/b2b/112083/tour_cover/11208315385464307090_rsz.jpg')`}">
<div class="pd-price">
<div class="price">
11
<small class="unit"></small> 50900
<small class="unit">元起</small>
</div>
</div>
</div>
<div class="pd-content">
<h3 class="pd-title">魅力歐洲~法比荷、最愛羅浮宮、特色三遊船、絕美羊角村、魅力風車城8日</h3>
<div class="pd-departure">
出發日期:2021-01-01
<span class="more">...更多</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<!-- 模式二 -->
<div class="wl-section-block search-content">
<div class="search-filter-aside">
<div class="search-header">
篩選項目
<span class="clear-filter">清除所有篩選</span>
</div>
<div class="search-body">
<div class="search-type">
<div class="search-title">
價格
<span class="clear-filter">清除篩選</span>
</div>
<div style="width:100%;height:57px;">
</div>
<div class="range-text">
<div class="min">50,900</div>
<div class="max">50,900</div>
</div>
</div>
<div class="search-type">
<div class="search-title">
天數
<span class="clear-filter">清除篩選</span>
</div>
<q-checkbox right-label v-model="dayNum" label="11天" />
</div>
<div class="search-type">
<div class="search-title">
出發機場
<span class="clear-filter">清除篩選</span>
</div>
</div>
<div class="search-type">
<div class="search-title">
主要航班
<span class="clear-filter">清除篩選</span>
</div>
<q-checkbox right-label v-model="flight" label="長榮" />
</div>
<div class="search-type">
<div class="search-title">
主要航班
<span class="clear-filter">清除篩選</span>
</div>
<div class="q-gutter-sm">
<q-checkbox v-model="StartWeek" v-for="(item,index) in weekList" val="teal" :label="item.label"
:key="index" color="teal" />
</div>
</div>
</div>
</div>
<div class="group-result-list">
<div class="group-statis-block">
<div class="group-share"></div>
<div class="group-statis-detail">
<span class="title">全區 歐</span>
:找到
<span class="num"> 1 </span>個行程
<span class="pc">,目前在第<span style="color: #7f7f7f;"> 1 </span></span>
</div>
</div>
<div>
<div class="group-box">
<a class="group-cover">
<img src="http://de0s2vtm6rzpn.cloudfront.net/b2b/112083/tour_cover/11208315385464307090_rsz.jpg">
</a>
<div class="group-main">
<div class="group-info">
<div class="group-name" style="margin-bottom:5px;">
魅力歐洲~法比荷、最愛羅浮宮、特色三遊船、絕美羊角村、魅力風車城8日
</div>
<div class="group-detail">
<i class="iconfont iconaddress"></i>
<span>巴黎省</span>
</div>
<div class="group-detail">
<i class="iconfont icontime"></i>
<span>11 天</span>
</div>
<ul class="group-list">
<li>
<a>2021-01-01</a>
</li>
</ul>
</div>
<div class="price-info">
<div class="price-wrap">
<div class="price_Search">
<small class="price_unit">TWD$</small>50900
</div>
<a class="btn_warning">更多出發日</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<template v-if="ShowType==0">
<searchBlock></searchBlock>
</template>
<template v-else>
<searchList></searchList>
</template>
<q-dialog v-model="fullHeight" full-height>
<q-card class="column full-height" style="width: 500px">
<div class="moreTiaojiao">更多篩選條件</div>
......@@ -826,7 +687,7 @@
</div>
<div class="full_btndiv">
<q-btn color="white" style="width:49%" text-color="black" label="清除" />
<q-btn color="primary" style="width:49%" label="套用" v-close-popup />
<q-btn color="primary" style="width:49%" label="套用222" v-close-popup @click="goSearchHandler" />
</div>
</q-card>
</q-dialog>
......@@ -897,11 +758,14 @@
</template>
<script>
//搜尋輪播淡出 - 小
import popup from "../components/props/index";
import searchBlock from "../components/searchdata/block";
import searchList from "../components/searchdata/list";
export default {
components: {
popup
popup,
searchBlock,
searchList,
},
data() {
return {
......@@ -993,15 +857,20 @@
searchKey: "",
startCityId: 0,
},
ShowType: 0, //显示样式(0-豆腐格,1-列表)
//行程列表
DataList: [],
};
},
mounted() {
if (localStorage.baseifo) {
var jObj = JSON.parse(localStorage.baseifo);
this.areas = jObj.AreaList;
this.ShowType = jObj.Config.ShowType;
} else {
this.getAera()
}
document.addEventListener("click", this.clickHandler);
},
methods: {
......
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