This commit is contained in:
唐明明
2022-01-14 16:45:12 +08:00
4 changed files with 716 additions and 868 deletions

View File

@@ -1,4 +1,3 @@
<!--
* @Description:
* @Author: Aimee·Zhang
@@ -13,91 +12,41 @@
<view class="plan">
<view class="plan-1">
<span>基本信息</span>
<u-line-progress
:percentage="percentplan1"
activeColor="#34ce98"
class="line-progress"
:showText="false"
/>
<u-line-progress :percentage="percentplan1" activeColor="#34ce98" class="line-progress" :showText="false" />
</view>
<view class="plan-2">
<span>健康目标</span>
<u-line-progress
:percentage="percentplan2"
activeColor="#34ce98"
width="200rpx"
class="line-progress"
:showText="false"
/>
<u-line-progress :percentage="percentplan2" activeColor="#34ce98" width="200rpx" class="line-progress" :showText="false" />
</view>
<view class="plan-3">
<span>行为习惯</span>
<u-line-progress
:percentage="percentplan3"
activeColor="#34ce98"
width="200rpx"
class="line-progress"
:showText="false"
/>
<u-line-progress :percentage="percentplan3" activeColor="#34ce98" width="200rpx" class="line-progress" :showText="false" />
</view>
</view>
<!-- 进度1 基本信息 -->
<view>
<!-- 进度1 基本信息页面展示 性别 -->
<view
class="plan-content"
v-if="sexShow"
>
<view class="plan-content" v-if="sexShow">
<view class="info-des">生理性别和激素会影响我们的身体代谢食物的方式</view>
<view class="info-title">您的性别是</view>
<view class="sex">
<view
class="sex-item"
@click="clickSex(1)"
>
<u-image
class="sex-item-avatar"
width="150rpx"
height="150rpx"
:src="require('../../static/imgs/avatar-1.png')"
:lazy-load="true"
shape="circle"
/>男性
<view class="sex-item" @click="clickSex(1)">
<u-image class="sex-item-avatar" width="150rpx" height="150rpx" :src="require('../../static/imgs/avatar-1.png')" :lazy-load="true" shape="circle" />
男性
</view>
<view
class="sex-item"
@click="clickSex(2)"
>
<u-image
class="sex-item-avatar"
width="150rpx"
height="150rpx"
:src="require('../../static/imgs/avatar-0.png')"
:lazy-load="true"
shape="circle"
/>女性
<view class="sex-item" @click="clickSex(2)">
<u-image class="sex-item-avatar" width="150rpx" height="150rpx" :src="require('../../static/imgs/avatar-0.png')" :lazy-load="true" shape="circle" />
女性
</view>
</view>
</view>
<!-- 进度1 基本信息页面展示 年龄 -->
<view
class="plan-content"
v-if="birthdayShow"
>
<u-image
class="sex-item-avatar"
width="100rpx"
height="100rpx"
:src="require('../../static/imgs/avatar-1.png')"
:lazy-load="true"
shape="circle"
/>
<view class="plan-content" v-if="birthdayShow">
<u-image class="sex-item-avatar" width="100rpx" height="100rpx" :src="require('../../static/imgs/avatar-1.png')" :lazy-load="true" shape="circle" />
<view class="age">
<view class="info-title">你的出生日期是</view>
<view
class="year"
@change="dateShow = true"
>{{showBirthday}}</view>
<view class="year" @change="dateShow = true">{{ showBirthday }}</view>
<u-datetime-picker
confirmColor="#34ce98"
ref="datetimePicker"
@@ -115,78 +64,33 @@
</view>
<!-- 进度1 基本信息页面展示 身高体重 -->
<view
class="plan-content weight-content"
v-if="heightWeightShow"
>
<u-image
class="sex-item-avatar"
width="100rpx"
height="100rpx"
:src="require('../../static/imgs/avatar-1.png')"
:lazy-load="true"
shape="circle"
/>
<view class="plan-content weight-content" v-if="heightWeightShow">
<u-image class="sex-item-avatar" width="100rpx" height="100rpx" :src="require('../../static/imgs/avatar-1.png')" :lazy-load="true" shape="circle" />
<view class="info-des">身高体重信息对健康信息有重要参考价值</view>
<view class="info-title">您的身高是</view>
<!-- -->
<view class="weight">
<view class='count'><span>{{heightU}}</span>厘米</view>
<vue-scale
:min="10"
:max="100"
:int="false"
:single="10"
:h="80"
:styles="styles"
@scroll="scrollHeight"
:scrollLeft="Number(heightU)"
/>
</view>
<view class="
info-title">您的体重是
<view class="count"><span>{{ heightU }}</span>厘米</view>
<vue-scale :min="10" :max="100" :int="false" :single="10" :h="80" :styles="styles" @scroll="scrollHeight" :scrollLeft="Number(heightU)" />
</view>
<view class="info-title">您的体重是</view>
<view class="weight">
<view class='count'><span>{{weightU}}</span>公斤</view>
<vue-scale
:min="10"
:max="100"
:int="false"
:single="10"
:h="80"
:styles="styles"
@scroll="scrollWeight"
:scrollLeft="Number(weightU)"
/>
<view class="count"><span>{{ weightU }}</span>公斤 </view>
<vue-scale :min="10" :max="100" :int="false" :single="10" :h="80" :styles="styles" @scroll="scrollWeight" :scrollLeft="Number(weightU)" />
</view>
<view class="pre-next">
<view
class="pro"
@click="weightClick(1)"
>上一步</view>
<view
class="next"
@click="weightClick(2)"
>下一步</view>
<view class="pro" @click="weightClick(1)">上一步</view>
<view class="next" @click="weightClick(2)">下一步</view>
</view>
</view>
</view>
<!-- 进度2 健康目标 -->
<view>
<!-- 减脂类型 -->
<view
v-if="targetShow"
class="plan-content target-content"
>
<u-image
class="sex-item-avatar"
width="100rpx"
height="100rpx"
:src="require('../../static/imgs/avatar-1.png')"
:lazy-load="true"
shape="circle"
/>
<view v-if="targetShow" class="plan-content target-content">
<u-image class="sex-item-avatar" width="100rpx" height="100rpx" :src="require('../../static/imgs/avatar-1.png')" :lazy-load="true" shape="circle" />
<view class="info-title">您的目标是</view>
<view class="target-type">
<view class="target-type-item">
@@ -194,103 +98,67 @@
class="target-img"
width="160rpx"
height="160rpx"
@click="activedTarget ='1'"
:src="activedTarget === '1'?require('../../static/imgs/ic-w-s.png'):require('../../static/imgs/ic-w-n.png')"
@click="activedTarget = '1'"
:src="activedTarget === '1' ? require('../../static/imgs/ic-w-s.png') : require('../../static/imgs/ic-w-n.png')"
:lazy-load="true"
shape="circle"
/>减肥
/>
减肥
</view>
<view class="target-type-item">
<u-image
class="target-img"
width="160rpx"
height="160rpx"
@click="activedTarget ='2'"
:src="activedTarget === '2'?require('../../static/imgs/ic-b-s.png'):require('../../static/imgs/ic-b-n.png')"
@click="activedTarget = '2'"
:src="activedTarget === '2' ? require('../../static/imgs/ic-b-s.png') : require('../../static/imgs/ic-b-n.png')"
:lazy-load="true"
shape="circle"
/>保持体重
/>
保持体重
</view>
<view class="target-type-item">
<u-image
class="target-img"
width="160rpx"
height="160rpx"
@click="activedTarget ='3'"
:src="activedTarget === '3'?require('../../static/imgs/ic-m-s.png'):require('../../static/imgs/ic-m-n.png')"
@click="activedTarget = '3'"
:src="activedTarget === '3' ? require('../../static/imgs/ic-m-s.png') : require('../../static/imgs/ic-m-n.png')"
:lazy-load="true"
shape="circle"
/>增肌
/>
增肌
</view>
</view>
<view class="pre-next">
<view
class="pro"
@click="targetClick(1)"
>上一步</view>
<view
class="next"
@click="targetClick(2)"
>下一步</view>
<view class="pro" @click="targetClick(1)">上一步</view>
<view class="next" @click="targetClick(2)">下一步</view>
</view>
</view>
<!-- 减脂体重 -->
<view
v-if="targetWeightShow"
class="plan-content target-content"
>
<u-image
class="sex-item-avatar"
width="100rpx"
height="100rpx"
:src="require('../../static/imgs/avatar-1.png')"
:lazy-load="true"
shape="circle"
/>
<view v-if="targetWeightShow" class="plan-content target-content">
<u-image class="sex-item-avatar" width="100rpx" height="100rpx" :src="require('../../static/imgs/avatar-1.png')" :lazy-load="true" shape="circle" />
<view class="info-title">您的打算减脂多少</view>
<view class="target-type">
<view class="target-type-item">
<view class='count'><span>{{weightTargetU}}</span>公斤</view>
<vue-scale
:min="10"
:max="100"
:int="false"
:single="10"
:h="80"
:styles="styles"
@scroll="scrollTargetWeight"
:scrollLeft="Number(weightTargetU)"
/>
<view class="count">
<span>{{ weightTargetU }}</span>
公斤
</view>
<vue-scale :min="10" :max="100" :int="false" :single="10" :h="80" :styles="styles" @scroll="scrollTargetWeight" :scrollLeft="Number(weightTargetU)" />
</view>
</view>
<view class="pre-next">
<view
class="pro"
@click="targetWeightClick(1)"
>上一步</view>
<view
class="next"
@click="targetWeightClick(2)"
>下一步</view>
<view class="pro" @click="targetWeightClick(1)">上一步</view>
<view class="next" @click="targetWeightClick(2)">下一步</view>
</view>
</view>
</view>
<!-- 进度3 行为习惯 -->
<!-- 减脂类型 -->
<view
v-if="behaviorShow"
class="plan-content target-content"
>
<u-image
class="sex-item-avatar"
width="100rpx"
height="100rpx"
:src="require('../../static/imgs/avatar-1.png')"
:lazy-load="true"
shape="circle"
/>
<view v-if="behaviorShow" class="plan-content target-content">
<u-image class="sex-item-avatar" width="100rpx" height="100rpx" :src="require('../../static/imgs/avatar-1.png')" :lazy-load="true" shape="circle" />
<view class="info-title">您的运动量是</view>
<view class="target-type">
<view class="target-type-item">
@@ -298,55 +166,53 @@
class="target-img"
width="120rpx"
height="120rpx"
@click="activedbehaviarTarget ='1'"
:src="activedbehaviarTarget === '1'?require('../../static/imgs/ic-w-01.png'):require('../../static/imgs/ic-w-02.png')"
@click="activedbehaviarTarget = '1'"
:src="activedbehaviarTarget === '1' ? require('../../static/imgs/ic-w-01.png') : require('../../static/imgs/ic-w-02.png')"
:lazy-load="true"
shape="circle"
/>久坐不动
/>
久坐不动
</view>
<view class="target-type-item">
<u-image
class="target-img"
width="120rpx"
height="120rpx"
@click="activedbehaviarTarget ='2'"
:src="activedbehaviarTarget === '2'?require('../../static/imgs/ic-w-03.png'):require('../../static/imgs/ic-w-04.png')"
@click="activedbehaviarTarget = '2'"
:src="activedbehaviarTarget === '2' ? require('../../static/imgs/ic-w-03.png') : require('../../static/imgs/ic-w-04.png')"
:lazy-load="true"
shape="circle"
/>少量运动
/>
少量运动
</view>
<view class="target-type-item">
<u-image
class="target-img"
width="120rpx"
height="120rpx"
@click="activedbehaviarTarget ='3'"
:src="activedbehaviarTarget === '3'?require('../../static/imgs/ic-w-05.png'):require('../../static/imgs/ic-w-06.png')"
@click="activedbehaviarTarget = '3'"
:src="activedbehaviarTarget === '3' ? require('../../static/imgs/ic-w-05.png') : require('../../static/imgs/ic-w-06.png')"
:lazy-load="true"
shape="circle"
/>中等运动量
/>
中等运动量
</view>
<view class="target-type-item">
<u-image
class="target-img"
width="120rpx"
height="120rpx"
@click="activedbehaviarTarget ='4'"
:src="activedbehaviarTarget === '4'?require('../../static/imgs/ic-w-07.png'):require('../../static/imgs/ic-w-08.png')"
@click="activedbehaviarTarget = '4'"
:src="activedbehaviarTarget === '4' ? require('../../static/imgs/ic-w-07.png') : require('../../static/imgs/ic-w-08.png')"
:lazy-load="true"
shape="circle"
/>超强度运动
/>
超强度运动
</view>
</view>
<view class="pre-next">
<view
class="pro"
@click="targetBehaviorClick(1)"
>上一步</view>
<view
class="next"
@click="targetBehaviorClick(2)"
>立即创建</view>
<view class="pro" @click="targetBehaviorClick(1)">上一步</view>
<view class="next" @click="targetBehaviorClick(2)">立即创建</view>
</view>
</view>
<u-toast ref="uToast"></u-toast>
@@ -354,12 +220,12 @@
</template>
<script>
import moment from "moment";
import vueScale from "@/components/vueScale"; // 体重标尺
import { recordsHealth } from "@/apis/interfaces/essentialInfo.js";
import moment from 'moment';
import vueScale from '@/components/vueScale'; // 体重标尺
import { recordsHealth } from '@/apis/interfaces/essentialInfo.js';
export default {
components: {
vueScale,
vueScale
},
data() {
return {
@@ -367,12 +233,12 @@ export default {
//#region
percentplan1: 0,
// 性别--start
sex: "1", //1是男生2是女生
sex: '1', //1是男生2是女生
sexShow: true, // 性别展示
// 性别 -- end
// 年龄 -- start
birthday: Date.parse(new Date()), // 年龄默认是当前时间
maxDate: Date.parse(new Date()), // 最大年龄为当前年月日
birthday: new Date().getTime(), // 年龄默认是当前时间
maxDate: new Date().getTime(), // 最大年龄为当前年月日
dateShow: false, // 显示日期
birthdayShow: false, // 显示年龄模块是否显示
// 年龄 -- end
@@ -381,12 +247,12 @@ export default {
weight: 11,
height: 180,
styles: {
line: "#dbdbdb",
bginner: "#fbfbfb",
bgoutside: "#ffffff",
font: "#404040",
fontColor: "#404040",
fontSize: 16,
line: '#dbdbdb',
bginner: '#fbfbfb',
bgoutside: '#ffffff',
font: '#404040',
fontColor: '#404040',
fontSize: 16
},
weightU: 55, //体重
heightU: 160, // 身高
@@ -397,19 +263,20 @@ export default {
//#region
percentplan2: 0,
targetShow: false, // 减脂目标模块 是否显示减脂类型
activedTarget: "", // 减脂
activedTarget: '', // 减脂
targetWeightShow: false, // 目标体重页面展示
weightTargetU: 50,
//#endregion
behaviorShow: false, // 默认行为习惯页面不展示
percentplan3: 0,
activedbehaviarTarget: "", // 默认没有任何运动量
activedbehaviarTarget: '' // 默认没有任何运动量
};
},
computed: {
showBirthday() {
return moment(this.birthday).format("YYYY年MM月DD日");
},
console.log(moment(this.birthday).format('YYYY年MM月DD日'));
return moment(this.birthday).format('YYYY年MM月DD日');
}
},
methods: {
//性别----------- 选择性别 1男2女
@@ -439,15 +306,16 @@ export default {
},
//年龄------------- 过滤出生年月日
formatter(type, value) {
if (type === "year") {
if (type === 'year') {
return `${value}`;
}
if (type === "month") {
if (type === 'month') {
return `${value}`;
}
if (type === "day") {
if (type === 'day') {
return `${value}`;
}
console.log(value);
return value;
},
// 体重---------标尺滚动
@@ -479,10 +347,10 @@ export default {
this.targetShow = false; // 关闭目标页面 减重 塑性 增肌
this.percentplan2 = 0;
} else {
if (this.activedTarget === "") {
if (this.activedTarget === '') {
uni.showToast({
title: "请选择目标",
icon: "none",
title: '请选择目标',
icon: 'none'
});
return;
}
@@ -514,42 +382,45 @@ export default {
this.targetWeightShow = true; // 目标体重页面展示
this.behaviorShow = false; // 关闭运动量选择页面
} else {
if (this.activedbehaviarTarget === "") {
if (this.activedbehaviarTarget === '') {
uni.showToast({
title: "请选择运动量",
icon: "none",
title: '请选择运动量',
icon: 'none'
});
return;
}
let params = {
sex: this.sex, // 性别
birthday: this.birthday, // 年龄
birthday: moment(this.birthday).format('YYYY-MM-DD'), // 年龄
weight: this.weightU, // 体重
height: this.heightU, // 身高
goal_weight: this.weightTargetU, // 目标体重
exercise: this.activedbehaviarTarget, // 运动量
days: 1,
days: 1
};
recordsHealth(params).then((res) => {
console.log(params, 'params.....');
recordsHealth(params)
.then(res => {
uni.showModal({
title: "提示",
content: "创建成功",
showCancel:false,
title: '提示',
content: '创建成功',
showCancel: false,
success: ModalRes => {
this.percentplan3 = 100;
this.behaviorShow = false; // 关闭运动量页面
uni.navigateBack({});
}
});
})
}).catch(err => {
.catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
icon: 'none'
});
});
}
}
}
},
},
};
</script>
<style lang="scss" scoped>
@@ -618,8 +489,7 @@ export default {
box-sizing: border-box;
margin-top: $margin * 3;
.sex-item-avatar {
box-shadow: 0 0 10rpx 4rpx
rgba($color: $main-color, $alpha: 0.1);
box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
border-radius: 50%;
}
}

View File

@@ -99,7 +99,7 @@ export default {
this.page = this.page + 1;
this.getList();
} else {
if(this.option_ids.length !== this.page){
if (this.option_ids.length !== this.page) {
this.option_ids.push(this.currentId);
this.currentId = '';
}
@@ -124,8 +124,8 @@ export default {
})
.catch(err => {
uni.showToast({
title:err.message
})
title: err.message
});
});
}
}

View File

@@ -52,7 +52,7 @@ export default {
});
},
toResult() {
console.log('点击了测试')
console.log('点击了测试');
uni.navigateTo({
url: `/pages/evaluation/result?id=${this.$Route.query.id}`
});

View File

@@ -7,68 +7,46 @@
-->
<template>
<view class="evaluation-list ">
<view
class="evaluation-item"
v-for="(item,index) in evalList"
:key="index"
>
<view class="evaluation-item" v-for="(item, index) in evalList" :key="index">
<!-- 评测列表主要内容 标题 图片 描述 -->
<view class="--content">
<u-image
class="content-img"
width="170rpx"
height="170rpx"
radius="20rpx"
:src="item.cover?item.cover:require('../../static/imgs/test.png')"
:lazy-load="true"
/>
<u-image class="content-img" width="170rpx" height="170rpx" radius="20rpx" :src="item.cover ? item.cover : require('../../static/imgs/test.png')" :lazy-load="true" />
<view class="title-des">
<view class="title">{{item.title}}</view>
<view class="des">{{item.description || '--'}}</view>
<view class="title">{{ item.title }}</view>
<view class="des">{{ item.description || '--' }}</view>
</view>
</view>
<!-- 分数 -->
<view
class="score"
v-if="item.is_answer"
><span>{{item.answer.total}}</span></view>
<view class="score" v-if="item.is_answer">
<span>{{ item.answer.total }}</span>
</view>
<!-- 评测状态 -->
<view class="--status">
<!-- 已测试展示 状态-->
<view
class="status"
v-if="item.is_answer"
>
<span class="dian">·</span>{{item.remark}}
</view>
<view
v-if="item.is_answer"
class="history"
@click="toResult(item)"
>
查看历史结果
</view>
<!-- 未测试展示 状态-->
<view
class="status"
v-if="!item.is_answer"
>
<view class="status" v-if="item.is_answer">
<span class="dian">·</span>
<span class="person">{{item.remark}}</span>
{{ item.remark }}
</view>
<view v-if="item.is_answer" class="history" @click="toResult(item)">查看历史结果</view>
<!-- 未测试展示 状态-->
<view class="status" v-if="!item.is_answer">
<span class="dian">·</span>
<span class="person">{{ item.remark }}</span>
人已测 | 约4~8分钟
</view>
<u-icon
name="arrow-right"
:color="item.is_answer?'#26a377':'#faa81a'"
:color="item.is_answer ? '#26a377' : '#faa81a'"
size="14"
:bold="true"
:label="item.is_answer?'重新评测':'开始测评'"
:label="item.is_answer ? '重新评测' : '开始测评'"
labelPos="left"
labelSize="14"
space="1"
:labelColor="item.is_answer?'#26a377':'#faa81a'"
:labelColor="item.is_answer ? '#26a377' : '#faa81a'"
@click="nowEva(item)"
/>
</view>
@@ -79,11 +57,11 @@
</template>
<script>
import { evaluations } from "@/apis/interfaces/evaluation.js";
import { evaluations } from '@/apis/interfaces/evaluation.js';
export default {
data() {
return {
evalList: [],
evalList: []
};
},
onShow() {
@@ -92,23 +70,23 @@ export default {
methods: {
// 测试列表
getList() {
evaluations().then((res) => {
evaluations().then(res => {
this.evalList = res;
});
},
// nowEva
nowEva(item) {
uni.navigateTo({
url: `/pages/evaluation/introduce?id=${item.evaluation_id}`,
url: `/pages/evaluation/introduce?id=${item.evaluation_id}`
});
},
//测评结果
toResult(item) {
uni.navigateTo({
url: `/pages/evaluation/result?id=${item.evaluation_id}`,
url: `/pages/evaluation/result?id=${item.evaluation_id}`
});
},
},
}
}
};
</script>