提交
This commit is contained in:
liuyuan
@@ -2,12 +2,12 @@ let baseUrl = "";
|
||||
let socketUrl = "";
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
//开发环境
|
||||
baseUrl = "https://api.nuttyreading.com/"; // 线上正式
|
||||
//baseUrl = "http://192.168.110.100:9200/pb/"; // 张川川
|
||||
//baseUrl = "https://api.nuttyreading.com/"; // 线上正式
|
||||
baseUrl = "http://192.168.110.100:9200/pb/"; // 张川川
|
||||
} else if (process.env.NODE_ENV === 'production') {
|
||||
//生产环境
|
||||
baseUrl = "https://api.nuttyreading.com/";
|
||||
//baseUrl = "http://192.168.110.100:9200/pb/"; // 张川川
|
||||
//baseUrl = "https://api.nuttyreading.com/";
|
||||
baseUrl = "http://192.168.110.100:9200/pb/"; // 张川川
|
||||
}
|
||||
const courtConfig = {
|
||||
//微信公众号APPID
|
||||
|
||||
10
main.js
10
main.js
@@ -16,9 +16,9 @@ import {
|
||||
Vue.prototype.$getHours = nowHour
|
||||
|
||||
// 地址
|
||||
// Vue.prototype.$baseUrl = "http://192.168.110.100:9100/pb/"
|
||||
// Vue.prototype.$baseUrl = "http://59.110.212.44:9100/pb/"
|
||||
Vue.prototype.$baseUrl = "https://api.nuttyreading.com/"
|
||||
Vue.prototype.$baseUrl = "http://192.168.110.100:9100/pb/"
|
||||
//Vue.prototype.$baseUrl = "https://api.nuttyreading.com/"
|
||||
|
||||
// 安卓安卓包下载地址
|
||||
// Vue.prototype.$apkUrl = "https://www.nuttyreading.com/nuttyreading.apk" // 本地地址
|
||||
Vue.prototype.$apkUrl = "https://a.app.qq.com/o/simple.jsp?pkgname=com.cn.nuttyreading" // 应用宝
|
||||
@@ -85,8 +85,8 @@ import config from 'uview-ui/libs/config/config'
|
||||
Vue.component("mescroll-body", MescrollBody);
|
||||
import commonCoupon from '@/pages/component/commonComponents/coupon/index.vue'
|
||||
Vue.component('common-coupon', commonCoupon);
|
||||
// import musicPlay from '@/components/music.vue'
|
||||
// Vue.component('music-play', musicPlay);
|
||||
import commonList from '@/pages/component/commonComponents/list.vue'
|
||||
Vue.component('common-list', commonList);
|
||||
import commonAdvertisement from '@/pages/component/commonComponents/advertisement.vue'
|
||||
Vue.component('common-advertisement', commonAdvertisement);
|
||||
|
||||
|
||||
@@ -157,6 +157,13 @@
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/user/points",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的积分",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/user/bindPhone",
|
||||
"style": {
|
||||
|
||||
@@ -1,839 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="header">
|
||||
<!-- 顶部导航栏 -->
|
||||
<z-nav-bar :title="productInfo.name+'-书评'"></z-nav-bar>
|
||||
</view>
|
||||
<view class="bookInfo">
|
||||
<!-- <image :src="productInfo.images" mode="aspectFill"></image>
|
||||
<view>
|
||||
<span class="title">{{productInfo.name}}</span>
|
||||
<view class="description" v-if="productInfo.description == ''">暂无简介内容</view>
|
||||
<view class="description">{{productInfo.description}}</view>
|
||||
</view> -->
|
||||
<view class="flexbox" style="margin-bottom: 20px;">
|
||||
<image :src="productInfo.images" mode="aspectFill" class="imageradius bookinfoimage"></image>
|
||||
<view class="bookInfo-inner">
|
||||
<span class="title">{{productInfo.name}}</span>
|
||||
<span class="author" v-if="productInfo.authorName!=''">作者：{{productInfo.authorName}}</span>
|
||||
<!-- <view class="description">{{productInfo.bookdesc}}</view> -->
|
||||
|
||||
<view class="ting-du-mai">
|
||||
<view class="ting-du-mai-item" v-if="productInfo.canListen" @click="toOtherPage(1,productInfo)">
|
||||
听书</view>
|
||||
<view class="ting-du-mai-item" v-if="productInfo.clockIn == 1"
|
||||
@click="toOtherPage(2,productInfo)">读书打卡</view>
|
||||
<view class="ting-du-mai-item" v-if="productInfo.bookType == 0"
|
||||
@click="toOtherPage(3,productInfo)">立即购买</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="description" v-if="productInfo.content == ''">暂无简介内容</view>
|
||||
<view class="description" v-else>简介：{{productInfo.content}}</view>
|
||||
|
||||
</view>
|
||||
<view class="mainContent">
|
||||
|
||||
<view v-if="shupingList.length > 0">
|
||||
<view class="flexbox shuping-topbar">
|
||||
<view class="shuping-topbar-tiao">{{shupingNum || 0}}条书评</view>
|
||||
<view class="shuping-topbar-order">
|
||||
<!-- <view v-for="(item,index) in orderTabs" @click="orderTabCLi(item.value)" :key="index"
|
||||
:class="orderListTab==item.value?'orderdefine ordStyle':'orderdefine'">{{item.name}}</view> -->
|
||||
<view :class="orderListTab==1?'orderdefine ordStyle':'orderdefine'" @click="orderTabCLi(1)">按时间
|
||||
</view>
|
||||
<view style="border-left:2rpx solid #e9e9e9;height:36rpx;"></view>
|
||||
<view :class="orderListTab==2?'orderdefine ordStyle':'orderdefine'" @click="orderTabCLi(2)">按热度
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item" @click.stop="toDetail(item)" v-for="(item,index1) in shupingList" :key="index1">
|
||||
|
||||
|
||||
<view class="title">{{item.title}}</view>
|
||||
<image class="feng" v-if="item.image" :src="item.image" mode="aspectFill"></image>
|
||||
<view class="description descriptionNew" v-html="item.content">
|
||||
|
||||
</view>
|
||||
<!-- <image class="feng" v-if="item.image == ''" src="../../static/icon/home_bg.jpg" mode="aspectFill"></image> -->
|
||||
|
||||
<view class="btns flexbox" style="margin-top:10rpx;">
|
||||
|
||||
<span class="left" style="color: #C0C4CC;">{{formatTimeDifferenceFromT(item.createTime)}}</span>
|
||||
<span class="right flexbox opbtns">
|
||||
<image class="gzicon" v-if="item.ilike" src="../../static/icon/gz2.png" mode="aspectFill"
|
||||
@click.stop="clickLike(item)"></image>
|
||||
<image class="gzicon" v-else src="../../static/icon/gz.png" mode="aspectFill"
|
||||
@click.stop="clickLike(item)"></image>
|
||||
<view style="color: #C0C4CC;">{{item.contlike}}</view>
|
||||
<!-- <image class="gzicon" v-if="1" src="../../static/icon/pinglun.png" mode="aspectFill" @click.stop="pinglun(item.id)"></image>
|
||||
<view style="color: #C0C4CC;" @click.stop="pinglun(item.id)">{{item.commentNum}}</view> -->
|
||||
<image class="gzicon" v-if="1" src="../../static/icon/pinglun.png" mode="aspectFill">
|
||||
</image>
|
||||
<view style="color: #C0C4CC;">{{item.commentNum}}</view>
|
||||
</span>
|
||||
</view>
|
||||
<view style="border-bottom:2rpx solid #e9e9e9;height:36rpx;" v-if="index1<shupingList.length-1">
|
||||
</view>
|
||||
<!-- <image class="feng" v-if="item.image == ''" src="../../static/icon/home_bg.jpg" mode="scaleToFill" style="width: 100%;"></image>
|
||||
<image class="feng" v-else :src="item.image" mode="scaleToFill" style="width: 100%;"></image>
|
||||
<text class="title">{{item.title}}</text> -->
|
||||
<!-- <view class="description" v-html="item.content">
|
||||
{{item.content}}
|
||||
</view> -->
|
||||
<!-- <view class="btns flexbox">
|
||||
<span class="time">{{item.updateTime}}</span>
|
||||
<span class="flexbox opbtns">
|
||||
<span class="flexbox" @click="dianzan('1')">
|
||||
<u-icon name="heart" color="#55aa00" size="26"></u-icon>
|
||||
<text>2656</text>
|
||||
</span>
|
||||
<span class="flexbox pingjia" @click.stop="pinglun(item.id)">
|
||||
<u-icon name="chat" color="#55aa00" size="26"></u-icon>
|
||||
<text>2656</text>
|
||||
</span>
|
||||
</span>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="quesheng" v-else>
|
||||
暂无书评内容~
|
||||
</view>
|
||||
<view v-if="status==0" style="text-align: center;">
|
||||
<u-loading-icon style="display: inline-block;"></u-loading-icon>
|
||||
<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
|
||||
</view>
|
||||
<view v-if="status==1" style="padding-bottom: 20rpx;">
|
||||
<u-divider text="全部加载完成"></u-divider>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 评价对话框 -->
|
||||
<u-popup :show="pingjiaShow" :round="10" @close="closePingjia">
|
||||
<view class="tanchu">
|
||||
<view class="dp_title">添加评论</view>
|
||||
<view style="max-height: 1000rpx;overflow-y: scroll;">
|
||||
<uni-forms :modelValue="Pform">
|
||||
<!-- 评价图片 -->
|
||||
<!-- end -->
|
||||
<!-- <uni-forms-item name="comment" label-width="0">
|
||||
<uni-easyinput type="textarea" v-model="Pform.comment" placeholder="请输入您的商品评价" />
|
||||
</uni-forms-item> -->
|
||||
</uni-forms>
|
||||
<!-- <u-button type="success" @click="submitPJ">提交评价</u-button> -->
|
||||
<!-- 提交 -->
|
||||
<view class="padding-bottom-sm flex padding-lr-sm" style="border-bottom: 1px solid #EEEEEE;">
|
||||
|
||||
<view class="flex-sub flexbox">
|
||||
<i @click="showEmj()" :class="emojiIcon"></i>
|
||||
<!-- <input type="text" @focus="InputFocus" @blur="InputBlur" v-model="message" @input="textareaBInput" placeholder-style="font-size:24rpx;color:#aaaaaa;" placeholder="请输入您要发送的内容"></input> -->
|
||||
<textarea class="textarea" v-model="Pform.comment" @focus="InputFocus" @blur="InputBlur"
|
||||
@input="textareaBInput" placeholder-style="font-size:24rpx;color:#aaaaaa;"
|
||||
placeholder="请输入您要发送的内容"></textarea>
|
||||
</view>
|
||||
<view class="">
|
||||
<u-button type="success" @click="submitPJ">提交</u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="position: relative;">
|
||||
<emotion @emotion="handleEmj" :height="220" v-if="isShowEmj" :windowWidth="windowWidth">
|
||||
</emotion>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<music-play :playData="playData"></music-play>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from '@/config/requestConfig.js';
|
||||
import emotion from '@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-emojiplus.vue';
|
||||
import musicPlay from '@/components/music.vue'
|
||||
import {
|
||||
data
|
||||
} from 'jquery';
|
||||
import {
|
||||
mapState
|
||||
} from 'vuex';
|
||||
import {
|
||||
checkBookRight
|
||||
} from '@/config/utils';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderListTab: 1,
|
||||
orderTabs: [{
|
||||
name: '按时间',
|
||||
value: 1
|
||||
}, {
|
||||
name: '按热度',
|
||||
value: 2
|
||||
}],
|
||||
shupingNum: 0,
|
||||
loadingNow: false,
|
||||
playData: {},
|
||||
isShowEmj: false,
|
||||
emojiIcon: 'cuIcon-emoji',
|
||||
windowWidth: 0,
|
||||
bookid: null,
|
||||
productInfo: {},
|
||||
pingjiaShow: false, //添加评价
|
||||
Pform: { // 评价表单
|
||||
star: 0,
|
||||
comment: '',
|
||||
img: [],
|
||||
html: ''
|
||||
},
|
||||
emoji: [],
|
||||
Files: [],
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
status: 3,
|
||||
shupingList: [],
|
||||
bfaid: null,
|
||||
newTime:'',
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
console.log('下拉刷新了')
|
||||
uni.stopPullDownRefresh();
|
||||
|
||||
this.page = 1, // 页码
|
||||
this.shupingList = []
|
||||
this.getBookCom(this.orderListTab)
|
||||
|
||||
},
|
||||
onReachBottom() {
|
||||
this.loadingNow = true
|
||||
if (this.page < this.total) {
|
||||
this.page++
|
||||
console.log('加载', this.page)
|
||||
this.status = 0
|
||||
this.getBookCom(this.orderListTab)
|
||||
|
||||
} else {
|
||||
this.status = 1
|
||||
console.log('加载完成了', this.page)
|
||||
return
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.windowWidth = uni.getSystemInfoSync().windowWidth;
|
||||
console.log(e, 'onload')
|
||||
this.bookid = e.bookid
|
||||
this.getProDetail(e)
|
||||
this.getBookCom(this.orderListTab)
|
||||
},
|
||||
computed: {
|
||||
...mapState(['userInfo']),
|
||||
},
|
||||
methods: {
|
||||
toOtherPage(e, productInfo) {
|
||||
if (e == 1) {
|
||||
// 跳转到听书
|
||||
uni.navigateTo({
|
||||
url: "../listen/listen?bookid=" + productInfo.id
|
||||
});
|
||||
}
|
||||
if (e == 2) {
|
||||
// 跳转到读书打卡
|
||||
let data = {
|
||||
'userId': this.userInfo.id,
|
||||
'bookId': productInfo.id
|
||||
}
|
||||
checkBookRight(data, res => {
|
||||
console.log(res)
|
||||
if (res.success) {
|
||||
uni.navigateTo({
|
||||
url: '../clock/clock?bookid=' + productInfo.id
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '购买本书后方可参与打卡!',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
if (e == 3) {
|
||||
// 跳转到购买
|
||||
uni.navigateTo({
|
||||
url: '../bookShop/commodityDetail?id=' + productInfo.id
|
||||
});
|
||||
}
|
||||
},
|
||||
// 切换tab状态
|
||||
orderTabCLi(e) {
|
||||
this.orderListTab = e
|
||||
this.page = 1
|
||||
this.shupingList = []
|
||||
this.getBookCom(this.orderListTab)
|
||||
},
|
||||
clickLike(item) {
|
||||
this.$http
|
||||
.post("forum/articles/chickForumContlike?forum_id=" + item.id, )
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title: '点赞成功！',
|
||||
icon: 'success'
|
||||
})
|
||||
item.contlike++
|
||||
}
|
||||
}).catch((e) => {
|
||||
console.log(e, 'e')
|
||||
})
|
||||
},
|
||||
formatTimeDifferenceFromT(dateTimeT) {
|
||||
dateTimeT= dateTimeT.replace(/-/g,"/")
|
||||
console.log("🚀 ~ formatTimeDifferenceFromT ~ dateTimeT:", dateTimeT)
|
||||
const now = new Date();
|
||||
const t = new Date(dateTimeT);
|
||||
console.log("🚀 ~ formatTimeDifferenceFromT ~ t:", t)
|
||||
const differenceInSeconds = Math.floor((now - t) / 1000);
|
||||
console.log("🚀 ~ formatTimeDifferenceFromT ~ differenceInSeconds:", differenceInSeconds)
|
||||
|
||||
if (differenceInSeconds <= 3600) {
|
||||
const minutes = Math.floor(differenceInSeconds / 60);
|
||||
return `${minutes} 分钟前`;
|
||||
} else if (differenceInSeconds <= 86400) {
|
||||
const hours = Math.floor(differenceInSeconds / 3600);
|
||||
return `${hours} 小时前`;
|
||||
} else if (differenceInSeconds <= 2592000) {
|
||||
const days = Math.floor(differenceInSeconds / 86400);
|
||||
return `${days} 天前`;
|
||||
} else {
|
||||
const currentYear = now.getFullYear();
|
||||
const tYear = t.getFullYear();
|
||||
if (currentYear === tYear) {
|
||||
const month = t.getMonth() + 1;
|
||||
const day = t.getDate();
|
||||
return `${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
|
||||
} else {
|
||||
const year = t.getFullYear();
|
||||
const month = t.getMonth() + 1;
|
||||
const day = t.getDate();
|
||||
return `${year}-${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 书评详情
|
||||
toDetail(val) {
|
||||
console.log(val, 'val')
|
||||
uni.navigateTo({
|
||||
url: './commentsDetail?bookid=' + this.bookid + '&bfa_id=' + val.id
|
||||
})
|
||||
},
|
||||
getProDetail(e) {
|
||||
// 获取商品详情
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
});
|
||||
//console.log(e.id,'e.id')
|
||||
this.$http
|
||||
.post('book/book/appinfo/' + this.bookid + '/' + this.userInfo.id)
|
||||
.then(res => {
|
||||
console.log(res, 'res')
|
||||
this.productInfo = res.book
|
||||
uni.hideLoading();
|
||||
}).catch((e) => {
|
||||
console.log(e, 'e')
|
||||
})
|
||||
},
|
||||
// 获得书评
|
||||
getBookCom(flag) {
|
||||
let data = {
|
||||
'page': this.page,
|
||||
'limit': this.pageSize,
|
||||
'bookId': this.bookid,
|
||||
'order': flag
|
||||
}
|
||||
console.log(data, 'data')
|
||||
this.$http
|
||||
.post('forum/articles/getForumByBook', data)
|
||||
.then(res => {
|
||||
console.log(res, '获取成功')
|
||||
this.total = res.page.pages
|
||||
this.shupingNum = res.page.total
|
||||
this.shupingList = this.shupingList.concat(res.page.records)
|
||||
// console.log(res,'已购买')
|
||||
this.status = 3
|
||||
}).catch((e) => {
|
||||
console.log(e, 'e')
|
||||
})
|
||||
},
|
||||
// 获得输入的表情数组
|
||||
handleEmj(i) {
|
||||
console.log(i, 'i---------');
|
||||
this.inputValue = i
|
||||
// console.log(this.inputValue);
|
||||
if (i.emotioni == '[em_98]') {
|
||||
//匹配最后一个表情符号并删除11。
|
||||
this.Pform.comment = this.Pform.comment.replace(/(\[[^\]]+\]|[\s\S])$/, '');
|
||||
if (this.emoji.length > 0) {
|
||||
this.emoji = this.emoji.slice(0, -1)
|
||||
}
|
||||
} else {
|
||||
this.emoji.push({
|
||||
'tag': i.emotion,
|
||||
'name': i.emotioni
|
||||
})
|
||||
// console.log(this.emoji,'this.emoji')
|
||||
this.Pform.comment += i.emotioni;
|
||||
/// this.Pform.html += i.emotion
|
||||
}
|
||||
},
|
||||
textareaBInput(e) {
|
||||
console.log(e, 'e')
|
||||
this.Pform.comment = e.detail.value
|
||||
/// this.Pform.html = e.detail.value
|
||||
},
|
||||
showEmj() {
|
||||
let bool = !this.isShowEmj;
|
||||
if (bool) {
|
||||
this.emojiIcon = 'cuIcon-keyboard';
|
||||
} else {
|
||||
this.emojiIcon = 'cuIcon-emoji';
|
||||
}
|
||||
this.isShowEmj = bool;
|
||||
this.$emit('show')
|
||||
},
|
||||
InputBlur(e) {
|
||||
|
||||
},
|
||||
InputFocus(e) {
|
||||
this.isShowEmj = false;
|
||||
this.emojiIcon = 'cuIcon-emoji';
|
||||
this.$emit('foc')
|
||||
},
|
||||
// end
|
||||
deleteImg(e) {
|
||||
// var arr = this.Pform.img.slice(0,-1)
|
||||
this.Pform.img.pop()
|
||||
// console.log('删除文件',arr)
|
||||
console.log(this.Pform)
|
||||
},
|
||||
getStar(i) {
|
||||
this.Pform.star = i
|
||||
},
|
||||
select(e) {
|
||||
console.log('选择文件：', e)
|
||||
let arr = e.tempFiles.map(item => {
|
||||
return {
|
||||
'url': item.url,
|
||||
'name': item.name
|
||||
}
|
||||
})
|
||||
this.Pform.img = this.Pform.img.concat(...arr)
|
||||
//this.Pform.img = arr
|
||||
console.log(this.Pform, 'img')
|
||||
},
|
||||
upSuccess(e) {
|
||||
console.log(e)
|
||||
},
|
||||
// 获取html格式的评论1
|
||||
getHtmlComment() {
|
||||
// 格式化html
|
||||
var ss = this.Pform.comment
|
||||
if (this.emoji.length > 0) {
|
||||
for (var i = 0; i < this.emoji.length; i++) {
|
||||
if (this.Pform.comment.indexOf(this.emoji[i].name) !== -1) {
|
||||
//var re = new RegExp(this.emoji[0].name,"g"); //定义正则表达式
|
||||
//第一个参数是要替换掉的内容，第二个参数"g"表示替换全部（global）。
|
||||
// ss = ss.replace(re, ); //第一个参数是正则表达式。
|
||||
ss = ss.replace(this.emoji[i].name, this.emoji[i].tag)
|
||||
// console.log(ss)
|
||||
}
|
||||
}
|
||||
this.Pform.html = ss
|
||||
} else {
|
||||
this.Pform.html = this.Pform.comment
|
||||
}
|
||||
//console.log(this.Pform.html,'this.Pform.html')
|
||||
},
|
||||
deletePic() {
|
||||
let that = this
|
||||
that.Pform.img.splice(0, 1)
|
||||
//console.log(that.Pform.img)
|
||||
},
|
||||
afterRead(e) {
|
||||
//console.log(e)
|
||||
let that = this
|
||||
for (var i = 0; i < e.file.length; i++) {
|
||||
//console.log(i,e.file[i].url)
|
||||
uni.uploadFile({
|
||||
url: this.$baseUrl + 'oss/fileoss',
|
||||
filePath: e.file[i].url,
|
||||
//files:e.file,
|
||||
name: 'file',
|
||||
formData: {},
|
||||
success: (res) => {
|
||||
that.Pform.img.push({
|
||||
url: JSON.parse(res.data).url
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
closePingjia() {
|
||||
this.pingjiaShow = false
|
||||
this.Pform.comment = ''
|
||||
this.Pform.html = ''
|
||||
this.emoji = []
|
||||
},
|
||||
// 点赞
|
||||
dianzan(val) {},
|
||||
|
||||
// 显示评论
|
||||
pinglun(val) {
|
||||
this.bfaid = val
|
||||
this.pingjiaShow = true
|
||||
},
|
||||
// 提交评论
|
||||
submitPJ() {
|
||||
if (this.Pform.comment != '') {
|
||||
let data = {
|
||||
'content': this.Pform.comment,
|
||||
'userid': this.userInfo.id,
|
||||
'bookid': this.bookid,
|
||||
'bfaid': this.bfaid
|
||||
}
|
||||
// console.log(data,'data')
|
||||
$http.request({
|
||||
url: "forum/comment/save",
|
||||
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
|
||||
data,
|
||||
header: { //默认 无 说明：请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title: '评论成功！',
|
||||
icon: 'success'
|
||||
})
|
||||
this.pingjiaShow = false
|
||||
this.Pform.comment = ''
|
||||
this.pinglunId = null
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请先输入您的评价内容 ！',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
components: {
|
||||
musicPlay,
|
||||
emotion
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.flexbox {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.star {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.starGray {
|
||||
background: url(../../static/icon/star_greey.png) no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.starLight {
|
||||
background: url(../../static/icon/star_light.png) no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.cuIcon-emoji {
|
||||
background: url(../../static/biaoqing.png) no-repeat;
|
||||
background-size: contain;
|
||||
display: block;
|
||||
margin-right: 20rpx;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.cuIcon-keyboard {
|
||||
background: url(../../static/biaoqing.png) no-repeat;
|
||||
background-size: contain;
|
||||
display: block;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.tanchu {
|
||||
padding: 40rpx 30rpx 40rpx 30rpx;
|
||||
position: relative;
|
||||
|
||||
|
||||
.dp_title {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 50rpx;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.dp_add {
|
||||
position: absolute;
|
||||
top: 40rpx;
|
||||
right: 30rpx;
|
||||
font-size: 22rpx;
|
||||
background-color: #fd6004;
|
||||
color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
|
||||
.u-icon {
|
||||
display: inline-block;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shuping-topbar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.shuping-topbar-tiao {
|
||||
font-size: 28rpx;
|
||||
color: #8b8a91;
|
||||
}
|
||||
|
||||
.shuping-topbar-order {
|
||||
width: 280rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.orderdefine {
|
||||
display: inline-block;
|
||||
padding: 20rpx 0 20rpx 0;
|
||||
// margin: 40rpx 0 15rpx 0;
|
||||
width: 230rpx;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.ordStyle {
|
||||
// border-bottom: 4rpx solid #54a966;
|
||||
// color: #54a966;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.quesheng {
|
||||
text-align: center;
|
||||
margin-top: 100rpx;
|
||||
color: #8b8a91;
|
||||
padding-bottom: 20rpx;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.bookInfo {
|
||||
justify-content: space-between;
|
||||
margin-bottom: 15px;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
// border: 1px splid #999;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.ting-du-mai {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: center;
|
||||
font-size: 28rpx;
|
||||
width: 400rpx;
|
||||
|
||||
.ting-du-mai-item {
|
||||
color: deepskyblue;
|
||||
border: 1px solid deepskyblue;
|
||||
border-radius: 6rpx;
|
||||
padding: 4rpx 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.imageradius {
|
||||
border-radius: 20rpx;
|
||||
border: 1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.bookinfoimage {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.bookInfo-inner {
|
||||
padding-left: 30rpx;
|
||||
box-sizing: border-box;
|
||||
width: calc(100% - 100px);
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
margin-top: 0rpx;
|
||||
margin-bottom: 20rpx;
|
||||
font-weight: 700;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.author {
|
||||
font-size: 30rpx;
|
||||
margin-top: 0rpx;
|
||||
margin-bottom: 20rpx;
|
||||
font-weight: 500;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 28rpx;
|
||||
line-height: 20px;
|
||||
width: 100%;
|
||||
color: #888;
|
||||
padding-left: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 9;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
|
||||
}
|
||||
|
||||
// view{ padding-left: 30rpx; box-sizing: border-box; width: calc(100% - 150px);
|
||||
// .title{font-size: 38rpx; margin-top: 20rpx; font-weight: blod; margin-bottom: 20rpx; display: block;
|
||||
// }
|
||||
// .description{line-height: 20px; width: 100%; color:#888; padding-left: 0;}
|
||||
// }
|
||||
// image{width: 150px !important; }
|
||||
|
||||
}
|
||||
|
||||
.mainContent {
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
|
||||
.item {
|
||||
// padding: 10px;
|
||||
margin-bottom: 30rpx;
|
||||
// border: 1px solid #999;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.feng {
|
||||
margin: 10rpx 20rpx 0 0;
|
||||
height: 160rpx;
|
||||
width: 140rpx;
|
||||
float: left;
|
||||
border-radius: 20rpx;
|
||||
border: 1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.description {
|
||||
// width: 100%;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden !important;
|
||||
height:190rpx;
|
||||
color: #666 !important;
|
||||
text-overflow: -o-ellipsis-lastline !important;
|
||||
overflow: hidden !important;
|
||||
text-overflow: ellipsis !important;
|
||||
display: -webkit-box !important;
|
||||
-webkit-line-clamp: 5 !important;
|
||||
line-clamp: 5 !important;
|
||||
-webkit-box-orient: vertical !important;
|
||||
font-size: 26rpx !important;
|
||||
margin-bottom: 20rpx !important;
|
||||
margin-top: 10rpx !important;
|
||||
|
||||
white-space: pre-wrap;
|
||||
|
||||
// height: 172rpx;
|
||||
}
|
||||
|
||||
// .btns{
|
||||
// font-size: 24rpx;
|
||||
// justify-content: space-between;
|
||||
// align-items: center;
|
||||
// .time{font-size: 24rpx; color: #666; }
|
||||
// .opbtns{
|
||||
// .pingjia{margin-left: 10px;}
|
||||
// }
|
||||
// }
|
||||
|
||||
.btns {
|
||||
font-size: 22rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.left {
|
||||
width: 300rpx;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 300rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gzicon {
|
||||
margin: 0 0 0 20rpx;
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
// float:left;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.opbtns {
|
||||
.pingjia {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mb30 {
|
||||
margin-bottom: 30rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.descriptionNew{
|
||||
// overflow: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -1,853 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="header">
|
||||
<!-- 顶部导航栏 -->
|
||||
<z-nav-bar title="书评详情"></z-nav-bar>
|
||||
</view>
|
||||
<view class="bookInfo">
|
||||
<!-- <image :src="productInfo.images" mode="aspectFill"></image>
|
||||
<view>
|
||||
<span class="title">{{productInfo.name}}</span>
|
||||
<view class="description">{{productInfo.description}}</view>
|
||||
</view> -->
|
||||
<!-- <view class="flexbox" style="margin-bottom: 20px;">
|
||||
<image :src="productInfo.images" mode="aspectFill" class="imageradius bookinfoimage"></image>
|
||||
<view class="bookInfo-inner">
|
||||
<span class="title">{{productInfo.name}}</span>
|
||||
<span class="author">作者：{{productInfo.authorName}}</span>
|
||||
<view class="description" v-if="productInfo.description == ''">暂无简介内容</view>
|
||||
<view class="description" v-else>简介：{{productInfo.description}}</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="item">
|
||||
<view class="title">{{commentInfo.title}}</view>
|
||||
<view style="display:flex;">
|
||||
<image v-if="productInfo.images != ''" class="feng" :src="productInfo.images" mode="aspectFill" style="" @click="previewImage(productInfo.images)"></image>
|
||||
<image v-if="commentInfo.image != ''" class="feng" :src="commentInfo.image" mode="aspectFill" style="" @click="previewImage(commentInfo.image)"></image>
|
||||
</view>
|
||||
<!-- <view class="description">
|
||||
|
||||
</view> -->
|
||||
<view class="btns flexbox">
|
||||
<!-- <span class="time">{{commentInfo.createTime}}</span> -->
|
||||
<span class="flexbox opbtns">
|
||||
<!-- <span class="flexbox" @click="dianzan('1')">
|
||||
<u-icon name="heart" color="#55aa00" size="22"></u-icon>
|
||||
<text>2656</text>
|
||||
</span> -->
|
||||
</span>
|
||||
</view>
|
||||
<view class="zhengwen" v-html="commentInfo.content">
|
||||
</view>
|
||||
<view class="btns flexbox">
|
||||
<span class="left"></span>
|
||||
<span class="right flexbox opbtns" style="color:#C0C4CC;">
|
||||
{{formatTimeDifferenceFromT(commentInfo.createTime)}}
|
||||
</span>
|
||||
</view>
|
||||
<view class="btns flexbox" style="margin-top:10rpx;">
|
||||
<span class="left" style="color: #C0C4CC;"></span>
|
||||
<span class="right flexbox opbtns">
|
||||
<image class="gzicon" v-if="commentInfo.ilike" src="../../static/icon/gz2.png" mode="aspectFill" @click.stop="clickLikeshuping(commentInfo)"></image>
|
||||
<image class="gzicon" v-else src="../../static/icon/gz.png" mode="aspectFill" @click.stop="clickLikeshuping(commentInfo)"></image>
|
||||
<view style="color: #C0C4CC;">{{commentInfo.contlike}}</view>
|
||||
<image class="gzicon" v-if="1" src="../../static/icon/pinglun.png" mode="aspectFill" @click="pinglun()"></image>
|
||||
<view style="color: #C0C4CC;" @click="pinglun()">{{commentInfo.commentNum}}</view>
|
||||
</span>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="mainContent">
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<view class="pinglunMain" >
|
||||
<!-- <u-button class="addPl" type='success' plain @click="pinglun()">添加评论</u-button>
|
||||
<view class="">
|
||||
<view style="font-weight: 700;margin:30rpx 0rpx 30rpx;font-size: 30rpx;color:#55aa00;">精彩热评</view>
|
||||
</view> -->
|
||||
<!-- <h4>~ 精彩热评 ~</h4> -->
|
||||
<view v-if="plList.length > 0">
|
||||
<view class="pl-item" v-for="item in plList" :key="item.id">
|
||||
<view class="plusername">{{item.user.name}}</view>
|
||||
<view class="content" v-html="item.content"></view>
|
||||
<!-- <view class="btns flexbox"> -->
|
||||
<!-- <span class="time">{{formatTimeDifferenceFromT(item.createTime)}}</span> -->
|
||||
<!-- <span class="flexbox opbtns">
|
||||
<span class="flexbox pingjia" @click="pinglun(item.id)">
|
||||
<u-icon name="chat" color="#888" size="26"></u-icon>
|
||||
</span>
|
||||
</span> -->
|
||||
<view class="btns flexbox" style="margin-top:10rpx;">
|
||||
<span class="left" style="color: #C0C4CC;">{{formatTimeDifferenceFromT(item.createTime)}}</span>
|
||||
<span class="right flexbox opbtns">
|
||||
<image class="gzicon" v-if="item.ilike" src="../../static/icon/gz2.png" mode="aspectFill" @click.stop="clickLikehuifu(item)"></image>
|
||||
<image class="gzicon" v-else src="../../static/icon/gz.png" mode="aspectFill" @click.stop="clickLikehuifu(item)"></image>
|
||||
<view style="color: #C0C4CC;">{{item.contlike}}</view>
|
||||
<image class="gzicon" v-if="1" src="../../static/icon/pinglun.png" mode="aspectFill" @click="pinglun(item)"></image>
|
||||
<view style="color: #C0C4CC;" @click="pinglun(item)">{{item.commentsNum}}</view>
|
||||
</span>
|
||||
</view>
|
||||
<view class="pl-son" v-if="item.comments.length > 0">
|
||||
<view class="pl-son-item" v-for="(item1,index) in item.comments" :key="index">
|
||||
<view class="pl-son-item-content">
|
||||
<text class="pl-son-atob">{{item1.user.name + " 回复 " + item1.puser.name}}：</text>
|
||||
<text v-html="item1.content"></text>
|
||||
</view>
|
||||
<view class="btns flexbox" style="margin-top:10rpx;">
|
||||
<span class="left" style="color: #C0C4CC;">{{formatTimeDifferenceFromT(item1.createTime)}}</span>
|
||||
<span class="right flexbox opbtns">
|
||||
<image class="gzicon" v-if="item1.ilike" src="../../static/icon/gz2.png" mode="aspectFill" @click.stop="clickLikehuifu(item1)"></image>
|
||||
<image class="gzicon" v-else src="../../static/icon/gz.png" mode="aspectFill" @click.stop="clickLikehuifu(item1)"></image>
|
||||
<view style="color: #C0C4CC;">{{item1.contlike}}</view>
|
||||
<image class="gzicon" v-if="1" src="../../static/icon/pinglun.png" mode="aspectFill" @click="pinglun(item1)"></image>
|
||||
<!-- <view style="color: #C0C4CC;" @click="pinglun(item1)">{{item1.commentsNum}}</view> -->
|
||||
</span>
|
||||
</view>
|
||||
<view style="border-bottom:2rpx solid #e9e9e9;height:20rpx;" v-if="index<item.comments.length-1"></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- </view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="quesheng" v-else>
|
||||
<text>暂无评论内容~</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="status==0" style="text-align: center;">
|
||||
<u-loading-icon style="display: inline-block;"></u-loading-icon>
|
||||
<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
|
||||
</view>
|
||||
<u-divider v-if="status == 1" text="已加载全部评论"></u-divider>
|
||||
<!-- 评论书评对话框 -->
|
||||
<!-- 回复评论对话框 -->
|
||||
<u-popup :show="pingjiaShow" :round="10" @close="closePingjia">
|
||||
<view class="tanchu">
|
||||
<view class="dp_title">{{Pform.name?("回复："+Pform.name):"添加评论"}}</view>
|
||||
<view style="max-height: 1000rpx;overflow-y: scroll;">
|
||||
<!-- <u-button type="success" @click="submitPJ">提交评价</u-button> -->
|
||||
<!-- 提交 -->
|
||||
<view class="padding-bottom-sm flex padding-lr-sm" style="border-bottom: 1px solid #EEEEEE;">
|
||||
|
||||
<view class="flex-sub flexbox">
|
||||
<i @click="showEmj()" :class="emojiIcon" ></i>
|
||||
<!-- <input type="text" @focus="InputFocus" @blur="InputBlur" v-model="message" @input="textareaBInput" placeholder-style="font-size:24rpx;color:#aaaaaa;" placeholder="请输入您要发送的内容"></input> -->
|
||||
<textarea class="textarea" v-model="Pform.comment" @focus="InputFocus" @blur="InputBlur" @input="textareaBInput" placeholder-style="font-size:24rpx;color:#aaaaaa;" placeholder="请输入您要发送的内容"></textarea>
|
||||
</view>
|
||||
<view class="">
|
||||
<u-button type="success" @click="submitPJ">提交</u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="position: relative;">
|
||||
<emotion @emotion="handleEmj" :height="220" v-if="isShowEmj" :windowWidth="windowWidth"></emotion>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<music-play :playData="playData"></music-play>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from '@/config/requestConfig.js';
|
||||
import emotion from '@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-emojiplus.vue';
|
||||
import musicPlay from '@/components/music.vue'
|
||||
import emojiList1 from '../../bkhumor-emojiplus/emoji/biaoqin.js'
|
||||
import {
|
||||
mapState
|
||||
} from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
playData:{},
|
||||
isShowEmj: false,
|
||||
emojiIcon:'cuIcon-emoji',
|
||||
windowWidth:0,
|
||||
bookid:null,
|
||||
bfa_id:null, //书评id
|
||||
productInfo:{},
|
||||
status:3,
|
||||
pingjiaShow:false, //添加评价
|
||||
Pform:{ // 评价表单
|
||||
//star:0,
|
||||
comment:'',
|
||||
//img:[],
|
||||
html:''
|
||||
},
|
||||
emoji:[],
|
||||
Files:[],
|
||||
commentInfo:{},
|
||||
pPage:1,
|
||||
pTotal:0, // 评论的总条数
|
||||
// pinglunId:null,
|
||||
plList:[], // 书评的评论list
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.windowWidth = uni.getSystemInfoSync().windowWidth;
|
||||
console.log(e,'onload')
|
||||
this.bookid = e.bookid
|
||||
this.bfa_id = e.bfa_id
|
||||
},
|
||||
onShow() {
|
||||
this.getProDetail()
|
||||
this.getbookComInfo()
|
||||
this.getCommPL()
|
||||
},
|
||||
onReachBottom() {
|
||||
console.log('到底了')
|
||||
if(this.pPage+1 <= this.pTotal){
|
||||
this.status = 0
|
||||
this.pPage++
|
||||
this.getCommPL()
|
||||
}else{
|
||||
this.status = 3
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
...mapState(['userInfo']),
|
||||
},
|
||||
methods: {
|
||||
formatTimeDifferenceFromT(dateTimeT) {
|
||||
const now = new Date();
|
||||
const t = new Date(dateTimeT);
|
||||
const differenceInSeconds = Math.floor((now - t) / 1000);
|
||||
|
||||
if (differenceInSeconds <= 3600) {
|
||||
const minutes = Math.floor(differenceInSeconds / 60);
|
||||
return `${minutes} 分钟前`;
|
||||
} else if (differenceInSeconds <= 86400) {
|
||||
const hours = Math.floor(differenceInSeconds / 3600);
|
||||
return `${hours} 小时前`;
|
||||
} else if (differenceInSeconds <= 2592000) {
|
||||
const days = Math.floor(differenceInSeconds / 86400);
|
||||
return `${days} 天前`;
|
||||
} else {
|
||||
const currentYear = now.getFullYear();
|
||||
const tYear = t.getFullYear();
|
||||
if (currentYear === tYear) {
|
||||
const month = t.getMonth() + 1;
|
||||
const day = t.getDate();
|
||||
return `${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
|
||||
} else {
|
||||
const year = t.getFullYear();
|
||||
const month = t.getMonth() + 1;
|
||||
const day = t.getDate();
|
||||
return `${year}-${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 获得书评回复列表
|
||||
getCommPL(){
|
||||
let data = {
|
||||
'forumId':this.bfa_id,
|
||||
'limit': 5,
|
||||
'page': this.pPage,
|
||||
}
|
||||
console.log(data,'data')
|
||||
this.$http
|
||||
.post('forum/articles/getCommentByForum', data)
|
||||
.then(res => {
|
||||
if(res.code == 0){
|
||||
console.log(res,'书评评论')
|
||||
// this.plList = this.plList.concat(res.page.list)
|
||||
let plList1 = res.page.records
|
||||
this.pTotal = res.page.pages
|
||||
this.status = 3
|
||||
// 评论格式化
|
||||
var newarr = []
|
||||
plList1.forEach((item1)=>{
|
||||
item1.content = this.getHtmlComment(item1.content)
|
||||
if(item1.comments && item1.comments.length>0){
|
||||
item1.comments.forEach((item2)=>{
|
||||
item2.content = this.getHtmlComment(item2.content)
|
||||
})
|
||||
}
|
||||
// console.log(pjstr)
|
||||
newarr.push(item1)
|
||||
|
||||
})
|
||||
this.plList = this.plList.concat(newarr)
|
||||
console.log('改变格式后', this.plList)
|
||||
}
|
||||
}).catch((e)=>{
|
||||
console.log(e)
|
||||
})
|
||||
},
|
||||
// 获得书评详情
|
||||
getbookComInfo(){
|
||||
this.$http
|
||||
.post(`forum/articles/appinfo/${this.bfa_id}`)
|
||||
.then(res => {
|
||||
if(res.code == 0){
|
||||
console.log(res,'书评详细内容')
|
||||
this.commentInfo = res.BookForumArticlesEntity
|
||||
}
|
||||
}).catch((e)=>{
|
||||
console.log(e)
|
||||
})
|
||||
},
|
||||
clickLikeshuping(item){
|
||||
this.$http
|
||||
.post("forum/articles/chickForumContlike?forum_id=" + item.id,)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title:'点赞成功！',
|
||||
icon:'success'
|
||||
})
|
||||
|
||||
item.contlike++
|
||||
}
|
||||
}).catch((e)=>{
|
||||
console.log(e,'e')
|
||||
})
|
||||
},
|
||||
clickLikehuifu(item){
|
||||
let data = {
|
||||
comment_id: item.id
|
||||
}
|
||||
this.$http
|
||||
.post("forum/articles/chickCommentConlike", data)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title:'点赞成功！',
|
||||
icon:'success'
|
||||
})
|
||||
|
||||
item.contlike++
|
||||
}
|
||||
}).catch((e)=>{
|
||||
console.log(e,'e')
|
||||
})
|
||||
},
|
||||
getProDetail(){
|
||||
// 获取商品详情
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
});
|
||||
//console.log(e.id,'e.id')
|
||||
this.$http
|
||||
.post('book/book/appinfo/' + this.bookid + '/' + this.userInfo.id)
|
||||
.then(res => {
|
||||
console.log(res,'res')
|
||||
this.productInfo = res.book
|
||||
uni.hideLoading();
|
||||
}).catch((e)=>{
|
||||
console.log(e,'e')
|
||||
})
|
||||
},
|
||||
// 获得输入的表情数组
|
||||
handleEmj(i) {
|
||||
console.log(i,'i---------');
|
||||
this.inputValue = i
|
||||
// console.log(this.inputValue);
|
||||
if(i.emotioni == '[em_98]') {
|
||||
//匹配最后一个表情符号并删除11。
|
||||
this.Pform.comment = this.Pform.comment.replace(/(\[[^\]]+\]|[\s\S])$/, '');
|
||||
if(this.emoji.length > 0){
|
||||
this.emoji = this.emoji.slice(0,-1)
|
||||
}
|
||||
} else {
|
||||
this.emoji.push({'tag' : i.emotion, 'name':i.emotioni})
|
||||
// console.log(this.emoji,'this.emoji')
|
||||
this.Pform.comment += i.emotioni;
|
||||
/// this.Pform.html += i.emotion
|
||||
}
|
||||
},
|
||||
textareaBInput(e) {
|
||||
console.log(e,'e')
|
||||
this.Pform.comment = e.detail.value
|
||||
/// this.Pform.html = e.detail.value
|
||||
},
|
||||
showEmj() {
|
||||
let bool = !this.isShowEmj;
|
||||
if(bool) {
|
||||
this.emojiIcon = 'cuIcon-keyboard';
|
||||
} else {
|
||||
this.emojiIcon = 'cuIcon-emoji';
|
||||
}
|
||||
|
||||
this.isShowEmj = bool;
|
||||
this.$emit('show')
|
||||
},
|
||||
InputBlur(e){
|
||||
|
||||
},
|
||||
InputFocus(e){
|
||||
this.isShowEmj = false;
|
||||
this.emojiIcon = 'cuIcon-emoji';
|
||||
this.$emit('foc')
|
||||
},
|
||||
|
||||
// end
|
||||
deleteImg(e){
|
||||
// var arr = this.Pform.img.slice(0,-1)
|
||||
this.Pform.img.pop()
|
||||
// console.log('删除文件',arr)
|
||||
console.log(this.Pform)
|
||||
},
|
||||
getStar(i){
|
||||
this.Pform.star = i
|
||||
},
|
||||
select(e){
|
||||
console.log('选择文件：',e)
|
||||
let arr = e.tempFiles.map(item => {
|
||||
return {'url':item.url,'name':item.name}
|
||||
})
|
||||
this.Pform.img = this.Pform.img.concat(...arr)
|
||||
//this.Pform.img = arr
|
||||
console.log(this.Pform,'img')
|
||||
},
|
||||
upSuccess(e){
|
||||
console.log(e)
|
||||
},
|
||||
// 获取html格式的评论1
|
||||
getHtmlComment(comment){
|
||||
// 格式化html
|
||||
// console.log(comment,'comment')
|
||||
// 这里处理 链接 换行符
|
||||
let replacedStr = comment.replace(/\[([^(\]|\[)]*)\]/g, (item, index) => {
|
||||
// console.log(item, index)
|
||||
var indexss = emojiList1.findIndex(item1 => item1.alt === item)
|
||||
// console.log(indexss, 'indexss')
|
||||
return '<img src="https://www.nuttyreading.com/emojis/emojis/qq/' + emojiList1[indexss].url + '" width="18rpx">';
|
||||
});
|
||||
// console.log(replacedStr,'replacedStr')
|
||||
return replacedStr.replace(/(\r\n)|(\n)/g, '<br>');
|
||||
|
||||
|
||||
},
|
||||
deletePic() {
|
||||
let that = this
|
||||
that.Pform.img.splice(0, 1)
|
||||
//console.log(that.Pform.img)
|
||||
},
|
||||
afterRead(e) {
|
||||
//console.log(e)
|
||||
let that = this
|
||||
for (var i=0; i< e.file.length; i++) {
|
||||
//console.log(i,e.file[i].url)
|
||||
uni.uploadFile({
|
||||
url: this.$baseUrl + 'oss/fileoss',
|
||||
filePath: e.file[i].url,
|
||||
//files:e.file,
|
||||
name: 'file',
|
||||
formData: {},
|
||||
success: (res) => {
|
||||
that.Pform.img.push({
|
||||
url: JSON.parse(res.data).url
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
closePingjia(){
|
||||
this.pingjiaShow = false
|
||||
this.Pform.comment = ''
|
||||
this.Pform.html = ''
|
||||
this.emoji = []
|
||||
},
|
||||
// 点赞
|
||||
dianzan(val){},
|
||||
|
||||
// 放大图片
|
||||
previewImage(url) {
|
||||
console.log(url)
|
||||
uni.previewImage({
|
||||
urls: [url]
|
||||
});
|
||||
},
|
||||
// 显示评论框
|
||||
pinglun(val){
|
||||
console.log('pinglun-val', val)
|
||||
if(val && val.user && val.user.id && val.puser && val.puser.id){
|
||||
this.Pform.name = val.user.name || ''
|
||||
this.Pform.pid = val.pid
|
||||
this.Pform.puserId = val.user.id || ''
|
||||
}else if(val && val.user && val.user.id){
|
||||
this.Pform.name = val.user.name || ''
|
||||
this.Pform.pid = val.id
|
||||
this.Pform.puserId = val.user.id || ''
|
||||
}else {
|
||||
// this.pinglunId = val || null
|
||||
this.Pform.pid = ''
|
||||
this.Pform.puserId = ''
|
||||
}
|
||||
this.pingjiaShow = true
|
||||
},
|
||||
// 提交评论
|
||||
submitPJ(){
|
||||
if(this.Pform.comment != ''){
|
||||
|
||||
// let data={
|
||||
// 'content':this.Pform.comment,
|
||||
// 'userid':this.userInfo.id,
|
||||
// 'bookid':this.bookid,
|
||||
// 'bfaid' : this.bfa_id,
|
||||
// // 'id': this.pinglunId
|
||||
// }
|
||||
// console.log(data,'data')
|
||||
|
||||
|
||||
let data = {
|
||||
forumId : this.bfa_id,
|
||||
userId: this.userInfo.id,
|
||||
content: this.Pform.comment,
|
||||
pid: this.Pform.pid,
|
||||
puserId: this.Pform.puserId,
|
||||
}
|
||||
console.log(data,'提交的评论id')
|
||||
this.$http
|
||||
.post("forum/articles/pushMsgToForum", data)
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title:'评论成功！',
|
||||
icon:'success'
|
||||
})
|
||||
// this.getCommPL()
|
||||
this.pingjiaShow = false
|
||||
this.Pform.comment = ''
|
||||
this.Pform.name = ''
|
||||
this.Pform.pid = ''
|
||||
this.Pform.puserId = ''
|
||||
// this.pinglunId = null
|
||||
|
||||
// 把回复的评论拼进this.plList回复列表中
|
||||
let comment = res.comment
|
||||
// 第一种情况：1级回复
|
||||
if(comment&&comment.pid == 0){
|
||||
comment.content = this.getHtmlComment(comment.content)
|
||||
console.log('this.userInfo',this.userInfo)
|
||||
comment.user = this.userInfo
|
||||
comment.comments = []
|
||||
this.plList.unshift(comment)
|
||||
}else if(comment&&comment.pid > 0){// 第二种情况：回复第1级回复和回复第2级回复
|
||||
|
||||
for(let i=0;i<this.plList.length;i++){
|
||||
if(this.plList[i].id == comment.pid){
|
||||
|
||||
comment.content = this.getHtmlComment(comment.content)
|
||||
console.log('this.userInfo',this.userInfo)
|
||||
comment.user = this.userInfo
|
||||
comment.puser = this.plList[i].user
|
||||
// comment.comments = []
|
||||
this.plList[i].comments.push(comment)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}).catch((e)=>{
|
||||
console.log(e,'e')
|
||||
})
|
||||
|
||||
// $http.request({
|
||||
// url: "forum/comment/save",
|
||||
// method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
|
||||
// data,
|
||||
// header: { //默认 无 说明：请求头
|
||||
// 'Content-Type': 'application/json'
|
||||
// },
|
||||
// }).then(res => {
|
||||
// if (res.code == 0) {
|
||||
// uni.showToast({
|
||||
// title:'评论成功！',
|
||||
// icon:'success'
|
||||
// })
|
||||
// this.getCommPL()
|
||||
// this.pingjiaShow = false
|
||||
// this.Pform.comment = ''
|
||||
// this.pinglunId = null
|
||||
// }
|
||||
// })
|
||||
}else{
|
||||
uni.showToast({
|
||||
title:'请先输入您的评价内容 ！',
|
||||
icon:'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
components:{
|
||||
musicPlay,
|
||||
emotion
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.addPl{padding-top: 0rpx; margin-bottom: 0rpx;}
|
||||
.pinglunMain{
|
||||
.pl-item{
|
||||
margin: 0 0 14rpx 0;
|
||||
padding: 0 0 14rpx 0;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
.pl-son{
|
||||
margin: 14rpx 0 14rpx 60rpx;
|
||||
padding: 0 14rpx 14rpx 14rpx;
|
||||
background-color: #f0f0f0;
|
||||
border-radius: 10rpx;
|
||||
.pl-son-item{
|
||||
font-size: 26rpx;
|
||||
padding-top: 28rpx;
|
||||
.pl-son-item-content{
|
||||
|
||||
}
|
||||
.pl-son-atob{
|
||||
color: #a1a1a1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.plusername{
|
||||
font-size: 26rpx;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
.content{
|
||||
margin: 30rpx 0rpx;
|
||||
line-height: 40rpx;
|
||||
color: #000;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
background-color: #fff; padding: 10px;
|
||||
// h4{color: #55aa00; font-size: 40rpx; margin:30rpx 0 ; text-align: center;}
|
||||
.time{color: #888; font-size: 24rpx;}
|
||||
.btns{
|
||||
font-size: 22rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.left{
|
||||
width: 300rpx;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
.right{
|
||||
width: 300rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.gzicon{
|
||||
margin:0 0 0 20rpx;
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
// float:left;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
}
|
||||
.opbtns{
|
||||
.pingjia{margin-left: 10px;}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
// .mbtns{padding: 5px; background-color: #f4fff5; border-radius: 10px; font-size: 34rpx; color: #8b8a91; margin:15px 0; justify-content: space-between;}
|
||||
/deep/.zhengwen{
|
||||
line-height: 50rpx;
|
||||
font-size: 28rpx;
|
||||
margin-top: 20rpx;
|
||||
img{
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
.flexbox{display: flex;}
|
||||
.container{padding: 10px;}
|
||||
.star{display: inline-block; width: 20px; height: 20px; margin-right: 10rpx;}
|
||||
.starGray{ background : url(../../static/icon/star_greey.png) no-repeat; background-size: contain; }
|
||||
.starLight{ background : url(../../static/icon/star_light.png) no-repeat; background-size: contain;}
|
||||
.cuIcon-emoji {
|
||||
background : url(../../static/biaoqing.png) no-repeat; background-size: contain; display: block; margin-right: 20rpx;
|
||||
width: 30px; }
|
||||
.cuIcon-keyboard{background : url(../../static/biaoqing.png) no-repeat; background-size: contain; display: block;
|
||||
width: 30px; }
|
||||
.tanchu {
|
||||
padding: 40rpx 30rpx 40rpx 30rpx;
|
||||
position: relative;
|
||||
|
||||
|
||||
.dp_title {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 50rpx;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.dp_add {
|
||||
position: absolute;
|
||||
top: 40rpx;
|
||||
right: 30rpx;
|
||||
font-size: 22rpx;
|
||||
background-color: #fd6004;
|
||||
color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
|
||||
.u-icon {
|
||||
display: inline-block;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
}}
|
||||
|
||||
.quesheng{text-align: center; margin-top: 100rpx; color: #8b8a91; padding-bottom: 20rpx; padding-top: 20rpx;}
|
||||
// .bookInfo{justify-content: space-between; margin-bottom: 15px; background-color: #fff; padding:10px; border: 1px splid #999;
|
||||
|
||||
// view{ padding-left: 30rpx;width: calc(100% - 150rpx); box-sizing: border-box;
|
||||
// .title{font-size: 38rpx; margin-top: 20rpx; margin-bottom: 20rpx; display: block;}
|
||||
// .description{line-height: 20px; width: 100%; color:#888; padding-left: 0;}
|
||||
// text{margin-left: 10px; line-height: 20px; color: #888; padding-left: 0;}
|
||||
// }
|
||||
// image{width: 150px; height: 150px;}
|
||||
|
||||
// }
|
||||
.bookInfo{
|
||||
justify-content: space-between;
|
||||
margin-bottom: 15px;
|
||||
background-color: #fff;
|
||||
padding:10px;
|
||||
border: 1px splid #999;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
// .imageradius{
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
// }
|
||||
|
||||
// .bookInfo-inner{ padding-left: 30rpx; box-sizing: border-box; width: calc(100% - 150px);
|
||||
// .title{font-size: 32rpx; margin-top: 0rpx; margin-bottom: 20rpx;font-weight: 700; display: block;}
|
||||
// .author{font-size: 30rpx;margin-top: 0rpx;margin-bottom: 20rpx;font-weight: 500; display: block; }
|
||||
|
||||
// .description{
|
||||
// font-size: 28rpx;
|
||||
// line-height: 20px;
|
||||
// width: 100%;
|
||||
// color:#888;
|
||||
// padding-left: 0;
|
||||
// overflow:hidden;
|
||||
// text-overflow: ellipsis;
|
||||
// -webkit-line-clamp: 9;
|
||||
// display: -webkit-box;
|
||||
// -webkit-box-orient: vertical;
|
||||
// }
|
||||
// }
|
||||
// .bookinfoimage{width: 150px !important; }
|
||||
|
||||
// view{ padding-left: 30rpx; box-sizing: border-box; width: calc(100% - 150px);
|
||||
// .title{font-size: 38rpx; margin-top: 20rpx; font-weight: blod; margin-bottom: 20rpx; display: block;
|
||||
// }
|
||||
// .description{line-height: 20px; width: 100%; color:#888; padding-left: 0;}
|
||||
// }
|
||||
// image{width: 150px !important; }
|
||||
|
||||
.btns{
|
||||
font-size: 22rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.left{
|
||||
width: 300rpx;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
.right{
|
||||
width: 300rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.gzicon{
|
||||
margin:0 0 0 20rpx;
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
// float:left;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
}
|
||||
.opbtns{
|
||||
.pingjia{margin-left: 10px;}
|
||||
}
|
||||
}
|
||||
|
||||
.feng{
|
||||
// margin:10rpx 0 0 0;
|
||||
// height: 670rpx;
|
||||
// width: 670rpx;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
|
||||
margin:10rpx 20rpx 0 0;
|
||||
height: 360rpx;
|
||||
width: 280rpx;
|
||||
// float:left;
|
||||
border-radius: 20rpx;
|
||||
border:1rpx solid #e9e9e9;
|
||||
}
|
||||
.item{
|
||||
// padding: 10px;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
// .title{font-size: 38rpx; font-weight: blod; color: #55aa00; overflow: hidden;}
|
||||
.title{font-size: 32rpx; font-weight: 700; color: #000; overflow: hidden;padding-top: 20rpx;padding-bottom: 10rpx;}
|
||||
.description{
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 30rpx;
|
||||
margin-top:10rpx;
|
||||
}
|
||||
|
||||
}
|
||||
.mainContent{
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
.item{
|
||||
// padding: 10px;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.feng{
|
||||
// margin:10rpx 0 0 0;
|
||||
// height: 670rpx;
|
||||
// width: 670rpx;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
|
||||
margin:10rpx 20rpx 0 0;
|
||||
height: 160rpx;
|
||||
width: 140rpx;
|
||||
float:left;
|
||||
border-radius: 20rpx;
|
||||
border:1rpx solid #e9e9e9;
|
||||
}
|
||||
// .title{font-size: 38rpx; font-weight: blod; color: #55aa00; overflow: hidden;}
|
||||
.title{font-size: 32rpx; font-weight: 500; color: #55aa00; overflow: hidden;padding-top: 20rpx;}
|
||||
.description{
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 15px;
|
||||
margin-top:5px;
|
||||
|
||||
// overflow: hidden;
|
||||
// color: #666;
|
||||
// text-overflow: -o-ellipsis-lastline;
|
||||
// overflow: hidden;
|
||||
// text-overflow: ellipsis;
|
||||
// display: -webkit-box;
|
||||
// -webkit-line-clamp: 5;
|
||||
// line-clamp: 5;
|
||||
// -webkit-box-orient: vertical;
|
||||
// font-size: 28rpx;
|
||||
// margin-bottom: 15px;
|
||||
// margin-top:5px;
|
||||
// min-height: 186rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.mb30{margin-bottom: 30rpx; overflow: hidden;}
|
||||
</style>
|
||||
@@ -1,352 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="header">
|
||||
<!-- 顶部导航栏 -->
|
||||
<z-nav-bar title="书评列表" bgColor="red"></z-nav-bar>
|
||||
</view>
|
||||
<view class="bookInfo" v-for="(productInfo,index) in productList" :key="index">
|
||||
<view class="flexbox" style="margin-bottom: 20px;">
|
||||
<image :src="productInfo.bookimage" mode="aspectFill" class="imageradius bookinfoimage"></image>
|
||||
<view class="bookInfo-inner">
|
||||
<span class="title">{{productInfo.bookName}}</span>
|
||||
<span class="author">作者：{{productInfo.authorName}}</span>
|
||||
<view class="description">简介：{{productInfo.bookdesc}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mainContent">
|
||||
<view style="display:flex;justify-content:space-between;">
|
||||
<view style="font-weight: 700;margin:0rpx 0rpx 40rpx;font-size:32rpx;">热门书评</view>
|
||||
<view style="font-weight: 500;margin:0rpx 0rpx 20rpx;font-size:28rpx;color:#8b8a91" @click.stop="toMore(productInfo)">查看更多＞</view>
|
||||
</view>
|
||||
<view v-if="productInfo.shupingList.length > 0">
|
||||
<view class="item" @click.stop="toDetail(item)" v-for="(item,index1) in productInfo.shupingList" :key="index1">
|
||||
|
||||
<view class="title">{{item.title}}</view>
|
||||
<image class="feng" v-if="item.image" :src="item.image" mode="aspectFill"></image>
|
||||
<view class="description" v-html="item.content">
|
||||
</view>
|
||||
<!-- <image class="feng" v-if="item.image == ''" src="../../static/icon/home_bg.jpg" mode="aspectFill"></image> -->
|
||||
|
||||
<view class="btns flexbox">
|
||||
<span class="time">{{item.createTime}}</span>
|
||||
<span class="flexbox opbtns">
|
||||
</span>
|
||||
</view>
|
||||
<view style="border-bottom:2rpx solid #e9e9e9;height:50rpx;" v-if="index1<productInfo.shupingList.length-1"></view>
|
||||
</view>
|
||||
<!-- <view class="gengduoshuping" @click.stop="toMore(productInfo)">
|
||||
查看更多
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="quesheng" v-else>
|
||||
暂无书评内容~
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="status==0" style="text-align: center;">
|
||||
<u-loading-icon style="display: inline-block;"></u-loading-icon>
|
||||
<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
|
||||
</view>
|
||||
<view v-if="status==1" style="padding-bottom: 20rpx;">
|
||||
<u-divider text="全部加载完成"></u-divider>
|
||||
</view>
|
||||
|
||||
<music-play :playData="playData"></music-play>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from '@/config/requestConfig.js';
|
||||
import emotion from '@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-emojiplus.vue';
|
||||
import musicPlay from '@/components/music.vue'
|
||||
import { data } from 'jquery';
|
||||
import {
|
||||
mapState
|
||||
} from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// loadingNow : false,
|
||||
playData:{},
|
||||
emojiIcon:'cuIcon-emoji',
|
||||
windowWidth:0,
|
||||
bookid:null,
|
||||
booklistpage: 1,
|
||||
productList:[],
|
||||
productInfo:{},
|
||||
pingjiaShow:false, //添加评价
|
||||
Pform:{ // 评价表单
|
||||
star:0,
|
||||
comment:'',
|
||||
img:[],
|
||||
html:''
|
||||
},
|
||||
emoji:[],
|
||||
Files:[],
|
||||
page:1,
|
||||
pageSize:10,
|
||||
total:0,
|
||||
status:3,
|
||||
shupingList:[],
|
||||
bfaid:null,
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
console.log('下拉刷新了')
|
||||
uni.stopPullDownRefresh();
|
||||
|
||||
this.booklistpage=1, // 页码
|
||||
this.productList = []
|
||||
this.getBookList()
|
||||
|
||||
},
|
||||
onReachBottom() {
|
||||
// this.loadingNow = true
|
||||
this.booklistpage++
|
||||
this.getBookList()
|
||||
// if(this.page < this.total){
|
||||
// this.page++
|
||||
// console.log('加载',this.page)
|
||||
// this.status = 0
|
||||
// this.getBookCom()
|
||||
|
||||
// }else{
|
||||
// this.status = 1
|
||||
// console.log('加载完成了',this.page)
|
||||
// return
|
||||
// }
|
||||
},
|
||||
onLoad(e) {
|
||||
this.windowWidth = uni.getSystemInfoSync().windowWidth;
|
||||
console.log(e,'onload')
|
||||
// this.bookid = e.bookid
|
||||
this.getBookList()
|
||||
},
|
||||
computed:{
|
||||
...mapState(['userInfo']),
|
||||
},
|
||||
methods: {
|
||||
// 查看本书更多书评
|
||||
toMore(val){
|
||||
console.log(val,'val')
|
||||
uni.navigateTo({
|
||||
url: '../comments/comments?bookid='+val.bookid,
|
||||
});
|
||||
},
|
||||
// 书评详情
|
||||
toDetail(val){
|
||||
console.log(val,'val')
|
||||
uni.navigateTo({
|
||||
url:'../comments/commentsDetail?bookid='+val.bookid+'&bfa_id='+val.id
|
||||
})
|
||||
},
|
||||
getBookList(){
|
||||
// 获取商品详情
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
});
|
||||
this.$http
|
||||
.post('forum/articles/desc/' + this.booklistpage)
|
||||
.then(res => {
|
||||
let list = res.descupdatelist.list
|
||||
console.log(list,'list')
|
||||
for(let i=0; i < list.length; i++){
|
||||
let data = {
|
||||
'page': 1,
|
||||
'limit': 3,
|
||||
'bookid' : list[i].bookid
|
||||
}
|
||||
this.$http
|
||||
.post('forum/articles/descupdatelist', data)
|
||||
.then(res => {
|
||||
// this.total = res.page.totalPage
|
||||
// this.shupingList = this.shupingList.concat(res.page.list)
|
||||
list[i].shupingList = res.page.list
|
||||
console.log(res.page.list,'评论获取成功')
|
||||
|
||||
console.log(list,'list')
|
||||
this.productList.push(list[i])
|
||||
console.log(this.productList,'productList')
|
||||
// this.status = 3
|
||||
}).catch((e)=>{
|
||||
console.log(e,'e')
|
||||
})
|
||||
}
|
||||
if(list.length != 2){
|
||||
this.status = 1
|
||||
} else {
|
||||
this.status = 0
|
||||
}
|
||||
uni.hideLoading();
|
||||
}).catch((e)=>{
|
||||
console.log(e,'e')
|
||||
})
|
||||
},
|
||||
|
||||
// 显示评论
|
||||
pinglun(val){
|
||||
this.bfaid = val
|
||||
this.pingjiaShow = true
|
||||
},
|
||||
// 提交评论
|
||||
submitPJ(){
|
||||
if(this.Pform.comment != ''){
|
||||
let data={
|
||||
'content':this.Pform.comment,
|
||||
'userid':this.userInfo.id,
|
||||
'bookid':this.bookid,
|
||||
'bfaid': this.bfaid
|
||||
}
|
||||
// console.log(data,'data')
|
||||
$http.request({
|
||||
url: "forum/comment/save",
|
||||
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
|
||||
data,
|
||||
header: { //默认 无 说明：请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title:'评论成功！',
|
||||
icon:'success'
|
||||
})
|
||||
|
||||
this.pingjiaShow = false
|
||||
this.Pform.comment = ''
|
||||
this.pinglunId = null
|
||||
}
|
||||
})
|
||||
}else{
|
||||
uni.showToast({
|
||||
title:'请先输入您的评价内容 ！',
|
||||
icon:'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
components:{
|
||||
musicPlay,
|
||||
emotion
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.flexbox{display: flex;}
|
||||
.container{padding: 10px;}
|
||||
.star{display: inline-block; width: 20px; height: 20px; margin-right: 10rpx;}
|
||||
.starGray{ background : url(../../static/icon/star_greey.png) no-repeat; background-size: contain; }
|
||||
.starLight{ background : url(../../static/icon/star_light.png) no-repeat; background-size: contain;}
|
||||
.cuIcon-emoji {
|
||||
background : url(../../static/biaoqing.png) no-repeat; background-size: contain; display: block; margin-right: 20rpx;
|
||||
width: 30px; }
|
||||
.cuIcon-keyboard{background : url(../../static/biaoqing.png) no-repeat; background-size: contain; display: block;
|
||||
width: 30px; }
|
||||
.tanchu {
|
||||
padding: 40rpx 30rpx 40rpx 30rpx;
|
||||
position: relative;
|
||||
|
||||
|
||||
.dp_title {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 50rpx;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.dp_add {
|
||||
position: absolute;
|
||||
top: 40rpx;
|
||||
right: 30rpx;
|
||||
font-size: 22rpx;
|
||||
background-color: #fd6004;
|
||||
color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
|
||||
.u-icon {
|
||||
display: inline-block;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
}}
|
||||
|
||||
.quesheng{text-align: center; margin-top: 100rpx; color: #8b8a91; padding-bottom: 20rpx; padding-top: 20rpx;}
|
||||
.gengduoshuping{text-align: right; color: #0044ff; padding-bottom: 20rpx; padding-top: 20rpx;}
|
||||
.bookInfo{
|
||||
justify-content: space-between;
|
||||
margin-bottom: 15px;
|
||||
background-color: #fff;
|
||||
padding:10px;
|
||||
border: 1px splid #999;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.imageradius{
|
||||
border-radius: 20rpx;
|
||||
border:1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.bookInfo-inner{ padding-left: 30rpx; box-sizing: border-box; width: calc(100% - 150px);
|
||||
.title{font-size: 32rpx; margin-top: 0rpx; margin-bottom: 20rpx;font-weight: 700; display: block;}
|
||||
.author{font-size: 30rpx;margin-top: 0rpx;margin-bottom: 20rpx;font-weight: 500; display: block; }
|
||||
|
||||
.description{
|
||||
font-size: 28rpx;
|
||||
line-height: 20px;
|
||||
width: 100%;
|
||||
color:#888;
|
||||
padding-left: 0;
|
||||
overflow:hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 9;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
.bookinfoimage{width: 150px !important; }
|
||||
|
||||
}
|
||||
.mainContent{
|
||||
background-color: #fff;
|
||||
.item{
|
||||
// padding: 10px;
|
||||
margin-bottom: 30rpx;
|
||||
// border: 1px solid #999;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.feng{margin:10rpx 0 0 0;height: 200rpx;width: 200rpx;float:right;border-radius: 20rpx;border:1rpx solid #e9e9e9;}
|
||||
.title{font-size: 32rpx; font-weight: 500; color: #55aa00; overflow: hidden;}
|
||||
.description{
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 5;
|
||||
line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 15px;
|
||||
margin-top:5px;
|
||||
min-height: 144rpx;
|
||||
}
|
||||
.btns{
|
||||
font-size: 24rpx;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.time{font-size: 24rpx; color: #666; }
|
||||
.opbtns{
|
||||
.pingjia{margin-left: 10px;}
|
||||
}
|
||||
}
|
||||
}
|
||||
.mb30{margin-bottom: 30rpx; overflow: hidden;}
|
||||
</style>
|
||||
@@ -1,847 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- 公共组件-每个页面必须引入 -->
|
||||
<public-module></public-module>
|
||||
<view class="header">
|
||||
<!-- 顶部导航栏 -->
|
||||
<z-nav-bar title="书评列表"></z-nav-bar>
|
||||
<view class="orderTabs">
|
||||
<view v-for="(item,index) in commentsTabs" @click="commentsTabCLi(item.value)" :key="index"
|
||||
:class="commentsListTab==item.value?'orderdefine ordStyle':'orderdefine'">{{item.name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 站位 -->
|
||||
<view class="orderTabs" style="z-index:0;position:unset;">
|
||||
<view class="orderdefine">1</view>
|
||||
</view>
|
||||
<view v-if="commentsListTab == 1">
|
||||
<view v-if="newList.length > 0">
|
||||
<view class="bookInfo" v-for="(item,index) in newList" :key="index">
|
||||
<view class="mainContent">
|
||||
<view class="item" @click.stop="toDetail(item)">
|
||||
|
||||
<view class="title">{{item.title}}</view>
|
||||
<image class="feng" v-if="item.bookimage" :src="item.bookimage" mode="aspectFill"></image>
|
||||
<view class="description" v-html="item.content">
|
||||
</view>
|
||||
<view class="btns flexbox">
|
||||
<span class="left">{{item.bookname}}</span>
|
||||
<span class="right flexbox opbtns" style="color:#3c9cff;">
|
||||
全文
|
||||
</span>
|
||||
</view>
|
||||
<view class="btns flexbox" style="margin-top:10rpx;">
|
||||
<span class="left"
|
||||
style="color: #C0C4CC;">{{formatTimeDifferenceFromT(item.createTime)}}</span>
|
||||
<span class="right flexbox opbtns">
|
||||
<image class="gzicon" v-if="item.ilike" src="../../static/icon/gz2.png"
|
||||
mode="aspectFill" @click.stop="clickLike(item)"></image>
|
||||
<image class="gzicon" v-else src="../../static/icon/gz.png" mode="aspectFill"
|
||||
@click.stop="clickLike(item)"></image>
|
||||
<view style="color: #C0C4CC;">{{item.contlike}}</view>
|
||||
<image class="gzicon" v-if="1" src="../../static/icon/pinglun.png"
|
||||
mode="aspectFill"></image>
|
||||
<view style="color: #C0C4CC;">{{item.commentNum}}</view>
|
||||
</span>
|
||||
</view>
|
||||
<view style="border-bottom:2rpx solid #e9e9e9;height:50rpx;" v-if="index<item.length-1">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="quesheng" v-else>
|
||||
暂无书评内容~
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="commentsListTab == 2">
|
||||
<view v-if="hotList.length > 0">
|
||||
<view class="bookInfo" v-for="(item,index) in hotList" :key="index">
|
||||
<view class="mainContent">
|
||||
<view class="item" @click.stop="toDetail(item)">
|
||||
|
||||
<view class="title">{{item.title}}</view>
|
||||
<image class="feng" v-if="item.bookimage" :src="item.bookimage" mode="aspectFill"></image>
|
||||
<view class="description" v-html="item.content">
|
||||
</view>
|
||||
<view class="btns flexbox">
|
||||
<span class="left">{{item.bookname}}</span>
|
||||
<span class="right flexbox opbtns" style="color:#3c9cff;">
|
||||
全文
|
||||
</span>
|
||||
</view>
|
||||
<view class="btns flexbox" style="margin-top:10rpx;">
|
||||
<span class="left"
|
||||
style="color: #C0C4CC;">{{formatTimeDifferenceFromT(item.createTime)}}</span>
|
||||
<span class="right flexbox opbtns">
|
||||
<image class="gzicon" v-if="item.ilike" src="../../static/icon/gz2.png"
|
||||
mode="aspectFill" @click.stop="clickLike(item)"></image>
|
||||
<image class="gzicon" v-else src="../../static/icon/gz.png" mode="aspectFill"
|
||||
@click.stop="clickLike(item)"></image>
|
||||
<view style="color: #C0C4CC;">{{item.contlike}}</view>
|
||||
<image class="gzicon" v-if="1" src="../../static/icon/pinglun.png"
|
||||
mode="aspectFill"></image>
|
||||
<view style="color: #C0C4CC;">{{item.commentNum}}</view>
|
||||
</span>
|
||||
</view>
|
||||
<view style="border-bottom:2rpx solid #e9e9e9;height:50rpx;" v-if="index<item.length-1">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="quesheng" v-else>
|
||||
暂无书评内容~
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="commentsListTab == 3">
|
||||
<view class="" style="padding:40rpx 20rpx;">
|
||||
<view class="mytabs flexbox">
|
||||
<view :class="['item','item1', contentShow == 1 ? 'active' :'']" @click="setData(1)">
|
||||
已购图书
|
||||
</view>
|
||||
<view :class="['item','item2', contentShow == 2 ? 'active' :'']" @click="setData(2)">
|
||||
推荐图书
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="bookList.length > 0">
|
||||
<view class="bookInfo3" v-for="(item,index) in bookList" :key="index">
|
||||
<view class="mainContent3">
|
||||
<view class="item">
|
||||
<view class="btns flexbox" @click.stop="toMore(item)">
|
||||
<view class="title">{{item.name}}</view>
|
||||
<view class="pianshuping">{{item.forumNum}}篇书评</view>
|
||||
</view>
|
||||
<image class="feng" v-if="item.images" :src="item.images" mode="aspectFill"
|
||||
@click.stop="toMore(item)"></image>
|
||||
<view class="shupingList">
|
||||
<view class="description" v-for="(item1,index1) in item.forums" :key="index1"
|
||||
@click.stop="toDetail1(item1)">{{item1.title}}</view>
|
||||
</view>
|
||||
<view class="btns flexbox" @click.stop="toMore(item)">
|
||||
<span class="left"></span>
|
||||
<span class="right flexbox opbtns" style="color:#3c9cff;">
|
||||
全部
|
||||
</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="quesheng" v-else>
|
||||
暂无书评内容~
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="status==0" style="text-align: center;">
|
||||
<u-loading-icon style="display: inline-block;"></u-loading-icon>
|
||||
<font style='vertical-align: super;margin-left: 10px;font-size: 26rpx;color: #909399;'>努力加载中</font>
|
||||
</view>
|
||||
<view v-if="status==1" style="padding-bottom: 20rpx;">
|
||||
<u-divider text="全部加载完成"></u-divider>
|
||||
</view>
|
||||
|
||||
<music-play :playData="playData"></music-play>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from '@/config/requestConfig.js';
|
||||
import emotion from '@/bkhumor-emojiplus/components/bkhumor-emojiplus/bkhumor-emojiplus.vue';
|
||||
import musicPlay from '@/components/music.vue'
|
||||
import {
|
||||
data
|
||||
} from 'jquery';
|
||||
import {
|
||||
mapState,
|
||||
mapMutations
|
||||
} from 'vuex';
|
||||
import {
|
||||
checkBookRight
|
||||
} from '@/config/utils';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// loadingNow : false,
|
||||
playData: {},
|
||||
emojiIcon: 'cuIcon-emoji',
|
||||
windowWidth: 0,
|
||||
bookid: null,
|
||||
booklistpage: 1,
|
||||
productList: [],
|
||||
productInfo: {},
|
||||
pingjiaShow: false, //添加评价
|
||||
Pform: { // 评价表单
|
||||
star: 0,
|
||||
comment: '',
|
||||
img: [],
|
||||
html: ''
|
||||
},
|
||||
emoji: [],
|
||||
Files: [],
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
total: 0, // 资源的总页数1
|
||||
status: 3,
|
||||
shupingList: [],
|
||||
bfaid: null,
|
||||
commentsTabs: [{
|
||||
name: '书集',
|
||||
value: 3
|
||||
}, {
|
||||
name: '最新',
|
||||
value: 1
|
||||
}, {
|
||||
name: '最热',
|
||||
value: 2
|
||||
}],
|
||||
commentsListTab: 3,
|
||||
newestpage: 1,
|
||||
hotestpage: 1,
|
||||
booksetpage: 1,
|
||||
newList: [],
|
||||
hotList: [],
|
||||
bookList: [],
|
||||
contentShow: 1,
|
||||
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
console.log('下拉刷新了')
|
||||
uni.stopPullDownRefresh();
|
||||
|
||||
this.newestpage = 1
|
||||
this.hotestpage = 1
|
||||
this.booksetpage = 1
|
||||
this.newList = []
|
||||
this.hotList = []
|
||||
this.bookList = []
|
||||
this.total = 0
|
||||
this.getBookList(this.commentsListTab, false)
|
||||
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.newestpage + 1 <= this.total || this.hotestpage + 1 <= this.total || this.booksetpage + 1 <= this
|
||||
.total) {
|
||||
this.newestpage++
|
||||
this.hotestpage++
|
||||
this.booksetpage++
|
||||
this.getBookList(this.commentsListTab, false)
|
||||
} else {
|
||||
this.status = 1
|
||||
}
|
||||
|
||||
},
|
||||
onLoad(e) {
|
||||
this.windowWidth = uni.getSystemInfoSync().windowWidth;
|
||||
console.log(e, 'onload')
|
||||
// this.bookid = e.bookid
|
||||
this.getBookList(3, false)
|
||||
},
|
||||
computed: {
|
||||
...mapState(['userInfo']),
|
||||
},
|
||||
methods: {
|
||||
...mapMutations(['setLoadingShow']),
|
||||
setData(e) {
|
||||
this.contentShow = e
|
||||
this.getBookList(this.commentsListTab, true)
|
||||
},
|
||||
formatTimeDifferenceFromT(dateTimeT) {
|
||||
const now = new Date();
|
||||
const t = new Date(dateTimeT);
|
||||
const differenceInSeconds = Math.floor((now - t) / 1000);
|
||||
|
||||
if (differenceInSeconds <= 3600) {
|
||||
const minutes = Math.floor(differenceInSeconds / 60);
|
||||
return `${minutes} 分钟前`;
|
||||
} else if (differenceInSeconds <= 86400) {
|
||||
const hours = Math.floor(differenceInSeconds / 3600);
|
||||
return `${hours} 小时前`;
|
||||
} else if (differenceInSeconds <= 2592000) {
|
||||
const days = Math.floor(differenceInSeconds / 86400);
|
||||
return `${days} 天前`;
|
||||
} else {
|
||||
const currentYear = now.getFullYear();
|
||||
const tYear = t.getFullYear();
|
||||
if (currentYear === tYear) {
|
||||
const month = t.getMonth() + 1;
|
||||
const day = t.getDate();
|
||||
return `${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
|
||||
} else {
|
||||
const year = t.getFullYear();
|
||||
const month = t.getMonth() + 1;
|
||||
const day = t.getDate();
|
||||
return `${year}-${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 切换tab状态
|
||||
commentsTabCLi(e) {
|
||||
this.commentsListTab = e
|
||||
this.newestpage = 1
|
||||
this.hotestpage = 1
|
||||
this.booksetpage = 1
|
||||
this.total = 0
|
||||
this.newList = []
|
||||
this.hotList = []
|
||||
this.bookList = []
|
||||
this.getBookList(this.commentsListTab, false)
|
||||
},
|
||||
// 查看本书更多书评
|
||||
toMore(val) {
|
||||
// console.log(val,'val')
|
||||
let data = {
|
||||
'userId': this.userInfo.id,
|
||||
'bookId': val.id
|
||||
}
|
||||
checkBookRight(data, res => {
|
||||
console.log(res)
|
||||
if (res.success) {
|
||||
uni.navigateTo({
|
||||
url: '../comments/comments?bookid=' + val.id,
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '购买本书后方可查看此内容!',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
// 书评详情
|
||||
toDetail(val) {
|
||||
// console.log(val,'val')
|
||||
uni.navigateTo({
|
||||
url: '../comments/commentsDetail?bookid=' + val.bookid + '&bfa_id=' + val.id
|
||||
})
|
||||
},
|
||||
// 判断健全
|
||||
toDetail1(val) {
|
||||
// console.log(val,'val')
|
||||
let data = {
|
||||
'userId': this.userInfo.id,
|
||||
'bookId': val.bookid
|
||||
}
|
||||
checkBookRight(data, res => {
|
||||
console.log(res)
|
||||
if (res.success) {
|
||||
uni.navigateTo({
|
||||
url: '../comments/commentsDetail?bookid=' + val.bookid + '&bfa_id=' + val.id
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '购买本书后方可查看此内容!',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
clickLike(item) {
|
||||
this.$http
|
||||
.post("forum/articles/chickForumContlike?forum_id=" + item.id, )
|
||||
.then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title: '点赞成功！',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
item.contlike++
|
||||
}
|
||||
}).catch((e) => {
|
||||
console.log(e, 'e')
|
||||
})
|
||||
},
|
||||
getBookList(flag, tushuflag) {
|
||||
// 根据tab不同，获取最新书评、最热书评、书集列表
|
||||
// uni.showLoading({
|
||||
// title: '加载中'
|
||||
// });
|
||||
|
||||
var httpurl = ""
|
||||
if (flag == 1) {
|
||||
httpurl = "forum/articles/getForumsNew?page=" + this.newestpage + '&limit=10'
|
||||
} else if (flag == 2) {
|
||||
httpurl = "forum/articles/getForumsHot?page=" + this.hotestpage + '&limit=10'
|
||||
} else {
|
||||
if (tushuflag) { // 点击切换已购和推荐
|
||||
this.booksetpage = 1
|
||||
this.bookList = []
|
||||
}
|
||||
if (this.contentShow == 1) {
|
||||
httpurl = "forum/articles/getHasForumsAndBook?page=" + this.booksetpage + '&limit=10&userId=' +
|
||||
this.userInfo.id
|
||||
} else {
|
||||
httpurl = "forum/articles/getBestForumsAndBook?page=" + this.booksetpage + '&limit=10&userId=' +
|
||||
this.userInfo.id
|
||||
}
|
||||
}
|
||||
this.$http
|
||||
.post(httpurl)
|
||||
.then(res => {
|
||||
|
||||
if (flag == 1) {
|
||||
this.newList = this.newList.concat(res.page.records)
|
||||
} else if (flag == 2) {
|
||||
this.hotList = this.hotList.concat(res.page.records)
|
||||
} else {
|
||||
this.bookList = this.bookList.concat(res.page.records)
|
||||
}
|
||||
this.total = res.page.pages
|
||||
console.log(this.newList, 'this.newList')
|
||||
// let list = res.page.records
|
||||
// console.log(list,'list')
|
||||
// for(let i=0; i < list.length; i++){
|
||||
// let data = {
|
||||
// 'page': 1,
|
||||
// 'limit': 3,
|
||||
// 'bookid' : list[i].bookid
|
||||
// }
|
||||
// this.$http
|
||||
// .post('forum/articles/descupdatelist', data)
|
||||
// .then(res => {
|
||||
// // this.total = res.page.totalPage
|
||||
// // this.shupingList = this.shupingList.concat(res.page.list)
|
||||
// list[i].shupingList = res.page.list
|
||||
// console.log(res.page.list,'评论获取成功')
|
||||
|
||||
// console.log(list,'list')
|
||||
// this.productList.push(list[i])
|
||||
// console.log(this.productList,'productList')
|
||||
// // this.status = 3
|
||||
// }).catch((e)=>{
|
||||
// console.log(e,'e')
|
||||
// })
|
||||
// }
|
||||
// if(res.page.records.length != 10){
|
||||
// this.status = 1
|
||||
// } else {
|
||||
this.status = 0
|
||||
// }
|
||||
// uni.hideLoading();
|
||||
}).catch((e) => {
|
||||
console.log(e, 'e')
|
||||
})
|
||||
},
|
||||
|
||||
// 显示评论
|
||||
pinglun(val) {
|
||||
this.bfaid = val
|
||||
this.pingjiaShow = true
|
||||
},
|
||||
// 提交评论
|
||||
submitPJ() {
|
||||
if (this.Pform.comment != '') {
|
||||
let data = {
|
||||
'content': this.Pform.comment,
|
||||
'userid': this.userInfo.id,
|
||||
'bookid': this.bookid,
|
||||
'bfaid': this.bfaid
|
||||
}
|
||||
// console.log(data,'data')
|
||||
$http.request({
|
||||
url: "forum/comment/save",
|
||||
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
|
||||
data,
|
||||
header: { //默认 无 说明：请求头
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title: '评论成功！',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
this.pingjiaShow = false
|
||||
this.Pform.comment = ''
|
||||
this.pinglunId = null
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请先输入您的评价内容 ！',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
components: {
|
||||
musicPlay,
|
||||
emotion
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// @import '@/style/mixin.scss';
|
||||
.orderTabs {
|
||||
// margin: 70rpx 0 0 0;
|
||||
width: 100%;
|
||||
// padding: 0 3% 3% 3%;
|
||||
position: fixed;
|
||||
// top: 80rpx;
|
||||
background-color: #f7faf9;
|
||||
z-index: 100;
|
||||
|
||||
.orderdefine {
|
||||
display: inline-block;
|
||||
padding: 20rpx 0 20rpx 0;
|
||||
// margin: 40rpx 0 15rpx 0;
|
||||
width: 230rpx;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.ordStyle {
|
||||
// border-bottom: 4rpx solid #54a966;
|
||||
// color: #54a966;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.flexbox {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.star {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.starGray {
|
||||
background: url(../../static/icon/star_greey.png) no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.starLight {
|
||||
background: url(../../static/icon/star_light.png) no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.cuIcon-emoji {
|
||||
background: url(../../static/biaoqing.png) no-repeat;
|
||||
background-size: contain;
|
||||
display: block;
|
||||
margin-right: 20rpx;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.cuIcon-keyboard {
|
||||
background: url(../../static/biaoqing.png) no-repeat;
|
||||
background-size: contain;
|
||||
display: block;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.tanchu {
|
||||
padding: 40rpx 30rpx 40rpx 30rpx;
|
||||
position: relative;
|
||||
|
||||
|
||||
.dp_title {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 50rpx;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.dp_add {
|
||||
position: absolute;
|
||||
top: 40rpx;
|
||||
right: 30rpx;
|
||||
font-size: 22rpx;
|
||||
background-color: #fd6004;
|
||||
color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
|
||||
.u-icon {
|
||||
display: inline-block;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.quesheng {
|
||||
text-align: center;
|
||||
margin-top: 100rpx;
|
||||
color: #8b8a91;
|
||||
padding-bottom: 20rpx;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.gengduoshuping {
|
||||
text-align: right;
|
||||
color: #0044ff;
|
||||
padding-bottom: 20rpx;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.bookInfo {
|
||||
justify-content: space-between;
|
||||
// margin-bottom: 15px;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
border: 1px splid #999;
|
||||
box-sizing: border-box;
|
||||
// padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
// .imageradius{
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
// }
|
||||
|
||||
// .bookInfo-inner{ padding-left: 30rpx; box-sizing: border-box; width: calc(100% - 150px);
|
||||
// .title{font-size: 32rpx; margin-top: 0rpx; margin-bottom: 20rpx;font-weight: 700; display: block;}
|
||||
// .author{font-size: 30rpx;margin-top: 0rpx;margin-bottom: 20rpx;font-weight: 500; display: block; }
|
||||
|
||||
// .description{
|
||||
// font-size: 28rpx;
|
||||
// line-height: 20px;
|
||||
// width: 100%;
|
||||
// color:#888;
|
||||
// padding-left: 0;
|
||||
// overflow:hidden;
|
||||
// text-overflow: ellipsis;
|
||||
// -webkit-line-clamp: 9;
|
||||
// display: -webkit-box;
|
||||
// -webkit-box-orient: vertical;
|
||||
// }
|
||||
// }
|
||||
// .bookinfoimage{width: 150px !important; }
|
||||
|
||||
}
|
||||
|
||||
.mainContent {
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
// padding: 10px;
|
||||
// margin-bottom: 30rpx;
|
||||
// border: 1px solid #999;
|
||||
box-sizing: border-box;
|
||||
// padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
// margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.feng {
|
||||
margin: 10rpx 20rpx 0 0;
|
||||
height: 160rpx;
|
||||
width: 140rpx;
|
||||
float: left;
|
||||
border-radius: 20rpx;
|
||||
border: 1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/deep/.description {
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 5;
|
||||
line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 26rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-top: 10rpx;
|
||||
line-height: 34rpx;
|
||||
height: calc(5 * 34rpx);
|
||||
|
||||
img {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
font-size: 22rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.left {
|
||||
width: 300rpx;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 300rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gzicon {
|
||||
margin: 0 0 0 20rpx;
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
// float:left;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.opbtns {
|
||||
.pingjia {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mb30 {
|
||||
margin-bottom: 30rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bookInfo3 {
|
||||
justify-content: space-between;
|
||||
// margin-bottom: 15px;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
border: 1px splid #999;
|
||||
box-sizing: border-box;
|
||||
// padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.mainContent3 {
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
// padding: 10px;
|
||||
// margin-bottom: 30rpx;
|
||||
// border: 1px solid #999;
|
||||
box-sizing: border-box;
|
||||
// padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
// margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.feng {
|
||||
margin: 10rpx 20rpx 0 0;
|
||||
height: 240rpx;
|
||||
width: 164rpx;
|
||||
float: left;
|
||||
border-radius: 20rpx;
|
||||
border: 1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.pianshuping {
|
||||
font-size: 24rpx;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.shupingList {
|
||||
min-height: 212rpx;
|
||||
}
|
||||
|
||||
/deep/.description {
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 26rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-top: 10rpx;
|
||||
|
||||
img {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
font-size: 22rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.left {
|
||||
width: 300rpx;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 300rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gzicon {
|
||||
margin: 0 0 0 20rpx;
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
// float:left;
|
||||
// border-radius: 20rpx;
|
||||
// border:1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.opbtns {
|
||||
.pingjia {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mytabs {
|
||||
// background: url('@/static/icon/bgtushu.png') no-repeat left top;
|
||||
height: 80rpx;
|
||||
// margin-bottom: 30rpx;
|
||||
|
||||
.item {
|
||||
border-radius: 10rpx;
|
||||
background-color: #c6ead0;
|
||||
width: 48%;
|
||||
// margin: 0 10rpx;
|
||||
text-align: center;
|
||||
color: #3c7f56;
|
||||
font-size: 36rpx;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
|
||||
.item.active {
|
||||
background-color: #3c7f56;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.item1 {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,251 +0,0 @@
|
||||
<template>
|
||||
<view
|
||||
class="container commonPageBox commonDetailPage"
|
||||
style="height: auto !important; padding-bottom: 0 !important"
|
||||
>
|
||||
<u-popup :show="show" v-if="show" mode="center" class="popup_box">
|
||||
<div class="product_image" scroll-y="true" style="position: relative">
|
||||
|
||||
<swiper
|
||||
:style="{ height: fullHeight }"
|
||||
class="swiper-tall"
|
||||
:indicator-dots="indicatorDots"
|
||||
:autoplay="autoplay"
|
||||
:previous-margin="previousMargin"
|
||||
:next-margin="nextMargin"
|
||||
:circular="circular"
|
||||
@change="change"
|
||||
:current="swiperCurrentIndex"
|
||||
>
|
||||
<swiper-item
|
||||
class="swiper-container"
|
||||
v-for="(img, index) in list"
|
||||
:key="index"
|
||||
:item-id="index"
|
||||
:data-year="index"
|
||||
>
|
||||
<view
|
||||
@click="gotoDetail(img)"
|
||||
class="swiper-item"
|
||||
:style="{
|
||||
background: img ? 'url(' + img.icon + ') center no-repeat' : '',
|
||||
backgroundSize: '100% 100%',
|
||||
}"
|
||||
:animation="animationData[index]"
|
||||
>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view style="display: flex;align-items: center;justify-content: center;">
|
||||
<view @click="close" style="font-weight: bold;background-color: rgba(255, 255, 255, 0.8); color: #333;padding:20rpx 10rpx;width: 200rpx;font-size: 30rpx;border-radius: 40rpx;text-align: center;letter-spacing: 0.5rpx;">
|
||||
关闭
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</div>
|
||||
</u-popup></view
|
||||
>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const stopPenetrate = () => {
|
||||
return;
|
||||
};
|
||||
import { mapState } from "vuex";
|
||||
export default {
|
||||
props: ["list"],
|
||||
data() {
|
||||
return {
|
||||
screenHeight: 0,
|
||||
animationData: {
|
||||
0: {},
|
||||
1: {},
|
||||
2: {},
|
||||
},
|
||||
title: "0",
|
||||
indicatorDots: false,
|
||||
autoplay: false,
|
||||
previousMargin: uni.upx2px(82) + "px",
|
||||
nextMargin: uni.upx2px(82) + "px",
|
||||
circular: true,
|
||||
zoomParam: 1.1,
|
||||
swiperCurrentIndex: 0,
|
||||
data: [],
|
||||
max: 0,
|
||||
show: false,
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
this.show = false;
|
||||
},
|
||||
onLoad() {},
|
||||
onHide() {
|
||||
// this.showSearchList = false
|
||||
// this.searchList = []
|
||||
},
|
||||
computed: {
|
||||
...mapState(["userInfo"]),
|
||||
|
||||
fullHeight() {
|
||||
const res = uni.getSystemInfoSync();
|
||||
return (
|
||||
res.windowHeight - uni.upx2px(60) - (res.statusBarHeight + 44) + "px"
|
||||
);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
gotoDetail(v) {
|
||||
console.log("v at line 58:", v);
|
||||
if (v.relationId) {
|
||||
if (v.type == 0) {
|
||||
if (v.shopProduct) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/bookShop/commodityDetail?id=${v.shopProduct.productId}`,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
if (v.type == 1) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/peanut/reCharge`,
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// if (v.type == 2) {
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/mine/vip/index`,
|
||||
// });
|
||||
// }
|
||||
|
||||
this.show = false;
|
||||
},
|
||||
// 放大图片
|
||||
previewImage(url) {
|
||||
console.log(url);
|
||||
uni.previewImage({
|
||||
urls: [url],
|
||||
longPressActions: {
|
||||
itemList: ["很抱歉，暂不支持保存图片到本地"],
|
||||
success: function (res) {
|
||||
// console.log(res,'+++++')
|
||||
},
|
||||
},
|
||||
});
|
||||
},
|
||||
change(e) {
|
||||
this.swiperCurrentIndex = e.detail.current;
|
||||
this.title = e.detail.currentItemId;
|
||||
for (let key in this.animationData) {
|
||||
if (e.detail.currentItemId == key) {
|
||||
this.animation.scale(this.zoomParam).step();
|
||||
this.animationData[key] = this.animation.export();
|
||||
} else {
|
||||
this.animation.scale(1.0).step();
|
||||
this.animationData[key] = this.animation.export();
|
||||
}
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
selectGoods(data) {
|
||||
this.$emit("selectGoods", data);
|
||||
},
|
||||
open() {
|
||||
this.animation = uni.createAnimation();
|
||||
this.animation.scale(this.zoomParam).step();
|
||||
this.animationData[0] = this.animation.export();
|
||||
this.show = true;
|
||||
},
|
||||
|
||||
onHandleClickBuy() {
|
||||
this.$emit("selectGoodsData", this.selectGoodsData);
|
||||
this.$emit("onHandleClickBuy");
|
||||
},
|
||||
},
|
||||
onBackPress() {
|
||||
// #ifdef APP-PLUS
|
||||
plus.key.hideSoftKeybord();
|
||||
// #endif
|
||||
},
|
||||
|
||||
components: {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/style/mixin.scss";
|
||||
|
||||
.goods_image {
|
||||
width: 70vw;
|
||||
}
|
||||
|
||||
.popup_box {
|
||||
padding-top: 30rpx;
|
||||
|
||||
background-color: transparent;
|
||||
|
||||
.popup_content {
|
||||
padding-bottom: 140rpx;
|
||||
}
|
||||
/deep/.list_item {
|
||||
// border-bottom: none;
|
||||
|
||||
border: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.product_image {
|
||||
width: 100vw;
|
||||
|
||||
max-height: 90vh;
|
||||
}
|
||||
}
|
||||
/deep/.u-popup__content {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
/deep/.u-popup__content__close {
|
||||
color: #fff !important;
|
||||
}
|
||||
.title_box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-left: 0;
|
||||
.title_price {
|
||||
color: #ef1224;
|
||||
font-size: 40rpx;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
.swiper-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
height: 858upx;
|
||||
width: 530upx;
|
||||
line-height: 300upx;
|
||||
text-align: center;
|
||||
broder-radius: 6upx;
|
||||
margin-bottom: 50upx;
|
||||
}
|
||||
|
||||
.swiper-tall {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swiper-title {
|
||||
width: 750upx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@@ -1,287 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<view v-for="(item, index) in List" :key="index">
|
||||
<view :class="`youhuiItem ${itemClass}`">
|
||||
<view class="centerbg">
|
||||
<view class="centerView" style="position: relative"
|
||||
><text
|
||||
v-if="source == 'mine'"
|
||||
class="border_radius_10"
|
||||
style="
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
top: 10rpx;
|
||||
font-size: 25rpx;
|
||||
/* background-color: #fad4bd; */
|
||||
color: #ed2a2e;
|
||||
"
|
||||
>{{ item.couponEntity.couponRange | couponType }}</text
|
||||
>
|
||||
<view style="color: #fd4347; width: 200rpx">
|
||||
<view
|
||||
style="position: relative; border-right: 1px dashed #fa8277"
|
||||
>
|
||||
<text
|
||||
style="
|
||||
font-weight: 700;
|
||||
font-size: 40rpx;
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 0rpx;
|
||||
"
|
||||
>￥</text
|
||||
>
|
||||
<text
|
||||
style="
|
||||
font-size: 64rpx;
|
||||
letter-spacing: 0.1px;
|
||||
font-weight: 700;
|
||||
margin-left: 40rpx;
|
||||
"
|
||||
>{{ item.couponEntity.couponAmount }}</text
|
||||
>
|
||||
<text
|
||||
v-if="source == 'mine'"
|
||||
style="
|
||||
display: block;
|
||||
color: #333;
|
||||
font-size: 25rpx;
|
||||
margin-left: 0rpx;
|
||||
margin-top: 0rpx;
|
||||
"
|
||||
>满{{ item.couponEntity.useLevel }}元可用</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: calc(100% - 220rpx)">
|
||||
<view>
|
||||
<view
|
||||
style="color: #fd4347; font-size: 44rpx; font-weight: bold;"
|
||||
>{{
|
||||
item.couponEntity.couponType == 0 ? "现金" : "折扣"
|
||||
}}优惠券
|
||||
|
||||
|
||||
<!-- <text v-if="source == 'mine'" style="box-sizing: border-box;padding:4rpx 20rpx;margin-left: 10rpx;font-size: 24rpx;background-color: #fff;border-radius: 24rpx;float: right;">去使用</text> -->
|
||||
|
||||
|
||||
|
||||
|
||||
</view
|
||||
>
|
||||
|
||||
|
||||
<text
|
||||
v-if="source != 'goodsDetail'"
|
||||
style="
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
margin-top: 10rpx;
|
||||
"
|
||||
>有效期至：{{
|
||||
item.effectType == 0 ? "永久有效" : item.endTime
|
||||
}}</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bottombg">
|
||||
<view
|
||||
style="
|
||||
width: 100%;
|
||||
padding: 16rpx 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
margin-right: 6rpx;
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
text-align: center;
|
||||
"
|
||||
>
|
||||
<view
|
||||
class="title"
|
||||
style="
|
||||
line-height: 34rpx;
|
||||
margin-bottom: 10rpx;
|
||||
color: #fff;
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
"
|
||||
>
|
||||
{{ item.couponEntity.couponName }}
|
||||
</view>
|
||||
<view
|
||||
v-if="item.couponEntity.remark"
|
||||
style="
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
bottom: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
font-size: 22rpx;
|
||||
color: #fafafa;
|
||||
"
|
||||
>
|
||||
<!-- 详细信息
|
||||
<u-icon
|
||||
size="20rpx"
|
||||
color="#fafafa"
|
||||
style="color: #fafafa; float: right;margin-left: 4rpx;"
|
||||
name="arrow-down-fill"
|
||||
></u-icon> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-collapse
|
||||
v-if="source != 'goodsDetail'&&item.couponEntity.remark"
|
||||
style="
|
||||
margin-top: 0rpx;
|
||||
z-index: 10 !important;
|
||||
background-color: #fafafa;
|
||||
border-bottom-left-radius: 10rpx;
|
||||
border-bottom-right-radius: 10rpx;
|
||||
"
|
||||
:border="false"
|
||||
>
|
||||
<u-collapse-item title="详细信息" name="Docs guide">
|
||||
<view
|
||||
style="
|
||||
font-size: 22rpx;
|
||||
width: 100%;
|
||||
margin-right: 20rpx !important;
|
||||
"
|
||||
>使用说明：{{ item.couponEntity.remark }}</view
|
||||
>
|
||||
</u-collapse-item>
|
||||
</u-collapse>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from "@/config/requestConfig.js";
|
||||
import { mapState } from "vuex";
|
||||
export default {
|
||||
props: ["List", "source", "itemClass"],
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
|
||||
filters: {
|
||||
couponType(type) {
|
||||
// 0无限制 1课程卷 2课程品类卷
|
||||
var str = "";
|
||||
switch (type) {
|
||||
case 0:
|
||||
str = "全场通用";
|
||||
break;
|
||||
case 1:
|
||||
str = "指定课程可用";
|
||||
break;
|
||||
case 2:
|
||||
str = "指定课程品类可用";
|
||||
break;
|
||||
}
|
||||
return str;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState(["userInfo"]),
|
||||
},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.youhuiItem {
|
||||
min-height: 320rpx;
|
||||
position: relative;
|
||||
background: linear-gradient(to top right, #fd4c50, #fe393d);
|
||||
|
||||
border: 1px solid #d9d9d9;
|
||||
border-radius: 10rpx;
|
||||
width: 100%;
|
||||
|
||||
padding: 26rpx;
|
||||
margin: 25rpx 0 0 0;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.centerbg {
|
||||
width: 100%;
|
||||
background-image: linear-gradient(60deg, #ffefd3 0%, #f8be85 100%);
|
||||
|
||||
height: calc(100%);
|
||||
border-radius: 10rpx;
|
||||
padding-bottom: 86rpx;
|
||||
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.centerView {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
padding: 30rpx 20rpx 0 40rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.bottombg {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
background-image: url("@/static/icon/coupon/bottom.png") !important;
|
||||
}
|
||||
|
||||
.youhuiItem > view {
|
||||
}
|
||||
|
||||
.youhuiItem.youItem_style {
|
||||
border-color: #fd6004;
|
||||
}
|
||||
|
||||
::v-deep .u-cell__body {
|
||||
padding-top: 0 !important ;
|
||||
padding-bottom: 0 !important ;
|
||||
z-index: 10 !important ;
|
||||
.u-cell__title-text {
|
||||
color: #333 !important;
|
||||
font-size: 24rpx !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .u-collapse-item__content__text {
|
||||
padding: 10rpx 20rpx !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
::v-deep.itemCouponClass {
|
||||
min-height: 180rpx !important;
|
||||
.bottombg {
|
||||
.title {
|
||||
font-size: 26rpx !important;
|
||||
}
|
||||
}
|
||||
.centerbg {
|
||||
padding-bottom: 60rpx !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -201,7 +201,7 @@
|
||||
<u-back-top :scroll-top="scrollTop" bottom="60" :customStyle="bgiStyle" :iconStyle="iconStyle"></u-back-top>
|
||||
</view>
|
||||
<view class="appJump">
|
||||
<view class="soulspace item flexbox" @click="appjumpfun('soulspace')" v-if="$platform != 'ios'">
|
||||
<view class="soulspace item flexbox" @click="appjumpfun('soulspace')">
|
||||
<view class="img">
|
||||
<image src="@/static/xlkj.png"></image>
|
||||
</view>
|
||||
|
||||
@@ -31,46 +31,26 @@
|
||||
</view>
|
||||
<br clear="both" />
|
||||
</view>
|
||||
<!-- <view class="now_vip" v-if="userMes.vip==0">
|
||||
<text>
|
||||
<image src="../../static/icon/mine_p.png" style="height: 44rpx;"></image>
|
||||
开通会员畅享海量内容
|
||||
</text>
|
||||
<b class="kt_btn" @click="onPageJump('./opeVip')">开通VIP</b>
|
||||
</view> -->
|
||||
|
||||
<!-- <view class="now_vip" v-if="userMes.vip==1">
|
||||
<text>
|
||||
<image src="../../static/icon/mine_v.png"></image>
|
||||
尊贵的VIP会员
|
||||
<font style="font-size: 14rpx;margin-left: 20rpx;">{{userMes.vipValidtime}}到期</font>
|
||||
</text>
|
||||
<b class="kt_btn" @click="onPageJump('./opeVip')">立即续费</b>
|
||||
</view> -->
|
||||
|
||||
<view class="chong_zhi">
|
||||
<view class="zhanghu" @click="onPageJump('../user/persCount')">
|
||||
<!-- <view class="zhanghu" @click="onPageJump('../user/persCount')">
|
||||
我的账户
|
||||
<text style="float: right; line-height: 85rpx"> > </text>
|
||||
</view>
|
||||
<text style="float: right; line-height: 85rpx"> </text>
|
||||
</view> -->
|
||||
<view class="chong_list">
|
||||
<view >
|
||||
<view @click="onPageJump('/pages/user/persCount')">
|
||||
<b style="color: #11a669!important;">{{ userMes.peanutCoin }}</b>
|
||||
天医币
|
||||
</view>
|
||||
<view @click="onPageJump('/pages/user/points')">
|
||||
<b style="color: #11a669!important;">{{ userMes.jf }}</b>
|
||||
积分
|
||||
</view>
|
||||
<view @click="onPageJump('/pages/mine/wallet/couponList')">
|
||||
<b style="color: #fd6004 !important;">{{ userCouponNum }}</b>
|
||||
优惠券
|
||||
</view>
|
||||
|
||||
<!-- <view v-if="iosHide">
|
||||
<b>{{ userMes.conponsCount }}</b>
|
||||
优惠券
|
||||
</view> -->
|
||||
<!-- <b class="chong_btn" @click="onPageJump('../sdkDemo/pay')">充 值</b> -->
|
||||
<b class="chong_btn" v-if="platform == 'android'" @click="onPageJump('./reCharge')"
|
||||
>充 值</b
|
||||
>
|
||||
<b class="chong_btn" v-if="$platform == 'android'" @click="onPageJump('./reCharge')">充 值</b>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -78,41 +58,15 @@
|
||||
<view class="nav_list" @click="onPageJump('../bookShop/orderList')">
|
||||
<text>我的订单</text>
|
||||
</view>
|
||||
<!-- <view class="nav_list" @click="onPageJump('../clock/clockList')">
|
||||
<text>我的打卡</text>
|
||||
</view> -->
|
||||
<!-- <view class="nav_list" @click="onPageJump('../listen/home')" v-if="iosHide">
|
||||
<text>我的听书</text>
|
||||
</view> -->
|
||||
<!-- 暂时去掉 -->
|
||||
<!-- <view class="nav_list" @click="onPageJump('../listen/setListen')" v-if="iosHide">
|
||||
<text>听书设置</text>
|
||||
</view> -->
|
||||
<!-- <view class="nav_list" @click="onPageJump('../peanut/myComments')">
|
||||
<text>我的评价</text>
|
||||
</view> -->
|
||||
|
||||
<!-- 暂时去掉 -->
|
||||
<view class="nav_list" @click="onPageJump('../peanut/shopping')">
|
||||
<text>购物车</text>
|
||||
</view>
|
||||
<!-- <view v-if="showEbook" class="nav_list" @click="onPageJump('../eBook/bookBuy')">
|
||||
<text>电子书购买记录</text>
|
||||
</view> -->
|
||||
<!-- <view v-if="showEbook" class="nav_list" @click="onPageJump('../eBook/bookRecord')">
|
||||
<text>阅读记录</text>
|
||||
</view> -->
|
||||
<view class="nav_list" @click="onPageJump('../user/persData')">
|
||||
<text>修改个人资料</text>
|
||||
</view>
|
||||
<view class="nav_list" @click="onPageJump('../user/address')">
|
||||
<text>地址管理</text>
|
||||
</view>
|
||||
|
||||
<!-- <view class="nav_list" @click="onGoing()">
|
||||
<text>帮助与反馈11111</text>
|
||||
</view> -->
|
||||
<!-- <view class="nav_list" @click="newOnShare" v-if="isAndorid"> -->
|
||||
<view class="nav_list" @click="newOnShare">
|
||||
<text>分享App</text>
|
||||
</view>
|
||||
@@ -161,20 +115,13 @@ export default {
|
||||
userCouponNum: 0,
|
||||
signShow: false,
|
||||
signContent: "是否要退出登录？",
|
||||
playData: {},
|
||||
isAndorid: true,
|
||||
platform: null, // 设备系统
|
||||
playData: {}
|
||||
};
|
||||
},
|
||||
//第一次加载
|
||||
onLoad(e) {
|
||||
// 隐藏原生的tabbar
|
||||
uni.hideTabBar();
|
||||
// #ifdef APP-PLUS
|
||||
this.getOS();
|
||||
this.platform = uni.getSystemInfoSync().platform;
|
||||
console.log('操纵系统',this.platform)
|
||||
// #endif
|
||||
},
|
||||
computed: {
|
||||
...mapState(["userInfo"]),
|
||||
@@ -184,7 +131,6 @@ export default {
|
||||
// 隐藏原生的tabbar
|
||||
uni.hideTabBar();
|
||||
this.getData();
|
||||
|
||||
},
|
||||
components: {
|
||||
musicPlay,
|
||||
@@ -193,43 +139,32 @@ export default {
|
||||
methods: {
|
||||
...mapMutations(["setUserInfo"]),
|
||||
async getUserCouponList(){
|
||||
await this.$http
|
||||
.request({
|
||||
url: "common/coupon/getCouponHistoryList",
|
||||
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
|
||||
data: {
|
||||
"page":1,
|
||||
"limit":10,
|
||||
"getType":"",//获取类型 0 后台赠送 1 主动获取
|
||||
"status":"0",//使用状态 0 未使用 1 已使用 2 已过期
|
||||
"userInfo":"",//用户信息
|
||||
"userId":this.userMes.id
|
||||
},
|
||||
header: {
|
||||
//默认 无 说明：请求头
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then(async (res) => {
|
||||
if(res.code != 0) return;
|
||||
this.userCouponNum = res.couponList.total
|
||||
|
||||
}).catch(e => {
|
||||
console.log(e);
|
||||
this.$commonJS.showToast(e.errMsg);
|
||||
})
|
||||
await this.$http
|
||||
.request({
|
||||
url: "common/coupon/getCouponHistoryList",
|
||||
method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
|
||||
data: {
|
||||
"page":1,
|
||||
"limit":10,
|
||||
"getType":"",//获取类型 0 后台赠送 1 主动获取
|
||||
"status":"0",//使用状态 0 未使用 1 已使用 2 已过期
|
||||
"userInfo":"",//用户信息
|
||||
"userId":this.userMes.id
|
||||
},
|
||||
// 获得操作系统
|
||||
getOS() {
|
||||
let oprateOs = "";
|
||||
oprateOs = uni.getSystemInfoSync().platform;
|
||||
// console.log(oprateOs)
|
||||
if (oprateOs == "android") {
|
||||
this.isAndorid = true;
|
||||
} else {
|
||||
this.isAndorid = false;
|
||||
}
|
||||
},
|
||||
header: {
|
||||
//默认 无 说明：请求头
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then(async (res) => {
|
||||
if(res.code != 0) return;
|
||||
this.userCouponNum = res.couponList.total
|
||||
|
||||
}).catch(e => {
|
||||
console.log(e);
|
||||
this.$commonJS.showToast(e.errMsg);
|
||||
})
|
||||
},
|
||||
haveSelected(data) {
|
||||
console.log(data, " 选择的是");
|
||||
if (data.index == 0) {
|
||||
@@ -422,9 +357,8 @@ export default {
|
||||
|
||||
.chong_zhi {
|
||||
background-color: #fff;
|
||||
margin: 0 0 30upx 0;
|
||||
padding: 0 30upx;
|
||||
height: 240upx;
|
||||
padding: 30upx;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.zhanghu {
|
||||
font-size: 32upx;
|
||||
@@ -440,7 +374,7 @@ export default {
|
||||
color: #a3a1a1;
|
||||
|
||||
b {
|
||||
font-size: 45rpx;
|
||||
font-size: 40rpx;
|
||||
display: block;
|
||||
margin: 0 0 10rpx 0;
|
||||
color: #76757b;
|
||||
@@ -455,7 +389,7 @@ export default {
|
||||
color: #fffbf6;
|
||||
padding: 12rpx 42rpx;
|
||||
margin: 20rpx 0 0 0;
|
||||
background: #815219;
|
||||
background: #11a669;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -16,32 +16,20 @@
|
||||
: 'cj_price'
|
||||
"
|
||||
>
|
||||
<view
|
||||
class="pr_jg"
|
||||
style="display: flex; align-items: center; justify-content: center"
|
||||
>
|
||||
<image
|
||||
src="@/static/icon/currency.png"
|
||||
alt=""
|
||||
style="width: 40rpx; height: 40rpx; margin-right: 10rpx"
|
||||
/>
|
||||
{{ item.money }}
|
||||
</view>
|
||||
<view class="pr_yl" style="color: #565455"
|
||||
>￥{{ item.realMoney }}</view
|
||||
>
|
||||
<view class="pr_lj" v-if="item.description&&item.description!=''"
|
||||
> {{item.description}}</view
|
||||
>
|
||||
|
||||
<view class="pr_jg" >￥{{ item.realMoney }}</view>
|
||||
<view class="pr_yl" :style="item.givejf&&item.givejf>0?' paddingTop: 0':''">{{ item.money }}天医币<text v-if="item.givejf&&item.givejf>0">（赠{{ item.givejf }}积分）</text></view>
|
||||
<view class="pr_lj" v-if="item.description&&item.description!=''">{{item.description}}</view>
|
||||
</view>
|
||||
<br clear="both" />
|
||||
</view>
|
||||
<view
|
||||
><text style="font-size: 24rpx; color: #8e8e8e; font-weight: 500"
|
||||
>说明 : 天医币属于虚拟产品，一经购买概不退还</text
|
||||
></view
|
||||
>
|
||||
<view class="limitBlock" v-if="isAndroid">
|
||||
<text>其他金额</text>
|
||||
<input type="text" v-model="limitVal" placeholder="请输入充值金额" placeholder-class="limit-placeholder" @input="input()" />
|
||||
</view>
|
||||
<view>
|
||||
<text style="font-size: 24rpx; color: #8e8e8e;">说明 : 天医币属于虚拟产品，一经购买概不退还</text>
|
||||
</view>
|
||||
<view class="active_block" v-if="isAndroid&&activityContent.remark" v-html="activityContent.remark"></view>
|
||||
</view>
|
||||
|
||||
<view class="cha_fangsh">
|
||||
@@ -88,7 +76,7 @@
|
||||
<radio-group class="agree">
|
||||
<view v-for="(item, index) in argee" :key="index">
|
||||
<radio
|
||||
class="agreeRadio"
|
||||
class="agreeRadio" color="#fe6e09"
|
||||
:value="item.id"
|
||||
:checked="item.id == radioValue"
|
||||
@click="radioCheck(index)"
|
||||
@@ -182,6 +170,8 @@ export default {
|
||||
// 成功回调
|
||||
},
|
||||
oprateOs: "",
|
||||
limitVal: '',
|
||||
activityContent: {}
|
||||
};
|
||||
},
|
||||
//第一次加载
|
||||
@@ -190,7 +180,8 @@ export default {
|
||||
uni.hideTabBar();
|
||||
this.chargeOrderSn = e.orderSn;
|
||||
this.oprateOs = uni.getSystemInfoSync().platform;
|
||||
// console.log(e.orderSn,'orderSn')
|
||||
|
||||
this.getActivity();
|
||||
},
|
||||
//页面显示
|
||||
onShow() {
|
||||
@@ -500,7 +491,7 @@ export default {
|
||||
// 点击充值金额
|
||||
chosPric(e) {
|
||||
this.stepsCj = e;
|
||||
console.log(e);
|
||||
this.limitVal = '';
|
||||
},
|
||||
|
||||
// 选择支付方式1
|
||||
@@ -508,6 +499,29 @@ export default {
|
||||
let that = this;
|
||||
that.payType = e;
|
||||
},
|
||||
//获取活动文案
|
||||
getActivity(){
|
||||
$http.request({
|
||||
url: "common/bookBuyConfig/getRechargeActivity",
|
||||
method: "POST",
|
||||
data: {},
|
||||
header: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then((data) => {
|
||||
if(data.code==0){
|
||||
if(data.res&&data.res.length>0){
|
||||
this.activityContent = data.res[0];
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
//输入金额
|
||||
input(val){
|
||||
this.stepsCj = {};
|
||||
},
|
||||
|
||||
//ios充值
|
||||
iosPay() {
|
||||
this.iphonepay();
|
||||
@@ -518,6 +532,31 @@ export default {
|
||||
},
|
||||
// 正常充值
|
||||
kaiChar() {
|
||||
if(!this.stepsCj.priceTypeId&&!this.limitVal){
|
||||
uni.showToast({
|
||||
title: "请选择充值商品",
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
const regex = /^[1-9]\d*$/;
|
||||
//如果输入其他金额
|
||||
if(this.limitVal){
|
||||
if(!regex.test(this.limitVal)){
|
||||
uni.showToast({
|
||||
title: "充值金额必须为正整数",
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
//设置充值金额和id
|
||||
this.stepsCj = {
|
||||
money: this.limitVal,
|
||||
priceTypeId: 0
|
||||
}
|
||||
}
|
||||
|
||||
// 常规充值
|
||||
if (this.radioValue == "1") {
|
||||
uni.showLoading({
|
||||
@@ -781,43 +820,56 @@ export default {
|
||||
margin-top: 40rpx;
|
||||
|
||||
.cj_price {
|
||||
border: 4rpx solid #ebebeb;
|
||||
// box-shadow: 0 0 20rpx 0 #0000001a;
|
||||
box-shadow: 0 0 20rpx 0 #0000001a;
|
||||
float: left;
|
||||
width: 31%;
|
||||
margin: 0 3% 30rpx 0;
|
||||
width: 47%;
|
||||
margin: 0 5% 30rpx 0;
|
||||
text-align: center;
|
||||
padding: 25rpx 0 30rpx 0;
|
||||
padding: 30rpx 0 0;
|
||||
border-radius: 15rpx;
|
||||
position: relative;
|
||||
color: #2d2d2d;
|
||||
height: 160rpx;
|
||||
line-height: 44rpx;
|
||||
|
||||
.pr_jg {
|
||||
font-size: 38rpx;
|
||||
margin: 0rpx 0 10rpx 0;
|
||||
font-size: 45rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pr_yl {
|
||||
font-size: 28rpx;
|
||||
// text-decoration: line-through;
|
||||
color: #8d8f8e;
|
||||
padding-top: 10rpx;
|
||||
font-size: 26rpx;
|
||||
color: #575555;
|
||||
|
||||
text{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
line-height: 40rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 10rpx;
|
||||
color: red;
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.pr_lj {
|
||||
background-image: linear-gradient(90deg, #fe6e09 0%, #efa574 100%);
|
||||
background-image: linear-gradient(180deg, #fe6e09 0%, #efa574 100%);
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: -22rpx;
|
||||
right: -22rpx;
|
||||
font-size: 24rpx;
|
||||
padding: 5rpx 4rpx;
|
||||
line-height: 20px;
|
||||
padding: 5rpx 10rpx;
|
||||
border-top-left-radius: 20rpx;
|
||||
border-bottom-right-radius: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.cj_price:nth-child(3n) {
|
||||
.cj_price:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
@@ -835,7 +887,7 @@ export default {
|
||||
}
|
||||
|
||||
.highlight {
|
||||
color: $uni-color-primary;
|
||||
color: #fe6e09;
|
||||
}
|
||||
|
||||
.cha_fangsh {
|
||||
@@ -863,10 +915,6 @@ export default {
|
||||
vertical-align: bottom;
|
||||
}
|
||||
}
|
||||
|
||||
.Tab_xf {
|
||||
background-color: #fdf1e9cc;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -879,10 +927,12 @@ export default {
|
||||
}
|
||||
|
||||
.char_btn {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 30rpx;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
padding: 20rpx 0;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
||||
view {
|
||||
background-image: linear-gradient(90deg, #ed7161 0%, #efa574 100%);
|
||||
@@ -890,10 +940,67 @@ export default {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
padding: 25rpx 0;
|
||||
font-size: 30rpx;
|
||||
padding: 20rpx 0;
|
||||
border-radius: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.limitBlock{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
text{
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
input{
|
||||
display: inline-block;
|
||||
margin-left: 20rpx;
|
||||
width: 300rpx;
|
||||
height: 70rpx;
|
||||
border: 1rpx solid #ededed;
|
||||
border-radius: 10rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
.limit-placeholder{
|
||||
font-size: 25rpx;
|
||||
color: #8b8c90 !important;
|
||||
}
|
||||
|
||||
.active_block{
|
||||
width: 100%;
|
||||
background-color: rgba(238, 147, 109, 0.2);
|
||||
border-radius: 10rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 42rpx;
|
||||
margin-top: 15rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/deep/.active_block span{
|
||||
color: red;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
padding: 0 5rpx;
|
||||
}
|
||||
/deep/.active_block span:first-child{
|
||||
padding: 0 5rpx 0 0;
|
||||
}
|
||||
/deep/.active_block p{
|
||||
padding-top: 10rpx;
|
||||
color: #666;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
/deep/.active_block p span{
|
||||
padding: 0 5rpx !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -3,41 +3,53 @@
|
||||
<!-- 公共组件-每个页面必须引入 -->
|
||||
<public-module></public-module>
|
||||
<z-nav-bar title="我的账户"></z-nav-bar>
|
||||
<u-alert
|
||||
type="warning"
|
||||
size="20rpx"
|
||||
:title="goBuyTitle"
|
||||
:show-icon="true"
|
||||
>
|
||||
</u-alert>
|
||||
<view class="ACTable">
|
||||
<u-tabs :list="tab_list" @click="tab_click" lineColor="#54a966 100% 100%"
|
||||
<!-- <u-tabs :list="tab_list" @click="tab_click" lineColor="#54a966 100% 100%"
|
||||
:activeStyle="{color: '#303133',fontWeight: 'bold',transform: 'scale(1.1)'}" v-if="iosHide"></u-tabs>
|
||||
|
||||
<u-tabs :list="tab_list_ios" @click="tab_click" lineColor="#54a966 100% 100%"
|
||||
:activeStyle="{color: '#303133',fontWeight: 'bold',transform: 'scale(1.1)'}" v-if="!iosHide"></u-tabs>
|
||||
:activeStyle="{color: '#303133',fontWeight: 'bold',transform: 'scale(1.1)'}" v-if="!iosHide"></u-tabs> -->
|
||||
<view>
|
||||
<view
|
||||
class="AC_chong"
|
||||
@click="onPageJump('/pages/peanut/reCharge')"
|
||||
>立即充值
|
||||
<u-icon
|
||||
name="arrow-right"
|
||||
color="#fff"
|
||||
size="16"
|
||||
class="rightArrow"
|
||||
></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="tab_muJian==0">
|
||||
<view class="AC_mes">
|
||||
<view style="font-size: 50rpx;font-weight: bold;">{{userMes.peanutCoin}}</view>
|
||||
<view style="color: #888;font-size: 30rpx;margin-top: 10rpx;">天医币</view>
|
||||
|
||||
<text v-if="platform != 'ios'" class="AC_chong" @click="buPoint()">充值</text>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="AC_con">
|
||||
<view class="AC_jilu">充值记录</view>
|
||||
<view class="AC_jilu PM_font">充值消费记录</view>
|
||||
<view v-for="(item,index) in MoneyRecord" class="AC_List">
|
||||
<view class="AC_title">
|
||||
{{item.orderType}}
|
||||
<view>
|
||||
<text v-if="item.changeAmount>0">+</text>
|
||||
<text>{{item.changeAmount}}</text>
|
||||
天医币
|
||||
</view>
|
||||
</view>
|
||||
<view class="AC_mark">{{item.remark}}</view>
|
||||
<view class="AC_mark" v-if="item.remark">{{item.remark}}</view>
|
||||
<view class="AC_note" v-if="item.note&&item.note!='null'">说明：{{item.note}}</view>
|
||||
<view class="AC_time">{{item.createTime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="tab_muJian==1">
|
||||
<view class="couponList">
|
||||
<view v-for="(item,index) in couponTabs" @click="couponTabCLi(index)"
|
||||
<view v-for="(item,index) in couponTabs"
|
||||
:class="couponListTab==index?'couStyle':''">{{item.name}}</view>
|
||||
</view>
|
||||
<view>
|
||||
@@ -117,6 +129,7 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
goBuyTitle:'【天医币】仅为我平台支付使用币种 。一人民币=一天医币，仅为了方便用户支付使用。【天医币】可以用于在我平台支付书籍或课程使用。【天医币】这个名称是为适应我们平台的定位属性，所起名称。与区块链虚拟货币无任何关系。',
|
||||
playData: {},
|
||||
platform: null,
|
||||
tab_list: [{
|
||||
@@ -196,10 +209,7 @@
|
||||
onLoad(e) {
|
||||
// 隐藏原生的tabbar
|
||||
uni.hideTabBar();
|
||||
// #ifdef APP-PLUS
|
||||
this.platform = uni.getSystemInfoSync().platform
|
||||
console.log('操纵系统', this.platform)
|
||||
// #endif
|
||||
},
|
||||
computed: {
|
||||
...mapState(['userInfo'])
|
||||
@@ -209,8 +219,6 @@
|
||||
// 隐藏原生的tabbar
|
||||
uni.hideTabBar();
|
||||
this.getData();
|
||||
this.getCourpe();
|
||||
|
||||
},
|
||||
components: {
|
||||
musicPlay
|
||||
@@ -222,6 +230,9 @@
|
||||
if(!this.iosHide){
|
||||
this.tab_muJian=1
|
||||
}
|
||||
var data = {
|
||||
userId: this.userInfo.id,
|
||||
};
|
||||
// 用户详情
|
||||
if (this.userInfo.id != undefined) {
|
||||
this.$http
|
||||
@@ -230,45 +241,29 @@
|
||||
this.userMes = res.user
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
})
|
||||
// 充值记录
|
||||
this.$http
|
||||
.post('book/transactiondetails/list?userId=' + this.userInfo.id + '&page=' + this.RecordScreen
|
||||
.page + '&limit=' + this.RecordScreen.limit)
|
||||
.then(res => {
|
||||
this.MoneyRecord = res.page.list
|
||||
this.totalPage = res.page.totalPage
|
||||
this.totalCount = res.page.totalCount
|
||||
});
|
||||
|
||||
$http
|
||||
.request({
|
||||
url: 'common/transactionDetails/getTransactionDetailsList',
|
||||
method: "POST",
|
||||
data,
|
||||
header: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
uni.hideLoading();
|
||||
this.MoneyRecord = res.transactionDetailsList;
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 点击tab
|
||||
tab_click(e) {
|
||||
this.tab_muJian = e.index
|
||||
},
|
||||
|
||||
// 优惠券
|
||||
// getCourpe() {
|
||||
// this.$http
|
||||
// .post('/book/couponhistory/appGetUserCenterCoupon?userId=' + this.userInfo.id + '&useStatus=' + this
|
||||
// .couponListTab)
|
||||
// .then(res => {
|
||||
// // this.cardList = res.couponVos
|
||||
// this.cardList = res.couponVos
|
||||
// });
|
||||
// },
|
||||
// 切换优惠券
|
||||
couponTabCLi(e) {
|
||||
// this.couponListTab = e
|
||||
// this.getCourpe()
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 充值天医币
|
||||
buPoint() {
|
||||
uni.navigateTo({
|
||||
@@ -314,8 +309,7 @@
|
||||
}
|
||||
|
||||
.AC_con {
|
||||
margin-top: 50rpx;
|
||||
padding: 30rpx 30rpx;
|
||||
padding: 20rpx;
|
||||
box-shadow: 0 0px 10px 1px #d3d1d133;
|
||||
background-color: #fff;
|
||||
border-radius: 15rpx;
|
||||
@@ -323,20 +317,17 @@
|
||||
font-size: 30rpx;
|
||||
|
||||
.AC_jilu {
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
|
||||
font-size: 42rpx;
|
||||
text-align: left;
|
||||
color: $themeColor;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.AC_List {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 40rpx 10rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.AC_title {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
view {
|
||||
float: right;
|
||||
@@ -346,14 +337,21 @@
|
||||
}
|
||||
|
||||
.AC_mark {
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 15rpx;
|
||||
color: #888;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 15rpx;
|
||||
color: #888;
|
||||
display: inline-block;
|
||||
}
|
||||
.AC_note {
|
||||
color: #888;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.AC_time {
|
||||
color: #bababa;
|
||||
font-size: 25rpx;
|
||||
font-size: 26rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -569,10 +567,28 @@
|
||||
background: #c6c6c6;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
/deep/.u-alert__content__title{
|
||||
font-size: 24rpx !important;
|
||||
line-height: 28rpx !important;
|
||||
}
|
||||
.AC_chong {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-image: linear-gradient(90deg, #54a966 0%, #a3d7ae 100%);
|
||||
color: #fff;
|
||||
border-top-left-radius: 15rpx;
|
||||
border-top-right-radius: 15rpx;
|
||||
padding: 20rpx 20rpx;
|
||||
font-size: 36rpx;
|
||||
font-weight: 800;
|
||||
text-align: right;
|
||||
}
|
||||
.rightArrow {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
float: right;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
</style>
|
||||
429
pages/user/points.vue
Normal file
429
pages/user/points.vue
Normal file
@@ -0,0 +1,429 @@
|
||||
<template>
|
||||
<view class="commonPageBox">
|
||||
<z-nav-bar title="我的积分"> </z-nav-bar>
|
||||
<view class="ACTable"><view>
|
||||
<view class="AC_con">
|
||||
<common-list
|
||||
:dataList="MoneyRecord"
|
||||
isCondition="true"
|
||||
isNoIcon="true"
|
||||
label="orderType"
|
||||
>
|
||||
<template slot="labelSlot" slot-scope="slotProps">
|
||||
<view class="label_content AC_List" @click="slotProps.row.relationId?goClick(slotProps.row.relationId):''">
|
||||
<view class="point_box">
|
||||
<view class="title"><view class="AC_time">{{slotProps.row.createTime}}</view></view>
|
||||
|
||||
<view class="Hot">
|
||||
<text v-if="slotProps.row.changeAmount > 0">+</text>
|
||||
<text>{{slotProps.row.changeAmount}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="AC_mark" v-if="slotProps.row.remark">{{slotProps.row.remark}}</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
</common-list>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="padding-bottom: 20rpx">
|
||||
<u-back-top
|
||||
:scroll-top="scrollTop"
|
||||
bottom="60"
|
||||
:customStyle="bgiStyle"
|
||||
:iconStyle="iconStyle"
|
||||
>
|
||||
</u-back-top>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import $http from "@/config/requestConfig.js";
|
||||
import { mapState } from "vuex";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
playData: {},
|
||||
platform: null,
|
||||
urlList: {
|
||||
list: "common/jfTransactionDetails/getJfTransactionDetailsList",
|
||||
},
|
||||
cardList: [],
|
||||
couponListTab: 0,
|
||||
MoneyRecord: [],
|
||||
userMes: {},
|
||||
RecordScreen: {
|
||||
userid: "",
|
||||
page: 1,
|
||||
limit: 5,
|
||||
},
|
||||
scrollTop: 0,
|
||||
status: 3,
|
||||
totalPage: 0,
|
||||
totalCount: 0,
|
||||
tab_muJian: 0,
|
||||
bgiStyle: {
|
||||
background: "#bbe5d8",
|
||||
},
|
||||
iconStyle: {
|
||||
fontSize: "40rpx",
|
||||
fontWeight: "bold",
|
||||
color: "#54a966",
|
||||
},
|
||||
};
|
||||
},
|
||||
// 返回顶部
|
||||
onPageScroll(e) {
|
||||
this.scrollTop = e.scrollTop;
|
||||
},
|
||||
//第一次加载
|
||||
onLoad(e) {
|
||||
|
||||
},
|
||||
computed: {
|
||||
...mapState(["userInfo"]),
|
||||
},
|
||||
//页面显示
|
||||
onShow() {
|
||||
this.getData();
|
||||
},
|
||||
//方法
|
||||
methods: {
|
||||
//列表进入详情
|
||||
goClick(id){
|
||||
uni.navigateTo({
|
||||
url: "/pages/detail/orderLCont?orderId=" + id
|
||||
});
|
||||
},
|
||||
//获取数据
|
||||
getData() {
|
||||
var data = {
|
||||
userId: this.userInfo.id,
|
||||
};
|
||||
if (!this.iosHide) {
|
||||
this.tab_muJian = 1;
|
||||
}
|
||||
//用户详情
|
||||
if (this.userInfo.id != undefined) {
|
||||
this.$http.post("book/user/info/" + this.userInfo.id).then((res) => {
|
||||
this.userMes = res.user;
|
||||
});
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
})
|
||||
$http.request({
|
||||
url: this.urlList.list,
|
||||
method: "POST",
|
||||
data,
|
||||
header: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
uni.hideLoading();
|
||||
this.MoneyRecord = res.transactionDetailsList;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.ACTable {
|
||||
padding: 20rpx;
|
||||
|
||||
.AC_mes {
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
padding: 40rpx 20rpx;
|
||||
box-shadow: 0 0px 10px 1px #d3d1d133;
|
||||
border-radius: 15rpx;
|
||||
margin-bottom: 10rpx;
|
||||
position: relative;
|
||||
|
||||
.wallet_title {
|
||||
color: #333;
|
||||
font-size: 40rpx;
|
||||
line-height: 60rpx;
|
||||
font-weight: 500 !important;
|
||||
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.wallet_number {
|
||||
color: #333;
|
||||
font-size: 80rpx;
|
||||
line-height: 80rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.AC_con {
|
||||
overflow: hidden;
|
||||
border-radius: 15rpx;
|
||||
font-size: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
|
||||
.AC_jilu {
|
||||
font-size: 42rpx;
|
||||
text-align: left;
|
||||
color: #3d75bf;
|
||||
padding: 10rpx 20rpx 40rpx;
|
||||
}
|
||||
/deep/.list_item {
|
||||
background-color: rgba(255, 255, 255, 0.85) !important;
|
||||
box-shadow: 0 0px 10px 1px #d3d1d133 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.couponList {
|
||||
view {
|
||||
display: inline-block;
|
||||
padding: 0 0 25rpx 0;
|
||||
margin: 40rpx 0 40rpx 0;
|
||||
width: 33%;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.couStyle {
|
||||
border-bottom: 5rpx solid #54a966;
|
||||
color: #54a966;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
margin-bottom: 30rpx;
|
||||
padding-left: 10rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.card > view {
|
||||
background: #fff;
|
||||
border-radius: 5rpx;
|
||||
}
|
||||
|
||||
.card .dot-left,
|
||||
.card .dot-right {
|
||||
display: block;
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
border-radius: 50%;
|
||||
background: #f5f5f5;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.card .dot-left {
|
||||
bottom: -6rpx;
|
||||
left: -6rpx;
|
||||
}
|
||||
|
||||
.card .dot-right {
|
||||
bottom: -6rpx;
|
||||
right: -6rpx;
|
||||
}
|
||||
|
||||
.card .page-group {
|
||||
position: absolute;
|
||||
top: 10rpx;
|
||||
left: -2rpx;
|
||||
width: 100%;
|
||||
max-width: 200rpx;
|
||||
|
||||
.fold-page {
|
||||
display: block;
|
||||
width: 10rpx;
|
||||
height: 8rpx;
|
||||
background: #54a966;
|
||||
transform: skewY(-40deg);
|
||||
position: absolute;
|
||||
top: -5rpx;
|
||||
left: -8rpx;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.page {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
display: block;
|
||||
padding: 5rpx 20rpx 3rpx 20rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
background: linear-gradient(137deg, #54a966 0%, #0d5e1e 100%);
|
||||
border-radius: 0 20rpx 20rpx 0;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
overflow: hidden;
|
||||
left: -8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.card .page-group.grey {
|
||||
.fold-page {
|
||||
background: #c6c6c6;
|
||||
}
|
||||
|
||||
.page {
|
||||
background: linear-gradient(137deg, #c6c6c6 0%, #999595 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.card .content {
|
||||
width: 100%;
|
||||
height: 180rpx;
|
||||
border-bottom: 1rpx dotted #f5f5f5;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail {
|
||||
display: flex;
|
||||
padding: 0 15rpx 0 20rpx;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail > view {
|
||||
height: 130rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail > view:first-child {
|
||||
color: #54a966;
|
||||
padding-top: 100rpx;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail > view.grey {
|
||||
color: #c6c6c6;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail > view:first-child > span:first-child {
|
||||
font-size: 30rpx;
|
||||
margin: 0 10rpx 0 0;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail > view:first-child > span:last-child {
|
||||
font-size: 70rpx;
|
||||
}
|
||||
|
||||
.card .content .coupon-detail > view:last-child > view {
|
||||
color: #54a966;
|
||||
border: 1rpx solid #54a966;
|
||||
border-radius: 50rpx;
|
||||
font-size: 12px;
|
||||
line-height: 25px;
|
||||
width: 150rpx;
|
||||
height: 50rpx;
|
||||
margin: 100rpx 0 0 5rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card .coupon-detail > view:nth-child(2) {
|
||||
flex-direction: column;
|
||||
padding-top: 60rpx;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.card .coupon-detail > view:nth-child(2) > view {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card .coupon-detail > view:nth-child(2) > view:first-child {
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
font-size: 25rpx;
|
||||
margin: 0 0 10rpx 0;
|
||||
}
|
||||
|
||||
.card .coupon-detail > view:nth-child(2) > view:last-child {
|
||||
font-size: 12px;
|
||||
color: #adadad;
|
||||
margin-top: 5rpx;
|
||||
}
|
||||
|
||||
.card .coupon-detail > view:nth-child(2) > view:last-child > view {
|
||||
transform: scale(0.8);
|
||||
margin-left: -14rpx;
|
||||
}
|
||||
|
||||
.card {
|
||||
.footer {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
padding: 30rpx 15rpx 30rpx 30rpx;
|
||||
}
|
||||
|
||||
.ribbon {
|
||||
width: 160rpx;
|
||||
height: 40rpx;
|
||||
background: #54a966;
|
||||
position: absolute;
|
||||
right: -40rpx;
|
||||
top: 25rpx;
|
||||
transform: rotateZ(45deg);
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 20rpx;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.ribbon.grey {
|
||||
background: #c6c6c6;
|
||||
}
|
||||
}
|
||||
}
|
||||
.Hot {
|
||||
color: #333 !important;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.AC_chong {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-image: linear-gradient(90deg, #258feb 0%, #73ee9c 100%);
|
||||
color: #fff;
|
||||
border-top-left-radius: 15rpx;
|
||||
border-top-right-radius: 15rpx;
|
||||
padding: 20rpx 20rpx;
|
||||
font-size: 36rpx;
|
||||
font-weight: 800;
|
||||
text-align: right;
|
||||
}
|
||||
.rightArrow {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
float: right;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.point_box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
.title{
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.AC_mark {
|
||||
width: 100%;
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #343434;
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
|
||||
.AC_time {
|
||||
color: #909090;
|
||||
font-size: 28rpx;
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -27,6 +27,9 @@ button {
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
.PM_font {
|
||||
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
|
||||
}
|
||||
// 主题背景色
|
||||
.themeBgColor {
|
||||
background-color: $themeColor;
|
||||
|
||||
Reference in New Issue
Block a user