Skip to content

M
million
Commit b67ff275 authored by 罗超's avatar 罗超
Browse files
Options

完善部分信息

parent 6f0a8f31
Expand all Show whitespace changes
Inline Side-by-side
Showing with 15909 additions and 10093 deletions
.vscode/settings.json
View file @ b67ff275
{
"vetur.experimental.templateInterpolationService": true
"vetur.experimental.templateInterpolationService": true,
"vue-i18n.i18nPaths": "src/i18n"
}
package.json
View file @ b67ff275
......@@ -20,6 +20,10 @@
"qrcode.vue": "^1.7.0",
"qrcodejs2": "^0.0.2",
"quasar": "^1.0.0",
"v-viewer": "^1.6.4",
"vue-concise-slider": "^4.2.5",
"vue-core-video-player": "^0.2.0",
"vue-core-video-players": "0.0.5",
"vue-i18n": "^8.0.0"
},
"devDependencies": {
......
quasar.conf.js
View file @ b67ff275
......@@ -90,7 +90,7 @@ module.exports = function( /* ctx */ ) {
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework
framework: {
iconSet: 'material-icons', // Quasar icon set
lang: 'en-us', // Quasar language pack
lang: 'zh-hant', // Quasar language pack
// Possible values for "all":
// * 'auto' - Auto-import needed Quasar components & directives
......@@ -149,7 +149,20 @@ module.exports = function( /* ctx */ ) {
'QCheckbox',
'QPagination',
'QRadio',
'QCardSection'
'QCardSection',
'QBreadcrumbs',
'QBreadcrumbsEl',
'QExpansionItem',
'QRange',
'QPageSticky',
'QTabPanels',
'QTabPanel',
'QTimeline',
'QTimelineEntry',
'QResponsive',
'QTooltip',
'QBadge',
'QParallax'
],
directives: [
......
src/App.vue
View file @ b67ff275
......@@ -10,7 +10,7 @@ export default {
};
</script>
<style>
@import url("//at.alicdn.com/t/font_1890699_t3cp3liyfpg.css");
@import url("//at.alicdn.com/t/c/font_1890699_q162a9wo98a.css");
@font-face {
font-family: "oswald";
src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf");
......@@ -22,16 +22,35 @@ body {
Microsoft JhengHei;
background-color: #f6f6f6;
}
.rounded-borders{
border-radius: 6px !important;
}
.section-block {
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.f12{
font-size: 12px !important;
font-family: "Noto Sans SC", 微软雅黑, "Microsoft YaHei", sans-serif !important;
font-weight: 400 !important;
}
.text-middle{
display: flex;
align-items: center;
}
@media only screen and (max-width: 1200px) {
.section-block {
max-width: 768px !important;
padding:0 20px !important;
}
}
.light-shadow{
box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.2) !important
}
.product-price {
font-family: Arial Rounded MT Bold,Arial Rounded MT,sans-serif;
letter-spacing: 0;
text-align: right;
}
</style>
src/boot/utils.js
View file @ b67ff275
import Vue from 'vue'
import axios from 'axios'
import md5 from 'js-md5'
import VueCoreVideoPlayer from 'vue-core-video-players'
import 'viewerjs/dist/viewer.css'
import VueViewer from 'v-viewer'
// import VueCoreVideoPlayer from 'vue-core-video-player'
Vue.use(VueCoreVideoPlayer)
Vue.use(VueViewer)
//域名管理对象
Vue.prototype.domainManager = function () {
let domainUrl = '';
......@@ -13,6 +19,7 @@ Vue.prototype.domainManager = function () {
domainUrl = "http://testapi.oytour.com";
} else if (domainNameUrl.indexOf('oytour') !== -1) {
domainUrl = "http://reborn.oytour.com";
domainUrl = 'http://192.168.10.206:8015'
}
var obj = {
//主地址
......@@ -29,10 +36,48 @@ Vue.prototype.domainManager = function () {
Vue.prototype.GetDomain=function()
{
var domainNameUrl =window.location.hostname;
//domainNameUrl="tmb2b.oytour.com";
domainNameUrl="t.oytour.com";
return domainNameUrl;
}
Vue.prototype.groupBy = function (array, f){
const groups = {};
array.forEach((item) => {
const group = JSON.stringify(f(item));
groups[group] = groups[group] || [];
groups[group].push(item);
});
return Object.keys(groups).map((group) => {
return {
key:group.replace(/\"/g,""),
data:groups[group]
};
});
}
Vue.prototype.moneyFormat = function(num, decimal = 2, split = ',') {
function thousandFormat (num){
const len = num.length
return len <= 3 ? num : thousandFormat(num.substr(0, len - 3)) + split + num.substr(len - 3, 3)
}
if (isFinite(num)) { // num是数字
if (num === 0) { // 为0
return num.toFixed(decimal)
} else { // 非0
var res = ''
var dotIndex = String(num).indexOf('.')
if (dotIndex === -1) { // 整数
res = thousandFormat(String(num)) + (decimal>0?'.':'') + '0'.repeat(decimal)
} else {
decimal = decimal==0?2:decimal
const numStr = String((Math.round(num * Math.pow(10, decimal)) / Math.pow(10, decimal)).toFixed(decimal)) // 四舍五入，然后固定保留2位小数
const decimals = numStr.slice(dotIndex, dotIndex + decimal + 1) // 截取小数位
res = thousandFormat(numStr.slice(0, dotIndex)) + decimals
}
return res
}
} else {
return '--'
}
}
//HTTP提交数据
Vue.prototype.apipost = function (cmd, msg, successCall, faildCall) {
if (msg == null || msg == "") {
......
src/components/common/end.vue 0 → 100644
View file @ b67ff275
This diff is collapsed.
src/components/label_background_article/left.vue
View file @ b67ff275
<template>
<!--背景圖 - 文左-->
<div class="q-mt-lg">
<section class="about1" :style="{backgroundImage:`url('${plugData.ImageUrl}')`}">
<div class="q-mt-md">
<section
class="about1"
:style="{ backgroundImage: `url('${plugData.ImageUrl}')` }"
:class="{ padding: isPadding }"
>
<div class="section-block">
<div class="about-main">
<h2 class="about-title">{{plugData.Title}}</h2>
<div class="about-content">
{{plugData.Describe}}
<h2 class="about-title">{{ plugData.Title.split("|")[0] }}</h2>
<div class="about-content f12">
{{ plugData.Describe }}
</div>
<q-btn
v-if="link"
label="立即奔赴"
class="q-mt-md"
icon-right="iconfont iconswap-right"
style="background: rgba(210, 210, 210, 0.7)"
unelevated
@click="OpenNewUrl"
/>
</div>
</div>
</section>
</div>
</template>
<script>
export default {
export default {
props: ["plugData"],
data() {
return {
isPadding: false,
link: "",
};
},
mounted() {
if (this.plugData) {
if (this.plugData.Title.indexOf("|padding") != -1) {
this.isPadding = true;
}
if (this.plugData.Title.indexOf("http://") != -1) {
let t = this.plugData.Title.split("|").find(
(x) => x.indexOf("http://") != -1
);
this.link = t;
}
}
},
methods: {
OpenNewUrl(){
window.location.href=this.link
}
},
};
</script>
<style>
.about1 {
.about1 {
background-size: cover;
background-position: center;
position: relative;
margin: 0;
padding: 0;
border: 0;
}
.about1::after {
}
.about1.padding {
max-width: 1200px;
margin: 0 auto;
padding: 0 16px;
border-radius: 5px;
overflow: hidden;
}
.about1::after {
top: 0;
left: 0;
height: 100%;
......@@ -38,9 +80,9 @@
right: 0;
position: absolute;
bottom: 0;
}
}
.about1 .about-main {
.about1 .about-main {
position: relative;
padding: 100px 0;
z-index: 2;
......@@ -48,30 +90,29 @@
color: #fff;
font-weight: 700;
letter-spacing: 1px;
}
}
.about1 .about-main .about-title {
.about1 .about-main .about-title {
margin-bottom: 35px;
font-size: 38px;
margin: 0;
padding: 0;
line-height: unset;
font-weight: 600;
}
}
.about1 .about-main .about-content {
.about1 .about-main .about-content {
font-size: 16px;
line-height: 2.1;
margin: 0;
padding: 0;
}
}
@media only screen and (max-width: 1200px) {
@media only screen and (max-width: 1200px) {
.about1 .about-main {
padding-right: 30px !important;
padding-left: 30px !important;
width: 100% !important;
}
}
}
</style>
src/components/label_paragraph_title/paragraph1.vue
View file @ b67ff275
<template>
<div class="q-mt-lg">
<div class="q-mt-xl">
<section class="section-block about6">
<!--段落標題 - 1x1-->
<h2 class="about-title">{{plugData.Title}}</h2>
<ul class="about-list">
<ul class="about-list" v-if="plugData.Describe">
<li class="list-item">
<div class="content">
{{plugData.Describe}}
......
src/components/label_picture/diy-img-five.vue
View file @ b67ff275
<template>
<!--圖片 - 6x1-->
<div class="q-mt-lg">
<div class="q-mt-xl">
<section class="scence2 section-block">
<div class="content">
<h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser">{{plugData.SubTitle}}</p>
<h2 class="block-title">{{ plugData.Title.split('|')[0] }}</h2>
<p class="title-teaser">{{ plugData.SubTitle }}</p>
</div>
<div class="scence-wrap">
<!-- <div class="scence-wrap">
<ul class="scence-list">
<li v-for="(item,index) in plugData.Details" :key="index" v-if="item.ImageUrl">
<a @click="OpenNewUrl(item.LinkUrl)" target="_blank" class="img"
:style="{backgroundImage:`url('${item.ImageUrl}')`}">
<h4 class="scence-title">{{(item.TripTitle &&item.TripTitle.length>14)? item.TripTitle.substring(0,14):item.TripTitle}}</h4>
<template v-for="(item, index) in plugData.Details">
<li :key="index" v-if="item.ImageUrl">
<a
@click="OpenNewUrl(item.LinkUrl)"
target="_blank"
class="img rounded-borders overflow-hidden"
:style="{ backgroundImage: `url('${item.ImageUrl}')` }"
>
<h4 class="scence-title">
{{
item.TripTitle && item.TripTitle.length > 14
? item.TripTitle.substring(0, 14)
: item.TripTitle
}}
</h4>
</a>
</li>
</template>
</ul>
</div> -->
<div
class="row items-center q-col-gutter-md q-mt-md no-wrap"
style="margin-left: -16px"
:class="{'overflow-auto full-width':$q.platform.is.mobile}"
>
<template v-for="(item, index) in plugData.Details">
<div
v-if="item.ImageUrl"
:key="index"
class="relative-position"
style=" min-width: 200px;"
:class="{ 'col': current != index && $q.platform.is.desktop, 'col-4': current == index&& $q.platform.is.desktop }"
@mouseenter="hoverHandler(index)"
>
<q-img
:src="item.ImageUrl"
spinner-color="grey"
spinner-size="20px"
height="270px"
class="rounded-borders overflow-hidden"
/>
<div class="absolute-bottom-left absolute-bottom-right rounded-borders overflow-hidden q-pa-md" style="left:16px;background: linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,.5));">
<div class="subtitle" style="">
<a :href="item.LinkUrl" target="_blank" rel="noopener noreferrer" style="color:inherit;">
{{
item.TripTitle.split('|')[0]}}
</a>
<div class="q-mt-sm row items-center no-wrap overflow-hidden" v-if="current==index && plugData.Title.indexOf('|tag')!=-1">
<q-chip outline color="grey-2" class="f12 cursor-pointer" text-color="grey-2" >觀光行程</q-chip>
<q-chip outline color="grey-2" class="f12 cursor-pointer" text-color="grey-2" >熱門票券</q-chip>
<q-chip style="background:rgba(255,255,255,.3)" class="f12 cursor-pointer" text-color="grey-2" >更多在地體驗</q-chip>
</div>
</div>
</div>
</div>
</template>
</div>
</section>
</div>
</template>
<script>
//圖片 - 6x1
export default {
props: ["plugData"]
//圖片 - 6x1
export default {
props: ["plugData"],
data() {
return {
current: 0,
};
},
methods: {
hoverHandler(i) {
this.current = i;
},
getTagHandler(str){
let arr = []
let strs=str.split('|')
if(strs.length>1){
arr=strs[1].split(',')
}
return arr
}
},
};
</script>
<style>
.scence2 {}
.scence2 {
}
.scence2 .block-title {
.scence2 .block-title {
font-size: 22px;
font-weight: 600;
padding: 0;
margin: 0;
line-height: unset;
}
}
.scence2 .title-teaser {
.scence2 .title-teaser {
margin-bottom: 10px;
font-size: 16px;
color: #999;
}
}
.scence2 .scence-wrap {
.scence2 .scence-wrap {
margin-top: 15px;
}
}
.scence2 .scence-list {
.scence2 .scence-list {
margin-left: -8px;
margin-right: -8px;
display: flex;
flex-wrap: wrap;
padding: 0;
}
}
.scence2 .scence-list>* {
.scence2 .scence-list > * {
padding: 0;
margin: 0;
display: block;
......@@ -69,22 +136,22 @@
-moz-transform 0.2s ease, -o-transform 0.2s ease, transform 0.2s ease,
box-shadow 0.2s ease;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.09);
}
}
.scence2 .scence-list>*:last-child {
.scence2 .scence-list > *:last-child {
margin-right: 0px;
}
}
.scence2 .scence-list>* a {
.scence2 .scence-list > * a {
position: relative;
display: block;
width: 100%;
height: 300px;
background-size: cover;
background-position: center;
}
}
.scence2 .scence-list>* a::before {
.scence2 .scence-list > * a::before {
position: absolute;
right: 0;
bottom: 0;
......@@ -92,12 +159,14 @@
z-index: 1;
height: 80px;
content: "";
background-image: linear-gradient(to bottom,
background-image: linear-gradient(
to bottom,
rgba(0, 0, 0, 0.02) 0,
rgba(0, 0, 0, 0.8) 100%);
}
rgba(0, 0, 0, 0.8) 100%
);
}
.scence2 .scence-list>* a .scence-title {
.scence2 .scence-list > * a .scence-title {
position: absolute;
display: block;
padding: 0 16px 16px;
......@@ -112,9 +181,19 @@
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
word-break: break-all;
z-index: 2;
}
}
.scence2 .subtitle {
/* white-space: pre-wrap; */
font-size: 18px;
font-weight: 600;
color: #fff;
text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
word-break: break-all;
z-index: 2;
}
.scence2 .scence-list>* {
.scence2 .scence-list > * {
display: block;
width: calc(25% - 16px);
margin: 8px;
......@@ -124,17 +203,17 @@
-moz-transform 0.2s ease, -o-transform 0.2s ease, transform 0.2s ease,
box-shadow 0.2s ease;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.09);
}
}
@media only screen and (min-width: 1200px) {
.scence2 .scence-list>* {
@media only screen and (min-width: 1200px) {
.scence2 .scence-list > * {
display: inline-block !important;
vertical-align: middle !important;
width: 180px !important;
}
}
}
@media only screen and (max-width: 800px) {
@media only screen and (max-width: 800px) {
.scence2 {
margin-top: 40px;
}
......@@ -156,11 +235,10 @@
overflow-y: scroll !important;
}
.scence2 .scence-list>* {
.scence2 .scence-list > * {
display: inline-block !important;
vertical-align: middle !important;
width: 180px !important;
}
}
}
</style>
src/components/label_picture/diy-img-two.vue
View file @ b67ff275
<template>
<!--圖片 - 4x1-->
<div>
<section class="tour1 section-block">
<h2 class="block-title">{{plugData.Title}}</h2>
<p class="title-teaser">{{plugData.SubTitle}}</p>
<ul class="pd-list">
<li class="pd-box" v-for="(item,index) in plugData.Details" :key="index" v-if="item.TripImageUrl">
<a @click="OpenNewUrl(item.LinkUrl)" :title="item.TripTitle" class="pd-link">
<div class="pd-img" :style="{backgroundImage:`url('${(item.TripImageUrl&&item.TripImageUrl!=''?item.TripImageUrl:item.ImageUrl)}')`}">
<div :class="{'q-mt-md':plugData.Title.split('|')[0]=='','q-mt-xl':plugData.Title.split('|')[0]!=''}">
<section class="tour1 section-block" v-if="plugData">
<h2 class="block-title">{{ plugData.Title.split("|")[0] }}</h2>
<p class="title-teaser">{{ plugData.SubTitle }}</p>
<ul class="pd-list" v-if="showType == 1">
<li
class="pd-box"
v-for="(item, index) in plugData.Details"
:key="index"
v-if="item.TripImageUrl"
>
<a
@click="OpenNewUrl(item.LinkUrl)"
:title="item.TripTitle"
class="pd-link"
>
<div
class="pd-img"
:style="{
backgroundImage: `url('${
item.TripImageUrl && item.TripImageUrl != ''
? item.TripImageUrl
: item.ImageUrl
}')`,
}"
>
<div class="pd-price">
<div class="price">
{{item.DayNum}}
<small class="unit">天</small> {{item.Price}}
{{ item.DayNum }}
<small class="unit">天</small> {{ item.Price }}
<small class="unit">元起</small>
</div>
</div>
</div>
<div class="pd-content">
<h3 class="pd-title">{{item.TripTitle}}</h3>
<h3 class="pd-title">{{ item.TripTitle }}</h3>
</div>
</a>
</li>
</ul>
<div class="row q-col-gutter-md" style="item" v-else-if="showType == 2">
<template v-for="(item, index) in plugData.Details">
<div
class="col-3 relative-position column"
:key="index"
v-if="item.TripImageUrl"
>
<div
class="absolute-top-left q-pa-sm"
style="
background: linear-gradient(
to bottom,
rgba(0, 0, 0, 0.5),
rgba(0, 0, 0, 0)
);
top: 16px;
left: 16px;
right: 0;
border-radius: 12px;
z-index: 1;
"
>
<div
class="text-grey-4"
style="text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5)"
>
<q-icon name="iconfont icondingweixiao" size="16px" />
<span class="q-ml-sm">日本, 多个城市</span>
</div>
</div>
<q-img
:src="item.TripImageUrl"
:ratio="16 / 9"
spinner-color="primary"
spinner-size="20px"
style="border-radius: 12px"
/>
<div class="col">
<div class="q-mt-md text-subtitle1 text-dark ellipsis-2-lines cursor-pointer" @click="OpenNewUrl(item.LinkUrl)">
<!-- -->
{{ item.TripTitle }}
</div>
<div class="row items-center q-col-gutter-sm q-mt-sm">
<q-chip
style="background: rgba(193, 0, 21, 0.1)"
size="sm"
class="f12 rounded-borders text-negative"
label="急速確認"
/>
<q-chip
style="background: rgba(193, 0, 21, 0.1)"
size="sm"
class="f12 rounded-borders text-negative"
label="七天前免費取消"
/>
</div>
</div>
<div class="q-mt-sm">
<div class="text-grey-5 f12" style="text-decoration: line-through;">CNY {{item.Price }}</div>
<div class="text-subtitle2 text-weight-bolder text-dark">
<span>CNY {{ item.Price }}</span>
<span class="text-grey-8 f12 q-ml-sm">起</span>
</div>
</div>
</div>
</template>
</div>
</section>
</div>
</template>
<script>
export default {
props: ["plugData"]
};
import internal from "stream";
export default {
props: ["plugData"],
data() {
return {
showType: 1,
};
},
mounted() {
if(this.plugData){
let t = this.plugData.Title.split("|");
this.showType = t.length > 1 ? parseInt(t[1]) : 1;
}
},
methods: {
OpenNewUrl(url){
window.location.href=url
}
},
};
</script>
<style>
.tour1 {}
.tour1 {
}
.tour1 .block-title {
.tour1 .block-title {
font-size: 22px;
font-weight: 600;
padding: 0;
margin: 0;
}
}
.tour1 .title-teaser {
.tour1 .title-teaser {
margin-bottom: 10px;
font-size: 16px;
color: #999;
}
}
.tour1 .pd-list {
.tour1 .pd-list {
display: flex;
flex-flow: row wrap;
padding: 0;
margin: 0;
}
}
.tour1 .pd-list .pd-box {
.tour1 .pd-list .pd-box {
padding: 0;
margin: 0;
margin-right: 20px;
......@@ -74,18 +177,19 @@
border-radius: 4px;
overflow: hidden;
cursor: pointer;
}
}
.tour1 .pd-list .pd-box:last-child {
.tour1 .pd-list .pd-box:last-child {
margin-right: 0px;
}
a {
}
a {
text-decoration: none;
color: var(--q-color-primary);
}
}
.tour1 .pd-box .pd-img {
.tour1 .pd-box .pd-img {
position: relative;
width: 100%;
padding-bottom: 66.237%;
......@@ -94,9 +198,9 @@
-o-background-size: cover;
background-size: cover;
background-position: center;
}
}
.tour1 .pd-box .pd-img .pd-price {
.tour1 .pd-box .pd-img .pd-price {
position: absolute;
right: 0;
bottom: 0;
......@@ -104,9 +208,9 @@
width: 100%;
border-bottom: 4px solid var(--q-color-primary);
text-align: right;
}
}
.tour1 .pd-box .pd-img .pd-price .price {
.tour1 .pd-box .pd-img .pd-price .price {
display: inline-block;
padding: 4px 12px 0;
color: #fff;
......@@ -119,25 +223,25 @@
-moz-background-clip: padding;
border-radius: 5px 0 0;
background-clip: padding-box;
}
}
.tour1 .pd-box .pd-img .pd-price .price small {
.tour1 .pd-box .pd-img .pd-price .price small {
padding: 0 4px;
font-size: 14px;
}
}
.tour1 .pd-box .pd-content {
.tour1 .pd-box .pd-content {
padding: 15px 15px 20px;
}
}
.tour1 .pd-box .pd-title {
.tour1 .pd-box .pd-title {
font-size: 15px;
line-height: 1.5;
font-weight: 400;
color: #333;
}
}
@media only screen and (max-width: 1200px) {
@media only screen and (max-width: 1200px) {
.tour1 .pd-list .pd-box {
flex-basis: calc(50% - 10px) !important;
}
......@@ -145,20 +249,19 @@
.tour1 .pd-list .pd-box:nth-child(even) {
margin-right: 0 !important;
}
}
}
@media only screen and (min-width: 768px) {
@media only screen and (min-width: 768px) {
.pd-box:hover {
transform: translate(0, -4px) !important;
box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.1) !important;
}
}
}
@media only screen and (max-width: 425px) {
@media only screen and (max-width: 425px) {
.tour1 .pd-list .pd-box {
flex-basis: 100% !important;
margin-right: 0 !important;
}
}
}
</style>
src/components/navs/hor-big-one.vue
View file @ b67ff275
This diff is collapsed.
src/components/search_s/search_s1.vue
View file @ b67ff275
<template>
<!--搜尋輪播橫 - 大-->
<div>
<div class="big-slider">
<q-carousel v-model="slide" transition-prev="slide-right" transition-next="slide-left" :autoplay="true" swipeable
animated control-color="white" padding arrows infinite height="410px"
class="bg-primary text-white shadow-1 rounded-borders">
......
src/components/search_s/search_s2.vue
View file @ b67ff275
This diff is collapsed.
src/components/search_s/search_s3.vue
View file @ b67ff275
<template>
<!--搜尋輪播橫 - 小-->
<div>
<div class="small-slider">
<q-carousel v-model="slide" transition-prev="slide-right" transition-next="slide-left" :autoplay="true" swipeable
animated control-color="white" padding arrows infinite height="235px"
class="bg-primary text-white shadow-1 rounded-borders">
......
src/components/search_sf/search_sf2.vue
View file @ b67ff275
This diff is collapsed.
src/components/searchdata/kkday.vue 0 → 100644
View file @ b67ff275
This diff is collapsed.
src/components/trip/calendar.vue 0 → 100644
View file @ b67ff275
<template>
<div>
<div class="text-subtitle2 text-weight-bold">選擇日期、選項</div>
<div class="text-grey-6 f12 q-my-md">請選擇出發日期</div>
<div class="rounded-borders" style="border: 1px solid #eee">
<div class="q-px-lg q-py-sm row items-center">
<div class="text-subtitle2 text-weight-bold col">
{{ months[currentMonth].display }}
</div>
<div>
<q-btn
color="primary"
round
icon="iconfont iconpreviewleft"
flat
@click="changeShowMonthHandler(-1)"
class="q-mr-sm"
:disable="currentMonth == 0"
/>
<q-btn
color="primary"
round
icon="iconfont iconpreviewright"
flat
@click="changeShowMonthHandler(1)"
:disable="currentMonth == months.length - 1"
/>
</div>
</div>
<div class="q-pa-sm non-selectable" style="border-top: 1px solid #eee">
<div class="row items-center">
<div
class="col text-weight-bold text-center"
style="padding: 10px 0 20px"
v-for="(x, i) in chineseWeek"
:key="i"
>
{{ x }}
</div>
</div>
<div class="row wrap">
<div
class="rounded-borders text-center text-weight-bold"
:class="{
'cursor-pointer hover-date': x.value != '' && x.price,
'cursor-not-allowed': !x.price && x.value != '',
'bg-primary': x.value != '' && x.value == currentDate,
}"
style="padding: 8px 4px; width: 14.285%"
v-for="(x, i) in col"
:key="i"
@click="chosenDateHandler(x)"
>
<div
class="text-dark"
:class="{ 'text-white': x.value == currentDate }"
v-if="x.price"
>
{{ x.display }}
</div>
<div class="text-grey-6" v-else>{{ x.display }}</div>
<div
class="q-mt-sm f12"
:class="{
'text-grey-1': x.value == currentDate,
' text-grey-6': x.value != currentDate,
}"
>
{{
x.price ? moneyFormat(x.price.originalB2CPrice, 0) : "&nbsp;"
}}
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { date } from "quasar";
export default {
props: ["priceList"],
data() {
return {
chineseWeek: ["日", "一", "二", "三", "四", "五", "六"],
chineseMonth: [
"一月",
"二月",
"三月",
"四月",
"五月",
"6月",
"七月",
"八月",
"九月",
"十月",
"十一月",
"十二月",
],
data: [],
months: [],
currentMonth: 0,
col: [],
prices: [],
currentDate: "",
};
},
watch: {
priceList: {
handler(oldValue, newVal) {
this.prices = newVal;
this.init();
},
deep: true, // 深度监听
},
},
created() {
this.prices = this.priceList;
this.init();
},
methods: {
init() {
this.createChosenDateHandler();
let firstMonth = date.formatDate(
new Date(this.prices[0].startDate),
"YYYY/MM"
);
this.currentMonth =
this.months.findIndex((x) => x.monthValue == firstMonth) ?? 0;
this.changeMonthHandler();
},
createChosenDateHandler() {
let beginDate = new Date();
let endDate = date.addToDate(beginDate, { years: 1 });
while (beginDate <= endDate) {
let i = parseInt(date.formatDate(beginDate, "M")) - 1;
this.months.push({
value: date.formatDate(beginDate, "YYYY/MM/DD"),
monthValue: date.formatDate(beginDate, "YYYY/MM"),
display: `${date.formatDate(beginDate, "YYYY")} ${
this.chineseMonth[i]
}`,
});
beginDate = date.addToDate(beginDate, { months: 1 });
}
},
changeShowMonthHandler(i) {
this.currentMonth += i;
this.changeMonthHandler();
},
changeMonthHandler() {
this.col = [];
let newDate = new Date(this.months[this.currentMonth].monthValue);
let newBeginDate = date.startOfDate(newDate, "month");
let newEndDate = date.endOfDate(newDate, "month");
for (let i = 0; i < date.formatDate(newBeginDate, "d"); i++) {
this.col.push({
value: "",
});
}
while (newBeginDate <= newEndDate) {
let value = date.formatDate(newBeginDate, "YYYY-MM-DD");
let price = this.prices.find((x) => x.startDate == value && x.remainNum>0);
this.col.push({
value,
display: date.formatDate(newBeginDate, "DD"),
price,
});
newBeginDate = date.addToDate(newBeginDate, { days: 1 });
}
let after = 6 - date.formatDate(newBeginDate, "d");
for (let i = 0; i < after; i++) {
this.col.push({
value: "",
});
}
},
chosenDateHandler(item) {
if (item.price) {
this.currentDate = item.value;
this.$emit("change", item);
}
},
reset() {
this.currentDate = "";
},
},
};
</script>
<style>
.hover-date:hover {
background: #eee;
}
</style>
src/components/trip/orderPreview.vue 0 → 100644
View file @ b67ff275
This diff is collapsed.
src/components/trip/smaple.vue 0 → 100644
View file @ b67ff275
<template>
<div class="q-mt-md">
<div class="text-subtitle2 text-weight-bold">產品概要</div>
<div class="row q-pt-md q-col-gutter-md">
<div class="row items-center q-pt-mb col-6" v-if="traffic!=''">
<div class="col-3 q-mr-md">往返交通：</div>
<div class="col text-grey-6">{{ traffic }}</div>
</div>
<div class="row items-center q-pt-mb col-6" v-if="hotel!=''">
<div class="col-3 q-mr-md">酒店住宿：</div>
<div class="col text-grey-6">{{ hotel }}</div>
</div>
<div class="row items-center q-pt-mb col-6">
<div class="col-3 q-mr-md">購物：</div>
<div class="col text-grey-6">{{ trip.shopList.length>0?`${trip.shopList.length}個購物點`:'無購物行程' }}</div>
</div>
<div class="row items-center q-pt-mb col-6" v-if="team!=''">
<div class="col-3 q-mr-md">團隊人數：</div>
<div class="col text-grey-6">{{ team }}</div>
</div>
<div class="row items-center q-pt-mb col-6">
<div class="col-3 q-mr-md">景點：</div>
<div class="col text-grey-6">{{ trip.scenicList.length }}個景點或場館</div>
</div>
<div class="row items-center q-pt-mb col-6">
<div class="col-3 q-mr-md">自費項目：</div>
<div class="col text-grey-6">{{ trip.selfpayingList.length>0?`${trip.selfpayingList.length}個自費項目`:'無自費項目' }}</div>
</div>
<div class="row items-center q-pt-mb col-6" v-if="trip.freedomList.length>0">
<div class="col-3 q-mr-md">自由活動：</div>
<div class="col text-grey-6">{{ trip.freedomList.length}} 次自由活動</div>
</div>
<div class="row items-center q-pt-mb col-6">
<div class="col-3 q-mr-md">餐食：</div>
<div class="col text-grey-6">{{ dinner }}</div>
</div>
<div class="row items-center q-pt-mb col-6">
<div class="col-3 q-mr-md">服務用語</div>
<div class="col text-grey-6">普通話/日本語</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: ["trip"],
data() {
return {
traffic: "",
stars:['一星酒店','二星酒店','三星酒店','四星酒店','五星酒店','六星酒店','七星酒店','民宿','溫泉酒店'],
hotel:'',
team: '',
dinner: ''
};
},
created() {
this.formatTraffic()
this.formatHotel()
this.formatTeam()
this.formatDinner()
},
methods: {
formatTeam(){
let p = this.trip.priceList[0]
let t = p.priceTeamType??1
t=t==0?1:t
if(t==1){
this.team = `${p.seat}人團隊散拼`
}else{
this.team = '一单一团'
}
},
formatDinner(){
let d = []
this.trip.dinnerList.forEach(x=>{
if(x.dinnerName.indexOf('自理')==-1 && x.dinnerName.indexOf('请选择')==-1){
d.push(x)
}
})
if(d && d.length>0){
let g=this.groupBy(d,x=>{ return x.useDinnerType})
let t = ['早餐','午餐','晚餐']
g.forEach(x=>{
this.dinner+=`${x.data.length}次 ${t[parseInt(x.key)-1]}；`
})
}else{
this.dinner = '無餐食供應'
}
},
formatTraffic() {
let z = this.trip.trafficList[0].subTraffic[0]
if (z.arrivalType == 1) {
this.traffic = '飛機往返';
} else if (z.arrivalType == 2) {
this.traffic = '巴士往返';
} else if (z.arrivalType == 3) {
this.traffic = '郵輪往返';
} else {
this.traffic = '高鐵往返';
}
},
formatHotel(){
let h = []
this.trip.hotelList.forEach(x=>{
if(h.findIndex(y=>y.dayNum==x.dayNum)==-1){
h.push(x)
}
})
if(h && h.length>0){
let g = this.groupBy(h,(x)=>{return x.star})
g.forEach(x=>{
this.hotel+=`${x.data.length}晚${this.stars[parseInt(x.key)-1]}；`
})
}
}
},
};
</script>
<style></style>
src/components/trip/trip.vue 0 → 100644
View file @ b67ff275
<template>
<div class="q-mt-lg">
<div class="text-subtitle1 text-weight-bold row items-center">
<span class="col">每日行程</span>
<span class="">
<q-chip class="bg-transparent text-weight-light text-grey-7 f12" icon="iconfont icontime" :label="`行程時間：${trip.dayList.length}天`" />
</span>
</div>
<q-tabs
v-model="displayType"
class="text-dark q-mt-md"
align="left"
:breakpoint="20"
inline-label
active-class="text-primary"
dense
>
<q-tab name="image" @click="changeHandler" icon="iconfont iconimage" class="no-padding q-mr-lg" label="圖文模式" />
<q-tab name="dates" @click="changeHandler" icon="iconfont iconrili" class="no-padding q-mr-lg" label="日曆模式" />
</q-tabs>
<list :days="trip.dayList" v-if="displayType=='image'"></list>
<calendar :days="trip.dayList" v-if="displayType=='dates'"></calendar>
</div>
</template>
<script>
import calendar from './tripView/calendar.vue'
import list from './tripView/list.vue'
export default {
components: { list, calendar },
props:['trip'],
data() {
return {
displayType: 'image'
}
},
methods: {
changeHandler(){
console.log('change....')
this.$emit('change')
}
},
}
</script>
<style>
</style>
src/components/trip/tripView/calendar.vue 0 → 100644
View file @ b67ff275
<template>
<q-table :data="days" :columns="cols" flat class="q-mt-md" hide-pagination>
<template v-slot:body-cell-day="props">
<q-td :props="props">
<div class="text-h6">第 {{ props.row.dayNum }} 天</div>
<div class="f12 text-grey-8">{{ props.row.title }}</div>
</q-td>
</template>
<template v-slot:body-cell-dinner="props">
<q-td :props="props">
<div class="f12 text-grey-8">早餐：</div>
<div class="f12 text-grey-8">{{ props.row.breakfast }}</div>
<div class="f12 text-grey-8 q-mt-sm">午餐：</div>
<div class="f12 text-grey-8">{{ props.row.lanuch }}</div>
<div class="f12 text-grey-8 q-mt-sm">晚餐：</div>
<div class="f12 text-grey-8">{{ props.row.dinner }}</div>
</q-td>
</template>
<template v-slot:body-cell-acitvity="props">
<q-td :props="props">
<div v-for="(x,i) in props.row.activity" :key="i" >
<q-chip class="bg-transparent" text-color="blue" dense :label="x.n" v-if="x.t==1" />
<q-chip class="bg-transparent" text-color="dark" dense :label="x.n" v-if="x.t==2"/>
</div>
</q-td>
</template>
<template v-slot:body-cell-hotel="props">
<q-td :props="props">
<div v-for="(x,i) in props.row.hotel" :key="i" class="row items-center" >
<q-chip class="bg-transparent" text-color="blue" dense :label="x.n" />
<span class="q-ml-sm">{{ x.t==0?'保證入住':'或同級別酒店' }}</span>
</div>
<div class="q-mt-sm" v-if="props.row.tips">{{ props.row.tips }}</div>
</q-td>
</template>
</q-table>
</template>
<script>
export default {
props: ["days"],
data() {
return {
cols: [
{ name: "day", label: "行程", align: "left",style:'vertical-align:top;' },
{ name: "dinner", label: "用餐", align: "left",style:'vertical-align:top;' },
{ name: "acitvity", label: "景点/场馆&活动", align: "left",style:'vertical-align:top;' },
{ name: "hotel", label: "酒店", align: "left",style:'vertical-align:top;' },
],
d:[]
};
},
created() {
console.log(this.days);
this.d = this.days;
this.formatDay();
this.$forceUpdate();
},
methods: {
formatDay() {
if (this.d.length > 0) {
this.d.forEach((x) => {
x.breakfast='不含餐'
x.lanuch='不含餐'
x.dinner='不含餐'
x.activity=[]
x.hotel=[]
x.tips=''
x.dayArray.forEach((y) => {
if (y.type == 7) {
x.title = y.childItem.title;
} else if (y.type == 1) {
y.subtitle =
y.childItem.subTraffic[0].startTime +
" - " +
y.childItem.subTraffic[y.childItem.subTraffic.length - 1]
.endTime;
y.title = this.formatTraffice(y.childItem.subTraffic);
y.icon = "iconfont iconjiaotong";
console.log(y);
} else if (y.type == 4) {
if(y.childItem.dinnerName.indexOf('自理')==-1 && y.childItem.dinnerName.indexOf('请选择')==-1){
if(y.childItem.useDinnerType=='1'){
x.breakfast =x.breakfast=='不含餐'?y.childItem.dinnerName:x.breakfast+'，'+y.childItem.dinnerName
} else if(y.childItem.useDinnerType=='2'){
x.lanuch =x.lanuch=='不含餐'?y.childItem.dinnerName:x.lanuch+'，'+y.childItem.dinnerName
} else if(y.childItem.useDinnerType=='3'){
x.dinner =x.dinner=='不含餐'?y.childItem.dinnerName:x.dinner+'，'+y.childItem.dinnerName
}
}
} else if (y.type == 2) {
x.activity.push({
t:1,
n:y.childItem.couponsName
})
} else if (y.type == 5) {
x.activity.push({
t:2,
n:'自由活動'
})
} else if (y.type == 3) {
x.hotel.push({n:y.childItem.hotelName,t:y.childItem.IsSameLevel})
} else if (y.type == 6) {
x.tips = y.childItem.descriptionText??''
}
});
});
}
},
formatTraffice(tras) {
let txt = "從" + tras[0].startCityName;
tras.forEach((z, i) => {
if (i > 0) {
txt = "；再";
}
if (z.arrivalType == 1) {
txt += "搭乘航班";
} else if (z.arrivalType == 2) {
txt += "乘坐豪華巴士";
} else if (z.arrivalType == 3) {
txt += "乘坐豪華郵輪";
} else {
txt += "乘坐高鐵";
}
txt += " 到達" + z.arrivalCityName;
});
return txt;
},
},
};
</script>
<style></style>
src/components/trip/tripView/list.vue 0 → 100644
View file @ b67ff275
This diff is collapsed.
src/css/quasar.variables.scss
View file @ b67ff275
......@@ -12,7 +12,9 @@
// to match your app's branding.
// Tip: Use the "Theme Builder" on Quasar's documentation website.
$primary : #1976D2;
// $primary : #1976D2;
//$primary : #31C3E0;
$primary : #F1416C;
$secondary : #26A69A;
$accent : #9C27B0;
......
src/layouts/HomeLayout.vue
View file @ b67ff275
<style>
.q-page-container {
padding-top: 30px !important;
/* padding-top: 30px !important; */
padding-bottom: 30px !important;
}
......@@ -8,7 +8,7 @@
width: 56px;
height: 56px;
border-radius: 50%;
background-color: #027be3;
/* background-color: #027be3; */
position: fixed;
right: 20px;
bottom: 20px;
......@@ -32,7 +32,7 @@
<q-page-container>
<router-view />
</q-page-container>
<div class="goBackTop" :class="{'showGoback':isShowTop}" @click="hangleGoUp">
<div class="goBackTop bg-primary" :class="{'showGoback':isShowTop}" @click="hangleGoUp">
<i class="iconfont iconarrow-top"></i>
</div>
<q-footer elevated class="bg-grey-8 text-white" style="position: unset;">
......@@ -94,7 +94,7 @@
}
//删除基础配置
localStorage.removeItem("baseifo");
//localStorage.removeItem("baseifo");
//获取集团数据
if (localStorage.groupinfo) {
var jObj = JSON.parse(window.localStorage.getItem('groupinfo'));
......
src/pages/Index.vue
View file @ b67ff275
This diff is collapsed.
src/pages/Search.vue
View file @ b67ff275
......@@ -5,10 +5,10 @@
.SearchTop {
width: 100%;
margin: 32px 0 30px 0;
/* margin: 32px 0 30px 0;
background-color: rgba(255, 255, 255, .95);
border-top: 1px solid #eee;
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .03);
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .03); */
min-height: 600px;
}
......@@ -617,7 +617,7 @@
min-height: 25px !important;
}
.text-h6 {
/* .text-h6 {
text-align: center;
padding: 0 20px;
height: 60px;
......@@ -626,7 +626,7 @@
color: #333;
font-weight: 700;
position: relative;
}
} */
.text-h6 i {
position: absolute;
right:20px;
......@@ -678,12 +678,25 @@
font-size: 15px;
letter-spacing: 1px;
}
.desktop-page{
max-width:1200px;
margin:0 auto;
}
</style>
<template>
<div class="SearchMain">
<div class="SearchMain" :class="{'desktop-page':$q.platform.is.desktop}">
<div class="SearchTop">
<div class="q-my-md" v-if="qMsg.searchKey">
<q-breadcrumbs>
<q-breadcrumbs-el icon="home" label="首頁" class="cursor-pointer" @click="CommonJump('/index', {})"/>
<q-breadcrumbs-el :label="qMsg.searchKey" />
</q-breadcrumbs>
</div>
<div class="text-h6 text-left" v-if="qMsg.searchKey">
搜尋結果 “<span class="text-primary">{{ qMsg.searchKey }}</span>”
</div>
<!-- 电脑端 -->
<div class="row SearchContent" v-if="!$q.screen.xs">
<div class="row SearchContent q-mt-md" v-if="!$q.screen.xs && 1==0">
<div class="search-filter-inner">
<div class="search-item" style="width:200px;cursor:pointer;" @click="isShowDialog=true,goSearchHandler">
<i class="iconfont iconchazhao"></i>
......@@ -741,8 +754,9 @@
</div>
</div>
<!-- 手机端 -->
<div class="mobileSearch">
<div class="mobileSearch q-mt-md">
<div class="search-bar-m">
<i class="iconfont iconchazhao"></i>
<input type="text" placeholder="搜尋" :value="SearchResult" @click="showPopup=true,goSearchHandler" readonly="readonly"
......@@ -759,7 +773,7 @@
<!--豆腐格-->
<searchBlock :DataList="DataList" :qMsg="qMsg"></searchBlock>
</template>
<template v-else>
<template v-else-if="ShowType==1">
<div class="wl-section-block search-content">
<div class="search-filter-aside">
<div class="search-header">
......@@ -824,7 +838,10 @@
<searchList :DataList="DataList" :qMsg="qMsg" @getPage="getPage"></searchList>
</div>
</template>
<div v-if="DataList.length==0" class="blank-block">
<template v-else>
<kkday :qMsg="qMsg"></kkday>
</template>
<div v-if="DataList.length==0 && ShowType!=2" class="blank-block">
<i class="iconfont iconchazhao"></i>
<p>請嘗試其他關鍵字或篩選條件</p>
</div>
......@@ -1007,11 +1024,13 @@
import popup from "../components/props/index";
import searchBlock from "../components/searchdata/block";
import searchList from "../components/searchdata/list";
import kkday from '../components/searchdata/kkday.vue'
export default {
components: {
popup,
searchBlock,
searchList,
kkday
},
data() {
return {
......@@ -1167,7 +1186,7 @@
orderByPrice: 0,
orderBySales: 0,
pageIndex: 1,
pageSize: 20,
pageSize: 10,
priceOrderByField: 4,
searchKey: "",
startCityId: 0,
......@@ -1187,6 +1206,7 @@
var jObj = JSON.parse(localStorage.baseifo);
this.areas = jObj.AreaList;
this.ShowType = jObj.Config.ShowType;
this.ShowType = 2
} else {
this.getAera()
}
......@@ -1203,7 +1223,8 @@
if (qsearchEndDate) {
this.qMsg.endDate = qsearchEndDate;
}
if (qsearchKey || qsearchDate || qsearchEndDate) {
if ((qsearchKey || qsearchDate || qsearchEndDate) && this.ShowType!=2) {
this.goSearchHandler();
}
},
......@@ -1225,7 +1246,7 @@
orderByPrice: 0,
orderBySales: 0,
pageIndex: 1,
pageSize: 20,
pageSize: 10,
priceOrderByField: 4,
searchKey: "",
startCityId: 0,
......@@ -1357,7 +1378,7 @@
if (localStorage.b2bUser) {
var b2bUser = JSON.parse(window.localStorage.getItem('b2bUser'))
if (b2bUser) {
msg.priceOrderByField = 2;
this.msg.priceOrderByField = 2;
}
}
this.apipost(
......
src/pages/detailsNew.vue 0 → 100644
View file @ b67ff275
This diff is collapsed.
src/router/routes.js
View file @ b67ff275
......@@ -28,6 +28,10 @@ const routes = [{
path: '/details/:id/:tcid',
component: () =>
import('pages/details.vue')
}, { //行程2
path: '/detail/:id/:tcid',
component: () =>
import('pages/detailsNew.vue')
}, {
path: '/search', //签证护照管理
component: () =>
......
yarn.lock
View file @ b67ff275
This diff is collapsed.
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