diff --git a/App.vue b/App.vue
index 7b7b95a..002072b 100644
--- a/App.vue
+++ b/App.vue
@@ -1,11 +1,13 @@
 <script>
-    import { getVersions } from './apis/interfaces/versions'
+    import {
+        getVersions
+    } from './apis/interfaces/versions'
     import im from '@/utils/im/index.js'
 
     export default {
         onLaunch: function() {
-            im.initIm('lmxuhwaglu76d')
-            return
+            im.initIm('lmxuhwaglu76d')
+            return
             //#ifdef APP-PLUS
             // 获取系统版本号
             getVersions({
@@ -27,7 +29,7 @@
                                     uni.downloadFile({
                                         url: res.info.download,
                                         success: apkPick => {
-                                            plus.runtime.install(apkPick
+                                            plus.runtime.install(apkPick 
                                                 .tempFilePath, '',
                                                 installRES => {
                                                     // 安装完成用于提示新版本引导，暂时无用
diff --git a/apis/interfaces/drink.js b/apis/interfaces/drink.js
index eacae00..cbc323b 100644
--- a/apis/interfaces/drink.js
+++ b/apis/interfaces/drink.js
@@ -9,9 +9,10 @@ import { request } from '../index'
 /**
  * @description:饮水记录首页
  */
-const waters = () => {
+const waters = (data) => {
 	return request({
 		url: 'health/waters',
+        data:data
 	})
 }
 /**
@@ -29,10 +30,11 @@ const setWaters = (data) => {
  * @description:喝水
  * @Date: 2022-01-12 12：56：00
  */
-const drinkWater = () => {
+const drinkWater = (data) => {
 	return request({
 		url: 'health/waters/drink',
 		method: 'POST',
+        data:data
 	})
 }
 /**
@@ -46,10 +48,24 @@ const delDrinkWater = (id) => {
 	})
 }
 
+/**
+ * @description:饮食运动日历
+ * @params {日期}
+ * @method {get}
+ * @Date: 2022-02-08 11点18分
+ */
+const dateList = (data) => {
+	return request({
+		url: 'health/calendar/water',
+		data:data
+	})
+}
+
 
 export {
 	waters,
 	setWaters,
 	drinkWater,
-	delDrinkWater
+	delDrinkWater,
+    dateList
 }
diff --git a/apis/interfaces/foods.js b/apis/interfaces/foods.js
index 85ee623..da44c20 100644
--- a/apis/interfaces/foods.js
+++ b/apis/interfaces/foods.js
@@ -78,11 +78,24 @@ const delHealthFoods = (intake_id) => {
 	})
 }
 
+/**
+ * @description:饮食运动日历
+ * @params {日期}
+ * @method {get}
+ * @Date: 2022-02-07 15点18分
+ */
+const dateList = (data) => {
+	return request({
+		url: 'health/calendar/intake',
+		data:data
+	})
+}
 export {
 	positions,
 	plans,
 	healthFoods,
 	addHealthFoods,
 	editHealthFoods,
-	delHealthFoods
+	delHealthFoods,
+    dateList
 }
diff --git a/apis/interfaces/weight.js b/apis/interfaces/weight.js
index 7a97283..ac72e0a 100644
--- a/apis/interfaces/weight.js
+++ b/apis/interfaces/weight.js
@@ -6,6 +6,7 @@
  * @LastEditTime: 2022-01-12 17:13:45
  */
 import { request } from '../index'
+
 /**
  * @description:称量体重模块首页
  */
@@ -15,6 +16,16 @@ const weights = (page) => {
 		data: { page: page }
 	})
 }
+
+/**
+ * @description:获取曲线进度
+ */
+const curves = () => {
+	return request({
+		url: 'health/weights/bight'
+	})
+}
+
 /**
  * @description:记录体重
  * @Date: 2022-01-12 16:46:19
@@ -26,7 +37,9 @@ const addWeight = (data) => {
 		data: data
 	})
 }
+
 export {
 	weights,
-	addWeight
+	addWeight,
+    curves
 }
diff --git a/components/date-template/index.vue b/components/date-template/index.vue
new file mode 100644
index 0000000..79ae7bf
--- /dev/null
+++ b/components/date-template/index.vue
@@ -0,0 +1,342 @@
+<!--
+ * @Description:日历模板
+ * @Author: Aimee·Zhang
+ * @Date: 2022-02-08 09:06:45
+ * @LastEditors: Aimee·Zhang
+ * @LastEditTime: 2022-02-08 09:06:45
+-->
+
+<template>
+    <view class="date">
+        <u-popup :show="dateShow" zIndex="10099890" @close="closeDate" mode="bottom" :safeAreaInsetBottom="true">
+            <view class="date-content">
+                <view class="title"><span @click="datePreNext('before')">上一月</span>{{month}}<span
+                        @click="datePreNext('after')">下一月</span></view>
+                <view class="date-item">
+                    <view class="week">
+                        <view class="week-item" v-for="(item,index) in weekList" :key="index">{{item}}</view>
+                    </view>
+                    <!-- 饮食模块 -->
+                    <block v-if="type === 'foods'">
+                        <view class="week" style="padding-top: 30rpx;">
+                            <view v-for="item in lists" :key="item.today" @click="dateClick(item)"
+                                :class="['week-item',{'is_past':!item.is_month},{'is_today':item.today ===  today},{'is_intake0':item.intake === 1},{'is_intake1':item.intake === 2},{'is_intake2':item.intake === 3}]">
+                                {{item.day}}
+                            </view>
+                        </view>
+                        <view class="des">
+                            <block>
+                                <view class="des-item">吃少了</view>
+                                <view class="des-item">正好</view>
+                                <view class="des-item">吃多了</view>
+                            </block>
+                            <view class="back" @click="backDate"> 回今天 </view>
+                        </view>
+                    </block>
+                    <!-- 喝水模块 -->
+                    <block v-if="type === 'drink'">
+                        <view class="week" style="padding-top: 30rpx;">
+                            <view v-for="item in lists" :key="item.today" @click="dateClick(item)"
+                                :class="['week-item',{'is_past':!item.is_month},{'is_today':item.today ===  today}]">
+                                {{item.day}}
+                                <u-image class='waterIcon' :src="require('@/static/imgs/water-1.png')"
+                                    v-if="item.drink === 2" :lazy-load="true" width="20rpx" radius="10rpx"
+                                    mode="widthFix" />
+                                <u-image class='waterIcon' :src="require('@/static/imgs/water-2.png')"
+                                    v-if="item.drink === 1" :lazy-load="true" width="20rpx" radius="10rpx"
+                                    mode="widthFix" />
+                            </view>
+                        </view>
+                        <view class="drink">
+                            <block>
+                                <view class="drink-item">
+                                    <u-image class='waterIcon' :src="require('@/static/imgs/water-1.png')"
+                                        :lazy-load="true" width="22rpx" radius="10rpx" mode="widthFix" />未完成指标
+                                </view>
+                                <view class="drink-item">
+                                    <u-image class='waterIcon' :src="require('@/static/imgs/water-2.png')"
+                                        :lazy-load="true" width="22rpx" radius="10rpx" mode="widthFix" />
+                                    完成指标
+                                </view>
+                            </block>
+                            <view class="back" @click="backDate"> 回今天 </view>
+                        </view>
+                    </block>
+                </view>
+            </view>
+        </u-popup>
+    </view>
+</template>
+<script>
+    import moment from 'moment';
+    export default {
+        data() {
+            return {
+                weekList: ['日', '一', '二', '三', '四', '五', '六'],
+            };
+        },
+        props: {
+            /** 
+             *  lists 传过来的列表
+             *  type foods（食物运动） drink（饮水）weight（体重）
+             *  today 勾选时间
+             *  month 勾选日期
+             *  dateShow 页面是否显示
+             **/
+            lists: {
+                type: Array,
+                default: [],
+            },
+            type: {
+                type: String,
+                default: "",
+            },
+            today: {
+                type: String,
+                default: moment(new Date()).format('YYYY-MM-DD')
+            },
+            month: {
+                type: String,
+                default: moment(new Date()).format('YYYY-MM')
+            },
+            dateShow: {
+                type: Boolean,
+                default: false
+            }
+        },
+        methods: {
+            // 选择日期
+            dateClick(item) {
+                this.$emit('dateClick', item)
+            },
+            // 返回今天
+            backDate() {
+                this.$emit('backDate', '')
+            },
+            // 点击上一个月或者下一个月 before 上一月 after下一个月
+            datePreNext(type) {
+                this.$emit('datePreNext', type)
+            },
+            // 关闭日历
+            closeDate() {
+                this.$emit('closeDate')
+            }
+        },
+    };
+</script>
+<style lang="scss" scoped>
+    .date {
+
+        // 日历弹窗
+        .date-content {
+            width: 100%;
+            padding: $padding *2;
+            min-height: 800rpx;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: flex-start;
+            box-sizing: border-box;
+
+            .title {
+                font-size: $title-size + 4;
+                color: #20845f;
+                font-weight: bold;
+                display: flex;
+                flex-direction: row;
+                align-items: center;
+                justify-content: space-between;
+                box-sizing: border-box;
+                width: 100%;
+
+                span {
+                    display: inline-block;
+                    padding: $padding;
+                    font-size: $title-size-m;
+                    color: #cacaca;
+                    font-weight: normal;
+                }
+            }
+
+            .date-item {
+                padding-top: $padding;
+                width: 100%;
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+                box-sizing: border-box;
+
+                .drink {
+                    display: flex;
+                    color: #cacaca;
+                    flex-direction: row;
+                    align-items: center;
+                    box-sizing: border-box;
+                    font-size: $title-size-m;
+                    justify-content: center;
+                    margin-top: $margin;
+                    width: 100%;
+
+                    .drink-item {
+                        padding-right: 40rpx;
+                        position: relative;
+                        display: flex;
+                        flex-direction: row;
+                        align-items: center;
+                        justify-content: center;
+                        box-sizing: border-box;
+                        u-image{
+                            padding-right: 10rpx;
+                        }
+                    }
+                }
+
+                .des {
+                    display: flex;
+                    color: #cacaca;
+                    flex-direction: row;
+                    align-items: center;
+                    box-sizing: border-box;
+                    font-size: $title-size-m;
+                    justify-content: center;
+                    margin-top: $margin;
+                    width: 100%;
+
+                    .des-item {
+                        padding-left: 40rpx;
+                        padding-right: 10rpx;
+                        position: relative;
+                        display: flex;
+                        flex-direction: row;
+                        align-items: center;
+                        justify-content: center;
+                        box-sizing: border-box;
+
+                        &:before {
+                            content: '';
+                            position: absolute;
+                            left: 14rpx;
+                            width: 20rpx;
+                            height: 20rpx;
+                            border-radius: 50%;
+                            background: #fa624d;
+                        }
+
+                        &:nth-child(2):before {
+                            background: #fbbf0f;
+                        }
+
+                        &:nth-child(1):before {
+                            background: #02c7bd;
+                        }
+                    }
+                }
+
+                .back {
+                    margin-left: 100rpx;
+                    background-color: rgba($color: $main-color, $alpha: 1);
+                    color: #fff;
+                    padding: 10rpx $padding;
+                    border-radius: $radius + 10;
+                }
+
+            }
+
+
+
+            .week {
+                display: flex;
+                flex-direction: row;
+                align-items: center;
+                justify-content: flex-start;
+                box-sizing: border-box;
+                flex-wrap: wrap;
+                width: 100%;
+
+                .week-item {
+                    width: 14.28%;
+                    height: 90rpx;
+                    line-height: 90rpx;
+                    font-size: $title-size-m + 2;
+                    color: #888;
+                    position: relative;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    justify-content: center;
+                    box-sizing: border-box;
+
+                    &::before {
+                        content: '';
+                        width: 14rpx;
+                        height: 14rpx;
+                        border-radius: 50%;
+                        position: absolute;
+                        bottom: 0;
+                        // background: #02c7bd;
+                    }
+                }
+
+                .waterIcon {
+                    position: absolute;
+                    width: 30rpx !important;
+                    bottom: -12rpx;
+                    padding-left: 10rpx;
+                }
+
+                &:nth-child(1),
+                &:nth-child(7),
+                &:nth-child(8),
+                &:nth-child(14),
+                &:nth-child(15),
+                &:nth-child(21),
+                &:nth-child(22),
+                &:nth-child(28),
+                &:nth-child(29),
+                &:nth-child(35),
+                    {
+                    color: rgba($color: #000000, $alpha: 0.4);
+
+                }
+            }
+
+            // 吃饭样式
+            .is_intake0::before {
+                background: #02c7bd !important;
+            }
+
+            .is_intake1::before {
+                background: #fbbf0f !important;
+            }
+
+            .is_intake2::before {
+                background: #fa624d !important;
+            }
+
+            .is_today {
+                color: #fff !important;
+                position: relative;
+                z-index: 1;
+
+                &:after {
+                    content: '';
+                    width: 50rpx;
+                    height: 50rpx;
+                    position: absolute;
+                    border-radius: 50%;
+                    background-color: $main-color;
+                    color: #Fff;
+                    z-index: -1;
+                }
+            }
+
+            .is_past {
+                color: rgba($color: #000000, $alpha: 0.1) !important;
+            }
+
+
+
+        }
+    }
+</style>
diff --git a/pages.json b/pages.json
index 91d3f80..03b0587 100644
--- a/pages.json
+++ b/pages.json
@@ -35,9 +35,8 @@
             "path": "pages/record/drink",
             "name": "Drink",
             "style": {
-                "navigationBarTitleText": "记录喝水",
-                "navigationBarBackgroundColor": "#34CE98",
-                "navigationBarTextStyle": "white"
+                "navigationBarTitleText": "记录",
+                "navigationStyle": "custom"
             }
         },
         {
@@ -53,9 +52,8 @@
             "path": "pages/record/foods",
             "name": "RecordFoods",
             "style": {
-                "navigationBarTitleText": "食物记录",
-                "navigationBarBackgroundColor": "#34CE98",
-                "navigationBarTextStyle": "white"
+               "navigationBarTitleText": "",
+               "navigationStyle": "custom"
             }
         },
         {
diff --git a/pages/auth/auth.vue b/pages/auth/auth.vue
index 33a8231..6c4cf79 100644
--- a/pages/auth/auth.vue
+++ b/pages/auth/auth.vue
@@ -83,7 +83,6 @@ export default {
                 mobileNo: this.phone,
                 code: this.code,
             }).then((res) => {
-				console.log(111)
 				this.$store.commit(
 					"setToken",
 					res.token_type + " " + res.access_token
diff --git a/pages/im/private/components/showVoice.nvue b/pages/im/private/components/showVoice.nvue
index 2686fc9..3c83771 100644
--- a/pages/im/private/components/showVoice.nvue
+++ b/pages/im/private/components/showVoice.nvue
@@ -65,7 +65,8 @@
         height: 79rpx;
         width: 170rpx;
         padding: 0 20rpx;
-        box-sizing: border-box;
+        box-sizing:border-box;
+        /* box-sizing: border-box; */
     }
 
     ,
diff --git a/pages/record/addFoods.vue b/pages/record/addFoods.vue
index cf476b8..b273661 100644
--- a/pages/record/addFoods.vue
+++ b/pages/record/addFoods.vue
@@ -14,180 +14,185 @@
             <view>高等热量</view>
         </view>
         <!-- 搜索页面 -->
-        <u-search
-            :show-action="true"
-            actionText="搜索"
-            :animation="true"
-            :clearabled="true"
-            placeholder="请输入食品名称"
-            @custom="searchCustom"
-            @clear="clearSearch"
-            v-model="name"
-        />
+        <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"
-        />
+        <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"
-        />
+        <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;
+    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.date = this.$Route.query.date;
+            console.log(this.date,'date.........')
+            // this.getFoods();
+        },
+        onLoad() {
             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);
+        // 触底加载更多
+        onReachBottom() {
+            if (!this.has_more) {
+                uni.showToast({
+                    title: "没有更多啦~",
+                    icon: "none",
+                });
+            } else {
+                this.page = this.page + 1;
+                this.getFoods();
+            }
         },
-        // 添加食物
-        addHealthFoods(data) {
-            addHealthFoods(data).then((res) => {
-                console.log(res);
+        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) {
+                // 新添加食物
+                let data = {
+                    type: this.type,
+                    ser: 1,
+                    weight: value,
+                    food_id: this.selectGoods[0].food_id,
+                    date: this.date,
+                };
+                console.log(data,'data...........');
+                this.addHealthFoods(data);
+            },
+            // 添加食物
+            addHealthFoods(data) {
+                addHealthFoods(data).then((res) => {
+                    console.log(res);
+                    this.addShow = false;
+                    this.$Router.back();
+                }).catch(err => {
+                    console.log(err, '添加食物error');
+                    uni.showToast({
+                        title: err.message,
+                        icon: "none",
+                        duration:2000,
+                        mask:true
+                    })
+                    setTimeout(()=>{
+                        this.$Router.back();
+                    },2000)
+                });
+            },
+            closeHandle() {
+                //键盘关闭的回调函数
                 this.addShow = false;
-                this.$Router.back();
-            });
+            },
+            // 监听子组件的新增方法
+            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,
+                });
+            },
         },
-        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;
+    .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;
+            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/drink.vue b/pages/record/drink.vue
index 9bfd096..68a6caa 100644
--- a/pages/record/drink.vue
+++ b/pages/record/drink.vue
@@ -7,402 +7,544 @@
 -->
 
 <template>
-	<view class="drink" v-if="loaded">
-		<!-- 喝水及水杯文字 -->
-		<view class="drink-content">
-			<view class="title" v-if="!water.is_complete">
-				再喝
-				<span class="num">{{ water.lack.cup }}</span>
-				杯
-				<span class="total">（约{{ water.lack.value }}ml）</span>
-			</view>
-			<view class="title" v-if="water.is_complete">
-				已喝
-				<span class="num">{{ water.total }}ml</span>
-				<u-image class="is_complete" :src="require('../../static/imgs/target.png')" :lazy-load="true" mode="widthFix" width="140rpx" />
-			</view>
-			<!-- 水杯动态图片 -->
-			<view class="wave-content">
-				<u-image class="grass" :src="require('../../static/imgs/gress.png')" :lazy-load="true" mode="scaleToFill" width="320rpx" height="520rpx" />
-				<view class="wave" :style="{ '--ballPercent': -ballPercent + 40 + '%' }"></view>
-			</view>
-			<!-- 目标 -->
-			<view class="water-target">
-				<view class="target-item" @click="targetShow = true">
-					今日目标
-					<u-icon
-						class="target-icon"
-						name="arrow-right"
-						color="#666"
-						size="14"
-						:bold="true"
-						:label="water.target + 'ml'"
-						labelPos="left"
-						labelSize="16"
-						labelColor="#666"
-						space="6"
-					/>
-				</view>
-				<view class="target-item" @click="waterCShow = true">
-					水杯容量
-					<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>
-			</view>
-			<!-- 目标弹出层 -->
-			<view>
-				<u-picker
-					:show="targetShow"
-					:columns="tagerts"
-					title="每天喝水目标"
-					keyName="label"
-					confirmColor="#34ce98"
-					:closeOnClickOverlay="true"
-					@close="targetShow = false"
-					@confirm="targetSure('1', $event)"
-					:defaultIndex="tagertsDefaultIndex"
-				/>
-				<u-picker
-					:show="waterCShow"
-					:columns="cup_mls"
-					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" @longpress="delWater(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>
+    <view class="drink" v-if="loaded">
+        <!-- 自定义导航部分 -->
+        <u-navbar :safeAreaInsetTop="true" :fixed='true' bgColor="#34ce98" :autoBack="true">
+            <view class="u-nav-slot" slot="left">
+                <u-icon name="arrow-leftward" :bold="true" size="20" color="#fff" />
+            </view>
+            <view class="u-nav-slot u-center" slot="center" @click="dateShow = true,dateLists()">
+                <u-icon name="play-left-fill" size="14" color="#fff" @click="datePreNext('before')" />
+                <view class="date">
+                    <u-icon name="calendar" color="#fff" label-color="#fff" width="150" :label="today" label-size="14"
+                        size="20" />
+                </view>
+                <u-icon name="play-right-fill" size="14" color="#fff" @click="datePreNext('after')" />
+            </view>
+            <view class="u-nav-slot" slot="right">
+                <u-icon :name="require('@/static/icon/sign-icon.gif')" :bold="true" size="30"
+                    @click="$Router.push({name:'signIndex'})" />
+            </view>
+        </u-navbar>
+        <!-- 喝水及水杯文字 -->
+        <view class="drink-content">
+            <view class="title" v-if="!water.is_complete">
+                再喝
+                <span class="num">{{ water.lack.cup }}</span>
+                杯
+                <span class="total">（约{{ water.lack.value }}ml）</span>
+            </view>
+            <view class="title" v-if="water.is_complete">
+                已喝
+                <span class="num">{{ water.total }}ml</span>
+                <u-image class="is_complete" :src="require('../../static/imgs/target.png')" :lazy-load="true"
+                    mode="widthFix" width="140rpx" />
+            </view>
+            <!-- 水杯动态图片 -->
+            <view class="wave-content">
+                <u-image class="grass" :src="require('../../static/imgs/gress.png')" :lazy-load="true"
+                    mode="scaleToFill" width="320rpx" height="520rpx" />
+                <view class="wave" :style="{ '--ballPercent': -ballPercent + 40 + '%' }"></view>
+            </view>
+            <!-- 目标 -->
+            <view class="water-target">
+                <view class="target-item" @click="targetShow = true">
+                    今日目标
+                    <u-icon class="target-icon" name="arrow-right" color="#666" size="14" :bold="true"
+                        :label="water.target + 'ml'" labelPos="left" labelSize="16" labelColor="#666" space="6" />
+                </view>
+                <view class="target-item" @click="waterCShow = true">
+                    水杯容量
+                    <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>
+            </view>
+            <!-- 目标弹出层 -->
+            <view>
+                <u-picker :show="targetShow" :columns="tagerts" title="每天喝水目标" keyName="label" confirmColor="#34ce98"
+                    :closeOnClickOverlay="true" @close="targetShow = false" @confirm="targetSure('1', $event)"
+                    :defaultIndex="tagertsDefaultIndex" />
+                <u-picker :show="waterCShow" :columns="cup_mls" 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"
+                    @longpress="delWater(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>
+
+        <!-- 选择日历 -->
+        <dateTemplate :lists="calendarList" :today="today" :month="month" :dateShow="dateShow" type='drink'
+            @backDate="backDate" @dateClick="dateClick" @closeDate="closeDate" @datePreNext="datePreNext" />
+    </view>
 </template>
 <script>
-import { waters, setWaters, drinkWater, delDrinkWater } from '@/apis/interfaces/drink';
-import moment from 'moment';
-export default {
-	data() {
-		return {
-			ballPercent: 0, // 喝水比例
-			logs: [], // 水记录
-			water: {}, // 水基本信息
-			targetShow: false,
-			tagerts: [], // 目标列表
-			tagertsDefaultIndex: ['1'], // 目标默认index
-			waterCShow: false,
-			cup_mls: [], // 水杯列表
-			cupDefaultIndex: ['2'], // 目标默认index
-			loaded: false
-		};
-	},
-	onShow() {
-		this.getWaters();
-	},
-	methods: {
-		// 获取喝水页面信息
-		getWaters() {
-			waters().then(res => {
-				this.cup_mls = [res.cup_mls];
-				this.tagerts = [res.tagerts];
-				this.water = res.water;
-				this.logs = res.logs;
-				this.ballPercent = res.water.lack.ratio;
-				this.cupDefaultIndex = [res.cup_mls.findIndex(item => item.number === res.water.ml)];
-				this.tagertsDefaultIndex = [res.tagerts.findIndex(item => item.number === res.water.target)];
-				this.loaded = true;
-			});
-		},
-		// 确认方法index===1 每日目标 2，水杯容量
-		targetSure(index, e) {
-			// console.log("触发了targetSure", index, e.value[0]);
-			// let date = moment(new Date()).format("YYYY--MM--DD");
-			let params = {};
-			if (index === '1') {
-				params = {
-					type: 'target',
-					ml: e.value[0].number,
-					date: moment(new Date()).format('YYYY-MM-DD')
-				};
-			} else {
-				params = {
-					type: 'ml',
-					ml: e.value[0].number,
-					date: moment(new Date()).format('YYYY-MM-DD')
-				};
-			}
-			setWaters(params).then(res => {
-				this.getWaters();
-				this.waterCShow = false;
-				this.targetShow = false;
-			});
-		},
-		// 喝水
-		drinkWater() {
-			drinkWater().then(res => {
-				this.getWaters();
-			});
-		},
-		// 删除和喝水记录
-		delWater(id) {
-			uni.showModal({
-				content: '确认删除么？',
-				confirmText: '确认删除',
-				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'
-								});
-							});
-					}
-				}
-			});
-		}
-	}
-};
+    import {
+        waters,
+        setWaters,
+        drinkWater,
+        delDrinkWater,
+        dateList
+    } from '@/apis/interfaces/drink';
+    import moment from 'moment';
+    import dateTemplate from '@/components/date-template/index.vue'
+    export default {
+        components: {
+            dateTemplate
+        },
+        data() {
+            return {
+                ballPercent: 0, // 喝水比例
+                logs: [], // 水记录
+                water: {}, // 水基本信息
+                targetShow: false,
+                tagerts: [], // 目标列表
+                tagertsDefaultIndex: ['1'], // 目标默认index
+                waterCShow: false,
+                cup_mls: [], // 水杯列表
+                cupDefaultIndex: ['2'], // 目标默认index
+                loaded: false,
+                today: moment(new Date()).format('YYYY-MM-DD'), // 当前时间
+                month: moment(new Date()).format('YYYY-MM'), //当前月份
+                dateShow: false, // 日历展示
+                calendarList: [],
+                dateType: '', // before after ''
+            };
+        },
+        onShow() {
+            this.getWaters();
+            this.dateLists();
+        },
+        methods: {
+            // 获取喝水页面信息
+            getWaters() {
+                let data = {
+                    date: this.today,
+                    // type:this.dateType
+                }
+                waters(data).then(res => {
+                    this.cup_mls = [res.cup_mls];
+                    this.tagerts = [res.tagerts];
+                    this.water = res.water;
+                    this.logs = res.logs;
+                    this.ballPercent = res.water.lack.ratio;
+                    this.cupDefaultIndex = [res.cup_mls.findIndex(item => item.number === res.water.ml)];
+                    this.tagertsDefaultIndex = [res.tagerts.findIndex(item => item.number === res.water
+                        .target)];
+                    this.loaded = true;
+                });
+            },
+            // 确认方法index===1 每日目标 2，水杯容量
+            targetSure(index, e) {
+                // console.log("触发了targetSure", index, e.value[0]);
+                // let date = moment(new Date()).format("YYYY--MM--DD");
+                let params = {};
+                if (index === '1') {
+                    params = {
+                        type: 'target',
+                        ml: e.value[0].number,
+                        date: moment(new Date()).format('YYYY-MM-DD')
+                    };
+                } else {
+                    params = {
+                        type: 'ml',
+                        ml: e.value[0].number,
+                        date: moment(new Date()).format('YYYY-MM-DD')
+                    };
+                }
+                setWaters(params).then(res => {
+                    this.getWaters();
+                    this.waterCShow = false;
+                    this.targetShow = false;
+                });
+            },
+            // 喝水
+            drinkWater() {
+                console.log('喝水。。。')
+                let data = {
+                    date: this.today
+                }
+                console.log(data, 'data....')
+                drinkWater(data).then(res => {
+                    this.getWaters();
+                    this.dateLists()
+                }).catch(err => {
+                    console.log(err, '添加食物error');
+                    uni.showToast({
+                        title: err.message,
+                        icon: "none",
+                        duration:2000,
+                        mask:true
+                    })
+                });
+            },
+            // 删除和喝水记录
+            delWater(id) {
+                uni.showModal({
+                    content: '确认删除么？',
+                    confirmText: '确认删除',
+                    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'
+                                    });
+                                });
+                        }
+                    }
+                });
+            },
+            //#region 日历操作相关
+            // 日历列表
+            dateLists() {
+                let data = {
+                    month: this.month,
+                    type: this.dateType
+                }
+                console.log(data,'data.....')
+                dateList(data).then(res => {
+                    console.log(res)
+                    this.calendarList = res.calendar
+                    this.dateType = ''
+                    this.month = res.month
+                }).catch(err => {
+                    uni.showToast({
+                        title: err.message,
+                        icon: 'none'
+                    })
+                })
+            },
+            // 选择日期
+            dateClick(item) {
+                console.log(item)
+                this.today = item.today
+                this.month = item.today
+                this.reset()
+            },
+            // 返回到今日
+            backDate() {
+                this.today = moment(new Date()).format('YYYY-MM-DD')
+                this.reset()
+            },
+            //  上一个月或者下一个月
+            datePreNext(type) {
+                this.dateType = type
+                this.dateLists()
+            },
+            // 关闭日历
+            closeDate() {
+                this.month = this.today
+                this.dateShow = false
+            },
+            // 重置日历数据
+            reset() {
+                this.calendarList = []
+                this.dateLists()
+                this.getWaters()
+                this.closeDate()
+            }
+            //#endregion 日历操作相关
+        }
+    };
 </script>
 <style lang="scss" scoped>
-.drink {
-	// 喝水 水杯及文字
+    .drink {
+        padding-top: 120rpx;
 
-	.drink-content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-		// padding: $padding  0;
-		position: relative;
-		// 标题 再喝水
-		.title {
-			font-size: $title-size + 4;
-			color: $main-color;
-			font-weight: normal;
-			margin: $margin * 2;
-			position: relative;
-			.is_complete {
-				position: absolute;
-				top: 30rpx;
-				right: -120rpx;
-			}
-			.num {
-				font-size: $title-size * 2.3;
-				padding: 0 $padding * 0.3;
-				font-weight: bold;
-			}
-			.total {
-				font-size: $title-size;
-				color: $text-gray-m;
-				padding-left: $padding * 0.2;
-			}
-		}
-		// 加一杯水
-		.add-water {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			justify-content: center;
-			box-sizing: border-box;
-			font-size: $title-size;
-			color: $text-color;
-			margin-top: $margin * 2;
-			position: relative;
-			span {
-				padding-top: $padding * 0.4;
-				color:$text-gray-m;
-				font-size: $title-size;
-			}
-			.add-icon {
-				position: absolute;
-				top: $margin + 8;
-				right: 0;
-			}
-		}
-		// 目标
-		.water-target {
-			display: flex;
-			flex-direction: column;
-			align-items: center;
-			justify-content: center;
-			box-sizing: border-box;
-			color: $text-gray-m;
-			font-size: $title-size;
-			position: absolute;
-			z-index: 110;
-			right: $padding * 1.4;
-			top: 50%;
-			.target-item {
-				margin-top: $margin * 1.6;
-				.target-icon {
-					padding-top: $padding * 0.5;
-				}
-			}
-		}
-	}
-	// 喝水记录
-	.--history {
-		padding: $padding;
-		.no-drink {
-			color: $text-gray-m;
-			font-size: $title-size-m;
-			padding-top: $padding + 10;
-		}
-		// 标题
-		.title {
-			font-size: $title-size + 4;
-			font-weight: bold;
-			color: $text-color;
-			position: relative;
-			display: flex;
-			flex-direction: row;
-			align-items: center;
-			justify-content: flex-start;
-			box-sizing: border-box;
-			padding-left: $padding;
-			padding-bottom: $padding;
-			&::before {
-				position: absolute;
-				content: '';
-				width: 8rpx;
-				height: 45rpx;
-				left: 0;
-				background-color: $main-color;
-				border-radius: 10rpx;
-			}
-		}
+        // 顶部日历筛选部分
+        .u-center {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
 
-		// 列表
-		.lists {
-			// background-color: pink;
-			display: flex;
-			flex-direction: row;
-			align-items: center;
-			justify-content: space-between;
-			box-sizing: border-box;
-			border-bottom: solid 1rpx #f7f7f7;
-			.lists-water {
-				background-image: linear-gradient(to right, $main-color, $main-color);
-				width: 90rpx;
-				height: 90rpx;
-				border-radius: 50%;
-				display: flex;
-				flex-direction: row;
-				align-items: center;
-				justify-content: center;
-				box-sizing: border-box;
-			}
-			.list-item {
-				flex: 1;
-				margin-left: $margin * 0.7;
-				font-size: $title-size;
-				color: $text-gray-m;
-				display: flex;
-				flex-direction: row;
-				align-items: center;
-				justify-content: space-between;
-				box-sizing: border-box;
-				margin: $margin 0 $margin $margin * 0.7;
-				.list-item-title {
-					font-size: $title-size + 3;
-					color: $text-color;
-					display: flex;
-					flex-direction: column;
-					align-items: flex-start;
-					justify-content: center;
-					box-sizing: border-box;
-					font-weight: bold;
-					span {
-						margin-top: $margin * 0.4;
-						background-color: #f7f7f7;
-						padding: 4rpx 10rpx;
-						border-radius: 50rpx;
-						font-weight: normal;
-						font-size: $title-size - 3;
-					}
-				}
-			}
-		}
-	}
-}
-// 水杯动画
-.wave-content {
-	position: relative;
-	z-index: 110;
-	.grass {
-		position: relative;
-		z-index: 120099;
-	}
+            .date {
+                background-color: rgba($color: #000000, $alpha: .1);
+                color: #fff;
+                min-width: 340rpx;
+                display: flex;
+                flex-direction: row;
+                align-items: center;
+                justify-content: center;
+                box-sizing: border-box;
+                padding: 8rpx 20rpx;
+                border-radius: $radius * 2;
+                margin: 0 10rpx;
+                font-size: $title-size - 2;
+            }
 
-	.wave {
-		position: absolute;
-		width: 290rpx;
-		height: 500rpx;
-		background-color: rgba($color: $main-color, $alpha: 0.6);
-		background-size: 100%;
-		overflow: hidden;
-		top: 10rpx;
-		left: 20rpx;
-		z-index: 10;
-		&::before,
-		&::after {
-			content: '';
-			position: absolute;
-			width: 1000rpx;
-			height: 1000rpx;
-			top: var(--ballPercent);
-			left: 50%;
-			background-color: rgba(255, 255, 255, 0.4);
-			border-radius: 45%;
-			transform: translate(-50%, -70%) rotate(0);
-			animation: rotate 4s linear infinite;
-			z-index: 10;
-		}
-		&::after {
-			border-radius: 47%;
-			background-color: rgba(255, 255, 255, 0.9);
-			transform: translate(-50%, -70%) rotate(0);
-			animation: rotate 6s linear -5s infinite;
-			z-index: 20;
-		}
-	}
+            .play-right-fill {
+                padding: $padding !important;
+                background-color: pink;
+            }
+        }
 
-	@keyframes rotate {
-		50% {
-			transform: translate(-50%, -73%) rotate(180deg);
-		}
-		100% {
-			transform: translate(-50%, -70%) rotate(360deg);
-		}
-	}
-}
+        // 喝水 水杯及文字
+
+        .drink-content {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            // padding: $padding  0;
+            position: relative;
+
+            // 标题 再喝水
+            .title {
+                font-size: $title-size + 4;
+                color: $main-color;
+                font-weight: normal;
+                margin: $margin * 2;
+                position: relative;
+
+                .is_complete {
+                    position: absolute;
+                    top: 30rpx;
+                    right: -120rpx;
+                }
+
+                .num {
+                    font-size: $title-size * 2.3;
+                    padding: 0 $padding * 0.3;
+                    font-weight: bold;
+                }
+
+                .total {
+                    font-size: $title-size;
+                    color: $text-gray-m;
+                    padding-left: $padding * 0.2;
+                }
+            }
+
+            // 加一杯水
+            .add-water {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+                box-sizing: border-box;
+                font-size: $title-size;
+                color: $text-color;
+                margin-top: $margin * 2;
+                position: relative;
+
+                span {
+                    padding-top: $padding * 0.4;
+                    color: $text-gray-m;
+                    font-size: $title-size;
+                }
+
+                .add-icon {
+                    position: absolute;
+                    top: $margin + 8;
+                    right: 0;
+                }
+            }
+
+            // 目标
+            .water-target {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+                box-sizing: border-box;
+                color: $text-gray-m;
+                font-size: $title-size;
+                position: absolute;
+                z-index: 110;
+                right: $padding * 1.4;
+                top: 50%;
+
+                .target-item {
+                    margin-top: $margin * 1.6;
+
+                    .target-icon {
+                        padding-top: $padding * 0.5;
+                    }
+                }
+            }
+        }
+
+        // 喝水记录
+        .--history {
+            padding: $padding;
+
+            .no-drink {
+                color: $text-gray-m;
+                font-size: $title-size-m;
+                padding-top: $padding + 10;
+            }
+
+            // 标题
+            .title {
+                font-size: $title-size + 4;
+                font-weight: bold;
+                color: $text-color;
+                position: relative;
+                display: flex;
+                flex-direction: row;
+                align-items: center;
+                justify-content: flex-start;
+                box-sizing: border-box;
+                padding-left: $padding;
+                padding-bottom: $padding;
+
+                &::before {
+                    position: absolute;
+                    content: '';
+                    width: 8rpx;
+                    height: 45rpx;
+                    left: 0;
+                    background-color: $main-color;
+                    border-radius: 10rpx;
+                }
+            }
+
+            // 列表
+            .lists {
+                // background-color: pink;
+                display: flex;
+                flex-direction: row;
+                align-items: center;
+                justify-content: space-between;
+                box-sizing: border-box;
+                border-bottom: solid 1rpx #f7f7f7;
+
+                .lists-water {
+                    background-image: linear-gradient(to right, $main-color, $main-color);
+                    width: 90rpx;
+                    height: 90rpx;
+                    border-radius: 50%;
+                    display: flex;
+                    flex-direction: row;
+                    align-items: center;
+                    justify-content: center;
+                    box-sizing: border-box;
+                }
+
+                .list-item {
+                    flex: 1;
+                    margin-left: $margin * 0.7;
+                    font-size: $title-size;
+                    color: $text-gray-m;
+                    display: flex;
+                    flex-direction: row;
+                    align-items: center;
+                    justify-content: space-between;
+                    box-sizing: border-box;
+                    margin: $margin 0 $margin $margin * 0.7;
+
+                    .list-item-title {
+                        font-size: $title-size + 3;
+                        color: $text-color;
+                        display: flex;
+                        flex-direction: column;
+                        align-items: flex-start;
+                        justify-content: center;
+                        box-sizing: border-box;
+                        font-weight: bold;
+
+                        span {
+                            margin-top: $margin * 0.4;
+                            background-color: #f7f7f7;
+                            padding: 4rpx 10rpx;
+                            border-radius: 50rpx;
+                            font-weight: normal;
+                            font-size: $title-size - 3;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    // 水杯动画
+    .wave-content {
+        position: relative;
+        z-index: 1;
+
+        .grass {
+            position: relative;
+            z-index: 1;
+        }
+
+        .wave {
+            position: absolute;
+            width: 290rpx;
+            height: 500rpx;
+            background-color: rgba($color: $main-color, $alpha: 0.6);
+            background-size: 100%;
+            overflow: hidden;
+            top: 10rpx;
+            left: 20rpx;
+            z-index: 1;
+
+            &::before,
+            &::after {
+                content: '';
+                position: absolute;
+                width: 1000rpx;
+                height: 1000rpx;
+                top: var(--ballPercent);
+                left: 50%;
+                background-color: rgba(255, 255, 255, 0.4);
+                border-radius: 45%;
+                transform: translate(-50%, -70%) rotate(0);
+                animation: rotate 4s linear infinite;
+                z-index: 1;
+            }
+
+            &::after {
+                border-radius: 47%;
+                background-color: rgba(255, 255, 255, 0.9);
+                transform: translate(-50%, -70%) rotate(0);
+                animation: rotate 6s linear -5s infinite;
+                z-index: 20;
+            }
+        }
+
+        @keyframes rotate {
+            50% {
+                transform: translate(-50%, -73%) rotate(180deg);
+            }
+
+            100% {
+                transform: translate(-50%, -70%) rotate(360deg);
+            }
+        }
+    }
 </style>
diff --git a/pages/record/foods.vue b/pages/record/foods.vue
index 8b1f581..c0be654 100644
--- a/pages/record/foods.vue
+++ b/pages/record/foods.vue
@@ -3,450 +3,560 @@
  * @Author: Aimee·Zhang
  * @Date: 2022-01-11 08:54:49
  * @LastEditors: Aimee·Zhang
- * @LastEditTime: 2022-01-20 10:05:15
+ * @LastEditTime: 2022-02-08 10:41:15
 -->
 
 <template>
-	<view class="record--foods">
-		<!-- 饮食进度条 -->
-		<view class="cricle-content">
-			<view class="info">
-				饮食摄入
-				<span>{{ calorys.intake_total }}</span>
-			</view>
-			<arprogress
-				:percent="calorys.exceeds ? 100 : calorys.ratio"
-				inactiveColor="#f5f4f9"
-				: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>
-			</arprogress>
-			<view class="info" @click="errToast">
-				运动消耗
-				<span>{{ calorys.exercise_total }}</span>
-			</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>
+    <view class="record--foods">
+        <!-- 自定义导航部分 -->
+        <u-navbar :safeAreaInsetTop="true" :fixed='true' bgColor="#34ce98" :autoBack="true">
+            <view class="u-nav-slot" slot="left">
+                <u-icon name="arrow-leftward" :bold="true" size="20" color="#fff" />
+            </view>
+            <view class="u-nav-slot u-center" slot="center" @click="dateShow = true,dateLists()">
+                <u-icon name="play-left-fill" size="14" color="#fff" @click="datePreNext('before')" />
+                <view class="date"> <u-icon name="calendar" color="#fff" label-color="#fff" width="150" :label="today" label-size="14" size="20" /> </view>
+                <u-icon name="play-right-fill" size="14" color="#fff" @click="datePreNext('after')" />
+            </view>
+            <view class="u-nav-slot" slot="right">
+                <u-icon :name="require('@/static/icon/sign-icon.gif')" :bold="true" size="30" @click="$Router.push({name:'signIndex'})" />
+            </view>
+        </u-navbar>
 
-		<!-- 有饮食记录 -->
-		<template v-if="intakes.length > 0">
-			<view class="foods-add" v-for="(it, index) in intakes" :key="index">
-				<view class="foods-title">
-					<view class="title-left">
-						{{ it.name }}
-						<span v-if="it.remark">{{ it.remark || '' }}</span>
-					</view>
-					<view class="title-right">
-						{{ it.total }}
-						<span class="dw">千卡</span>
-						<u-icon name="arrow-right" color="#ddd" size="13" :bold="true" />
-					</view>
-				</view>
-				<goodsList :lists="it.intake" type="no-dian" @editGoods="editGoods" @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>
+        <!-- 饮食进度条 -->
+        <view class="cricle-content">
+            <view class="info">
+                饮食摄入
+                <span>{{ calorys.intake_total }}</span>
+            </view>
+            <arprogress :percent="calorys.exceeds ? 100 : calorys.ratio" inactiveColor="#f5f4f9"
+                :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>
+            </arprogress>
+            <view class="info" @click="errToast">
+                运动消耗
+                <span>{{ calorys.exercise_total }}</span>
+            </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>
 
-			<sports type="edit" :lists="sports" @editSport="editSport" @longClick="longClick" />
-		</template>
+        <!-- 有饮食记录 -->
+        <template v-if="intakes.length > 0">
+            <view class="foods-add" v-for="(it, index) in intakes" :key="index">
+                <view class="foods-title">
+                    <view class="title-left">
+                        {{ it.name }}
+                        <span v-if="it.remark">{{ it.remark || '' }}</span>
+                    </view>
+                    <view class="title-right">
+                        {{ it.total }}
+                        <span class="dw">千卡</span>
+                        <u-icon name="arrow-right" color="#ddd" size="13" :bold="true" />
+                    </view>
+                </view>
+                <goodsList :lists="it.intake" type="no-dian" @editGoods="editGoods" @longClickGoods="longClickGoods" />
+            </view>
+        </template>
 
-		<!-- 没有饮食记录 -->
-		<view class="no-foods" v-if="sports.length === 0 && intakes.length === 0">
-			<u-image :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>
+        <!-- 运动列表 -->
+        <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>
 
-		<!-- 加餐模块 -->
-		<u-action-sheet
-			:actions="addEatList"
-			title="加餐模块"
-			:closeOnClickOverlay="true"
-			:closeOnClickAction="true"
-			@select="selectClick"
-			cancelText="取消"
-			:show="addEatShow"
-			@close="addEatShow = false"
-		></u-action-sheet>
-		<!-- 底部 早餐等菜单 -->
-		<u-tabbar :fixed="true" :placeholder="true" :safeAreaInsetBottom="true" inactiveColor="#333" @click="tabbarClick">
-			<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>
+            <sports type="edit" :lists="sports" @editSport="editSport" @longClick="longClick" />
+        </template>
 
-		<!-- 修改食品弹窗 -->
-		<!--  添加食谱弹窗 -->
-		<addFoods
-			v-if="addShow"
-			:addShow="addShow"
-			:selectGoods="selectGoods"
-			:decimals="true"
-			@confirm="confirmHandle"
-			@close="closeHandle"
-			@delThis="delThis"
-			@tabGoodsInfo="tabGoodsInfo"
-			max="999"
-		/>
+        <!-- 没有饮食记录 -->
+        <view class="no-foods" v-if="sports.length === 0 && intakes.length === 0">
+            <u-image :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>
 
-		<!-- 修改运动弹窗 -->
-		<addPopup :selectSports="selectSports" :addSportsShow="addSportsShow" @comfirmSport="comfirmSport" @cancleSport="cancleSport" @delSport="delSport" />
-	</view>
+        <!-- 加餐模块 -->
+        <u-action-sheet :actions="addEatList" title="加餐模块" :closeOnClickOverlay="true" :closeOnClickAction="true"
+            @select="selectClick" cancelText="取消" :show="addEatShow" @close="addEatShow = false"></u-action-sheet>
+            
+        <!-- 底部 早餐等菜单 -->
+        <u-tabbar :fixed="true" :placeholder="true" :safeAreaInsetBottom="true" inactiveColor="#333"
+            @click="tabbarClick">
+            <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 v-if="addShow" :addShow="addShow" :selectGoods="selectGoods" :decimals="true" @confirm="confirmHandle"
+            @close="closeHandle" @delThis="delThis" @tabGoodsInfo="tabGoodsInfo" max="999" />
+
+        <!-- 修改运动弹窗 -->
+        <addPopup :selectSports="selectSports" :addSportsShow="addSportsShow" @comfirmSport="comfirmSport"
+            @cancleSport="cancleSport" @delSport="delSport" />
+
+
+        <!-- 选择日历 -->
+        <dateTemplate :lists="calendarList" :today="today" :month="month" :dateShow="dateShow" type='foods' @backDate="backDate"
+            @dateClick="dateClick" @closeDate="closeDate" @datePreNext="datePreNext" />
+
+    </view>
 </template>
 
 <script>
-import arprogress from '@/components/ar-circle-progress/index.vue';
-import goodsList from '@/components/foods';
-import { plans, editHealthFoods, delHealthFoods } from '@/apis/interfaces/foods.js';
-import moment from 'moment';
-import addFoods from '@/components/add-goods-template/add-goods-template';
-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: [
-				{
-					name: '上午加餐',
-					type: 2
-				},
-				{
-					name: '下午加餐',
-					type: 4
-				},
-				{
-					name: '晚上加餐',
-					type: 6
-				}
-			],
-			today: moment(new Date()).format('YYYY-MM-DD'),
-			calorys: {}, // 当日食谱推荐页面的信息
-			intakes: [], // 当日摄入列表
-			sports: [], // 运动列表
-			sportsTotal: 0,
-			addSportsShow: false, // 添加运动弹窗显示
-			selectSports: {} // 选择新增的运动
-		};
-	},
-	onShow() {
-		this.getList();
-	},
-	methods: {
-		// 编辑运动
-		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;
-		},
+    import moment from 'moment';
+    import sports from '@/components/sports';
+    import goodsList from '@/components/foods';
+    import addPopup from '@/components/sports/addPopup';
+    import arprogress from '@/components/ar-circle-progress/index.vue';
+    import addFoods from '@/components/add-goods-template/add-goods-template';
+    import dateTemplate from '@/components/date-template/index.vue'
+    import {
+        editHealthSports,
+        delHealthSports
+    } from '@/apis/interfaces/sport.js';
+    import {
+        plans,
+        editHealthFoods,
+        delHealthFoods,
+        dateList
+    } from '@/apis/interfaces/foods.js';
+    export default {
+        components: {
+            arprogress,
+            goodsList,
+            addFoods,
+            addPopup,
+            sports,
+            dateTemplate
+        },
+        data() {
+            return {
+                addShow: false, // 添加食品显示
+                selectGoods: [], // 选择新增的食品
+                addEatShow: false, // 加餐弹窗默认不显示
+                addEatList: [{name: '上午加餐',type: 2},{name: '下午加餐',type: 4},{name: '晚上加餐',type: 6}],
+                calorys: {}, // 当日食谱推荐页面的信息
+                intakes: [], // 当日摄入列表
+                sports: [], // 运动列表
+                sportsTotal: 0,
+                addSportsShow: false, // 添加运动弹窗显示
+                selectSports: {}, // 选择新增的运动
+                today: moment(new Date()).format('YYYY-MM-DD'),// 当前时间
+                month: moment(new Date()).format('YYYY-MM'), //当前月份
+                dateShow: false, // 日历展示
+                calendarList: [],
+                dateType: '', // before after ''
+            };
+        },
+        onShow() {
+            this.getList();
+            this.dateLists(); // 日期列表
+        },
+        methods: {
+            // 获取当前统计页面基本数据
+            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;
+                });
+            },
 
-		// 弹窗确认按钮新增  这里接口报错了  ，
-		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();
-			}).catch(err=>{
-				 uni.showToast({
-				 	title:err.message,
-					icon:'none'
-				 })
-			});
-		},
+            //#region 运动操作相关
+            // 编辑运动
+            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);
+                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 // 日期
+                };
+                editHealthSports(params).then(res => {
+                    this.addSportsShow = false;
+                    this.selectSports = {};
+                    this.getList();
+                }).catch(err => {
+                    uni.showToast({
+                        title: err.message,
+                        icon: 'none'
+                    })
+                });
+            },
+            // 弹窗取消按钮
+            cancleSport(show) {
+                this.addSportsShow = show;
+            },
+            // 删除运动
+            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();
+                        }
+                    }
+                });
+            },
+            //#endregion 运动操作相关
 
-		// 弹窗取消按钮
-		cancleSport(show) {
-			this.addSportsShow = show;
-		},
-		// 删除运动
-		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 {
-				if (e === 4) {
-					// 新增运动
-					uni.navigateTo({
-						url: `/pages/record/addExercises`
-					});
-				} else {
-					uni.navigateTo({
-						url: `/pages/record/addFoods?type=${e === 0 ? 1 : e === 1 ? 3 : 5}`
-					});
-				}
-			}
-		},
-		// 选择了加餐跳转
-		selectClick(e) {
-			uni.navigateTo({
-				url: `/pages/record/addFoods?type=${e.type}`
-			});
-			// 选择加餐
-		},
-		// 编辑食品
-		editGoods(e) {
-			this.selectGoods = [e];
-			this.addShow = true;
-		},
-		closeHandle() {
-			//键盘关闭的回调函数
-			this.addShow = false;
-		},
-		// 监听点击键盘触发返回值新增食品
-		confirmHandle(value) {
-			// 新添加食物
-			let data = {
-				ser: 1,
-				weight: value,
-				food_id: this.selectGoods[0].food_id,
-				intake_id: this.selectGoods[0].intake_id
-			};
-			this.editHealthFoods(data);
-		},
-		// 添加食物
-		editHealthFoods(data) {
-			editHealthFoods(data).then(res => {
-				console.log(res);
-				this.addShow = false;
-				this.getList();
-			});
-		},
-		// 删除该食物
-		delThis(e) {
-			delHealthFoods(this.selectGoods[0].intake_id).then(res => {
-				this.addShow = false;
-				this.getList();
-			});
-		},
-		// 跳转到食品详情
-		tabGoodsInfo(e) {
-			this.$Router.push({
-				name: 'rankingDetails',
-				params: e
-			});
-		}
-	}
-};
+
+            //#region 食物操作相关
+            // 长按删除食品
+            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'
+                });
+            },
+            // 底部按钮点击触发的事件 早餐1 午餐3 晚餐5 加餐(早2中4晚6)
+            tabbarClick(e) {
+                console.log(e);
+                this.tabarIndex = e;
+                if (e === 3) {
+                    this.addEatShow = true;
+                } else {
+                    if (e === 4) {
+                        // 新增运动
+                        uni.navigateTo({
+                            url: `/pages/record/addExercises`
+                        });
+                    } else {
+                        uni.navigateTo({
+                            url: `/pages/record/addFoods?type=${e === 0 ? 1 : e === 1 ? 3 : 5}&date=${this.today}`
+                        });
+                    }
+                }
+            },
+            // 选择了加餐跳转
+            selectClick(e) {
+                uni.navigateTo({
+                    url: `/pages/record/addFoods?type=${e.type}&date=${this.today}`
+                });
+                // 选择加餐
+            },
+            // 编辑食品
+            editGoods(e) {
+                this.selectGoods = [e];
+                this.addShow = true;
+            },
+            closeHandle() {
+                //键盘关闭的回调函数
+                this.addShow = false;
+            },
+            // 监听点击键盘触发返回值新增食品
+            confirmHandle(value) {
+                // 新添加食物
+                let data = {
+                    ser: 1,
+                    weight: value,
+                    food_id: this.selectGoods[0].food_id,
+                    intake_id: this.selectGoods[0].intake_id
+                };
+                this.editHealthFoods(data);
+            },
+            // 添加食物
+            editHealthFoods(data) {
+                editHealthFoods(data).then(res => {
+                    console.log(res,'添加食物');
+                    this.addShow = false;
+                    this.getList();
+                }).catch(err=>{
+                    console.log(res,'添加食物error');
+                    uni.showToast({
+                        title:err.message,
+                        icon:"none"
+                    })
+                });
+            },
+            // 删除该食物
+            delThis(e) {
+                delHealthFoods(this.selectGoods[0].intake_id).then(res => {
+                    this.addShow = false;
+                    this.getList();
+                });
+            },
+            // 跳转到食品详情
+            tabGoodsInfo(e) {
+                this.$Router.push({
+                    name: 'rankingDetails',
+                    params: e
+                });
+            },
+            //#endregion 食物操作相关
+
+            //#region 日历操作相关 
+            // 日历列表
+            dateLists() {
+                let data = {
+                    month: this.month,
+                    type: this.dateType
+                }
+                dateList(data).then(res => {
+                    console.log(res)
+                    this.calendarList = res.calendar
+                    this.dateType = ''
+                    this.month = res.month
+                }).catch(err => {
+                    uni.showToast({
+                        title: err.message,
+                        icon: 'none'
+                    })
+                })
+            },
+            // 选择日期
+            dateClick(item) {
+                this.today = item.today
+                this.month = item.today
+                this.reset()
+            },
+            // 返回到今日
+            backDate() {
+                this.today = moment(new Date()).format('YYYY-MM-DD')
+                this.reset()
+            },
+            //  上一个月或者下一个月
+            datePreNext(type) {
+                this.dateType = type
+                this.dateLists()
+            },
+            // 关闭日历
+            closeDate() {
+                this.month = this.today
+                this.dateShow = false
+            },
+            // 重置日历数据
+            reset() {
+                this.calendarList = []
+                this.dateLists()
+                this.getList()
+                this.closeDate()
+            }
+            //#endregion 日历操作相关
+        }
+    };
 </script>
 
 <style lang="scss" scoped>
-.record--foods {
-	padding: $padding $padding $padding * 7 $padding;
-	// background: green;
-}
-// 饮食进度条
-.cricle-content {
-	box-shadow: 0 0 4rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
-	font-size: $title-size-m - 6;
-	padding: $padding * 1.8 $padding;
-	border-radius: $radius;
-	color: $text-gray-m;
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	justify-content: space-around;
-	box-sizing: border-box;
-	position: relative;
-	.cricle {
-		.num {
-			color: $text-color;
-			font-size: $title-size * 1.8;
-			font-weight: bold;
-			padding: $padding * 0.2;
-		}
-		.num1 {
-			color: #f00;
-		}
-	}
-	.info {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		box-sizing: border-box;
-		span {
-			font-size: $title-size + 10;
-			font-weight: bold;
-			color: $text-color;
-			padding-top: $padding * 0.5;
-		}
-	}
-	.ic-left {
-		position: absolute;
-		left: 0;
-		top: 0;
-		background-image: linear-gradient(to right, #ffebb9, #fbd57b);
-		color: #664710;
-		padding: 10rpx $padding * 0.6;
-		border-radius: 0 0 $radius 0;
-	}
-	.ic-day {
-		position: absolute;
-		right: $padding;
-		top: $padding;
-	}
-}
-// 没有饮食记录
-.no-foods {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	box-sizing: border-box;
-	font-size: $title-size-m - 4;
-	color: $text-gray-m;
-	min-height: 40vh;
-	// background: pink;
-	.no-foods-img {
-		opacity: 0.5;
-	}
-	view {
-		padding: $padding * 0.2;
-	}
-}
-// 饮食记录 早中晚加餐等
-.foods-add {
-	border-bottom: solid 1rpx #f7f7f7;
-	margin-top: $margin;
-}
-// 主标题
-.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: center;
-		box-sizing: border-box;
-		color: $main-color;
-		.dw {
-			margin: 0 $margin * 0.6 0 $margin * 0.4;
-			color: $text-gray;
-		}
-	}
-}
+    .record--foods {
+        padding: $padding $padding $padding * 7 $padding;
+        // background: green;
+    }
+
+    // 顶部日历筛选部分
+    .u-center {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: center;
+        box-sizing: border-box;
+
+        .date {
+            background-color: rgba($color: #000000, $alpha: .1);
+            color: #fff;
+            min-width: 340rpx;
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            padding: 8rpx 20rpx;
+            border-radius: $radius * 2;
+            margin: 0 10rpx;
+            font-size: $title-size - 2;
+        }
+
+        .play-right-fill {
+            padding: $padding !important;
+            background-color: pink;
+        }
+    }
+
+
+    // 饮食进度条
+    .cricle-content {
+        box-shadow: 0 0 4rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
+        font-size: $title-size-m - 6;
+        padding: $padding * 1.8 $padding;
+        border-radius: $radius;
+        color: $text-gray-m;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        justify-content: space-around;
+        box-sizing: border-box;
+        position: relative;
+        margin-top: $margin * 5;
+
+        .cricle {
+            .num {
+                color: $text-color;
+                font-size: $title-size * 1.8;
+                font-weight: bold;
+                padding: $padding * 0.2;
+            }
+
+            .num1 {
+                color: #f00;
+            }
+        }
+
+        .info {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+
+            span {
+                font-size: $title-size + 10;
+                font-weight: bold;
+                color: $text-color;
+                padding-top: $padding * 0.5;
+            }
+        }
+
+        .ic-left {
+            position: absolute;
+            left: 0;
+            top: 0;
+            background-image: linear-gradient(to right, #ffebb9, #fbd57b);
+            color: #664710;
+            padding: 10rpx $padding * 0.6;
+            border-radius: 0 0 $radius 0;
+        }
+
+        .ic-day {
+            position: absolute;
+            right: $padding;
+            top: $padding;
+        }
+    }
+
+    // 没有饮食记录
+    .no-foods {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        box-sizing: border-box;
+        font-size: $title-size-m - 4;
+        color: $text-gray-m;
+        min-height: 40vh;
+
+        // background: pink;
+        .no-foods-img {
+            opacity: 0.5;
+        }
+
+        view {
+            padding: $padding * 0.2;
+        }
+    }
+
+    // 饮食记录 早中晚加餐等
+    .foods-add {
+        border-bottom: solid 1rpx #f7f7f7;
+        margin-top: $margin;
+    }
+
+    // 主标题
+    .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;
+                color: $text-gray-m;
+                margin-left: $margin - 10;
+            }
+        }
+
+        .title-right {
+            font-size: $title-size-m;
+            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;
+            }
+        }
+    }
 </style>
diff --git a/pages/record/index.vue b/pages/record/index.vue
index 17660b4..dfa5f76 100644
--- a/pages/record/index.vue
+++ b/pages/record/index.vue
@@ -398,9 +398,7 @@ export default {
          */
 		logs() {
 			logs().then(res => {
-				
-				console.log(res.is_login)
-				
+				// console.log(res.is_login)
 				this.weight = res.weight;
 				this.water = res.water;
 				this.intake_run = res.intake_run;
diff --git a/pages/record/weight.vue b/pages/record/weight.vue
index b75cfad..1c43df8 100644
--- a/pages/record/weight.vue
+++ b/pages/record/weight.vue
@@ -8,231 +8,292 @@
 
 <template>
     <view class="weight">
-        <!-- 体重表 -->
-        <view class="progress-top">
-            <view class="unit">
-                <span
-                    :class="isJin === 2?'active':''"
-                    @click="isJin = 1"
-                >斤</span>
-                <span
-                    :class="isJin === 1?'active':''"
-                    @click="isJin = 1"
-                >公斤</span>
-            </view>
-            <view class="progress">
-                <view>{{weightInfo.text}}</view>
-                <u-count-to
-                    class="uCountTo"
-                    :startVal="0"
-                    :endVal="weightInfo.change"
-                    :decimals="1"
-                    color="#333"
-                    fontSize="36"
-                    :bold="true"
-                />
-                <view>保持 / 塑性</view>
-            </view>
-            <view
-                class="add-weight"
-                @click="addWeightShow = true"
-            >记录体重</view>
-            <view class="des-title">以最后一次记录为主且每日只能更新一次</view>
-        </view>
-        <!-- 体重列表 -->
-        <view
-            class="weight-list"
-            v-if="lists.length>0"
-        >
-            <view
-                class="list-item"
-                v-for="item in lists"
-                :key="item.wight_id"
-            >
-                <view class="list-left">
-                    <view class="list-title">
-                        <span>{{item.weight}}</span>公斤
-                    </view>
-                    测量结果
+        <!-- 进度模块 -->
+        <block v-if="tabbarId === 0">
+            <!-- 体重表 -->
+            <view class="progress-top">
+                <view class="unit"> <span :class="isJin === 2?'active':''" @click="isJin = 1">斤</span> <span :class="isJin === 1?'active':''" @click="isJin = 1">公斤</span> </view>
+                <view class="progress">
+                    <view>{{weightInfo.text}}</view>
+                    <u-count-to class="uCountTo" :startVal="0" :endVal="weightInfo.change" :decimals="1" color="#333" fontSize="36" :bold="true" />
+                    <view>保持 / 塑性</view>
                 </view>
-                <view class="list-right">
-                    <span>开始保持 / 塑性</span>
-                    {{item.created_at}}
+                <view class="add-weight" @click="addWeightShow = true">记录体重</view>
+                <view class="des-title">以最后一次记录为主且每日只能更新一次</view>
+            </view>
+
+            <!-- 体重列表 -->
+            <view class="weight-list" v-if="lists.length>0">
+                <view class="list-item">
+                    <view class="list-left"> <view class="list-title"> <span>{{weightInfo.begin}}</span>公斤 </view> 初始体重 </view>
+                    <view class="list-right"> <span>开始保持 / 塑性</span> {{weightInfo.first_weight_time}} </view>
+                </view>
+                <view class="list-item" v-for="item in lists" :key="item.wight_id">
+                    <view class="list-left"> <view class="list-title"> <span>{{item.weight}}</span>公斤 </view> 测量结果 </view>
+                    <view class="list-right"> <span>开始保持 / 塑性</span> {{item.created_at}} </view>
                 </view>
             </view>
+            <view class="no-lists" v-else>还没有体重信息，记录下呗~</view>
+        </block>
+        
+        
+        <!-- 曲线模块 -->
+        <view v-if="tabbarId === 1">
+            <!-- 健康测评 -->
+            <u-image :src="require('@/static/imgs/health1.png')" class="eval-img" @click="$Router.push({ name: 'EvaluationList' })" :lazy-load="true" radius="10rpx" mode="widthFix" width="100%" />
+            <view class="curve">
+               <view class="title"> 体重 <span>单位：公斤</span> </view>
+               <u-icon @click="addWeightShow = true" name="edit-pen-fill" color="#34ce98" size="20" :bold="true" label="更新" labelPos="right" labelSize="13" labelColor="#999" space="4" />
+            </view>
+            <view class="charts-box"> <qiun-data-charts type="area" :chartData="chartData" background="none" /> </view>
+            <view class="progress-top">
+                <view class="add-weight" @click="addWeightShow = true">记录体重</view>
+                <view class="des-title">只显示最近七次测量记录</view>
+            </view>
         </view>
-        <view
-            class="no-lists"
-            v-else
-        >还没有体重信息，记录下呗~</view>
         <!-- 记录体重弹窗 -->
-        <u-popup
-            :show="addWeightShow"
-            :round="10"
-            @close="addWeightShow = false"
-            :closeable="true"
-        >
+        <u-popup :show="addWeightShow" :round="10" @close="addWeightShow = false" :closeable="true">
             <view class="addWeightContent">
                 <view class="date">今天</view>
                 <view class='count'><span>{{weight}}</span>公斤</view>
-                <vue-scale
-                    :min="10"
-                    :max="100"
-                    :int="false"
-                    :single="10"
-                    :h="80"
-                    :styles="styles"
-                    @scroll="scroll"
-                    :scrollLeft="Number(weight)"
-                />
-                <view
-                    class="addBtn"
-                    @click="addWeight"
-                >确认添加</view>
+                <vue-scale :min="10" :max="100" :int="false" :single="10" :h="80" :styles="styles" @scroll="scroll"
+                    :scrollLeft="Number(weight)" />
+                <view class="addBtn" @click="addWeight">确认添加</view>
             </view>
         </u-popup>
+        <!-- 底部 进度 曲线菜单 -->
+        <u-tabbar :value="tabbarId" :fixed="true" :placeholder="false" :safeAreaInsetBottom="false"
+            activeColor="#34ce98">
+            <u-tabbar-item text="进度" :icon="tabbarId === 0 ?require('../../static/imgs/speed-2.png'):require('../../static/imgs/speed-1.png')" @click="tabbarClick" />
+            <u-tabbar-item text="曲线" :icon="tabbarId === 1 ?require('../../static/imgs/curve-2.png'):require('../../static/imgs/curve-1.png')" @click="tabbarClick" />
+        </u-tabbar>
     </view>
 </template>
 <script>
-import vueScale from "@/components/vueScale";
-import { weights, addWeight } from "@/apis/interfaces/weight.js";
-import moment from "moment";
-import l from "../../uni_modules/uni-config-center/uniCloud/cloudfunctions/common/uni-config-center";
-export default {
-    components: {
-        vueScale,
-    },
-    data() {
-        return {
-            isJin: 1, // 是公斤 2 是斤 所有用到斤的直接乘以这个字段即可
-            addWeightShow: false, // 是否添加体重展示
-            styles: {
-                line: "#dbdbdb",
-                bginner: "#fbfbfb",
-                bgoutside: "#ffffff",
-                font: "#404040",
-                fontColor: "#404040",
-                fontSize: 16,
-            },
-            weight: "",
-            date: "",
-            weightInfo: {},
-            lists: [],
-            has_more: true,
-            page: 1,
-        };
-    },
-    onShow() {
-        this.getWeights();
-        this.date = moment(new Date()).format("YYYY-MM-DD");
-    },
-    onReachBottom() {
-        if (!this.has_more) {
-            uni.showToast({
-                title: "没有更多啦~",
-                icon: "none",
-            });
-        } else {
-            this.page = this.page + 1;
-            this.getWeights();
-        }
-    },
-
-    methods: {
-        //获取体重首页接口
-        getWeights() {
-            weights(this.page).then((res) => {
-				if(res.lists.page.current === 1) {
-					this.lists = []
-				}
-                this.lists = this.lists.concat(res.lists.data);
-                this.has_more = res.lists.page.has_more;
-                this.weightInfo = res.weight;
-                this.weight = res.weight.now;
-            });
+    import vueScale from "@/components/vueScale";
+    import {
+        weights,
+        addWeight,
+        curves
+    } from "@/apis/interfaces/weight.js";
+    import moment from "moment";
+    import l from "../../uni_modules/uni-config-center/uniCloud/cloudfunctions/common/uni-config-center";
+    export default {
+        components: {
+            vueScale,
         },
-        addWeight() {
-            let data = {
-                weight: this.weight,
-                date: this.date,
+        data() {
+            return {
+                isJin: 1, // 是公斤 2 是斤 所有用到斤的直接乘以这个字段即可
+                addWeightShow: false, // 是否添加体重展示
+                styles: {
+                    line: "#dbdbdb",
+                    bginner: "#fbfbfb",
+                    bgoutside: "#ffffff",
+                    font: "#404040",
+                    fontColor: "#404040",
+                    fontSize: 16,
+                },
+                weight: "",
+                date: "",
+                weightInfo: {},
+                lists: [],
+                has_more: true,
+                page: 1,
+                tabbarId: 0,
+                chartData: {
+                    "categories": ["1/1","1/2","1/3","1/4","1/5","1/6","1/7"],
+                    "series": [{"name": "最近七天进度","data": [55,51,53.3,50.3,53.3]}]
+                }, // 曲线部分 start
             };
-            addWeight(data).then((res) => {
-                this.addWeightShow = false;
-                this.page = 1;
-                this.has_more = true;
-                this.lists = [];
+        },
+        onShow() {
+            this.getWeights();
+            this.getCurves();
+            this.date = moment(new Date()).format("YYYY-MM-DD");
+        },
+        onReachBottom() {
+            if (!this.has_more) {
+                uni.showToast({
+                    title: "没有更多啦~",
+                    icon: "none",
+                    duration: 1000,
+                    mask: true
+                });
+            } else {
+                this.page = this.page + 1;
                 this.getWeights();
-            });
+            }
         },
-        // 滚动标尺触发事件
-        scroll(msg) {
-            this.weight = msg;
+
+        methods: {
+            //获取体重首页接口
+            getWeights() {
+                weights(this.page).then((res) => {
+                    console.log(res)
+                    if (res.lists.page.current === 1) {
+                        this.lists = []
+                    }
+                    this.lists = this.lists.concat(res.lists.data);
+                    this.has_more = res.lists.page.has_more;
+                    this.weightInfo = res.weight;
+                    this.weight = res.weight.now;
+                }).catch(err=>{
+                    uni.showToast({
+                        title:err.message,
+                        icon:"none",
+                        mask:true,
+                        duration:2000
+                    })
+                });
+            },
+            // 获取曲线
+            getCurves() {
+                curves().then((res) => {
+                  this.chartData={
+                      categories:res.categories,
+                      "series": [res.series]
+                  }
+                }).catch(err=>{
+                    uni.showToast({
+                        title:err.message,
+                        icon:"none",
+                        mask:true,
+                        duration:2000
+                    })
+                });
+            },
+            
+            // 更新体重
+            addWeight() {
+                let data = {
+                    weight: this.weight,
+                    date: this.date
+                };
+                addWeight(data).then((res) => {
+                    this.addWeightShow = false;
+                    this.page = 1;
+                    this.has_more = true;
+                    this.lists = [];
+                    this.getWeights();
+                    this.getCurves();
+                }).catch(err=>{
+                    uni.showToast({
+                        title:err.message,
+                        icon:"none",
+                        mask:true,
+                        duration:2000
+                    })
+                });
+            },
+            
+            // 滚动标尺触发事件
+            scroll(msg) {
+                this.weight = msg;
+            },
+
+            // 点击底部切换
+            tabbarClick(e) {
+                console.log(e)
+                this.tabbarId = Number(e)
+            }
         },
-    },
-};
+    };
 </script>
 <style lang="scss" scoped>
-//体重top
-.progress-top {
-    padding: $padding * 2 $padding;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    border-bottom: solid 1rpx #f7f7f7;
-    // 单位
-    .unit {
+    .charts-box{
+      width: 100%;
+      height:500rpx;
+      margin-top: $margin;
+    }
+    // curve
+    .curve{
+        margin-top: $margin;
+        padding: $padding $padding + 10;
         display: flex;
         flex-direction: row;
         align-items: center;
-        justify-content: flex-end;
-        width: 100%;
-        span {
-            display: inline-block;
-            width: 100rpx;
+        justify-content: space-between;
+        box-sizing: border-box;
+        font-size: $title-size + 5;
+        color: #333;
+        span{
+            color: #cacaca;
             font-size: $title-size-m;
-            color: $border-color;
-            padding: $padding * 0.5 0;
-            text-align: center;
-            border: solid 1rpx $border-color;
-            border-radius: 50rpx 0 0 50rpx;
-        }
-        span:nth-child(1) {
-            border-radius: 50rpx 0 0 50rpx;
-            border-style: solid;
-            border-color: $border-color $main-color $border-color $border-color;
-        }
-        span:nth-child(2) {
-            border-radius: 0 50rpx 50rpx 0;
-            border-style: solid;
-            border-color: $border-color $border-color $border-color $main-color;
-        }
-        span.active {
-            background-color: $main-color;
-            color: #fff;
-            border: solid 1rpx $main-color;
+            margin-left: 10rpx;
         }
     }
-
-    // 展示圈
-    .progress {
-        width: 360rpx;
-        height: 360rpx;
-        border: solid $padding * 0.7 #f7f7f7;
-        border-radius: 50%;
+    // 评测图片
+    .eval-img {
+    	box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
+    }
+    //体重top
+    .progress-top {
+        padding: $padding * 2 $padding;
         display: flex;
         flex-direction: column;
         align-items: center;
         justify-content: center;
         box-sizing: border-box;
-        color: $text-gray-m;
-        font-size: $title-size-m;
-        .uCountTo {
-            padding: $padding * 0.5;
+        border-bottom: solid 1rpx #f7f7f7;
+
+        // 单位
+        .unit {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            justify-content: flex-end;
+            width: 100%;
+
+            span {
+                display: inline-block;
+                width: 100rpx;
+                font-size: $title-size-m;
+                color: $border-color;
+                padding: $padding * 0.5 0;
+                text-align: center;
+                border: solid 1rpx $border-color;
+                border-radius: 50rpx 0 0 50rpx;
+            }
+
+            span:nth-child(1) {
+                border-radius: 50rpx 0 0 50rpx;
+                border-style: solid;
+                border-color: $border-color $main-color $border-color $border-color;
+            }
+
+            span:nth-child(2) {
+                border-radius: 0 50rpx 50rpx 0;
+                border-style: solid;
+                border-color: $border-color $border-color $border-color $main-color;
+            }
+
+            span.active {
+                background-color: $main-color;
+                color: #fff;
+                border: solid 1rpx $main-color;
+            }
         }
-    }
-    //  记录按钮
+
+        // 展示圈
+        .progress {
+            width: 360rpx;
+            height: 360rpx;
+            border: solid $padding * 0.7 #f7f7f7;
+            border-radius: 50%;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            color: $text-gray-m;
+            font-size: $title-size-m;
+
+            .uCountTo {
+                padding: $padding * 0.5;
+            }
+        }
+ //  记录按钮
     .add-weight {
         font-size: $title-size + 2;
         border-radius: $radius * 3;
@@ -242,92 +303,106 @@ export default {
         margin-top: $margin * 2;
         font-weight: bold;
     }
-    .des-title {
+        .des-title {
+            padding: $padding;
+            color: $text-gray-m;
+            font-size: $title-size-m - 4;
+
+        }
+    }
+   
+    
+
+    // 列表
+    .weight-list {
+        font-size: $title-size-m;
+        color: #cacaca;
+        padding: 0 $padding;
+
+        .list-item {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            box-sizing: border-box;
+            justify-content: space-between;
+            border-bottom: solid 1rpx #f9f9f9;
+            padding: 20rpx 0;
+            font-size: $title-size-m - 2;
+
+            .list-title {
+                color: #555;
+                font-size: $title-size-m - 2;
+
+                span {
+                    font-size: $title-size + 10;
+                    font-weight: 500;
+                    margin-right: 10rpx;
+                }
+            }
+
+            .list-right {
+                display: flex;
+                flex-direction: column;
+                align-items: flex-end;
+                justify-content: center;
+                box-sizing: border-box;
+                margin-top: $margin * 0.4;
+                color: #999;
+
+                span {
+                    margin-bottom: 10rpx;
+                }
+            }
+        }
+    }
+
+    .no-lists {
         padding: $padding;
         color: $text-gray-m;
-        font-size: $title-size-m - 4;
+        font-size: $title-size-m;
     }
-}
-// 列表
-.weight-list {
-    font-size: $title-size-m;
-    color: $text-gray-m;
-    padding: $padding;
 
-    .list-item {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
+    // 弹窗
+    .addWeightContent {
+        width: 100%;
+        height: 54vh;
+        padding: $padding * 4 0;
+        box-sizing: border-box;
+        color: $text-gray;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
         box-sizing: border-box;
-        justify-content: space-between;
-        border-bottom: solid 1rpx #f9f9f9;
-        padding: $padding 0;
-        .list-title {
-            color: $text-color;
-            font-size: $title-size-m;
-            margin-bottom: $margin * 0.4;
-            span {
-                font-size: $title-size + 14;
-                font-weight: 500;
-                margin-right: 10rpx;
-            }
-        }
-        .list-right {
-            display: flex;
-            flex-direction: column;
-            align-items: flex-end;
-            justify-content: center;
-            box-sizing: border-box;
-            margin-top: $margin * 0.4;
-            span {
-                margin-bottom: 10rpx;
-            }
-        }
-    }
-}
-.no-lists {
-    padding: $padding;
-    color: $text-gray-m;
-    font-size: $title-size-m;
-}
 
-// 弹窗
-.addWeightContent {
-    width: 100%;
-    height: 54vh;
-    padding: $padding * 4 0;
-    box-sizing: border-box;
-    color: $text-gray;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    .date {
-        font-size: $title-size + 9;
-        text-align: center;
-    }
-    .count {
-        color: $main-color;
-        text-align: center;
-        margin-top: $margin * 2;
-        margin-bottom: $margin * 0.1;
-        font-size: $title-size + 2;
-        span {
-            font-weight: bold;
-            font-size: $title-size * 2.2;
-            margin-right: $margin * 0.3;
+        .date {
+            font-size: $title-size + 9;
+            text-align: center;
+        }
+
+        .count {
+            color: $main-color;
+            text-align: center;
+            margin-top: $margin * 2;
+            margin-bottom: $margin * 0.1;
+            font-size: $title-size + 2;
+
+            span {
+                font-weight: bold;
+                font-size: $title-size * 2.2;
+                margin-right: $margin * 0.3;
+            }
+        }
+
+        .addBtn {
+            background-color: $main-color;
+            color: #fff;
+            margin-top: $margin * 2;
+            font-size: $title-size * 1.2;
+            padding: $padding * 0.7 $padding * 4;
+            border-radius: $radius * 3;
+            font-size: $title-size + 6;
+            box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
         }
     }
-    .addBtn {
-        background-color: $main-color;
-        color: #fff;
-        margin-top: $margin * 2;
-        font-size: $title-size * 1.2;
-        padding: $padding * 0.7 $padding * 4;
-        border-radius: $radius * 3;
-        font-size: $title-size + 6;
-        box-shadow: 0 0 10rpx 4rpx rgba($color: $main-color, $alpha: 0.1);
-    }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/static/imgs/curve-1.png b/static/imgs/curve-1.png
new file mode 100644
index 0000000..0f6413e
Binary files /dev/null and b/static/imgs/curve-1.png differ
diff --git a/static/imgs/curve-2.png b/static/imgs/curve-2.png
new file mode 100644
index 0000000..a768201
Binary files /dev/null and b/static/imgs/curve-2.png differ
diff --git a/static/imgs/speed-1.png b/static/imgs/speed-1.png
new file mode 100644
index 0000000..c4c31e5
Binary files /dev/null and b/static/imgs/speed-1.png differ
diff --git a/static/imgs/speed-2.png b/static/imgs/speed-2.png
new file mode 100644
index 0000000..56ac17d
Binary files /dev/null and b/static/imgs/speed-2.png differ
diff --git a/static/imgs/water-1.png b/static/imgs/water-1.png
new file mode 100644
index 0000000..d3d7ef9
Binary files /dev/null and b/static/imgs/water-1.png differ
diff --git a/static/imgs/water-2.png b/static/imgs/water-2.png
new file mode 100644
index 0000000..50cbdb4
Binary files /dev/null and b/static/imgs/water-2.png differ
diff --git a/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js b/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js
index d36ecbc..46039c6 100644
--- a/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js
+++ b/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js
@@ -21,630 +21,639 @@ const color = ['#91CB74', '#1890FF', '#FAC858', '#EE6666', '#73C0DE', '#3CA272',
 
 //事件转换函数，主要用作格式化x轴为时间轴，根据需求自行修改
 const formatDateTime = (timeStamp, returnType) => {
-	var date = new Date();
-	date.setTime(timeStamp * 1000);
-	var y = date.getFullYear();
-	var m = date.getMonth() + 1;
-	m = m < 10 ? ('0' + m) : m;
-	var d = date.getDate();
-	d = d < 10 ? ('0' + d) : d;
-	var h = date.getHours();
-	h = h < 10 ? ('0' + h) : h;
-	var minute = date.getMinutes();
-	var second = date.getSeconds();
-	minute = minute < 10 ? ('0' + minute) : minute;
-	second = second < 10 ? ('0' + second) : second;
-	if (returnType == 'full') { return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second; }
-	if (returnType == 'y-m-d') { return y + '-' + m + '-' + d; }
-	if (returnType == 'h:m') { return h + ':' + minute; }
-	if (returnType == 'h:m:s') { return h + ':' + minute + ':' + second; }
-	return [y, m, d, h, minute, second];
+    var date = new Date();
+    date.setTime(timeStamp * 1000);
+    var y = date.getFullYear();
+    var m = date.getMonth() + 1;
+    m = m < 10 ? ('0' + m) : m;
+    var d = date.getDate();
+    d = d < 10 ? ('0' + d) : d;
+    var h = date.getHours();
+    h = h < 10 ? ('0' + h) : h;
+    var minute = date.getMinutes();
+    var second = date.getSeconds();
+    minute = minute < 10 ? ('0' + minute) : minute;
+    second = second < 10 ? ('0' + second) : second;
+    if (returnType == 'full') {
+        return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
+    }
+    if (returnType == 'y-m-d') {
+        return y + '-' + m + '-' + d;
+    }
+    if (returnType == 'h:m') {
+        return h + ':' + minute;
+    }
+    if (returnType == 'h:m:s') {
+        return h + ':' + minute + ':' + second;
+    }
+    return [y, m, d, h, minute, second];
 }
 
 const cfu = {
-	//demotype为自定义图表类型，一般不需要自定义图表类型，只需要改根节点上对应的类型即可
-	"type": ["pie", "ring", "rose", "word", "funnel", "map", "arcbar", "line", "column", "bar", "area", "radar", "gauge", "candle", "mix", "tline", "tarea", "scatter", "bubble", "demotype"],
-	"range": ["饼状图", "圆环图", "玫瑰图", "词云图", "漏斗图", "地图", "圆弧进度条", "折线图", "柱状图", "条状图", "区域图", "雷达图", "仪表盘", "K线图", "混合图", "时间轴折线", "时间轴区域", "散点图", "气泡图", "自定义类型"],
-	//增加自定义图表类型，如果需要categories，请在这里加入您的图表类型，例如最后的"demotype"
-	//自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴（矢量x轴）类图表，没有categories，不需要加入categories
-	"categories": ["line", "column", "bar", "area", "radar", "gauge", "candle", "mix", "demotype"],
-	//instance为实例变量承载属性，不要删除
-	"instance": {},
-	//option为opts及eopts承载属性，不要删除
-	"option": {},
-	//下面是自定义format配置，因除H5端外的其他端无法通过props传递函数，只能通过此属性对应下标的方式来替换
-	"formatter": {
-		"yAxisDemo1": function (val) { return val + '元' },
-		"yAxisDemo2": function (val) { return val.toFixed(2) },
-		"xAxisDemo1": function (val) { return val + '年' },
-		"xAxisDemo2": function (val) { return formatDateTime(val, 'h:m') },
-		"seriesDemo1": function (val) { return val + '元' },
-		"tooltipDemo1": function (item, category, index, opts) {
-			if (index == 0) {
-				return '随便用' + item.data + '年'
-			} else {
-				return '其他我没改' + item.data + '天'
-			}
-		},
-		"pieDemo": function (val, index, series) {
-			if (index !== undefined) {
-				return series[index].name + '：' + series[index].data + '元'
-			}
-		},
-	},
-	//这里演示了自定义您的图表类型的option，可以随意命名，之后在组件上 type="demotype" 后，组件会调用这个花括号里的option，如果组件上还存在opts参数，会将demotype与opts中option合并后渲染图表。
-	"demotype": {
-		//我这里把曲线图当做了自定义图表类型，您可以根据需要随意指定类型或配置
-		"type": "line",
-		"color": color,
-		"padding": [15, 10, 0, 15],
-		"xAxis": {
-			"disableGrid": true,
-		},
-		"yAxis": {
-			"gridType": "dash",
-			"dashLength": 2,
-		},
-		"legend": {
-		},
-		"extra": {
-			"line": {
-				"type": "curve",
-				"width": 2
-			},
-		}
-	},
-	//下面是自定义配置，请添加项目所需的通用配置
-	"pie": {
-		"type": "pie",
-		"color": color,
-		"padding": [5, 5, 5, 5],
-		"extra": {
-			"pie": {
-				"activeOpacity": 0.5,
-				"activeRadius": 10,
-				"offsetAngle": 0,
-				"labelWidth": 15,
-				"border": true,
-				"borderWidth": 3,
-				"borderColor": "#FFFFFF"
-			},
-		}
-	},
-	"ring": {
-		"type": "ring",
-		"color": color,
-		"padding": [5, 5, 5, 5],
-		"rotate": false,
-		"dataLabel": true,
-		"legend": {
-			"show": true,
-			"position": "right",
-			"lineHeight": 25,
-		},
-		"title": {
-			"name": "收益率",
-			"fontSize": 15,
-			"color": "#666666"
-		},
-		"subtitle": {
-			"name": "70%",
-			"fontSize": 25,
-			"color": "#7cb5ec"
-		},
-		"extra": {
-			"ring": {
-				"ringWidth": 30,
-				"activeOpacity": 0.5,
-				"activeRadius": 10,
-				"offsetAngle": 0,
-				"labelWidth": 15,
-				"border": true,
-				"borderWidth": 3,
-				"borderColor": "#FFFFFF"
-			},
-		},
-	},
-	"rose": {
-		"type": "rose",
-		"color": color,
-		"padding": [5, 5, 5, 5],
-		"legend": {
-			"show": true,
-			"position": "left",
-			"lineHeight": 25,
-		},
-		"extra": {
-			"rose": {
-				"type": "area",
-				"minRadius": 50,
-				"activeOpacity": 0.5,
-				"activeRadius": 10,
-				"offsetAngle": 0,
-				"labelWidth": 15,
-				"border": false,
-				"borderWidth": 2,
-				"borderColor": "#FFFFFF"
-			},
-		}
-	},
-	"word": {
-		"type": "word",
-		"color": color,
-		"extra": {
-			"word": {
-				"type": "normal",
-				"autoColors": false
-			}
-		}
-	},
-	"funnel": {
-		"type": "funnel",
-		"color": color,
-		"padding": [15, 15, 0, 15],
-		"extra": {
-			"funnel": {
-				"activeOpacity": 0.3,
-				"activeWidth": 10,
-				"border": true,
-				"borderWidth": 2,
-				"borderColor": "#FFFFFF",
-				"fillOpacity": 1,
-				"labelAlign": "right"
-			},
-		}
-	},
-	"map": {
-		"type": "map",
-		"color": color,
-		"padding": [0, 0, 0, 0],
-		"dataLabel": true,
-		"extra": {
-			"map": {
-				"border": true,
-				"borderWidth": 1,
-				"borderColor": "#666666",
-				"fillOpacity": 0.6,
-				"activeBorderColor": "#F04864",
-				"activeFillColor": "#FACC14",
-				"activeFillOpacity": 1
-			},
-		}
-	},
-	"arcbar": {
-		"type": "arcbar",
-		"color": color,
-		"title": {
-			"name": "百分比",
-			"fontSize": 25,
-			"color": "#00FF00"
-		},
-		"subtitle": {
-			"name": "默认标题",
-			"fontSize": 15,
-			"color": "#666666"
-		},
-		"extra": {
-			"arcbar": {
-				"type": "default",
-				"width": 12,
-				"backgroundColor": "#E9E9E9",
-				"startAngle": 0.75,
-				"endAngle": 0.25,
-				"gap": 2
-			}
-		}
-	},
-	"line": {
-		"type": "line",
-		"color": color,
-		"padding": [15, 10, 0, 15],
-		"xAxis": {
-			"disableGrid": true,
-		},
-		"yAxis": {
-			"gridType": "dash",
-			"dashLength": 2,
-		},
-		"legend": {
-		},
-		"extra": {
-			"line": {
-				"type": "straight",
-				"width": 2
-			},
-		}
-	},
-	"tline": {
-		"type": "line",
-		"color": color,
-		"padding": [15, 10, 0, 15],
-		"xAxis": {
-			"disableGrid": false,
-			"boundaryGap": "justify",
-		},
-		"yAxis": {
-			"gridType": "dash",
-			"dashLength": 2,
-			"data": [
-				{
-					"min": 0,
-					"max": 80
-				}
-			]
-		},
-		"legend": {
-		},
-		"extra": {
-			"line": {
-				"type": "curve",
-				"width": 2
-			},
-		}
-	},
-	"tarea": {
-		"type": "area",
-		"color": color,
-		"padding": [15, 10, 0, 15],
-		"xAxis": {
-			"disableGrid": true,
-			"boundaryGap": "justify",
-		},
-		"yAxis": {
-			"gridType": "dash",
-			"dashLength": 2,
-			"data": [
-				{
-					"min": 0,
-					"max": 80
-				}
-			]
-		},
-		"legend": {
-		},
-		"extra": {
-			"area": {
-				"type": "curve",
-				"opacity": 0.2,
-				"addLine": true,
-				"width": 2,
-				"gradient": true
-			},
-		}
-	},
-	"column": {
-		"type": "column",
-		"color": color,
-		"padding": [15, 15, 0, 5],
-		"xAxis": {
-			"disableGrid": true,
-		},
-		"yAxis": {
-			"data": [{ "min": 0 }]
-		},
-		"legend": {
-		},
-		"extra": {
-			"column": {
-				"type": "group",
-				"width": 30,
-				"meterBorde": 1,
-				"meterFillColor": "#FFFFFF",
-				"activeBgColor": "#000000",
-				"activeBgOpacity": 0.08
-			},
-		}
-	},
-	"bar": {
-		"type": "bar",
-		"color": color,
-		"padding": [15, 30, 0, 5],
-		"xAxis": {
-			"boundaryGap": "justify",
-			"disableGrid": false,
-			"min": 0,
-			"axisLine": false
-		},
-		"yAxis": {
-		},
-		"legend": {
-		},
-		"extra": {
-			"bar": {
-				"type": "group",
-				"width": 30,
-				"meterBorde": 1,
-				"meterFillColor": "#FFFFFF",
-				"activeBgColor": "#000000",
-				"activeBgOpacity": 0.08
-			},
-		}
-	},
-	"area": {
-		"type": "area",
-		"color": color,
-		"padding": [15, 15, 0, 15],
-		"xAxis": {
-			"disableGrid": true,
-		},
-		"yAxis": {
-			"gridType": "dash",
-			"dashLength": 2,
-		},
-		"legend": {
-		},
-		"extra": {
-			"area": {
-				"type": "straight",
-				"opacity": 0.2,
-				"addLine": true,
-				"width": 2,
-				"gradient": false
-			},
-		}
-	},
-	"radar": {
-		"type": "radar",
-		"canvasId": "",
-		"canvas2d": false,
-		"background": "none",
-		"animation": true,
-		"timing": "easeOut",
-		"duration": 1000,
-		"color": [
-			"#91CB74",
-			"#1890FF",
-			"#FAC858",
-			"#EE6666",
-			"#73C0DE",
-			"#3CA272",
-			"#FC8452",
-			"#9A60B4",
-			"#ea7ccc"
-		],
-		"padding": [
-			5,
-			5,
-			5,
-			5
-		],
-		"rotate": false,
-		"errorReload": true,
-		"fontSize": 10,
-		"fontColor": "#666666",
-		"enableScroll": false,
-		"touchMoveLimit": 60,
-		"enableMarkLine": false,
-		"dataLabel": false,
-		"dataPointShape": true,
-		"dataPointShapeType": "solid",
-		"tapLegend": true,
-		"legend": {
-			"show": false,
-			"position": "bottom",
-			"float": "center",
-			"padding": 5,
-			"margin": 5,
-			"backgroundColor": "rgba(0,0,0,0)",
-			"borderColor": "rgba(0,0,0,0)",
-			"borderWidth": 0,
-			"fontSize": 13,
-			"fontColor": "#666666",
-			"lineHeight": 25,
-			"hiddenColor": "#CECECE",
-			"itemGap": 10
-		},
-		"extra": {
-			"radar": {
-				"gridType": "radar",
-				"gridColor": "#CCCCCC",
-				"gridCount": 3,
-				"labelColor": "#666666",
-				"opacity": 0.2,
-				"border": false,
-				"borderWidth": 2,
-				"max": 50
-			},
-			"tooltip": {
-				"showBox": true,
-				"showArrow": true,
-				"showCategory": false,
-				"borderWidth": 0,
-				"borderRadius": 0,
-				"borderColor": "#000000",
-				"borderOpacity": 0.7,
-				"bgColor": "#000000",
-				"bgOpacity": 0.7,
-				"gridType": "solid",
-				"dashLength": 4,
-				"gridColor": "#CCCCCC",
-				"fontColor": "#FFFFFF",
-				"splitLine": true,
-				"horizentalLine": false,
-				"xAxisLabel": false,
-				"yAxisLabel": false,
-				"labelBgColor": "#FFFFFF",
-				"labelBgOpacity": 0.7,
-				"labelFontColor": "#666666"
-			}
-		}
-	},
-	"gauge": {
-		"type": "gauge",
-		"color": color,
-		"title": {
-			"name": "66Km/H",
-			"fontSize": 25,
-			"color": "#2fc25b",
-			"offsetY": 50
-		},
-		"subtitle": {
-			"name": "实时速度",
-			"fontSize": 15,
-			"color": "#1890ff",
-			"offsetY": -50
-		},
-		"extra": {
-			"gauge": {
-				"type": "default",
-				"width": 30,
-				"labelColor": "#666666",
-				"startAngle": 0.75,
-				"endAngle": 0.25,
-				"startNumber": 0,
-				"endNumber": 100,
-				"labelFormat": "",
-				"splitLine": {
-					"fixRadius": 0,
-					"splitNumber": 10,
-					"width": 30,
-					"color": "#FFFFFF",
-					"childNumber": 5,
-					"childWidth": 12
-				},
-				"pointer": {
-					"width": 24,
-					"color": "auto"
-				}
-			}
-		}
-	},
-	"candle": {
-		"type": "candle",
-		"color": color,
-		"padding": [15, 15, 0, 15],
-		"enableScroll": true,
-		"enableMarkLine": true,
-		"dataLabel": false,
-		"xAxis": {
-			"labelCount": 4,
-			"itemCount": 40,
-			"disableGrid": true,
-			"gridColor": "#CCCCCC",
-			"gridType": "solid",
-			"dashLength": 4,
-			"scrollShow": true,
-			"scrollAlign": "left",
-			"scrollColor": "#A6A6A6",
-			"scrollBackgroundColor": "#EFEBEF"
-		},
-		"yAxis": {
-		},
-		"legend": {
-		},
-		"extra": {
-			"candle": {
-				"color": {
-					"upLine": "#f04864",
-					"upFill": "#f04864",
-					"downLine": "#2fc25b",
-					"downFill": "#2fc25b"
-				},
-				"average": {
-					"show": true,
-					"name": ["MA5", "MA10", "MA30"],
-					"day": [5, 10, 20],
-					"color": ["#1890ff", "#2fc25b", "#facc14"]
-				}
-			},
-			"markLine": {
-				"type": "dash",
-				"dashLength": 5,
-				"data": [
-					{
-						"value": 2150,
-						"lineColor": "#f04864",
-						"showLabel": true
-					},
-					{
-						"value": 2350,
-						"lineColor": "#f04864",
-						"showLabel": true
-					}
-				]
-			}
-		}
-	},
-	"mix": {
-		"type": "mix",
-		"color": color,
-		"padding": [15, 15, 0, 15],
-		"xAxis": {
-			"disableGrid": true,
-		},
-		"yAxis": {
-			"disabled": false,
-			"disableGrid": false,
-			"splitNumber": 5,
-			"gridType": "dash",
-			"dashLength": 4,
-			"gridColor": "#CCCCCC",
-			"padding": 10,
-			"showTitle": true,
-			"data": []
-		},
-		"legend": {
-		},
-		"extra": {
-			"mix": {
-				"column": {
-					"width": 20
-				}
-			},
-		}
-	},
-	"scatter": {
-		"type": "scatter",
-		"color": color,
-		"padding": [15, 15, 0, 15],
-		"dataLabel": false,
-		"xAxis": {
-			"disableGrid": false,
-			"gridType": "dash",
-			"splitNumber": 5,
-			"boundaryGap": "justify",
-			"min": 0
-		},
-		"yAxis": {
-			"disableGrid": false,
-			"gridType": "dash",
-		},
-		"legend": {
-		},
-		"extra": {
-			"scatter": {
-			},
-		}
-	},
-	"bubble": {
-		"type": "bubble",
-		"color": color,
-		"padding": [15, 15, 0, 15],
-		"xAxis": {
-			"disableGrid": false,
-			"gridType": "dash",
-			"splitNumber": 5,
-			"boundaryGap": "justify",
-			"min": 0,
-			"max": 250
-		},
-		"yAxis": {
-			"disableGrid": false,
-			"gridType": "dash",
-			"data": [{
-				"min": 0,
-				"max": 150
-			}]
-		},
-		"legend": {
-		},
-		"extra": {
-			"bubble": {
-				"border": 2,
-				"opacity": 0.5,
-			},
-		}
-	}
+    //demotype为自定义图表类型，一般不需要自定义图表类型，只需要改根节点上对应的类型即可
+    "type": ["pie", "ring", "rose", "word", "funnel", "map", "arcbar", "line", "column", "bar", "area", "radar",
+        "gauge", "candle", "mix", "tline", "tarea", "scatter", "bubble", "demotype"
+    ],
+    "range": ["饼状图", "圆环图", "玫瑰图", "词云图", "漏斗图", "地图", "圆弧进度条", "折线图", "柱状图", "条状图", "区域图", "雷达图", "仪表盘", "K线图",
+        "混合图", "时间轴折线", "时间轴区域", "散点图", "气泡图", "自定义类型"
+    ],
+    //增加自定义图表类型，如果需要categories，请在这里加入您的图表类型，例如最后的"demotype"
+    //自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴（矢量x轴）类图表，没有categories，不需要加入categories
+    "categories": ["line", "column", "bar", "area", "radar", "gauge", "candle", "mix", "demotype"],
+    //instance为实例变量承载属性，不要删除
+    "instance": {},
+    //option为opts及eopts承载属性，不要删除
+    "option": {},
+    //下面是自定义format配置，因除H5端外的其他端无法通过props传递函数，只能通过此属性对应下标的方式来替换
+    "formatter": {
+        "yAxisDemo1": function(val) {
+            return val + '元'
+        },
+        "yAxisDemo2": function(val) {
+            return val.toFixed(2)
+        },
+        "xAxisDemo1": function(val) {
+            return val + '年'
+        },
+        "xAxisDemo2": function(val) {
+            return formatDateTime(val, 'h:m')
+        },
+        "seriesDemo1": function(val) {
+            return val + '元'
+        },
+        "tooltipDemo1": function(item, category, index, opts) {
+            if (index == 0) {
+                return '随便用' + item.data + '年'
+            } else {
+                return '其他我没改' + item.data + '天'
+            }
+        },
+        "pieDemo": function(val, index, series) {
+            if (index !== undefined) {
+                return series[index].name + '：' + series[index].data + '元'
+            }
+        },
+    },
+    //这里演示了自定义您的图表类型的option，可以随意命名，之后在组件上 type="demotype" 后，组件会调用这个花括号里的option，如果组件上还存在opts参数，会将demotype与opts中option合并后渲染图表。
+    "demotype": {
+        //我这里把曲线图当做了自定义图表类型，您可以根据需要随意指定类型或配置
+        "type": "line",
+        "color": color,
+        "padding": [15, 10, 0, 15],
+        "xAxis": {
+            "disableGrid": true,
+        },
+        "yAxis": {
+            "gridType": "dash",
+            "dashLength": 2,
+        },
+        "legend": {},
+        "extra": {
+            "line": {
+                "type": "curve",
+                "width": 2
+            },
+        }
+    },
+    //下面是自定义配置，请添加项目所需的通用配置
+    "pie": {
+        "type": "pie",
+        "color": color,
+        "padding": [5, 5, 5, 5],
+        "extra": {
+            "pie": {
+                "activeOpacity": 0.5,
+                "activeRadius": 10,
+                "offsetAngle": 0,
+                "labelWidth": 15,
+                "border": true,
+                "borderWidth": 3,
+                "borderColor": "#FFFFFF"
+            },
+        }
+    },
+    "ring": {
+        "type": "ring",
+        "color": color,
+        "padding": [5, 5, 5, 5],
+        "rotate": false,
+        "dataLabel": true,
+        "legend": {
+            "show": true,
+            "position": "right",
+            "lineHeight": 25,
+        },
+        "title": {
+            "name": "收益率",
+            "fontSize": 15,
+            "color": "#666666"
+        },
+        "subtitle": {
+            "name": "70%",
+            "fontSize": 25,
+            "color": "#7cb5ec"
+        },
+        "extra": {
+            "ring": {
+                "ringWidth": 30,
+                "activeOpacity": 0.5,
+                "activeRadius": 10,
+                "offsetAngle": 0,
+                "labelWidth": 15,
+                "border": true,
+                "borderWidth": 3,
+                "borderColor": "#FFFFFF"
+            },
+        },
+    },
+    "rose": {
+        "type": "rose",
+        "color": color,
+        "padding": [5, 5, 5, 5],
+        "legend": {
+            "show": true,
+            "position": "left",
+            "lineHeight": 25,
+        },
+        "extra": {
+            "rose": {
+                "type": "area",
+                "minRadius": 50,
+                "activeOpacity": 0.5,
+                "activeRadius": 10,
+                "offsetAngle": 0,
+                "labelWidth": 15,
+                "border": false,
+                "borderWidth": 2,
+                "borderColor": "#FFFFFF"
+            },
+        }
+    },
+    "word": {
+        "type": "word",
+        "color": color,
+        "extra": {
+            "word": {
+                "type": "normal",
+                "autoColors": false
+            }
+        }
+    },
+    "funnel": {
+        "type": "funnel",
+        "color": color,
+        "padding": [15, 15, 0, 15],
+        "extra": {
+            "funnel": {
+                "activeOpacity": 0.3,
+                "activeWidth": 10,
+                "border": true,
+                "borderWidth": 2,
+                "borderColor": "#FFFFFF",
+                "fillOpacity": 1,
+                "labelAlign": "right"
+            },
+        }
+    },
+    "map": {
+        "type": "map",
+        "color": color,
+        "padding": [0, 0, 0, 0],
+        "dataLabel": true,
+        "extra": {
+            "map": {
+                "border": true,
+                "borderWidth": 1,
+                "borderColor": "#666666",
+                "fillOpacity": 0.6,
+                "activeBorderColor": "#F04864",
+                "activeFillColor": "#FACC14",
+                "activeFillOpacity": 1
+            },
+        }
+    },
+    "arcbar": {
+        "type": "arcbar",
+        "color": color,
+        "title": {
+            "name": "百分比",
+            "fontSize": 25,
+            "color": "#00FF00"
+        },
+        "subtitle": {
+            "name": "默认标题",
+            "fontSize": 15,
+            "color": "#666666"
+        },
+        "extra": {
+            "arcbar": {
+                "type": "default",
+                "width": 12,
+                "backgroundColor": "#E9E9E9",
+                "startAngle": 0.75,
+                "endAngle": 0.25,
+                "gap": 2
+            }
+        }
+    },
+    "line": {
+        "type": "line",
+        "color": color,
+        "padding": [15, 10, 0, 15],
+        "xAxis": {
+            "disableGrid": true,
+        },
+        "yAxis": {
+            "gridType": "dash",
+            "dashLength": 2,
+        },
+        "legend": {},
+        "extra": {
+            "line": {
+                "type": "straight",
+                "width": 2
+            },
+        }
+    },
+    "tline": {
+        "type": "line",
+        "color": color,
+        "padding": [15, 10, 0, 15],
+        "xAxis": {
+            "disableGrid": false,
+            "boundaryGap": "justify",
+        },
+        "yAxis": {
+            "gridType": "dash",
+            "dashLength": 2,
+            "data": [{
+                "min": 0,
+                "max": 80
+            }]
+        },
+        "legend": {},
+        "extra": {
+            "line": {
+                "type": "curve",
+                "width": 2
+            },
+        }
+    },
+    "tarea": {
+        "type": "area",
+        "color": color,
+        "padding": [15, 10, 0, 15],
+        "xAxis": {
+            "disableGrid": true,
+            "boundaryGap": "justify",
+        },
+        "yAxis": {
+            "gridType": "dash",
+            "dashLength": 2,
+            "data": [{
+                "min": 0,
+                "max": 80
+            }]
+        },
+        "legend": {},
+        "extra": {
+            "area": {
+                "type": "curve",
+                "opacity": 0.2,
+                "addLine": true,
+                "width": 2,
+                "gradient": true
+            },
+        }
+    },
+    "column": {
+        "type": "column",
+        "color": color,
+        "padding": [15, 15, 0, 5],
+        "xAxis": {
+            "disableGrid": true,
+        },
+        "yAxis": {
+            "data": [{
+                "min": 0
+            }]
+        },
+        "legend": {},
+        "extra": {
+            "column": {
+                "type": "group",
+                "width": 30,
+                "meterBorde": 1,
+                "meterFillColor": "#FFFFFF",
+                "activeBgColor": "#000000",
+                "activeBgOpacity": 0.08
+            },
+        }
+    },
+    "bar": {
+        "type": "bar",
+        "color": color,
+        "padding": [15, 30, 0, 5],
+        "xAxis": {
+            "boundaryGap": "justify",
+            "disableGrid": false,
+            "min": 0,
+            "axisLine": false
+        },
+        "yAxis": {},
+        "legend": {},
+        "extra": {
+            "bar": {
+                "type": "group",
+                "width": 30,
+                "meterBorde": 1,
+                "meterFillColor": "#FFFFFF",
+                "activeBgColor": "#000000",
+                "activeBgOpacity": 0.08
+            },
+        }
+    },
+    "area": {
+        "type": "area",
+        "color": [
+            "#34ce98",
+        ],
+        "padding": [15, 15, 0, 15],
+        "xAxis": {
+            "disableGrid": true,
+        },
+        "yAxis": {
+            "gridType": "dash",
+            "dashLength": 2,
+        },
+        "fontColor": "#999",
+        "fontSize":"12",
+        "legend": {},
+        "extra": {
+            "area": {
+                "type": "straight",
+                "opacity": 0.2,
+                "addLine": true,
+                "width": 2,
+                "gradient": false
+            },
+        }
+    },
+    "radar": {
+        "type": "radar",
+        "canvasId": "",
+        "canvas2d": false,
+        "background": "none",
+        "animation": true,
+        "timing": "easeOut",
+        "duration": 1000,
+        "color": [
+            "#91CB74",
+            "#1890FF",
+            "#FAC858",
+            "#EE6666",
+            "#73C0DE",
+            "#3CA272",
+            "#FC8452",
+            "#9A60B4",
+            "#ea7ccc"
+        ],
+        "padding": [
+            5,
+            5,
+            5,
+            5
+        ],
+        "rotate": false,
+        "errorReload": true,
+        "fontSize": 10,
+        "fontColor": "#666666",
+        "enableScroll": false,
+        "touchMoveLimit": 60,
+        "enableMarkLine": false,
+        "dataLabel": false,
+        "dataPointShape": true,
+        "dataPointShapeType": "solid",
+        "tapLegend": true,
+        "legend": {
+            "show": false,
+            "position": "bottom",
+            "float": "center",
+            "padding": 5,
+            "margin": 5,
+            "backgroundColor": "rgba(0,0,0,0)",
+            "borderColor": "rgba(0,0,0,0)",
+            "borderWidth": 0,
+            "fontSize": 13,
+            "fontColor": "#666666",
+            "lineHeight": 25,
+            "hiddenColor": "#CECECE",
+            "itemGap": 10
+        },
+        "extra": {
+            "radar": {
+                "gridType": "radar",
+                "gridColor": "#CCCCCC",
+                "gridCount": 3,
+                "labelColor": "#666666",
+                "opacity": 0.2,
+                "border": false,
+                "borderWidth": 2,
+                "max": 50
+            },
+            "tooltip": {
+                "showBox": true,
+                "showArrow": true,
+                "showCategory": false,
+                "borderWidth": 0,
+                "borderRadius": 0,
+                "borderColor": "#000000",
+                "borderOpacity": 0.7,
+                "bgColor": "#000000",
+                "bgOpacity": 0.7,
+                "gridType": "solid",
+                "dashLength": 4,
+                "gridColor": "#CCCCCC",
+                "fontColor": "#FFFFFF",
+                "splitLine": true,
+                "horizentalLine": false,
+                "xAxisLabel": false,
+                "yAxisLabel": false,
+                "labelBgColor": "#FFFFFF",
+                "labelBgOpacity": 0.7,
+                "labelFontColor": "#666666"
+            }
+        }
+    },
+    "gauge": {
+        "type": "gauge",
+        "color": color,
+        "title": {
+            "name": "66Km/H",
+            "fontSize": 25,
+            "color": "#2fc25b",
+            "offsetY": 50
+        },
+        "subtitle": {
+            "name": "实时速度",
+            "fontSize": 15,
+            "color": "#1890ff",
+            "offsetY": -50
+        },
+        "extra": {
+            "gauge": {
+                "type": "default",
+                "width": 30,
+                "labelColor": "#666666",
+                "startAngle": 0.75,
+                "endAngle": 0.25,
+                "startNumber": 0,
+                "endNumber": 100,
+                "labelFormat": "",
+                "splitLine": {
+                    "fixRadius": 0,
+                    "splitNumber": 10,
+                    "width": 30,
+                    "color": "#FFFFFF",
+                    "childNumber": 5,
+                    "childWidth": 12
+                },
+                "pointer": {
+                    "width": 24,
+                    "color": "auto"
+                }
+            }
+        }
+    },
+    "candle": {
+        "type": "candle",
+        "color": color,
+        "padding": [15, 15, 0, 15],
+        "enableScroll": true,
+        "enableMarkLine": true,
+        "dataLabel": false,
+        "xAxis": {
+            "labelCount": 4,
+            "itemCount": 40,
+            "disableGrid": true,
+            "gridColor": "#CCCCCC",
+            "gridType": "solid",
+            "dashLength": 4,
+            "scrollShow": true,
+            "scrollAlign": "left",
+            "scrollColor": "#A6A6A6",
+            "scrollBackgroundColor": "#EFEBEF"
+        },
+        "yAxis": {},
+        "legend": {},
+        "extra": {
+            "candle": {
+                "color": {
+                    "upLine": "#f04864",
+                    "upFill": "#f04864",
+                    "downLine": "#2fc25b",
+                    "downFill": "#2fc25b"
+                },
+                "average": {
+                    "show": true,
+                    "name": ["MA5", "MA10", "MA30"],
+                    "day": [5, 10, 20],
+                    "color": ["#1890ff", "#2fc25b", "#facc14"]
+                }
+            },
+            "markLine": {
+                "type": "dash",
+                "dashLength": 5,
+                "data": [{
+                        "value": 2150,
+                        "lineColor": "#f04864",
+                        "showLabel": true
+                    },
+                    {
+                        "value": 2350,
+                        "lineColor": "#f04864",
+                        "showLabel": true
+                    }
+                ]
+            }
+        }
+    },
+    "mix": {
+        "type": "mix",
+        "color": color,
+        "padding": [15, 15, 0, 15],
+        "xAxis": {
+            "disableGrid": true,
+        },
+        "yAxis": {
+            "disabled": false,
+            "disableGrid": false,
+            "splitNumber": 5,
+            "gridType": "dash",
+            "dashLength": 4,
+            "gridColor": "#CCCCCC",
+            "padding": 10,
+            "showTitle": true,
+            "data": []
+        },
+        "legend": {},
+        "extra": {
+            "mix": {
+                "column": {
+                    "width": 20
+                }
+            },
+        }
+    },
+    "scatter": {
+        "type": "scatter",
+        "color": color,
+        "padding": [15, 15, 0, 15],
+        "dataLabel": false,
+        "xAxis": {
+            "disableGrid": false,
+            "gridType": "dash",
+            "splitNumber": 5,
+            "boundaryGap": "justify",
+            "min": 0
+        },
+        "yAxis": {
+            "disableGrid": false,
+            "gridType": "dash",
+        },
+        "legend": {},
+        "extra": {
+            "scatter": {},
+        }
+    },
+    "bubble": {
+        "type": "bubble",
+        "color": color,
+        "padding": [15, 15, 0, 15],
+        "xAxis": {
+            "disableGrid": false,
+            "gridType": "dash",
+            "splitNumber": 5,
+            "boundaryGap": "justify",
+            "min": 0,
+            "max": 250
+        },
+        "yAxis": {
+            "disableGrid": false,
+            "gridType": "dash",
+            "data": [{
+                "min": 0,
+                "max": 150
+            }]
+        },
+        "legend": {},
+        "extra": {
+            "bubble": {
+                "border": 2,
+                "opacity": 0.5,
+            },
+        }
+    }
 }
 
-export default cfu;
\ No newline at end of file
+export default cfu;