main
liudan
1 year ago
parent
edbeaa9fdd
commit
afa706960a
@ -1,20 +1,23 @@ |
||||
{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/ |
||||
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数 |
||||
"version": "0.0", |
||||
"configurations": [{ |
||||
"app-plus" : |
||||
{ |
||||
"launchtype" : "local" |
||||
}, |
||||
"default" : |
||||
{ |
||||
"launchtype" : "local" |
||||
}, |
||||
"mp-weixin" : |
||||
{ |
||||
"launchtype" : "local" |
||||
}, |
||||
"type" : "uniCloud" |
||||
} |
||||
{ |
||||
// launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/ |
||||
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数 |
||||
"version" : "0.0", |
||||
"configurations" : [ |
||||
{ |
||||
"app-plus" : { |
||||
"launchtype" : "local" |
||||
}, |
||||
"default" : { |
||||
"launchtype" : "local" |
||||
}, |
||||
"mp-weixin" : { |
||||
"launchtype" : "local" |
||||
}, |
||||
"type" : "uniCloud" |
||||
}, |
||||
{ |
||||
"playground" : "standard", |
||||
"type" : "uni-app:app-android" |
||||
} |
||||
] |
||||
} |
||||
|
||||
@ -0,0 +1,308 @@ |
||||
<template> |
||||
<view class="details"> |
||||
<view class="status_bar"><!-- 这里是状态栏 --></view> |
||||
<u-navbar height="50" :autoBack="true"> |
||||
<view |
||||
class="u-nav-slot" |
||||
slot="left" |
||||
> |
||||
<u-icon |
||||
name="arrow-left" |
||||
size="19" |
||||
></u-icon> |
||||
<view class="title"> |
||||
详情 |
||||
</view> |
||||
</view> |
||||
</u-navbar> |
||||
<view class="detailContent"> |
||||
<view class="detailTitle"> |
||||
{{titleInfo.title}} |
||||
</view> |
||||
<view class="tools"> |
||||
<view class="time"> |
||||
{{titleInfo.updatetime}} |
||||
</view> |
||||
<view class="toolItem"> |
||||
<view class="" @click="addCollect"> |
||||
<image src="/static/m1.png" mode="widthFix" v-if="!isCollect"></image> |
||||
<image src="/static/collected.png" mode="widthFix" v-else></image> |
||||
<text>收藏</text> |
||||
</view> |
||||
<view class="" @click="addShare"> |
||||
<image src="/static/m3.png" mode="widthFix"></image> |
||||
<text>分享</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<u-parse :content="titleInfo.content"></u-parse> |
||||
</view> |
||||
<view class="bottomContent" v-if="showBottom"> |
||||
<view class="left"> |
||||
<image src="../../static/lxwx.png" mode="widthFix"></image> |
||||
<text>APP下载</text> |
||||
</view> |
||||
<view class="btn" @click="downloadAppHandle"> |
||||
下载 |
||||
</view> |
||||
</view> |
||||
<u-toast ref="uToast"></u-toast> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import {downloadApp,articleDetails,addCollect,addShare} from '@/common/api.js' |
||||
export default { |
||||
data() { |
||||
return { |
||||
showBottom:false, |
||||
titleInfo:{}, |
||||
id:null, |
||||
isCollect:false |
||||
}; |
||||
}, |
||||
onLoad(option) { |
||||
this.id = option.id |
||||
this.$store.commit('shareHandle',this.$mp.page.route+'?id='+this.$mp.page.options.id) |
||||
this.articleDetails() |
||||
// H5: |
||||
// #ifndef APP-PLUS |
||||
this.showBottom = true |
||||
// #endif |
||||
}, |
||||
methods:{ |
||||
downloadAppHandle(){ |
||||
downloadApp().then(res=>{ |
||||
let u = navigator.userAgent |
||||
let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; // Android |
||||
let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // iOS |
||||
if(isAndroid){ |
||||
window.location.href = res.android |
||||
} |
||||
if(isIOS){ |
||||
window.location.href = res.ios |
||||
} |
||||
console.log(res) |
||||
}) |
||||
}, |
||||
addCollect(){ |
||||
let params={ |
||||
wx_article_id:this.titleInfo.id, |
||||
wx_category_id:this.titleInfo.wx_category_id |
||||
} |
||||
uni.$u.http.post('http://lxwx.njrenzhou.cn/api/wx_article_collect/add', |
||||
params, |
||||
{ |
||||
header: { |
||||
'Content-Type': 'application/x-www-form-urlencoded', |
||||
'token':uni.getStorageSync('userInfo').token |
||||
}, |
||||
}).then((res) => { |
||||
this.$refs.uToast.show({ |
||||
message:"收藏成功" |
||||
}) |
||||
this.isCollect = true |
||||
}).catch((res) =>{ |
||||
|
||||
}) |
||||
|
||||
}, |
||||
addShare(){ |
||||
if(!uni.getStorageSync('userInfo')){ |
||||
uni.showToast({ |
||||
title:'请登录后操作', |
||||
icon:'none' |
||||
}); |
||||
uni.navigateTo({ |
||||
url:"/pages/login/login" |
||||
}) |
||||
return; |
||||
} |
||||
|
||||
let routes = this.$mp.page.route |
||||
let that = this; |
||||
// ifdef APP |
||||
uni.share({ |
||||
provider:'weixin',//分享服务提供商（即weixin|qq|sinaweibo） |
||||
type:0,//图文 |
||||
scene:'WXSceneSession',//provider 为 weixin 时必选 WXSceneSession分享到聊天界面，WXSceneTimeline分享到朋友圈，WXSceneFavorite分享到微信收藏 |
||||
title:this.titleInfo.title,//分享内容的标题 |
||||
summary:this.titleInfo.title,//分享内容的摘要 |
||||
href:`http://lxwx.h5.njrenzhou.cn/#/${routes}?id=${this.titleInfo.wx_category_id}`,//跳转链接，type 为 0 时必选 |
||||
imageUrl:`http://lxwx.njrenzhou.cn${this.titleInfo.listimage}`,//图片地址，type 为 0、2、5 时必选 |
||||
success(res) { |
||||
//成功返回的参数 |
||||
let params={ |
||||
wx_article_id:that.titleInfo.id, |
||||
wx_category_id:that.titleInfo.wx_category_id |
||||
} |
||||
uni.$u.http.post('http://lxwx.njrenzhou.cn/api/wx_article_share/add', |
||||
params, |
||||
{ |
||||
header: { |
||||
'Content-Type': 'application/x-www-form-urlencoded', |
||||
'token':uni.getStorageSync('userInfo').token |
||||
}, |
||||
}).then((res) => { |
||||
that.$store.commit('shareHandle',this.$mp.page.route+'?id='+this.$mp.page.options.id) |
||||
that.$refs.uToast.show({ |
||||
message:"分享成功" |
||||
}) |
||||
}).catch((res) =>{ |
||||
|
||||
}) |
||||
}, |
||||
fail(err) { |
||||
//失败返回的参数 |
||||
console.log(err); |
||||
} |
||||
}) |
||||
// endif |
||||
// let params={ |
||||
// wx_article_id:this.titleInfo.id, |
||||
// wx_category_id:this.titleInfo.wx_category_id |
||||
// } |
||||
// addShare(params,{ custom: { auth: true }}).then(res=>{ |
||||
// console.log(res,"iiiii") |
||||
// }) |
||||
}, |
||||
articleDetails(){ |
||||
// let params={ids:this.id} |
||||
// uni.$u.http.post('http://lxwx.njrenzhou.cn/api/wx_article_collect/add', |
||||
// params, |
||||
// { |
||||
// header: { |
||||
// 'Content-Type': 'application/x-www-form-urlencoded', |
||||
// 'token':uni.getStorageSync('userInfo').token |
||||
// }, |
||||
// }).then((res) => { |
||||
// this.$refs.uToast.show({ |
||||
// message:"收藏成功" |
||||
// }) |
||||
// this.isCollect = true |
||||
// }).catch((res) =>{ |
||||
|
||||
// }) |
||||
// {custom: { auth: true }} |
||||
articleDetails({ids:this.id,nav_id:0}).then(res=>{ |
||||
this.titleInfo = res; |
||||
if(res.is_collect==0){ |
||||
this.isCollect = false |
||||
}else{ |
||||
this.isCollect = true; |
||||
} |
||||
this.titleInfo.updatetime = this.getFormatDate(this.titleInfo.updatetime) |
||||
}) |
||||
}, |
||||
getFormatDate(time) { |
||||
let d = new Date(time*1000); |
||||
let Y = d.getFullYear(); |
||||
let M = d.getMonth() + 1; // 月份获取是0-11，所以+1 |
||||
let D = d.getDate(); |
||||
let h = d.getHours(); |
||||
let m = d.getMinutes(); |
||||
let s = d.getSeconds(); |
||||
return Y+'-'+M+'-'+D+' '+h+':'+m+':'+s; |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.details{ |
||||
min-height:calc(100vh); |
||||
background-color: #ffffff; |
||||
} |
||||
.u-nav-slot{ |
||||
display: flex; |
||||
align-items: center; |
||||
.title{ |
||||
font-size: 36upx; |
||||
color: #222222; |
||||
} |
||||
} |
||||
.detailContent{ |
||||
margin-top:50px; |
||||
margin-bottom:120upx; |
||||
padding:38upx 25upx; |
||||
.detailTitle{ |
||||
font-size: 36upx; |
||||
font-weight: bold; |
||||
color: #333333; |
||||
line-height: 54upx; |
||||
} |
||||
.tools{ |
||||
display: flex; |
||||
align-items: center; |
||||
margin:27upx 0; |
||||
.time{ |
||||
font-size: 24upx; |
||||
font-weight: 500; |
||||
color: #999999; |
||||
flex:1; |
||||
} |
||||
.toolItem{ |
||||
flex:1; |
||||
display: flex; |
||||
justify-content: space-around; |
||||
&>view{ |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
image{ |
||||
width:35upx; |
||||
height:auto; |
||||
} |
||||
text{ |
||||
font-size: 24upx; |
||||
color: #333333; |
||||
margin-left:13upx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
} |
||||
.bottomContent{ |
||||
height: 100upx; |
||||
background: #FFFFFF; |
||||
border: 1px solid #EAEAEA; |
||||
box-shadow: 0px 4px 13px 0px rgba(17,21,38,0.14); |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
padding: 0 24upx; |
||||
position:fixed; |
||||
bottom:0; |
||||
z-index:9; |
||||
width:calc(100% - 48upx); |
||||
image{ |
||||
width: 80upx; |
||||
height: 80upx; |
||||
background: #0076F6; |
||||
border-radius: 20upx; |
||||
} |
||||
text{ |
||||
font-size: 30upx; |
||||
font-family: PingFang SC; |
||||
font-weight: 500; |
||||
color: #333333; |
||||
margin-left:20upx; |
||||
} |
||||
.left{ |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
.btn{ |
||||
padding:19upx 57upx; |
||||
border-radius: 30upx; |
||||
background: #0076F6; |
||||
// opacity: 0.4; |
||||
text-align: center; |
||||
|
||||
font-size: 24upx; |
||||
font-family: PingFang SC; |
||||
font-weight: 500; |
||||
color: #FFFFFF; |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue