修改选择书籍部分

# Conflicts:
#	pages.json
#	pages/homepages/user/bmi_information/bmi_information.vue

.idea/watcherTasks.xml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectTasksOptions">
+    <TaskOptions isEnabled="false">
+      <option name="arguments" value="$FileName$:$FileNameWithoutExtension$.css" />
+      <option name="checkSyntaxErrors" value="true" />
+      <option name="description" />
+      <option name="exitCodeBehavior" value="ERROR" />
+      <option name="fileExtension" value="scss" />
+      <option name="immediateSync" value="true" />
+      <option name="name" value="SCSS" />
+      <option name="output" value="$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map" />
+      <option name="outputFilters">
+        <array />
+      </option>
+      <option name="outputFromStdout" value="false" />
+      <option name="program" value="sass" />
+      <option name="runOnExternalChanges" value="true" />
+      <option name="scopeName" value="Project Files" />
+      <option name="trackOnlyRoot" value="true" />
+      <option name="workingDir" value="$FileDir$" />
+      <envs />
+    </TaskOptions>
+  </component>
+</project>

App.vue

@@ -1,22 +1,76 @@
-<script>
-	export default {
-		onLaunch: function() {
-			console.log('App Launch')
-		},
-		onShow: function() {
-			console.log('App Show')
-		},
-		onHide: function() {
-			console.log('App Hide')
-		}
-	}
-</script>
+// App.vue
+<template>
+  <view class="app-container">
+  </view>
 
-<style>
+</template>
 
+<script>
+import puppy_chat from "@/components/swiper/puppy_chat.vue";
+import exercise from "@/components/swiper/exercise.vue";
+import community from "@/components/swiper/community.vue";
+import read_center from "@/components/swiper/read_center.vue";
+import read from './components/tarbar/tarbar.vue';
+import my_exercise_plan from "@/components/my_exercise_plan/my_exercise_plan.vue";
+import my_recipe_plan from "@/components/my_recipe_plan/my_recipe_plan.vue";
+import tarbar from './components/tarbar/tarbar.vue';
+import tarbar_home from "@/components/tarbar_home/tarbar_home.vue";
+import tarbar_user from "@/components/tarbar_user/tarbar_user.vue";
+import tarbar_community from "@/components/tarbar_community/tarbar_community.vue";
+import tarbar_puppy_chat from "@/components/tarbar_puppy_chat/tarbar_puppy_chat.vue";
+import my_pop_up from './components/my_pop_up/my_pop_up.vue';
+import ai_recongize_fruit from './components/ai_recongize_fruit/ai_recongize_fruit.vue';
+import ai_recongize_plan from './components/ai_recongize_plan/ai_recongize_plan.vue';
+import ai_recongize_hot from './components/ai_recongize_hot/ai_recongize_hot.vue';
+import ai_recongize_recipe from './components/ai_recongize_recipe/ai_recongize_recipe.vue';
 
+export default {
+  globalData: {
+    // 定义后端数据库地址信息
+    fit_journey_basic_address: 'http://127.0.0.1:8086',//TODO:已完成
+    fit_journey_community_address: 'http://127.0.0.1:8082',//TODO:已完成
+    fit_journey_ai_address: 'http://47.122.61.54:8081',//TODO：配置完成
+    fit_journey_login_address: 'http://127.0.0.1:8084',//TODO:配置完成
+    fit_journey_recipe_address: 'http://47.122.61.54:8087',//TODO:配置完成
+    fit_journey_exercise_address: 'http://47.122.61.54:8080',//TODO:配置完成
+    fit_journey_admin_address: 'http://47.122.61.54:8085',//TODO:已完成
+    message_count: 0,
+    // TODO: 后期需要把 token 更换成从 localStorage 中获取
+    token: 'eyJhbGciOiJIUzI1NiJ9.eyJzdW' +
+        'IiOiIxODU5MDU4ODM2NDQ3NDk4MjQyIiwiaXNz' +
+        'IjoiZml0am91cm5leSIsInVzZXJuYW1lOiI6InV' +
+        'zZXIiLCJyb2xlczoiOiJVU0VSX1JPTEUiLCJpZDoiOj' +
+        'E4NTkwNTg4MzY0NDc0OTgyNDIsImlhdCI6MTczMjA4NjA4Ny' +
+        'wiZXhwIjozMTcwOTIwODYwODd9.rxLV3cUtwUKwsdpNq2yf2O' +
+        '5Fte2hX4OqvcwN9mo6y9w'
+  },
 
+  components: {
+    tarbar,
+    my_pop_up // JS 变量名中不能有‘-’
+  },
 
+  onLaunch: function() {
+    console.log('App Launch');
+    // 你可以在这里执行初始化逻辑，比如检查用户状态
+  },
+  onShow: function() {
+    console.log('App Show');
+    // 更新应用状态，比如获取最新数据
+  },
+  onHide: function() {
+    console.log('App Hide');
+    // 清理工作，比如保存数据
+  }
+};
+</script>
 
+<style>
+/* 你的样式 */
+.app-container {
+  position: relative;  /* 确保容器能够正确定位子元素 */
+  height: 100vh;      /* 确保应用占满整个视口 */
+}
 
+/* 其他全局样式 */
 </style>

components/ai_recongize_fruit/ai_recongize_fruit.vue

@@ -0,0 +1,63 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="/static/components/ai_recongize_fruit/pictures/background.png" class="background_image"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="/static/components/ai_recongize_fruit/pictures/text_and_button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "ai_recongize_fruit",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods:{
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/ai_recognize_fruit/ai_recognize_fruit'
+      })
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    },
+
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container{
+  position: absolute;
+  width: 100%;
+  height: 28%;
+
+}
+.background_image{
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+.button{
+  position: absolute;
+  width: 40%;
+  height: 20%;
+  left: 50%;
+  top: 62%;
+
+}
+</style>

components/ai_recongize_hot/ai_recongize_hot.vue

@@ -0,0 +1,62 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="/static/components/ai_recongize_hot/pictures/background.png" class="background_image"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="/static/components/ai_recongize_hot/pictures/text_and_button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "ai_recongize_fruit",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods:{
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/ai_recognize_hot/ai_recognize_hot'
+      })
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container{
+  position: absolute;
+  width: 100%;
+  height: 28%;
+
+}
+.background_image{
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+.button{
+  position: absolute;
+  width: 40%;
+  height: 20%;
+  left: 50%;
+  top: 62%;
+
+}
+</style>

components/ai_recongize_plan/ai_recongize_plan.vue

@@ -0,0 +1,59 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="/static/components/ai_recongize_plan/pictures/background.png" class="background_image"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="/static/components/ai_recongize_plan/pictures/text_and_button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "ai_recongize_plan",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods:{
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/ai_recognize_plan/ai_recognize_plan'
+      })
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container{
+  position: absolute;
+  width: 100%;
+  height: 28%;
+}
+.background_image{
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+.button{
+  position: absolute;
+  width: 40%;
+  height: 20%;
+  left: 50%;
+  top: 62%;
+}
+</style>

components/ai_recongize_recipe/ai_recongize_recipe.vue

@@ -0,0 +1,62 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="/static/components/ai_recongize_recipe/pictures/background.png" class="background_image"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="/static/components/ai_recongize_recipe/pictures/text_and_button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "ai_recongize_recipe",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods:{
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/ai_recognize_recipe/ai_recognize_recipe'
+      })
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container{
+  position: absolute;
+  width: 100%;
+  height: 28%;
+
+}
+.background_image{
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+.button{
+  position: absolute;
+  width: 40%;
+  height: 20%;
+  left: 50%;
+  top: 62%;
+
+}
+</style>

components/community_image_box/community_image_box.vue

@@ -0,0 +1,141 @@
+<template>
+    <view class="myimgDV">
+        <view v-if="imgPicList.length>0" class='receiveimage flex justify'>
+            <block v-for="(item,ind) in imgPicList" :key="ind">
+                <image class="imgitem" :style="{width:imgwidth,height:imgheight}" :class="imgboxtype==0?'onepic':imgboxtype==1?'doublepic':imgboxtype==2?'triplepic':''"
+                 :src="item" :mode="imgboxtype==0?'widthFix':imgboxtype==1?'aspectFill':imgboxtype==2?'aspectFill':''" @click="previewpic(item,imgPicList)"></image>
+                <!-- {width:(imgboxtype==0?'':imgwidth),height:(imgboxtype==0?'':imgwidth),padding:(imgboxtype==0?'':imgpad)} -->
+            </block>
+        </view>
+    </view>
+</template>
+
+<script>
+    export default {
+		name:"community_image_box",
+        data() {
+            return {
+                imgPicList: [],
+                imgboxtype: 0,
+                imgwidth: 0,
+                imgpad: 0,
+                imgheight: ''
+            }
+        },
+        props: {
+            imgList: {
+                type: Array
+            },
+            num: {
+                type: Number,
+                default: 0
+            },
+            pad: {
+                type: Number,
+                default: 0
+            }
+        },
+        methods: {
+            // 图片预览
+            previewpic(cind, clist) {
+                console.log(cind, clist);
+                uni.previewImage({
+                    urls: clist,
+                    current: cind,
+                    indicator: 'default'
+                });
+            },
+            getheight() {
+				console.log('imgboxtype:',this.imgboxtype)
+                let that = this;
+                const query = uni.createSelectorQuery().in(that)
+                query.select('.imgitem').boundingClientRect()
+                query.exec((res)=>{
+                    console.log(res[0].width)
+                    if (that.num == 1) {
+                        that.imgheight = '100%';
+                    } else if (that.num == 2 || that.num == 4) {
+                        that.imgheight = (res[0].width).toFixed(2) + 'px';
+                    } else {
+                        that.imgheight = (res[0].width).toFixed(2) + 'px';
+                    }
+                })
+
+                // const query = uni.createSelectorQuery().in(this).select('.imgitem');
+                // uni.createSelectorQuery().select('.imgitem').boundingClientRect(res => {
+                //     console.log('reac', res)
+                //     if (this.num == 1) {
+                //         this.imgheight = '100%';
+                //     } else if (this.num == 2 || this.num == 4) {
+                //         this.imgheight = (res.width).toFixed(2) + 'px';
+                //     } else {
+                //         this.imgheight = (res.width).toFixed(2) + 'px';
+                //     }
+                // }).exec()
+				
+            }
+        },
+        mounted() {
+            // let this = this;
+            this.imgPicList = this.imgList;
+			console.log('num:'+this.num)
+            if (this.num == 1) {
+                this.imgboxtype = 0;
+                this.imgwidth = 100 + '%';
+            } else if (this.num == 2 || this.num == 4) {
+                this.imgboxtype = 1;
+                this.imgwidth = 49 + '%';
+            } else if (this.num == 3 || this.num > 4) {
+                this.imgboxtype = 2;
+                this.imgwidth = 32 + '%';
+            }
+            this.$nextTick(function() {
+                this.getheight();
+            })
+        }
+    }
+</script>
+
+<style lang="scss">
+    .myimgDV {
+        .flex {
+            display: flex;
+        }
+        .justify {
+            justify-content: space-between;
+        }
+        .receiveimage {
+            margin-top: 28rpx;
+            display: flex;
+            flex-wrap: wrap;
+            width: 100%;
+            .onepic {
+                width: 100%;
+                // height: 188rpx;
+                // height: auto;
+                margin-bottom: 28rpx;
+                &:nth-child(3n) {
+                    margin-right: 0;
+                }
+            }
+            .doublepic {
+                // width: 340rpx;
+                // height: 340rpx;
+                margin-right: 12rpx;
+                margin-bottom: 12rpx;
+                &:nth-child(2n) {
+                    margin-right: 0;
+                }
+            }
+            .triplepic {
+                // width: 222rpx;
+                // height: 222rpx;
+                margin-right: 12rpx;
+                margin-bottom: 12rpx;
+                &:nth-child(3n) {
+                    margin-right: 0;
+                }
+            }
+        }
+    }
+</style>

components/dictionary/dictionary.vue

@@ -0,0 +1,60 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="@/static/components/dictionary/pictures/background.png" class="background"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="@/static/components/dictionary/pictures/button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "dictionary",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods: {
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/knowledge_dictionary/knowledge_dictionary'
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container {
+  position: absolute;
+  width: 50%;
+  height: 30%;
+
+}
+
+.background_image {
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+
+.button {
+  position: absolute;
+  width: 40%;
+  height: 18%;
+  left: 90%;
+  top: 80%;
+
+}
+</style>

components/my_exercise_plan/my_exercise_plan.vue

@@ -0,0 +1,65 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="@/static/components/my_exercise_plan/pictures/background.png" class="background_image"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="@/static/components/my_exercise_plan/pictures/text_and_button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "my_exercise_plan",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods: {
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/my_exercise_plan/my_exercise_plan'
+      }) ;
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    }
+
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container {
+  position: absolute;
+  width: 100%;
+  height: 28%;
+
+}
+
+.background_image {
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+
+.button {
+  position: absolute;
+  width: 40%;
+  height: 18%;
+  left: 50%;
+  top: 62%;
+
+}
+</style>

components/my_pop_up/my_pop_up.vue

@@ -0,0 +1,147 @@
+<template>
+	<view class="pop_up_componnet" v-if="isOpened">
+		<!-- 遮罩层 -->
+		<view class="background_blur"></view>
+		<!-- 弹窗 -->
+		<view class="pop_up_box" >
+			<!-- 背景飞机 -->
+			<image class="plane_image" src="../../static/components/my_pop_up/plane.png"></image>
+			<!-- 关闭图标 -->
+			<image class="close_image" @click="onClose" src="../../static/components/my_pop_up/close_icon.png"></image>
+			<!-- 标题 -->
+			<view class="title">{{title}}</view>
+			<!-- 内容 -->
+			<view class="content">{{content}}</view>
+			<!-- 横线 -->
+			<image class="line" src="../../static/components/my_pop_up/line.png"></image>
+			<!-- 按钮 -->
+			<button class="button" @click="onButtonClick">确认</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { ref } from 'vue'
+	export default{
+		name:'my_pop_up',
+		props:{
+			title:{
+				default:'提示',
+			},
+			content:{
+				default:'',
+			},
+			isOpened:{
+				default:true,
+			}
+		},
+		data(){
+			return{
+				
+			}
+		},
+		methods:{
+			onButtonClick(){
+				this.$emit('onClick','onButtonclick');
+			},
+			onClose(){
+				this.$emit('onClose');
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.pop_up_componnet{
+		height: 100vh;
+		width: 100vw;
+		position: relative;
+		.background_blur{
+			height: 100%;
+			width: 100%;
+			float: left;
+			background-repeat: no-repeat;
+			background: #ffffff;
+			background-position: center;
+			background-size: cover;
+			opacity: 70%;
+		}
+		.pop_up_box{
+			background-color: #EAF5FF;
+			height: 13vh;
+			width: 50vw;
+			border-radius: 12px;
+			position: absolute;
+			top: 50%;
+			left: 50%;
+			transform: translateX(-50%) translateY(-50%);
+			.plane_image{
+				position: absolute;
+				left: 0%;
+				top: 0%;
+				width: 15.3vw;
+				height: 5vh;
+			}
+			.close_image{
+				position: absolute;
+				right: 10%;
+				top: 10%;
+				width: 0.7rem;
+				height: 0.7rem;
+			}
+			.title{
+				/* 错误 */
+				position: absolute;
+				left: 50%;
+				top: 10.74%;
+				transform: translateX(-50%);
+				font-family: 'PingFang SC';
+				font-style: normal;
+				font-weight: 400;
+				font-size: 1rem;
+				display: flex;
+				align-items: center;
+				color: #000364;
+			}
+			.content{
+				position: absolute;
+				left: 50%;
+				top: 41.32%;
+				transform: translateX(-50%);
+				font-family: 'PingFang SC';
+				font-style: normal;
+				font-weight: 400;
+				font-size: 0.8rem;
+				display: flex;
+				align-items: center;
+				color: #5FA0D1;
+			}
+			.line{
+				position: absolute;
+				left: 4.93%;
+				top: 63.64%;
+				height: 0.1rem;
+				width: 90.14%;
+				opacity: 0.35;
+			}
+			.button{
+				position: absolute;
+				left: 50%;
+				top: 71.07%;
+				transform: translateX(-50%);
+				background: #7BC0FE;
+				border-radius: 8px;
+				color: #ffffff;
+				height: 3vh;
+				width: 37vw;
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				font-size: 1rem;
+			}
+			.button:active{
+				color: #4A69F7;
+			}
+		}
+	}
+</style>

components/my_recipe_plan/my_recipe_plan.vue

@@ -0,0 +1,64 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="/static/components/my_recipe_plan/pictures/background.png" class="background_image"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="/static/components/my_recipe_plan/pictures/text_and_button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "my_recipe_plan",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods: {
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/my_recipe_plan/my_recipe_plan'
+      })
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container {
+  position: absolute;
+  width: 100%;
+  height: 28%;
+
+}
+
+.background_image {
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+
+.button {
+  position: absolute;
+  width: 40%;
+  height: 18%;
+  left: 50%;
+  top: 62%;
+
+}
+</style>

components/read/read.vue

@@ -0,0 +1,63 @@
+<template>
+  <view :class="['container', extend_class]">
+
+    <!--背景图   -->
+    <image src="@/static/components/read/pictures/background.png" class="background"></image>
+
+    <!--按钮和文字   -->
+    <image class="button" src="@/static/components/read/pictures/button.png" @click="go_to_page"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "read",
+  data() {
+    return {};
+  },
+  props: {
+    extend_class: { // 接收外部传入的 class
+      type: String,
+      default: ''
+    }
+  },
+  methods: {
+    go_to_page() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/choice_book/choice_book'
+      })
+      uni.showToast({
+        title: '跳转成功',
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.container {
+  position: absolute;
+  width: 100%;
+  height: 28%;
+
+}
+
+.background_image {
+
+  position: absolute;
+  width: 100%;
+  height: 100%;
+}
+
+.button {
+  position: absolute;
+  width: 40%;
+  height: 18%;
+  left: 50%;
+  top: 62%;
+
+}
+</style>

components/swiper/community.vue

@@ -0,0 +1,43 @@
+<template>
+  <view :class="['container', extend_class]">
+    <image class="background" src="@/static/components/swiper/community/background.png"></image>
+    <image class="button" @click="go_to_community" src="@/static/components/swiper/community/button.png"></image>
+  </view>
+</template>
+
+<script>
+
+export default {
+  name: "community",
+  data() {
+    return {
+      extend_class : ''
+    };
+  },
+  methods: {
+    go_to_community() {
+      uni.navigateTo({
+        url: '/pages/homepages/community/community/community'
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+  position: absolute;
+  width: 100%;
+
+}
+.button{
+  position: absolute;
+  height: 20%;
+  width: 36%;
+  left: 7%;
+  top: 67%;
+
+
+}
+
+</style>

components/swiper/exercise.vue

@@ -0,0 +1,47 @@
+<template>
+  <view :class="['container', extend_class]">
+    <image class="background" src="@/static/components/swiper/exercise/background.png"></image>
+    <image class="button" @click="go_to_my_exercise_plan" src="@/static/components/swiper/exercise/button.png"></image>
+  </view>
+</template>
+
+<script>
+
+export default {
+  name: "exercise",
+  data() {
+    return {
+      extend_class : ''
+    };
+  },
+  methods:{
+    go_to_my_exercise_plan() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/my_exercise_plan/my_exercise_plan'
+      })
+      uni.showToast({
+        title: '跳转',
+        icon: 'success',
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+  position: absolute;
+  width: 100%;
+
+}
+.button{
+  position: absolute;
+  height: 18%;
+  width: 34%;
+  left: 7%;
+  top: 74%;
+
+
+}
+
+</style>

components/swiper/puppy_chat.vue

@@ -0,0 +1,48 @@
+<template>
+  <view :class="['container', extend_class]">
+    <image class="background" src="@/static/components/swiper/puppy_chat/background.png"></image>
+    <image class="button" @click="go_go_puppy_chat"  src="@/static/components/swiper/puppy_chat/button.png"></image>
+  </view>
+</template>
+
+<script>
+
+export default {
+  name: "puppy_chat",
+  data() {
+    return {
+      extend_class : ''
+    };
+
+  },
+  methods:{
+     go_go_puppy_chat(){
+        uni.navigateTo({
+             url: '/pages/homepages/puppy_chat/puppy_chat'
+        })
+       uni.showToast({
+         title: '跳转成功',
+         icon: 'success',
+       })
+     }
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+  position: absolute;
+  width: 100%;
+
+}
+.button{
+  position: absolute;
+  height: 20%;
+  width: 36%;
+  left: 7%;
+  top: 67%;
+
+
+}
+
+</style>

components/swiper/read_center.vue

@@ -0,0 +1,48 @@
+<template>
+  <view :class="['container', extend_class]">
+    <image class="background" src="@/static/components/swiper/read/background.png"></image>
+    <image class="button" @click="go_to_choice_book" src="@/static/components/swiper/read/button.png"></image>
+  </view>
+</template>
+
+<script>
+
+export default {
+  name: "read_center",
+  data() {
+    return {
+      extend_class : ''
+    };
+  },
+  methods:{
+    go_to_choice_book() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/knowledge_dictionary/knowledge_dictionary'
+      })
+      uni.showToast({
+        title: '跳转成功',
+        icon: 'success',
+      })
+    }
+
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+  position: absolute;
+  width: 100%;
+
+}
+.button{
+  position: absolute;
+  height: 20%;
+  width: 36%;
+  left: 7%;
+  top: 67%;
+
+
+}
+
+</style>

components/tarbar/tarbar.vue

@@ -0,0 +1,141 @@
+<!-- TabBar.vue -->
+<template>
+  <view>
+    <image class="bar" src="/static/components/tarbar/pictures/bar.png"></image>
+
+    <!-- Home 图标 -->
+    <image class="home"
+           src="/static/components/tarbar/pictures/home.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_home"
+           src="/static/components/tarbar/pictures/home_picked_up.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Community 图标 -->
+    <image class="community"
+           src="/static/components/tarbar/pictures/community.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_communnity_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_community"
+           src="/static/components/tarbar/pictures/community_pick_up.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_communnity_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Assistant 图标 -->
+    <image class="assistant"
+           src="/static/components/tarbar/pictures/assistant.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_assistant"
+           src="/static/components/tarbar/pictures/assistant_picked_up.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- User 图标 -->
+    <image class="user"
+           src="/static/components/tarbar/pictures/user.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_user"
+           src="/static/components/tarbar/pictures/user_picked_up.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 1 : 0 }">
+    </image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      is_home_picked_up: false,
+      is_communnity_picked_up: false,
+      is_assistant_picked_up: false,
+      is_user_picked_up: false
+    };
+  },
+  methods: {
+
+      pick_up_home() {
+        this.resetPicks();
+        this.is_home_picked_up = true;
+        uni.navigateTo({
+          url: '/pages/homepages/home/home', // 使用 navigateTo
+        });
+      },
+      pick_up_community() {
+        this.resetPicks();
+        this.is_communnity_picked_up = true;
+        uni.navigateTo({
+          url: '/pages/homepages/community/community',
+        });
+      },
+      pick_up_assistant() {
+        this.resetPicks();
+        this.is_assistant_picked_up = true;
+        uni.navigateTo({
+          url: '/pages/homepages/puppy_chat/puppy_chat',
+        });
+      },
+      pick_up_user() {
+        this.resetPicks();
+        this.is_user_picked_up = true;
+        uni.navigateTo({
+          url: '/pages/homepages/user/user',
+        });
+      },
+      resetPicks() {
+        this.is_home_picked_up = false;
+        this.is_communnity_picked_up = false;
+        this.is_assistant_picked_up = false;
+        this.is_user_picked_up = false;
+      }
+
+  }
+  };
+</script>
+
+<style lang="scss">
+.bar {
+  position: absolute;
+  width: 95%;
+  height: 10%;
+  bottom: 1%;
+  left: 2.5%;
+  background-size: cover;
+  background-position: center;
+}
+.home, .community, .assistant, .user {
+  position: absolute;
+  width: 15%;
+  height: 6%;
+  bottom: 2%;
+  transition: opacity 0.3s ease; /* 添加渐变过渡 */
+}
+.pick_up_home, .pick_up_community, .pick_up_assistant, .pick_up_user {
+  position: absolute;
+  width: 17%;
+  height: 10%;
+  bottom: 2%;
+  transition: opacity 0.3s ease; /* 添加渐变过渡 */
+}
+
+/* 图标位置调整 */
+.home { left: 6%; }
+.pick_up_home { left: 6%; }
+.community { left: 30%; }
+.pick_up_community { left: 30%; }
+.assistant { left: 54%; }
+.pick_up_assistant { left: 54%; }
+.user { left: 78%; }
+.pick_up_user { left: 78%; }
+</style>

components/tarbar_community/tarbar_community.vue

@@ -0,0 +1,155 @@
+<!-- TabBar.vue -->
+<template>
+
+  <view class="bar_background"></view>
+
+    <!-- Home 图标 -->
+    <image class="home"
+           src="/static/components/tarbar/pictures/home.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_home"
+           src="/static/components/tarbar/pictures/home_picked_up.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Community 图标 -->
+    <image class="pick_up_community"
+           src="/static/components/tarbar/pictures/community_pick_up.png"
+           @click="pick_up_community">
+    </image>
+
+    <!-- Assistant 图标 -->
+    <image class="assistant"
+           src="/static/components/tarbar/pictures/assistant.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_assistant"
+           src="/static/components/tarbar/pictures/assistant_picked_up.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- User 图标 -->
+    <image class="user"
+           src="/static/components/tarbar/pictures/user.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_user"
+           src="/static/components/tarbar/pictures/user_picked_up.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 1 : 0 }">
+    </image>
+
+
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      is_home_picked_up: false,
+      is_community_picked_up: false,
+      is_assistant_picked_up: false,
+      is_user_picked_up: false
+    };
+  },
+  methods: {
+
+    pick_up_home() {
+      this.resetPicks();
+      this.is_home_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/homes/home/home', // 使用 navigateTo
+      });
+    },
+    pick_up_community() {
+      this.resetPicks();
+      this.is_community_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/community/community/community',
+      });
+    },
+    pick_up_assistant() {
+      this.resetPicks();
+      this.is_assistant_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/puppy_chat/puppy_chat',
+      });
+    },
+    pick_up_user() {
+      this.resetPicks();
+      this.is_user_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/user/user/user',
+      });
+    },
+    resetPicks() {
+      this.is_home_picked_up = false;
+      this.is_community_picked_up = false;
+      this.is_assistant_picked_up = false;
+      this.is_user_picked_up = false;
+    }
+
+  }
+};
+</script>
+
+<style lang="scss">
+
+@keyframes colorTransition {
+  from {
+    background-color: #5858cd;
+  }
+  to {
+    background-color: #E9D0D0;
+  }
+}
+.bar_background{
+  position:  fixed;
+  width: 95%; /* 宽度占95% */
+  height: 10%; /* 高度 */
+  bottom: 1.2%; /* 距离底部2% */
+  left: 2.5%; /* 左侧2.5% */
+  background-color: khaki; /* 初始颜色 */
+  border-radius: 37px; /* 圆角半径，可以根据需要调整 */
+  z-index: 100; /* 使背景框在其他元素后面 */
+  animation: colorTransition 2s ease forwards; /* 添加颜色渐变动画 */
+}
+
+
+
+
+.home, .community, .assistant, .user {
+  position:  fixed;
+  width: 15%;
+  height: 6%;
+  bottom: 2%;
+  transition: opacity 0.7s ease; /* 添加渐变过渡 */
+  z-index: 100; /* 使背景框在其他元素后面 */
+
+}
+.pick_up_home, .pick_up_community, .pick_up_assistant, .pick_up_user {
+  position: fixed;
+  width: 17%;
+  height: 10%;
+  bottom: 2%;
+  transition: opacity 1s ease; /* 添加渐变过渡 */
+  z-index: 101; /* 使背景框在其他元素后面 */
+
+}
+
+/* 图标位置调整 */
+.home { left: 6%; }
+.pick_up_home { left: 6%; }
+.community { left: 30%; }
+.pick_up_community { left: 30%; }
+.assistant { left: 54%; }
+.pick_up_assistant { left: 54%; }
+.user { left: 78%; }
+.pick_up_user { left: 78%; }
+</style>

components/tarbar_home/tarbar_home.vue

@@ -0,0 +1,145 @@
+<!-- TabBar.vue -->
+<template>
+    <view class="bar_background"></view>
+    <!-- Home 图标 -->
+    <image class="pick_up_home"
+           src="/static/components/tarbar/pictures/home_picked_up.png"
+           @click="pick_up_home">
+    </image>
+    <!-- Community 图标 -->
+    <image class="community"
+           src="/static/components/tarbar/pictures/community.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_community_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_community"
+           src="/static/components/tarbar/pictures/community_pick_up.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_community_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Assistant 图标 -->
+    <image class="assistant"
+           src="/static/components/tarbar/pictures/assistant.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_assistant"
+           src="/static/components/tarbar/pictures/assistant_picked_up.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- User 图标 -->
+    <image class="user"
+           src="/static/components/tarbar/pictures/user.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_user"
+           src="/static/components/tarbar/pictures/user_picked_up.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 1 : 0 }">
+    </image>
+
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      is_community_picked_up: false,
+      is_assistant_picked_up: false,
+      is_user_picked_up: false
+    };
+  },
+
+  methods: {
+
+    pick_up_home() {
+      this.resetPicks();
+      this.is_home_picked_up = true;
+    },
+    pick_up_community() {
+      this.resetPicks();
+      this.is_community_picked_up = true;
+      uni.navigateTo({
+        url: '/pages/homepages/community/community/community',
+      });
+    },
+    pick_up_assistant() {
+      this.resetPicks();
+      this.is_assistant_picked_up = true;
+      uni.navigateTo({
+        url: '/pages/homepages/puppy_chat/puppy_chat',
+      });
+    },
+    pick_up_user() {
+      this.resetPicks();
+      this.is_user_picked_up = true;
+      uni.navigateTo({
+        url: '/pages/homepages/user/user/user',
+      });
+    },
+    resetPicks() {
+      this.is_home_picked_up = false;
+      this.is_community_picked_up = false;
+      this.is_assistant_picked_up = false;
+      this.is_user_picked_up = false;
+    }
+
+  }
+};
+</script>
+
+<style lang="scss">
+
+
+@keyframes colorTransition {
+  from {
+    background-color: #5858cd;
+  }
+  to {
+    background-color: #E9D0D0;
+  }
+}
+.bar_background{
+  position: fixed;
+  width: 95%; /* 宽度占95% */
+  height: 10%; /* 高度 */
+
+  bottom: 1.2%; /* 距离底部2% */
+  left: 2.5%; /* 左侧2.5% */
+  background-color: khaki; /* 初始颜色 */
+  border-radius: 37px; /* 圆角半径，可以根据需要调整 */
+  z-index: 100; /* 使背景框在其他元素后面 */
+  animation: colorTransition 2s ease forwards; /* 添加颜色渐变动画 */
+}
+
+.home, .community, .assistant, .user {
+  position: fixed;
+  width: 15%;
+  height: 6%;
+  bottom: 2%;
+  z-index: 100; /* 使背景框在其他元素后面 */
+  transition: opacity 1s ease; /* 添加渐变过渡 */
+}
+.pick_up_home, .pick_up_community, .pick_up_assistant, .pick_up_user {
+  position: fixed;
+  width: 17%;
+  height: 10%;
+  bottom: 2%;
+  transition: opacity 1s ease; /* 添加渐变过渡 */
+  z-index: 100; /* 使背景框在其他元素后面 */
+}
+
+/* 图标位置调整 */
+.home { left: 6%; }
+.pick_up_home { left: 6%; }
+.community { left: 30%; }
+.pick_up_community { left: 30%; }
+.assistant { left: 54%; }
+.pick_up_assistant { left: 54%; }
+.user { left: 78%; }
+.pick_up_user { left: 78%; }
+</style>

components/tarbar_puppy_chat/tarbar_puppy_chat.vue

@@ -0,0 +1,147 @@
+<!-- TabBar.vue -->
+<template>
+  <view>
+    <view class="bar_background"></view>
+    <!-- Home 图标 -->
+    <image class="home"
+           src="/static/components/tarbar/pictures/home.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_home"
+           src="/static/components/tarbar/pictures/home_picked_up.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Community 图标 -->
+    <image class="community"
+           src="/static/components/tarbar/pictures/community.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_community_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_community"
+           src="/static/components/tarbar/pictures/community_pick_up.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_community_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Assistant 图标 -->
+    <image class="pick_up_assistant"
+           src="/static/components/tarbar/pictures/assistant_picked_up.png"
+           @click="pick_up_assistant">
+    </image>
+
+    <!-- User 图标 -->
+    <image class="user"
+           src="/static/components/tarbar/pictures/user.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_user"
+           src="/static/components/tarbar/pictures/user_picked_up.png"
+           @click="pick_up_user"
+           :style="{ opacity: is_user_picked_up ? 1 : 0 }">
+    </image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      is_home_picked_up: false,
+      is_community_picked_up: false,
+      is_user_picked_up: false
+    };
+  },
+  methods: {
+    pick_up_home() {
+      this.resetPicks();
+      this.is_home_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/homes/home/home', // 使用 navigateTo
+      });
+    },
+    pick_up_community() {
+      this.resetPicks();
+      this.is_communnity_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/community/community/community',
+      });
+    },
+    pick_up_assistant() {
+      this.resetPicks();
+      this.is_assistant_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/puppy_chat/puppy_chat',
+      });
+    },
+    pick_up_user() {
+      this.resetPicks();
+      this.is_user_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/user/user/user',
+      });
+    },
+    resetPicks() {
+      this.is_home_picked_up = false;
+      this.is_communnity_picked_up = false;
+      this.is_assistant_picked_up = false;
+      this.is_user_picked_up = false;
+    }
+
+  }
+};
+</script>
+
+<style lang="scss">
+
+
+
+@keyframes colorTransition {
+  from {
+    background-color: #5858cd;
+  }
+  to {
+    background-color: #E9D0D0;
+  }
+}
+.bar_background{
+  position: fixed;
+  width: 95%; /* 宽度占95% */
+  height: 10%; /* 高度 */
+
+  bottom: 1.2%; /* 距离底部2% */
+  left: 2.5%; /* 左侧2.5% */
+  background-color: khaki; /* 初始颜色 */
+  border-radius: 37px; /* 圆角半径，可以根据需要调整 */
+  z-index: -1; /* 使背景框在其他元素后面 */
+  animation: colorTransition 2s ease forwards; /* 添加颜色渐变动画 */
+}
+
+.home, .community, .assistant, .user {
+  position: fixed;
+  width: 15%;
+  height: 6%;
+  bottom: 2%;
+  transition: opacity 1s ease; /* 添加渐变过渡 */
+}
+.pick_up_home, .pick_up_community, .pick_up_assistant, .pick_up_user {
+  position: fixed;
+  width: 17%;
+  height: 10%;
+  bottom: 2%;
+  transition: opacity 1s ease; /* 添加渐变过渡 */
+}
+
+/* 图标位置调整 */
+.home { left: 6%; }
+.pick_up_home { left: 6%; }
+.community { left: 30%; }
+.pick_up_community { left: 30%; }
+.assistant { left: 54%; }
+.pick_up_assistant { left: 54%; }
+.user { left: 78%; }
+.pick_up_user { left: 78%; }
+</style>

components/tarbar_user/tarbar_user.vue

@@ -0,0 +1,154 @@
+<!-- TabBar.vue -->
+<keep-alive>
+
+</keep-alive>
+<template>
+  <view>
+    <view class="bar_background"></view>
+
+    <!-- Home 图标 -->
+    <image class="home"
+           src="/static/components/tarbar/pictures/home.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_home"
+           src="/static/components/tarbar/pictures/home_picked_up.png"
+           @click="pick_up_home"
+           :style="{ opacity: is_home_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Community 图标 -->
+    <image class="community"
+           src="/static/components/tarbar/pictures/community.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_community_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_community"
+           src="/static/components/tarbar/pictures/community_pick_up.png"
+           @click="pick_up_community"
+           :style="{ opacity: is_community_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- Assistant 图标 -->
+    <image class="assistant"
+           src="/static/components/tarbar/pictures/assistant.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 0 : 1 }">
+    </image>
+    <image class="pick_up_assistant"
+           src="/static/components/tarbar/pictures/assistant_picked_up.png"
+           @click="pick_up_assistant"
+           :style="{ opacity: is_assistant_picked_up ? 1 : 0 }">
+    </image>
+
+    <!-- User 图标 -->
+    <image class="pick_up_user"
+           src="/static/components/tarbar/pictures/user_picked_up.png"
+           @click="pick_up_user">
+    </image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      is_home_picked_up: false,
+      is_community_picked_up: false,
+      is_assistant_picked_up: false,
+      is_user_picked_up: false
+    };
+  },
+  methods: {
+
+    pick_up_home() {
+      this.resetPicks();
+      this.is_home_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/homes/home/home', // 使用 navigateTo
+      });
+    },
+    pick_up_community() {
+      this.resetPicks();
+      this.is_community_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/community/community/community',
+      });
+    },
+    pick_up_assistant() {
+      this.resetPicks();
+      this.is_assistant_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/puppy_chat/puppy_chat',
+      });
+    },
+    pick_up_user() {
+      this.resetPicks();
+      this.is_user_picked_up = true;
+      uni.reLaunch({
+        url: '/pages/homepages/user/user/user',
+      });
+    },
+    resetPicks() {
+      this.is_home_picked_up = false;
+      this.is_community_picked_up = false;
+      this.is_assistant_picked_up = false;
+      this.is_user_picked_up = false;
+    }
+
+  }
+};
+</script>
+
+<style lang="scss">
+
+
+@keyframes colorTransition {
+  from {
+    background-color: #5858cd;
+  }
+  to {
+    background-color: #E9D0D0;
+  }
+}
+.bar_background{
+  position: fixed;
+  width: 95%; /* 宽度占95% */
+  height: 10%; /* 高度 */
+
+  bottom: 1.2%; /* 距离底部2% */
+  left: 2.5%; /* 左侧2.5% */
+  background-color: khaki; /* 初始颜色 */
+  border-radius: 37px; /* 圆角半径，可以根据需要调整 */
+  z-index: 100; /* 使背景框在其他元素后面 */
+  animation: colorTransition 2s ease forwards; /* 添加颜色渐变动画 */
+}
+
+.home, .community, .assistant, .user {
+  position:  fixed;
+  width: 15%;
+  height: 6%;
+  bottom: 2%;
+  z-index: 101;
+  transition: opacity 2s ease; /* 添加渐变过渡 */
+}
+.pick_up_home, .pick_up_community, .pick_up_assistant, .pick_up_user {
+  position:  fixed;
+  width: 17%;
+  height: 10%;
+  bottom: 2%;
+  z-index: 101;
+
+}
+
+/* 图标位置调整 */
+.home { left: 6%; }
+.pick_up_home { left: 6%; }
+.community { left: 30%; }
+.pick_up_community { left: 30%; }
+.assistant { left: 54%; }
+.pick_up_assistant { left: 54%; }
+.user { left: 78%; }
+.pick_up_user { left: 78%; }
+</style>

manifest.json

@@ -1,7 +1,7 @@
 {
-    "name" : "fitjourney前端代码",
-    "appid" : "",
-    "description" : "",
+    "name" : "fit journey",
+    "appid" : "__UNI__1A765D2",
+    "description" : "fit journey是一款基于AI的应用 支持多平台",
     "versionName" : "1.0.0",
     "versionCode" : "100",
     "transformPx" : false,
@@ -41,17 +41,50 @@
                 ]
             },
             /* ios打包配置 */
-            "ios" : {},
+            "ios" : {
+                "dSYMs" : false
+            },
             /* SDK配置 */
-            "sdkConfigs" : {}
+            "sdkConfigs" : {
+                "oauth" : {},
+                "ad" : {}
+            },
+            "icons" : {
+                "ios" : {
+                    "iphone" : {
+                        "app@2x" : "unpackage/res/icons/120x120.png",
+                        "app@3x" : "unpackage/res/icons/180x180.png",
+                        "notification@2x" : "unpackage/res/icons/40x40.png",
+                        "notification@3x" : "unpackage/res/icons/60x60.png",
+                        "settings@2x" : "unpackage/res/icons/58x58.png",
+                        "settings@3x" : "unpackage/res/icons/87x87.png",
+                        "spotlight@2x" : "unpackage/res/icons/80x80.png",
+                        "spotlight@3x" : "unpackage/res/icons/120x120.png"
+                    },
+                    "appstore" : "unpackage/res/icons/1024x1024.png",
+                    "ipad" : {
+                        "app" : "unpackage/res/icons/76x76.png",
+                        "app@2x" : "unpackage/res/icons/152x152.png",
+                        "notification" : "unpackage/res/icons/20x20.png",
+                        "notification@2x" : "unpackage/res/icons/40x40.png",
+                        "proapp@2x" : "unpackage/res/icons/167x167.png",
+                        "settings" : "unpackage/res/icons/29x29.png",
+                        "settings@2x" : "unpackage/res/icons/58x58.png",
+                        "spotlight" : "unpackage/res/icons/40x40.png",
+                        "spotlight@2x" : "unpackage/res/icons/80x80.png"
+                    }
+                },
+                "android" : {
+                    "hdpi" : "unpackage/res/icons/72x72.png",
+                    "xhdpi" : "unpackage/res/icons/96x96.png",
+                    "xxhdpi" : "unpackage/res/icons/144x144.png",
+                    "xxxhdpi" : "unpackage/res/icons/192x192.png"
+                }
+            }
         }
     },
     /* 快应用特有相关 */
     "quickapp" : {},
-
-
-
-
     /* 小程序特有相关 */
     "mp-weixin" : {
         "appid" : "",
@@ -69,8 +102,21 @@
     "mp-toutiao" : {
         "usingComponents" : true
     },
+    // "h5": {
+    //     "devServer": {
+    //         "proxy": {
+    //             "/prefix/api/user/list": {
+    //                 "target": "http://47.122.61.54:8084",
+    //                 "pathRewrite": {
+    //                     "^/prefix": ""
+    //                 }
+    //             }
+    //         }
+    //     }
+    // },
     "uniStatistics" : {
         "enable" : false
     },
-    "vueVersion" : "3"
+    "vueVersion" : "3",
+    "fallbackLocale" : "zh-Hans"
 }

package.json

@@ -0,0 +1,13 @@
+{
+  "name": "fitjourney前端代码",
+  "version": "1.0.0",
+  "description": "",
+  "main": "main.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "private": true,
+  "dependencies": {
+    "echarts": "^5.5.1"
+  }
+}

pages.json

@@ -1,6 +1,7 @@
 {
   "pages": [
-    {
+    /*---------------------------------------------------------动画过渡界面--------------------------------*/
+       {
       "path": "pages/transition/page1/page1",
       "style": {
         "navigationStyle": "custom"
@@ -23,13 +24,497 @@
       "style": {
         "navigationStyle": "custom"
       }
+    },
+    {
+      "path": "pages/transition/page5/page5",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/transition/page6/page6",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/transition/page7/page7",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*-----------------------------------------------------------------------动画过渡界面-------------------------------------------*/
+    /*-----------------------------------------------------------------------登录注册界面-----------------------------------------------*/
+
+     {
+      "path": "pages/login/account_login/account_login",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/login/register/register",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/login/forget_password/forget_password",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/login/change_password/change_password",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*-----------------------------------------------------------------------登录注册界面-------------------------------------------*/
+    /*-----------------------------------------------------------------------性别填写界面---------------------------------------------*/
+       {
+      "path": "pages/information/sex/sex",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*----------------------------------------------性别填写界面--------------------------------------------------------------*/
+    /*------------------------------------------------男生填写体重------------------------------------------------------*/
+     {
+     "path": "pages/information/boy_weight_start/boy_weight_start",
+     "style": {
+       "navigationStyle": "custom"
+     }
+   },
+   {
+     "path": "pages/information/boy_weight_roll/boy_weight_roll",
+     "style": {
+       "navigationStyle": "custom"
+     }
+   },
+   {
+     "path": "pages/information/boy_weight_end/boy_weight_end",
+     "style": {
+       "navigationStyle": "custom"
+     }
+   },
+    /*------------------------------------------------男生填写体重------------------------------------------------------------*/
+    /*------------------------------------------------男生填写身高------------------------------------------------------------*/
+      {
+    "path": "pages/information/boy_height_start/boy_height_start",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+    "path": "pages/information/boy_height_roll/boy_height_roll",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+    "path": "pages/information/boy_height_end/boy_height_end",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*---------------------------------------男生填写身高--------------------------------------------------------------*/
+    /*------------------------------------------------女生填写身高------------------------------------------------------------*/
+       {
+      "path": "pages/information/girl_height_start/girl_height_start",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/information/girl_height_roll/girl_height_roll",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/information/girl_height_end/girl_height_end",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*------------------------------------------------女生填写身高------------------------------------------------------------*/
+    /*------------------------------------------------------------------------女生填写体重------------------------------------------------------------------*/
+       {
+      "path": "pages/information/girl_weight_start/girl_weight_start",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/information/girl_weight_roll/girl_weight_roll",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/information/girl_weight_end/girl_weight_end",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*--------------------------------------------------------------------女生填写体重------------------------------------------------------------------*/
+    /*----------------------------------------------------------填写使用目的--------------------------------------------------*/
+        {
+      "path": "pages/information/purpose/purpose",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*------------------------------------------------填写使用目的-----------------------------------------------------------*/
+    /*---------------------------------------------------------------进入主页的过渡界面----------------------------------------------------*/
+    {
+      "path": "pages/transition/page8/page8",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*------------------------------------------------------------------进入主页的过渡界面--------------------------------------------*/
+    /*------------------------------------------------------------------主页部分内容--------------------------------------------------------*/
+    {
+      "path": "pages/homepages/homes/home/home",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/ai_recognize_recipe/ai_recognize_recipe",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },//饮食专区四个界面
+    {
+     "path": "pages/homepages/homes/ai_recognize_fruit/ai_recognize_fruit",
+     "style": {
+       "navigationStyle": "custom"
+     }
+   },//饮食专区四个界面
+     {
+      "path": "pages/homepages/homes/ai_recognize_hot/ai_recognize_hot",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },//饮食专区四个界面
+   {
+       "path": "pages/homepages/homes/my_recipe_plan/my_recipe_plan",
+       "style": {
+         "navigationStyle": "custom"
+       }
+   },//饮食专区四个界面
+  {
+    "path" : "pages/homepages/homes/ai_recognize_plan/ai_recognize_plan",
+    "style" :
+    {
+      "navigationStyle": "custom"
+    }
+  },//运动专区的两个界面
+  {
+    "path": "pages/homepages/homes/my_exercise_plan/my_exercise_plan",
+    "style" :
+    {
+      "navigationStyle": "custom"
+    }
+  },//运动专区的两个界面
+  {
+    "path": "pages/homepages/homes/choice_book/choice_book",
+    "style" :
+    {
+      "navigationStyle": "custom"
+    }
+  },//阅读专区的两个界面
+    {
+      "path": "pages/homepages/homes/knowledge_dictionary/knowledge_dictionary",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },//阅读专区的两个界面
+
+    /*-----------------------------------------------------------------------主界面----------------------------------------------------------*/
+     {
+      "path": "pages/homepages/puppy_chat/puppy_chat",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*----------------------------------------------------------------------聊天界面--------------------------------------------------------*/
+   /*  {
+      "path": "pages/homepages/community/community",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },*/
+    /*---------------------------------------------------------------------社区界面------------------------------------------------------*/
+    {
+      "path": "pages/homepages/user/user/user",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    /*---------------------------------------------------------------------个人信息界面以及跳转的几个界面----------------------------------------------------*/
+
+   /* {
+      "path": "pages/homepages/user/basic_information/basic_information",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/homepages/user/bmi_information/bmi_information",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/homepages/user/basic_information/basic_information",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },*/
+  /*  {
+      "path": "pages/homepages/user/exercise_plans/exercise_plans",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/homepages/user/recipe_and_calorie/recipe_and_calorie",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    }*/
+
+    /*---------------------------------------------------------主页跳转的几个界面-------------------------------------------------------*/
+    /*  {
+        "path": "components/ai_recongize_fruit/ai_recongize_fruit",
+        "style": {
+          "navigationStyle": "custom"
+        }
+      },
+
+	  {
+	  	"path" : "pages/homepages/homes/ai_recognize_plan/ai_recognize_plan",
+	  	"style" : 
+	  	{
+	  		"navigationStyle": "custom"
+	  	}
+	  }*/
+    /*--------------------------------------------------------知识图谱界面----------------------------------------------------------------------*/
+    /* {
+      "path" : "pages/homepages/homes/dictionary/orange/orange",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+
+    {
+      "path" : "pages/homepages/homes/dictionary/apple/apple",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/watermelon/watermelon",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/banana/banana",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/avocado/avocado",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/bread/bread",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/broccoli/broccoli",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/carrot/carrot",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/corn/corn",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/eggplant/eggplant",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/fried egg/fried egg",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/garlic/garlic",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/grape/grape",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/kiwi fruit/kiwi fruit",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/lemon/lemon",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/loquat/loquat",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/mango/mango",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/mushroom/mushroom",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/papaya/papaya",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/pear/pear",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/pepper/pepper",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/pineapple/pineapple",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/pizza/pizza",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/pulled noodles/pulled noodles",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/radish/radish",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path" : "pages/homepages/homes/dictionary/strawberry/strawberry",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    }*/
+    /*--------------------------------------------------------知识图谱界面----------------------------------------------------------------------*/
+
+    /*-------------------------------------------------------------------部分组件的测试类---------------------------------------------------*/
+
+
+    {
+      "path": "pages/homepages/community/community/community",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
     },
 	{
-	  "path": "pages/transition/page5/page5",
-	  "style": {
+	  "path": "pages/homepages/community/add_post/add_post",
+	  "style" :
+	  {
 	    "navigationStyle": "custom"
 	  }
-	}
+	},
+    {
+      "path": "pages/homepages/community/personal_center/personal_center",
+      "style" :
+      {
+        "navigationStyle": "custom"
+      }
+    }
   ],
   "uniIdRouter": {},
   "tabBar": null

pages/homepages/community/add_post/add_post.vue

@@ -0,0 +1,116 @@
+<template>
+	<view class="add_post_box">
+		<!-- 头部盒子 -->
+		<view class="addpost_top_box">
+			<!-- 返回个人中心盒子 -->
+			<view class="return_box" @click="toCommunityPage">
+				<image 
+					class="return_image" 
+					src="../../../../static/homepages/community/add_post/pictures/left_arrow.png" 
+					mode="widthFix"
+				></image>
+			</view>
+			<!-- 标题盒子 -->
+			<view class="title_box">发布我的帖子</view>
+			<button class="publish_btn">发表</button>
+		</view>
+		<!-- 提示盒子 -->
+		<view class="addpost_tip_box">分享自己的健康秘诀</view>
+		<!-- 发布盒子 -->
+		<view class="addpost_box">
+			<view class="post_box">
+				<view class="post_top_box">
+					<view class="post_avatar_box">
+						<image class="post_avatar" :src=user.avatar mode="widthFix"></image>
+					</view>
+					<view class="post_info">
+						<view class="post_name">{{user.name}}</view>
+						<view class="post_date">{{user.date}}</view>
+					</view>
+				</view>
+				<textarea class="post_word_box" v-model="user.word" placeholder="请输入你的文案(最多50个字)" cols="16" rows="2" auto-height maxlength="50"></textarea>
+				<!-- <view class="post_word_box">{{user.word}}</view> -->
+				<view class="post_images_box">
+					<view class="myimgDV">
+					    <view class='receiveimage flex justify'>
+					        <block v-for="(item,ind) in user.imgList" :key="ind">
+					            <image class="imgitem doublepic" @tap="chooseTheImg(ind)" :style="{height:imgheight}" :src="item" mode="aspectFill"></image>
+					        </block>
+					    </view>
+					</view>
+					<!-- <community_image_box class="post_images" :imgList='user.imgList' :num='user.imgList.length'></community_image_box> -->
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import community_image_box from "../../../../components/community_image_box/community_image_box.vue";
+
+export default{
+	data(){
+		return{
+			user:{
+				avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+				name:'cat',
+				date:'2024年9月31日',
+				word:'',
+				imgList:[
+					'../../../../static/homepages/community/add_post/pictures/add_post_image.png',
+					'../../../../static/homepages/community/add_post/pictures/add_post_image.png',
+					'../../../../static/homepages/community/add_post/pictures/add_post_image.png',
+					'../../../../static/homepages/community/add_post/pictures/add_post_image.png',
+				],
+			},
+			imgheight:'',
+		}
+	},
+	methods:{
+		getheight() {
+			console.log('imgboxtype:',this.imgboxtype)
+		    let that = this;
+		    const query = uni.createSelectorQuery().in(that)
+		    query.select('.imgitem').boundingClientRect()
+		    query.exec((res)=>{
+		        console.log(res[0].width)
+		        that.imgheight = (res[0].width).toFixed(2) + 'px';
+		    })
+		},
+		chooseTheImg(index){
+		    uni.chooseImage({  
+		        count: 1,  //图片可选择数量
+		        sizeType: ['original','compressed'],  //original 原图，compressed 压缩图，默认二者都有
+		        sourceType: ['album'],   //album 从相册选图，camera 使用相机，默认二者都有。
+		        crop: {  //是否进行裁剪，此配置一般用于头像上传时裁剪成正方形等
+					width: 100,
+					height: 100
+				},
+		        success: res => {
+					console.log('res', res)
+		            let imgFiles = res.tempFilePaths   //图片的本地文件路径列表
+		            // this.uploadTheImg(imgFiles)
+					console.log('imgFiles', imgFiles)
+					this.user.imgList[index] = imgFiles[0]
+					console.log(this.user.imgList[index])
+		        }
+		    })
+		},
+		toCommunityPage(){
+			uni.navigateTo({
+				url:'/pages/homepages/community/community/community'
+			})
+		}
+	},
+	mounted() {
+		this.$nextTick(function() {
+		    this.getheight();
+		})
+	}
+}
+
+</script>
+
+<style lang="scss" scoped>
+	@import "@/static/homepages/community/add_post/scss/add_post.scss"
+</style>

pages/homepages/community/community/community.vue

@@ -0,0 +1,190 @@
+<template>
+  <view class="community_box">
+	  <!-- 头部信息 -->
+	  <view class="top_box">
+		  <!-- 头像 -->
+		  <view class="dog_image_box" @click="toPersonCenter">
+			  <image class="dog_image" src="../../../../static/homepages/community/community/pictures/dog_image.png" mode="widthFix"></image>
+		  </view>
+		  <view class="words_box">
+			  <!-- 标题 -->
+			  <view class="title_box">fit journey社区</view>
+			  <view class="tip_word_box">搜索他人的健康秘诀</view>
+		  </view>
+		  <view class="add_image_box">
+			  <image 
+				class="add_image" 
+				src="../../../../static/homepages/community/community/pictures/add_image.png" 
+				mode="widthFix"
+				@click="toAddPostPage"
+			></image>
+		  </view>
+	  </view>
+	  <view class="line_box"></view>
+	  <!-- 帖子 -->
+	  <view class="post_body">
+		  <scroll-view class="post_scroll_box" scroll-y="true">
+			  <view class="post_box" v-for="(item, index) in posts" :key="index">
+			  	<view class="post_top_box">
+			  		<view class="post_avatar_box">
+			  			<image class="post_avatar" :src=item.avatar mode="widthFix"></image>
+			  		</view>
+			  		<view class="post_info">
+			  			<view class="post_name">{{item.name}}</view>
+			  			<view class="post_date">{{item.date}}</view>
+			  		</view>
+			  	</view>
+			  	<view class="post_word_box">{{item.word}}</view>
+			  	<view class="post_images_box">
+			  		<community_image_box class="post_images" :imgList='item.imgList' :num='item.imgList.length'></community_image_box>
+			  	</view>
+			  	<view class="post_bottom_box">
+			  		<view class="comments_box">
+			  			<image class="chat_icon" src="../../../../static/homepages/community/community/pictures/chat_icon.png" mode="widthFix"></image>
+			  			<view class="comments_num">{{item.comments_num}}</view>
+			  		</view>
+			  		<view class="like_box">
+			  			<image
+							class="love_icon" 
+							:src=getLikeImage(index)
+							mode="widthFix"
+							@click="likeClick(index)"
+						></image>
+			  			<view class="like_num">{{item.like_num}}</view>
+			  		</view>
+			  	</view>
+			  </view>
+		  </scroll-view>
+	  </view>
+  </view>
+  <!-- 底部导航栏 -->
+  <tarbar_community class="tarbar_box"></tarbar_community>
+</template>
+
+<script>
+import Community from "@/components/swiper/community.vue";
+import community_image_box from "../../../../components/community_image_box/community_image_box.vue";
+export default {
+  components: {Community, community_image_box},
+  data() {
+    return {
+		posts:[
+			{
+				avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+				name:'cat',
+				date:'2024年9月31日',
+				word:'今天去海边锻炼看见的，真是太美了啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊',
+				imgList:[
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+				],
+				comments_num:1,
+				like_num:100,
+				islike:false,
+			},
+			{
+				avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+				name:'puppy',
+				date:'2024年11月13日',
+				word:'今天去海边锻炼看见的，真是太美了',
+				imgList:[
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+				],
+				comments_num:12,
+				like_num:17,
+				islike:false,
+			},
+			{
+				avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+				name:'cat',
+				date:'2024年10月13日',
+				word:'今天去海边锻炼看见的',
+				imgList:[
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+				],
+				comments_num:10,
+				like_num:100,
+				islike:false,
+			},
+			{
+				avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+				name:'cat',
+				date:'2024年1月13日',
+				word:'今天去锻炼',
+				imgList:[
+					'../../../../static/homepages/community/community/pictures/dog_image.png',
+				],
+				comments_num:10,
+				like_num:100,
+				islike:false,
+			},
+		],
+	};
+  },
+  mounted(){
+	this.getAllPost()
+  },
+  computed:{
+	likeImages() {
+	    return this.posts.map((post, index) => ({
+	        index,
+	        image: post.islike ? '../../../../static/homepages/community/community/pictures/red_love_image.png' : '../../../../static/homepages/community/community/pictures/love_image.png'
+	    }));
+	}
+  },
+  methods:{
+	  getLikeImage(index) {
+		  //TODO:获取点赞的图片
+	        const item = this.likeImages.find(item => item.index === index);
+	        return item ? item.image : '';
+		},
+	  getAllPost(){
+		  //TODO:获取所有的帖子
+		  const app = getApp()
+		  uni.request({
+		  	url:app.globalData.fit_journey_community_address + '/post/getAll',
+			method:"GET",
+			success:(res) => {
+				console.log('getAllPost')
+				console.log(res)
+			},
+			fail: (err) => {
+				console.log('getAllPost fail')
+				console.log(err.log)
+			},
+		  })
+	  },
+	  likeClick(index){
+		  //TODO:点赞
+		  if (this.posts[index].islike){
+			  this.posts[index].islike = false
+			  this.posts[index].like_num--
+		  }
+		  else{
+			  this.posts[index].islike = true
+			  this.posts[index].like_num++
+		  }
+	  },
+	  toAddPostPage(){
+		  //TODO:转到发布帖子界面
+		  uni.navigateTo({
+		  	url:'/pages/homepages/community/add_post/add_post'
+		  })
+	  },
+		toPersonCenter(){
+			uni.navigateTo({
+				url:'/pages/homepages/community/personal_center/personal_center'
+			})
+		}
+  }
+}
+</script>
+
+<style lang="scss">
+	@import "@/static/homepages/community/community/scss/community.scss";
+</style>

pages/homepages/community/personal_center/personal_center.vue

@@ -0,0 +1,229 @@
+<template>
+  <view class="person_center_box">
+	<view class="person_center_top">
+		<view class="return_box">
+			<image 
+				class="return_image" 
+				src="../../../../static/homepages/community/personal_center/pictures/left_arrow.png" 
+				mode="widthFix"
+			></image>
+		</view>
+	</view>
+	<view class="person_center_body">
+		<view class="info_box">
+			<view class="height_box">
+				<view class="height_data">{{height}}cm</view>
+				<view class="height_words">身高</view>
+			</view>
+			<image class="avatar_box" src="" mode="widthFix"></image>
+			<view class="weight_box">
+				<view class="weight_data">{{weight}}kg</view>
+				<view class="weight_words">体重</view>
+			</view>
+			<view class="name_box">{{name}}</view>
+			<view class="tip_box">{{tip}}</view>
+		</view>
+		<view class="btns_box">
+			<button class="changeInfoBtn">个人中心修改信息</button>
+			<button class="addPostBtn" @click="toAddPostPage">去发布帖子</button>
+		</view>
+		<view class="posts_box">
+			<view class="post_nav_box">
+				<view class="toMypost_box post_nav">
+					<view class="toMypost" @click="myPostClick">我的帖子</view>
+					<view class="bottom_line" v-if="isMyPost"></view>
+				</view>
+				<view class="toLikepost_box post_nav">
+					<view class="toLikepost" @click="likePostClick">我的点赞</view>
+					<view class="bottom_line" v-if="!isMyPost"></view>
+				</view>
+			</view>
+			<view class="posts">
+				<view class="post_box" v-for="(item, index) in posts" :key="index">
+					<view class="post_top_box">
+						<view class="post_avatar_box">
+							<image class="post_avatar" :src=item.avatar mode="widthFix"></image>
+						</view>
+						<view class="post_info">
+							<view class="post_name">{{item.name}}</view>
+							<view class="post_date">{{item.date}}</view>
+						</view>
+					</view>
+					<view class="post_word_box">{{item.word}}</view>
+					<view class="post_images_box">
+						<community_image_box class="post_images" :imgList='item.imgList' :num='item.imgList.length'></community_image_box>
+					</view>
+					<view class="post_bottom_box">
+						<view class="comments_box">
+							<image class="chat_icon" src="../../../../static/homepages/community/community/pictures/chat_icon.png" mode="widthFix"></image>
+							<view class="comments_num">{{item.comments_num}}</view>
+						</view>
+						<view class="like_box">
+							<image
+								class="love_icon"
+								:src=getLikeImage(index)
+								mode="widthFix"
+								@click="likeClick(index)"
+							></image>					
+							<view class="like_num">{{item.like_num}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+  </view>
+</template>
+
+<script>
+import community_image_box from "../../../../components/community_image_box/community_image_box.vue";
+export default {
+	components: {community_image_box},
+	data() {
+		return {
+			name:'puppy',
+			height:187,
+			weight:71,
+			tip:'这是一条个性签名',
+			isMyPost:true,
+			likePosts:[
+				{
+					avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+					name:'cat',
+					date:'2024年9月31日',
+					word:'这是我喜欢的帖子',
+					imgList:[
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+					],
+					comments_num:1,
+					like_num:100,
+					islike:false,
+				},
+			],
+			myPosts:[
+				{
+					avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+					name:'cat',
+					date:'2024年9月31日',
+					word:'今天去海边锻炼看见的，真是太美了啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊',
+					imgList:[
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+					],
+					comments_num:1,
+					like_num:100,
+					islike:false,
+				},
+				{
+					avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+					name:'puppy',
+					date:'2024年11月13日',
+					word:'今天去海边锻炼看见的，真是太美了',
+					imgList:[
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+					],
+					comments_num:12,
+					like_num:17,
+					islike:false,
+				},
+				{
+					avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+					name:'cat',
+					date:'2024年10月13日',
+					word:'今天去海边锻炼看见的',
+					imgList:[
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+					],
+					comments_num:10,
+					like_num:100,
+					islike:false,
+				},
+				{
+					avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
+					name:'cat',
+					date:'2024年1月13日',
+					word:'今天去锻炼',
+					imgList:[
+						'../../../../static/homepages/community/community/pictures/dog_image.png',
+					],
+					comments_num:10,
+					like_num:100,
+					islike:false,
+				},
+			],
+			posts:[],
+		};
+	},
+	mounted(){
+		this.getAllPost()
+		this.posts = this.myPosts
+	},
+	computed:{
+		likeImages() {
+		    return this.posts.map((post, index) => ({
+		        index,
+		        image: post.islike ? '../../../../static/homepages/community/community/pictures/red_love_image.png' : '../../../../static/homepages/community/community/pictures/love_image.png'
+		    }));
+		}
+	},
+	methods:{
+		myPostClick(){
+			this.isMyPost = true
+			this.posts = this.myPosts
+		},
+		likePostClick(){
+			this.isMyPost = false
+			this.posts = this.likePosts
+		},
+		getLikeImage(index) {
+				  //TODO:获取点赞的图片
+			const item = this.likeImages.find(item => item.index === index);
+			return item ? item.image : '';
+		},
+		getAllPost(){
+			//TODO:获取所有的帖子
+			const app = getApp()
+			uni.request({
+			url:app.globalData.fit_journey_community_address + '/post/getAll',
+			method:"GET",
+			success:(res) => {
+				console.log('getAllPost')
+				console.log(res)
+			},
+			fail: (err) => {
+				console.log('getAllPost fail')
+				console.log(err.log)
+			},
+			})
+		},
+		likeClick(index){
+			//TODO:点赞
+			if (this.posts[index].islike){
+			  this.posts[index].islike = false
+			  this.posts[index].like_num--
+			}
+			else{
+				this.posts[index].islike = true
+				this.posts[index].like_num++
+			}
+		},
+		toAddPostPage(){
+			uni.navigateTo({
+				url:'/pages/homepages/community/add_post/add_post'
+			})
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+@import "../../../../static/homepages/community/personal_center/scss/personal_center.scss"
+</style>

pages/homepages/homes/ai_recognize_fruit/ai_recognize_fruit.vue

@@ -0,0 +1,108 @@
+<template>
+  <view class="background">
+    <!-- 点击上传图片按钮 -->
+    <image class="upload_picture" @click="selectAndUploadPicture" src="@/static/homepages/homes/ai_recognize_fruit/pictures/photo.png"></image>
+
+    <!-- 所含卡路里显示窗口 -->
+    <view class="calorie_container">
+      <text class="calorie_text">{{ calorie }}J</text>
+    </view>
+
+    <!-- 所含菜品名称显示窗口 -->
+    <view class="name_container">
+      <text class="name_text">{{ name }}</text>
+    </view>
+
+    <!-- 返回按钮 -->
+    <image class="button" @click="goBackToHome" src="/static/homepages/homes/ai_recognize_fruit/pictures/button.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      calorie: 0,
+      name: '',
+      token:uni.getStorageSync("access_token")
+    };
+  },
+  methods: {
+    goBackToHome() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/home/home', // 跳转到主页
+      });
+    },
+    // 选择图片
+    selectAndUploadPicture() {
+      const app = getApp();
+      const serverAddress = app.globalData.fit_journey_ai_address;
+      console.log("后端服务器的地址是：" + serverAddress);
+
+      // 调用选择图片的 API
+      uni.file
+      uni.chooseImage({
+        count: 1, // 选择的图片数量，1表示只选择一张
+        sizeType: ['compressed'], // 可以选择原图或者压缩图，compressed为压缩图
+        sourceType: ['album', 'camera'], // 可选择相册或拍照
+        success: (chooseImageRes) => {
+
+          const filePath = chooseImageRes.tempFilePaths[0]; // 获取选择的图片路径
+          console.log('选择的图片路径:', filePath);
+          console.log("图片上传成功！");
+          // 上传文件到后端服务器中
+          uni.uploadFile({
+            header: {
+              'Authorization':this.token
+            },
+            url: app.globalData.fit_journey_ai_address + `/ai/fruit`, // 服务器接口地址
+            filePath: filePath,
+            name: 'file', // 后端接收的文件参数名称
+            success: (uploadFileRes) => {
+
+              const response = JSON.parse(uploadFileRes.data); // 解析返回的数据
+              if (response && response.data) {
+                let result = response.data;  // 获取返回的结果
+                console.log("识别到的果蔬信息:", result);
+
+                // 你可以通过以下方式获取识别的果蔬名称和卡路里
+                for (let [name, calorie] of Object.entries(result)) {
+                  this.name = name;      // 存储果蔬名称
+                  this.calorie = calorie; // 存储卡路里
+                  console.log(`水果: ${name}, 卡路里: ${calorie} kcal/100g`);
+                }
+                uni.showToast({
+                  title: '恭喜你，AI识别成功了呢~',
+                  icon: 'none',
+                });
+              } else {
+                uni.showToast({
+                  title: '识别失败，请重新上传图片',
+                  icon: 'none',
+                });
+              }
+            },
+            fail: () => {
+              uni.showToast({
+                title: '图片上传失败',
+                icon: 'none',
+              });
+            },
+          });
+        },
+        fail: () => {
+          uni.showToast({
+            title: '图片选择失败',
+            icon: 'none',
+          });
+        },
+      });
+    }
+
+  },
+};
+</script>
+
+<style lang="scss">
+@import "@/static/homepages/homes/ai_recognize_fruit/css/ai_recongnize_fruit.scss";
+</style>

pages/homepages/homes/ai_recognize_hot/ai_recognize_hot.vue

@@ -0,0 +1,120 @@
+<template>
+  <view class="background">
+    <!-- 点击上传图片按钮 -->
+    <image class="upload_picture" @click="selectAndUploadPicture" src="/static/homepages/homes/ai_recognize_hot/pictures/photo.png"></image>
+
+    <!-- 所含卡路里显示窗口 -->
+    <view class="calorie_container">
+      <text class="calorie_text">{{ calorie }}J</text>
+    </view>
+
+    <!-- 所含菜品名称显示窗口 -->
+    <view class="name_container">
+      <text class="name_text">{{ name }}</text>
+    </view>
+
+    <!-- 返回按钮 -->
+    <image class="button" @click="goBackToHome" src="/static/homepages/homes/ai_recognize_hot/pictures/button.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      calorie: 0,
+      name: '',
+      token :uni.getStorageSync("access_token")
+    };
+  },
+  methods: {
+    goBackToHome() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/home/home', // 跳转到主页
+      });
+    },
+    // 选择图片
+    selectAndUploadPicture() {
+      const app = getApp();
+      const serverAddress = app.globalData.fit_journey_ai_address;
+      console.log("后端服务器的地址是："+serverAddress);
+    /*  uni.showToast({
+        title: 'AI正在识别中呢~',
+        icon: 'loading',
+        duration: 2000
+      });*/
+      // 调用选择图片的 API
+	  uni.file
+      uni.chooseImage({
+        count: 1, // 选择的图片数量，1表示只选择一张
+        sizeType: ['compressed'], // 可以选择原图或者压缩图，compressed为压缩图
+        sourceType: ['album', 'camera'], // 可选择相册或拍照
+        success: (chooseImageRes) => {
+			
+          const filePath = chooseImageRes.tempFilePaths[0]; // 获取选择的图片路径
+
+					        // 上传文件到后端服务器中
+							uni.uploadFile({
+							 header: {
+									'Authorization': this.token
+									},
+							  url: app.globalData.fit_journey_ai_address+`/ai/recipe`, // 服务器接口地址
+							  filePath: filePath,
+							  name: 'file', // 后端接收的文件参数名称
+							  success: (uploadFileRes) => {
+
+
+
+                  uni.showToast({
+                    title: 'AI正在识别中呢~',
+                    icon: 'loading',
+                    duration: 2000
+                  });
+
+
+
+
+								console.log('上传结果:', uploadFileRes);
+								const response = JSON.parse(uploadFileRes.data); // 解析返回的数据
+								if (response && response.data) {
+								  // 处理返回的数据
+								  this.calorie = response.data.calorie || 0;
+								  this.name = response.data.name || '识别失败，请重新上传图片';
+                  uni.showToast({
+                    title: '恭喜您，AI识别成功啦~',
+                    icon: 'none',
+                    duration :2000,//设置显示时间为2秒
+                  });
+								} else {
+
+
+								  uni.showToast({
+									title: '识别失败，请重新上传图片',
+									icon: 'none',
+								  });
+								}
+							  },
+							  fail: () => {
+								uni.showToast({
+								  title: '图片上传失败',
+								  icon: 'none',
+								});
+							  },
+							});
+        },
+        fail: () => {
+          uni.showToast({
+            title: '图片选择失败',
+            icon: 'none',
+          });
+        },
+      });
+    }
+
+  },
+};
+</script>
+
+<style lang="scss">
+@import "@/static/homepages/homes/ai_recognize_hot/css/ai_recongnize_hot.scss";
+</style>

pages/homepages/homes/ai_recognize_plan/ai_recognize_plan.vue

@@ -0,0 +1,198 @@
+<template>
+	<view>
+		<image class="background" src="@/static/homepages/homes/ai_recognize_plan/pictures/background.png"></image>
+		<image class="back_button" @click="go_back_to_home" src="@/static/homepages/homes/ai_recognize_plan/pictures/button.png"></image>
+		<image v-if="planImage" class="plan-image" :src="planImage"></image>
+		<image class="generate_button" @click="generate()" src="@/static/homepages/homes/ai_recognize_plan/pictures/generate.png"></image>
+	</view>
+
+  <!--   生成成功的弹窗 -->
+  <view class="create_fail" v-if="is_create_success===1">
+    <text class="ai_create_text">AI生成的结果是</text>
+    <view class="result_area">
+      <text class="result">{{ result }}</text>
+    </view>
+    <image class="go_back" @click="go_back" src="@/static/homepages/homes/ai_recognize_recipe/pictures/go_back_button.png"></image>
+  </view>
+
+
+
+
+
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				planImage: null ,// 用于存储图片的本地路径
+        is_create_success : -1,//-1表示显示 正数表示显示
+        token: uni.getStorageSync("access_token"),
+        result:""
+			};
+		},
+		methods: {
+      go_back_to_home() {
+        uni.navigateTo({
+          url: '/pages/homepages/homes/home/home'
+        });
+      },
+      generate() {
+        uni.showToast({
+          title: '正在生成...',
+          icon: 'loading',
+          duration: 15000, // Toast 显示时间为 2 秒
+        });
+        //向后端发送请求生成结果
+        const app= getApp();
+        uni.request({
+          url: app.globalData.fit_journey_ai_address + '/exercise_plan/ai/recipe/generate',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization':this.token
+          },
+          data: {
+          },
+          success: (res) => {
+            if(res.data.code===200){
+              console.log("请求成功！请求数据是", res);
+              this.result = res.data.data;
+            }else {
+              uni.showToast({
+                title:"AI生成失败",
+                icon: 'none',
+                duration: 2000
+              })
+              this.result = res.data.msg;
+            }
+
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+        //延迟显示结果
+        setTimeout(() => {
+          this.is_create_success = 1;
+        }, 15000);
+      },
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+      go_back(){
+        this.is_create_success = -1;
+
+      }
+
+		}
+	}
+</script>
+
+<style lang="scss">
+.background {
+  position: absolute;
+  width: 102%;
+  height: 102%;
+
+  left: -1%;
+}
+.back_button {
+  position: absolute;
+  width: 3%;
+  height: 3%;
+  top: 4%;
+  left: 7%;
+}
+.generate_button {
+  position: absolute;
+  width: 90%;
+  height: 12%;
+  top: 87%;
+  left: 5%;
+}
+.plan-image {
+  position: absolute;
+  width: 80%; // 根据实际需要调整宽度
+  height: auto; // 高度自适应
+  top: 50%; // 根据实际需要调整垂直位置
+  left: 50%; // 水平居中
+  transform: translate(-50%, -50%); // 使用transform进行居中
+  z-index: 10; // 确保图片显示在最顶层
+}
+
+.create_fail{
+  position: absolute;
+  height: 80%;
+  width: 90%;
+  top: 7%;
+  left: 5%;
+  border-radius: 20px;
+  background-color: #b694d1;
+  z-index: 1;
+  .ai_create_text{
+    position: absolute;
+    width: 100%;
+    height: 10%;
+    top: 5%;
+    left: 0;
+    font-weight: bold;
+    font-size: 20px;
+    text-align: center;
+    color: #ffffff;
+  }
+  .go_back{
+    position: absolute;
+    width: 80%;
+    height: 13%;
+    top: 88.5%;
+    left: 10%;
+  }
+  .result_area{
+    position: absolute;
+    width: 80%;
+    height: 75%;
+    top: 12%;
+    left: 10%;
+    border-radius: 20px;
+    background-color: #cec1e4;
+    color: #000000;
+    .result{
+      position: relative;
+      left: 2%;
+      font-size: 16px; /* 设置文字大小 */
+      font-weight: bold; /* 文字加粗 */
+      line-height: 1.5; /* 行间距 */
+      padding: 10px; /* 添加内边距，使文字不贴边 */
+      word-break: break-word; /* 长单词换行 */
+    }
+  }
+}
+
+
+</style>

pages/homepages/homes/ai_recognize_recipe/ai_recognize_recipe.vue

@@ -0,0 +1,226 @@
+<template>
+	<view>
+		<image class="background" src="/static/homepages/homes/ai_recognize_recipe/pictures/background.png"></image>
+		<image class="back_button"  @click="go_back_to_home" src="/static/homepages/homes/ai_recognize_recipe/pictures/button.png" ></image>
+		<image v-if="recipeImage" class="recipe-image" :src="recipeImage"></image>
+		<image class="generate_button" @click="generate" src="/static/homepages/homes/ai_recognize_recipe/pictures/generate.png"></image>
+
+
+<!--
+
+    &lt;!&ndash;   生成成功的弹窗 &ndash;&gt;
+    <view class="create_success" v-if="is_create_success===true">
+      <text class="ai_create_text">AI生成的结果是</text>
+      &lt;!&ndash;    取消弹窗的按钮  &ndash;&gt;
+      <image class="go_back" src="@/static/homepages/homes/ai_recognize_recipe/pictures/go_back_button.png"></image>
+      <view class="result" v-text="result"></view>
+    </view>
+-->
+
+
+
+
+
+    <!--   生成成功的弹窗 -->
+    <view class="create_fail" v-if="is_create_success===0">
+      <text class="ai_create_text">AI生成的结果是</text>
+      <view class="result_area">
+      <text class="result">{{ result }}</text>
+      </view>
+      <image class="go_back" @click="go_back" src="@/static/homepages/homes/ai_recognize_recipe/pictures/go_back_button.png"></image>
+    </view>
+
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+        is_create_success: -1,//0是失败，1是成功，-1是什么都没有
+
+        can_generate_button_click: true, // 控制生成按钮是否可点击
+				recipeImage: null, // 用于存储图片的本地路径
+        result: '对不起，AI生成有点慢哦，请耐心等待~',
+        token:uni.getStorageSync("access_token"),
+			};
+		},
+		methods: {
+      go_back_to_home() {
+        uni.navigateTo({
+          url: '/pages/homepages/homes/home/home'
+        });
+      },
+      generate() {
+        uni.showToast({
+          title: '正在生成...',
+          icon: 'loading',
+          duration: 15000, // Toast 显示时间为 2 秒
+        });
+        //向后端发送请求生成结果
+        const app= getApp();
+        uni.request({
+          url: app.globalData.fit_journey_ai_address + '/ai/recipe/generate',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization':this.token
+          },
+          data: {
+          },
+          success: (res) => {
+            if(res.data.code===200){
+              console.log("请求成功！请求数据是", res);
+              this.result = res.data.data;
+            }else {
+             uni.showToast({
+               title:"AI生成失败",
+               icon: 'none',
+               duration: 2000
+             })
+              this.result = res.data.msg;
+            }
+
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+        //延迟显示结果
+        setTimeout(() => {
+          this.can_generate_button_click= false;
+          this.is_create_success = 0;
+        }, 20000);
+       /* //在20秒的时候清空result
+        setTimeout(() => {
+        this.result="";
+        }, 20000);*/
+      },
+
+      go_back(){
+        this.is_create_success = -1;
+        this.can_generate_button_click=true;
+      }
+
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+.background {
+  position: absolute;
+  width: 102%;
+  height: 102%;
+  top: 0;
+  left: -1%;
+  z-index: -1;
+}
+.back_button {
+  position: absolute;
+  width: 3%;
+  height: 3%;
+  top: 4%;
+  left: 7%;
+}
+.generate_button {
+  position: absolute;
+  width: 90%;
+  height: 12%;
+  top: 87%;
+  left: 5%;
+}
+
+.create_fail{
+  position: absolute;
+  height: 80%;
+  width: 90%;
+  top: 7%;
+  left: 5%;
+  border-radius: 20px;
+  background-color: #92a9c6;
+  z-index: 1;
+  .ai_create_text{
+    position: absolute;
+    width: 100%;
+    height: 10%;
+    top: 5%;
+    left: 0;
+    font-weight: bold;
+    font-size: 20px;
+    text-align: center;
+    color: #ffffff;
+  }
+  .go_back{
+    position: absolute;
+    width: 80%;
+    height: 13%;
+    top: 88.5%;
+    left: 10%;
+  }
+  .result_area{
+    position: absolute;
+    width: 80%;
+    height: 75%;
+    top: 12%;
+    left: 10%;
+    border-radius: 20px;
+    background-color: #e4dfdf;
+    color: #000000;
+    .result{
+      position: relative;
+      left: 2%;
+      font-size: 16px; /* 设置文字大小 */
+      font-weight: bold; /* 文字加粗 */
+      line-height: 1.5; /* 行间距 */
+      padding: 10px; /* 添加内边距，使文字不贴边 */
+      word-break: break-word; /* 长单词换行 */
+    }
+  }
+}
+
+
+/*
+
+
+
+
+.create_success{
+  position: absolute;
+  height: 80%;
+  width: 80%;
+  top: 10%;
+  left: 10%;
+  border-radius: 20px;
+  background-color: #2C405A;
+  z-index: 10;
+  border: 2px solid #ffffff;
+  !* .go_back{
+     position: absolute;
+     width: 10%;
+     height: 10%;
+     top: 5%;
+     left: 85%;
+   }
+   .ai_create_text{
+     z-index: 100;
+   color: #ffffff;
+   }*!
+
+
+}
+
+*/
+
+
+
+
+.recipe-image {
+  position: absolute;
+  width: 80%; // 根据实际需要调整宽度
+  height: auto; // 高度自适应
+  top: 50%; // 根据实际需要调整垂直位置
+  left: 50%; // 水平居中
+  transform: translate(-50%, -50%); // 使用transform进行居中
+  z-index: 10; // 确保图片显示在最顶层
+}
+</style>

pages/homepages/homes/choice_book/choice_book.vue

@@ -0,0 +1,123 @@
+<template>
+  <view class="background">
+    <image class="go_back_button" @click="go_back" src="@/static/homepages/homes/knowledge_dictionary/pictures/go_back_button.png" ></image>
+    <image class="search_area"  src="@/static/homepages/homes/choice_book/pictures/search_area.png"></image>
+    <input 
+      class="input_area"
+      v-model="searchText"
+      placeholder="请输入搜索内容"
+      placeholder-style="color: #999999;"
+      @input="onSearch"
+    ></input>
+    <image class="book" src="@/static/homepages/homes/choice_book/pictures/book.png"></image>
+    <image class="book1" src="@/static/homepages/homes/choice_book/pictures/book1.png"></image>
+    <image class="book2" src="@/static/homepages/homes/choice_book/pictures/book2.png"></image>
+    <image class="book3" src="@/static/homepages/homes/choice_book/pictures/book3.png"></image>
+    <image class="book4" src="@/static/homepages/homes/choice_book/pictures/book4.png"></image>
+
+
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      token: uni.getStorageSync("access_token"),
+      searchText: ''
+    };
+  },
+  methods:{
+    go_back(){
+    uni.navigateTo({
+        url: '/pages/homepages/homes/home/home'
+      })
+      uni.showToast({
+        title: '正在返回主页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    onSearch() {
+      console.log('搜索内容：', this.searchText)
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  background: #98AED1;
+}
+.go_back_button{
+  position: absolute;
+  height: 8%;
+  width: 15%;
+  top: 5%;
+  left: 5%;
+}
+.book{
+  position: absolute;
+  height: 50%;
+  width: 90%;
+  top: 45%;
+  left: 5%;
+}
+.book1{
+  position: absolute;
+  height: 18%;
+  width: 30%;
+  top: 55%;
+  left: 10%;
+
+
+}
+.book2{
+  position: absolute;
+  height: 18%;
+  width: 30%;
+  top: 55%;
+  left: 59%;
+
+}
+.book3{
+  position: absolute;
+  height: 18%;
+  width: 30%;
+  left: 10%;
+  top: 76%;
+
+}
+.book4{
+  position: absolute;
+  height: 18%;
+  width: 30%;
+  left: 59%;
+  top: 76%;
+
+}
+.search_area{
+  position: absolute;
+  height: 20%;
+  width: 90%;
+  top: 15%;
+  left: 5%;
+}
+.input_area{
+  position: absolute;
+  height: 8%;
+  width: 70%;
+  left: 21%;
+  top: 27%;
+  background: transparent;
+  padding: 0 20rpx;
+  font-size: 32rpx;
+  color: #333;
+  z-index: 2;
+}
+
+
+</style>

pages/homepages/homes/dictionary/apple/apple.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/apple.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/avocado/avocado.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/avocado.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/banana/banana.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/banana.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/bread/bread.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Bread.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/broccoli/broccoli.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/broccoli.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/carrot/carrot.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/carrot.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/corn/corn.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/corn.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/eggplant/eggplant.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/eggplant.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/fried_egg/fried_egg.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Fried Egg.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/garlic/garlic.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/garlic.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/grape/grape.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Grape.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/kiwi_fruit/kiwi_fruit.vue

@@ -0,0 +1,32 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Kiwi fruit.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>
+

pages/homepages/homes/dictionary/lemon/lemon.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/lemon.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/loquat/loquat.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/loquat.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/mango/mango.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Mango.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/mushroom/mushroom.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/mushroom.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/orange/orange.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/orange.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/papaya/papaya.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/papaya.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/pear/pear.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/pear.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/pepper/pepper.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/pepper.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/pineapple/pineapple.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Pineapple.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/pizza/pizza.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Pizza.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/pulled_noodles/pulled_noodles.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Pulled noodles.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/radish/radish.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/radish.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/strawberry/strawberry.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/Strawberry.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/dictionary/watermelon/watermelon.vue

@@ -0,0 +1,31 @@
+<template>
+	<view >
+		<image  class="background_dictionary"  src="/static/homepages/homes/dictionary/pictures/watermelon.png" ></image>
+		<image class="button_dictionary"   src="/static/homepages/homes/dictionary/pictures/button.png" ></image>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			};
+		}
+	}
+</script>
+<style lang="scss">
+.background_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%; /* 水平居中 */
+}
+.button_dictionary{
+	position: absolute; /* 绝对定位 */
+	width: 3%;
+	height: 3%;
+	top: 7%;
+	left: 7%; /* 水平居中 */
+}
+</style>

pages/homepages/homes/home/home.vue

@@ -0,0 +1,136 @@
+<template>
+  <view class="background">
+    <image class="home_text" src="@/static/homepages/homes/home/pictures/home_text.png">首页</image>
+    <!--轮播图   -->
+    <swiper :autoplay="true" interval="3000" duration="500" class="swiper"  :current="current" circular="true" @change="onSwiperChange">
+      <swiper-item>
+      <image class="swiper_item_background"  src="@/static/components/swiper/puppy_chat/background.png"></image>
+      <image class="puppy_chat_button" @click="go_to_puppy_chat" src="@/static/components/swiper/puppy_chat/button.png"></image>
+      </swiper-item>
+      <swiper-item>
+        <image class="swiper_item_background"  src="@/static/components/swiper/community/background.png"></image>
+        <image class="puppy_chat_button" @click="go_to_community" src="@/static/components/swiper/puppy_chat/button.png"></image>
+      </swiper-item>
+      <swiper-item>
+        <image class="swiper_item_background"  src="@/static/components/swiper/read/background.png"></image>
+        <image class="puppy_chat_button" @click="go_to_read" src="@/static/components/swiper/puppy_chat/button.png"></image>
+      </swiper-item>
+      <swiper-item>
+        <image class="swiper_item_background"  src="@/static/components/swiper/exercise/background.png"></image>
+        <image class="exercise_button" @click="go_to_exercise" src="@/static/components/swiper/puppy_chat/button.png"></image>
+      </swiper-item>
+    </swiper>
+    <!-- 动态切换的轮播点 -->
+    <image :src="dotImages[current]" class="swipe_dot"></image>
+    <!--横线显示效果   -->
+    <image class="line" src="@/static/homepages/homes/home/pictures/line.png"></image>
+    <!--饮食专区文字   -->
+    <image class="recipe_area_word" src="@/static/homepages/homes/home/pictures/recipe_area.png"></image>
+    <!--饮食专区    -->
+    <view class="recipe_area">
+      <ai_recongize_recipe  class="ai_recognize_recipe"></ai_recongize_recipe>
+      <ai_recongize_hot class="ai_recognize_hot"></ai_recongize_hot>
+      <ai_recongize_fruit  class="ai_recognize_fruit"></ai_recongize_fruit>
+      <my_recipe_plan  class="my_recipe_plan"></my_recipe_plan>
+    </view>
+    <!--运动专区文字   -->
+    <image class="sport_text" src="@/static/homepages/homes/home/pictures/sport_text.png"></image>
+    <view class="sport_area">
+      <ai_recongize_plan class="ai_recognize_plan"></ai_recongize_plan>
+      <my_exercise_plan   class="my_exercise_plan"></my_exercise_plan>
+    </view>
+    <!--阅读专区文字   -->
+    <image class="read_text" src="@/static/homepages/homes/home/pictures/read_text.png"></image>
+    <view class="read_area">
+      <!--      知识图谱-->
+      <image class="dictionary_background" src="@/static/components/dictionary/pictures/background.png"></image>
+       <image class="dictionary_button" @click="go_to_knowledge_dictionary" src="@/static/components/dictionary/pictures/button.png"></image>
+      <!--      书籍阅读-->
+      <image class="read_background" src="@/static/components/read/pictures/background.png"></image>
+      <image class="read_button" @click="go_to_choice_book" src="/static/components/read/pictures/button.png"></image>
+    </view>
+    <!--空白区域   -->
+    <view class="block_area"></view>
+    <!--底部菜单栏 -->
+    <tarbar_home ></tarbar_home>
+  </view>
+</template>
+<script>
+import Puppy_chat from "@/components/swiper/puppy_chat.vue";
+import Read_center from "@/components/swiper/read_center.vue";
+import Exercise from "@/components/swiper/exercise.vue";
+import Community from "@/components/swiper/community.vue";
+import tarbar_home from "@/components/tarbar_home/tarbar_home.vue";
+export default {
+  components: {Community, Exercise, Read_center, Puppy_chat},
+  data() {
+    return {
+      current:0,
+      dotImages: [
+        '/static/homepages/homes/home/pictures/dot1.png',
+        '/static/homepages/homes/home/pictures/dot2.png',
+        '/static/homepages/homes/home/pictures/dot3.png',
+        '/static/homepages/homes/home/pictures/dot4.png',
+      ], // 轮播点图片
+	};
+  },
+  methods:{
+    go_to_exercise(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/my_exercise_plan/my_exercise_plan'
+      });
+      uni.showToast({
+        title: '跳转成功',
+      })
+    },
+    go_to_read(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/choice_book/choice_book'
+      });
+      uni.showToast({
+        title: '跳转成功',
+      })
+    },
+
+    go_to_community(){
+      uni.navigateTo({
+        url: '/pages/homepages/community/community/community'
+      });
+      uni.showToast({
+        title: '跳转成功',
+      })
+    },
+    go_to_puppy_chat(){
+      uni.navigateTo({
+        url: '/pages/homepages/puppy_chat/puppy_chat'
+      });
+      uni.showToast({
+        title: '跳转成功',
+      })
+    },
+
+    go_to_choice_book(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/choice_book/choice_book'
+      });
+      uni.showToast({
+        title: '跳转成功',
+      })
+    },
+    go_to_knowledge_dictionary(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/knowledge_dictionary/knowledge_dictionary'
+      });
+      uni.showToast({
+        title: '跳转成功',
+      })
+    },
+    onSwiperChange(e){
+      this.current = e.detail.current;
+    }
+  }
+}
+</script>
+<style lang="scss">
+@import "@/static/homepages/homes/home/css/home.scss";
+</style>

pages/homepages/homes/knowledge_dictionary/knowledge_dictionary.vue

@@ -0,0 +1,189 @@
+<template>
+  <view class="background">
+    <image class="go_back_button" @click="go_back" src="@/static/homepages/homes/knowledge_dictionary/pictures/go_back_button.png" ></image>
+    <input> </input>
+    <image class="search_button" @click="search" src="@/static/homepages/homes/knowledge_dictionary/pictures/search_button.png"></image>
+
+
+    <image class="strawberry_image" @click="go_to_strawberry" src="@/static/homepages/homes/knowledge_dictionary/pictures/strawberry.png"></image>
+    <image class="peach_image" @click="go_to_peach"  src="@/static/homepages/homes/knowledge_dictionary/pictures/peach.png"></image>
+    <image class="carrot_image" @click="go_to_carrot"   src="@/static/homepages/homes/knowledge_dictionary/pictures/carrot.png"></image>
+    <image class="pineapple_image"   @click="go_to_pineapple"  src="@/static/homepages/homes/knowledge_dictionary/pictures/pineapple.png"></image>
+    <image class="orange_image"  @click="go_to_orange"  src="@/static/homepages/homes/knowledge_dictionary/pictures/orange.png"></image>
+    <image class="banana_image"   @click="go_to_banana"   src="@/static/homepages/homes/knowledge_dictionary/pictures/banana.png"></image>
+
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      url :""//用传递后端的url
+    };
+  },
+  methods:{
+    search(){
+
+      //和后端对接进行搜索 后端返回跳转界面的URL
+      uni.showToast({
+        title: '搜索成功！',
+        icon: 'none',
+        duration: 2000
+      })
+       uni.showToast({
+         title: '搜索失败，知识库知识有限哦~',
+         icon: 'none',
+         duration: 2000
+       })
+
+
+
+    },
+    go_back(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/home/home'
+      })
+      uni.showToast({
+        title: '正在返回主页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    go_to_strawberry(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/dictionary/strawberry/strawberry'
+      })
+      uni.showToast({
+        title: '正在前往草莓知识页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    go_to_peach(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/dictionary/pear/pear'
+      })
+      uni.showToast({
+        title: '正在前往桃子知识页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    go_to_carrot(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/dictionary/carrot/carrot'
+      })
+      uni.showToast({
+        title: '正在前往胡萝卜知识页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    go_to_pineapple(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/dictionary/pineapple/pineapple'
+      })
+      uni.showToast({
+        title: '正在前往菠萝知识页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    go_to_orange(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/dictionary/orange/orange'
+      })
+      uni.showToast({
+        title: '正在前往橙子知识页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+    go_to_banana(){
+      uni.navigateTo({
+        url: '/pages/homepages/homes/dictionary/banana/banana'
+      })
+      uni.showToast({
+        title: '正在前往香蕉知识页面',
+        icon: 'none',
+        duration: 2000
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+  background-image: url("@/static/homepages/homes/knowledge_dictionary/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 101vh;
+  display: flex;
+  flex-direction: column; /* 纵向排列 */
+  align-items: center; /* 水平居中 */
+  justify-content: flex-end; /* 使内容向底部对齐 */
+  position: relative;
+}
+.go_back_button{
+  position: absolute;
+  height: 8%;
+  width: 15%;
+  top: 5%;
+  left: 5%;
+}
+.search_button{
+  position: absolute;
+  height: 5%;
+  width: 10%;
+  top: 43.5%;
+  left: 83%;
+}
+
+.strawberry_image{
+  position: absolute;
+  height: 15%;
+  width: 30%;
+  top: 60%;
+  left: 2%;
+}
+
+.peach_image{
+  position: absolute;
+  height: 15%;
+  width: 30%;
+  top: 60%;
+  left: 34%;
+}
+.carrot_image{
+  position: absolute;
+  height: 15%;
+  width: 30%;
+  top: 60%;
+  left: 67%;
+}
+.pineapple_image{
+  position: absolute;
+  height: 15%;
+  width: 30%;
+  top: 78%;
+  left: 1%;
+}
+
+.orange_image{
+  position: absolute;
+  height: 15%;
+  width: 30%;
+  top: 78%;
+  left: 34%;
+}
+
+.banana_image{
+  position: absolute;
+  height: 15%;
+  width: 30%;
+  top: 78%;
+  left: 67%;
+}
+</style>

pages/homepages/homes/my_recipe_plan/my_recipe_plan.vue

@@ -0,0 +1,287 @@
+<template>
+  <view class="recipe-plan">
+    <image class="go_back_button" @click="go_back_to_home" src="@/static/homepages/homes/my_recipe_plan/pictures/button.png"></image>
+    <view class="date">{{ currentDate }}</view>
+    <text class ="today_recipe_and_calories">今日饮食和热量</text>
+    <view class="divider_line"></view>
+    <image class="time_line" src="@/static/homepages/homes/my_recipe_plan/pictures/time_line.png"></image>
+    <view class="input_box_breakfast">
+      <input
+          v-model="meals[0].food"
+          class="food_input"
+          placeholder="请输入食物名称"
+          @input="calculateCalories(0)"
+      />
+      <view class="calories_text">
+        <text class="icon">⏱</text>
+        <text>热量：{{ meals[0].calories }}J</text>
+      </view>
+      <view
+          class="check_button"
+          :class="{ active: meals[0].checked }"
+          @click="toggleCheck(0)"
+      >✓</view>
+    </view>
+
+    <view class="input_box_lunch">
+      <input
+          v-model="meals[1].food"
+          class="food_input"
+          placeholder="请输入食物名称"
+          @input="calculateCalories(1)"
+      />
+      <view class="calories_text">
+        <text class="icon">⏱</text>
+        <text>热量：{{ meals[1].calories }}J</text>
+      </view>
+      <view
+          class="check_button"
+          :class="{ active: meals[1].checked }"
+          @click="toggleCheck(1)"
+      >✓</view>
+    </view>
+
+    <view class="input_box_dinner">
+      <input
+          v-model="meals[2].food"
+          class="food_input"
+          placeholder="请输入食物名称"
+          @input="calculateCalories(2)"
+      />
+      <view class="calories_text">
+        <text class="icon">⏱</text>
+        <text>热量：{{ meals[2].calories }}J</text>
+      </view>
+      <view
+          class="check_button"
+          :class="{ active: meals[2].checked }"
+          @click="toggleCheck(2)"
+      >✓</view>
+    </view>
+
+    <view class="input_box_midnight_snack">
+      <input
+          v-model="meals[3].food"
+          class="food_input"
+          placeholder="请输入食物名称"
+          @input="calculateCalories(3)"
+      />
+      <view class="calories_text">
+        <text class="icon">⏱</text>
+        <text>热量：{{ meals[3].calories }}J</text>
+      </view>
+      <view
+          class="check_button"
+          :class="{ active: meals[3].checked }"
+          @click="toggleCheck(3)"
+      >✓</view>
+    </view>
+  </view>
+</template>
+
+<script>
+
+import { getFoodCalories } from '@/static/homepages/homes/my_recipe_plan/js/database.js'
+export default {
+  data() {
+    return {
+      meals: [
+        { time: '早餐', food: '', calories: 0, dotColor: 'yellow', checked: false },
+        { time: '午餐', food: '', calories: 0, dotColor: 'yellow', checked: false },
+        { time: '晚餐', food: '', calories: 0, dotColor: 'red', checked: false },
+        { time: '夜宵', food: '', calories: 0, dotColor: 'blue', checked: false }
+      ]
+    }
+  },
+  computed: {
+    currentDate() {
+      const date = new Date()
+      return `${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日`
+    }
+  },
+  methods: {
+    go_back_to_home(){
+      uni.navigateTo({
+        url:"/pages/homepages/homes/home/home"
+      })
+    },
+    calculateCalories(index) {
+      // 如果输入为空，不进行计算
+      if (!this.meals[index].food.trim()) {
+        return
+      }
+
+      // 设置loading状态
+      this.meals[index].loading = true
+      this.meals[index].calories = 0
+
+      // 延迟2秒显示结果
+      setTimeout(() => {
+        const calories = getFoodCalories(this.meals[index].food)
+        if (calories) {
+          uni.showToast({
+            title: '计算食物卡路里成功！！',
+            icon: 'none',
+            duration: 2000
+          })
+          this.meals[index].calories = calories
+          this.meals[index].recordTime = this.getCurrentTime()
+          this.saveMealsData()
+
+        } else {
+          uni.showToast({
+            title: '未找到该食物的卡路里信息',
+            icon: 'none',
+            duration: 2000
+          })
+        }
+        this.meals[index].loading = false
+      }, 2000)
+    },
+    toggleCheck(index) {
+      this.meals[index].checked = !this.meals[index].checked
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.recipe-plan {
+  position: relative;
+  width: 100%;
+  height: 100vh;
+  background-color: #B6D1E0;
+  .go_back_button{
+    position:absolute;
+    width: 20%;
+    height: 8%;
+    left: 2%;
+    top: 3%;
+
+  }
+  .date {
+    position: absolute;
+    width: 50%;
+    height: 2%;
+    left: 6%;
+    top: 11%;
+    font-size: 1.4em;        // 加大字体
+    font-weight: 700;        // 加粗字体
+    display: flex;           // 使用flex布局来居中文字
+    align-items: center;     // 垂直居中
+    justify-content: center; // 水平居中
+    padding: 2% 0;
+  }
+  .today_recipe_and_calories{
+    position: absolute;
+    width: 75%;
+    height: 4%;
+    left: 6%;
+    top: 16%;
+    font-size: 2.5em;        // 加大字体
+    font-weight: 700;        // 加粗字体
+    display: flex;           // 使用flex布局来居中文字
+    align-items: center;     // 垂直居中
+    justify-content: center; // 水平居中
+    padding: 2% 0;
+  }
+  .divider_line {
+    position: absolute;
+    width: 88%;  // 线的宽度
+    height: 2px; // 线的高度
+    background-color: #0c0b0b;
+    left: 6%;
+    top: 24%;    // 位置在today_recipe_and_calories下方
+  }
+  .time_line{
+    position: absolute;
+    width: 15%;
+    height: 61%;
+    top: 27%;
+    left: 5%;
+  }
+  .input_box_breakfast{
+    position: absolute;
+    width: 70%;
+    height: 15%;
+    top: 27%;
+    left: 25%;
+    background-color: #ffffff;
+    border-radius: 30px;
+
+  }
+  .input_box_lunch{
+    position: absolute;
+    width: 70%;
+    height: 15%;
+    top: 45%;
+    left: 25%;
+    background-color: #ffffff;
+    border-radius: 30px;
+  }
+  .input_box_dinner{
+    position: absolute;
+    width: 70%;
+    height: 15%;
+    top: 63%;
+    left: 25%;
+    background-color: #ffffff;
+    border-radius: 30px;
+  }
+  .input_box_midnight_snack{
+    position: absolute;
+    width: 70%;
+    height: 15%;
+    top: 81%;
+    left: 25%;
+    background-color: #ffffff;
+    border-radius: 30px;
+
+  }
+
+  .input_box_breakfast,
+  .input_box_lunch,
+  .input_box_dinner,
+  .input_box_midnight_snack {
+    .food_input {
+      position: absolute;
+      left: 5%;
+      top: 20%;
+      width: 70%;
+      height: 30%;
+      border: none;
+      font-size: 1.2em;
+    }
+
+    .calories_text {
+      position: absolute;
+      left: 5%;
+      bottom: 20%;
+      color: #666;
+      font-size: 1em;
+
+      .icon {
+        margin-right: 8px;
+      }
+    }
+
+    .check_button {
+      position: absolute;
+      right: 5%;
+      top: 30%;
+      width: 30px;
+      height: 30px;
+      border-radius: 50%;
+      background-color: #e0e0e0;
+      color: white;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      transition: background-color 0.3s;
+      &.active {
+        background-color: #4285f4;  // 激活时变成蓝色
+      }
+    }
+  }
+}
+</style>

pages/homepages/main/main.vue

@@ -1,17 +0,0 @@
-<template>
-  <view>
-
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {};
-  }
-}
-</script>
-
-<style lang="scss">
-
-</style>

pages/homepages/puppy_chat/puppy_chat.vue

@@ -1,17 +1,192 @@
 <template>
-  <view>
+  <!-- 背景图片-->
+  <image class="background" src="@/static/homepages/puppy_chat/pictures/chat_image.png"></image>
+  <scroll-view scroll-y="true" id="chat_scroll" :scroll-top="scrollTop" scroll-with-animation="true">
+    <view class="chat">
+      <!-- 渲染聊天消息气泡 -->
+      <view v-for="(message, index) in send_messages" :key="index" :class="['chat_area', message.sender === 'user' ? 'user_message' : 'ai_message']">
+        <!-- 头像部分（放在气泡外部） -->
+        <view v-if="message.sender === 'ai'" class="avatar_container ai_avatar_container">
+          <image class="ai_avatar" src="@/static/homepages/puppy_chat/pictures/ai_avatar.png"></image>
+        </view>
 
+        <!-- 消息内容 -->
+        <view :class="['message_content', message.sender === 'user' ? 'user_message_content' : 'ai_message_content']">
+          <!-- <text>{{ message.message }}</text> -->
+          <zero-markdown-view :markdown="message.message"></zero-markdown-view>
+        </view>
+
+        <view v-if="message.sender === 'user'" class="avatar_container user_avatar_container">
+          <image class="user_avatar" src="@/static/homepages/puppy_chat/pictures/user_avatar.png"></image>
+        </view>
+      </view>
+    </view>
+  </scroll-view>
+
+
+
+
+  <!-- 输入框部分 -->
+  <view class="input_box">
+    <image class="input_box_background" src="@/static/homepages/puppy_chat/pictures/input_box_background.png"></image>
+    <image class="send_button" src="@/static/homepages/puppy_chat/pictures/send_button.png" @click="handleSendMessage"></image>
+    <input class="input_words" type="text" placeholder="fit journey-Ai能回答你任何问题" v-model="input_message"></input>
   </view>
+
+  <!-- 底部菜单栏部分 -->
+  <tarbar_puppy_chat></tarbar_puppy_chat>
 </template>
 
 <script>
 export default {
   data() {
-    return {};
+    return {
+      token:uni.getStorageSync("access_token"),
+      input_message: '',
+      send_message:'',
+      send_messages: [],  // 存储消息的数组
+      conversation_id: 'e97ec0f2-2a94-42e7-b6db-b04883d349e8',//默认的聊天回话id
+      answer: '',  // AI的回答
+      scrollTop : 0,	//滚动的高度
+      totalHeight:0,
+      scrollViewHeight:0,
+    };
+  },
+  onLoad() {
+    //向后端获取conversation_id
+    const app = getApp();
+    console.log(app.globalData.token);
+    console.log(app.globalData.fit_journey_ai_address);
+
+    // 向后端发送请求
+    uni.request({
+      url: app.globalData.fit_journey_ai_address + '/ai/create-conversation',
+      method: 'POST',
+      header: {
+        'content-type': 'application/x-www-form-urlencoded',
+        'Authorization': this.token
+      },
+      data: {
+
+      },
+      success: (res) => {
+        console.log("请求成功！请求数据是", res);
+        this.conversation_id= res.data.data.conversation_id;
+      },
+      error: (res) => {
+        console.log("请求失败！请求数据是", res);
+      }
+    });
+    this.send_messages.push({
+      sender: 'ai',  // 标记为用户消息
+      message:"我是fit journey的专属AI小助手，有什么问题都可以问我哦~"
+    });
+  },
+
+  mounted() {
+    //获取滚动区域的大小
+    const that = this
+    const query = uni.createSelectorQuery().in(that)
+    query.select('#chat_scroll').boundingClientRect()
+    query.exec((res)=>{
+      that.scrollViewHeight = res[0].height
+    })
+  },
+
+  methods: {
+    setScrollTop(){
+      //设置滚动高度，滚动到新的回答
+      setTimeout(()=>{	//防止元素还没有渲染
+        const that = this
+        const query = uni.createSelectorQuery().in(that)
+        query.selectAll('.chat_area').boundingClientRect()
+        query.exec((res)=>{
+          res[0].forEach((item)=>{
+            that.totalHeight = that.totalHeight+item.height
+          })
+          if (that.totalHeight > that.scrollViewHeight) { //判断子元素高度是否大于显示高度
+            that.scrollTop = that.totalHeight - that.scrollViewHeight
+          }
+        })
+      },100)
+    },
+    handleSendMessage() {
+      // 获取发送消息的用户的消息数量
+      const userMessageCount = this.send_messages.filter(msg => msg.sender === 'user').length;
+
+      if (userMessageCount >= 1) {
+        // 如果用户已经发送了2条消息，提示用户不能再发送
+        uni.showToast({
+          title: "AI 可是要交钱的哦,最多发送1条消息,刷新之后再试试吧~",
+          icon: "none",
+        });
+      } else {
+        // 如果用户未发送2条消息，继续发送
+        if (this.input_message.trim() !== "") {
+          // 用户发送的消息
+          this.send_messages.push({
+            sender: 'user',  // 标记为用户消息
+            message: this.input_message
+          });
+          this.send_messages.push({
+            sender: 'ai',  // 标记为用户消息
+            message: "正在分析您的问题，等待puppy一会呢"
+          });
+
+          this.send_message=this.input_message;
+          this.input_message = "";  // 清空输入框
+
+          this.setScrollTop() //滚动条滚动
+
+          // 模拟向后端请求AI回答
+          this.fetchAIResponse();
+        } else {
+          // 如果输入为空，提示用户
+          uni.showToast({
+            title: "请输入内容后发送",
+            icon: "none",
+          });
+        }
+      }
+    },
+    fetchAIResponse() {
+      const app = getApp();
+      console.log(app.globalData.token);
+      console.log(app.globalData.fit_journey_ai_address);
+      // 向后端发送请求
+      uni.request({
+        url: app.globalData.fit_journey_ai_address + '/ai/chat-with-no-stream',//TODO:后期这里改成服务器地址！
+        method: 'POST',
+        header: {
+          'content-type': 'application/x-www-form-urlencoded',
+          'Authorization': this.token
+        },
+        data: {
+          conversationId: this.conversation_id,
+          ask: this.send_message,
+        },
+        success: (res) => {
+
+          // console.log("请求成功！请求数据是", res.data.data);
+          //这里请求数据成功！
+          this.answer = res.data.data;
+          // AI的消息
+          this.send_messages.pop();//弹出正在加载问题的字样  马上放入该问题
+          this.send_messages.push({
+            sender: 'ai',  // 标记为AI消息
+            message:this.answer
+          });
+          this.setScrollTop()	//滚动条滚动
+        },
+        error: (res) => {
+          console.log("请求失败！请求数据是", res);
+        }
+      });
+    }
   }
 }
 </script>
 
 <style lang="scss">
-
+@import "@/static/homepages/puppy_chat/css/puppy_chat.scss";
 </style>

pages/homepages/self_information/self_information.vue

@@ -1,17 +0,0 @@
-<template>
-  <view>
-
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {};
-  }
-}
-</script>
-
-<style lang="scss">
-
-</style>

pages/homepages/user/basic_information/basic_information.vue

@@ -0,0 +1,206 @@
+<template>
+<view class="background">
+    <view class="user_head">
+      <image class="head" src="/static/homepages/user/basic_information/head.png"></image>
+	  <image class="head_pic" src="/static/homepages/user/basic_information/head_pic.png"></image>
+      <image class="head_but" @click="change_head()" src="/static/homepages/user/basic_information/but.png"></image>
+    </view>
+	<view class="self_back">
+		<view class="name">
+		  <image class="user_name_but" @click="change_name()" src="/static/homepages/user/basic_information/but.png"></image>
+		  <input v-if="n_writeable===true" class="name_text" v-model="name"></input>
+		  <view v-else class="w_name">{{name}}</view>
+		</view>
+		<view class="self">
+		  <image class="self_but" @click="change_self()" src="/static/homepages/user/basic_information/but.png"></image>
+		  <textarea v-if="s_writeable===true" v-model="selftext" class="self_write"></textarea>
+		  <view v-else class="self_read">{{selftext}}</view>
+		</view>
+		<image class="button" @click="save_change()" src="/static/homepages/user/basic_information/button.png"></image>
+	</view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+		name:'puppy',
+		selftext:'您的个人简介',
+		n_writeable:false,
+		s_writeable:false,
+	};
+  },
+  methods:{
+	change_self(){
+		console.log('selftext:', this.selftext);
+		this.s_writeable=true;
+	},
+	change_name(){
+		console.log('name:', this.name);
+		this.n_writeable=true;
+	},
+
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+	save_change()
+	{
+		console.log('name:', this.name);
+		console.log('selftext:', this.selftext);
+		const NAME=this.name;
+		this.n_writeable=false;
+		this.s_writeable=false;
+		this.navigateTo(`/pages/homepages/user/user/user?user_name=${NAME}`);
+	},
+  }
+}
+</script>
+
+<style lang="scss">
+.background{
+	background-image: url("@/static/homepages/user/basic_information/img.png");
+	background-size: cover;
+	background-position: center;
+	height: 100vh;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	overflow: hidden;
+	position: relative;
+}
+.self_back{
+	background-image: url("@/static/homepages/user/basic_information/back.png");
+	background-size: cover;
+	flex:1;
+	height: 80vh;
+	width: 57.3vh;
+	position: absolute;
+	bottom:-7%
+}
+.name{
+	background-image: url("/static/homepages/user/basic_information/user_name.png");
+	background-size: cover;
+	background-position: center;
+	height: 30vh;
+	flex:1;
+	align-items: center;
+	position: absolute;
+	height: 10.1vh;
+	width: 45vh;
+	right: 10.5%;
+	bottom: 71%;
+}
+.self{
+	background-image: url("/static/homepages/user/basic_information/self_back.png");
+	background-size: cover;
+	background-position: center;
+	height: 20vh;
+	flex:1;
+	align-items: center;
+	position: absolute;
+	width: 45vh;
+	right: 10.5%;
+	bottom: 23%;
+}
+.user_head{
+	background-image: url("/static/homepages/user/basic_information/user_back.png");
+	background-size: cover;
+	flex:1;
+	height: 30vh;
+	width: 57.3vh;
+	position: absolute;
+	bottom:70%
+}
+.head{
+	position: absolute;
+	height: 55%;
+	width: 30%;
+	opacity: 1;
+	right: 34%; /* 距右边 10% */
+	bottom: -20%; 
+	z-index: 1;
+}
+.head_pic{
+	position: absolute;
+	height: 50%;
+	width: 25%;
+	opacity: 1;
+	right: 36.7%; /* 距右边 10% */
+	bottom: -10%; 
+	z-index: 1;
+}
+.head_but{
+	position: absolute;
+	height: 14%;
+	width: 7%;
+	opacity: 1;
+	right: 34%; /* 距右边 10% */
+	bottom: -17%; 
+	z-index: 1;
+}
+.user_name_but{
+	position: absolute;
+	height: 47%;
+	width: 10%;
+	opacity: 1;
+	right: 3%; /* 距右边 10% */
+	bottom: 30%; 
+}
+.name_text{
+	position: absolute;
+	font-size: 1.4em; 
+	text-align: center;
+	width: 65%;
+	height: 40%;
+	top: 24%;
+	left: 20%;
+	color:#000000;
+}
+.w_name{
+	position: absolute;
+	font-size: 1.4em; 
+	text-align: center;
+	width: 65%;
+	height: 40%;
+	top: 26%;
+	left: 20%;
+	color:#000000;
+}
+.self_but{
+	position: absolute;
+	height: 13%;
+	width: 10%;
+	opacity: 1;
+	right: 3%; /* 距右边 10% */
+	bottom: 3%; 
+}
+.self_write{
+	position: absolute;
+	font-size: 1.4em; 
+	width: 70%;
+	height: 80%;
+	top: 4%;
+	right: 10%;
+	color:#000000;
+}
+.self_read{
+	position: absolute;
+	font-size: 1.4em; 
+	width: 70%;
+	height: 80%;
+	top: 4%;
+	right: 10%;
+	color:#000000;
+}
+.button{
+	position: absolute;
+	height: 10%;
+	width: 37%;
+	opacity: 1;
+	right: 31%; /* 距右边 10% */
+	bottom: 11%; 
+}
+</style>

pages/homepages/user/bmi_information/bmi_information.vue

@@ -0,0 +1,201 @@
+<template>
+    <view>
+        <image class="background"  src="/static/homepages/user/bmi_information/pictures/background.png"></image>
+		<image class="back_button" @click="goto_user()" src="/static/homepages/user/bmi_information/pictures/button.png"></image>
+		<image class="text_background_one" src="/static/homepages/user/bmi_information/pictures/text_background.png"></image>
+		<image class="text_background_two" src="/static/homepages/user/bmi_information/pictures/text_background.png"></image>
+		<image class="text_background_three" src="/static/homepages/user/bmi_information/pictures/text_background.png"></image>
+		<image class="text_background_four" src="/static/homepages/user/bmi_information/pictures/text_background.png"></image>
+		<image class="text_background_five" src="/static/homepages/user/bmi_information/pictures/text_background.png"></image>
+		<image class="write_one" src="/static/homepages/user/bmi_information/pictures/write.png"></image>
+		<image class="write_two" src="/static/homepages/user/bmi_information/pictures/write.png"></image>
+		<image class="write_three" src="/static/homepages/user/bmi_information/pictures/write.png"></image>
+		<image class="write_four" src="/static/homepages/user/bmi_information/pictures/write.png"></image>
+		<image class="write_five" src="/static/homepages/user/bmi_information/pictures/write.png"></image>
+		<form class="bmi_form">
+			<input class="hight_input" name="hight" type="text" placeholder="身高" v-model="formData.height"/>
+			<input class="weight_input" name="weight" type="text" placeholder="体重" v-model="formData.weight"/>
+			<input class="chest_input" name="chest" type="text" placeholder="胸围" v-model="formData.chest"/>
+			<input class="waist_input" name="waist" type="text" placeholder="腰围" v-model="formData.waist"/>
+			<input class="buttock_input" name="buttock" type="text" placeholder="臀围" v-model="formData.buttock"/>
+		</form>
+		<image class="submit_button" @click="submit()" src="/static/homepages/user/bmi_information/pictures/submit_button.png"></image>
+    </view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+				formData: {
+				    height: '',
+				    weight: '',
+				     chest: '',
+				    waist: '',
+				    buttock: ''
+				  }
+			};
+        },
+		methods:{
+			navigateTo(page) {
+			  uni.navigateTo({
+			    url: page
+			  });
+			},
+			
+			goto_user(){
+				this.navigateTo(`/pages/homepages/user/user/user`);
+			},
+			
+			submit(){
+				 // 这里替换成你的后端API端点
+				const url = app.globalData.fit_journey_ai_address+`/bmi`;
+				
+			 uni.request({
+			 url: url,
+			  method: 'POST',
+			 data: this.formData,
+			success: (res) => {
+		     // 处理成功响应
+			  console.log('Data sent successfully:', res.data);
+			 },
+			 fail: (err) => {
+		    // 处理失败响应
+			    console.error('Failed to send data:', err);
+			   }
+			  });
+			}
+		}
+    }
+</script>
+
+<style lang="scss">
+.background {
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%;
+}
+.back_button {
+	position: absolute;
+	width:8%;
+	height: 5%;
+	top: 6%;
+	left: 7%;
+}
+.text_background_one{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 32%;
+	left: 10%;
+}
+.text_background_two{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 40%;
+	left: 10%;
+}
+.text_background_three{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 48%;
+	left: 10%;
+}
+.text_background_four{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 56%;
+	left: 10%;
+}
+.text_background_five{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 64%;
+	left: 10%;
+}
+.write_one{
+	position: absolute;
+	width: 4%;
+	height: 2%;
+	top: 34.5%;
+	left: 13%;
+}
+.write_two{
+	position: absolute;
+	width: 4%;
+	height: 2%;
+	top: 42.5%;
+	left: 13%;
+}
+.write_three{
+	position: absolute;
+	width: 4%;
+	height: 2%;
+	top: 50.5%;
+	left: 13%;
+}
+.write_four{
+	position: absolute;
+	width: 4%;
+	height: 2%;
+	top: 58.5%;
+	left: 13%;
+}
+.write_five{
+	position: absolute;
+	width: 4%;
+	height: 2%;
+	top: 66.5%;
+	left: 13%;
+}
+.bmi_form{
+.hight_input{
+	position: absolute;
+	width: 70%;
+	height: 6%;
+	top: 32.5%;
+	left: 18%;
+}
+.weight_input{
+	position: absolute;
+	width: 70%;
+	height: 6%;
+	top: 40.5%;
+	left: 18%;
+}
+.chest_input{
+	position: absolute;
+	width: 70%;
+	height: 6%;
+	top: 48.5%;
+	left: 18%;
+}
+.waist_input{
+	position: absolute;
+	width: 70%;
+	height: 6%;
+	top: 56.5%;
+	left: 18%;
+}
+.buttock_input{
+	position: absolute;
+	width: 70%;
+	height: 6%;
+	top: 64.5%;
+	left: 18%;
+}
+}
+.submit_button{
+	position: absolute;
+	width: 50%;
+	height: 12%;
+	top: 75%;
+	left: 25%;
+}
+</style>

pages/homepages/user/exercise_plans/exercise_plans.vue

@@ -0,0 +1,164 @@
+<template>
+    <view>
+        <image class="background"  src="/static/homepages/user/exercise_plans/pictures/background.png"></image>
+		<image class="back_button" src="/static/homepages/user/exercise_plans/pictures/button.png"></image>
+		<text class="date" style="color: black;">{{todayDate}}</text>
+		<image class="text_background_one" src="/static/homepages/user/exercise_plans/pictures/text_background.png"></image>
+		<image class="text_background_two" src="/static/homepages/user/exercise_plans/pictures/text_background.png"></image>
+		<image class="text_background_three" src="/static/homepages/user/exercise_plans/pictures/text_background.png"></image>
+		<image class="write_one" src="/static/homepages/user/exercise_plans/pictures/write.png"></image>
+		<image class="write_two" src="/static/homepages/user/exercise_plans/pictures/write.png"></image>
+		<image class="write_three" src="/static/homepages/user/exercise_plans/pictures/write.png"></image>
+		<form class="bmi_form">
+			 <input class="sport_input" v-model="formData.sport" type="text" placeholder="运动项目"/>
+			<input class="location_input" v-model="formData.location" type="text" placeholder="运动地点"/>
+			 <input class="time_input" v-model="formData.time" type="text" placeholder="运动时间"/>
+		</form>
+		<image class="submit_button" @click="submit()" src="/static/homepages/user/exercise_plans/pictures/submit_button.png"></image>
+    </view>
+</template>
+<script>
+    export default {
+        data() {
+            return {
+				 todayDate:'',// 调用函数获取今日日期
+				  formData: {
+				 sport: '',
+				 location: '',
+				   time: ''
+			 }
+			};
+        },
+		methods:{
+			submit(){
+				 // 这里替换成你的后端API端点
+				const url = app.globalData.fit_journey_ai_address+`/exercise`;
+				
+				  uni.request({
+				  url: url,
+				 method: 'POST',
+			    data: this.formData,
+				   success: (res) => {
+				      // 处理成功响应
+				        console.log('Data sent successfully:', res.data);
+				     },
+				     fail: (err) => {
+				   // 处理失败响应
+				       console.error('Failed to send data:', err);
+				      }
+				 });
+			},
+			//todo 没成功显示日期！！
+			getTodayDateString() {
+			      const today = new Date();
+			      const year = today.getFullYear();
+			      const month = today.getMonth() + 1;
+			      const day = today.getDate();
+			      const monthString = month < 10 ? '0' + month : month;
+			      const dayString = day < 10 ? '0' + day : day;
+			      return `${year}-${monthString}-${dayString}`;
+		},
+		created(){
+		     this.todayDate = this.getTodayDateString(); // 在组件创建时设置日期
+			 console.log('Today\'s date:', this.todayDate); // 打印日期以检查其值
+					
+		}
+    },
+	}
+</script>
+
+<style lang="scss">
+.background {
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 0%;
+	left: 0%;
+}
+.back_button {
+	position: absolute;
+	width:9%;
+	height: 5%;
+	top: 6%;
+	left: 7%;
+}
+.date{
+	position: absolute;
+	width:40%;
+	height: 5%;
+	top: 20%;
+	left: 20%;
+	 display: block; /* 确保是块级元素 */
+    visibility: visible; /* 确保可见 */
+}
+.text_background_one{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 32%;
+	left: 10%;
+}
+.text_background_two{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 42%;
+	left: 10%;
+}
+.text_background_three{
+	position: absolute;
+	width: 80%;
+	height: 7%;
+	top: 52%;
+	left: 10%;
+}
+.write_one{
+	position: absolute;
+	width: 7%;
+	height: 3%;	
+	top: 34.5%;
+	left: 12%;	
+}
+.write_two{
+	position: absolute;
+	width: 7%;
+	height: 3%;	
+	top: 44.5%;
+	left: 12%;	
+}
+.write_three{
+	position: absolute;
+	width: 7%;
+	height: 3%;	
+	top: 54.5%;
+	left: 12%;	
+}
+.sport_input{
+	position: absolute;
+	width: 80%;
+	height: 3%;	
+	top: 34.2%;
+	left: 19%;	
+}
+.location_input{
+	position: absolute;
+	width: 80%;
+	height: 3%;	
+	top: 44.2%;
+	left: 19%;	
+}
+.time_input{
+	position: absolute;
+	width: 80%;
+	height: 3%;	
+	top: 54.2%;
+	left: 19%;	
+}
+.submit_button{
+	position: absolute;
+	width: 50%;
+	height: 12%;
+	top: 64%;
+	left: 24%;	
+}
+</style>

pages/homepages/user/user/user.vue

@@ -0,0 +1,261 @@
+<template>
+<view class="background">
+	<image class="head_pic" src="@/static/homepages/user/user/pictures/head_pic.png"></image>
+	<image class="head_button" @click="goto_user()" src="@/static/homepages/user/user/pictures/head_button.png"></image>
+	<image class="bmi_button" @click="goto_bmi()" src="@/static/homepages/user/user/pictures/bmi_button.png"></image>
+	<image class="eat_button" @click="goto_eat()" src="@/static/homepages/user/user/pictures/eat_button.png"></image>
+	<image class="ad_button" @click="goto_exer()" src="@/static/homepages/user/user/pictures/ad_button.png"></image>
+	<image class="button" @click="goto_login()" src="@/static/homepages/user/user/pictures/button.png"></image>
+	<image class="point" src="@/static/homepages/user/user/pictures/point.png"></image>
+	<image class="pie" src="@/static/homepages/user/user/pictures/pie.png"></image>
+
+
+	<image  v-if="sex===0" class="user" src="@/static/homepages/user/user/pictures/female.png"></image>
+    <image  v-if="sex===1" class="user" src="@/static/homepages/user/user/pictures/male.png"></image>
+
+
+	<text class="id">{{user_name}}</text>
+	<text class="hot_in">20000J</text>
+	<text class="hot_out">17000J</text>
+	<text class="height">{{user_height}}cm</text>
+	<text class="weight">{{user_weight}}kg</text>
+	<text class="bmi">{{user_bmi}}</text>
+	<text class="xw">{{user_xw}}</text>
+	<text class="yw">{{user_yw}}</text>
+	<text class="tw">{{user_tw}}</text>
+	<text class="bmi_state">很健康</text>
+
+  </view>
+  <tarbar_user></tarbar_user>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      sex : 1,//1为男，0为女
+	  user_name:'puppy',
+	  user_height:'180',
+	  user_weight:'75',
+	  user_xw:'44.5',
+	  user_yw:'34.0',
+	  user_tw:'42.5',
+	  user_bmi:'23.1'
+    };
+  },
+	onLoad(options){
+	  if (options.user_name) {
+	    this.user_name = options.user_name;
+	  };
+	},
+  methods:{
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+	goto_user(){
+		this.navigateTo(`/pages/homepages/user/basic_information/basic_information`);
+	},
+	
+	goto_bmi(){
+		this.navigateTo(`/pages/homepages/user/bmi_information/bmi_information`);
+	},
+	
+	goto_eat(){
+		this.navigateTo(`/pages/homepages/user/recipe_and_calorie/recipe_and_calorie`);
+	},
+	
+	goto_exer(){
+		this.navigateTo(`/pages/homepages/user/exercise_plans/exercise_plans`);
+	},
+	
+	goto_login(){
+		this.navigateTo(`/pages/login/account_login/account_login`);
+	},
+  }
+}
+</script>
+
+<style scoped>
+.background{
+	background-image: url("@/static/homepages/user/user/pictures/background.png");
+	background-size: cover;
+	background-position: center;
+	height: 225vh;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	overflow: hidden;
+	position: relative;
+}
+.head_pic{
+	position: absolute;
+	height: 4%;
+	width: 20%;
+	opacity: 1;
+	right: 70%; 
+	top: 3.5%;
+
+}
+.head_button{
+	position: absolute;
+	height: 1.2%;
+	width: 20%;
+	opacity: 1;
+	right: 5%; 
+	bottom: 90.7%;
+
+}
+.bmi_button{
+	position: absolute;
+	height: 1.2%;
+	width: 20%;
+	opacity: 1;
+	right: 6%; 
+	bottom: 60.7%;
+
+}
+.ad_button{
+	position: absolute;
+	height: 2%;
+	width: 35%;
+	opacity: 1;
+	right: 57%; 
+	bottom:17.5%;
+
+}
+.eat_button{
+	position: absolute;
+	height: 2%;
+	width: 35%;
+	opacity: 1;
+	right: 57%; 
+	bottom: 10.5%;
+
+}
+.user{
+	position: absolute;
+	height: 18%;
+	width: 30%;
+	opacity: 1;
+	left: 55%;
+	bottom: 26%;
+
+}
+.point{
+	position: absolute;
+	height: 0.3%;
+	width: 2%;
+	opacity: 1;
+	right: 50%; 
+	bottom: 48.4%;
+}
+.button{
+	position: absolute;
+	height: 4%;
+	width: 90%;
+	left: 5%;
+	top: 90.5%;
+}
+.pie{
+	position: absolute;
+	height: 18%;
+	width: 85%;
+	left: 5%;
+	top: 18%;
+}
+.id{
+	position: absolute;
+	opacity: 1;
+	left: 37%; /* 距右边 10% */
+	top: 4.7%;
+	font-size: 1.5rem;
+}
+.hot_in{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	left: 20%; /* 距右边 10% */
+	top: 12.7%; 
+	font-size: 0.5rem;
+	color: #ffffff;
+}
+.hot_out{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	left: 71%; /* 距右边 10% */
+	top: 12.7%; 
+	font-size: 0.5rem;
+	color: #ffffff;
+}
+.height{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	right: 72%; /* 距右边 10% */
+	bottom: 55.3%; 
+	font-size: 1.2rem;
+	color: #ffffff;
+}
+.weight{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	right: 33%; /* 距右边 10% */
+	bottom: 55.3%; 
+	font-size: 1.2rem;
+	color: #ffffff;
+}
+.bmi{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	right: 73%; /* 距右边 10% */
+	bottom: 50.5%; 
+	font-size: 1.2rem;
+	color: #ffffff;
+}
+.xw{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	right: 79%; /* 距右边 10% */
+	bottom: 39.3%; 
+	font-size: 1.2rem;
+}
+.yw{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	right: 79%; /* 距右边 10% */
+	bottom: 34.5%; 
+	font-size: 1.2rem;
+}
+.tw{
+	position: absolute;
+	height: 0.2%;
+	width: 5%;
+	opacity: 1;
+	right: 79%; /* 距右边 10% */
+	bottom: 29.3%; 
+	font-size: 1.2rem;
+}
+.bmi_state{
+	position: absolute;
+	text-align: center;
+	opacity: 1;
+	left: 68%;
+	top: 49.4%; 
+	font-size: 0.2em;
+	color: #000000;
+}
+</style>

pages/information/boy_height_end/boy_height_end.vue

@@ -0,0 +1,137 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/boy_height/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll()" src="/static/information/boy_height/pictures/roll.png"></image>
+    <!-- 按钮  跳转到目的的部分-->
+    <image class="button" @click="go_to_purpose()" src="/static/information/boy_height/pictures/button.png"></image>
+	<!-- 进度条 -->
+	<image class="progress" src="/static/information/boy_height/pictures/progress.png"></image>
+	<!-- 文本-->
+	<text class="text" @click="go_to_roll()">{{height}}</text>
+  </view>
+</template>
+
+<script>
+export default {
+	data(){
+		return{
+			height:'',
+      token: uni.getStorageSync('access_token'),
+		};
+	},
+	onLoad(options){
+		this.height=options.height;
+	},
+    methods: {
+
+
+      go_to_purpose() {
+        const app = getApp();
+        console.log(app.globalData.token);
+        console.log(app.globalData.fit_journey_basic_address);
+        console.log("当前的身高是" + this.height);
+        // 转换 height 字符串为数字，去掉 "cm" 后缀
+        const numericHeight = parseFloat(this.height.replace('cm', '').trim());
+        console.log("本地存储的token是"+this.token)
+        // 向后端发送请求
+        uni.request({
+          url: app.globalData.fit_journey_basic_address + '/height/write_user_height',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization': this.token
+          },
+          data: {
+            height: numericHeight, // 发送数字类型
+          },
+          success: (res) => {
+            uni.showToast({
+              title: '提交成功',
+              icon: 'success',
+            })
+            console.log("请求成功！请求数据是", res);
+            // 如果成功则跳转到使用的目的界面
+            uni.navigateTo({
+              url: '/pages/information/purpose/purpose'
+            });
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+      },
+        go_to_roll() {
+           uni.navigateTo({
+            url: '/pages/information/boy_height_end/boy_height_roll/boy_height_roll?height='+this.height,
+           })
+        },
+    }
+}
+
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("/static/information/boy_height/pictures/img.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+
+.human {
+  position: absolute;
+  width: 100%;
+  height: 90%;
+  top:-10%;
+  object-fit: contain; /* 保持图片比例 */
+}
+
+.progress{
+  position: absolute;
+  width: 77%;
+  height: 7%;
+  object-fit: contain; /* 保持图片比例 */
+  opacity: 1;
+  top: 2%; /* 根据需要调整位置 */
+}
+
+/* Text 延迟显示 */
+.roll {
+  position: absolute;
+  width: 77%;
+  height: 20%;
+  object-fit: contain; /* 保持图片比例 */
+  opacity: 1;
+  top: 55%; /* 根据需要调整位置 */
+}
+
+/* Button 延迟显示并加缩放特效，放在下方 */
+.button {
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  opacity: 1;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+
+.text{
+	position: absolute;
+	text-align: center;
+	font-size: 1.5em; 
+	width: 100%;
+	height: 20%;
+	top: 69%; 
+	color:#ffffff;
+}
+</style>

pages/information/boy_height_roll/boy_height_roll.vue

@@ -0,0 +1,102 @@
+<template>
+  <view class="container">
+    <picker-view 
+		@change="onPickerChange" 
+		class="picker_view_box"
+		:value="pickerValue" 
+		mask-style="opacity:0%"
+		indicator-style="height:3rem"
+	>
+      <picker-view-column>
+        <view v-for="(item, index) in options" :key="index" class="item">
+          {{ item }}
+        </view>
+      </picker-view-column>
+    </picker-view>
+
+    <image class="button" @click="go_to_height" src="/static/information/boy_height/pictures/button2.png"></image>
+  </view>
+<!-- TODO:修改 -->
+</template>
+
+<script>
+// TODO:修改
+export default {
+  data() {
+    return {
+      options: this.generateHeightOptions(150, 200), 
+      pickerValue: [15], // 默认选中项的索引
+    };
+  },
+  methods: {
+	generateHeightOptions(start, end) {
+		const options = [];
+	    for (let i = start; i <= end; i++) {
+	    options.push(`${i} cm`);
+	    }
+	    return options;
+	},
+    onPickerChange(event) {
+      this.pickerValue = event.detail.value; // 更新选中的索引
+    },
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+    
+    go_to_height() {
+      const selectedValue = this.options[this.pickerValue[0]]; // 获取选中的值
+      this.navigateTo(`/pages/information/boy_height_end/boy_height_end?height=${selectedValue}`); // 跳转到 boy_height_end，并传递选中值
+    },
+  },
+};
+</script>
+
+<style scoped>
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center; /* 水平居中 */
+  justify-content: center; /* 垂直居中 */
+  height: 100vh; /* 使容器充满整个视口 */
+  padding: 20px;
+  background-image: url("/static/information/boy_height/pictures/bkg_roll.png");
+  background-size: cover;
+}
+
+.picker_view_box {
+  height: 42.8vh; /* 设置 picker-view 的高度 */
+  width: 80%; /* 宽度自适应 */
+}
+
+.item {
+	line-height: 2rem;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-size: 1.5rem;
+	height: 3rem;
+	color: #ffffff;
+}
+
+.button {
+  margin-top: 10px; /* 按钮与选择器之间的间距 */
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+</style>
+
+
+
+
+
+
+
+
+
+
+

pages/information/boy_height_start/boy_height_start.vue

@@ -0,0 +1,165 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/boy_height/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll" src="/static/information/boy_height/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_purpose" src="/static/information/boy_height/pictures/button.png"></image>
+	<!-- 进度条 -->
+	<image class="progress" src="/static/information/boy_height/pictures/progress.png"></image>
+	<!-- 文本-->
+	<text class="text" @click="go_to_roll()">175 cm</text>
+  </view>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+          token: uni.getStorageSync("access_token"),
+        };
+    },
+    methods: {
+        navigateTo(page) {
+            uni.navigateTo({
+                url: page
+            });
+        },
+      go_to_purpose() {
+        const app=getApp();
+        console.log(app.globalData.token);
+        console.log(app.globalData.fit_journey_basic_address);
+        // 向后端发送请求
+        uni.request({
+          url: app.globalData.fit_journey_basic_address + '/height/write_user_height',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization':this.token
+          },
+          data: {
+            height: 175, // 发送数字类型
+          },
+          success: (res) => {
+            console.log("请求成功！请求数据是", res);
+            // 如果成功则跳转到使用的目的界面
+            this.navigateTo('/pages/information/purpose/purpose');
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+      },
+        go_to_roll() {
+            this.navigateTo('/pages/information/boy_height_roll/boy_height_roll');
+			height:''
+        },
+    }
+}
+
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("/static/information/boy_height/pictures/img.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+/* Human 动画，从页面中部向上移动 */
+.human {
+  position: absolute;
+  width: 100%;
+  height: 90%;
+  top:10%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: moveUp 2s ease forwards;
+  top: 30%; /* 起始位置 */
+  transform: translateY(-50%); /* 垂直居中 */
+}
+
+.progress{
+  position: absolute;
+  width: 77%;
+  height: 7%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 2%; /* 根据需要调整位置 */
+}
+
+/* Text 延迟显示 */
+.roll {
+  position: absolute;
+  width: 77%;
+  height: 20%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 55%; /* 根据需要调整位置 */
+}
+
+/* Button 延迟显示并加缩放特效，放在下方 */
+.button {
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  animation: fadeInScale 1s ease 2.5s forwards; /* 2.5秒后显示并缩放 */
+  opacity: 0;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+
+.text{
+	position: absolute;
+	font-size: 1.5em; 
+	text-align: center;
+	width: 100%;
+	height: 20%;
+	top: 69%;
+	animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+	opacity: 0;
+	color:#ffffff;
+}
+
+/* 定义 human 上移动画 */
+@keyframes moveUp {
+  from {
+    top: 70%;
+  }
+  to {
+    top: 35%; /* 移动到页面顶部 10% */
+  }
+}
+
+/* Text 和 Button 的渐入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* Button 的缩放渐入动画 */
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+</style>

pages/information/boy_weight_end/boy_weight_end.vue

@@ -0,0 +1,81 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/boy_weight/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="goTob_roll()" src="/static/information/boy_weight/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_height()" src="/static/information/boy_weight/pictures/button.png"></image>
+    <!-- 进度条 -->
+    <image class="progress" src="/static/information/boy_weight/pictures/progress.png"></image>
+    <!-- 文本-->
+    <text class="text" @click="goTob_roll()">{{weight}}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      weight: '',
+      token : uni.getStorageSync("access_token")
+    };
+  },
+  onLoad(options) {
+    this.weight = options.weight;
+  },
+  methods: {
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+
+    go_to_height() {
+      // 获取全局变量
+      const app = getApp();
+      console.log(app.globalData.token);
+      console.log(app.globalData.fit_journey_basic_address);
+
+      // 转换 weight 字符串为数字，去掉 "kg" 后缀
+      const numericWeight = parseFloat(this.weight.replace('kg', '').trim());
+
+      // 向后端发送请求
+      uni.request({
+        url: app.globalData.fit_journey_basic_address + '/weight/write_user_weight',
+        method: 'POST',
+        header: {
+          'content-type': 'application/x-www-form-urlencoded',
+          'Authorization': this.token
+        },
+        data: {
+          weight: numericWeight, // 发送数字类型
+        },
+        success: (res) => {
+          console.log("请求成功！请求数据是", res);
+
+          uni.showToast({
+          title: '提交成功',
+            icon: 'success',
+          })
+          // 如果成功则跳转到身高界面
+          this.navigateTo('/pages/information/boy_height_start/boy_height_start');
+        },
+        error: (res) => {
+          console.log("请求失败！请求数据是", res);
+        }
+      });
+    },
+
+    goTob_roll() {
+      this.navigateTo('/pages/information/boy_height_roll/boy_height_roll');
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+@import "/static/information/boy_weight/css/boy_weight_end.scss";
+</style>

pages/information/boy_weight_roll/boy_weight_roll.vue

@@ -0,0 +1,87 @@
+<template>
+  <view class="container">
+    <picker-view 
+		@change="onPickerChange" 
+		mask-style="opacity:0%" 
+		indicator-style="height:3rem"
+		:value="pickerValue" 
+		class="picker_view_box"
+	>
+      <picker-view-column>
+        <view v-for="(item, index) in options" :key="index" class="item">
+          {{ item }}
+        </view>
+      </picker-view-column>
+    </picker-view>
+    <image class="button" @click="go_to_weight_end" src="/static/information/boy_weight/pictures/button2.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+		options: this.generateWeightOptions(40, 150), 
+		pickerValue: [15], // 默认选中项的索引
+    };
+  },
+  methods: {
+	generateWeightOptions(start, end) {
+		const options = [];
+	    for (let i = start; i <= end; i++) {
+			options.push(`${i} kg`);
+	    }
+	    return options;
+	},
+    onPickerChange(event) {
+      this.pickerValue = event.detail.value; // 更新选中的索引
+    },
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+    
+    go_to_weight_end() {
+      const selectedValue = this.options[this.pickerValue[0]]; // 获取选中的值
+      this.navigateTo(`/pages/information/boy_weight_end/boy_weight_end?weight=${selectedValue}`); // 跳转到 boy_weight_end，并传递选中值
+    },
+  },
+};
+</script>
+
+<style scoped>
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center; /* 水平居中 */
+  justify-content: center; /* 垂直居中 */
+  height: 100vh; /* 使容器充满整个视口 */
+  background-image: url("/static/information/boy_weight/pictures/bkg_roll.png");
+  background-size: cover;
+}
+
+.picker_view_box {
+  height: 42.8vh; /* 设置 picker-view 的高度 */
+  width: 80%; /* 宽度自适应 */
+}
+
+.item {
+	line-height: 2rem;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-size: 1.5rem;
+	height: 3rem;
+	color: #ffffff;
+}
+
+.button {
+  margin-top: 10px; /* 按钮与选择器之间的间距 */
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+</style>

pages/information/boy_weight_start/boy_weight_start.vue

@@ -0,0 +1,172 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/boy_weight/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll()" src="/static/information/boy_weight/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_height()" src="/static/information/boy_weight/pictures/button.png"></image>
+	<!-- 进度条 -->
+	<image class="progress" src="/static/information/boy_weight/pictures/progress.png"></image>
+	<!-- 文本-->
+	<text class="text" @click="go_to_roll()">65 kg</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      token :uni.getStorageSync("access_token")
+    }
+  },
+    methods: {
+      go_to_height() {
+        // 获取全局变量
+        const app = getApp();
+        console.log(app.globalData.token);
+        console.log(app.globalData.fit_journey_basic_address);
+
+        // 向后端发送请求
+        uni.request({
+          url: app.globalData.fit_journey_basic_address + '/weight/write_user_weight',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization': this.token
+          },
+          data: {
+            weight: 65, // 发送数字类型
+          },
+          success: (res) => {
+            uni.showToast({
+            title: '提交成功',
+              icon: 'success'
+            })
+            console.log("请求成功！请求数据是", res);
+            // 如果成功则跳转到身高界面
+            uni.navigateTo({
+              url: '/pages/information/boy_height_start/boy_height_start',
+            })
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+      },
+
+
+      go_to_roll() {
+            uni.navigateTo({
+            	url:'/pages/information/boy_weight_roll/boy_weight_roll'
+            })
+			height:''
+        },
+    }
+}
+
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("/static/information/boy_weight/pictures/img.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+/* Human 动画，从页面中部向上移动 */
+.human {
+  position: absolute;
+  width: 100%;
+  height: 90%;
+  top:10%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: moveUp 2s ease forwards;
+  top: 30%; /* 起始位置 */
+  transform: translateY(-50%); /* 垂直居中 */
+}
+
+.progress{
+  position: absolute;
+  width: 77%;
+  height: 7%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 2%; /* 根据需要调整位置 */
+}
+
+/* Text 延迟显示 */
+.roll {
+  position: absolute;
+  width: 77%;
+  height: 20%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 55%; /* 根据需要调整位置 */
+}
+
+/* Button 延迟显示并加缩放特效，放在下方 */
+.button {
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  animation: fadeInScale 1s ease 2.5s forwards; /* 2.5秒后显示并缩放 */
+  opacity: 0;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+
+.text{
+	position: absolute;
+	font-size: 1.5em; 
+	text-align: center;
+	width: 100%;
+	height: 20%;
+	top: 69%;
+	animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+	opacity: 0;
+	color:#ffffff;
+}
+
+/* 定义 human 上移动画 */
+@keyframes moveUp {
+  from {
+    top: 70%;
+  }
+  to {
+    top: 35%; /* 移动到页面顶部 10% */
+  }
+}
+
+/* Text 和 Button 的渐入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* Button 的缩放渐入动画 */
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+</style>

pages/information/girl_height_end/girl_height_end.vue

@@ -0,0 +1,80 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/girl_height/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll()" src="/static/information/girl_height/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_purpose()" src="/static/information/girl_height/pictures/button.png"></image>
+	<!-- 进度条 -->
+	<image class="progress" src="/static/information/girl_height/pictures/progress.png"></image>
+	<!-- 文本-->
+	<text class="text" @click="go_to_roll()">{{height}}</text>
+  </view>
+</template>
+
+<script>
+export default {
+	data(){
+		return{
+			height:''
+		};
+	},
+	onLoad(options){
+		this.height=options.height;
+	},
+    methods: {
+        navigateTo(page) {
+            uni.navigateTo({
+                url: page
+            });
+        },
+      go_to_purpose() {
+        const app = getApp();
+        console.log(app.globalData.token);
+        console.log(app.globalData.fit_journey_basic_address);
+        console.log("当前的身高是" + this.height);
+
+        // 转换 height 字符串为数字，去掉 "cm" 后缀
+        const numericHeight = parseFloat(this.height.replace('cm', '').trim());
+
+        // 向后端发送请求
+        uni.request({
+          url: app.globalData.fit_journey_basic_address + '/height/write_user_height',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization': app.globalData.token // TODO：暂时写为临时的token 后期替换
+          },
+          data: {
+            height: numericHeight, // 发送数字类型
+          },
+          success: (res) => {
+            console.log("请求成功！请求数据是", res);
+            // 如果成功则跳转到使用的目的界面
+            uni.navigateTo({
+              url: '/pages/information/purpose/purpose'
+            });
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+      },
+
+
+        go_to_roll() {
+          uni.navigateTo({
+            url: '/pages/information/girl_height_roll/girl_height_roll'
+          })
+        },
+    }
+}
+
+</script>
+
+<style lang="scss">
+@import "@/static/information/girl_height/css/girl_height_end.scss";
+</style>

pages/information/girl_height_roll/girl_height_roll.vue

@@ -0,0 +1,91 @@
+<template>
+  <view class="container">
+    <picker-view 
+		@change="onPickerChange" 
+		class="picker_view_box"
+		:value="pickerValue" 
+		mask-style="opacity:0%"
+		indicator-style="height:3rem"
+	>
+      <picker-view-column>
+        <view v-for="(item, index) in options" :key="index" class="item">
+          {{ item }}
+        </view>
+      </picker-view-column>
+    </picker-view>
+
+    <image class="button" @click="go_to_height" src="/static/information/girl_height/pictures/button2.png"></image>
+  </view>
+<!-- TODO:修改 -->
+</template>
+
+<script>
+// TODO:修改
+export default {
+  data() {
+    return {
+      options: this.generateHeightOptions(150, 200), 
+      pickerValue: [15], // 默认选中项的索引
+    };
+  },
+  methods: {
+	generateHeightOptions(start, end) {
+		const options = [];
+	    for (let i = start; i <= end; i++) {
+	    options.push(`${i} cm`);
+	    }
+	    return options;
+	},
+    onPickerChange(event) {
+      this.pickerValue = event.detail.value; // 更新选中的索引
+    },
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+    
+    go_to_height() {
+      const selectedValue = this.options[this.pickerValue[0]]; // 获取选中的值
+      this.navigateTo(`/pages/information/girl_height_end/girl_height_end?height=${selectedValue}`); // 跳转到 girl_height_end，并传递选中值
+    },
+  },
+};
+</script>
+
+<style scoped>
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center; /* 水平居中 */
+  justify-content: center; /* 垂直居中 */
+  height: 100vh; /* 使容器充满整个视口 */
+  padding: 20px;
+  background-image: url("/static/information/girl_height/pictures/bkg_roll.png");
+  background-size: cover;
+}
+
+.picker_view_box {
+  height: 42.8vh; /* 设置 picker-view 的高度 */
+  width: 80%; /* 宽度自适应 */
+}
+
+.item {
+	line-height: 2rem;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	font-size: 1.5rem;
+	height: 3rem;
+	color: #ffffff;
+}
+
+.button {
+  margin-top: 10px; /* 按钮与选择器之间的间距 */
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+</style>

pages/information/girl_height_start/girl_height_start.vue

@@ -0,0 +1,64 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+     <image class="human" src="/static/information/girl_height/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll" src="/static/information/girl_height/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_purpose" src="/static/information/girl_height/pictures/button.png"></image>
+	<!-- 进度条 -->
+	<image class="progress" src="/static/information/girl_height/pictures/progress.png"></image>
+	<!-- 文本-->
+	<text class="text" @click="go_to_roll()">175 cm</text>
+  </view>
+</template>
+
+<script>
+export default {
+    methods: {
+        navigateTo(page) {
+            uni.navigateTo({
+                url: page
+            });
+        },
+
+      go_to_purpose() {
+        const app=getApp();
+        console.log(app.globalData.token);
+        console.log(app.globalData.fit_journey_basic_address);
+        // 向后端发送请求
+        uni.request({
+          url: app.globalData.fit_journey_basic_address + '/height/write_user_hight',
+          method: 'POST',
+          header: {
+            'content-type': 'application/x-www-form-urlencoded',
+            'Authorization': app.globalData.token // TODO：暂时写为临时的token 后期替换
+          },
+          data: {
+            weight: 175, // 发送数字类型
+          },
+          success: (res) => {
+            console.log("请求成功！请求数据是", res);
+            // 如果成功则跳转到使用的目的界面
+            this.navigateTo('/pages/information/purpose/purpose');
+          },
+          error: (res) => {
+            console.log("请求失败！请求数据是", res);
+          }
+        });
+      },
+
+        go_to_roll() {
+            this.navigateTo('/pages/information/girl_height_roll/girl_height_roll');
+			height:''
+        },
+    }
+}
+
+</script>
+
+<style lang="scss">
+@import "@/static/information/girl_height/css/girl_height_start.scss";
+</style>

pages/information/girl_weight_end/girl_weight_end.vue

@@ -0,0 +1,142 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/girl_weight/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll()" src="/static/information/girl_weight/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_height()" src="/static/information/girl_weight/pictures/button.png"></image>
+    <!-- 进度条 -->
+    <image class="progress" src="/static/information/girl_weight/pictures/progress.png"></image>
+    <!-- 文本-->
+    <text class="text" @click="go_to_roll()">{{weight}}</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      weight: '',
+      token :uni.getStorageSync("access_token")
+    };
+  },
+  onLoad(options) {
+    this.weight = options.weight;
+  },
+  methods: {
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+
+
+    go_to_height() {
+      // 获取全局变量
+      const app = getApp();
+      console.log(app.globalData.token);
+      console.log(app.globalData.fit_journey_basic_address);
+
+      // 转换 weight 字符串为数字，去掉 "kg" 后缀
+      const numericWeight = parseFloat(this.weight.replace('kg', '').trim());
+
+      // 向后端发送请求
+      uni.request({
+        url: app.globalData.fit_journey_basic_address + '/weight/write_user_weight',
+        method: 'POST',
+        header: {
+          'content-type': 'application/x-www-form-urlencoded',
+          'Authorization': this.token
+        },
+        data: {
+          weight: numericWeight, // 发送数字类型
+        },
+        success: (res) => {
+          uni.showToast({
+            title: '提交成功',
+            icon: 'success',
+          })
+          console.log("请求成功！请求数据是", res);
+          // 如果成功则跳转到身高界面
+          this.navigateTo('/pages/information/girl_height_start/girl_height_start');
+        },
+        error: (res) => {
+          console.log("请求失败！请求数据是", res);
+        }
+      });
+    },
+
+    go_to_roll() {
+      this.navigateTo('/pages/information/girl_weight_roll/girl_weight_roll');
+    },
+  }
+}
+
+
+
+
+</script>
+<style lang="scss">
+.background {
+  background-image: url("/static/information/boy_weight/pictures/img.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+/* Human 动画，从页面中部向上移动 */
+.human {
+  position: absolute;
+  width: 100%;
+  height: 90%;
+  top: -10%;
+  object-fit: contain; /* 保持图片比例 */
+}
+
+.progress {
+  position: absolute;
+  width: 77%;
+  height: 7%;
+  object-fit: contain; /* 保持图片比例 */
+  opacity: 1;
+  top: 2%; /* 根据需要调整位置 */
+}
+
+/* Text 延迟显示 */
+.roll {
+  position: absolute;
+  width: 77%;
+  height: 20%;
+  object-fit: contain; /* 保持图片比例 */
+  opacity: 1;
+  top: 55%; /* 根据需要调整位置 */
+}
+
+/* Button 延迟显示并加缩放特效，放在下方 */
+.button {
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  opacity: 1;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+
+.text {
+  position: absolute;
+  text-align: center;
+  font-size: 1.5em;
+  width: 100%;
+  height: 20%;
+  top: 69%;
+  color: #ffffff;
+}
+</style>

pages/information/girl_weight_roll/girl_weight_roll.vue

@@ -0,0 +1,87 @@
+<template>
+  <view class="container">
+    <picker-view
+        @change="onPickerChange"
+        mask-style="opacity:0%"
+        indicator-style="height:3rem"
+        :value="pickerValue"
+        class="picker_view_box"
+    >
+      <picker-view-column>
+        <view v-for="(item, index) in options" :key="index" class="item">
+          {{ item }}
+        </view>
+      </picker-view-column>
+    </picker-view>
+    <image class="button" @click="go_to_weight_end" src="/static/information/girl_weight/pictures/button_roll.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      options: this.generateWeightOptions(40, 150),
+      pickerValue: [15], // 默认选中项的索引
+    };
+  },
+  methods: {
+    generateWeightOptions(start, end) {
+      const options = [];
+      for (let i = start; i <= end; i++) {
+        options.push(`${i} kg`);
+      }
+      return options;
+    },
+    onPickerChange(event) {
+      this.pickerValue = event.detail.value; // 更新选中的索引
+    },
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+
+    go_to_weight_end() {
+      const selectedValue = this.options[this.pickerValue[0]]; // 获取选中的值
+      this.navigateTo(`/pages/information/girl_weight_end/girl_weight_end?weight=${selectedValue}`); // 跳转到 boy_weight_end，并传递选中值
+    },
+  },
+};
+</script>
+
+<style scoped>
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center; /* 水平居中 */
+  justify-content: center; /* 垂直居中 */
+  height: 100vh; /* 使容器充满整个视口 */
+  background-image: url("/static/information/girl_weight/pictures/bkg_roll.png");
+  background-size: cover;
+}
+
+.picker_view_box {
+  height: 42.8vh; /* 设置 picker-view 的高度 */
+  width: 80%; /* 宽度自适应 */
+}
+
+.item {
+  line-height: 2rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1.5rem;
+  height: 3rem;
+  color: #ffffff;
+}
+
+.button {
+  margin-top: 10px; /* 按钮与选择器之间的间距 */
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+</style>

pages/information/girl_weight_start/girl_weight_start.vue

@@ -0,0 +1,176 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+
+    <!-- 人物 -->
+    <image class="human" src="/static/information/girl_weight/pictures/human.png"></image>
+    <!-- 滚动条 -->
+    <image class="roll" @click="go_to_roll()" src="/static/information/girl_weight/pictures/roll.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="go_to_height()" src="/static/information/girl_weight/pictures/button.png"></image>
+    <!-- 进度条 -->
+    <image class="progress" src="/static/information/girl_weight/pictures/progress.png"></image>
+    <!-- 文本-->
+    <text class="text" @click="go_to_roll()">65 kg</text>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      token :uni.getStorageSync("access_token"),
+    };
+  },
+  methods: {
+    navigateTo(page) {
+      uni.navigateTo({
+        url: page
+      });
+    },
+
+    go_to_height() {
+      // 获取全局变量
+      const app = getApp();
+      console.log(app.globalData.token);
+      console.log(app.globalData.fit_journey_basic_address);
+
+      // 向后端发送请求
+      uni.request({
+        url: app.globalData.fit_journey_basic_address + '/weight/write_user_weight',
+        method: 'POST',
+        header: {
+          'content-type': 'application/x-www-form-urlencoded',
+          'Authorization': this.token
+        },
+        data: {
+          weight: 65, // 发送数字类型
+        },
+        success: (res) => {
+          uni.showToast({
+            title: '提交成功',
+            icon: 'success',
+          })
+          console.log("请求成功！请求数据是", res);
+          // 如果成功则跳转到身高界面
+          this.navigateTo('/pages/information/girl_height_start/girl_height_start');
+        },
+        error: (res) => {
+          console.log("请求失败！请求数据是", res);
+        }
+      });
+    },
+
+
+    go_to_roll() {
+      uni.navigateTo({
+        url:'/pages/information/girl_weight_roll/girl_weight_roll'
+      })
+      height:''
+    },
+  }
+}
+
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("/static/information/girl_weight/pictures/img.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+/* Human 动画，从页面中部向上移动 */
+.human {
+  position: absolute;
+  width: 100%;
+  height: 90%;
+  top:10%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: moveUp 2s ease forwards;
+  top: 30%; /* 起始位置 */
+  transform: translateY(-50%); /* 垂直居中 */
+}
+
+.progress{
+  position: absolute;
+  width: 77%;
+  height: 7%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 2%; /* 根据需要调整位置 */
+}
+
+/* Text 延迟显示 */
+.roll {
+  position: absolute;
+  width: 77%;
+  height: 20%;
+  object-fit: contain; /* 保持图片比例 */
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  top: 55%; /* 根据需要调整位置 */
+}
+
+/* Button 延迟显示并加缩放特效，放在下方 */
+.button {
+  position: absolute;
+  height: 13%;
+  width: 80%;
+  animation: fadeInScale 1s ease 2.5s forwards; /* 2.5秒后显示并缩放 */
+  opacity: 0;
+  right: 10%; /* 距右边 10% */
+  bottom: 2%; /* 距底部 3.5% */
+}
+
+.text{
+  position: absolute;
+  font-size: 1.5em;
+  text-align: center;
+  width: 100%;
+  height: 20%;
+  top: 69%;
+  animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
+  opacity: 0;
+  color:#ffffff;
+}
+
+/* 定义 human 上移动画 */
+@keyframes moveUp {
+  from {
+    top: 70%;
+  }
+  to {
+    top: 35%; /* 移动到页面顶部 10% */
+  }
+}
+
+/* Text 和 Button 的渐入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* Button 的缩放渐入动画 */
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+</style>

pages/information/information/information.vue

@@ -1,17 +0,0 @@
-<template>
-    <view>
-
-    </view>
-</template>
-
-<script>
-    export default {
-        data() {
-            return {};
-        }
-    }
-</script>
-
-<style lang="scss">
-
-</style>

pages/information/purpose/purpose.vue

@@ -0,0 +1,102 @@
+<template>
+  <view class="background">
+    <!-- Swiper 轮播图 -->
+    <swiper
+        class="swiper-container"
+        autoplay="3000"
+        circular
+        :current="current"
+        @change="onSwiperChange"
+    >
+      <swiper-item v-for="(image, index) in images" :key="index">
+        <image :src="image" class="swiper-image"></image>
+      </swiper-item>
+    </swiper>
+
+    <!-- 动态切换的轮播点 -->
+    <image :src="dotImages[current]" class="dot"></image>
+
+    <!-- 按钮效果 -->
+    <image class="button" @click="click" src="/static/information/purpose/pictures/button.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      images: [
+        '/static/information/purpose/pictures/picture1.png',
+        '/static/information/purpose/pictures/picture2.png',
+        '/static/information/purpose/pictures/picture3.png',
+        '/static/information/purpose/pictures/picture4.png',
+        '/static/information/purpose/pictures/picture5.png',
+      ], // Swiper 轮播图片
+      dotImages: [
+        '/static/information/purpose/pictures/dot1.png',
+        '/static/information/purpose/pictures/dot2.png',
+        '/static/information/purpose/pictures/dot3.png',
+        '/static/information/purpose/pictures/dot4.png',
+        '/static/information/purpose/pictures/dot5.png',
+      ], // 轮播点图片
+      current: 0, // 当前显示的图片索引
+    };
+  },
+  methods: {
+    click() {
+      uni.navigateTo({
+        url: '/pages/transition/page8/page8', // 跳转到进入主页前的过渡界面
+      });
+    },
+    onSwiperChange(e) {
+      this.current = e.detail.current;
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("/static/information/purpose/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-end;
+  position: relative;
+}
+
+.swiper-container {
+  width: 100%;
+  height: 80%; /* 根据需要调整轮播图高度 */
+  bottom: 10%;
+}
+
+.swiper-image {
+  width: 80%;
+  height: 70%;
+  position: absolute;
+  top: 40%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  object-fit: cover; /* 保持图片比例 */
+}
+
+.dot {
+  position: absolute;
+  width: 22%;
+  height: 3%;
+  bottom: 15%;
+}
+
+.button {
+  position: absolute;
+  width: 90%;
+  height: 13%;
+  bottom: 1%;
+  left: 50%;
+  transform: translateX(-50%);
+}
+</style>

pages/information/sex/sex.vue

@@ -0,0 +1,140 @@
+<template>
+  <view class="background">
+    <!-- human 图片，带有渐变效果 -->
+    <image
+        class="human"
+        :class="{ 'fade-in': isHumanVisible }"
+        src="/static/information/sex/pictures/human.png"
+    ></image>
+
+    <!-- 男生按钮 -->
+    <image
+        class="boy_image"
+        @click="clickBoyImage"
+        v-if="!isBoySelected"
+        :class="{ 'slide-in-left': !isBoySelected }"
+        src="/static/information/sex/pictures/boy.png"
+    ></image>
+    <image
+        class="boy_image"
+        @click="clickBoyImage"
+        v-else
+        :class="{ 'slide-in-left': !isBoySelected }"
+        src="/static/information/sex/pictures/shift_boy.png"
+    ></image>
+
+    <!-- 女生按钮 -->
+    <image
+        class="girl_image"
+        @click="clickGirlImage"
+        v-if="!isGirlSelected"
+        :class="{ 'slide-in-right': !isGirlSelected }"
+        src="/static/information/sex/pictures/girl.png"
+    ></image>
+    <image
+        class="girl_image"
+        @click="clickGirlImage"
+        v-else
+        :class="{ 'slide-in-right': !isGirlSelected }"
+        src="/static/information/sex/pictures/shift_girl.png"
+    ></image>
+
+    <!-- 底部下一步按钮 -->
+    <image
+        class="button"
+        @click="goToNextPage"
+        src="/static/information/sex/pictures/button.png"
+    ></image>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isBoySelected: false,
+      isGirlSelected: false,
+      isHumanVisible: false, // 控制 human 图片显示
+      sex:-1,//性别 用1表示男 0表示女
+      token:uni.getStorageSync("access_token")
+
+    };
+  },
+  mounted() {
+    const app = getApp();
+    console.log('Token:', app.globalData.token);
+    console.log('Address:', app.globalData.fit_journey_basic_address);
+    // 页面加载时延时显示 human 图片
+    setTimeout(() => {
+      this.isHumanVisible = true;
+    }, 100); // 延迟 100ms 开始渐变，可以根据需求调整
+  },
+  methods: {
+	  
+	  goToNextPage() {
+	    console.log('调用函数成功！'); // 确认方法被调用
+	    // 获取全局变量
+	    const app = getApp();
+	    console.log('传递的token是:',this.token); // 打印 Token
+	    console.log('后端的地址是', app.globalData.fit_journey_basic_address); // 打印地址
+	  
+	    uni.request({
+	      url: app.globalData.fit_journey_basic_address + '/sex/write_user_sex',
+	      method: 'POST',
+	      header: {
+	        'content-type': 'application/x-www-form-urlencoded',
+	        'Authorization': this.token
+	      },
+	      data: {
+	        sex: this.sex
+	      },
+
+	      success: (res) => {
+	        console.log('Response:', res.data); // 打印后端返回的数据
+          uni.showToast({
+            title: '提交成功',
+            icon: 'success',
+          })
+		  	console.log("开始跳转页面");
+	        // 仅在请求成功后进行页面跳转
+	        const targetPage = this.isBoySelected
+	          ? "/pages/information/boy_weight_start/boy_weight_start"
+	          : "/pages/information/girl_weight_start/girl_weight_start";
+	        uni.navigateTo({
+	          url: targetPage,
+	        });
+	      },
+	      fail: (err) => {
+	        console.error('请求失败:', err); // 打印请求失败的错误信息
+	      }
+	    });
+	  },
+
+
+
+    clickBoyImage() {
+      this.sex=1;//表示是男生
+      this.isBoySelected = true;
+      this.isGirlSelected = false;
+    },
+    clickGirlImage() {
+      this.sex=0;//表示是女生
+      this.isGirlSelected = true;
+      this.isBoySelected = false;
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+@import "@/static/information/sex/css/sex.css";
+
+/* 渐变效果样式 */
+.human {
+  opacity: 0; /* 初始透明 */
+  transition: opacity 1.5s ease-in-out; /* 渐变持续时间和效果 */
+}
+.fade-in {
+  opacity: 1; /* 最终完全显示 */
+}
+</style>

pages/login/account_login/account_login.vue

@@ -1,17 +1,361 @@
 <template>
-  <view>
+  <view class="background">
+	<!-- 欢迎 -->
+	<image class="welcome" src="../../../static/login/account_login/welcome.png"></image>
+	<!-- 登录部分 -->
+	<view class="login_part">
+		<!-- 导航栏 -->
+		<view class="login_ways">
 
+			<view class="account_words" @click="toPassageEvent" 
+				:style="{borderBottom:passageWordsBottomBorder}">
+				密码登录
+			</view>
+
+
+			<view class="captcha_words" @click="toCaptchaEvent" 
+				:style="{borderBottom:captchaWordsBottomBorder}">
+				验证码登录
+			</view>
+		</view>
+
+
+		<!-- 表单部分 -->
+		<form class="login_form">
+			<view class="form_input">
+				<!-- 账号输入框 -->
+				<view class="account_box login_form_item">
+					<view class="form_input_box">
+						<input class="account" v-model="phone_number" type="text" placeholder="请输入你的电话号码"/>
+					</view>
+					<view class="error_tip" v-if="isPhoneError">*该手机号未注册</view>
+				</view>
+				<!-- 密码输入框 -->
+				<view class="passage_box login_form_item" v-if="isPassagePage">
+					<view class="form_input_box passage_input_box">
+						<input class="passage" v-model="password" :password="isOpened" type="text" placeholder="请输入你的密码"/>
+						<image @click="openEyesEvent" class="eyes" :src="eyesStateIcon"></image>
+					</view>
+					<view class="error_tip" v-if="isPassageError">*密码错误</view>
+				</view>
+
+
+
+
+				<!-- 验证码输入框 -->
+				<view class="captcha_box login_form_item" v-else>
+					<view class="form_input_box captcha_input_box">
+						<input class="captcha"  v-model="code" name="captcha" type="text" placeholder="请输入你的验证码"/>
+						<button class="captcha_button" @click="sendCaptchaEvent" 
+							:style="{color:captchaButtonColor, backgroundColor:captchaButtonBackgroundColor}">
+							{{captchaButtonText}}
+						</button>
+					</view>
+					<view class="error_tip" v-if="isCaptchaError">*验证码错误</view>
+				</view>
+				<view class="forget_passage" @click="forgetPassageClick">忘记密码？</view>
+				<view class="button_box login_form_item">
+					<button name="submit_button" class="login_button" @click="login">登录</button>
+				</view>
+			</view>
+		</form>
+
+
+
+
+	</view>
+	<!-- 前往注册 -->
+	<navigator url="/pages/login/register/register">
+		<image class="goto_register" src="../../../static/login/account_login/register.png"></image>
+	</navigator>
+	<!-- 其他登录部分 -->
+<!--	<view class="otherways_part">
+		<image class="otherways_tips" src="../../../static/login/account_login/other_ways.png"></image>
+		<view class="two_ways">
+			<image class="qq_icon" src="../../../static/login/account_login/qq_icon.png"></image>
+			<image class="weixin_icon" src="../../../static/login/account_login/weixin_icon.png"></image>
+		</view>
+	</view>-->
   </view>
 </template>
 
-<script>
-export default {
-  data() {
-    return {};
+<script setup>
+
+import { ref, computed , onMounted } from 'vue';
+import app from "@/App.vue";
+
+const isSendCaptcha = ref(false);	//是否发送了验证码的标志
+var codeTime = ref(0);	//验证码的倒计时
+const captchaButtonBackgroundColor = computed(() => isSendCaptcha.value ? "#ABCBFF" : "#ffffff"); //验证码按钮的背景颜色
+const captchaButtonColor = computed(() => isSendCaptcha.value ? "#ffffff" : "#000364");//验证码按钮的字体颜色
+const captchaButtonText = computed(() => isSendCaptcha.value ? (codeTime.value+"s后重新发送"):"发送验证码")
+
+
+
+const phone_number=ref("");//用户输入的手机号
+const password=ref("");//用户输入的密码
+const code=ref("");//发送的验证码
+const which_way_to_login = ref("0");	//登录方式 使用0为密码登录 使用1为验证码登录
+const access_token = ref("0");	//登录成功后返回的token
+
+
+
+
+
+
+const isPassagePage = ref(true);	//是否是密码登录页的标志；
+const passageWordsBottomBorder = computed(() => isPassagePage.value? "0.1rem solid #094ABC":"none");	//密码登录导航的下边框
+const captchaWordsBottomBorder = computed(() => isPassagePage.value? "none":"0.1rem solid #094ABC");	//验证码登录导航的下边框
+
+const isOpened = ref(true);	//密码是否明文显示的标志
+const eyesStateIcon = ref("../../../static/login/account_login/login_part/closedeyes.png");
+
+const isPhoneError = ref(false);
+const isPassageError = ref(false);
+const isCaptchaError = ref(false);
+onMounted(() => {//页面加载时 登录方式为密码登录
+  which_way_to_login.value= 0;
+  console.log(which_way_to_login.value);
+});
+//进入验证码登录页面
+function toCaptchaEvent(){
+	isPassagePage.value = false;
+  which_way_to_login.value=1;//切换到验证码登录界面
+}
+function sendCaptchaEvent(){
+  // 校验手机号是否是中国手机号
+  const isChinaPhone = /^1[3-9]\d{9}$/.test(phone_number.value);
+  if (!isChinaPhone) {
+    uni.showToast({
+      title: '请输入有效的中国大陆手机号',
+      icon: "none"
+    });
+    return; // 如果手机号无效，停止执行
+  }
+  if (codeTime.value>0){	//说明在倒计时
+		uni.showToast({	//弹出提示框
+			title: '不能重复获取',
+			icon:"none"
+		});
+	} else{	//说明没有发送，也没倒计时
+		codeTime.value = 60;
+		isSendCaptcha.value = true;
+		var timer = setInterval(()=>{
+			codeTime.value--;
+			if(codeTime.value<1){
+				clearInterval(timer);
+				isSendCaptcha.value = false;
+				codeTime.value = 0;
+			}
+		},1000)
+	}
+  //这里向后端执行请求
+  const app = getApp();
+  // 向后端发送请求
+  uni.request({
+    url: app.globalData.fit_journey_login_address + '/phone_code_register/getPhoneCode',
+    method: 'POST',
+    header: {
+      'content-type': 'application/x-www-form-urlencoded',
+    },
+    data: {
+      phone:String(phone_number.value)
+    },
+    success: (res) => {
+      uni.showToast({
+        title: '发送验证码成功，请注意查收~',
+        icon: "none"
+      });
+
+    },
+    error: (res) => {
+      console.log("请求失败！请求数据是", res);
+    }
+  });
+}
+function login() {
+  //向后端发送请求
+  uni.request({
+    url:app.globalData.fit_journey_login_address+'/common/isPhoneRegistered',
+    header: {
+      'content-type': 'application/x-www-form-urlencoded',
+    },
+    method:'GET',
+    data:{
+      phone:phone_number.value,
+    },
+    success:(res)=>{
+      console.log(res);
+      if(res.data.code===200){
+        uni.showToast({
+          title: '手机号未注册或输入错误~',
+          icon: "none"
+        });
+        return 0;
+      }
+    },
+  })
+  console.log(which_way_to_login.value);
+  if (which_way_to_login.value === 0) {	//密码登录
+    console.log("这里开始运行了");
+    // 获取后端服务器地址
+    const serverAddress = app.globalData.fit_journey_login_address + '/AccountLogin/PhonePasswordLogin';
+    console.log("后端服务器的地址是" + serverAddress);
+    console.log("发送的账号是" + String(phone_number.value));
+    console.log("发送的密码是" + String(password.value));
+    if(phone_number.value==null||code.value==null){
+      uni.showToast({
+        title: '手机号和密码不能为空',
+        icon: "none"
+      });
+    }
+    // 向后端发送请求
+    uni.request({
+      url: serverAddress,
+      method: 'POST',
+      header: {
+        'content-type': 'application/x-www-form-urlencoded',
+      },
+      data: {
+         phone: String(phone_number.value),
+        password: String(password.value)
+      },
+      success: (res) => {
+        if (res.statusCode === 500) {
+          uni.showToast({
+            title: '账号或密码错误',
+            icon: "none"
+          });
+        } else {
+          uni.showToast({
+            title: '登录成功',
+            icon: "none"
+          });
+          access_token.value = res.data.data.token;
+          console.log("登录成功!从后端收集的token是：", access_token.value);
+          // 存储 token 到本地
+          uni.setStorage({
+            key: 'access_token', // 本地存储的键名
+            data: access_token.value, // 存储的值
+            success: () => {
+              console.log("Token 已存储到本地！");
+            },
+            fail: () => {
+              console.error("Token 存储失败！");
+            }
+          });
+          console.log(access_token.value);
+          console.log("登录成功!从后端收集的token是：", uni.getStorageSync('access_token'));
+          uni.navigateTo({
+            url: '/pages/information/sex/sex'//登录成功后跳转的页面
+          })
+        }
+      },
+      error: (res) => {
+        console.log("请求失败！请求数据是", res);
+        uni.showToast({
+          title: '登录失败，服务器错误',
+          icon: "none"
+        });
+      }
+    });
+  } else {	//验证码登录
+    console.log("验证码登录部分开始运行了");
+    // 获取后端服务器地址
+    const serverAddress = app.globalData.fit_journey_login_address + '/PhoneLogin/phoneLogin';
+    console.log("后端服务器的地址是" + serverAddress);
+    console.log("发送的账号是" + String(phone_number.value));
+    console.log("发送的code是" + String(code.value));
+    if(phone_number.value==null||code.value==null){
+      uni.showToast({
+        title: '手机号和验证码不能为空',
+        icon: "none"
+      });
+    }
+    // 向后端发送请求
+    uni.request({
+      url: serverAddress,
+      method: 'POST',
+      header: {
+        'content-type': 'application/x-www-form-urlencoded',
+      },
+      data: {
+        phone: String(phone_number.value),
+        code: String(code.value)
+      },
+      success: (res) => {
+        console.log(res);
+        if (res.statusCode === 500) {
+          uni.showToast({
+            title: '账号或密码错误,或账号没有进行注册',
+            icon: "none"
+          });
+        } else {
+          uni.showToast({
+            title: '登录成功',
+            icon: "none"
+          });
+          access_token.value = res.data.data.token;
+          console.log("登录成功!从后端收集的token是：", access_token.value);
+          // 存储 token 到本地
+          uni.setStorage({
+            key: 'access_token', // 本地存储的键名
+            data: access_token.value, // 存储的值
+            success: () => {
+              console.log("Token 已存储到本地！");
+            },
+            fail: () => {
+              console.error("Token 存储失败！");
+            }
+          });
+          console.log(access_token.value);
+          console.log("登录成功!从后端收集的token是：", uni.getStorageSync('access_token'));
+
+          //登录成功进行界面的跳转操作
+          uni.navigateTo({
+            url: '/pages/information/sex/sex'//登录成功后跳转的页面
+          })
+        }
+      },
+      error: (res) => {
+        console.log("请求失败！请求数据是", res);
+        uni.showToast({
+          title: '登录失败，服务器错误',
+          icon: "none"
+        })
+      }
+    })
   }
 }
-</script>
+//进入密码登录页面
+function toPassageEvent(){
+	isPassagePage.value = true;
+  which_way_to_login.value=0;
+}
+// 判断密码是否要明文显示
+function openEyesEvent()
+{
+	if (isOpened.value)
+	 {
+		 isOpened.value = false;
+		 eyesStateIcon.value = "../../../static/login/account_login/login_part/openedeyes.png"
+	 }
+	else
+	 {
+		 isOpened.value =true;
+		 eyesStateIcon.value = "../../../static/login/account_login/login_part/closedeyes.png";
+	 }
+}
 
+function forgetPassageClick(){
+	//TODO:进入到忘记密码界面
+	uni.navigateTo({
+		url:'/pages/login/forget_password/forget_password',
+		animationType: 'pop-in',
+		animationDuration: 200
+	})
+}
+</script>
 <style lang="scss">
-
+@import "@/static/login/account_login/css/acccount_login.scss";
 </style>

pages/login/change_password/change_password.vue

@@ -0,0 +1,181 @@
+<template>
+	<view class="change_password_box">
+		<!-- 返回图标 -->
+		<navigator url="/pages/login/forget_password/forget_password">
+			<image class="return_image" src="../../../static/login/change_password/pictures/return_icon.png"></image>
+		</navigator>
+		<!-- 修改密码文字 -->
+		<view class="change_passage_words">修改密码</view>
+		<!-- 表单 -->
+		<form class="change_password_form">
+			<!-- 密码输入 -->
+			<view class="passage_box change_password_form_item">
+				<view class="form_input_box passage_input_box">
+					<input type="text"  v-model="first_input_password" class="passage" :password="isOpened_1" placeholder="请输入你的密码"/>
+					<image @click="openEyesEvent_1" class="eyes" :src="eyesStateIcon_1"></image>
+				</view>
+				<!-- <view class="error_tip" v-if="isPassageError">*密码错误</view> -->
+			</view>
+			<!-- 确认密码输入 -->
+			<view class="passage_box change_password_form_item">
+				<view class="form_input_box passage_input_box">
+					<input type="text"  v-model="second_input_password" class="passage" :password="isOpened_2" placeholder="请再次确认密码"/>
+					<image @click="openEyesEvent_2" class="eyes" :src="eyesStateIcon_2"></image>
+				</view>
+				<view class="error_tip" v-if="isPassageSameError">*两次密码不相同</view>
+			</view>
+			<!-- 注册按钮 -->
+			<view class="ensure_button_box change_password_form_item">
+				<button class="ensure_button" @click="ensureClickEvent">确认修改</button>
+			</view>
+		</form>
+		<!-- 修改成功弹窗 -->
+		<my_pop_up
+			class="change_tip"
+			@onClick="onOpenUpClick"
+			@onClose="onClosePopUPClick"
+			:is-opened="isOpenPopUp"  
+			:title="title" 
+			:content="content"
+		></my_pop_up>
+	</view>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue';
+
+const isPassageSameError = ref(false);
+
+const first_input_password = ref('');	//第一次输入的密码
+const second_input_password= ref('');	//第二次输入的密码
+const phone_number = ref('');	//手机号
+const code= ref('');	//验证码
+
+
+
+const title = '成功';	//弹窗标题
+const content = '密码修改成功'; //弹窗内容
+const isOpenPopUp = ref(false);//是否显示弹窗
+
+const isOpened_1 = ref(true);	//输入框是否密码显示的标志
+const eyesStateIcon_1 = ref("../../../static/login/change_password/pictures/closedeyes.png");
+const isOpened_2 = ref(true);	//输入框是否密码显示的标志
+const eyesStateIcon_2 = ref("../../../static/login/change_password/pictures/closedeyes.png");
+// 使用 onLoad 获取传递的参数
+onMounted(() => {
+  const options = getCurrentPages()[getCurrentPages().length - 1].options;
+  phone_number.value = options.phone_number || '';
+  code.value = options.code || '';
+  console.log('接收到的手机号是：', phone_number.value);
+  console.log('接收到的验证码是：', code.value);
+});
+// 判断密码是否要明文显示
+function openEyesEvent_1(){
+	if (isOpened_1.value)
+	{
+		isOpened_1.value = false;
+		eyesStateIcon_1.value = "../../../static/login/change_password/pictures/openedeyes.png";
+	}
+	else
+	{
+		isOpened_1.value =true;
+		eyesStateIcon_1.value = "../../../static/login/change_password/pictures/closedeyes.png";
+	 }
+}
+// 判断确认的密码是否要明文显示
+function openEyesEvent_2(){
+	if (isOpened_2.value)
+	{
+		isOpened_2.value = false;
+		eyesStateIcon_2.value = "../../../static/login/change_password/pictures/openedeyes.png";
+	}
+	else
+	{
+		isOpened_2.value =true;
+		eyesStateIcon_2.value = "../../../static/login/change_password/pictures/closedeyes.png";
+	 }
+}
+
+//确认修改按钮点击事件
+function ensureClickEvent(){
+  console.log(phone_number.value);
+  console.log(first_input_password.value);
+  console.log(second_input_password.value);
+  console.log(code.value);
+  if(first_input_password.value !== second_input_password.value){
+    uni.showToast({
+      title: '两次密码不相同',
+      icon: "none"
+    });
+    isPassageSameError.value = true;
+  }
+  if(first_input_password.value.length<6||first_input_password.value.length>10){
+    uni.showToast({
+      title: '密码必须在6-10位之间',
+      icon: "none"
+    });
+  }
+  //向后端发送请求
+  //这里向后端执行请求
+  const app = getApp();
+  // 向后端发送请求
+  uni.request({
+    url: app.globalData.fit_journey_login_address + '/ForgetPassword/FindPassword',
+    method: 'POST',
+    header: {
+      'content-type': 'application/x-www-form-urlencoded',
+    },
+    data: {
+      phone:String(phone_number.value),
+      code:String (code.value),
+      newPassword:String(first_input_password.value)
+    },
+    success: (res) => {
+      if(res.data.code===200){
+        uni.showToast({
+          title: '修改密码成功！',
+          icon: "none"
+        });
+      }else if(res.data.code===400){
+        uni.showToast({
+          title: '修改密码失败！',
+          icon: "none"
+        });
+      }
+      uni.navigateTo({
+        url: '/pages/login/account_login/account_login',
+        animationType: 'pop-in',
+        animationDuration: 200
+      });
+    },
+    error: (res) => {
+      console.log("请求失败！请求数据是", res);
+      uni.showToast({
+        title: '发送验证码成功，请注意查收~',
+        icon: "none"
+      });
+    }
+  });
+
+
+	/*console.log('密码确认修改');
+	isOpenPopUp.value = true;	//显示弹窗*/
+}
+function onOpenUpClick(){
+	//TODO:跳转到登录界面
+	uni.navigateTo({
+		url: '/pages/login/account_login/account_login',
+		animationType: 'pop-in',	//动画，但好像没作用
+		animationDuration: 200
+	});
+}
+function onClosePopUPClick(){
+	//TODO:关闭弹窗
+	isOpenPopUp.value = false;
+}
+
+</script>
+
+<style lang="scss">
+@import "@/static/login/change_password/css/change_password.scss";
+</style>

pages/login/forget_password/forget_password.vue

@@ -0,0 +1,249 @@
+<template>
+  <view class="forget_passage_box">
+	<!-- 返回图标 -->
+	<navigator url="/pages/login/account_login/account_login">
+		<image class="return_image" src="../../../static/login/forget_password/pictures/return_icon.png"></image>
+	</navigator>
+	<!-- 忘记密码文字 -->
+	<view class="forget_passage_words">忘记密码</view>
+	<!-- 表单 -->
+	<form class="forget_passage_form">
+		<!-- 手机号输入 -->
+		<view class="phone_number_box forget_passage_form_item">
+			<view class="form_input_box">
+				<input type="text"  v-model="phone_number" class="phone_number" placeholder="请输入你的电话号码"/>
+			</view>
+			<view class="error_tip" v-if="isPhoneError">*该手机号未注册</view>
+		</view>
+		<!-- 验证码输入 -->
+		<view class="captcha_box forget_passage_form_item">
+			<view class="form_input_box captcha_input_box">
+				<input type="text"  v-model="code" class="captcha" placeholder="请输入你的验证码"/>
+				<button class="captcha_button" @click="sendCaptchaEvent"
+					:style="{color:captchaButtonColor, backgroundColor:captchaButtonBackgroundColor}">
+					{{captchaButtonText}}
+				</button>
+			</view>
+			<view class="error_tip" v-if="isCaptchaError">*验证码错误</view>
+		</view>
+		<!-- 下一步按钮 -->
+		<view class="forget_passage_button_box forget_passage_form_item">
+			<button class="forget_passage_button" @click="nextClickEvent">下一步</button>
+		</view>
+	</form>
+  </view>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue';
+const  code = ref("");
+const isPhoneError = ref(false);
+const isCaptchaError = ref(false);
+const phone_number =ref("");
+const isSendCaptcha = ref(false);	//是否发送了验证码的标志
+var codeTime = ref(0);	//验证码的倒计时
+const captchaButtonBackgroundColor = computed(() => isSendCaptcha.value ? "#ABCBFF" : "#ffffff"); //验证码按钮的背景颜色
+const captchaButtonColor = computed(() => isSendCaptcha.value ? "#ffffff" : "#000364");//验证码按钮的字体颜色
+const captchaButtonText = computed(() => isSendCaptcha.value ? (codeTime.value+"s后重新发送"):"发送验证码");
+
+
+function sendCaptchaEvent(){
+  // 校验手机号是否是中国手机号
+  const isChinaPhone = /^1[3-9]\d{9}$/.test(phone_number.value);
+  if (!isChinaPhone) {
+    uni.showToast({
+      title: '请输入有效的中国大陆手机号',
+      icon: "none"
+    });
+    return; // 如果手机号无效，停止执行
+  }
+  if (codeTime.value>0){	//说明在倒计时
+    uni.showToast({	//弹出提示框
+      title: '不能重复获取',
+      icon:"none"
+    });
+  } else{	//说明没有发送，也没倒计时
+    codeTime.value = 60;
+    isSendCaptcha.value = true;
+    var timer = setInterval(()=>{
+      codeTime.value--;
+      if(codeTime.value<1){
+        clearInterval(timer);
+        isSendCaptcha.value = false;
+        codeTime.value = 0;
+      }
+    },1000)
+  }
+  //这里向后端执行请求
+  const app = getApp();
+  // 向后端发送请求
+  uni.request({
+    url: app.globalData.fit_journey_login_address + '/phone_code_register/getPhoneCode',
+    method: 'POST',
+    header: {
+      'content-type': 'application/x-www-form-urlencoded',
+    },
+    data: {
+      phone:String(phone_number.value)
+    },
+    success: (res) => {
+      uni.showToast({
+        title: '发送验证码成功，请注意查收~',
+        icon: "none"
+      });
+
+    },
+    error: (res) => {
+      console.log("请求失败！请求数据是", res);
+    }
+  });
+}
+//进入下一步，修改密码
+function nextClickEvent() {
+
+
+
+  const isChinaPhone = /^1[3-9]\d{9}$/.test(phone_number.value);
+  if (!isChinaPhone) {
+    uni.showToast({
+      title: '请输入有效的中国大陆手机号',
+      icon: "none"
+    });
+    return; // 如果手机号无效，停止执行
+  }
+  // 使用 encodeURIComponent 确保参数中没有特殊字符导致错误
+  const encodedPhoneNumber = encodeURIComponent(phone_number.value);
+  const encodedCode = encodeURIComponent(code.value);
+  console.log("携带参数跳转",phone_number.value,code.value);
+  uni.navigateTo({
+    url: `/pages/login/change_password/change_password?phone_number=${encodedPhoneNumber}&code=${encodedCode}`,
+    animationType: 'pop-in',
+    animationDuration: 200
+  });
+}
+
+</script>
+
+<style lang="scss">
+	.forget_passage_box{
+		background-image: url("../../../static/login/forget_password/pictures/background.png");
+		background-size: cover;
+		background-position: center;
+		height: 100vh;
+		width: auto;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		position: relative;
+		object-fit: contain;
+		// 返回图标
+		.return_image{
+			position: absolute;
+			left: 16.5%;
+			right: 80.1%;
+			top: 8.62%;
+			bottom: 89.09%;
+			width: 0.8rem;
+			height: auto;
+			object-fit: contain;
+		}
+		//忘记密码文字
+		.forget_passage_words{
+			position: absolute;
+			left: 12.4%;
+			top: 30.8%;
+			font-family: 'PingFang SC';
+			font-size: 1.4rem;
+			color: #000364;
+		}
+		//忘记密码表单
+		.forget_passage_form{
+			position: absolute;
+			width: 74.5%;
+			height: 33.6%;
+			top: 40%;
+			//每个表单项
+			.forget_passage_form_item{
+			// 	height: 15.6%;
+			// 	margin-bottom: 5%;
+			// }
+				height: auto;
+				margin-bottom: 5%;
+				.form_input_box{
+					padding-left: 3%;
+					padding-right: 3%;
+					background-color: #D5E9FF;
+					border-radius: 12px;
+				}
+				.error_tip{
+					margin-top: 0.6vh;
+					padding-left: 3%;
+					font-size: 0.8rem;
+					color: #FF1E1E;
+				}
+			}
+			//手机号盒子
+			.phone_number_box{
+				display: flex;
+				flex-direction: column;
+					.phone_number{
+						height: 5.5vh;
+						padding-left: 11%;
+						background-image: url("../../../static/login/forget_password/pictures/phone_icon.png");
+						background-repeat: no-repeat;
+						background-size: 0.8rem;
+						background-position: 3% 50%;
+						background-color: #D5E9FF;
+						font-size: 0.8rem;
+					}
+			}
+			// 验证码盒子
+			.captcha_box{
+				display: flex;
+				flex-direction: column;
+				.captcha_input_box{
+					display: flex;
+					align-items: center;
+					padding-left: 3%;
+					background-color: #D5E9FF;
+					border-radius: 12px;
+					position: relative;
+					.captcha{
+						height: 5.5vh;
+						padding-left: 11%;
+						background-image: url("../../../static/login/forget_password/pictures/captcha_icon.png");
+						background-repeat: no-repeat;
+						background-size: 0.8rem;
+						background-position: 4.5% 50%;
+						font-size: 0.8rem;
+					}
+					.captcha_button{
+						/* 发送验证码 */
+						width: 5.5rem;
+						height: 1.9rem;
+						border-radius: 15px;
+						font-size: 0.8rem;
+						color: #000364;
+						position: absolute;
+						right: 5%;
+					}
+				}
+			}
+			//下一个按钮
+			.forget_passage_button{
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				margin-top: 8%;
+				height: 5.5vh;
+				border-radius: 12px;
+				background-color: #4A69F7;
+				color: #FFFCFC;
+				text-align: center;
+				font-size: 1.2rem;
+			}
+		}
+	}
+
+</style>

pages/login/index/index.vue

@@ -1,52 +0,0 @@
-<template>
-	<view class="content">
-		<image class="logo" src="/static/logo.png"></image>
-		<view class="text-area">
-			<text class="title">{{title}}</text>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				title: 'Hello'
-			}
-		},
-		onLoad() {
-
-		},
-		methods: {
-
-		}
-	}
-</script>
-
-<style>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin-top: 200rpx;
-		margin-left: auto;
-		margin-right: auto;
-		margin-bottom: 50rpx;
-	}
-
-	.text-area {
-		display: flex;
-		justify-content: center;
-	}
-
-	.title {
-		font-size: 36rpx;
-		color: #8f8f94;
-	}
-</style>

pages/login/phone_login/phone_login.vue

@@ -1,17 +0,0 @@
-<template>
-  <view>
-
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {};
-  }
-}
-</script>
-
-<style lang="scss">
-
-</style>

pages/login/register/register.vue

@@ -1,17 +1,542 @@
 <template>
-  <view>
-
+  <view class="register_box">
+	<!-- 返回图标 -->
+	<navigator url="/pages/login/account_login/account_login">
+		<image class="return_image" src="../../../static/login/register/pictures/return_icon.png"></image>
+	</navigator>
+	<!-- 欢迎文字 -->
+	<view class="welcom_words">Hi,欢迎加入</view>
+	<!-- 软件名称 -->
+	<view class="soft_name">Fit Journey</view>
+	<!-- 注册表单 -->
+	<form class="register_form">
+		<!-- 手机号输入 -->
+		<view class="phone_number_box register_form_item">
+			<view class="form_input_box">
+				<input v-model="phone_number" type="text" class="phone_number" placeholder="请输入你的电话号码"/>
+			</view>
+			<view class="error_tip" v-if="isPhoneError">*该手机号不存在</view>
+		</view>
+		<!-- 验证码输入 -->
+		<view class="captcha_box register_form_item">
+			<view class="form_input_box captcha_input_box">
+				<input v-model="code" class="captcha" name="captcha" type="text" placeholder="请输入你的验证码"/>
+				<button class="captcha_button" @click="sendCaptchaEvent" 
+					:style="{color:captchaButtonColor, backgroundColor:captchaButtonBackgroundColor}">
+					{{captchaButtonText}}
+				</button>
+			</view>
+			<view class="error_tip" v-if="isCaptchaError">验证码错误</view>
+		</view>
+		<!-- 密码输入 -->
+		<view class="passage_box register_form_item">
+			<view class="form_input_box passage_input_box">
+				<input v-model="passagenum" type="text" class="passage" :password="isOpened_1" placeholder="请输入你的密码"/>
+				<image @click="openEyesEvent_1" class="eyes" :src="eyesStateIcon_1"></image>
+			</view>
+			<!-- <view class="error_tip" v-if="isPassageError">*密码错误</view> -->
+		</view>
+		<!-- 确认密码输入 -->
+		<view class="passage_box register_form_item">
+			<view class="form_input_box passage_input_box">
+				<input v-model="passagesamenum" type="text" class="passage" :password="isOpened_2" placeholder="请再次确认密码"/>
+				<image @click="openEyesEvent_2" class="eyes" :src="eyesStateIcon_2"></image>
+			</view>
+			<view class="error_tip" v-if="isPassageSameError">*两次密码不相同</view>
+		</view>
+		<!-- 注册按钮 -->
+		<view class="register_button_box register_form_item">
+			<button class="register_button" @click="registerEvent">注册</button>
+		</view>
+	</form>
+	<!-- 成功弹窗 -->
+	<my_pop_up
+		class="register_tip"
+		@onClick="onOpenUpClick"
+		@onClose="onClosePopUPClick"
+		:isOpened="isOpenPopUp"
+		:title="title"
+		:content="content"
+	></my_pop_up>
   </view>
 </template>
 
-<script>
-export default {
-  data() {
-    return {};
+<script setup>
+/*-----------------------------------------------------------外部导入-------------------------------------------*/
+import { ref, computed } from 'vue';
+
+
+/*-----------------------------------------------------------变量----------------------------------------------*/
+/*导入的全局变量*/
+const app = getApp();
+
+/*手机号框相关变量*/
+const phone_number = ref("");	//手机号
+const isPhoneError = ref(false);//手机号是否错误
+const code=ref("");
+/*验证码框相关变量*/
+const isCaptchaError = ref(false);	//验证码是否错误
+const isSendCaptcha = ref(false);	//是否发送了验证码的标志
+var codeTime = ref(0);	//验证码的倒计时
+const captchaButtonBackgroundColor = computed(() => isSendCaptcha.value ? "#ABCBFF" : "#ffffff"); //验证码按钮的背景颜色
+const captchaButtonColor = computed(() => isSendCaptcha.value ? "#ffffff" : "#000364");//验证码按钮的字体颜色
+const captchaButtonText = computed(() => isSendCaptcha.value ? (codeTime.value+"s后重新发送"):"发送验证码");
+
+/*密码框相关变量*/
+const passagenum = ref();	//密码
+const passagesamenum = ref();	//第二次输入的密码
+const isPassageSameError = ref(false);//密码是否相同
+const isOpened_1 = ref(true);	//输入框是否密码显示的标志
+const eyesStateIcon_1 = ref("../../../static/login/register/pictures/closedeyes.png");
+const isOpened_2 = ref(true);	//输入框是否密码显示的标志
+const eyesStateIcon_2 = ref("../../../static/login/register/pictures/closedeyes.png");
+
+/*注册的相关变量*/
+const isRegisterSuccess = ref(false);	//是否注册成功的标志
+
+/*弹窗相关变量*/
+const title = computed(()=>isRegisterSuccess.value? '成功':'错误');	//弹窗标题
+const content = computed(()=>isRegisterSuccess.value? '注册成功':'注册失败'); //弹窗内容
+const isOpenPopUp = ref(false);//是否显示弹窗
+
+
+const is_phone_registered = ref();//用0表示手机号没有被注册 1表示手机号被注册
+
+
+
+
+
+/*正则表达式相关变量*/
+const pMatch = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
+
+/*-----------------------------------------------------------函数----------------------------------------------*/
+
+/*-----验证码相关函数-----*/
+
+function checkPhone(){
+	var flag=true
+	//验证手机号
+	if (phone_number.value===undefined){
+		flag = false
+		uni.showToast({	//弹出提示框
+			title: '手机号不能为空',
+			icon:"error",
+		});
+	}else if (!pMatch.test(phone_number.value)){
+		flag = false
+		// isPhoneError.value = true
+		uni.showToast({	//弹出提示框
+			title: '手机号错误',
+			icon:"error",
+		});
+	} else {
+		isPhoneError.value = false
+	}
+	return flag
+}
+
+
+function sendCaptchaEvent(){
+  // 校验手机号是否是中国手机号
+  const isChinaPhone = /^1[3-9]\d{9}$/.test(phone_number.value);
+  if (!isChinaPhone) {
+    uni.showToast({
+      title: '请输入有效的中国大陆手机号',
+      icon: "none"
+    });
+    return; // 如果手机号无效，停止执行
+  }
+  if (codeTime.value>0){	//说明在倒计时
+    uni.showToast({	//弹出提示框
+      title: '不能重复获取',
+      icon:"none"
+    });
+  } else{	//说明没有发送，也没倒计时
+    codeTime.value = 60;
+    isSendCaptcha.value = true;
+    var timer = setInterval(()=>{
+      codeTime.value--;
+      if(codeTime.value<1){
+        clearInterval(timer);
+        isSendCaptcha.value = false;
+        codeTime.value = 0;
+      }
+    },1000)
   }
+  //这里向后端执行请求
+  const app = getApp();
+  // 向后端发送请求
+  uni.request({
+    url: app.globalData.fit_journey_login_address + '/phone_code_register/getPhoneCode',
+    method: 'POST',
+    header: {
+      'content-type': 'application/x-www-form-urlencoded',
+    },
+    data: {
+      phone:String(phone_number.value)
+    },
+    success: (res) => {
+      uni.showToast({
+        title: '发送验证码成功，请注意查收~',
+        icon: "none"
+      });
+
+    },
+    error: (res) => {
+      console.log("请求失败！请求数据是", res);
+    }
+  });
 }
+
+/*-----密码码相关函数-----*/
+
+function openEyesEvent_1(){
+
+	if (isOpened_1.value)
+	{
+		isOpened_1.value = false;
+		eyesStateIcon_1.value = "../../../static/login/register/pictures/openedeyes.png";
+	}
+	else
+	{
+		isOpened_1.value =true;
+		eyesStateIcon_1.value = "../../../static/login/register/pictures/closedeyes.png";
+	 }
+}
+function openEyesEvent_2(){
+
+	if (isOpened_2.value)
+	{
+		isOpened_2.value = false;
+		eyesStateIcon_2.value = "../../../static/login/register/pictures/openedeyes.png";
+	}
+	else
+	{
+		isOpened_2.value =true;
+		eyesStateIcon_2.value = "../../../static/login/register/pictures/closedeyes.png";
+	 }
+}
+
+/*-----注册按钮相关函数-----*/
+
+function checkSubmit(){
+	var flag = true
+  if(code.data===undefined){
+    uni.showToast({
+      title: '验证码不能为空',
+      icon: "error",
+    })
+  }//验证验证码是不是空
+	//验证手机号
+	if (phone_number.value===undefined){
+		flag = false
+		uni.showToast({	//弹出提示框
+			title: '手机号不能为空',
+			icon:"error",
+		});
+	}else if (!pMatch.test(phone_number.value)){
+		flag = false
+		// isPhoneError.value = true
+		uni.showToast({	//弹出提示框
+			title: '手机号错误',
+			icon:"error",
+		});
+	} else {
+		isPhoneError.value = false
+	}
+	//验证密码是否为空
+	if (passagenum.value===undefined){
+		flag = false
+		uni.showToast({	//弹出提示框
+			title: '密码不能为空',
+			icon:"error",
+		});
+	}else if (passagesamenum.value===undefined){
+		//验证第二次密码是否为空
+		flag = false
+		uni.showToast({	//弹出提示框
+			title: '请再输入密码',
+			icon:"error",
+		});
+	}else if(passagenum.value.length < 6 || passagenum.value.length > 10) {
+    flag = false;
+    uni.showToast({
+      title: '密码长度必须为6到10位',
+      icon: "error",
+    });
+  } else if (passagenum.value!==passagesamenum.value){
+		//验证两次密码是否相等
+		flag = false
+		// isPassageSameError.value = true
+		uni.showToast({	//弹出提示框
+			title: '两次密码不相等',
+			icon:"error",
+		});
+	} else{
+		isPassageSameError.value = false
+	}
+	//验证验证码
+	if (code.value===undefined){
+		flag = false
+		// isCaptchaError.value = true
+		uni.showToast({	//弹出提示框
+			title: '验证码为空',
+			icon:"error",
+		});
+	} else{
+		isCaptchaError.value = false
+	}
+	return flag
+}
+
+
+
+
+
+function registerEvent(){
+  console.log(code.value);
+  console.log(phone_number.value);
+  console.log(passagenum.value);
+
+
+  //判断手机号是否被注册  向后端发送请求
+  uni.request({
+    url:app.globalData.fit_journey_login_address+'/common/isPhoneRegistered',
+    header: {
+      'content-type': 'application/x-www-form-urlencoded',
+    },
+    method:'GET',
+    data:{
+      phone:phone_number.value,
+
+    },
+    success:(res)=>{
+      console.log(res);
+       if(res.data.code===400) {
+        is_phone_registered.value=1;
+      }
+    },
+  })
+
+  if(is_phone_registered.value===1){//说明手机号已经被注册了
+    uni.showToast({
+      title: '手机号已经被注册了~',
+      icon: "error",
+    });
+    }
+
+
+	if (checkSubmit()){
+		//手机号注册网络请求
+    console.log("服务器地址是："+app.globalData.fit_journey_login_address);
+		uni.request({
+      url:app.globalData.fit_journey_login_address+'/phone_code_register/registerByPhone',
+      header: {
+        'content-type': 'application/x-www-form-urlencoded',
+      },
+			method:'POST',
+			data:{
+				code:code.value,
+				phone:phone_number.value,
+        password:passagenum.value
+			},
+			success:(res)=>{
+        if(res.data.code === 200) {
+          isRegisterSuccess.value = true
+          isOpenPopUp.value = true
+        }else if(res.data.code===400) {
+          uni.showToast({
+            title: '手机号已经被注册了~',
+            icon: "error",
+          });
+        }else if(res.data.code===401) {
+          uni.showToast({
+            title: '验证码错误~',
+            icon: "error",
+          });
+        }else if(res.data.code===500) {
+          uni.showToast({
+            title: '验证码过期~',
+            icon: "error",
+          });
+          }
+      },
+      fail:(err)=>{
+        isRegisterSuccess.value = false
+        isOpenPopUp.value = true	//显示弹窗
+      }
+    })
+  }
+}
+
+/*-----弹窗相关函数-----*/
+
+function onOpenUpClick(){
+	uni.navigateTo({
+		url: '/pages/login/account_login/account_login',
+		animationType: 'pop-in',
+		animationDuration: 200
+	});
+}
+function onClosePopUPClick(){
+	isOpenPopUp.value = false;
+}
+
 </script>
 
 <style lang="scss">
+	.register_box{
+		background-image: url("../../../static/login/register/pictures/background.png");
+		background-size: cover;
+		background-position: center;
+		height: 100vh;
+		width: auto;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		position: relative;
+		object-fit: contain;
+		// 返回图标
+		.return_image{
+			position: absolute;
+			left: 16.5%;
+			right: 80.1%;
+			top: 8.62%;
+			bottom: 89.09%;
+			width: 0.8rem;
+			height: auto;
+			object-fit: contain;
+		}
+		//欢迎文字
+		.welcom_words{
+			position: absolute;
+			left: 12.4%;
+			top: 30.8%;
+			font-family: 'PingFang SC';
+			font-size: 1.4rem;
+			color: #000364;
+		}
+		//软件名称
+		.soft_name{
+			position: absolute;
+			left: 12.4%;
+			top: 34.5%;
+			font-family: 'PingFang SC';
+			font-size: 1rem;
+			color: #000364;
+		}
+		//注册表单
+		.register_form{
+			position: absolute;
+			width: 74.5%;
+			height: 33.6%;
+			top: 40%;
+				//每个表单项
+				.register_form_item{
+					height: auto;
+					margin-bottom: 5%;
+					.form_input_box{
+						padding-left: 3%;
+						padding-right: 3%;
+						background-color: #D5E9FF;
+						border-radius: 12px;
+					}
+					.error_tip{
+						margin-top: 0.6vh;
+						padding-left: 3%;
+						font-size: 0.8rem;
+						color: #FF1E1E;
+					}
+				}
+				//手机号盒子
+				.phone_number_box{
+					display: flex;
+					flex-direction: column;
+						.phone_number{
+							height: 5.5vh;
+							padding-left: 11%;
+							background-image: url("../../../static/login/register/pictures/phone_icon.png");
+							background-repeat: no-repeat;
+							background-size: 0.8rem;
+							background-position: 3% 50%;
+							background-color: #D5E9FF;
+							font-size: 0.8rem;
+						}
+				}
+				// 验证码盒子
+				.captcha_box{
+					display: flex;
+					flex-direction: column;
+					.captcha_input_box{
+						display: flex;
+						align-items: center;
+						padding-left: 3%;
+						background-color: #D5E9FF;
+						border-radius: 12px;
+						position: relative;
+						.captcha{
+							height: 5.5vh;
+							padding-left: 11%;
+							background-image: url("../../../static/login/register/pictures/captcha_icon.png");
+							background-repeat: no-repeat;
+							background-size: 0.8rem;
+							background-position: 4.5% 50%;
+							font-size: 0.8rem;
+						}
+						.captcha_button{
+							/* 发送验证码 */
+							width: 5.5rem;
+							height: 1.9rem;
+							border-radius: 15px;
+							font-size: 0.8rem;
+							color: #000364;
+							position: absolute;
+							right: 5%;
+						}
+					}
+				}
+				//密码输入盒子；确认密码盒子
+				.passage_box{
+					display: flex;
+					flex-direction: column;
+					.passage_input_box{
+						display: flex;
+						align-items: center;
+						background-color: #D5E9FF;
+						border-radius: 12px;
+						position: relative;
+						.passage{
+							height: 5.5vh;
+							padding-left: 11%;
+							background-image: url("../../../static/login/register/pictures/lock_icon.png");
+							background-repeat: no-repeat;
+							background-size: 0.8rem;
+							background-position: 4.7% 50%;
+							font-size: 0.8rem;
+						}
+						.eyes{
+							width: 1rem;
+							height: 1rem;
+							position: absolute;
+							right: 13%;
+						}
+					}
+				}
+				//注册按钮
+				.register_button{
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					margin-top: 8%;
+					height: 5.5vh;
+					border-radius: 12px;
+					background-color: #4A69F7;
+					color: #FFFCFC;
+					text-align: center;
+					font-size: 1.2rem;
+				}
+		}
+	}
 
 </style>

pages/transition/page1/page1.vue

@@ -1,7 +1,6 @@
 <template>
-  <view class="page1">
-    <!-- 设置图片渐变的效果显示 -->
-  </view>
+<!-- 页面1 图片 -->
+  <view class="page1"></view>
 </template>
 
 <script>

pages/transition/page2/page2.vue

@@ -2,7 +2,7 @@
   <view class="background">
     <!--按钮-->
     <image class="button" @click="click" src="@/static/transition/page2/pictures/button.png"></image>
-    <!--按钮-->
+
   </view>
 </template>
 
@@ -19,6 +19,7 @@ export default {
 </script>
 
 <style lang="scss">
+
 .background {
   background-image: url("@/static/transition/page2/pictures/background.png");
   background-size: cover;
@@ -28,7 +29,7 @@ export default {
   flex-direction: column; /* 纵向排列 */
   align-items: center; /* 水平居中 */
   justify-content: flex-end; /* 使内容向底部对齐 */
-  position: relative; /* 为绝对定位子元素提供相对定位的上下文 */
+  position: relative; //相对自身位置进行偏移的定位方式
 }
 
 .button {

pages/transition/page3/page3.vue

@@ -1,5 +1,8 @@
 <template>
+  <!-- 背景 -->
   <view class="background">
+
+    <image class="blue_background" src="/static/transition/page3/pictures/blue_background.png"></image>
     <!-- 人物 -->
     <image class="human" src="/static/transition/page3/pictures/human.png"></image>
     <!-- 文字 -->
@@ -9,6 +12,9 @@
   </view>
 </template>
 
+
+
+
 <script>
 export default {
   methods: {
@@ -33,16 +39,25 @@ export default {
   overflow: hidden;
   position: relative;
 }
-
+.blue_background{
+ position: absolute;
+  top: 0%;
+  width: 100%;
+  height: 50%;
+  object-fit: cover; /* 保持图片比例 */
+  animation: fadeIn 1s ease forwards; /* 1秒后显示 */
+  opacity: 0;
+}
 /* Human 动画，从页面中部向上移动 */
 .human {
   position: absolute;
-  width: 100%;
+  width: 75%;
   height: 48%;
 
+
   object-fit: contain; /* 保持图片比例 */
   animation: moveUp 2s ease forwards;
-  top: 50%; /* 起始位置 */
+  top: 30%; /* 起始位置 */
   transform: translateY(-50%); /* 垂直居中 */
 }
 
@@ -72,10 +87,10 @@ export default {
 /* 定义 human 上移动画 */
 @keyframes moveUp {
   from {
-    top: 50%;
+    top: 70%;
   }
   to {
-    top: 20%; /* 移动到页面顶部 10% */
+    top: 25.8%; /* 移动到页面顶部 10% */
   }
 }
 

pages/transition/page4/page4.vue

@@ -1,18 +1,21 @@
 <template>
+  <!-- 背景 -->
   <view class="background">
+
+    <image class="blue_background" src="/static/transition/page4/pictures/blue_background.png"></image>
     <!-- 人物 -->
     <image class="human" src="/static/transition/page4/pictures/human.png"></image>
     <!-- 文字 -->
     <image class="text" src="/static/transition/page4/pictures/text.png"></image>
     <!-- 按钮 -->
-    <image class="button" @click="goToPage4" src="/static/transition/page4/pictures/button.png"></image>
+    <image class="button" @click="goToPage5" src="/static/transition/page4/pictures/button.png"></image>
   </view>
 </template>
 
 <script>
 export default {
   methods: {
-    goToPage4() {
+    goToPage5() {
       uni.navigateTo({
         url: '/pages/transition/page5/page5' // 跳转到 page5
       });
@@ -34,28 +37,39 @@ export default {
   position: relative;
 }
 
+.blue_background {
+  position: absolute;
+  top: 0%;
+  width: 100%;
+  height: 50%;
+  object-fit: cover; /* 保持图片比例 */
+  animation: fadeIn 1s ease forwards; /* 1秒后显示 */
+  opacity: 0;
+}
+
 /* Human 动画，从页面中部向上移动 */
 .human {
   position: absolute;
-  width: 100%;
+  width: 75%;
   height: 48%;
 
+
   object-fit: contain; /* 保持图片比例 */
   animation: moveUp 2s ease forwards;
-  top: 50%; /* 起始位置 */
+  top: 30%; /* 起始位置 */
   transform: translateY(-50%); /* 垂直居中 */
 }
 
 /* Text 延迟显示 */
 .text {
   position: absolute;
-  width: 90%;
-  height: 17%;
+  width: 85%;
+  height: 12%;
 
   object-fit: contain; /* 保持图片比例 */
   animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
   opacity: 0;
-  top: 50%; /* 根据需要调整位置 */
+  top: 55%; /* 根据需要调整位置 */
 }
 
 /* Button 延迟显示并加缩放特效，放在右下角 */
@@ -72,10 +86,10 @@ export default {
 /* 定义 human 上移动画 */
 @keyframes moveUp {
   from {
-    top: 50%;
+    top: 70%;
   }
   to {
-    top: 20%; /* 移动到页面顶部 10% */
+    top: 28%; /* 移动到页面顶部 10% */
   }
 }
 
@@ -100,4 +114,4 @@ export default {
     transform: scale(1);
   }
 }
-</style>
+</style>

pages/transition/page5/page5.vue

@@ -1,8 +1,114 @@
 <template>
+  <!-- 背景 -->
+  <view class="background">
+    <image class="blue_background" src="/static/transition/page5/pictures/blue_background.png"></image>
+    <!-- 人物 -->
+    <image class="human" src="/static/transition/page5/pictures/human.png"></image>
+    <!-- 文字 -->
+    <image class="text" src="/static/transition/page5/pictures/text.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="goToPage6" src="/static/transition/page5/pictures/button.png"></image>
+  </view>
 </template>
 
 <script>
+export default {
+  methods: {
+    goToPage6() {
+      uni.navigateTo({
+        url: '/pages/transition/page6/page6' // 跳转到 page6
+      });
+    }
+  }
+}
 </script>
 
-<style>
-</style>
+<style lang="scss">
+.background {
+  background-image: url("/static/transition/page5/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+.blue_background {
+  position: absolute;
+  top: 0%;
+  width: 100%;
+  height: 50%;
+  object-fit: cover;
+  animation: fadeIn 1s ease forwards;
+  opacity: 0;
+}
+
+/* Human 从右侧缓缓移动到屏幕中间 */
+.human {
+  position: absolute;
+  width: 75%;
+  height: 48%;
+  top: 5%;
+  object-fit: contain;
+  animation: slideInLeft 2s ease forwards; /* 定义新的动画 */
+  right: -100%; /* 从屏幕右侧外部开始 */
+  transform: translateX(0);
+}
+
+/* Text 延迟显示 */
+.text {
+  position: absolute;
+  width: 85%;
+  height: 12%;
+  object-fit: contain;
+  animation: fadeIn 1s ease 2s forwards;
+  opacity: 0;
+  top: 55%;
+}
+
+/* Button 延迟显示并加缩放特效，放在右下角 */
+.button {
+  position: absolute;
+  height: 10vh;
+  width: 22vw;
+  animation: fadeInScale 1s ease 2.5s forwards;
+  opacity: 0;
+  right: 5%;
+  bottom: 3%;
+}
+
+/* 定义 human 从右侧移动到中间的动画 */
+@keyframes slideInLeft {
+  from {
+    right: -100%; /* 从屏幕右侧外部开始 */
+  }
+  to {
+    right: 12.5%; /* 到达屏幕中间位置 */
+  }
+}
+
+/* Text 和 Button 的渐入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* Button 的缩放渐入动画 */
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+</style>

pages/transition/page6/page6.vue

@@ -0,0 +1,114 @@
+<template>
+  <!-- 背景 -->
+  <view class="background">
+    <image class="blue_background" src="/static/transition/page6/pictures/blue_background.png"></image>
+    <!-- 人物 -->
+    <image class="human" src="/static/transition/page6/pictures/human.png"></image>
+    <!-- 文字 -->
+    <image class="text" src="/static/transition/page6/pictures/text.png"></image>
+    <!-- 按钮 -->
+    <image class="button" @click="goToPage7" src="/static/transition/page6/pictures/button.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goToPage7() {
+      uni.navigateTo({
+        url: '/pages/transition/page7/page7' // 跳转到 page6
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("/static/transition/page6/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+.blue_background {
+  position: absolute;
+  top: 0%;
+  width: 100%;
+  height: 50%;
+  object-fit: cover;
+  animation: fadeIn 1s ease forwards;
+  opacity: 0;
+}
+
+/* Human 从右侧缓缓移动到屏幕中间 */
+.human {
+  position: absolute;
+  width: 75%;
+  height: 48%;
+  top: 3%;
+  object-fit: contain;
+  animation: slideInLeft 2s ease forwards; /* 定义新的动画 */
+  right: -100%; /* 从屏幕右侧外部开始 */
+  transform: translateX(0);
+}
+
+/* Text 延迟显示 */
+.text {
+  position: absolute;
+  width: 85%;
+  height: 12%;
+  object-fit: contain;
+  animation: fadeIn 1s ease 2s forwards;
+  opacity: 0;
+  top: 55%;
+}
+
+/* Button 延迟显示并加缩放特效，放在右下角 */
+.button {
+  position: absolute;
+  height: 10vh;
+  width: 22vw;
+  animation: fadeInScale 1s ease 2.5s forwards;
+  opacity: 0;
+  right: 5%;
+  bottom: 3%;
+}
+
+/* 定义 human 从右侧移动到中间的动画 */
+@keyframes slideInLeft {
+  from {
+    right: -100%; /* 从屏幕右侧外部开始 */
+  }
+  to {
+    right: 12.5%; /* 到达屏幕中间位置 */
+  }
+}
+
+/* Text 和 Button 的渐入动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+/* Button 的缩放渐入动画 */
+@keyframes fadeInScale {
+  from {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+</style>

pages/transition/page7/page7.vue

@@ -0,0 +1,53 @@
+<template>
+  <view class="background">
+    <!--按钮-->
+    <image class="button" @click="goToLoginPage" src="@/static/transition/page7/pictures/button.png"></image>
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    goToLoginPage() {
+      uni.navigateTo({
+        url: '/pages/login/account_login/account_login' // 跳转到 page3
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.background {
+  background-image: url("@/static/transition/page7/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-end;
+  position: relative;
+}
+
+/* 渐变显示动画 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.button {
+  position: absolute;
+  width: 80%;
+  height: 12%;
+  bottom: 5%;
+  left: 50%;
+  transform: translateX(-50%);
+  opacity: 0; /* 初始为透明 */
+  animation: fadeIn 2s ease-in forwards; /* 2秒渐变显示 */
+}
+</style>

pages/transition/page8/page8.vue

@@ -0,0 +1,52 @@
+<template>
+  <view class="background">
+    <!--按钮-->
+    <image class="button" @click="click" src="@/static/transition/page8/pictures/button.png"></image>
+
+  </view>
+</template>
+
+<script>
+export default {
+  methods: {
+    click() {
+      uni.navigateTo({
+        url: '/pages/homepages/homes/home/home' // 跳转到 主界面
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+
+@keyframes fadeIn {
+  from {
+    opacity: 0; /* 起始透明度 */
+  }
+  to {
+    opacity: 1; /* 结束透明度 */
+  }
+}
+.background {
+  background-image: url("@/static/transition/page8/pictures/background.png");
+  background-size: cover;
+  background-position: center;
+  height: 100vh;
+  display: flex;
+  flex-direction: column; /* 纵向排列 */
+  align-items: center; /* 水平居中 */
+  justify-content: flex-end; /* 使内容向底部对齐 */
+  position: relative; /* 为绝对定位子元素提供相对定位的上下文 */
+}
+
+.button {
+  position: absolute; /* 绝对定位 */
+  width: 36%;
+  height: 6%;
+  bottom: 5%; /* 距离底部 20% 的位置 */
+  left: 50%; /* 水平居中 */
+  transform: translateX(-50%); /* 通过 translateX 使其居中 */
+  animation: fadeIn 3s forwards; /* 添加渐变动画 */
+}
+</style>

qodana.yaml

@@ -0,0 +1,29 @@
+#-------------------------------------------------------------------------------#
+#               Qodana analysis is configured by qodana.yaml file               #
+#             https://www.jetbrains.com/help/qodana/qodana-yaml.html            #
+#-------------------------------------------------------------------------------#
+version: "1.0"
+
+#Specify inspection profile for code analysis
+profile:
+  name: qodana.starter
+
+#Enable inspections
+#include:
+#  - name: <SomeEnabledInspectionId>
+
+#Disable inspections
+#exclude:
+#  - name: <SomeDisabledInspectionId>
+#    paths:
+#      - <path/where/not/run/inspection>
+
+#Execute shell command before Qodana execution (Applied in CI/CD pipeline)
+#bootstrap: sh ./prepare-qodana.sh
+
+#Install IDE plugins before Qodana execution (Applied in CI/CD pipeline)
+#plugins:
+#  - id: <plugin.id> #(plugin id can be found at https://plugins.jetbrains.com)
+
+#Specify Qodana linter for analysis (Applied in CI/CD pipeline)
+linter: jetbrains/qodana-js:latest