分享 首页播报
This commit is contained in:
11
App.vue
11
App.vue
@@ -19,9 +19,9 @@
|
||||
import Vue from 'vue'
|
||||
|
||||
export default {
|
||||
data(){
|
||||
return{
|
||||
platform:null, // 系统
|
||||
data() {
|
||||
return {
|
||||
platform: null, // 系统
|
||||
}
|
||||
},
|
||||
onLaunch: function(e) {
|
||||
@@ -147,7 +147,7 @@
|
||||
|
||||
},
|
||||
onShow: function(e) {
|
||||
|
||||
// console.log(plus.runtime.arguments, 'plus.runtime.arguments-----')
|
||||
// #ifdef MP-WEIXIN
|
||||
//获取二维码携带的参数
|
||||
let scene = decodeURIComponent(e.query.scene);
|
||||
@@ -200,8 +200,7 @@
|
||||
})
|
||||
console.log('页面销毁')
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -602,6 +602,13 @@
|
||||
"navigationBarTitleText": "国学经典",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/news/news",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "新闻播报"
|
||||
}
|
||||
}
|
||||
// {
|
||||
// "path": "pages/agreement/yszcPage",
|
||||
|
||||
@@ -2,8 +2,11 @@
|
||||
<view class="">
|
||||
<view class="header">
|
||||
<!-- 顶部导航栏 -->
|
||||
<z-nav-bar title="商品详情" bgColor="red"></z-nav-bar>
|
||||
<z-nav-bar title="商品详情" bgColor="red"><view class="icon_setUp" slot="right">
|
||||
<image @click="newOnShare()" src="/static/share.png" class="per_mes_img" style="width: 40rpx; height: 40rpx; "></image>
|
||||
</view></z-nav-bar>
|
||||
</view>
|
||||
|
||||
<view class="swiperBox">
|
||||
<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000"
|
||||
style="width: 100%;height: 100%;">
|
||||
@@ -13,6 +16,10 @@
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<!-- <view class="share flexbox" >
|
||||
<text>分享</text>
|
||||
|
||||
</view> -->
|
||||
<view class="commodityContent">
|
||||
<view class="commodityPrice" v-if="productInfo.activityPrice && productInfo.activityPrice > 0">
|
||||
<span style="font-size: 28rpx;">¥</span><em>{{ productInfo.activityPrice }}</em>
|
||||
@@ -273,6 +280,10 @@
|
||||
</view>
|
||||
<uni-goods-nav class="goods_nav" :fill="true" :options="options" :buttonGroup="buttonGroup" @click="onClick"
|
||||
@buttonClick="buttonClick" />
|
||||
<!-- 分享弹窗 -->
|
||||
<uni-popup ref="share" type="share" safeArea backgroundColor="#fff">
|
||||
<uni-popup-share @select="haveSelected"></uni-popup-share>
|
||||
</uni-popup>
|
||||
<music-play :playData="playData"></music-play>
|
||||
</view>
|
||||
</template>
|
||||
@@ -301,7 +312,12 @@ export default {
|
||||
options: [{
|
||||
icon: 'cart',
|
||||
text: '购物车'
|
||||
}],
|
||||
},
|
||||
{
|
||||
icon: 'redo',
|
||||
text: '分享'
|
||||
}
|
||||
],
|
||||
buttonGroup: [{
|
||||
text: '加入购物车',
|
||||
backgroundColor: 'linear-gradient(90deg, #FFCD1E, #FF8A18)',
|
||||
@@ -370,6 +386,51 @@ export default {
|
||||
// break;
|
||||
}
|
||||
},
|
||||
// 新写分享
|
||||
newOnShare() {
|
||||
this.$refs.share.open()
|
||||
},
|
||||
haveSelected(data) {
|
||||
let image = ''
|
||||
this.productInfo.productImages && this.productInfo.productImages != '' ? image = this.productInfo.productImages : image =
|
||||
'static/fengziIcon.jpg'
|
||||
console.log(data, ' 选择的是')
|
||||
if (data.index == 0) {
|
||||
// 分享到好友
|
||||
uni.share({
|
||||
provider: "weixin",
|
||||
scene: "WXSceneSession",
|
||||
type: 0,
|
||||
href: this.$apkUrl,
|
||||
title: `${this.productInfo.productName}`,
|
||||
// summary: `${this.productInfo.content}`,
|
||||
imageUrl: image,
|
||||
success: function(res) {
|
||||
console.log("success:" + JSON.stringify(res));
|
||||
},
|
||||
fail: function(err) {
|
||||
console.log("fail:" + JSON.stringify(err));
|
||||
}
|
||||
});
|
||||
} else if (data.index == 1) {
|
||||
// 分享到朋友圈
|
||||
uni.share({
|
||||
provider: "weixin",
|
||||
scene: "WXSceneTimeline",
|
||||
type: 0,
|
||||
href: this.$apkUrl,
|
||||
title: `${this.productInfo.productName}`,
|
||||
// summary: `${this.taskInfo.content}`,
|
||||
imageUrl: image,
|
||||
success: function(res) {
|
||||
console.log("success:" + JSON.stringify(res));
|
||||
},
|
||||
fail: function(err) {
|
||||
console.log("fail:" + JSON.stringify(err));
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
showImg(e) {
|
||||
// console.log(e,'点击的内容')
|
||||
// let contentimg = e.target.dataset.nodes;
|
||||
@@ -541,10 +602,14 @@ export default {
|
||||
},
|
||||
// 点击购物车
|
||||
onClick(e) {
|
||||
console.log(e.content.text)
|
||||
uni.navigateTo({
|
||||
url: '../peanut/shopping'
|
||||
});
|
||||
console.log(e.content)
|
||||
if(e.content.text == '分享'){
|
||||
this.$refs.share.open()
|
||||
}else{
|
||||
uni.navigateTo({
|
||||
url: '../peanut/shopping'
|
||||
});
|
||||
}
|
||||
},
|
||||
// 关联商品点击按钮组件
|
||||
buttonClickLink(e) {
|
||||
@@ -1298,4 +1363,5 @@ export default {
|
||||
.quanyi_book {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.icon_setUp{margin-right: 10px;}
|
||||
</style>
|
||||
106
pages/news/news.vue
Normal file
106
pages/news/news.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- 公共组件-每个页面必须引入 -->
|
||||
<public-module></public-module>
|
||||
<z-nav-bar title="新闻详情"></z-nav-bar>
|
||||
<view class="box">
|
||||
<view class="title">
|
||||
{{news.title}}
|
||||
</view>
|
||||
<!-- <view class="content" v-html="news.content"></view> -->
|
||||
<rich-text v-if="news.content" class="content"
|
||||
:nodes="formatRichText(news.content)"></rich-text>
|
||||
</view>
|
||||
|
||||
<music-play :playData="playData"></music-play>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import musicPlay from '@/components/music.vue'
|
||||
import $http from '@/config/requestConfig.js';
|
||||
var clear;
|
||||
import {
|
||||
mapState
|
||||
} from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
playData: {},
|
||||
newsId: null,
|
||||
news: {
|
||||
content: '',
|
||||
title: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
//第一次加载
|
||||
onLoad(e) {
|
||||
// 隐藏原生的tabbar
|
||||
uni.hideTabBar();
|
||||
this.newsId = e.newsid
|
||||
console.log(e, '------')
|
||||
},
|
||||
computed: {
|
||||
...mapState(['userInfo'])
|
||||
},
|
||||
//页面显示
|
||||
onShow() {
|
||||
// 隐藏原生的tabbar
|
||||
uni.hideTabBar();
|
||||
this.getData();
|
||||
|
||||
},
|
||||
components: {
|
||||
musicPlay
|
||||
},
|
||||
//方法
|
||||
methods: {
|
||||
getData() {
|
||||
this.$http
|
||||
.post('common/message/getMessageById?id=' + this.newsId)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
this.news.content = res.result.content
|
||||
this.news.title = res.result.title
|
||||
}
|
||||
}).catch(e => {
|
||||
console.log(e, '获取新闻详情报错')
|
||||
});
|
||||
},
|
||||
formatRichText(html) { //控制图片大小
|
||||
let newContent = html.replace(/<img[^>]*>/gi, function (match, capture) {
|
||||
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
|
||||
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
|
||||
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
|
||||
return match;
|
||||
});
|
||||
newContent = newContent.replace(/style="[^"]+"/gi, function (match, capture) {
|
||||
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi,
|
||||
'max-width:100%;');
|
||||
return match;
|
||||
});
|
||||
// newContent = newContent.replace(/<img[^>]*>/gi, function(match, capture) {
|
||||
// match = match.replace(/<img[^>]*>/gi, "@click='1111'").replace(/<img[^>]*>/gi, "@click='1111'");
|
||||
// return match;
|
||||
// });
|
||||
newContent = newContent.replace(/<br[^>]*\/>/gi, '');
|
||||
newContent = newContent.replace(/\<img/gi,
|
||||
'<img style="max-width:100%;height:auto;display:inline-block;margin:10rpx auto;"');
|
||||
return newContent;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import '@/style/mixin.scss';
|
||||
|
||||
.box {
|
||||
background-color: #fff;
|
||||
padding: 0 10px;
|
||||
// @include pleft_right(10px);
|
||||
min-height: calc(100vh - 270rpx);
|
||||
}
|
||||
.title{font-size: 32rpx; font-weight: bold; display: block; text-align: center;}
|
||||
.content { font-size: 26rpx; line-height: 48rpx; margin-top: 10rpx;}
|
||||
</style>
|
||||
@@ -143,6 +143,23 @@
|
||||
<text>书名检索</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 新闻播报 -->
|
||||
<view class="fourBox " v-if="newsList.length > 0">
|
||||
<view class="newsBox flexbox">
|
||||
<view class="icon">
|
||||
<u-icon name="volume-fill" color="#ff5500" size="26"></u-icon>
|
||||
</view>
|
||||
<view class="newscoll">
|
||||
<swiper class="swiper" interval='5000' circular autoplay vertical indicator-dots="false">
|
||||
<swiper-item class="item" v-for="(item, index) in newsList" :key="index"
|
||||
@click="newsClick(item)">
|
||||
<view class="swiper-item uni-bg-red">{{item.title}}</view>
|
||||
</swiper-item>
|
||||
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 营销标签 -->
|
||||
<scroll-view class=" yxTagBox" scroll-x="true">
|
||||
<view class="ProTabs flexbox">
|
||||
@@ -394,6 +411,7 @@
|
||||
userMsg: {}, // 用户信息
|
||||
yxCurIndex: 0, // 当前营销标签序号
|
||||
SystemInfoSync: {}, // 屏幕尺寸
|
||||
newsList: [], // 播报新闻列表
|
||||
};
|
||||
},
|
||||
onPageScroll(e) {
|
||||
@@ -438,11 +456,12 @@
|
||||
// 下拉刷新
|
||||
onPullDownRefresh() {
|
||||
this.page = 1
|
||||
this.tjProList = []
|
||||
this.getUserInfo()
|
||||
// this.tjProList = []
|
||||
// this.getUserInfo()
|
||||
// this.getData()
|
||||
this.getTags()
|
||||
this.getYXTgs()
|
||||
// this.getTags()
|
||||
// this.getYXTgs()
|
||||
this.requestAll()
|
||||
// this.requestIapOrder()
|
||||
uni.stopPullDownRefresh()
|
||||
|
||||
@@ -489,6 +508,45 @@
|
||||
// this.getData();
|
||||
this.getTags()
|
||||
this.getYXTgs()
|
||||
this.getNewsList()
|
||||
},
|
||||
newsClick(item) {
|
||||
if (item.type == 1) { // url跳转
|
||||
if (item.url != '') {
|
||||
this.openURL(item.url)
|
||||
} else {
|
||||
console.log('跳转链接为空')
|
||||
}
|
||||
} else { // 内部跳转
|
||||
uni.navigateTo({
|
||||
url: '/pages/news/news?newsid=' + item.id
|
||||
})
|
||||
}
|
||||
},
|
||||
// 获取播报新闻列表
|
||||
getNewsList() {
|
||||
$http.request({
|
||||
url: "common/message/listByPage",
|
||||
method: "POST", // POST、GET、PUT、DELETE,具体说明查看官方文档
|
||||
data: {
|
||||
"isBook": 1, //是否是疯子读书0否1是
|
||||
"isMedical": 0, //是否是吴门医述0否1是
|
||||
"isSociology": 0 //是否是众妙之门0否1是
|
||||
},
|
||||
header: { //默认 无 说明:请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
})
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.messages.length > 0) {
|
||||
this.newsList = res.messages
|
||||
} else {
|
||||
this.newsList = []
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
// 获取营销标签列表
|
||||
getYXTgs() {
|
||||
@@ -906,6 +964,41 @@
|
||||
<style lang="scss" scoped>
|
||||
@import '@/style/mixin.scss';
|
||||
|
||||
.newsBox {
|
||||
justify-content: space-between;
|
||||
background-color: #fff;
|
||||
margin-top: 10px;
|
||||
overflow: hidden;
|
||||
border-radius: 20rpx;
|
||||
padding: 10rpx;
|
||||
overflow: hidden; margin-bottom: 10px;
|
||||
.content{
|
||||
image{
|
||||
max-width: 100% !important;
|
||||
}
|
||||
}
|
||||
.icon {
|
||||
width: 44rpx;
|
||||
}
|
||||
|
||||
.newscoll {
|
||||
overflow: hidden;
|
||||
width: calc(100% - 60rpx);
|
||||
height: 40rpx;
|
||||
border: #11a669;
|
||||
line-height: 50rpx;
|
||||
|
||||
.item {
|
||||
|
||||
|
||||
.swiper-item {
|
||||
font-size: 28rpx;
|
||||
@include toe();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.yxTagBox {}
|
||||
|
||||
.children_cate_box {
|
||||
|
||||
Reference in New Issue
Block a user