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

饮水记录长按删除功能，修复食谱详情中搭配推荐t食品跳转问题

Browse Source
This commit is contained in:
张冬雪
2022-01-20 16:06:30 +08:00
parent edcf04b7e2
commit e7807e9709
7 changed files with 993 additions and 1118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
apis/interfaces/drink.js
View File

@@ -35,8 +35,21 @@ const drinkWater = () => {
method: 'POST', method: 'POST',
}) })
} }
/**
* @description:删除喝水记录
* @Date: 2022-01-20 15点08分
*/
const delDrinkWater = (id) => {
return request({
url: `health/waters/${id}`,
method: 'DELETE',
})
}
export { export {
waters, waters,
setWaters, setWaters,
drinkWater drinkWater,
delDrinkWater
} }

9
components/sports/addPopup.vue
View File

@@ -37,7 +37,7 @@
v-if="selectSports.title === '编辑运动'" v-if="selectSports.title === '编辑运动'"
name="trash" name="trash"
color="#ddd" color="#ddd"
size="20" size="16"
label="删除这条数据" label="删除这条数据"
labelColor="#ddd" labelColor="#ddd"
:bold="true" :bold="true"
@@ -49,6 +49,7 @@
placeholder="60" placeholder="60"
class="select-time" class="select-time"
v-model="duration" v-model="duration"
type="number"
> >
<u--text <u--text
text="运动时间：" text="运动时间："
@@ -132,7 +133,7 @@ export default {
position: relative; position: relative;
.popup-title { .popup-title {
color: $main-color; color: $main-color;
font-size: $title-size + 4; font-size: $title-size-m;
border-bottom: solid 1rpx #f9f9f9; border-bottom: solid 1rpx #f9f9f9;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@@ -144,6 +145,8 @@ export default {
} }
.title { .title {
color: $text-color; color: $text-color;
font-size: $title-size;
font-weight: bold;
} }
} }
@@ -154,7 +157,7 @@ export default {
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
padding: $padding * 2 $padding $padding $padding; padding: $padding * 2 $padding $padding $padding;
font-size: $title-size + 4; font-size: $title-size-m;
color: $text-color; color: $text-color;
border-bottom: solid 1rpx #f9f9f9; border-bottom: solid 1rpx #f9f9f9;
.popup-item-title { .popup-item-title {

2
pages/menu/details.vue
View File

@@ -13,7 +13,7 @@
:lists="menuData.foods" :lists="menuData.foods"
isType="det" isType="det"
:btnStyle="{'margin-top': '30rpx'}" :btnStyle="{'margin-top': '30rpx'}"
@onMenu="$Router.push({ name: 'menuDetails', params: {id: $event.food_id, title: $event.name }})" @onMenu="$Router.push({ name: 'rankingDetails', params: {id: $event.food_id, title: $event.name }})"
/> />
</view> </view>
<view class="foods"> <view class="foods">

315
pages/record/addExercises.vue
View File

@@ -7,177 +7,164 @@
--> -->
<template> <template>
<view class="add-foods"> <view class="add-foods">
<!-- 搜索页面 --> <!-- 搜索页面 -->
<u-search <u-search :show-action="true" actionText="搜索" :animation="true" :clearabled="true" placeholder="请输入运动名称" @custom="searchCustom" @clear="clearSearch" v-model="name" />
:show-action="true" <!-- 运动列表 -->
actionText="搜索" <sports type="add" :lists="lists" @addSport="addSport" />
:animation="true" <!-- 添加弹窗 -->
:clearabled="true" <addPopup :selectSports="selectSports" :addSportsShow="addSportsShow" @comfirmSport="comfirmSport" @cancleSport="cancleSport" />
placeholder="请输入运动名称" </view>
@custom="searchCustom"
@clear="clearSearch"
v-model="name"
/>
<!-- 运动列表 -->
<sports
type="add"
:lists="lists"
@addSport="addSport"
/>
<!-- 添加弹窗 -->
<addPopup
:selectSports="selectSports"
:addSportsShow="addSportsShow"
@comfirmSport="comfirmSport"
@cancleSport="cancleSport"
/>
</view>
</template> </template>
<script> <script>
import sports from "@/components/sports"; import sports from '@/components/sports';
import addPopup from "@/components/sports/addPopup"; import addPopup from '@/components/sports/addPopup';
import { healthSports, addHealthSports } from "@/apis/interfaces/sport.js"; import { healthSports, addHealthSports } from '@/apis/interfaces/sport.js';
import moment, { duration } from "moment"; import moment, { duration } from 'moment';
export default { export default {
components: { sports, addPopup }, components: { sports, addPopup },
data() { data() {
return { return {
addSportsShow: false, // 添加运动弹窗显示 addSportsShow: false, // 添加运动弹窗显示
selectSports: {}, // 选择新增的运动 selectSports: {}, // 选择新增的运动
lists: [], // 运动列表 lists: [], // 运动列表
page: 1, page: 1,
has_more: true, has_more: true,
name: "", // 搜索运动名称 name: '', // 搜索运动名称
today: moment(new Date()).format("YYYY-MM-DD"), today: moment(new Date()).format('YYYY-MM-DD')
}; };
}, },
onLoad() { onLoad() {
this.getExercises(); this.getExercises();
}, },
// 触底加载更多 // 触底加载更多
onReachBottom() { onReachBottom() {
if (!this.has_more) { if (!this.has_more) {
uni.showToast({ uni.showToast({
title: "没有更多啦~", title: '没有更多啦~',
icon: "none", icon: 'none'
}); });
} else { } else {
this.page = this.page + 1; this.page = this.page + 1;
this.getExercises(); this.getExercises();
} }
}, },
methods: { methods: {
// 获取运动列表 // 获取运动列表
getExercises() { getExercises() {
let data = { let data = {
page: this.page, page: this.page,
name: this.name, name: this.name
}; };
healthSports(data).then((res) => { healthSports(data).then(res => {
this.lists = this.lists.concat(res.data); this.lists = this.lists.concat(res.data);
this.has_more = res.page.has_more; this.has_more = res.page.has_more;
}); });
}, },
// 显示弹窗内容 // 显示弹窗内容
addSport(item) { addSport(item) {
console.log(item); console.log(item);
this.selectSports = item; this.selectSports = item;
this.selectSports.duration = 60; this.selectSports.duration = 60;
this.addSportsShow = true; this.addSportsShow = true;
}, },
// 弹窗确认按钮新增 // 弹窗确认按钮新增
comfirmSport(show, duration) { comfirmSport(show, duration) {
let params = { let params = {
unit: "1", // 时间单位：分钟 1 小时 2 unit: '1', // 时间单位：分钟 1 小时 2
duration: duration, // 时常 duration: duration, // 时常
sport_id: this.selectSports.sport_id, // 运动id sport_id: this.selectSports.sport_id, // 运动id
date: this.today, // 日期 date: this.today // 日期
}; };
addHealthSports(params).then((res) => { addHealthSports(params)
this.addSportsShow = false; .then(res => {
this.selectSports = {}; this.addSportsShow = false;
this.$Router.back(); this.selectSports = {};
}); this.$Router.back();
console.log("弹窗确认按钮新增"); })
}, .catch(err => {
// 弹窗取消按钮 uni.showToast({
cancleSport(show) { title: err.message,
this.addSportsShow = show; icon: 'none'
this.duration = 60; });
console.log("弹窗取消按钮"); });
}, },
// 添加运动弹窗显示 // 弹窗取消按钮
//#region 搜索相关方法 start cancleSport(show) {
// 点击搜索左侧按钮 this.addSportsShow = show;
searchCustom(e) { this.duration = 60;
console.log(e); },
this.name = e; // 添加运动弹窗显示
this.reset(); //#region 搜索相关方法 start
}, // 点击搜索左侧按钮
// 清空数组重新请求数据 searchCustom(e) {
reset() { console.log(e);
this.page = 1; this.name = e;
this.has_more = true; this.reset();
this.lists = []; },
this.getExercises(); // 清空数组重新请求数据
}, reset() {
// 点击搜索后面按钮触发事件事件 this.page = 1;
clearSearch() { this.has_more = true;
this.name = ""; this.lists = [];
this.reset(); this.getExercises();
}, },
//#endregion 搜索相关方法 end // 点击搜索后面按钮触发事件事件
}, clearSearch() {
this.name = '';
this.reset();
}
//#endregion 搜索相关方法 end
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.add-foods { .add-foods {
padding: $padding; padding: $padding;
.lists { .lists {
padding: $padding * 0.6 0; padding: $padding * 0.6 0;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
.lists-right { .lists-right {
flex: 1; flex: 1;
font-size: $title-size-m - 6; font-size: $title-size-m - 6;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
box-sizing: border-box; box-sizing: border-box;
color: $text-gray-m; color: $text-gray-m;
border-bottom: solid 1rpx #f7f7f7; border-bottom: solid 1rpx #f7f7f7;
margin-left: $margin * 0.8; margin-left: $margin * 0.8;
padding: $padding 0; padding: $padding 0;
} }
.lists-title { .lists-title {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
font-size: $title-size-m; font-size: $title-size-m;
color: $text-color; color: $text-color;
.des { .des {
margin-top: 10rpx; margin-top: 10rpx;
} }
span { span {
color: $text-price; color: $text-price;
font-size: $title-size-m - 6; font-size: $title-size-m - 6;
font-weight: normal; font-weight: normal;
padding-right: $padding * 0.3; padding-right: $padding * 0.3;
} }
.des { .des {
color: $text-gray-m; color: $text-gray-m;
font-size: $title-size-m - 6; font-size: $title-size-m - 6;
font-weight: normal; font-weight: normal;
} }
} }
} }
} }
</style> </style>

812
pages/record/drink.vue
View File

@@ -7,446 +7,402 @@
--> -->
<template> <template>
<view <view class="drink" v-if="loaded">
class="drink" <!-- 喝水及水杯文字 -->
v-if="loaded" <view class="drink-content">
> <view class="title" v-if="!water.is_complete">
<!-- 喝水及水杯文字 --> 再喝
<view class="drink-content"> <span class="num">{{ water.lack.cup }}</span>
<view 杯
class="title" <span class="total">（约{{ water.lack.value }}ml）</span>
v-if="!water.is_complete" </view>
>再喝<span class="num">{{water.lack.cup}}</span>杯<span class="total">（约{{water.lack.value}}ml）</span></view> <view class="title" v-if="water.is_complete">
<view 已喝
class="title" <span class="num">{{ water.total }}ml</span>
v-if="water.is_complete" <u-image class="is_complete" :src="require('../../static/imgs/target.png')" :lazy-load="true" mode="widthFix" width="140rpx" />
>已喝<span class="num">{{water.total}}ml</span> </view>
<u-image <!-- 水杯动态图片 -->
class="is_complete" <view class="wave-content">
:src="require('../../static/imgs/target.png')" <u-image class="grass" :src="require('../../static/imgs/gress.png')" :lazy-load="true" mode="scaleToFill" width="320rpx" height="520rpx" />
:lazy-load="true" <view class="wave" :style="{ '--ballPercent': -ballPercent + 40 + '%' }"></view>
mode="widthFix" </view>
width="140rpx" <!-- 目标 -->
/> <view class="water-target">
</view> <view class="target-item" @click="targetShow = true">
<!-- 水杯动态图片 --> 今日目标
<view class="wave-content"> <u-icon
<u-image class="target-icon"
class="grass" name="arrow-right"
:src="require('../../static/imgs/gress.png')" color="#666"
:lazy-load="true" size="14"
mode="scaleToFill" :bold="true"
width="320rpx" :label="water.target + 'ml'"
height="520rpx" labelPos="left"
/> labelSize="16"
<view labelColor="#666"
class="wave" space="6"
:style="{'--ballPercent': -ballPercent+40+'%'}" />
> </view>
</view> <view class="target-item" @click="waterCShow = true">
</view> 水杯容量
<!-- 目标 --> <u-icon class="target-icon" name="arrow-right" color="#666" size="14" :bold="true" :label="water.ml + 'ml'" labelPos="left" labelSize="16" labelColor="#666" space="6" />
<view class="water-target"> </view>
<view </view>
class="target-item" <!-- 目标弹出层 -->
@click="targetShow = true" <view>
>今日目标 <u-picker
<u-icon :show="targetShow"
class="target-icon" :columns="tagerts"
name="arrow-right" title="每天喝水目标"
color="#666" keyName="label"
size="14" confirmColor="#34ce98"
:bold="true" :closeOnClickOverlay="true"
:label="water.target+'ml'" @close="targetShow = false"
labelPos="left" @confirm="targetSure('1', $event)"
labelSize="16" :defaultIndex="tagertsDefaultIndex"
labelColor="#666" />
space="6" <u-picker
/> :show="waterCShow"
</view> :columns="cup_mls"
<view title="设置水杯容量"
class="target-item" keyName="label"
@click="waterCShow = true" confirmColor="#34ce98"
>水杯容量 :closeOnClickOverlay="true"
<u-icon @close="waterCShow = false"
class="target-icon" @confirm="targetSure('2', $event)"
name="arrow-right" :defaultIndex="cupDefaultIndex"
color="#666" />
size="14" </view>
:bold="true" <!-- 加水 -->
:label="water.ml+'ml'" <view class="add-water" @click="drinkWater">
labelPos="left" <u-image class="grass" :src="require('../../static/imgs/gress2.png')" :lazy-load="true" mode="scaleToFill" width="60rpx" height="80rpx" />
labelSize="16" <span>一杯水</span>
labelColor="#666" <u-icon class="add-icon" name="plus-circle-fill" color="#34ce98" size="24" />
space="6" </view>
/> </view>
</view> <!-- 喝水记录 -->
</view> <view class="--history">
<!-- 目标弹出层 --> <view class="title">喝水记录</view>
<view> <template v-if="logs.length > 0">
<u-picker <view class="lists" v-for="item in logs" :key="item.water_log_id" @longpress="delWater(item.water_log_id)">
:show="targetShow" <view class="lists-water"><u-icon size="30" :name="require('../../static/icon/water-icon.png')" /></view>
:columns="tagerts" <view class="list-item">
title="每天喝水目标" <view class="list-item-title">
keyName="label" 水
confirmColor="#34ce98" <span>{{ item.time }}</span>
:closeOnClickOverlay="true" </view>
@close="targetShow = false" {{ item.ml }}ml
@confirm="targetSure('1',$event)" </view>
:defaultIndex="tagertsDefaultIndex" </view>
/> </template>
<u-picker <view v-else class="no-drink">今天一杯水还没有喝呢，来一杯吧~</view>
:show="waterCShow" </view>
:columns="cup_mls" </view>
title="设置水杯容量"
keyName="label"
confirmColor="#34ce98"
:closeOnClickOverlay="true"
@close="waterCShow = false"
@confirm="targetSure('2',$event)"
:defaultIndex="cupDefaultIndex"
/>
</view>
<!-- 加水 -->
<view
class="add-water"
@click="drinkWater"
>
<u-image
class="grass"
:src="require('../../static/imgs/gress2.png')"
:lazy-load="true"
mode="scaleToFill"
width="60rpx"
height="80rpx"
/>
<span>一杯水</span>
<u-icon
class="add-icon"
name="plus-circle-fill"
color="#34ce98"
size="24"
/>
</view>
</view>
<!-- 喝水记录 -->
<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
v-else
class="no-drink"
> 今天一杯水还没有喝呢，来一杯吧~</view>
</view>
</view>
</template> </template>
<script> <script>
import { waters, setWaters, drinkWater } from "@/apis/interfaces/drink"; import { waters, setWaters, drinkWater, delDrinkWater } from '@/apis/interfaces/drink';
import moment from "moment"; import moment from 'moment';
export default { export default {
data() { data() {
return { return {
ballPercent: 70, // 喝水比例 ballPercent: 0, // 喝水比例
logs: [], // 水记录 logs: [], // 水记录
water: {}, // 水基本信息 water: {}, // 水基本信息
targetShow: false, targetShow: false,
tagerts: [], // 目标列表 tagerts: [], // 目标列表
tagertsDefaultIndex: ["1"], // 目标默认index tagertsDefaultIndex: ['1'], // 目标默认index
waterCShow: false, waterCShow: false,
cup_mls: [], // 水杯列表 cup_mls: [], // 水杯列表
cupDefaultIndex: ["2"], // 目标默认index cupDefaultIndex: ['2'], // 目标默认index
loaded: false, loaded: false
}; };
}, },
onShow() { onShow() {
this.getWaters(); this.getWaters();
}, },
methods: { methods: {
// 获取喝水页面信息 // 获取喝水页面信息
getWaters() { getWaters() {
waters().then((res) => { waters().then(res => {
this.cup_mls = [res.cup_mls]; this.cup_mls = [res.cup_mls];
this.tagerts = [res.tagerts]; this.tagerts = [res.tagerts];
this.water = res.water; this.water = res.water;
this.logs = res.logs; this.logs = res.logs;
this.ballPercent = res.water.lack.ratio; this.ballPercent = res.water.lack.ratio;
this.cupDefaultIndex = [ this.cupDefaultIndex = [res.cup_mls.findIndex(item => item.number === res.water.ml)];
res.cup_mls.findIndex( this.tagertsDefaultIndex = [res.tagerts.findIndex(item => item.number === res.water.target)];
(item) => item.number === res.water.ml this.loaded = true;
), });
]; },
this.tagertsDefaultIndex = [ // 确认方法index===1 每日目标 2，水杯容量
res.tagerts.findIndex( targetSure(index, e) {
(item) => item.number === res.water.target // console.log("触发了targetSure", index, e.value[0]);
), // let date = moment(new Date()).format("YYYY--MM--DD");
]; let params = {};
this.loaded = true; if (index === '1') {
}); params = {
}, type: 'target',
// 确认方法index===1 每日目标 2，水杯容量 ml: e.value[0].number,
targetSure(index, e) { date: moment(new Date()).format('YYYY-MM-DD')
// console.log("触发了targetSure", index, e.value[0]); };
// let date = moment(new Date()).format("YYYY--MM--DD"); } else {
let params = {}; params = {
if (index === "1") { type: 'ml',
params = { ml: e.value[0].number,
type: "target", date: moment(new Date()).format('YYYY-MM-DD')
ml: e.value[0].number, };
date: moment(new Date()).format("YYYY-MM-DD"), }
}; setWaters(params).then(res => {
} else { this.getWaters();
params = { this.waterCShow = false;
type: "ml", this.targetShow = false;
ml: e.value[0].number, });
date: moment(new Date()).format("YYYY-MM-DD"), },
}; // 喝水
} drinkWater() {
setWaters(params).then((res) => { drinkWater().then(res => {
this.getWaters(); this.getWaters();
this.waterCShow = false; });
this.targetShow = false; },
}); // 删除和喝水记录
}, delWater(id) {
// 喝水 uni.showModal({
drinkWater() { content: '确认删除么？',
drinkWater().then((res) => { confirmText: '确认删除',
this.getWaters(); confirmColor: '#34ce98',
}); cancelText: '再想想',
}, cancelColor: '#ddd',
}, success: res => {
if (res.confirm) {
delDrinkWater(id)
.then(res => {
this.getWaters();
})
.catch(err => {
uni.showToast({
title: err.message,
icon: 'none'
});
});
}
}
});
}
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.drink { .drink {
// 喝水 水杯及文字 // 喝水 水杯及文字
.drink-content { .drink-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
padding: $padding * 2 0; // padding: $padding 0;
position: relative; position: relative;
// 标题 再喝水 // 标题 再喝水
.title { .title {
font-size: $title-size + 4; font-size: $title-size + 4;
color: $main-color; color: $main-color;
font-weight: normal; font-weight: normal;
margin: $margin * 2; margin: $margin * 2;
position: relative; position: relative;
.is_complete { .is_complete {
position: absolute; position: absolute;
top: 30rpx; top: 30rpx;
right: -120rpx; right: -120rpx;
} }
.num { .num {
font-size: $title-size * 2.3; font-size: $title-size * 2.3;
padding: 0 $padding * 0.3; padding: 0 $padding * 0.3;
font-weight: bold; font-weight: bold;
} }
.total { .total {
font-size: $title-size; font-size: $title-size;
color: $text-gray-m; color: $text-gray-m;
padding-left: $padding * 0.2; padding-left: $padding * 0.2;
} }
} }
// 加一杯水 // 加一杯水
.add-water { .add-water {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
font-size: $title-size; font-size: $title-size;
color: $text-color; color: $text-color;
margin-top: $margin * 2; margin-top: $margin * 2;
position: relative; position: relative;
span { span {
padding-top: $padding * 0.4; padding-top: $padding * 0.4;
} color:$text-gray-m;
.add-icon { font-size: $title-size;
position: absolute; }
top: $margin + 8; .add-icon {
right: 0; position: absolute;
} top: $margin + 8;
} right: 0;
// 目标 }
.water-target { }
display: flex; // 目标
flex-direction: column; .water-target {
align-items: center; display: flex;
justify-content: center; flex-direction: column;
box-sizing: border-box; align-items: center;
color: $text-gray-m; justify-content: center;
font-size: $title-size; box-sizing: border-box;
position: absolute; color: $text-gray-m;
z-index: 110; font-size: $title-size;
right: $padding * 1.4; position: absolute;
top: 50%; z-index: 110;
.target-item { right: $padding * 1.4;
margin-top: $margin * 1.6; top: 50%;
.target-icon { .target-item {
padding-top: $padding * 0.5; margin-top: $margin * 1.6;
} .target-icon {
} padding-top: $padding * 0.5;
} }
} }
// 喝水记录 }
.--history { }
padding: $padding; // 喝水记录
.no-drink { .--history {
color: $text-gray-m; padding: $padding;
font-size: $title-size-m; .no-drink {
padding-top: $padding + 10; color: $text-gray-m;
} font-size: $title-size-m;
// 标题 padding-top: $padding + 10;
.title { }
font-size: $title-size * 1.4; // 标题
font-weight: bold; .title {
color: $text-color; font-size: $title-size + 4;
position: relative; font-weight: bold;
display: flex; color: $text-color;
flex-direction: row; position: relative;
align-items: center; display: flex;
justify-content: flex-start; flex-direction: row;
box-sizing: border-box; align-items: center;
padding-left: $padding; justify-content: flex-start;
padding-bottom: $padding; box-sizing: border-box;
&::before { padding-left: $padding;
position: absolute; padding-bottom: $padding;
content: ""; &::before {
width: 8rpx; position: absolute;
height: 45rpx; content: '';
left: 0; width: 8rpx;
background-color: $main-color; height: 45rpx;
border-radius: 10rpx; left: 0;
} background-color: $main-color;
} border-radius: 10rpx;
}
}
// 列表 // 列表
.lists { .lists {
// background-color: pink; // background-color: pink;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
box-sizing: border-box; box-sizing: border-box;
border-bottom: solid 1rpx #f7f7f7; border-bottom: solid 1rpx #f7f7f7;
.lists-water { .lists-water {
background-image: linear-gradient( background-image: linear-gradient(to right, $main-color, $main-color);
to right, width: 90rpx;
$main-color, height: 90rpx;
$main-color border-radius: 50%;
); display: flex;
width: 90rpx; flex-direction: row;
height: 90rpx; align-items: center;
border-radius: 50%; justify-content: center;
display: flex; box-sizing: border-box;
flex-direction: row; }
align-items: center; .list-item {
justify-content: center; flex: 1;
box-sizing: border-box; margin-left: $margin * 0.7;
} font-size: $title-size;
.list-item { color: $text-gray-m;
flex: 1; display: flex;
margin-left: $margin * 0.7; flex-direction: row;
font-size: $title-size; align-items: center;
color: $text-gray-m; justify-content: space-between;
display: flex; box-sizing: border-box;
flex-direction: row; margin: $margin 0 $margin $margin * 0.7;
align-items: center; .list-item-title {
justify-content: space-between; font-size: $title-size + 3;
box-sizing: border-box; color: $text-color;
margin: $margin 0 $margin $margin * 0.7; display: flex;
.list-item-title { flex-direction: column;
font-size: $title-size + 3; align-items: flex-start;
color: $text-color; justify-content: center;
display: flex; box-sizing: border-box;
flex-direction: column; font-weight: bold;
align-items: flex-start; span {
justify-content: center; margin-top: $margin * 0.4;
box-sizing: border-box; background-color: #f7f7f7;
font-weight: bold; padding: 4rpx 10rpx;
span { border-radius: 50rpx;
margin-top: $margin * 0.4; font-weight: normal;
background-color: #f7f7f7; font-size: $title-size - 3;
padding: 4rpx 10rpx; }
border-radius: 50rpx; }
font-weight: normal; }
font-size: $title-size - 3; }
} }
}
}
}
}
} }
// 水杯动画 // 水杯动画
.wave-content { .wave-content {
position: relative; position: relative;
z-index: 110; z-index: 110;
.grass { .grass {
position: relative; position: relative;
z-index: 120099; z-index: 120099;
} }
.wave { .wave {
position: absolute; position: absolute;
width: 290rpx; width: 290rpx;
height: 500rpx; height: 500rpx;
background-color: rgba($color: $main-color, $alpha: 0.6); background-color: rgba($color: $main-color, $alpha: 0.6);
background-size: 100%; background-size: 100%;
overflow: hidden; overflow: hidden;
top: 10rpx; top: 10rpx;
left: 20rpx; left: 20rpx;
z-index: 10; z-index: 10;
&::before, &::before,
&::after { &::after {
content: ""; content: '';
position: absolute; position: absolute;
width: 1000rpx; width: 1000rpx;
height: 1000rpx; height: 1000rpx;
top: var(--ballPercent); top: var(--ballPercent);
left: 50%; left: 50%;
background-color: rgba(255, 255, 255, 0.4); background-color: rgba(255, 255, 255, 0.4);
border-radius: 45%; border-radius: 45%;
transform: translate(-50%, -70%) rotate(0); transform: translate(-50%, -70%) rotate(0);
animation: rotate 4s linear infinite; animation: rotate 4s linear infinite;
z-index: 10; z-index: 10;
} }
&::after { &::after {
border-radius: 47%; border-radius: 47%;
background-color: rgba(255, 255, 255, 0.9); background-color: rgba(255, 255, 255, 0.9);
transform: translate(-50%, -70%) rotate(0); transform: translate(-50%, -70%) rotate(0);
animation: rotate 6s linear -5s infinite; animation: rotate 6s linear -5s infinite;
z-index: 20; z-index: 20;
} }
} }
@keyframes rotate { @keyframes rotate {
50% { 50% {
transform: translate(-50%, -73%) rotate(180deg); transform: translate(-50%, -73%) rotate(180deg);
} }
100% { 100% {
transform: translate(-50%, -70%) rotate(360deg); transform: translate(-50%, -70%) rotate(360deg);
} }
} }
} }
</style> </style>

908
pages/record/foods.vue
View File

@@ -7,530 +7,446 @@
--> -->
<template> <template>
<view class="record--foods"> <view class="record--foods">
<!-- 饮食进度条 --> <!-- 饮食进度条 -->
<view class="cricle-content"> <view class="cricle-content">
<view class="info"> <view class="info">
饮食摄入 饮食摄入
<span>{{ calorys.intake_total }}</span> <span>{{ calorys.intake_total }}</span>
</view> </view>
<arprogress <arprogress
:percent="calorys.exceeds ? 100 : calorys.ratio" :percent="calorys.exceeds ? 100 : calorys.ratio"
inactiveColor="#f5f4f9" inactiveColor="#f5f4f9"
:activeColor="calorys.exceeds ? '#f00' : '#34ce98'" :activeColor="calorys.exceeds ? '#f00' : '#34ce98'"
width="300" width="300"
class="cricle" class="cricle"
borderWidth="20" borderWidth="20"
> >
<span>{{ calorys.exceeds ? '多吃了' : '还可以吃' }}</span> <span>{{ calorys.exceeds ? '多吃了' : '还可以吃' }}</span>
<span :class="['num', calorys.exceeds ? 'num1' : '']">{{ calorys.amount }}</span> <span :class="['num', calorys.exceeds ? 'num1' : '']">{{ calorys.amount }}</span>
<span>推荐预算{{ calorys.goal }}</span> <span>推荐预算{{ calorys.goal }}</span>
</arprogress> </arprogress>
<view <view class="info" @click="errToast">
class="info" 运动消耗
@click="errToast" <span>{{ calorys.exercise_total }}</span>
> </view>
运动消耗 <view class="ic-left">摄入量推荐</view>
<span>{{ calorys.exercise_total }}</span> <u-icon class="ic-day" name="checkmark-circle" color="#34ce98" size="10" :label="`${calorys.days}天`" labelColor="#34ce98" labelSize="10" space="3" />
</view> </view>
<view class="ic-left">摄入量推荐</view>
<u-icon
class="ic-day"
name="checkmark-circle"
color="#34ce98"
size="10"
:label="`${calorys.days}天`"
labelColor="#34ce98"
labelSize="10"
space="3"
/>
</view>
<!-- 有饮食记录 --> <!-- 有饮食记录 -->
<template v-if="intakes.length > 0"> <template v-if="intakes.length > 0">
<view <view class="foods-add" v-for="(it, index) in intakes" :key="index">
class="foods-add" <view class="foods-title">
v-for="(it, index) in intakes" <view class="title-left">
:key="index" {{ it.name }}
> <span v-if="it.remark">{{ it.remark || '' }}</span>
<view class="foods-title"> </view>
<view class="title-left"> <view class="title-right">
{{ it.name }} {{ it.total }}
<span v-if="it.remark">{{ it.remark || '' }}</span> <span class="dw">千卡</span>
</view> <u-icon name="arrow-right" color="#ddd" size="13" :bold="true" />
<view class="title-right"> </view>
{{ it.total }} </view>
<span class="dw">千卡</span> <goodsList :lists="it.intake" type="no-dian" @editGoods="editGoods" @longClickGoods="longClickGoods" />
<u-icon </view>
name="arrow-right" </template>
color="#ddd" <!-- 运动列表 -->
size="13" <template v-if="sportsTotal > 0">
:bold="true" <view class="foods-title" style="padding-top:50rpx;">
/> <view class="title-left">运动</view>
</view> <view class="title-right">
</view> {{ sportsTotal }}
<goodsList <span class="dw">千卡</span>
:lists="it.intake" <u-icon name="arrow-right" color="#ddd" size="13" :bold="true" />
type="no-dian" </view>
@editGoods="editGoods" </view>
@longClickGoods="longClickGoods"
/>
</view>
</template>
<!-- 运动列表 -->
<template v-if="sportsTotal > 0">
<view
class="foods-title"
style="padding-top:50rpx;"
>
<view class="title-left">运动</view>
<view class="title-right">
{{ sportsTotal }}
<span class="dw">千卡</span>
<u-icon
name="arrow-right"
color="#ddd"
size="13"
:bold="true"
/>
</view>
</view>
<sports <sports type="edit" :lists="sports" @editSport="editSport" @longClick="longClick" />
type="edit" </template>
:lists="sports"
@editSport="editSport"
@longClick="longClick"
/>
</template>
<!-- 没有饮食记录 --> <!-- 没有饮食记录 -->
<view <view class="no-foods" v-if="sports.length === 0 && intakes.length === 0">
class="no-foods" <u-image :src="require('../../static/imgs/no-foods.png')" :lazy-load="true" radius="10rpx" mode="widthFix" width="300rpx" class="no-foods-img" />
v-if="sports.length === 0 && intakes.length === 0" <view>还没有添加今日饮食记录</view>
> <view>请点击屏幕下方按钮来添加</view>
<u-image </view>
:src="require('../../static/imgs/no-foods.png')"
:lazy-load="true"
radius="10rpx"
mode="widthFix"
width="300rpx"
class="no-foods-img"
/>
<view>还没有添加今日饮食记录</view>
<view>请点击屏幕下方按钮来添加</view>
</view>
<!-- 加餐模块 --> <!-- 加餐模块 -->
<u-action-sheet <u-action-sheet
:actions="addEatList" :actions="addEatList"
title="加餐模块" title="加餐模块"
:closeOnClickOverlay="true" :closeOnClickOverlay="true"
:closeOnClickAction="true" :closeOnClickAction="true"
@select="selectClick" @select="selectClick"
cancelText="取消" cancelText="取消"
:show="addEatShow" :show="addEatShow"
@close="addEatShow = false" @close="addEatShow = false"
></u-action-sheet> ></u-action-sheet>
<!-- 底部 早餐等菜单 --> <!-- 底部 早餐等菜单 -->
<u-tabbar <u-tabbar :fixed="true" :placeholder="true" :safeAreaInsetBottom="true" inactiveColor="#333" @click="tabbarClick">
:fixed="true" <u-tabbar-item text="+早餐" @click="tabbarClick" :icon="require('../../static/imgs/foods-1.png')" />
:placeholder="true" <u-tabbar-item text="+午餐" @click="tabbarClick" :icon="require('../../static/imgs/foods-2.png')" />
:safeAreaInsetBottom="true" <u-tabbar-item text="+晚餐" @click="tabbarClick" :icon="require('../../static/imgs/foods-3.png')" />
inactiveColor="#333" <u-tabbar-item text="+加餐" @click="tabbarClick" :icon="require('../../static/imgs/foods-4.png')" />
@click="tabbarClick" <u-tabbar-item text="+运动" @click="tabbarClick" :icon="require('../../static/imgs/foods-5.png')" />
> </u-tabbar>
<u-tabbar-item
text="+早餐"
@click="tabbarClick"
:icon="require('../../static/imgs/foods-1.png')"
/>
<u-tabbar-item
text="+午餐"
@click="tabbarClick"
:icon="require('../../static/imgs/foods-2.png')"
/>
<u-tabbar-item
text="+晚餐"
@click="tabbarClick"
:icon="require('../../static/imgs/foods-3.png')"
/>
<u-tabbar-item
text="+加餐"
@click="tabbarClick"
:icon="require('../../static/imgs/foods-4.png')"
/>
<u-tabbar-item
text="+运动"
@click="tabbarClick"
:icon="require('../../static/imgs/foods-5.png')"
/>
</u-tabbar>
<!-- 修改食品弹窗 --> <!-- 修改食品弹窗 -->
<!-- 添加食谱弹窗 --> <!-- 添加食谱弹窗 -->
<addFoods <addFoods
v-if="addShow" v-if="addShow"
:addShow="addShow" :addShow="addShow"
:selectGoods="selectGoods" :selectGoods="selectGoods"
:decimals="true" :decimals="true"
@confirm="confirmHandle" @confirm="confirmHandle"
@close="closeHandle" @close="closeHandle"
@delThis="delThis" @delThis="delThis"
@tabGoodsInfo="tabGoodsInfo" @tabGoodsInfo="tabGoodsInfo"
max="999" max="999"
/> />
<!-- 修改运动弹窗 --> <!-- 修改运动弹窗 -->
<addPopup <addPopup :selectSports="selectSports" :addSportsShow="addSportsShow" @comfirmSport="comfirmSport" @cancleSport="cancleSport" @delSport="delSport" />
:selectSports="selectSports" </view>
:addSportsShow="addSportsShow"
@comfirmSport="comfirmSport"
@cancleSport="cancleSport"
@delSport="delSport"
/>
</view>
</template> </template>
<script> <script>
import arprogress from "@/components/ar-circle-progress/index.vue"; import arprogress from '@/components/ar-circle-progress/index.vue';
import goodsList from "@/components/foods"; import goodsList from '@/components/foods';
import { import { plans, editHealthFoods, delHealthFoods } from '@/apis/interfaces/foods.js';
plans, import moment from 'moment';
editHealthFoods, import addFoods from '@/components/add-goods-template/add-goods-template';
delHealthFoods, import addPopup from '@/components/sports/addPopup';
} from "@/apis/interfaces/foods.js"; import sports from '@/components/sports';
import moment from "moment"; import { editHealthSports, delHealthSports } from '@/apis/interfaces/sport.js';
import addFoods from "@/components/add-goods-template/add-goods-template";
import addPopup from "@/components/sports/addPopup";
import sports from "@/components/sports";
import { editHealthSports, delHealthSports } from "@/apis/interfaces/sport.js";
export default { export default {
components: { components: {
arprogress, arprogress,
goodsList, goodsList,
addFoods, addFoods,
addPopup, addPopup,
sports, sports
}, },
data() { data() {
return { return {
lists: [], lists: [],
addShow: false, // 添加食品显示 addShow: false, // 添加食品显示
selectGoods: [], // 选择新增的食品 selectGoods: [], // 选择新增的食品
addEatShow: false, // 加餐弹窗默认不显示 addEatShow: false, // 加餐弹窗默认不显示
addEatList: [ addEatList: [
{ {
name: "上午加餐", name: '上午加餐',
type: 2, type: 2
}, },
{ {
name: "下午加餐", name: '下午加餐',
type: 4, type: 4
}, },
{ {
name: "晚上加餐", name: '晚上加餐',
type: 6, type: 6
}, }
], ],
today: moment(new Date()).format("YYYY-MM-DD"), today: moment(new Date()).format('YYYY-MM-DD'),
calorys: {}, // 当日食谱推荐页面的信息 calorys: {}, // 当日食谱推荐页面的信息
intakes: [], // 当日摄入列表 intakes: [], // 当日摄入列表
sports: [], // 运动列表 sports: [], // 运动列表
sportsTotal: 0, sportsTotal: 0,
addSportsShow: false, // 添加运动弹窗显示 addSportsShow: false, // 添加运动弹窗显示
selectSports: {}, // 选择新增的运动 selectSports: {} // 选择新增的运动
}; };
}, },
onShow() { onShow() {
this.getList(); this.getList();
}, },
methods: { methods: {
// 编辑运动 // 编辑运动
editSport(item) { editSport(item) {
this.selectSports = { this.selectSports = {
name: item.sport.name, name: item.sport.name,
calory: item.sport.calory, calory: item.sport.calory,
cover: item.sport.cover, cover: item.sport.cover,
duration: item.duration, duration: item.duration,
sport_id: item.sport.sport_id, sport_id: item.sport.sport_id,
exercise_id: item.exercise_id, exercise_id: item.exercise_id,
title: "编辑运动", title: '编辑运动'
}; };
// console.log(this.selectSports); // console.log(this.selectSports);
console.log("编辑运动", item); console.log('编辑运动', item);
this.addSportsShow = true; this.addSportsShow = true;
}, },
// 弹窗确认按钮新增 这里接口报错了 ， // 弹窗确认按钮新增 这里接口报错了 ，
comfirmSport(show, duration) { comfirmSport(show, duration) {
let params = { let params = {
unit: "1", // 时间单位：分钟 1 小时 2 unit: '1', // 时间单位：分钟 1 小时 2
duration: duration, // 时常 duration: duration, // 时常
exercise_id: this.selectSports.exercise_id, // exercise_id: this.selectSports.exercise_id, //
sport_id: this.selectSports.sport_id, // 运动id sport_id: this.selectSports.sport_id, // 运动id
date: this.today, // 日期 date: this.today // 日期
}; };
console.log(params); console.log(params);
editHealthSports(params).then((res) => { editHealthSports(params).then(res => {
this.addSportsShow = false; this.addSportsShow = false;
this.selectSports = {}; this.selectSports = {};
this.getList(); this.getList();
}); }).catch(err=>{
console.log("弹窗确认按钮新增"); uni.showToast({
}, title:err.message,
icon:'none'
})
});
},
// 弹窗取消按钮 // 弹窗取消按钮
cancleSport(show) { cancleSport(show) {
this.addSportsShow = show; this.addSportsShow = show;
console.log("弹窗取消按钮"); },
}, // 删除运动
// 删除运动 delSport() {
delSport() { let params = {
let params = { exercise_id: this.selectSports.exercise_id //
exercise_id: this.selectSports.exercise_id, // };
}; console.log(params);
console.log(params); delHealthSports(params).then(res => {
delHealthSports(params).then((res) => { this.addSportsShow = false;
this.addSportsShow = false; this.selectSports = {};
this.selectSports = {}; this.getList();
this.getList(); });
}); },
}, // 长按删除触发事件运动
// 长按删除触发事件运动 longClick(item) {
longClick(item) { this.selectSports = item;
this.selectSports = item; uni.showModal({
uni.showModal({ content: '确认删除么？',
content: "确认删除么？", confirmText: '确认删除',
confirmText: "确认删除", confirmColor: '#34ce98',
confirmColor: "#34ce98", cancelText: '再想想',
cancelText: "再想想", cancelColor: '#ddd',
cancelColor: "#ddd", success: res => {
success: (res) => { if (res.confirm) {
if (res.confirm) { this.delSport();
this.delSport(); }
} }
}, });
}); },
}, // 长按删除食品
// 长按删除食品 longClickGoods(e) {
longClickGoods(e) { this.selectGoods = [e];
this.selectGoods = [e]; uni.showModal({
uni.showModal({ content: '确认删除么？',
content: "确认删除么？", confirmText: '确认删除',
confirmText: "确认删除", confirmColor: '#34ce98',
confirmColor: "#34ce98", cancelText: '再想想',
cancelText: "再想想", cancelColor: '#ddd',
cancelColor: "#ddd", success: res => {
success: (res) => { if (res.confirm) {
if (res.confirm) { this.delThis();
this.delThis(); }
} }
}, });
}); },
}, // 错误提示
// 错误提示 errToast() {
errToast() { uni.showToast({
uni.showToast({ title: '努力开发中~',
title: "努力开发中~", icon: 'none'
icon: "none", });
}); },
}, getList() {
getList() { plans(this.today).then(res => {
plans(this.today).then((res) => { this.calorys = res.calorys;
this.calorys = res.calorys; this.calorys.ratio = Number(this.calorys.ratio);
this.calorys.ratio = Number(this.calorys.ratio); this.intakes = res.intakes;
this.intakes = res.intakes; this.sports = res.exercises.lists;
this.sports = res.exercises.lists; this.sportsTotal = res.exercises.total;
this.sportsTotal = res.exercises.total; });
}); },
}, // 底部按钮点击触发的事件 早餐1 午餐3 晚餐5 加餐(早2中4晚6)
// 底部按钮点击触发的事件 早餐1 午餐3 晚餐5 加餐(早2中4晚6) tabbarClick(e) {
tabbarClick(e) { console.log(e);
console.log(e); this.tabarIndex = e;
this.tabarIndex = e; if (e === 3) {
if (e === 3) { this.addEatShow = true;
this.addEatShow = true; } else {
} else { if (e === 4) {
if (e === 4) { // 新增运动
// 新增运动 uni.navigateTo({
uni.navigateTo({ url: `/pages/record/addExercises`
url: `/pages/record/addExercises`, });
}); } else {
} else { uni.navigateTo({
uni.navigateTo({ url: `/pages/record/addFoods?type=${e === 0 ? 1 : e === 1 ? 3 : 5}`
url: `/pages/record/addFoods?type=${ });
e === 0 ? 1 : e === 1 ? 3 : 5 }
}`, }
}); },
} // 选择了加餐跳转
} selectClick(e) {
}, uni.navigateTo({
// 选择了加餐跳转 url: `/pages/record/addFoods?type=${e.type}`
selectClick(e) { });
uni.navigateTo({ // 选择加餐
url: `/pages/record/addFoods?type=${e.type}`, },
}); // 编辑食品
// 选择加餐 editGoods(e) {
}, this.selectGoods = [e];
// 编辑食品 this.addShow = true;
editGoods(e) { },
this.selectGoods = [e]; closeHandle() {
this.addShow = true; //键盘关闭的回调函数
}, this.addShow = false;
closeHandle() { },
//键盘关闭的回调函数 // 监听点击键盘触发返回值新增食品
this.addShow = false; confirmHandle(value) {
}, // 新添加食物
// 监听点击键盘触发返回值新增食品 let data = {
confirmHandle(value) { ser: 1,
// 新添加食物 weight: value,
let data = { food_id: this.selectGoods[0].food_id,
ser: 1, intake_id: this.selectGoods[0].intake_id
weight: value, };
food_id: this.selectGoods[0].food_id, this.editHealthFoods(data);
intake_id: this.selectGoods[0].intake_id, },
}; // 添加食物
this.editHealthFoods(data); editHealthFoods(data) {
}, editHealthFoods(data).then(res => {
// 添加食物 console.log(res);
editHealthFoods(data) { this.addShow = false;
editHealthFoods(data).then((res) => { this.getList();
console.log(res); });
this.addShow = false; },
this.getList(); // 删除该食物
}); delThis(e) {
}, delHealthFoods(this.selectGoods[0].intake_id).then(res => {
// 删除该食物 this.addShow = false;
delThis(e) { this.getList();
delHealthFoods(this.selectGoods[0].intake_id).then((res) => { });
this.addShow = false; },
this.getList(); // 跳转到食品详情
}); tabGoodsInfo(e) {
}, this.$Router.push({
// 跳转到食品详情 name: 'rankingDetails',
tabGoodsInfo(e) { params: e
this.$Router.push({ });
name: "rankingDetails", }
params: e, }
});
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.record--foods { .record--foods {
padding: $padding $padding $padding * 7 $padding; padding: $padding $padding $padding * 7 $padding;
// background: green; // background: green;
} }
// 饮食进度条 // 饮食进度条
.cricle-content { .cricle-content {
box-shadow: 0 0 4rpx 4rpx rgba($color: $main-color, $alpha: 0.1); box-shadow: 0 0 4rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
font-size: $title-size-m - 6; font-size: $title-size-m - 6;
padding: $padding * 1.8 $padding; padding: $padding * 1.8 $padding;
border-radius: $radius; border-radius: $radius;
color: $text-gray-m; color: $text-gray-m;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-around;
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
.cricle { .cricle {
.num { .num {
color: $text-color; color: $text-color;
font-size: $title-size * 1.8; font-size: $title-size * 1.8;
font-weight: bold; font-weight: bold;
padding: $padding * 0.2; padding: $padding * 0.2;
} }
.num1 { .num1 {
color: #f00; color: #f00;
} }
} }
.info { .info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
span { span {
font-size: $title-size + 10; font-size: $title-size + 10;
font-weight: bold; font-weight: bold;
color: $text-color; color: $text-color;
padding-top: $padding * 0.5; padding-top: $padding * 0.5;
} }
} }
.ic-left { .ic-left {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
background-image: linear-gradient(to right, #ffebb9, #fbd57b); background-image: linear-gradient(to right, #ffebb9, #fbd57b);
color: #664710; color: #664710;
padding: 10rpx $padding * 0.6; padding: 10rpx $padding * 0.6;
border-radius: 0 0 $radius 0; border-radius: 0 0 $radius 0;
} }
.ic-day { .ic-day {
position: absolute; position: absolute;
right: $padding; right: $padding;
top: $padding; top: $padding;
} }
} }
// 没有饮食记录 // 没有饮食记录
.no-foods { .no-foods {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
font-size: $title-size-m - 4; font-size: $title-size-m - 4;
color: $text-gray-m; color: $text-gray-m;
min-height: 40vh; min-height: 40vh;
// background: pink; // background: pink;
.no-foods-img { .no-foods-img {
opacity: 0.5; opacity: 0.5;
} }
view { view {
padding: $padding * 0.2; padding: $padding * 0.2;
} }
} }
// 饮食记录 早中晚加餐等 // 饮食记录 早中晚加餐等
.foods-add { .foods-add {
border-bottom: solid 1rpx #f7f7f7; border-bottom: solid 1rpx #f7f7f7;
margin-top: $margin; margin-top: $margin;
} }
// 主标题 // 主标题
.foods-title { .foods-title {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
box-sizing: border-box; box-sizing: border-box;
color: $text-color; color: $text-color;
padding: $padding * 0.5 0; padding: $padding * 0.5 0;
.title-left { .title-left {
font-size: $title-size; font-size: $title-size;
color: $text-color; color: $text-color;
font-weight: bold; font-weight: bold;
span { span {
font-weight: normal; font-weight: normal;
font-size: $title-size-m - 6; font-size: $title-size-m - 6;
color: $text-gray-m; color: $text-gray-m;
margin-left: $margin - 10; margin-left: $margin - 10;
} }
} }
.title-right { .title-right {
font-size: $title-size-m - 6; font-size: $title-size-m - 6;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
color: $main-color; color: $main-color;
.dw { .dw {
margin: 0 $margin * 0.6 0 $margin * 0.4; margin: 0 $margin * 0.6 0 $margin * 0.4;
color: $text-gray; color: $text-gray;
} }
} }
} }
</style> </style>

50
uni_modules/onemue-USQLite/js_sdk/usqlite.js
View File

@@ -2,7 +2,7 @@
* 对 SQLite 的 ORM 的封装处理 * 对 SQLite 的 ORM 的封装处理
* @time 2021-12-30 11:00:00 * @time 2021-12-30 11:00:00
* @version 2.0.0 * @version 2.0.0
* *
* @by onemue * @by onemue
*/ */
@@ -38,9 +38,9 @@ class Utils {
} }
} }
Utils.log(primaryKeyArr.length); Utils.log(primaryKeyArr.length);
if (primaryKeyArr.length >= 1) { if (primaryKeyArr.length>=1) {
sql = `CREATE TABLE '${name}' (${sqlArr.join(', ')}, PRIMARY KEY (${primaryKeyArr.join()}))`; sql = `CREATE TABLE '${name}' (${sqlArr.join(', ')}, PRIMARY KEY (${primaryKeyArr.join()}))`;
} else { }else{
sql = `CREATE TABLE '${name}' (${sqlArr.join(', ')})`; sql = `CREATE TABLE '${name}' (${sqlArr.join(', ')})`;
} }
Utils.log(`modelSql :${sql}`); Utils.log(`modelSql :${sql}`);
@@ -119,7 +119,7 @@ class Model {
* @constructor * @constructor
* @param {String} name 数据库表名 * @param {String} name 数据库表名
* @param {Object} options 数据表列对象 * @param {Object} options 数据表列对象
* @returns * @returns
*/ */
constructor(name, options) { constructor(name, options) {
let self = this; let self = this;
@@ -135,11 +135,11 @@ class Model {
/** /**
* @description 查询表数据 * @description 查询表数据
* @param {String|Array} options * @param {String|Array} options
* - String WHERE 内容 * - String WHERE 内容
* - Array 需要查询的列 * - Array 需要查询的列
* @param {*} callback * @param {*} callback
* @returns * @returns
*/ */
find(options, callback) { find(options, callback) {
let sql = ''; let sql = '';
@@ -173,7 +173,7 @@ class Model {
/** /**
* @description 分页查询 * @description 分页查询
* @param {Object} options : { where:查询条件, number: 当前页数 , count : 每页数量 } * @param {Object} options : { where:查询条件, number: 当前页数 , count : 每页数量 }
* @param {Function} callback :（err,results）=>{} * @param {Function} callback :（err,results）=>{}
* @return * @return
*/ */
limit(options, callback) { limit(options, callback) {
@@ -223,7 +223,7 @@ class Model {
} else if (options.constructor == Object) { } else if (options.constructor == Object) {
let keys = []; let keys = [];
let values = []; let values = [];
let index = arguments[3] ?? null; let index = arguments[3]??null;
for (var key in options) { for (var key in options) {
keys.push(key); keys.push(key);
values.push(`'${options[key]}'`); values.push(`'${options[key]}'`);
@@ -236,13 +236,13 @@ class Model {
name: config.name, name: config.name,
sql: sql, sql: sql,
success(e) { success(e) {
if (index) { if(index){
callback(null, e, options, index); callback(null, e, options, index);
} }
callback(null, e, options); callback(null, e, options);
}, },
fail(e) { fail(e) {
if (index) { if(index){
callback(e, null, options, index); callback(e, null, options, index);
} }
callback(e, null, options); callback(e, null, options);
@@ -256,7 +256,7 @@ class Model {
/** /**
* @description 更新数据 * @description 更新数据
* @param {Object} options：可选参数 更新条件 * @param {Object} options：可选参数 更新条件
* @param {Object} obj： 修改后的数据 * @param {Object} obj： 修改后的数据
* @param {Function} callback :（err,results）=>{} * @param {Function} callback :（err,results）=>{}
*/ */
update(options, obj, callback) { update(options, obj, callback) {
@@ -332,7 +332,7 @@ class Model {
* @description 重命名或者新增列 * @description 重命名或者新增列
* @param {Object} options 参数 数组为新增多列 对象为新增单列{aa} 字符串重命名 * @param {Object} options 参数 数组为新增多列 对象为新增单列{aa} 字符串重命名
* @param {Function} callback :（err,results）=>{} * @param {Function} callback :（err,results）=>{}
* @return: * @return:
*/ */
alter(options, callback) { alter(options, callback) {
let self = this; let self = this;
@@ -366,11 +366,11 @@ class Model {
return this; return this;
} }
/** /**
* @description * @description
* @param {Model} model 右 Model * @param {Model} model 右 Model
* @param {Object} options * @param {Object} options
* @param {Function} callback * @param {Function} callback
* @returns * @returns
*/ */
join(model, options, callback) { join(model, options, callback) {
if (!model) { if (!model) {
@@ -445,8 +445,8 @@ class Model {
} }
/** /**
* @description 判断是否存在 * @description 判断是否存在
* @param {Function} callback * @param {Function} callback
*/ */
isExist(callback) { isExist(callback) {
let sql = `SELECT count(*) AS isExist FROM sqlite_master WHERE type='table' AND name='${this.name}'`; let sql = `SELECT count(*) AS isExist FROM sqlite_master WHERE type='table' AND name='${this.name}'`;
@@ -467,7 +467,7 @@ class Model {
} }
/** /**
* @description 删除数据表 **不推荐** * @description 删除数据表 **不推荐**
* @param {Function} callback * @param {Function} callback
*/ */
drop(callback) { drop(callback) {
var sql = `DROP TABLE '${this.name}'`; var sql = `DROP TABLE '${this.name}'`;
@@ -490,7 +490,7 @@ class Model {
/** /**
* @description 创建数据表 **不推荐** * @description 创建数据表 **不推荐**
* @param {Function} callback * @param {Function} callback
*/ */
create(callback) { create(callback) {
let self = this; let self = this;
@@ -528,7 +528,7 @@ class Model {
}); });
} }
// TODO 更新表结构 // TODO 更新表结构
// TODO 数据表备份?? // TODO 数据表备份??
// TODO 多表联查 // TODO 多表联查
// TODO 下班了其他的想不起来 回头再说 // TODO 下班了其他的想不起来 回头再说
} }
@@ -542,7 +542,7 @@ export class usqlite {
* {name: 'demo', path: '_doc/demo.db'} * {name: 'demo', path: '_doc/demo.db'}
* - name 数据库名称* * - name 数据库名称*
* - path 数据库路径 * - path 数据库路径
* @param {Function} callback * @param {Function} callback
*/ */
constructor(options, callback) { constructor(options, callback) {
console.warn('No instantiation'); console.warn('No instantiation');
@@ -553,7 +553,7 @@ export class usqlite {
* {name: 'demo', path: '_doc/demo.db'} * {name: 'demo', path: '_doc/demo.db'}
* - name 数据库名称* * - name 数据库名称*
* - path 数据库路径 * - path 数据库路径
* @param {Function} callback * @param {Function} callback
*/ */
static connect(options, callback) { static connect(options, callback) {
config.name = options.name; // 数据库名称* config.name = options.name; // 数据库名称*
@@ -576,7 +576,7 @@ export class usqlite {
} }
/** /**
* @description 断开数据库 * @description 断开数据库
* @param {*} callback * @param {*} callback
*/ */
static close(callback) { static close(callback) {
plus.sqlite.closeDatabase({ plus.sqlite.closeDatabase({