Skip to content

梁建民 / h5

Go to a project
Commit 07231de8 by 肖康
Options

新闻列表 文章详情

parent b5c265c5
Expand all
Inline Side-by-side
Showing with 101 additions and 16 deletions
src/api/index.js
...@@ -86,7 +86,13 @@ export const apis = { ...@@ -86,7 +86,13 @@ export const apis = {
* 新闻详情api * 新闻详情api
* * * *
*/ */
newsArticleDetail: productionUrlApi + 'Article/Article/details' newsArticleDetail: productionUrlApi + 'Article/Article/details',
/**
* *
* 新闻详情api
* *
*/
newsArticleDetailAd: productionUrl + 'api/newsdetailad'
} }
export const services = { export const services = {
index(params) { index(params) {
...@@ -136,6 +142,9 @@ export const services = { ...@@ -136,6 +142,9 @@ export const services = {
}, },
newsArticleDetail(params){ newsArticleDetail(params){
return axios.post(apis.newsArticleDetail,params) return axios.post(apis.newsArticleDetail,params)
},
newsArticleDetailAd(params){
return axios.post(apis.newsArticleDetailAd,params)
} }
} }
src/router.js
...@@ -48,7 +48,7 @@ const routes=[ ...@@ -48,7 +48,7 @@ const routes=[
} }
}, },
{ {
path: '/news/detail/:id', path: '/news/detail/:art_id/:cat_id',
name:'NewsDetail', name:'NewsDetail',
component: NewsDetail, component: NewsDetail,
meta: { meta: {
......
src/store/modules/news/detail.js
import Vue from 'vue' import Vue from 'vue'
import {Toast} from 'vant'; import {Toast} from 'vant';
import {services as Services} from '../../../api/index' import {services as Services} from '../../../api/index'
import Util from "../../../util";
var qs = require('qs'); var qs = require('qs');
...@@ -8,14 +9,25 @@ Vue.use(Toast); ...@@ -8,14 +9,25 @@ Vue.use(Toast);
const state = { const state = {
loadStatus: false, loadStatus: false,
newsDetailObj:{} newsDetailObj:{},
newsDetailAd:{}
} }
const mutations = { const mutations = {
newsArticleDetail(state, payload) { newsArticleDetail(state, payload) {
state.newsDetailObj=payload.data; state.newsDetailObj=payload.data;
},
newsArticleDetailAd(state, payload) {
state.newsDetailAd=payload.data;
if(Util.getCookie("newsdetailpop")){
state.newsDetailAd.h5_news_ad_pop="";
}else{
Util.setCookie("newsdetailpop","1",1)
}
} }
} }
const actions = { const actions = {
...@@ -38,6 +50,25 @@ const actions = { ...@@ -38,6 +50,25 @@ const actions = {
}).catch(function (err) { }).catch(function (err) {
state.loadStatus=false; state.loadStatus=false;
}); });
},
newsArticleDetailAd({commit}, payload) {
var param = {
cat_id: payload.cat_id
}
console.log(param)
var params = Util.getParams(param);
Services.newsArticleDetailAd(params).then((res) => {
let data = res.data;
if (data.err_code == 0) {
commit({
type: 'newsArticleDetailAd',
data: data.data
});
}
}).catch(function (err) {
});
} }
} }
......
src/views/news/Detail.vue
...@@ -8,8 +8,30 @@ ...@@ -8,8 +8,30 @@
<span class="f24">来源：</span> <span class="f24">来源：</span>
<span class="f24">{{newsDetailObj.current_info.writer}}&nbsp;&nbsp;&nbsp;{{newsDetailObj.current_info.publish_time}}</span> <span class="f24">{{newsDetailObj.current_info.writer}}&nbsp;&nbsp;&nbsp;{{newsDetailObj.current_info.publish_time}}</span>
</div> </div>
<template v-if="newsDetailAd.news_details_ad">
<template v-if="newsDetailAd.news_details_ad.header">
<a :href="newsDetailAd.news_details_ad.header.url" :target="newsDetailAd.news_details_ad.header.window_open > 0 ?'_blank':'_self'">
<img :src="newsDetailAd.news_details_ad.header.images" :alt="newsDetailAd.news_details_ad.header.title" width="100%" height="120"/>
</a>
</template>
</template>
<div v-html="newsDetailObj.current_info.body" class="content-newsdetail"></div> <div v-html="newsDetailObj.current_info.body" class="content-newsdetail"></div>
<template v-if="newsDetailAd.news_details_ad">
<template v-if="newsDetailAd.news_details_ad.footer">
<a :href="newsDetailAd.news_details_ad.footer.url" :target="newsDetailAd.news_details_ad.footer.window_open > 0 ?'_blank':'_self'">
<img :src="newsDetailAd.news_details_ad.footer.images" :alt="newsDetailAd.news_details_ad.footer.title" width="100%" height="120"/>
</a>
</template>
</template>
</div> </div>
<template v-if="newsDetailAd.h5_news_ad_pop">
<div class="detail-pop" v-show="popdetailbool">
<van-icon name="close" class="closexdetailad" @click="popdetailact()"/>
<a :href="newsDetailAd.h5_news_ad_pop.url" :target="newsDetailAd.h5_news_ad_pop.window_open > 0 ?'_blank':'_self'">
<img :src="newsDetailAd.h5_news_ad_pop.images" :alt="newsDetailAd.h5_news_ad_pop.title">
</a>
</div>
</template>
<van-loading type="spinner" color="#000" class="loading-background" v-if="loadStatus"/> <van-loading type="spinner" color="#000" class="loading-background" v-if="loadStatus"/>
</section> </section>
</template> </template>
...@@ -18,22 +40,24 @@ ...@@ -18,22 +40,24 @@
import Vue from 'vue'; import Vue from 'vue';
import {mapState} from 'vuex' import {mapState} from 'vuex'
import {Loading} from 'vant' import {Loading,Icon } from 'vant'
import Header from '@/views/common/Header.vue'; import Header from '@/views/common/Header.vue';
Vue.use(Loading); Vue.use(Loading).use(Icon );
export default { export default {
name: 'newsDetail', name: 'newsDetail',
data() { data() {
return { return {
title:"猎芯网-新闻列表详情", title:"猎芯网-新闻列表详情",
p: 1, p: 1,
meaushow:true meaushow:true,
popdetailbool:false
} }
}, },
computed: { computed: {
...mapState({ ...mapState({
newsDetailObj: state => state.newsdetail.newsDetailObj, newsDetailObj: state => state.newsdetail.newsDetailObj,
loadStatus: state => state.newsdetail.loadStatus loadStatus: state => state.newsdetail.loadStatus,
newsDetailAd:state=> state.newsdetail.newsDetailAd
}) })
}, },
...@@ -47,15 +71,37 @@ ...@@ -47,15 +71,37 @@
}, },
created() { created() {
this.getDataAd();
this.getData(); this.getData();
this.scrollFns();
}, },
methods: { methods: {
getData() { getData() {
this.$store.dispatch({ this.$store.dispatch({
type: 'newsArticleDetail', type: 'newsArticleDetail',
art_id: this.$route.params.id art_id: this.$route.params.art_id
})
},
getDataAd:function(){
this.$store.dispatch({
type: 'newsArticleDetailAd',
cat_id: this.$route.params.cat_id
}) })
},
popdetailact:function(){
this.popdetailbool=false;
this.newsDetailAd.h5_news_ad_pop="";
},
scrollFns() {
var self=this;
window.onscroll= function(){
var t = document.documentElement.scrollTop||document.body.scrollTop;
if (t >= 100) {
self.popdetailbool = true;
}
}
} }
}, },
components: { components: {
Header Header
...@@ -87,5 +133,7 @@ ...@@ -87,5 +133,7 @@
.news-detail .bar span{line-height: 16px;height:16px;float:left;} .news-detail .bar span{line-height: 16px;height:16px;float:left;}
.news-detail .bar .f24{color:#333;} .news-detail .bar .f24{color:#333;}
.news-detail .bar .f20{font-size: 12px;padding-left: 5px;padding-right:5px;border-radius:2px;border:1px solid #ccc;margin-right: 10px;} .news-detail .bar .f20{font-size: 12px;padding-left: 5px;padding-right:5px;border-radius:2px;border:1px solid #ccc;margin-right: 10px;}
.news-detail .detail-pop{width:8.66rem;height:7.44rem;position: fixed;top:50%;left:50%;margin-left:-4.33rem;margin-top: -3.72rem;}
.news-detail .detail-pop img{width:100%;height:100%;}
.news-detail .closexdetailad{font-size: 26px;float:right;color:#ccc}
</style> </style>
\ No newline at end of file
src/views/news/Index.vue
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
<ul class="listBox clr" > <ul class="listBox clr" >
<van-list v-model="loading" :loading="loadStatus" :finished="finished" <van-list v-model="loading" :loading="loadStatus" :finished="finished"
finished-text="没有更多了" @load="onLoad"> finished-text="没有更多了" @load="onLoad">
<router-link tag="li" :to="{'path':'/news/detail/'+item.art_id}" v-for="(item,index) in content_list" :key="index"> <router-link tag="li" :to="{'path':'/news/detail/'+item.art_id+'/'+item.cat_id}" v-for="(item,index) in content_list" :key="index">
<img :src="item.litpic" :alt="item.title"> <img :src="item.litpic" :alt="item.title">
<div class="boxgrt"> <div class="boxgrt">
<h1 class="title">{{item.title}}</h1> <h1 class="title">{{item.title}}</h1>
...@@ -123,7 +123,7 @@ ...@@ -123,7 +123,7 @@
self.navListfixed = false; self.navListfixed = false;
} }
} }
}, }
}, },
components: { components: {
Header Header
......
view/16df1da942b642a2da1e.hot-update.json deleted 100644 → 0
{"h":"a3193c9866299121ec7b","c":{"5":true}}
\ No newline at end of file
view/2.js
This diff could not be displayed because it is too large.
view/3.js
This diff could not be displayed because it is too large.
view/4.js
This diff could not be displayed because it is too large.
view/c619e59ab444fcfb487d.hot-update.json deleted 100644 → 0
{"h":"16df1da942b642a2da1e","c":{"5":true}}
\ No newline at end of file
view/index.html
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js" type="text/javascript" charset="utf-8"></script> <script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js" type="text/javascript" charset="utf-8"></script>
<script src="//szh5static.ichunt.com/static/js/flexible.min.js" type="text/javascript" charset="utf-8"></script> <script src="//szh5static.ichunt.com/static/js/flexible.min.js" type="text/javascript" charset="utf-8"></script>
<script src="//szh5static.ichunt.com/static/js/shence.min.js" type="text/javascript" charset="utf-8"></script> <script src="//szh5static.ichunt.com/static/js/shence.min.js" type="text/javascript" charset="utf-8"></script>
<link href="//szh5static.ichunt.com/0.js" rel="prefetch"><link href="//szh5static.ichunt.com/1.js" rel="prefetch"><link href="//szh5static.ichunt.com/2.js" rel="prefetch"><link href="//szh5static.ichunt.com/3.js" rel="prefetch"><link href="//szh5static.ichunt.com/4.js" rel="prefetch"><link href="//szh5static.ichunt.com/5.16df1da942b642a2da1e.hot-update.js" rel="prefetch"><link href="//szh5static.ichunt.com/5.js" rel="prefetch"><link href="//szh5static.ichunt.com/6.js" rel="prefetch"><link href="//szh5static.ichunt.com/7.js" rel="prefetch"><link href="//szh5static.ichunt.com/app.js" rel="preload" as="script"></head> <link href="//szh5static.ichunt.com/0.js" rel="prefetch"><link href="//szh5static.ichunt.com/1.js" rel="prefetch"><link href="//szh5static.ichunt.com/2.js" rel="prefetch"><link href="//szh5static.ichunt.com/3.js" rel="prefetch"><link href="//szh5static.ichunt.com/4.js" rel="prefetch"><link href="//szh5static.ichunt.com/5.0b64a10f97de49dbd8ae.hot-update.js" rel="prefetch"><link href="//szh5static.ichunt.com/5.js" rel="prefetch"><link href="//szh5static.ichunt.com/6.js" rel="prefetch"><link href="//szh5static.ichunt.com/7.js" rel="prefetch"><link href="//szh5static.ichunt.com/app.js" rel="preload" as="script"></head>
<body class="boxsiz"> <body class="boxsiz">
<noscript> <noscript>
<strong>网站出现了一点小问题，正在紧急修复中.......</strong> <strong>网站出现了一点小问题，正在紧急修复中.......</strong>
......
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 sign in to comment