TmOct5/ZhHealth
1
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

修复...

Browse Source
This commit is contained in:
张冬雪
2022-02-14 11:44:49 +08:00
parent b3739a9d8d
commit db94c6b962
14 changed files with 762 additions and 812 deletions
Download Patch File Download Diff File Expand all files Collapse all files

239
pages/evaluation/introduce.vue
View File

@@ -6,129 +6,138 @@
* @LastEditTime: 2022-01-13 17:26:38
-->
<template>
<view class="introduce">
<view class="intro-history" v-if="info.is_answer" @click="toResult">测评记录</view>
<view class="intro-history" v-else @click="toResult">暂未测评</view>
<view class="intro-content">
<view class="intro-title">{{ info.title }}</view>
<u-read-more class="intro-des" :toggle="true" showHeight="140" ref="uReadMore" :shadowStyle="shadowStyle" color="#34ce98" textIndent="0">
<rich-text :nodes="content"></rich-text>
</u-read-more>
<u-image class="intro-img" width="100%" radius="20rpx" height="700rpx" :src="info.cover ? info.cover : require('../../static/imgs/indro.png')" :lazy-load="true" />
<view class="answer" @click="nowAn">开始测评</view>
</view>
<view class="remark">本评测会收集孕产情况、健康状况、家族病史、用药情况信息，用于开展相关评测，为你生成分析报告。</view>
</view>
<view class="introduce">
<view class="intro-history" v-if="info.is_answer" @click="toResult">测评记录</view>
<view class="intro-history" v-else @click="toResult">暂未测评</view>
<view class="intro-content">
<view class="intro-title">{{ info.title }}</view>
<u-read-more class="intro-des" :toggle="true" showHeight="140" ref="uReadMore" :shadowStyle="shadowStyle" color="#34ce98" textIndent="0">
<rich-text :nodes="content"></rich-text>
</u-read-more>
<u-image class="intro-img" width="100%" radius="20rpx" height="700rpx" :src="info.cover ? info.cover : require('../../static/imgs/indro.png')" :lazy-load="true" />
<view class="answer" @click="nowAn">开始测评</view>
</view>
<view class="remark">本评测会收集孕产情况、健康状况、家族病史、用药情况信息，用于开展相关评测，为你生成分析报告。</view>
</view>
</template>
<script>
import { evaluationsInfo } from '@/apis/interfaces/evaluation.js';
export default {
data() {
return {
info: {},
content: `本测试预计完成时间5-8分钟
import {evaluationsInfo} from '@/apis/interfaces/evaluation.js';
export default {
data() {
return {
info: {},
content: `本测试预计完成时间5-8分钟
<br/>
—
<br/>
适用于18-65岁，存在亚健康或尿酸偏高人群`,
shadowStyle: {
backgroundImage: 'none',
paddingTop: '0',
marginTop: '20rpx'
}
};
},
onShow() {
evaluationsInfo(this.$Route.query.id).then(res => {
this.content = res.content;
this.info = res;
});
},
methods: {
nowAn() {
uni.navigateTo({
url: `/pages/evaluation/index?id=${this.$Route.query.id}`
});
},
toResult() {
console.log('点击了测试');
uni.navigateTo({
url: `/pages/evaluation/result?id=${this.$Route.query.id}`
});
}
}
};
shadowStyle: {backgroundImage: 'none',paddingTop: '0',marginTop: '20rpx'}
};
},
onShow() {
evaluationsInfo(this.$Route.query.id).then(res => {
this.content = res.content;
this.info = res;
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none",
duration: 2000,
mask: true
})
});
},
methods: {
nowAn() {
uni.navigateTo({
url: `/pages/evaluation/index?id=${this.$Route.query.id}`
});
},
toResult() {
uni.navigateTo({
url: `/pages/evaluation/result?id=${this.$Route.query.id}`
});
}
}
};
</script>
<style lang="scss" scoped>
.introduce {
background-color: $main-color;
min-height: 100vh;
.intro-history {
padding: $padding * 1.5 $padding;
color: $window-color;
text-decoration: underline;
font-size: $title-size-lg;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
}
// 测评展示
.intro-content {
background: rgba($color: #fff, $alpha: 1);
min-height: 30vh;
padding: 0 $padding;
margin: $margin * 1.5;
border-radius: $radius;
position: relative;
box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
// 标题
.intro-title {
font-size: $title-size * 1.8;
font-weight: bold;
color: $text-color;
position: relative;
top: -40rpx;
}
// 介绍
.intro-des {
line-height: $title-size * 1.8;
color: $text-color;
position: relative;
top: -10rpx;
font-size: $title-size-m;
padding-bottom: 20rpx;
}
// 图片
.intro-img {
margin-top: $padding * 0.8;
}
// 开始测评
.answer {
position: absolute;
bottom: -30rpx;
width: 400rpx;
height: 90rpx;
line-height: 90rpx;
left: 50%;
text-align: center;
background: rgba($color: #fff, $alpha: 0.94);
margin-left: -200rpx;
border-radius: $radius-m * 4;
font-weight: bold;
color: $text-color;
font-size: $title-size-m + 6;
}
}
// 备注信息
.remark {
color: $text-gray;
font-size: $title-size - 6;
padding: $padding * 2 $padding;
line-height: $title-size * 1.3;
}
}
.introduce {
background-color: $main-color;
min-height: 100vh;
.intro-history {
padding: $padding * 1.5 $padding;
color: $window-color;
text-decoration: underline;
font-size: $title-size-lg;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
}
// 测评展示
.intro-content {
background: rgba($color: #fff, $alpha: 1);
min-height: 30vh;
padding: 0 $padding;
margin: $margin * 1.5;
border-radius: $radius;
position: relative;
box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
// 标题
.intro-title {
font-size: $title-size * 1.8;
font-weight: bold;
color: $text-color;
position: relative;
top: -40rpx;
}
// 介绍
.intro-des {
line-height: $title-size * 1.8;
color: $text-color;
position: relative;
top: -10rpx;
font-size: $title-size-m;
padding-bottom: 20rpx;
}
// 图片
.intro-img {
margin-top: $padding * 0.8;
}
// 开始测评
.answer {
position: absolute;
bottom: -30rpx;
width: 400rpx;
height: 90rpx;
line-height: 90rpx;
left: 50%;
text-align: center;
background: rgba($color: #fff, $alpha: 0.94);
margin-left: -200rpx;
border-radius: $radius-m * 4;
font-weight: bold;
color: $text-color;
font-size: $title-size-m + 6;
}
}
// 备注信息
.remark {
color: $text-gray;
font-size: $title-size - 6;
padding: $padding * 2 $padding;
line-height: $title-size * 1.3;
}
}
</style>