diff --git a/apis/interfaces/sport.js b/apis/interfaces/sport.js
new file mode 100644
index 0000000..55530bb
--- /dev/null
+++ b/apis/interfaces/sport.js
@@ -0,0 +1,60 @@
+/*
+ * @Description:运动模块
+ * @Author: Aimee·Zhang
+ * @Date: 2022-01-19 13:20:39
+ * @LastEditors: Aimee·Zhang
+ * @LastEditTime: 2022-01-20 09:12:34
+ */
+import { request } from '../index'
+/**
+ * @description:动列表
+ * @params {*} 可翻页 按名称筛选
+ * @Date: 2022-01-19 13:21:35
+ */
+
+const healthSports = (data) => {
+	return request({
+		url: 'health/sports',
+		data: data
+	})
+}
+
+/**
+ * @description:添加运动
+ * @Date: 2022-01-19 13点27分
+ */
+const addHealthSports = (data) => {
+	return request({
+		url: 'health/exercises',
+		method: 'POST',
+		data: data
+	})
+}
+/**
+ * @description:编辑运动
+ * @Date: 2022-01-19 17:15:31
+ */
+const editHealthSports = (data) => {
+	return request({
+		url: `health/exercises/${data.exercise_id}`,
+		method: 'PUT',
+		data: data
+	})
+}
+
+/**
+ * @description: 删除运动
+ * @Date: 2022-01-20 09:12:35
+ */
+const delHealthSports = (data) => {
+	return request({
+		url: `health/exercises/${data.exercise_id}`,
+		method: 'DELETE'
+	})
+}
+export {
+	healthSports,
+	addHealthSports,
+	editHealthSports,
+	delHealthSports
+}
diff --git a/components/foods/index.vue b/components/foods/index.vue
index 94fefd1..c2c7264 100644
--- a/components/foods/index.vue
+++ b/components/foods/index.vue
@@ -4,7 +4,7 @@
  * @Author: Aimee·Zhang
  * @Date: 2022-01-11 12:08:34
  * @LastEditors: Aimee·Zhang
- * @LastEditTime: 2022-01-13 11:19:06
+ * @LastEditTime: 2022-01-20 10:03:43
 -->
 
 <template>
@@ -59,7 +59,8 @@
                 <view
                     class="lists-right"
                     v-else-if="type==='no-dian'"
-                    @click="editGoods(foodsItem)"
+                    @click.stop="editGoods(foodsItem)"
+                    @longpress.stop="longClickGoods(foodsItem)"
                 >
                     <view class="lists-title">
                         {{foodsItem.name}}
@@ -116,6 +117,10 @@ export default {
         editGoods(item) {
             this.$emit("editGoods", item);
         },
+        // 长按删除
+        longClickGoods(item) {
+            this.$emit("longClickGoods", item);
+        },
     },
 };
 </script>
diff --git a/components/sports/addPopup.vue b/components/sports/addPopup.vue
new file mode 100644
index 0000000..e9649a9
--- /dev/null
+++ b/components/sports/addPopup.vue
@@ -0,0 +1,205 @@
+
+<!--
+ * @Description:运动列表
+ * @Author: Aimee·Zhang
+ * @Date: 2022-01-19 15:07:02
+ * @LastEditors: Aimee·Zhang
+ * @LastEditTime: 2022-01-20 09:09:59
+-->
+
+<template>
+    <view class="foods--lists">
+        <u-popup
+            :show="addSportsShow"
+            :round="4"
+            mode="center"
+        >
+            <view class="popup">
+                <view class="popup-title">
+                    <span @click="cancleSport">取消</span>
+                    <span class="title">{{selectSports.title || '新增运动'}}</span>
+                    <span @click="comfirmSport">确认</span>
+                </view>
+                <view class="popup-item">
+                    <u-image
+                        :lazy-load="true"
+                        :src="selectSports.cover?selectSports.cover:require('../../static/imgs/apple.png')"
+                        radius="10"
+                        width="140rpx"
+                        height="140rpx"
+                        class="goods-img"
+                    />
+                    <view class="popup-item-title">
+                        {{selectSports.name}}
+                        <view class="des"><span>{{selectSports.calory || '0.0'}}</span> 千卡/60分钟</view>
+                    </view>
+                    <u-icon
+                        v-if="selectSports.title === '编辑运动'"
+                        name="trash"
+                        color="#ddd"
+                        size="20"
+                        label="删除这条数据"
+                        labelColor="#ddd"
+                        :bold="true"
+                        @click="delSport"
+                        style="padding-top: 30rpx;"
+                    />
+                </view>
+                <u-input
+                    placeholder="60"
+                    class="select-time"
+                    v-model="duration"
+                >
+                    <u--text
+                        text="运动时间："
+                        slot="prefix"
+                        margin="0 3px 0 0"
+                        type="tips"
+                    />
+                    <u--text
+                        text="分钟"
+                        slot="suffix"
+                        margin="0 3px 0 0"
+                        type="tips"
+                    />
+                </u-input>
+                <view class="all-calory"> ≈ <span> {{total}} </span> 千卡</view>
+            </view>
+        </u-popup>
+    </view>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            duration: 60,
+        };
+    },
+    props: {
+        selectSports: {
+            type: Object,
+            default: {},
+        },
+        addSportsShow: {
+            type: Boolean,
+            default: false,
+        },
+    },
+    computed: {
+        total() {
+            return ((this.selectSports.calory * this.duration) / 60).toFixed(0);
+        },
+    },
+    watch: {
+        addSportsShow() {
+            this.duration = 60;
+        },
+        selectSports(val) {
+            console.log(val);
+            this.duration = val.duration;
+            console.log("监听传过来的参数");
+        },
+    },
+    methods: {
+        // 弹窗确认和取消功能
+        comfirmSport() {
+            this.$emit("comfirmSport", true, this.duration);
+        },
+        // 取消按钮触发事件
+        cancleSport() {
+            this.$emit("cancleSport", false);
+        },
+        // 删除按钮触发事件
+        delSport() {
+            this.$emit("delSport");
+        },
+    },
+};
+</script>
+<style lang="scss" scoped>
+// 列表
+.foods--lists {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    box-sizing: border-box;
+    margin-top: $margin;
+    // 弹窗样式
+    .popup {
+        width: 600rpx;
+        // min-height: 700rpx;
+        position: relative;
+        .popup-title {
+            color: $main-color;
+            font-size: $title-size + 4;
+            border-bottom: solid 1rpx #f9f9f9;
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: space-between;
+            box-sizing: border-box;
+            span {
+                padding: $padding + 10 $padding;
+            }
+            .title {
+                color: $text-color;
+            }
+        }
+
+        .popup-item {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            padding: $padding * 2 $padding $padding $padding;
+            font-size: $title-size + 4;
+            color: $text-color;
+            border-bottom: solid 1rpx #f9f9f9;
+            .popup-item-title {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+                box-sizing: border-box;
+                padding-top: $padding;
+                .des {
+                    padding-top: $padding * 0.4;
+                    span {
+                        color: $text-price;
+                        padding-right: $padding * 0.3;
+                    }
+                }
+            }
+        }
+
+        .select-time {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            padding: $padding 0;
+            // background: $main-color;
+            color: #fff;
+            margin: $margin * 3 0 $margin * 2 0;
+            width: 90%;
+            border-radius: 10rpx;
+            margin-left: 5%;
+        }
+        .all-calory {
+            position: absolute;
+            bottom: $padding * 6;
+            right: $padding;
+            font-size: $title-size-m;
+            color: $text-gray-m;
+            span {
+                padding: 0 $padding * 0.4;
+                font-size: $title-size + 10;
+                color: $main-color;
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/components/sports/index.vue b/components/sports/index.vue
new file mode 100644
index 0000000..c62b086
--- /dev/null
+++ b/components/sports/index.vue
@@ -0,0 +1,212 @@
+
+<!--
+ * @Description:运动列表
+ * @Author: Aimee·Zhang
+ * @Date: 2022-01-19 15:07:02
+ * @LastEditors: Aimee·Zhang
+ * @LastEditTime: 2022-01-20 10:03:27
+-->
+
+<template>
+    <view class="foods--lists">
+        <view
+            class="foods-lists"
+            v-for="sportItem in lists"
+            :key="sportItem.sport_id"
+        >
+            <view class="lists-left">
+                <u-image
+                    :src="sportItem.cover?sportItem.cover:require('../../static/imgs/apple.png')"
+                    :lazy-load="true"
+                    v-if="type === 'add'"
+                    radius="10rpx"
+                    width="100rpx"
+                    height="100rpx"
+                    class="goods-img"
+                />
+                <!-- 新增-->
+                <view
+                    class="lists-right"
+                    v-if="type === 'add'"
+                    @click="addSport(sportItem)"
+                >
+                    <view class="lists-title">
+                        {{sportItem.name}}
+                        <view class="des"><span>{{sportItem.calory}}</span> 千卡/60分钟</view>
+                    </view>
+                    <u-icon
+                        name="arrow-right"
+                        color="#ddd"
+                        size="13"
+                        :bold="true"
+                    />
+                </view>
+
+                <!-- 显示结果 -->
+                <u-image
+                    :src="sportItem.sport.cover?sportItem.sport.cover:require('../../static/imgs/apple.png')"
+                    :lazy-load="true"
+                    v-if="type === 'edit'"
+                    radius="10rpx"
+                    width="100rpx"
+                    height="100rpx"
+                    class="goods-img"
+                />
+                <view
+                    class="lists-right"
+                    v-if="type==='edit'"
+                    @click.stop="editSport(sportItem)"
+                    @longpress.stop="longClick(sportItem)"
+                >
+                    <view class="lists-title">
+                        {{sportItem.sport.name}}
+                        <view class="des">{{sportItem.duration}}分钟</view>
+                    </view>
+
+                    <view class="lists-right1">
+                        {{sportItem.calory}}<span class="dw">千卡</span>
+                        <u-icon
+                            name="arrow-right"
+                            color="#ddd"
+                            size="13"
+                            :bold="true"
+                        />
+                    </view>
+                </view>
+            </view>
+        </view>
+    </view>
+</template>
+<script>
+export default {
+    data() {
+        return {};
+    },
+    props: {
+        lists: {
+            type: Array,
+            default: [],
+        },
+        type: {
+            type: String,
+            default: "add",
+        },
+    },
+    methods: {
+        // 添加运动模块
+        addSport(item) {
+            this.$emit("addSport", item);
+        },
+        // 编辑运动
+        editSport(item) {
+            this.$emit("editSport", item);
+        },
+        // 长按删除触发事件
+        longClick(item) {
+            this.$emit("longClick", item);
+        },
+    },
+};
+</script>
+<style lang="scss" scoped>
+// 列表
+.foods-lists {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    box-sizing: border-box;
+    margin-top: $margin;
+    .lists-right {
+        flex: 1;
+        font-size: $title-size-m - 6;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-between;
+        box-sizing: border-box;
+        color: $text-gray-m;
+        border-bottom: solid 1rpx #f7f7f7;
+        margin-left: $margin * 0.8;
+        padding: $padding 0;
+        .dw {
+            margin: 0 $margin * 0.6 0 $margin * 0.4;
+        }
+        .lists-right1 {
+            font-size: $title-size-m - 6;
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            color: $text-gray-m;
+            font-weight: normal;
+            .dw {
+                margin: 0 $margin * 0.6 0 $margin * 0.4;
+            }
+        }
+    }
+
+    .goods-img {
+        box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
+        border-radius: 20rpx;
+        opacity: 0.4;
+    }
+    .lists-left {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-start;
+        align-items: center;
+        box-sizing: border-box;
+        font-size: $title-size - 2;
+        color: $text-color;
+        font-weight: bold;
+        flex: 1;
+        .lists-title {
+            display: flex;
+            flex-direction: column;
+            align-items: flex-start;
+            justify-content: center;
+            box-sizing: border-box;
+            font-size: $title-size-m;
+            color: $text-color;
+            .des {
+                margin-top: 10rpx;
+            }
+            span {
+                color: $text-price;
+                font-size: $title-size-m - 6;
+                font-weight: normal;
+                padding-right: $padding * 0.3;
+            }
+            .des {
+                color: $text-gray-m;
+                font-size: $title-size-m - 6;
+                font-weight: normal;
+            }
+        }
+    }
+    .dian {
+        width: 20rpx;
+        height: 20rpx;
+        border-radius: 50%;
+        margin-right: $margin;
+    }
+    .dian1 {
+        background: #fbbf0f;
+    }
+    .dian2 {
+        background: #fa624d;
+    }
+    .dian3 {
+        background: #02c7bd;
+    }
+    .dianlists {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: flex-end;
+        box-sizing: border-box;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/pages.json b/pages.json
index aa9dec8..b20cffd 100644
--- a/pages.json
+++ b/pages.json
@@ -1,5 +1,6 @@
 {
-    "pages": [{
+    "pages": [
+        {
             "path": "pages/index/index",
             "name": "Index",
             "style": {
@@ -67,6 +68,15 @@
                 "navigationBarTextStyle": "white"
             }
         },
+        {
+            "path": "pages/record/addExercises",
+            "name": "AddExercises",
+            "style": {
+                "navigationBarTitleText": "添加运动",
+                "navigationBarBackgroundColor": "#34CE98",
+                "navigationBarTextStyle": "white"
+            }
+        },
         {
             "path": "pages/evaluation/list",
             "name": "EvaluationList",
@@ -139,13 +149,15 @@
                 "app-plus": {
                     "titleNView": {
                         "backgroundColor": "#FFFFFF",
-                        "buttons": [{
-                            "float": "right",
-                            "text": "\ue603",
-                            "fontSrc": "/static/iconfont.ttf",
-                            "color": "#000",
-                            "fontSize": "20px"
-                        }]
+                        "buttons": [
+                            {
+                                "float": "right",
+                                "text": "\ue603",
+                                "fontSrc": "/static/iconfont.ttf",
+                                "color": "#000",
+                                "fontSize": "20px"
+                            }
+                        ]
                     }
                 }
             }
@@ -355,7 +367,8 @@
                 "navigationBarBackgroundColor": "#FFFFFF",
                 "app-plus": {
                     "titleNView": {
-                        "buttons": [{
+                        "buttons": [
+                            {
                                 "float": "left",
                                 "text": "\ue605",
                                 "fontSrc": "/static/iconfont.ttf",
@@ -381,21 +394,23 @@
                 "app-plus": {
                     "titleNView": {
                         "type": "default",
-                        "buttons": [{
-                            "float": "right",
-                            "fontSrc": "/static/iconfont.ttf",
-                            "text": "\ue607",
-                            "fontSize": "20px"
-                        }]
+                        "buttons": [
+                            {
+                                "float": "right",
+                                "fontSrc": "/static/iconfont.ttf",
+                                "text": "\ue607",
+                                "fontSize": "20px"
+                            }
+                        ]
                     }
                 }
             }
-        },
-        {
-            "path": "pages/im/private/setting",
-            "style": {
-                "navigationBarTitleText": "设置"
-            }
+        },
+        {
+            "path": "pages/im/private/setting",
+            "style": {
+                "navigationBarTitleText": "设置"
+            }
         },
         {
             "path": "pages/im/friends/index",
@@ -473,14 +488,16 @@
                     "titleNView": {
                         "backgroundImage": "linear-gradient(to right, #34ce98, #22aa98)",
                         "type": "transparent",
-                        "buttons": [{
-                            "float": "right",
-                            "text": "\ue607",
-                            "fontSrc": "/static/iconfont.ttf",
-                            "color": "#FFF",
-                            "fontSize": "20px",
-                            "background": "rgba(0,0,0,0)"
-                        }],
+                        "buttons": [
+                            {
+                                "float": "right",
+                                "text": "\ue607",
+                                "fontSrc": "/static/iconfont.ttf",
+                                "color": "#FFF",
+                                "fontSize": "20px",
+                                "background": "rgba(0,0,0,0)"
+                            }
+                        ],
                         "backButton": {
                             "background": "rgba(0,0,0,0)"
                         }
@@ -541,7 +558,8 @@
     "tabBar": {
         "borderStyle": "white",
         "selectedColor": "#34CE98",
-        "list": [{
+        "list": [
+            {
                 "iconPath": "static/tabBar/tabBar_00.png",
                 "selectedIconPath": "static/tabBar/tabBar_show_00.png",
                 "pagePath": "pages/index/index",
@@ -583,4 +601,4 @@
     "easycom": {
         "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
     }
-}
+}
\ No newline at end of file
diff --git a/pages/record/addExercises.vue b/pages/record/addExercises.vue
new file mode 100644
index 0000000..b86878c
--- /dev/null
+++ b/pages/record/addExercises.vue
@@ -0,0 +1,183 @@
+<!--
+ * @Description:
+ * @Author: Aimee·Zhang
+ * @Date: 2022-01-11 11:27:17
+ * @LastEditors: Aimee·Zhang
+ * @LastEditTime: 2022-01-19 16:57:19
+-->
+
+<template>
+    <view class="add-foods">
+        <!-- 搜索页面 -->
+        <u-search
+            :show-action="true"
+            actionText="搜索"
+            :animation="true"
+            :clearabled="true"
+            placeholder="请输入运动名称"
+            @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>
+<script>
+import sports from "@/components/sports";
+import addPopup from "@/components/sports/addPopup";
+import { healthSports, addHealthSports } from "@/apis/interfaces/sport.js";
+import moment, { duration } from "moment";
+
+export default {
+    components: { sports, addPopup },
+    data() {
+        return {
+            addSportsShow: false, // 添加运动弹窗显示
+            selectSports: {}, // 选择新增的运动
+            lists: [], // 运动列表
+            page: 1,
+            has_more: true,
+            name: "", // 搜索运动名称
+            today: moment(new Date()).format("YYYY-MM-DD"),
+        };
+    },
+    onLoad() {
+        this.getExercises();
+    },
+    // 触底加载更多
+    onReachBottom() {
+        if (!this.has_more) {
+            uni.showToast({
+                title: "没有更多啦~",
+                icon: "none",
+            });
+        } else {
+            this.page = this.page + 1;
+            this.getExercises();
+        }
+    },
+    methods: {
+        // 获取运动列表
+        getExercises() {
+            let data = {
+                page: this.page,
+                name: this.name,
+            };
+            healthSports(data).then((res) => {
+                this.lists = this.lists.concat(res.data);
+                this.has_more = res.page.has_more;
+            });
+        },
+        // 显示弹窗内容
+        addSport(item) {
+            console.log(item);
+            this.selectSports = item;
+            this.selectSports.duration = 60;
+            this.addSportsShow = true;
+        },
+        // 弹窗确认按钮新增
+        comfirmSport(show, duration) {
+            let params = {
+                unit: "1", // 时间单位：分钟 1 小时 2
+                duration: duration, // 时常
+                sport_id: this.selectSports.sport_id, // 运动id
+                date: this.today, // 日期
+            };
+            addHealthSports(params).then((res) => {
+                this.addSportsShow = false;
+                this.selectSports = {};
+                this.$Router.back();
+            });
+            console.log("弹窗确认按钮新增");
+        },
+        // 弹窗取消按钮
+        cancleSport(show) {
+            this.addSportsShow = show;
+            this.duration = 60;
+            console.log("弹窗取消按钮");
+        },
+        // 添加运动弹窗显示
+        //#region  搜索相关方法 start
+        // 点击搜索左侧按钮
+        searchCustom(e) {
+            console.log(e);
+            this.name = e;
+            this.reset();
+        },
+        // 清空数组重新请求数据
+        reset() {
+            this.page = 1;
+            this.has_more = true;
+            this.lists = [];
+            this.getExercises();
+        },
+        // 点击搜索后面按钮触发事件事件
+        clearSearch() {
+            this.name = "";
+            this.reset();
+        },
+        //#endregion  搜索相关方法  end
+    },
+};
+</script>
+<style lang="scss" scoped>
+.add-foods {
+    padding: $padding;
+    .lists {
+        padding: $padding * 0.6 0;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: center;
+        box-sizing: border-box;
+        .lists-right {
+            flex: 1;
+            font-size: $title-size-m - 6;
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: space-between;
+            box-sizing: border-box;
+            color: $text-gray-m;
+            border-bottom: solid 1rpx #f7f7f7;
+            margin-left: $margin * 0.8;
+            padding: $padding 0;
+        }
+        .lists-title {
+            display: flex;
+            flex-direction: column;
+            align-items: flex-start;
+            justify-content: center;
+            box-sizing: border-box;
+            font-size: $title-size-m;
+            color: $text-color;
+            .des {
+                margin-top: 10rpx;
+            }
+            span {
+                color: $text-price;
+                font-size: $title-size-m - 6;
+                font-weight: normal;
+                padding-right: $padding * 0.3;
+            }
+            .des {
+                color: $text-gray-m;
+                font-size: $title-size-m - 6;
+                font-weight: normal;
+            }
+        }
+    }
+}
+</style>
diff --git a/pages/record/addFoods.vue b/pages/record/addFoods.vue
index 4db3232..cf476b8 100644
--- a/pages/record/addFoods.vue
+++ b/pages/record/addFoods.vue
@@ -7,165 +7,187 @@
 -->
 
 <template>
-	<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>
+    <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/add-goods-template/add-goods-template';
-import { healthFoods, addHealthFoods } from '@/apis/interfaces/foods.js';
-import moment from 'moment';
+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 {
-			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) {
-			this.addShow = true;
-			this.selectGoods = [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) {
-			this.$Router.push({
-				name: 'rankingDetails',
-				params: 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) {
+            this.addShow = true;
+            this.selectGoods = [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) {
+            this.$Router.push({
+                name: "rankingDetails",
+                params: e,
+            });
+        },
+    },
 };
 </script>
 <style lang="scss" scoped>
 .add-foods {
-	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;
-		}
-	}
+    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>
diff --git a/pages/record/foods.vue b/pages/record/foods.vue
index b5984c8..94bc280 100644
--- a/pages/record/foods.vue
+++ b/pages/record/foods.vue
@@ -3,27 +3,36 @@
  * @Author: Aimee·Zhang
  * @Date: 2022-01-11 08:54:49
  * @LastEditors: Aimee·Zhang
- * @LastEditTime: 2022-01-14 09:29:23
+ * @LastEditTime: 2022-01-20 10:05:15
 -->
 
 <template>
     <view class="record--foods">
         <!-- 饮食进度条 -->
         <view class="cricle-content">
-            <view class="info">饮食摄入<span>{{calorys.intake_total}}</span></view>
+            <view class="info">
+                饮食摄入
+                <span>{{ calorys.intake_total }}</span>
+            </view>
             <arprogress
-                :percent="calorys.exceeds?100:calorys.ratio"
+                :percent="calorys.exceeds ? 100 : calorys.ratio"
                 inactiveColor="#f5f4f9"
-                :activeColor="calorys.exceeds?'#f00':'#34ce98'"
+                :activeColor="calorys.exceeds ? '#f00' : '#34ce98'"
                 width="300"
                 class="cricle"
                 borderWidth="20"
             >
-                <span>{{calorys.exceeds?'多吃了':'还可以吃'}}</span>
-                <span :class="['num',calorys.exceeds?'num1':'']">{{calorys.amount}}</span>
-                <span>推荐预算{{calorys.goal}}</span>
+                <span>{{ calorys.exceeds ? '多吃了' : '还可以吃' }}</span>
+                <span :class="['num', calorys.exceeds ? 'num1' : '']">{{ calorys.amount }}</span>
+                <span>推荐预算{{ calorys.goal }}</span>
             </arprogress>
-            <view class="info" @click="errToast">运动消耗<span>0</span></view>
+            <view
+                class="info"
+                @click="errToast"
+            >
+                运动消耗
+                <span>{{ calorys.exercise_total }}</span>
+            </view>
             <view class="ic-left">摄入量推荐</view>
             <u-icon
                 class="ic-day"
@@ -38,16 +47,20 @@
         </view>
 
         <!-- 有饮食记录 -->
-        <template v-if="intakes.length>0">
+        <template v-if="intakes.length > 0">
             <view
                 class="foods-add"
-                v-for="(it,index) in intakes"
+                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-left">
+                        {{ it.name }}
+                        <span v-if="it.remark">{{ it.remark || '' }}</span>
+                    </view>
                     <view class="title-right">
-                        {{it.total}}<span class="dw">千卡</span>
+                        {{ it.total }}
+                        <span class="dw">千卡</span>
                         <u-icon
                             name="arrow-right"
                             color="#ddd"
@@ -60,15 +73,41 @@
                     :lists="it.intake"
                     type="no-dian"
                     @editGoods="editGoods"
+                    @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
+                type="edit"
+                :lists="sports"
+                @editSport="editSport"
+                @longClick="longClick"
+            />
+        </template>
 
         <!-- 没有饮食记录 -->
         <view
             class="no-foods"
-            v-else
+            v-if="sports.length === 0 && intakes.length === 0"
         >
             <u-image
                 :src="require('../../static/imgs/no-foods.png')"
@@ -81,6 +120,7 @@
             <view>还没有添加今日饮食记录</view>
             <view>请点击屏幕下方按钮来添加</view>
         </view>
+
         <!-- 加餐模块 -->
         <u-action-sheet
             :actions="addEatList"
@@ -104,22 +144,27 @@
                 text="+早餐"
                 @click="tabbarClick"
                 :icon="require('../../static/imgs/foods-1.png')"
-            ></u-tabbar-item>
+            />
             <u-tabbar-item
                 text="+午餐"
                 @click="tabbarClick"
                 :icon="require('../../static/imgs/foods-2.png')"
-            ></u-tabbar-item>
+            />
             <u-tabbar-item
                 text="+晚餐"
                 @click="tabbarClick"
                 :icon="require('../../static/imgs/foods-3.png')"
-            ></u-tabbar-item>
+            />
             <u-tabbar-item
                 text="+加餐"
                 @click="tabbarClick"
                 :icon="require('../../static/imgs/foods-4.png')"
-            ></u-tabbar-item>
+            />
+            <u-tabbar-item
+                text="+运动"
+                @click="tabbarClick"
+                :icon="require('../../static/imgs/foods-5.png')"
+            />
         </u-tabbar>
 
         <!-- 修改食品弹窗 -->
@@ -135,24 +180,44 @@
             @tabGoodsInfo="tabGoodsInfo"
             max="999"
         />
+
+        <!-- 修改运动弹窗 -->
+        <addPopup
+            :selectSports="selectSports"
+            :addSportsShow="addSportsShow"
+            @comfirmSport="comfirmSport"
+            @cancleSport="cancleSport"
+            @delSport="delSport"
+        />
     </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 {
+    plans,
+    editHealthFoods,
+    delHealthFoods,
+} from "@/apis/interfaces/foods.js";
 import moment from "moment";
 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 {
     components: {
         arprogress,
         goodsList,
         addFoods,
+        addPopup,
+        sports,
     },
     data() {
         return {
             lists: [],
+            addShow: false, // 添加食品显示
+            selectGoods: [], // 选择新增的食品
             addEatShow: false, // 加餐弹窗默认不显示
             addEatList: [
                 {
@@ -171,38 +236,134 @@ export default {
             today: moment(new Date()).format("YYYY-MM-DD"),
             calorys: {}, // 当日食谱推荐页面的信息
             intakes: [], // 当日摄入列表
-            addShow: false, // 添加食品显示
-            selectGoods: [], // 选择新增的食品
+            sports: [], // 运动列表
+            sportsTotal: 0,
+            addSportsShow: false, // 添加运动弹窗显示
+            selectSports: {}, // 选择新增的运动
         };
     },
     onShow() {
         this.getList();
     },
     methods: {
-			// 错误提示
-			errToast(){
-				uni.showToast({
-					title:'努力开发中~',
-					icon:'none'
-				})
-			},
+        // 编辑运动
+        editSport(item) {
+            this.selectSports = {
+                name: item.sport.name,
+                calory: item.sport.calory,
+                cover: item.sport.cover,
+                duration: item.duration,
+                sport_id: item.sport.sport_id,
+                exercise_id: item.exercise_id,
+                title: "编辑运动",
+            };
+            // console.log(this.selectSports);
+            console.log("编辑运动", item);
+            this.addSportsShow = true;
+        },
+
+        // 弹窗确认按钮新增  这里接口报错了  ，
+        comfirmSport(show, duration) {
+            let params = {
+                unit: "1", // 时间单位：分钟 1 小时 2
+                duration: duration, // 时常
+                exercise_id: this.selectSports.exercise_id, //
+                sport_id: this.selectSports.sport_id, // 运动id
+                date: this.today, // 日期
+            };
+            console.log(params);
+            editHealthSports(params).then((res) => {
+                this.addSportsShow = false;
+                this.selectSports = {};
+                this.getList();
+            });
+            console.log("弹窗确认按钮新增");
+        },
+
+        // 弹窗取消按钮
+        cancleSport(show) {
+            this.addSportsShow = show;
+            console.log("弹窗取消按钮");
+        },
+        // 删除运动
+        delSport() {
+            let params = {
+                exercise_id: this.selectSports.exercise_id, //
+            };
+            console.log(params);
+            delHealthSports(params).then((res) => {
+                this.addSportsShow = false;
+                this.selectSports = {};
+                this.getList();
+            });
+        },
+        // 长按删除触发事件运动
+        longClick(item) {
+            this.selectSports = item;
+            uni.showModal({
+                content: "确认删除么？",
+                confirmText: "确认删除",
+                confirmColor: "#34ce98",
+                cancelText: "再想想",
+                cancelColor: "#ddd",
+                success: (res) => {
+                    if (res.confirm) {
+                        this.delSport();
+                    }
+                },
+            });
+        },
+        // 长按删除食品
+        longClickGoods(e) {
+            this.selectGoods = [e];
+            uni.showModal({
+                content: "确认删除么？",
+                confirmText: "确认删除",
+                confirmColor: "#34ce98",
+                cancelText: "再想想",
+                cancelColor: "#ddd",
+                success: (res) => {
+                    if (res.confirm) {
+                        this.delThis();
+                    }
+                },
+            });
+        },
+        // 错误提示
+        errToast() {
+            uni.showToast({
+                title: "努力开发中~",
+                icon: "none",
+            });
+        },
         getList() {
             plans(this.today).then((res) => {
                 this.calorys = res.calorys;
+                this.calorys.ratio = Number(this.calorys.ratio);
                 this.intakes = res.intakes;
+                this.sports = res.exercises.lists;
+                this.sportsTotal = res.exercises.total;
             });
         },
         // 底部按钮点击触发的事件 早餐1 午餐3 晚餐5 加餐(早2中4晚6)
         tabbarClick(e) {
+            console.log(e);
             this.tabarIndex = e;
             if (e === 3) {
                 this.addEatShow = true;
             } else {
-                uni.navigateTo({
-                    url: `/pages/record/addFoods?type=${
-                        e === 0 ? 1 : e === 1 ? 3 : 5
-                    }`,
-                });
+                if (e === 4) {
+                    // 新增运动
+                    uni.navigateTo({
+                        url: `/pages/record/addExercises`,
+                    });
+                } else {
+                    uni.navigateTo({
+                        url: `/pages/record/addFoods?type=${
+                            e === 0 ? 1 : e === 1 ? 3 : 5
+                        }`,
+                    });
+                }
             }
         },
         // 选择了加餐跳转
@@ -260,7 +421,7 @@ export default {
 
 <style lang="scss" scoped>
 .record--foods {
-    padding: $padding $padding $padding * 2 $padding;
+    padding: $padding $padding $padding * 7 $padding;
     // background: green;
 }
 // 饮食进度条
@@ -337,39 +498,39 @@ export default {
 .foods-add {
     border-bottom: solid 1rpx #f7f7f7;
     margin-top: $margin;
-    // 主标题
-    .foods-title {
+}
+// 主标题
+.foods-title {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    box-sizing: border-box;
+    color: $text-color;
+    padding: $padding * 0.5 0;
+    .title-left {
+        font-size: $title-size;
+        color: $text-color;
+        font-weight: bold;
+        span {
+            font-weight: normal;
+            font-size: $title-size-m - 6;
+            color: $text-gray-m;
+            margin-left: $margin - 10;
+        }
+    }
+    .title-right {
+        font-size: $title-size-m - 6;
         display: flex;
         flex-direction: row;
         align-items: center;
-        justify-content: space-between;
+        justify-content: center;
         box-sizing: border-box;
-        color: $text-color;
-        padding: $padding * 0.5 0;
-        .title-left {
-            font-size: $title-size;
-            color: $text-color;
-            font-weight: bold;
-            span {
-                font-weight: normal;
-                font-size: $title-size-m - 6;
-                color: $text-gray-m;
-                margin-left: $margin - 10;
-            }
-        }
-        .title-right {
-            font-size: $title-size-m - 6;
-            display: flex;
-            flex-direction: row;
-            align-items: center;
-            justify-content: center;
-            box-sizing: border-box;
-            color: $main-color;
-            .dw {
-                margin: 0 $margin * 0.6 0 $margin * 0.4;
-                color: $text-gray;
-            }
+        color: $main-color;
+        .dw {
+            margin: 0 $margin * 0.6 0 $margin * 0.4;
+            color: $text-gray;
         }
     }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/static/imgs/foods-5.png b/static/imgs/foods-5.png
new file mode 100644
index 0000000..0df55b4
Binary files /dev/null and b/static/imgs/foods-5.png differ