Commit 81fb76ce authored by lixy's avatar lixy

移动端官网

parent 1f26236c
...@@ -24,19 +24,19 @@ ...@@ -24,19 +24,19 @@
:class="path=='/'?'active':''" :class="path=='/'?'active':''"
@click="$router.push('/')">首页</li> @click="$router.push('/')">首页</li>
<li <li
:class="path=='/vehicle'|| path=='/vehicleDetail'?'active':''" :class="path=='/vehicle'|| path.indexOf('/vehicleList') != -1?'active':''"
@click="$router.push('/vehicle')">房车租赁</li> @click="$router.push('/vehicle')">房车租赁</li>
<li <li
:class="path=='/tour'|| path=='/tourDetail'?'active':''" :class="path=='/tour'|| path.indexOf('/tourDetails') != -1 ?'active':''"
@click="$router.push('/tour')">房车旅游</li> @click="$router.push('/tour')">房车旅游</li>
<li <li
:class="path=='/campsite'|| path=='/campsiteDetail'?'active':''" :class="path=='/campsite'|| path.indexOf('/campsiteDetails') != -1 ?'active':''"
@click="$router.push('/campsite')">房车营地</li> @click="$router.push('/campsite')">房车营地</li>
<li <li
:class="path=='/activity'|| path=='/activityDetail'?'active':''" :class="path=='/activity'|| path.indexOf('/activityList') != -1?'active':''"
@click="$router.push('/activity')">欣新活动</li> @click="$router.push('/activity')">欣新活动</li>
<li <li
:class="path=='/news'|| path=='/newsDetail'?'active':''" :class="path=='/news'|| path.indexOf('/newsList') != -1?'active':''"
@click="$router.push('/news')">新闻动态</li> @click="$router.push('/news')">新闻动态</li>
<li <li
:class="path=='/aboutXx'?'active':''" :class="path=='/aboutXx'?'active':''"
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
v-for="item in dataDetail" v-for="item in dataDetail"
:key="item.id"> :key="item.id">
<router-link <router-link
:to="{ path: 'activityDetail', query:{id: item.id }}" :to="{ path: 'activityList/'+item.id, query:{id: item.id }}"
class="activity-item"> class="activity-item">
<img <img
:src="item.banner" :src="item.banner"
......
<template>
<div
class="activity-detail-page"
style="margin-top:1.87733rem;">
<Head/>
<img
:src="detail.banner"
style="width: 100%;height:249px;object-fit: cover;">
<div class="detail-main-container">
<div>
<h1 class="activity-detail-name">{{ detail.title }}</h1>
<div class="activity-detail-info">
<div
class="flex-aic">
<span style="color: #666;font-size: 14px;">活动人数</span>
<div>{{ detail.limitNum }}</div>
</div>
<div
class="flex-aic"
style="margin: 6px 0;">
<span style="color: #666;font-size: 14px;">活动时间</span>
<div>{{ detail.startTime | formatDate('yyyy-MM-dd hh:mm') }}~{{ detail.endTime | formatDate('yyyy-MM-dd hh:mm') }} </div>
</div>
<div class="flex-aic">
<span style="color: #666;font-size: 14px;">活动地点</span>
<div>{{ detail.province }}{{ detail.city }}{{ detail.town }}{{ detail.address }}</div>
</div>
</div>
</div>
<div>
<div style="height: 10px;background: #eee;"/>
</div>
<div class="flex-jcb activity-detail">
<div style="background: #fff;margin: 17px 0;">
<h3
class="content-t"
style="text-align: left;">活动详情</h3>
<div
class="models-details"
v-html="detail.content"/>
</div>
</div>
</div>
<go-top/>
</div>
</template>
<script>
import axios from '../../plugins/axios'
import Head from "~/components/head";
import DetailBanner from '~/components/detailBanner'
import GoTop from "~/components/goTop";
export default {
components: {
Head,
DetailBanner,
GoTop
},
data() {
return {};
},
async asyncData({ route, params}) {
const { data } = await axios.get( '/api/uccn/summitActivity/app/unauth/'+params.id);
let detail = data.data;
detail.content =detail.content.replace(/<img/g,"<img style='width:90%'");
return {detail: detail}
},
created() {},
methods: {},
};
</script>
<style lang="scss">
@import "../../assets/styles/mixin";
.activity-detail-page {
font-size: px2rem(24px);
.content-t{
font-size: 16px;
font-weight: bold;
margin-bottom: 10px;
}
.detail-main-container{
border-radius: 7px 7px 0 0;
box-shadow: 0px 0px 13px #666;
margin-top: -10px;
z-index: 99;
position: relative;
background: #fff;
.activity-detail-name{
padding: 17px px2rem(20px);
font-size: 18px;
font-weight: bold;
border-bottom: 1px solid #eee;
}
.activity-detail{
padding: 0 px2rem(20px);
}
.activity-detail-info{
padding: 17px px2rem(20px);
font-size: 14px;
span{
color: #666;
min-width: 60px;
margin-right: 13px;
}
}
.vehicle-lower{
padding: 0 px2rem(20px);
font-size: px2rem(30px);
margin-top: px2rem(20px);
margin-bottom: px2rem(20px);
span{
color: #F25B5B;
font-size: px2rem(36px);
font-weight: bold;
margin-left: px2rem(30px);
margin-right: px2rem(4px);
}
}
.member-list{
padding: 0 px2rem(20px);
}
.member-list-c img{
width: 20px;
height: 20px;
margin-right: px2rem(20px);
}
.member-list-name{
color: #666;
font-size:px2rem(26px);
margin-bottom: px2rem(20px);
}
.market-price{
font-size: px2rem(30px);
margin: px2rem(34px) 0;
padding: 0 px2rem(20px);
}
.detail-list{
height: px2rem(100px);
}
.select-tab{
width: 100%;
.select-tab-li-l{
font-size:16px;
color: #999;
padding: 0 px2rem(20px);
}
.select-tab-li-l.active{
color: #333;
font-weight: bold;
height: px2rem(100px);
line-height: px2rem(100px);
border-bottom: 2px solid #1bbb9f;
}
}
.scroll0, .scroll1, .scroll2, .scroll3{
padding: 0 px2rem(20px);
.base-set{
margin: 17px 0;
font-size: 15px;
font-weight: bold;
}
.base-set-name{
font-size: 13px;
color: #666;
padding: 0 10px 6px 0;
}
}
.mint-navbar {
position: sticky;
top: 0;
z-index: 20;
.mint-tab-item-label {
font-size: px2rem(30px);
}
.mint-tab-item {
padding: 10px 0;
&.is-selected {
color: inherit;
border: none;
position: relative;
&::after {
content: " ";
display: inline-block;
@include wh(20%, 2px);
background: #2395ff;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
}
}
}
.left-item{
width: 30%;
border-left: 1px solid #c1c1c1;
border-right: 1px solid #c1c1c1;
height: 34px;
padding-left: 10px;
line-height: 34px;
}
.right-item{
width:70%;
border-right: 1px solid #ccc;
height: 34px;
line-height: 34px;
padding-left: 10px;
}
.modal-item{
border-top:1px solid #ccc;
}
.kr-article-article .modal-item:last-child{
border-bottom: 1px solid #ccc;
}
}
}
</style>
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
:key="item.id" :key="item.id"
class="campsite-li"> class="campsite-li">
<router-link <router-link
:to="{ path: 'campsiteDetail', query:{id: item.id }}" :to="{ path: 'campsiteDetails/'+item.id, query:{id: item.id }}"
class="campsite-item"> class="campsite-item">
<img <img
:src="item.logo" :src="item.logo"
......
This diff is collapsed.
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
handleScroll: function () { handleScroll: function () {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
let path = $nuxt.$route.path; let path = $nuxt.$route.path;
if(path == '/campsiteDetail'){ if(path == '/campsiteDetails'){
var menuTop = document.querySelector('#nav').offsetTop; var menuTop = document.querySelector('#nav').offsetTop;
//滑动到指定位置菜单吸顶 //滑动到指定位置菜单吸顶
if (scrollTop > menuTop+180) { if (scrollTop > menuTop+180) {
......
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
v-for="(item, index) in activityList" v-for="(item, index) in activityList"
:key="index"> :key="index">
<router-link <router-link
:to="{ path: 'activityDetail', query:{id: item.id }}" :to="{ path: 'activityList', query:{id: item.id }}"
class="flex-jcb"> class="flex-jcb">
<img <img
:src="item.banner" :src="item.banner"
...@@ -197,7 +197,7 @@ ...@@ -197,7 +197,7 @@
class="main-padding"> class="main-padding">
<router-link <router-link
v-for="item in tourList" v-for="item in tourList"
:to="{ path: 'tourDetail', query:{id: item.id }}" :to="{ path: 'tourDetails/'+item.id, query:{id: item.id }}"
:key="item.id" :key="item.id"
class="flex-jcb tour-item"> class="flex-jcb tour-item">
<img <img
...@@ -225,7 +225,7 @@ ...@@ -225,7 +225,7 @@
class="flex-aic-fww-jcb" class="flex-aic-fww-jcb"
style="padding:0 0.4rem;justify-content: space-around;"> style="padding:0 0.4rem;justify-content: space-around;">
<router-link <router-link
:to="{ path: 'vehicleDetail', query:{name:'【上汽】大通RV80旅居车'}}" :to="{ path: 'vehicleList', query:{name:'【上汽】大通RV80旅居车'}}"
class="hot-vehicle-home"> class="hot-vehicle-home">
<div <div
class="flex-aic-jcc-fdc vehicle-home-item" class="flex-aic-jcc-fdc vehicle-home-item"
...@@ -236,7 +236,7 @@ ...@@ -236,7 +236,7 @@
</div> </div>
</router-link> </router-link>
<router-link <router-link
:to="{ path: 'vehicleDetail', query:{name:'【金冠】格林卡诺C2'}}" :to="{ path: 'vehicleList', query:{name:'【金冠】格林卡诺C2'}}"
class="hot-vehicle-home"> class="hot-vehicle-home">
<div <div
class="flex-aic-jcc-fdc vehicle-home-item" class="flex-aic-jcc-fdc vehicle-home-item"
...@@ -258,7 +258,7 @@ ...@@ -258,7 +258,7 @@
</div> </div>
</router-link> </router-link>
<router-link <router-link
:to="{ path: 'vehicleDetail', query:{name:'【奔驰】斯宾特'}}" :to="{ path: 'vehicleList', query:{name:'【奔驰】斯宾特'}}"
class="hot-vehicle-home"> class="hot-vehicle-home">
<div <div
class="flex-aic-jcc-fdc vehicle-home-item" class="flex-aic-jcc-fdc vehicle-home-item"
...@@ -291,7 +291,7 @@ ...@@ -291,7 +291,7 @@
style="padding-top: 0;margin-top: 20px;"> style="padding-top: 0;margin-top: 20px;">
<router-link <router-link
v-for="item in newsList" v-for="item in newsList"
:to="{ path: 'newsDetail', query:{id: item.id }}" :to="{ path: 'newsList/'+item.id, query:{id: item.id }}"
:key="item.id" :key="item.id"
class="flex-jcb tour-item"> class="flex-jcb tour-item">
<div <div
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
v-for="item in dataDetail" v-for="item in dataDetail"
:key="item.id"> :key="item.id">
<router-link <router-link
:to="{ path: 'newsDetail', query:{id: item.id }}" :to="{ path: 'newsList/'+item.id, query:{id: item.id }}"
class="flex-jcb-aie" class="flex-jcb-aie"
style="margin-bottom: 13px;"> style="margin-bottom: 13px;">
<img <img
......
<template>
<div
class="news-detail-page"
style="margin-top:1.87733rem;">
<Head/>
<div class="detail-main-container main-padding">
<div>
<h1 class="news-detail-name">{{ detail.title }}</h1>
<div class="news-detail-time flex-aic">
<img
src="data:image/png;base64,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"
style="width: 17px;height: 17px;margin-right: 7px;">
{{ detail.addTime.substring(0, 10) }}</div>
<div
class="content-detail"
v-html="detail.text"/>
<div class="more-news flex-aic-jcb">
<div class="more-news-l">
推荐咨讯
</div>
<router-link
:to="{ path: 'news'}"
class="more-news-r">更多</router-link>
</div>
<ul
class="main-padding">
<router-link
v-for="item in hotList"
:to="{ path: 'newsList/'+item.id, query:{id: item.id }}"
:key="item.id"
class="flex-jcb"
style="margin-bottom: 20px;">
<img
:src="item.coverImage"
class="news-img-list">
<div class="news-list">
<div class="ellipsis2 news-list-title">{{ item.title }}</div>
<!--<div class="ellipsis2 epitome">导语:{{ item.epitome }}</div>-->
<div class="epitome news-list-time flex-aic">
<img
src="data:image/png;base64,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"
style="width: 17px;height: 17px;margin-right: 7px;">
{{ item.addTime.substring(0, 10) }}</div>
</div>
</router-link>
</ul>
</div>
</div>
<go-top/>
</div>
</template>
<script>
import axios from '../../plugins/axios'
import Head from "~/components/head";
import DetailBanner from '~/components/detailBanner'
import GoTop from "~/components/goTop";
export default {
components: {
Head,
DetailBanner,
GoTop
},
data() {
return {};
},
async asyncData({ route }) {
const { data } = await axios.get('/api/uccn/article/app/unauth/one?id='+route.query.id+"&urlType=1");
let detail = data.data;
detail.text = detail.text.replace(/<img/g,"<img style='width:100%'");
detail.text = detail.text.replace(/<video style="/g,'<video style="width:100% !important; heigit:auto;"');
let tempBannerData = await axios.get('/api/uccn/article/app/unauth/three?type=1&number=3&id='+route.query.id);
let hot = tempBannerData.data.data;
return {detail: detail, hotList: hot}
},
created() {},
methods: {},
};
</script>
<style lang="scss">
@import "../../assets/styles/mixin";
.news-detail-page {
font-size: px2rem(26px);
.news-detail-name{
font-size: 17px;
font-weight: bold;
}
.news-detail-time{
padding: 15px 0 20px 0;
border-bottom: 1px solid #dfdfdf;
color: #999;
font-size: 13px;
}
.news-img-list{
width: 92px;
height: 75px;
border-radius: 3px;
}
.news-list {
border-bottom: 1px solid #dfdfdf;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 13px;
padding-bottom: 13px;
}
.news-list-title{
margin-bottom: 15px;
font-size: 15px;
}
.news-list-time{
font-size: 13px;
color: #999;
}
.more-news{
margin: 17px 0;
.more-news-l{
font-size: 17px;
font-weight: bold;
}
.more-news-r{
font-size: 14px;
color: #999;
}
}
}
</style>
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
class="main-padding"> class="main-padding">
<router-link <router-link
v-for="item in hotList" v-for="item in hotList"
:to="{ path: 'newsDetail', query:{id: item.id }}" :to="{ path: 'newsList/'+item.id, query:{id: item.id }}"
:key="item.id" :key="item.id"
class="flex-jcb" class="flex-jcb"
style="margin-bottom: 20px;"> style="margin-bottom: 20px;">
......
<template>
<div
class="news-detail-page"
style="margin-top:1.87733rem;">
<Head/>
<div
style="padding-top: 20px; !important;"
class="main-padding">
<div>
<h1 class="news-detail-name">{{ detail.title }}</h1>
<div class="news-detail-time flex-aic">
<img
src="data:image/png;base64,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"
style="width: 17px;height: 17px;margin-right: 7px;">
{{ detail.addTime.substring(0, 10) }}</div>
<div
class="content-detail"
v-html="detail.text"/>
<div class="more-news flex-aic-jcb">
<div class="more-news-l">
推荐咨讯
</div>
<router-link
:to="{ path: 'news'}"
class="more-news-r">更多</router-link>
</div>
<ul>
<li
v-for="item in hotList"
:key="item.id"
class="flex-jcb"
style="margin-bottom: 20px;"
@click="$nuxt.$route.path=='newsList'?$router.push($nuxt.$route.path +item.id):$router.push(''+item.id)">
{{ $nuxt.$route.path+item.id }}
<img
:src="item.coverImage"
class="news-img-list">
<div class="news-list">
<div class="ellipsis2 news-list-title">{{ item.title }}</div>
<div class="epitome news-list-time flex-aic">
<img
src="data:image/png;base64,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"
style="width: 17px;height: 17px;margin-right: 7px;">
{{ item.addTime.substring(0, 10) }}</div>
</div>
</li>
</ul>
</div>
</div>
<go-top/>
<Footer/>
</div>
</template>
<script>
import axios from '../../plugins/axios'
import Head from "~/components/head";
import DetailBanner from '~/components/detailBanner'
import GoTop from "~/components/goTop";
import Footer from "~/components/footer";
export default {
components: {
Head,
DetailBanner,
GoTop,
Footer
},
data() {
return {};
},
async asyncData({ route, params }) {
const { data } = await axios.get('/api/uccn/article/app/unauth/one?id='+ params.id+"&urlType=1");
let detail = data.data;
detail.text = detail.text.replace(/<img/g,"<img style='width:100%'");
detail.text = detail.text.replace(/<video style="/g,'<video style="width:100% !important; heigit:auto;"');
let tempBannerData = await axios.get('/api/uccn/article/app/unauth/three?type=1&number=3&id='+ params.id);
let hot = tempBannerData.data.data;
return {detail: detail, hotList: hot}
},
created() {},
methods: {},
};
</script>
<style lang="scss">
@import "../../assets/styles/mixin";
.news-detail-page {
font-size: px2rem(26px);
.news-detail-name{
font-size: 18px;
font-weight: bold;
}
.news-detail-time{
padding: 17px 0 10px 0;
margin-bottom: 20px;
border-bottom: 1px solid #eee;
color: #999;
font-size: 13px;
}
.news-img-list{
width: 92px;
height: 75px;
border-radius: 3px;
}
.news-list {
border-bottom: 1px solid #eee;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 13px;
padding-bottom: 13px;
}
.news-list-title{
margin-bottom: 15px;
font-size: 15px;
}
.news-list-time{
font-size: 13px;
color: #999;
}
.more-news{
margin: 17px 0;
.more-news-l{
font-size: 17px;
font-weight: bold;
}
.more-news-r{
font-size: 14px;
color: #999;
}
}
}
</style>
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<ul> <ul>
<router-link <router-link
v-for="item in hotList" v-for="item in hotList"
:to="{ path: 'newsDetailHot', query:{id: item.id }}" :to="{ path: 'newsList/'+item.id, query:{id: item.id }}"
:key="item.id" :key="item.id"
class="flex-jcb" class="flex-jcb"
style="margin-bottom: 20px;"> style="margin-bottom: 20px;">
......
...@@ -34,7 +34,7 @@ ...@@ -34,7 +34,7 @@
class="main-padding"> class="main-padding">
<router-link <router-link
v-for="item in dataDetail" v-for="item in dataDetail"
:to="{ path: 'tourDetail', query:{id: item.id }}" :to="{ path: 'tourDetails/'+item.id, query:{id: item.id }}"
:key="item.id" :key="item.id"
class="flex-jcb tour-item"> class="flex-jcb tour-item">
<img <img
......
This diff is collapsed.
...@@ -189,7 +189,7 @@ ...@@ -189,7 +189,7 @@
handleScroll: function () { handleScroll: function () {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
let path = $nuxt.$route.path; let path = $nuxt.$route.path;
if(path == '/tourDetail'){ if(path == '/tourDetails'){
var menuTop = document.querySelector('#nav').offsetTop; var menuTop = document.querySelector('#nav').offsetTop;
//滑动到指定位置菜单吸顶 //滑动到指定位置菜单吸顶
if (scrollTop > menuTop + 180) { if (scrollTop > menuTop + 180) {
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
class="main-padding"> class="main-padding">
<router-link <router-link
v-for="item in dataDetail" v-for="item in dataDetail"
:to="{ path: 'vehicleDetail', query:{id: item.id, name:item.name }}" :to="item.link"
:key="item.id" :key="item.id"
class="vehicle-item flex"> class="vehicle-item flex">
<img <img
......
This diff is collapsed.
...@@ -252,7 +252,7 @@ ...@@ -252,7 +252,7 @@
handleScroll: function () { handleScroll: function () {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
let path = $nuxt.$route.path; let path = $nuxt.$route.path;
if(path == '/vehicleDetail'){ if(path == '/vehicleList'){
var menuTop = document.querySelector('#nav').offsetTop; var menuTop = document.querySelector('#nav').offsetTop;
//滑动到指定位置菜单吸顶 //滑动到指定位置菜单吸顶
if (scrollTop > menuTop+180) { if (scrollTop > menuTop+180) {
......
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