You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

383 lines
8.2 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="page">
<view class="acon">
<view class="atitle">{{name}}</view>
<view class="aother">
<view class="txtpre">作者{{author}}</view>
<uni-icons type="eye" color="#868c99" size="18"></uni-icons>
<view class="txt">{{num}}</view>
<uni-icons type="calendar" color="#868c99" size="18"></uni-icons>
<view class="txt">{{date}}</view>
</view>
<view class="aimg limg imgload">
<image v-if="image" :src="image" style="width: 100%;" mode="aspectFill" @click="ViewImage(image)" ></image>
</view>
<view class="acontent">
<mp-html :content="html" :markdown="true" :lazy-load="true"/>
</view>
</view>
<!-- 是否登录 -->
<openlogin ref="loginId" @getPhoneNumber="getPhoneNumber"></openlogin>
<!-- service 客服-->
<service ref="serviceId" @goservice="goservice"></service>
<!-- top 返回顶部-->
<top ref="topId"></top>
</view>
</template>
<script>
import { myCache,getRemoteFile,getRemoteHtmlFile } from '../../utils/utils.js';
import openlogin from "../components/openlogin.vue";
import top from "../components/top.vue";
import service from "../components/service.vue";
export default {
components: {
openlogin,top,service
},
data() {
return {
openId:"",
phone:"",
userid:"",
title:"",
image:'',
html:``,
// `基础课、进修提升课、私教课<br>
// 资深课程导师<br>
// 国内知名大学专业毕业<br>
// 系统的学习与研究,顺利通过了所授课程的等级证书考核<br>
// 有丰富的授课教学经验,熟悉各种课程体系,性格活泼开朗,具有很强的亲和力<br>
// 能及时发现学员的特点和学习问题,从根本上解决学员在学习中遇到的问题,是一位深受学员喜爱和信任的好老师!<br>
// 多年来培养帮助了许多人获得提升改善,细致认真,温和,讲解详细到位,确保学员在健康安全的气氛中练习!<br>
// 个人名言:“教学的艺术不在于传授本领,而在善于激励唤醒和鼓舞。”`,
id:'',
name:'',
num:'',
author:'yoga',
date:''
};
},
onLoad(options) {
if(options.type){
this.type=options.type;
}
if(options.data){
var info=JSON.parse(decodeURIComponent(options.data));
this.id= info.id;
this.name= info.title;
this.num= info.readNum;
this.date= info.modifyTime;
this.title= info.name;
this.html= info.content;
this.image=info.image?info.image:'';
console.log(this.image)
this.loadinfo();
}
else{
uni.showModal({
title: '提示',
content: '当前信息不存在..',
cancelText: '取消',
confirmText: '确定',
success: ress => {
// 返回
uni.navigateBack({
delta: 1
});
}
});
}
},
onReady(){
uni.setNavigationBarTitle({
title: this.title,
});
},
onShow() {
this.openId = myCache('openId');
this.phone = myCache('phone');
this.userid = myCache('userid');
},
onPullDownRefresh() {
setTimeout(()=>{
uni.stopPullDownRefresh()
},500);
},
onPageScroll(e) {
//调用子组件方法
this.$refs.topId.topData(e.scrollTop);
},
methods: {
goservice(val){
console.log(val);
},
iflogin(){
this.openId = myCache('openId');
this.phone = myCache('phone');
this.userid = myCache('userid');
if(this.userid==""||this.userid=="0"){
this.$refs.loginId.open();
return false;
}
else{
return true;
}
},
ViewImage(img) {
var imgList=[img];
uni.previewImage({
urls: imgList,
current:0
});
},
async loadinfo(){
// 详情
uni.showLoading({
title: '数据加载中...'
});
var params = {
id: this.id
};
try{
var url="/api/inherit/getOne";
if(this.type==0){
// 瑜伽传承
url="/api/inherit/getOne";
}
else if(this.type==3){
// 练习瞬间
url="/api/moments/getOne";
}
else if(this.type==4){
// 瑜伽欣赏
url="/api/appreciate/getOne";
}
else if(this.type==5){
// 瑜伽常识
url="/api/sense/getOne";
}
else if(this.type==6){
// 健康饮食
url="/api/healthy/getOne";
}
const {data: res1} = await uni.$http.post(url,params);
console.log(res1);
if (res1.success) {
if(!res1.data){
uni.showModal({
title: '提示',
content: '当前信息获取异常,请返回..',
cancelText: '取消',
confirmText: '确定',
success: ress => {
// 返回
uni.navigateBack({
delta: 1
});
}
});
return false;
}
var info=res1.data;
this.name= info.title;
this.num= info.readNum;
this.date= info.modifyTime;
this.title= info.title;
this.html= info.content;
this.image=info.image?info.image:'';
console.log(this.image)
this.$forceUpdate();
}
else{
uni.showModal({
title: '提示',
content: '当前信息不存在..',
cancelText: '取消',
confirmText: '确定',
success: ress => {
// 返回
uni.navigateBack({
delta: 1
});
}
});
}
}
catch(e){
console.log(e)
uni.showModal({
title: '提示',
content: '当前信息不存在..',
cancelText: '取消',
confirmText: '确定',
success: ress => {
// 返回
uni.navigateBack({
delta: 1
});
}
});
}
},
gotoBack(){
// 返回
uni.navigateBack({
delta: 1
});
},
gotoHome(){
// 跳转 首页
uni.switchTab({
url: '/pages/index/index'
});
},
getPhoneNumber(e){
if(e.phone){
this.phone = e.phone
}
if(e.userid){
this.userid = e.userid
}
},
// 获取状态栏高度
geStatusBarHeight(){
return uni.getSystemInfoSync()['statusBarHeight'];
},
// 获取导航栏高度
getNavBarHeight(){
return 45+uni.getSystemInfoSync()['statusBarHeight'];
},
}
}
</script>
<style lang="less" scoped>
.page {
padding: 0;
position: relative;
background-image: url('@/static/image/bg.jpg');
background-attachment: fixed;
background-size: cover;
background-position: center center;
min-height: 100vh;
}
.fixhead{
position: fixed;
top:20rpx;
left:20rpx;
z-index: 999;
display: flex;
flex-direction: row;
width: 100%;
align-items: center;
.leftarr{
background-color: #b9af9d;
padding: 10rpx;
border-radius: 10rpx;
}
.htitle{
font-size: 32rpx;
color:#000;
display: flex;
flex: 1;
align-items: center;
justify-content: center;
}
}
.acon{
display:flex;
flex-direction: column;
.atop{
display:flex;
flex-direction: row;
margin: 0;
align-items: center;
image{
flex-shrink: 0;
width: 100%;
height: 360rpx;
}
}
.atitle{
width: 100%;
padding: 30rpx 30rpx 0 30rpx;
font-size: 36rpx;
color: #000;
}
.aimg{
padding: 30rpx 30rpx 0 30rpx;
width: 100%;
}
.acontent{
background-color: rgba(255, 255,255, 0.5);
border-radius: 20rpx;
margin: 30rpx 30rpx 0;
padding: 30rpx 30rpx;
font-size: 28rpx;
margin-bottom: 30rpx;
line-height: 48rpx;
image {
width: 100%;
height: 360rpx;
margin-bottom: 20rpx;
}
}
.aother{
display: flex;
flex-direction: row;
color: #868c99;
padding: 20rpx 30rpx 0;
justify-content: center;
align-items: center;
.txtpre{
display: flex;
flex: 1;
font-size: 28rpx;
margin-right: 20rpx;
width: 50rpx;
}
.txt{
font-size: 28rpx;
margin-right: 20rpx;
}
}
}
.submitcon{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 148rpx;
background: #FFFFFF;
box-shadow: 0rpx -4rpx 60rpx 2rpx rgba(1,31,63,0.1);
opacity: 1;
display: flex;
flex-direction: row;
}
.bbtn{
margin: 20rpx 30rpx 54rpx;
font-size: 32rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #FCFCFD;
width: 314rpx;
height: 76rpx;
line-height: 76rpx;
background: #89965f;
box-shadow: 0rpx 12rpx 64rpx 2rpx rgba(137,150,95,0.4);
border-radius: 10rpx;
opacity: 1;
&::after{
border:none;
}
}
</style>