记录模块接口对接
This commit is contained in:
@@ -3,77 +3,175 @@
|
||||
* @Author: Aimee·Zhang
|
||||
* @Date: 2022-01-11 11:27:17
|
||||
* @LastEditors: Aimee·Zhang
|
||||
* @LastEditTime: 2022-01-11 16:52:38
|
||||
* @LastEditTime: 2022-01-13 11:24:47
|
||||
-->
|
||||
|
||||
<template>
|
||||
<view class="add-foods">
|
||||
<!-- 搜索页面 -->
|
||||
<u-search
|
||||
:show-action="true"
|
||||
actionText="搜索"
|
||||
:animation="true"
|
||||
:clearabled="true"
|
||||
placeholder="请输入食品名称"
|
||||
/>
|
||||
<!-- 食品列表 -->
|
||||
<goodsList
|
||||
:lists='lists'
|
||||
type="dian"
|
||||
@addGoods="addGoods"
|
||||
/>
|
||||
<!-- 添加食谱弹窗 -->
|
||||
<addFoods
|
||||
:addShow="addShow"
|
||||
:selectGoods="selectGoods"
|
||||
:decimals="true"
|
||||
@confirm="confirmHandle"
|
||||
@close="closeHandle"
|
||||
max="999"
|
||||
/>
|
||||
|
||||
</view>
|
||||
<view class="add-foods">
|
||||
<view class="re">
|
||||
<view>低等热量</view>
|
||||
<view>中等热量</view>
|
||||
<view>高等热量</view>
|
||||
</view>
|
||||
<!-- 搜索页面 -->
|
||||
<u-search :show-action="true" actionText="搜索" :animation="true" :clearabled="true" placeholder="请输入食品名称" @custom="searchCustom" @clear="clearSearch" v-model="name" />
|
||||
<!-- 食品列表 -->
|
||||
<goodsList :lists="lists" type="dian" @addGoods="addGoods" />
|
||||
<!-- 添加食谱弹窗 -->
|
||||
<addFoods v-if="addShow" :addShow="addShow" :selectGoods="selectGoods" :decimals="true" @confirm="confirmHandle" @close="closeHandle" @tabGoodsInfo="tabGoodsInfo" max="999" />
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import goodsList from "@/components/foods";
|
||||
import addFoods from "@/components/addGoods";
|
||||
import goodsList from '@/components/foods';
|
||||
import addFoods from '@/components/add-goods-template/add-goods-template';
|
||||
import { healthFoods, addHealthFoods } from '@/apis/interfaces/foods.js';
|
||||
import moment from 'moment';
|
||||
|
||||
export default {
|
||||
components: { goodsList, addFoods },
|
||||
data() {
|
||||
return {
|
||||
lists: [1, 2, 3, 4, 5, 6], // 食品列表
|
||||
addShow: false, // 添加食品显示
|
||||
selectGoods: [1], // 选择新增的食品
|
||||
digitKeyboardValue: 0, // 选择按钮返回的值
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 监听点击键盘触发返回值
|
||||
confirmHandle(value) {
|
||||
console.log(typeof value);
|
||||
//点击键盘完成的回调函数
|
||||
this.digitKeyboardValue = value;
|
||||
this.addShow = false;
|
||||
},
|
||||
closeHandle() {
|
||||
//键盘关闭的回调函数
|
||||
this.addShow = false;
|
||||
},
|
||||
// 监听子组件的新增方法
|
||||
addGoods(e) {
|
||||
console.log("父组件监听到了子组件的新增方法", e);
|
||||
this.addShow = true;
|
||||
},
|
||||
// 监听子组件的新增方法
|
||||
tabGoodsInfo(e) {
|
||||
console.log("父组件监听到了子组件的商品详情页面", e);
|
||||
},
|
||||
},
|
||||
components: { goodsList, addFoods },
|
||||
data() {
|
||||
return {
|
||||
addShow: false, // 添加食品显示
|
||||
selectGoods: [], // 选择新增的食品
|
||||
editGoodsId: '', // 编辑食物
|
||||
type: '', // 新增食品时候 1早2午3晚4早加5午加6晚加
|
||||
lists: [], // 食品列表
|
||||
page: 1,
|
||||
has_more: true,
|
||||
name: '', // 搜索食品名称
|
||||
date: moment(new Date()).format('YYYY-MM-DD')
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
// 有id就是编辑不需要重新处理type了
|
||||
if (this.$Route.query.id) {
|
||||
this.editGoodsId = this.$Route.query.id;
|
||||
return;
|
||||
}
|
||||
//没有id的时候就是新增要处理type
|
||||
this.type = this.$Route.query.type;
|
||||
// this.getFoods();
|
||||
},
|
||||
onLoad() {
|
||||
this.getFoods();
|
||||
},
|
||||
// 触底加载更多
|
||||
onReachBottom() {
|
||||
if (!this.has_more) {
|
||||
uni.showToast({
|
||||
title: '没有更多啦~',
|
||||
icon: 'none'
|
||||
});
|
||||
} else {
|
||||
this.page = this.page + 1;
|
||||
this.getFoods();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取食品列表
|
||||
getFoods() {
|
||||
let data = {
|
||||
page: this.page,
|
||||
name: this.name
|
||||
};
|
||||
healthFoods(data).then(res => {
|
||||
console.log(res);
|
||||
this.lists = this.lists.concat(res.data);
|
||||
this.has_more = res.page.has_more;
|
||||
});
|
||||
},
|
||||
// 监听点击键盘触发返回值新增食品
|
||||
confirmHandle(value) {
|
||||
console.log(value);
|
||||
// 新添加食物
|
||||
let data = {
|
||||
type: this.type,
|
||||
ser: 1,
|
||||
weight: value,
|
||||
food_id: this.selectGoods[0].food_id,
|
||||
date: this.date
|
||||
};
|
||||
this.addHealthFoods(data);
|
||||
},
|
||||
// 添加食物
|
||||
addHealthFoods(data) {
|
||||
addHealthFoods(data).then(res => {
|
||||
console.log(res);
|
||||
this.addShow = false;
|
||||
this.$Router.back();
|
||||
});
|
||||
},
|
||||
closeHandle() {
|
||||
//键盘关闭的回调函数
|
||||
this.addShow = false;
|
||||
},
|
||||
// 监听子组件的新增方法
|
||||
addGoods(e) {
|
||||
console.log('父组件监听到了子组件的新增方法', e);
|
||||
this.addShow = true;
|
||||
this.selectGoods = [e];
|
||||
},
|
||||
// 监听子组件的新增方法
|
||||
tabGoodsInfo(e) {
|
||||
console.log('父组件监听到了子组件的商品详情页面', e);
|
||||
},
|
||||
// 点击搜索左侧按钮
|
||||
searchCustom(e) {
|
||||
console.log(e);
|
||||
this.name = e;
|
||||
this.reset();
|
||||
},
|
||||
// 清空数组重新请求数据
|
||||
reset() {
|
||||
this.page = 1;
|
||||
this.has_more = true;
|
||||
this.lists = [];
|
||||
this.getFoods();
|
||||
},
|
||||
// 点击搜索后面按钮触发事件事件
|
||||
clearSearch() {
|
||||
this.name = '';
|
||||
this.reset();
|
||||
},
|
||||
// 跳转到食品详情
|
||||
tabGoodsInfo(e) {
|
||||
console.log(e);
|
||||
this.$Router.push({
|
||||
name: 'rankingDetails',
|
||||
params: e
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.add-foods {
|
||||
padding: $padding;
|
||||
padding: $padding;
|
||||
.re{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
box-sizing: border-box;
|
||||
padding:$padding $padding * 2;
|
||||
font-size: $title-size-m;
|
||||
view:before{
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-right: 10rpx;
|
||||
content: '';
|
||||
}
|
||||
view:nth-child(3):before {
|
||||
background: #fa624d;
|
||||
}
|
||||
view:nth-child(2):before {
|
||||
background: #fbbf0f;
|
||||
}
|
||||
view:nth-child(1):before {
|
||||
background: #02c7bd;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -3,14 +3,32 @@
|
||||
* @Author: Aimee·Zhang
|
||||
* @Date: 2022-01-06 14:48:07
|
||||
* @LastEditors: Aimee·Zhang
|
||||
* @LastEditTime: 2022-01-10 10:56:31
|
||||
* @LastEditTime: 2022-01-12 16:23:01
|
||||
-->
|
||||
|
||||
<template>
|
||||
<view class="drink">
|
||||
<view
|
||||
class="drink"
|
||||
v-if="loaded"
|
||||
>
|
||||
<!-- 喝水及水杯文字 -->
|
||||
<view class="drink-content">
|
||||
<view class="title">再喝<span class="num">3.8</span>杯<span class="total">（1600ml）</span></view>
|
||||
<view
|
||||
class="title"
|
||||
v-if="!water.is_complete"
|
||||
>再喝<span class="num">{{water.lack.cup}}</span>杯<span class="total">（约{{water.lack.value}}ml）</span></view>
|
||||
<view
|
||||
class="title"
|
||||
v-if="water.is_complete"
|
||||
>已喝<span class="num">{{water.total}}ml</span>
|
||||
<u-image
|
||||
class="is_complete"
|
||||
:src="require('../../static/imgs/target.png')"
|
||||
:lazy-load="true"
|
||||
mode="widthFix"
|
||||
width="140rpx"
|
||||
/>
|
||||
</view>
|
||||
<!-- 水杯动态图片 -->
|
||||
<view class="wave-content">
|
||||
<u-image
|
||||
@@ -39,7 +57,7 @@
|
||||
color="#666"
|
||||
size="14"
|
||||
:bold="true"
|
||||
label="1600ml"
|
||||
:label="water.target+'ml'"
|
||||
labelPos="left"
|
||||
labelSize="16"
|
||||
labelColor="#666"
|
||||
@@ -56,7 +74,7 @@
|
||||
color="#666"
|
||||
size="14"
|
||||
:bold="true"
|
||||
label="420ml"
|
||||
:label="water.ml+'ml'"
|
||||
labelPos="left"
|
||||
labelSize="16"
|
||||
labelColor="#666"
|
||||
@@ -68,29 +86,31 @@
|
||||
<view>
|
||||
<u-picker
|
||||
:show="targetShow"
|
||||
:columns="targetcolumns"
|
||||
:columns="tagerts"
|
||||
title="每天喝水目标"
|
||||
keyName="label"
|
||||
confirmColor="#34ce98"
|
||||
:closeOnClickOverlay="true"
|
||||
@close="targetShow = false"
|
||||
@confirm="targetSure"
|
||||
@confirm="targetSure('1',$event)"
|
||||
:defaultIndex="tagertsDefaultIndex"
|
||||
/>
|
||||
<u-picker
|
||||
:show="waterCShow"
|
||||
:columns="watercolumns"
|
||||
:columns="cup_mls"
|
||||
title="设置水杯容量"
|
||||
keyName="label"
|
||||
confirmColor="#34ce98"
|
||||
:closeOnClickOverlay="true"
|
||||
@close="waterCShow = false"
|
||||
@confirm="waterCSure"
|
||||
@confirm="targetSure('2',$event)"
|
||||
:defaultIndex="cupDefaultIndex"
|
||||
/>
|
||||
</view>
|
||||
<!-- 加水 -->
|
||||
<view
|
||||
class="add-water"
|
||||
@click="ballPercent += 10"
|
||||
@click="drinkWater"
|
||||
>
|
||||
<u-image
|
||||
class="grass"
|
||||
@@ -112,76 +132,104 @@
|
||||
<!-- 喝水记录 -->
|
||||
<view class="--history">
|
||||
<view class="title">喝水记录</view>
|
||||
<template v-if="logs.length>0">
|
||||
<view
|
||||
class="lists"
|
||||
v-for="item in logs"
|
||||
:key="item.water_log_id"
|
||||
>
|
||||
<view class="lists-water">
|
||||
<u-icon
|
||||
size="30"
|
||||
:name="require('../../static/icon/water-icon.png')"
|
||||
/>
|
||||
</view>
|
||||
<view class="list-item">
|
||||
<view class="list-item-title">水<span>{{item.time}}</span></view>
|
||||
{{item.ml}}ml
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<view
|
||||
class="lists"
|
||||
v-for="item in 4"
|
||||
:key="item"
|
||||
>
|
||||
<view class="lists-water">
|
||||
<u-icon
|
||||
size="30"
|
||||
:name="require('../../static/icon/water-icon.png')"
|
||||
/>
|
||||
</view>
|
||||
<view class="list-item">
|
||||
<view class="list-item-title">水<span>14:39</span></view>
|
||||
420ml
|
||||
</view>
|
||||
</view>
|
||||
|
||||
v-else
|
||||
class="no-drink"
|
||||
> 今天一杯水还没有喝呢，来一杯吧~</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { waters, setWaters, drinkWater } from "@/apis/interfaces/drink";
|
||||
import moment from "moment";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
ballPercent: 0, // 喝水比例
|
||||
ballPercent: 70, // 喝水比例
|
||||
logs: [], // 水记录
|
||||
water: {}, // 水基本信息
|
||||
targetShow: false,
|
||||
targetcolumns: [
|
||||
[
|
||||
{
|
||||
label: "1600ml",
|
||||
// 其他属性值
|
||||
number: 1600,
|
||||
// ...
|
||||
},
|
||||
{
|
||||
label: "1700ml",
|
||||
number: 1700,
|
||||
},
|
||||
],
|
||||
],
|
||||
tagerts: [], // 目标列表
|
||||
tagertsDefaultIndex: ["1"], // 目标默认index
|
||||
waterCShow: false,
|
||||
watercolumns: [
|
||||
[
|
||||
{
|
||||
label: "1600ml",
|
||||
// 其他属性值
|
||||
number: 1600,
|
||||
// ...
|
||||
},
|
||||
{
|
||||
label: "1700ml",
|
||||
number: 1700,
|
||||
},
|
||||
],
|
||||
],
|
||||
cup_mls: [], // 水杯列表
|
||||
cupDefaultIndex: ["2"], // 目标默认index
|
||||
loaded: false,
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
this.getWaters();
|
||||
},
|
||||
methods: {
|
||||
// 设置目标弹出点击了确认方法
|
||||
targetSure(e) {
|
||||
console.log("触发了targetSure");
|
||||
this.targetShow = false;
|
||||
console.log(e.value[0]);
|
||||
// 获取喝水页面信息
|
||||
getWaters() {
|
||||
waters().then((res) => {
|
||||
this.cup_mls = [res.cup_mls];
|
||||
this.tagerts = [res.tagerts];
|
||||
this.water = res.water;
|
||||
this.logs = res.logs;
|
||||
this.ballPercent = res.water.lack.ratio;
|
||||
this.cupDefaultIndex = [
|
||||
res.cup_mls.findIndex(
|
||||
(item) => item.number === res.water.ml
|
||||
),
|
||||
];
|
||||
this.tagertsDefaultIndex = [
|
||||
res.tagerts.findIndex(
|
||||
(item) => item.number === res.water.target
|
||||
),
|
||||
];
|
||||
this.loaded = true;
|
||||
});
|
||||
},
|
||||
|
||||
// 设置水杯容量点击确认触发方法
|
||||
waterCSure(e) {
|
||||
console.log("触发了waterCSure");
|
||||
this.targetShow = false;
|
||||
console.log(e.value[0]);
|
||||
// 确认方法index===1 每日目标 2，水杯容量
|
||||
targetSure(index, e) {
|
||||
// console.log("触发了targetSure", index, e.value[0]);
|
||||
// let date = moment(new Date()).format("YYYY--MM--DD");
|
||||
let params = {};
|
||||
if (index === "1") {
|
||||
params = {
|
||||
type: "target",
|
||||
ml: e.value[0].number,
|
||||
date: moment(new Date()).format("YYYY-MM-DD"),
|
||||
};
|
||||
} else {
|
||||
params = {
|
||||
type: "ml",
|
||||
ml: e.value[0].number,
|
||||
date: moment(new Date()).format("YYYY-MM-DD"),
|
||||
};
|
||||
}
|
||||
setWaters(params).then((res) => {
|
||||
this.getWaters();
|
||||
this.waterCShow = false;
|
||||
this.targetShow = false;
|
||||
});
|
||||
},
|
||||
// 喝水
|
||||
drinkWater() {
|
||||
drinkWater().then((res) => {
|
||||
console.log(res);
|
||||
this.getWaters();
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -189,6 +237,7 @@ export default {
|
||||
<style lang="scss" scoped>
|
||||
.drink {
|
||||
// 喝水 水杯及文字
|
||||
|
||||
.drink-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -203,6 +252,12 @@ export default {
|
||||
color: $main-color;
|
||||
font-weight: normal;
|
||||
margin: $margin * 2;
|
||||
position: relative;
|
||||
.is_complete {
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
right: -120rpx;
|
||||
}
|
||||
.num {
|
||||
font-size: $title-size * 2.3;
|
||||
padding: 0 $padding * 0.3;
|
||||
@@ -258,6 +313,11 @@ export default {
|
||||
// 喝水记录
|
||||
.--history {
|
||||
padding: $padding;
|
||||
.no-drink {
|
||||
color: $text-gray-m;
|
||||
font-size: $title-size-m;
|
||||
padding-top: $padding + 10;
|
||||
}
|
||||
// 标题
|
||||
.title {
|
||||
font-size: $title-size * 1.4;
|
||||
@@ -295,7 +355,7 @@ export default {
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
$main-color,
|
||||
$main-color * 0.9
|
||||
$main-color
|
||||
);
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
|
||||
@@ -3,42 +3,73 @@
|
||||
* @Author: Aimee·Zhang
|
||||
* @Date: 2022-01-11 08:54:49
|
||||
* @LastEditors: Aimee·Zhang
|
||||
* @LastEditTime: 2022-01-11 15:41:12
|
||||
* @LastEditTime: 2022-01-14 09:29:23
|
||||
-->
|
||||
|
||||
<template>
|
||||
<view class="record--foods">
|
||||
<!-- 饮食进度条 -->
|
||||
<view class="cricle-content">
|
||||
<view class="info">饮食摄入<span>879</span></view>
|
||||
<view class="info">饮食摄入<span>{{calorys.intake_total}}</span></view>
|
||||
<arprogress
|
||||
:percent="percent"
|
||||
:percent="calorys.exceeds?100:calorys.ratio"
|
||||
inactiveColor="#f5f4f9"
|
||||
activeColor="#34ce98"
|
||||
:activeColor="calorys.exceeds?'#f00':'#34ce98'"
|
||||
width="300"
|
||||
class="cricle"
|
||||
borderWidth="20"
|
||||
>
|
||||
<span>还可以吃</span>
|
||||
<span class="num">1829</span>
|
||||
<span>推荐预算1829</span>
|
||||
<span>{{calorys.exceeds?'多吃了':'还可以吃'}}</span>
|
||||
<span :class="['num',calorys.exceeds?'num1':'']">{{calorys.amount}}</span>
|
||||
<span>推荐预算{{calorys.goal}}</span>
|
||||
</arprogress>
|
||||
<view class="info">运动消耗<span>879</span></view>
|
||||
<view class="info" @click="errToast">运动消耗<span>0</span></view>
|
||||
<view class="ic-left">摄入量推荐</view>
|
||||
<u-icon
|
||||
class="ic-day"
|
||||
name="checkmark-circle"
|
||||
color="#34ce98"
|
||||
size="10"
|
||||
label="4天"
|
||||
:label="`${calorys.days}天`"
|
||||
labelColor="#34ce98"
|
||||
labelSize="10"
|
||||
space="3"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<!-- 有饮食记录 -->
|
||||
<template v-if="intakes.length>0">
|
||||
<view
|
||||
class="foods-add"
|
||||
v-for="(it,index) in intakes"
|
||||
:key="index"
|
||||
>
|
||||
<view class="foods-title">
|
||||
<view class="title-left">{{it.name}}<span v-if="it.remark">{{it.remark || ''}}</span></view>
|
||||
<view class="title-right">
|
||||
{{it.total}}<span class="dw">千卡</span>
|
||||
<u-icon
|
||||
name="arrow-right"
|
||||
color="#ddd"
|
||||
size="13"
|
||||
:bold="true"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<goodsList
|
||||
:lists="it.intake"
|
||||
type="no-dian"
|
||||
@editGoods="editGoods"
|
||||
/>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 没有饮食记录 -->
|
||||
<!-- <view class="no-foods">
|
||||
<view
|
||||
class="no-foods"
|
||||
v-else
|
||||
>
|
||||
<u-image
|
||||
:src="require('../../static/imgs/no-foods.png')"
|
||||
:lazy-load="true"
|
||||
@@ -47,33 +78,8 @@
|
||||
width="300rpx"
|
||||
class="no-foods-img"
|
||||
/>
|
||||
<view>还没有记录</view>
|
||||
<view>还没有添加今日饮食记录</view>
|
||||
<view>请点击屏幕下方按钮来添加</view>
|
||||
</view> -->
|
||||
<!-- 有饮食记录 -->
|
||||
<view
|
||||
class="foods-add"
|
||||
v-for="item in 2"
|
||||
:key="item"
|
||||
>
|
||||
<view class="foods-title">
|
||||
<view class="title-left">早餐<span>建议493~603千卡</span></view>
|
||||
<view class="title-right">
|
||||
558<span class="dw">千卡</span>
|
||||
<u-icon
|
||||
name="arrow-right"
|
||||
color="#ddd"
|
||||
size="13"
|
||||
:bold="true"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<goodsList
|
||||
:lists="lists"
|
||||
type="no-dian"
|
||||
@editGoods="editGoods"
|
||||
/>
|
||||
|
||||
</view>
|
||||
<!-- 加餐模块 -->
|
||||
<u-action-sheet
|
||||
@@ -100,7 +106,7 @@
|
||||
:icon="require('../../static/imgs/foods-1.png')"
|
||||
></u-tabbar-item>
|
||||
<u-tabbar-item
|
||||
text="+晚餐"
|
||||
text="+午餐"
|
||||
@click="tabbarClick"
|
||||
:icon="require('../../static/imgs/foods-2.png')"
|
||||
></u-tabbar-item>
|
||||
@@ -115,61 +121,147 @@
|
||||
:icon="require('../../static/imgs/foods-4.png')"
|
||||
></u-tabbar-item>
|
||||
</u-tabbar>
|
||||
|
||||
<!-- 修改食品弹窗 -->
|
||||
<!-- 添加食谱弹窗 -->
|
||||
<addFoods
|
||||
v-if="addShow"
|
||||
:addShow="addShow"
|
||||
:selectGoods="selectGoods"
|
||||
:decimals="true"
|
||||
@confirm="confirmHandle"
|
||||
@close="closeHandle"
|
||||
@delThis="delThis"
|
||||
@tabGoodsInfo="tabGoodsInfo"
|
||||
max="999"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import arprogress from "@/components/ar-circle-progress/index.vue";
|
||||
import goodsList from "@/components/foods";
|
||||
import {
|
||||
plans,
|
||||
editHealthFoods,
|
||||
delHealthFoods,
|
||||
} from "@/apis/interfaces/foods.js";
|
||||
import moment from "moment";
|
||||
import addFoods from "@/components/add-goods-template/add-goods-template";
|
||||
export default {
|
||||
components: {
|
||||
arprogress,
|
||||
goodsList,
|
||||
addFoods,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
percent: 1, // 摄入量 100 百分比
|
||||
tabarIndex: 0,
|
||||
lists: [1, 2, 3],
|
||||
lists: [],
|
||||
addEatShow: false, // 加餐弹窗默认不显示
|
||||
addEatList: [
|
||||
{
|
||||
name: "上午加餐",
|
||||
type: 2,
|
||||
},
|
||||
{
|
||||
name: "下午加餐",
|
||||
type: 4,
|
||||
},
|
||||
{
|
||||
name: "晚上加餐",
|
||||
type: 6,
|
||||
},
|
||||
],
|
||||
today: moment(new Date()).format("YYYY-MM-DD"),
|
||||
calorys: {}, // 当日食谱推荐页面的信息
|
||||
intakes: [], // 当日摄入列表
|
||||
addShow: false, // 添加食品显示
|
||||
selectGoods: [], // 选择新增的食品
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
// 底部按钮点击触发的事件 早餐 午餐 晚餐 加餐
|
||||
// 错误提示
|
||||
errToast(){
|
||||
uni.showToast({
|
||||
title:'努力开发中~',
|
||||
icon:'none'
|
||||
})
|
||||
},
|
||||
getList() {
|
||||
plans(this.today).then((res) => {
|
||||
this.calorys = res.calorys;
|
||||
this.intakes = res.intakes;
|
||||
});
|
||||
},
|
||||
// 底部按钮点击触发的事件 早餐1 午餐3 晚餐5 加餐(早2中4晚6)
|
||||
tabbarClick(e) {
|
||||
console.log("点击事件,,,,");
|
||||
console.log(e);
|
||||
this.tabarIndex = e;
|
||||
if (e === 3) {
|
||||
this.addEatShow = true;
|
||||
} else {
|
||||
this.$Router.push({
|
||||
name: "AddFoods",
|
||||
uni.navigateTo({
|
||||
url: `/pages/record/addFoods?type=${
|
||||
e === 0 ? 1 : e === 1 ? 3 : 5
|
||||
}`,
|
||||
});
|
||||
}
|
||||
},
|
||||
// 选择了加餐跳转
|
||||
selectClick(e) {
|
||||
console.log(e);
|
||||
this.$Router.push({
|
||||
name: "AddFoods",
|
||||
uni.navigateTo({
|
||||
url: `/pages/record/addFoods?type=${e.type}`,
|
||||
});
|
||||
// 选择加餐
|
||||
},
|
||||
// 编辑食品
|
||||
editGoods(e) {
|
||||
console.log("父组件监听到了子组件的商品详情页面", e);
|
||||
this.selectGoods = [e];
|
||||
this.addShow = true;
|
||||
},
|
||||
closeHandle() {
|
||||
//键盘关闭的回调函数
|
||||
this.addShow = false;
|
||||
},
|
||||
// 监听点击键盘触发返回值新增食品
|
||||
confirmHandle(value) {
|
||||
console.log(value);
|
||||
// 新添加食物
|
||||
let data = {
|
||||
ser: 1,
|
||||
weight: value,
|
||||
food_id: this.selectGoods[0].food_id,
|
||||
intake_id: this.selectGoods[0].intake_id,
|
||||
};
|
||||
console.log(data);
|
||||
this.editHealthFoods(data);
|
||||
},
|
||||
// 添加食物
|
||||
editHealthFoods(data) {
|
||||
editHealthFoods(data).then((res) => {
|
||||
console.log(res);
|
||||
this.addShow = false;
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
// 删除该食物
|
||||
delThis(e) {
|
||||
delHealthFoods(this.selectGoods[0].intake_id).then((res) => {
|
||||
this.addShow = false;
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
// 跳转到食品详情
|
||||
tabGoodsInfo(e) {
|
||||
console.log(e);
|
||||
this.$Router.push({
|
||||
name: "rankingDetails",
|
||||
params: e,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -200,6 +292,9 @@ export default {
|
||||
font-weight: bold;
|
||||
padding: $padding * 0.2;
|
||||
}
|
||||
.num1 {
|
||||
color: #f00;
|
||||
}
|
||||
}
|
||||
.info {
|
||||
display: flex;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -3,7 +3,7 @@
|
||||
* @Author: Aimee·Zhang
|
||||
* @Date: 2022-01-07 12:32:50
|
||||
* @LastEditors: Aimee·Zhang
|
||||
* @LastEditTime: 2022-01-10 15:00:51
|
||||
* @LastEditTime: 2022-01-14 09:37:42
|
||||
-->
|
||||
|
||||
<template>
|
||||
@@ -13,7 +13,7 @@
|
||||
<view class="unit">
|
||||
<span
|
||||
:class="isJin === 2?'active':''"
|
||||
@click="isJin = 2"
|
||||
@click="isJin = 1"
|
||||
>斤</span>
|
||||
<span
|
||||
:class="isJin === 1?'active':''"
|
||||
@@ -21,11 +21,11 @@
|
||||
>公斤</span>
|
||||
</view>
|
||||
<view class="progress">
|
||||
<view>比原来轻</view>
|
||||
<view>{{weightInfo.text}}</view>
|
||||
<u-count-to
|
||||
class="uCountTo"
|
||||
:startVal="0"
|
||||
:endVal="3.2"
|
||||
:endVal="weightInfo.change"
|
||||
:decimals="1"
|
||||
color="#333"
|
||||
fontSize="36"
|
||||
@@ -35,39 +35,46 @@
|
||||
</view>
|
||||
<view
|
||||
class="add-weight"
|
||||
@click="addWeight"
|
||||
@click="addWeightShow = true"
|
||||
>记录体重</view>
|
||||
<view class="des-title">以最后一次记录为主且每日只能更新一次</view>
|
||||
</view>
|
||||
<!-- 体重列表 -->
|
||||
<view class="weight-list">
|
||||
<view
|
||||
class="weight-list"
|
||||
v-if="lists.length>0"
|
||||
>
|
||||
<view
|
||||
class="list-item"
|
||||
v-for="item in 2"
|
||||
:key="item"
|
||||
v-for="item in lists"
|
||||
:key="item.wight_id"
|
||||
>
|
||||
<view class="list-left">
|
||||
<view class="list-title">
|
||||
<span>64.9</span>公斤
|
||||
<span>{{item.weight}}</span>公斤
|
||||
</view>
|
||||
初始体重
|
||||
测量结果
|
||||
</view>
|
||||
<view class="list-right">
|
||||
<span>开始保持 / 塑性</span>
|
||||
2021-12-22 12:23
|
||||
{{item.created_at}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="no-lists"
|
||||
v-else
|
||||
>还没有体重信息，记录下呗~</view>
|
||||
<!-- 记录体重弹窗 -->
|
||||
<u-popup
|
||||
:show="addWeightShow"
|
||||
:round="10"
|
||||
@close="addWeightShow = false"
|
||||
@open="open"
|
||||
:closeable="true"
|
||||
>
|
||||
<view class="addWeightContent">
|
||||
<view class="date">今天</view>
|
||||
<view class='count'><span>{{horizontaPointVal}}</span>公斤</view>
|
||||
<view class='count'><span>{{weight}}</span>公斤</view>
|
||||
<vue-scale
|
||||
:min="10"
|
||||
:max="100"
|
||||
@@ -76,11 +83,11 @@
|
||||
:h="80"
|
||||
:styles="styles"
|
||||
@scroll="scroll"
|
||||
:scrollLeft="55"
|
||||
:scrollLeft="Number(weight)"
|
||||
/>
|
||||
<view
|
||||
class="addBtn"
|
||||
@click="addWeightShow = false"
|
||||
@click="addWeight"
|
||||
>确认添加</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
@@ -88,6 +95,9 @@
|
||||
</template>
|
||||
<script>
|
||||
import vueScale from "@/components/vueScale";
|
||||
import { weights, addWeight } from "@/apis/interfaces/weight.js";
|
||||
import moment from "moment";
|
||||
import l from "../../uni_modules/uni-config-center/uniCloud/cloudfunctions/common/uni-config-center";
|
||||
export default {
|
||||
components: {
|
||||
vueScale,
|
||||
@@ -95,9 +105,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
isJin: 1, // 是公斤 2 是斤 所有用到斤的直接乘以这个字段即可
|
||||
addWeightShow: true, // 是否添加体重展示
|
||||
weight: 11,
|
||||
height: 180,
|
||||
addWeightShow: false, // 是否添加体重展示
|
||||
styles: {
|
||||
line: "#dbdbdb",
|
||||
bginner: "#fbfbfb",
|
||||
@@ -106,18 +114,57 @@ export default {
|
||||
fontColor: "#404040",
|
||||
fontSize: 16,
|
||||
},
|
||||
horizontaPointVal: "",
|
||||
weight: "",
|
||||
date: "",
|
||||
weightInfo: {},
|
||||
lists: [],
|
||||
has_more: true,
|
||||
page: 1,
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
this.getWeights();
|
||||
this.date = moment(new Date()).format("YYYY-MM-DD");
|
||||
},
|
||||
onReachBottom() {
|
||||
if (!this.has_more) {
|
||||
uni.showToast({
|
||||
title: "没有更多啦~",
|
||||
icon: "none",
|
||||
});
|
||||
} else {
|
||||
this.page = this.page + 1;
|
||||
this.getWeights();
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
addWeight() {
|
||||
this.addWeightShow = true;
|
||||
//获取体重首页接口
|
||||
getWeights() {
|
||||
weights(this.page).then((res) => {
|
||||
console.log(res);
|
||||
this.lists = this.lists.concat(res.lists.data);
|
||||
this.has_more = res.lists.page.has_more;
|
||||
this.weightInfo = res.weight;
|
||||
this.weight = res.weight.now;
|
||||
});
|
||||
},
|
||||
addWeight() {
|
||||
let data = {
|
||||
weight: this.weight,
|
||||
date: this.date,
|
||||
};
|
||||
addWeight(data).then((res) => {
|
||||
this.addWeightShow = false;
|
||||
this.page = 1;
|
||||
this.has_more = true;
|
||||
this.lists = [];
|
||||
this.getWeights();
|
||||
});
|
||||
},
|
||||
close() {},
|
||||
open() {},
|
||||
// 滚动标尺触发事件
|
||||
scroll(msg) {
|
||||
this.horizontaPointVal = msg;
|
||||
this.weight = msg;
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -189,10 +236,15 @@ export default {
|
||||
border-radius: $radius * 3;
|
||||
border: solid 2rpx $main-color;
|
||||
color: $main-color;
|
||||
padding: $padding * 0.8 $padding * 2.8;
|
||||
padding: $padding * 0.6 $padding * 2.8;
|
||||
margin-top: $margin * 2;
|
||||
font-weight: bold;
|
||||
}
|
||||
.des-title {
|
||||
padding: $padding;
|
||||
color: $text-gray-m;
|
||||
font-size: $title-size-m - 4;
|
||||
}
|
||||
}
|
||||
// 列表
|
||||
.weight-list {
|
||||
@@ -231,6 +283,11 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.no-lists {
|
||||
padding: $padding;
|
||||
color: $text-gray-m;
|
||||
font-size: $title-size-m;
|
||||
}
|
||||
|
||||
// 弹窗
|
||||
.addWeightContent {
|
||||
@@ -261,7 +318,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.addBtn {
|
||||
background-color: $main-color * 0.8;
|
||||
background-color: $main-color;
|
||||
color: #fff;
|
||||
margin-top: $margin * 2;
|
||||
font-size: $title-size * 1.2;
|
||||
|
||||
Reference in New Issue
Block a user