Skip to content

M
million
Commit 6dfad9f3 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 254d7ea2
Hide whitespace changes
Inline Side-by-side
Showing with 139 additions and 115 deletions
src/components/trip/style4.vue
View file @ 6dfad9f3
<style>
.wl-section-block {
.wl-section-block {
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.section-tour {
}
.section-tour {
margin-bottom: 30px !important;
padding: 30px 30px 0;
border: 1px solid #e5e5e5;
background-color: #fff;
}
.section-tour .isHiden4{
height:450px;
}
.section-tour .isHiden4 {
height: 450px;
overflow: hidden;
}
.toggle_down:before {
}
.toggle_down:before {
content: "";
width: 100%;
position: absolute;
......@@ -22,11 +25,12 @@
left: 0;
z-index: 2;
height: 100px;
background-image: -webkit-linear-gradient(-90deg,rgba(255,255,255,0),#fff);
background-image: -moz-linear-gradient(-90deg,rgba(255,255,255,0),#fff);
background-image: -o-linear-gradient(-90deg,rgba(255,255,255,0),#fff);
background-image: linear-gradient(180deg,rgba(255,255,255,0),#fff);
}
background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0), #fff);
background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0), #fff);
background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0), #fff);
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);
}
</style>
<template>
<div>
......@@ -49,7 +53,8 @@
props: ['dataList'],
data() {
return {
isShow:false
TripConfig: {},
isShow: false,
};
},
created() {},
......@@ -57,10 +62,10 @@
if (localStorage.baseifo) {
this.TripConfig = JSON.parse(window.localStorage.getItem('baseifo'));
}
if(this.TripConfig.TripConfig.TripFeatureIsOpen==1){
this.isShow=false
}else{
this.isShow=true;
if (this.TripConfig.TripFeatureIsOpen == 1) {
this.isShow = false
} else {
this.isShow = true;
}
},
methods: {
......
src/components/trip/style5.vue
View file @ 6dfad9f3
......@@ -60,10 +60,12 @@
color: #666;
text-align: left;
}
.section-tour .isHiden5{
height:450px;
.section-tour .isHiden5 {
height: 450px;
overflow: hidden;
}
}
.toggle_down:before {
content: "";
width: 100%;
......@@ -72,11 +74,12 @@
left: 0;
z-index: 2;
height: 100px;
background-image: -webkit-linear-gradient(-90deg,rgba(255,255,255,0),#fff);
background-image: -moz-linear-gradient(-90deg,rgba(255,255,255,0),#fff);
background-image: -o-linear-gradient(-90deg,rgba(255,255,255,0),#fff);
background-image: linear-gradient(180deg,rgba(255,255,255,0),#fff);
}
background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0), #fff);
background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0), #fff);
background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0), #fff);
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);
}
</style>
<template>
<div>
......@@ -166,7 +169,8 @@
props: ['dataList'],
data() {
return {
isShow: false
TripConfig: {},
isShow: false,
};
},
created() {},
......@@ -174,10 +178,10 @@
if (localStorage.baseifo) {
this.TripConfig = JSON.parse(window.localStorage.getItem('baseifo'));
}
if(this.TripConfig.TripConfig.NoticeItemIsOpen==1){
this.isShow=false;
}else{
this.isShow=true;
if (this.TripConfig.NoticeItemIsOpen == 1) {
this.isShow = false;
} else {
this.isShow = true;
}
},
methods: {
......
src/components/trip/style6.vue
View file @ 6dfad9f3
......@@ -112,10 +112,12 @@
cursor: pointer;
text-align: center;
}
.collapse-toggle6 i{
font-weight: bold;
color:black;
.collapse-toggle6 i {
font-weight: bold;
color: black;
}
.toggle_down:before {
content: "";
width: 100%;
......@@ -177,18 +179,22 @@
color: #fff;
background: rgba(0, 0, 0, 0.5);
}
.style6_val{
margin-left:30px;
.style6_val {
margin-left: 30px;
}
@media only screen and (max-width: 900px){
@media only screen and (max-width: 900px) {
.detail-card .detail-inner {
flex-direction: column;
flex-direction: column;
}
}
.isHiden6{
height:180px;
.isHiden6 {
height: 180px;
overflow: hidden;
}
</style>
<template>
<div class="Style6_main">
......@@ -238,20 +244,16 @@
{{getHotelSuffix(item)}}
</div>
<div class="style6_val" v-else>本日无酒店安排</div>
</div>
</div>
<div class="detail-right">
<template>
{{item.slide}}
<q-carousel v-model="item.slide" color="white" arrows height="300px">
<q-carousel-slide :img-src="x.img" v-for="(x, i) in item.details" :name="i" :key="i">
<div class="absolute-bottom custom-caption">
<div class="q-headline">{{x.title}}</div>
</div>
</q-carousel-slide>
</q-carousel>
</template>
<q-carousel v-model="item.slide" color="white" arrows height="300px">
<q-carousel-slide :img-src="x.img" v-for="(x, i) in item.details" :name="i" :key="i">
<div class="absolute-bottom custom-caption">
<div class="q-headline">{{x.title}}</div>
</div>
</q-carousel-slide>
</q-carousel>
</div>
</div>
</div>
......@@ -270,17 +272,16 @@
},
created() {},
mounted() {
console.log(this.tripList, 'triplistt');
this.init();
},
methods: {
getSideShow(item){
item.isShow=true;
this.$forceUpdate();
getSideShow(item) {
item.isShow = true;
this.$forceUpdate();
},
getBtmShow(item){
item.isShow=false;
this.$forceUpdate();
getBtmShow(item) {
item.isShow = false;
this.$forceUpdate();
},
init() {
......@@ -350,7 +351,6 @@
scenicJson: y.childItem.scenicJson,
videoPath: y.childItem.imaArray[0].videoPath,
fileType: y.childItem.imaArray[0].fileType,
}
jin.push(obj)
} else if (y.type == 3 && y.childItem.hotelName != '' && y.childItem.imaArray.length > 0) {
......@@ -396,7 +396,6 @@
tips.push(obj)
}
if (y.type == 3) {
// jiu2.push(y.childItem.hotelName)
jiu2.push({
name: y.childItem.hotelName,
url: y.childItem.url
......@@ -443,7 +442,6 @@
} else if (activy.length > 0) {
details = activy
}
x.title = dadian.length > 0 && dadian[0].title && dadian[0].title != '' ? dadian[0].title : (jiao.length >
0 ? jiao[0].title : '集合出发')
x.details = details
......@@ -484,16 +482,14 @@
}
}
}
x.islast = (j + 1) == this.tripList.length
x.islast = (j + 1) == this.tripList.length;
x.slide = 0;
this.$set(this.tripList, j, x)
x.dateTime = this.setDate(j);
x.myIndex = 1;
x.isShow=false;
x.slide = 0;
x.isShow = false;
})
this.trips = this.tripList
console.log(this.trips, 'tripsss');
this.trips = JSON.parse(JSON.stringify(this.tripList));
},
setDate: function (j) {
if (j === 0) {
......
src/pages/details.vue
View file @ 6dfad9f3
<style>
.quick-banner-block{
.quick-banner-block {
position: fixed;
display: flex;
justify-content: center;
/* top: 60px; */
top:0;
top: 0;
left: 0;
width: 100%;
z-index: 99;
text-align: center;
box-shadow: 0 3px 7px rgba(150,150,150,.38);
box-shadow: 0 3px 7px rgba(150, 150, 150, .38);
}
.quick-banner-block.orange {
background-image: linear-gradient(-60deg,rgba(245,112,112,.9) 0,rgba(245,168,57,.87843137) 100%);
background-image: linear-gradient(-60deg, rgba(245, 112, 112, .9) 0, rgba(245, 168, 57, .87843137) 100%);
}
.quick-banner-block.blue{
background-image: linear-gradient(-60deg,rgba(74,216,190,.92) 0,rgba(31,161,228,.91) 100%);
.quick-banner-block.blue {
background-image: linear-gradient(-60deg, rgba(74, 216, 190, .92) 0, rgba(31, 161, 228, .91) 100%);
}
.quick-banner-block.green {
background-image: linear-gradient(-20deg,rgba(78,78,78,.95) 0,#7da5a3 100%);
}
.quick-banner-block.dark {
background-image: linear-gradient(-225deg,rgba(78,69,119,.87058824) 0,rgba(51,135,173,.89) 51%,rgba(43,216,195,.89019608) 100%);
}
.quick-banner-block.yellow {
background-image: linear-gradient(80deg,rgba(255,193,19,.9) 0,rgba(93,183,121,.9) 100%);
}
.quick-banner-block .quick-item{
background-image: linear-gradient(-20deg, rgba(78, 78, 78, .95) 0, #7da5a3 100%);
}
.quick-banner-block.dark {
background-image: linear-gradient(-225deg, rgba(78, 69, 119, .87058824) 0, rgba(51, 135, 173, .89) 51%, rgba(43, 216, 195, .89019608) 100%);
}
.quick-banner-block.yellow {
background-image: linear-gradient(80deg, rgba(255, 193, 19, .9) 0, rgba(93, 183, 121, .9) 100%);
}
.quick-banner-block .quick-item {
display: flex;
justify-content: space-around;
color: #fff;
width: 100%;
}
.quick-banner-block .quick-item>* {
display: inline-block;
width: 100%;
......@@ -45,22 +52,28 @@
-o-transition: background-color .3s;
transition: background-color .3s;
text-decoration: none;
}
.quick-banner-block.orange .quick-item>.active {
background-color: rgba(65,130,160,.82);
}
.quick-banner-block.blue .quick-item>.active {
}
.quick-banner-block.orange .quick-item>.active {
background-color: rgba(65, 130, 160, .82);
}
.quick-banner-block.blue .quick-item>.active {
background-color: #057ea2;
}
.quick-banner-block.green .quick-item>.active {
background-color: rgba(30,69,78,.82);
}
.quick-banner-block.dark .quick-item>.active {
background-color: rgba(4,70,101,.82);
}
.quick-banner-block.yellow .quick-item>.active {
background-color: rgba(102,162,121,.82);
}
}
.quick-banner-block.green .quick-item>.active {
background-color: rgba(30, 69, 78, .82);
}
.quick-banner-block.dark .quick-item>.active {
background-color: rgba(4, 70, 101, .82);
}
.quick-banner-block.yellow .quick-item>.active {
background-color: rgba(102, 162, 121, .82);
}
</style>
<template>
<q-page ref="orderview">
......@@ -78,7 +91,8 @@
<!-- <headStyle3 v-if="item.Id=='TripDay'" id="tour_detail" ref="tour_detail" :tripList="dayList" :isDirect="isDirect" :key="index+3"></headStyle3> -->
<headStyle6 v-if="item.Id=='TripDay'" :tripList="dayList" :key="index+3"></headStyle6>
<!-- 行程特色 -->
<headStyle4 v-if="item.Id=='TripFeature'" ref="feature" id="feature" :dataList="dataList" :key="index+4"></headStyle4>
<headStyle4 v-if="item.Id=='TripFeature'" ref="feature" id="feature" :dataList="dataList" :key="index+4">
</headStyle4>
<!-- 注意事项 -->
<headStyle5 v-if="item.Id=='Notice'" id="note" ref="note" :dataList="dataList" :key="index+5"></headStyle5>
</template>
......@@ -107,27 +121,27 @@
//出團表 group -Start
import travelList from "../components/group/travel-list";
import travelList from "../components/group/travel-list";
//出團表 group -End
export default {
props: [],
data() {
return {
msg:{
msg: {
configId: '87O4zB6zOs0%3D',
cityId: 0,
preview: 0,
tcid: '9353',
teamType: 0
},
isShow:false,
dataList:{},
dayList:[],
isDirect:1,
TripConfig:{},
isShowNav:false,
clickIndex:1
isShow: false,
dataList: {},
dayList: [],
isDirect: 1,
TripConfig: {},
isShowNav: false,
clickIndex: 1
};
},
components: {
......@@ -148,16 +162,21 @@
}
this.getData();
window.addEventListener('scroll', this.menu)
},
methods: {
getData() {
this.apipost('b2b_get_GetB2BTravelInfoV1', this.msg, r => {
if (r.data.resultCode == 1) {
this.dataList = r.data.data;
console.log(this.dataList,'resss');
console.log(this.dataList, 'resss');
if (this.dataList.dayList && this.dataList.dayList.length > 0) {
this.dataList.dayList.forEach(item => {
item.slide = 0;
});
}
this.dayList = this.dataList.dayList;
this.isShow=true;
this.isShow = true;
this.isDirect = this.dataList.isDirect;
} else {
this.$message.error(r.data.message)
......@@ -166,14 +185,14 @@
},
menu() {
this.scroll = document.documentElement.scrollTop || document.body.scrollTop;
if(this.scroll>300){
this.isShowNav=true;
}else{
this.isShowNav=false;
if (this.scroll > 300) {
this.isShowNav = true;
} else {
this.isShowNav = false;
}
},
goNavList(val) {
let newval="#"+val
let newval = "#" + val
document.querySelector(newval).scrollIntoView(true);
},
......
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