记录模块接口对接
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>
|
||||
|
||||
Reference in New Issue
Block a user