Compare commits
No commits in common. 'main' and 'master' have entirely different histories.
@ -0,0 +1,5 @@
|
||||
# 默认忽略的文件
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# 基于编辑器的 HTTP 客户端请求
|
||||
/httpRequests/
|
||||
@ -0,0 +1,14 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="cn.fjdmy.uniapp.UniappProjectDataService">
|
||||
<option name="basePath" value="$PROJECT_DIR$" />
|
||||
<option name="generalBasePath" value="$PROJECT_DIR$" />
|
||||
<option name="manifestPath" value="$PROJECT_DIR$/manifest.json" />
|
||||
<option name="pagesPath" value="$PROJECT_DIR$/pages.json" />
|
||||
<option name="scanNum" value="1" />
|
||||
<option name="type" value="store" />
|
||||
<option name="uniapp" value="true" />
|
||||
<option name="uniappHx" value="true" />
|
||||
<option name="vueVersion" value="3" />
|
||||
</component>
|
||||
</project>
|
||||
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
@ -0,0 +1,8 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/fitjourney前端代码.iml" filepath="$PROJECT_DIR$/.idea/fitjourney前端代码.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
@ -0,0 +1,14 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="UniappSupport">
|
||||
<option name="uniapp" value="true" />
|
||||
<option name="pluginEnabled" value="true" />
|
||||
<option name="netImgFuns">
|
||||
<set>
|
||||
<option value="" />
|
||||
</set>
|
||||
</option>
|
||||
<option name="isUniapp" value="true" />
|
||||
<option name="vueVersion" value="3" />
|
||||
</component>
|
||||
</project>
|
||||
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="$PROJECT_DIR$" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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_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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,29 @@
|
||||
import App from './App'
|
||||
|
||||
// #ifndef VUE3
|
||||
import Vue from 'vue'
|
||||
import './uni.promisify.adaptor'
|
||||
Vue.config.productionTip = false
|
||||
App.mpType = 'app'
|
||||
const app = new Vue({
|
||||
...App
|
||||
})
|
||||
app.$mount()
|
||||
// #endif
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// #ifdef VUE3
|
||||
import { createSSRApp } from 'vue'
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
return {
|
||||
app
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
@ -0,0 +1,122 @@
|
||||
{
|
||||
"name" : "fit journey",
|
||||
"appid" : "__UNI__1A765D2",
|
||||
"description" : "fit journey是一款基于AI的应用 支持多平台",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {},
|
||||
/* 应用发布信息 */
|
||||
"distribute" : {
|
||||
/* android打包配置 */
|
||||
"android" : {
|
||||
"permissions" : [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
/* ios打包配置 */
|
||||
"ios" : {
|
||||
"dSYMs" : false
|
||||
},
|
||||
/* SDK配置 */
|
||||
"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" : "",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"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",
|
||||
"fallbackLocale" : "zh-Hans"
|
||||
}
|
||||
@ -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"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,521 @@
|
||||
{
|
||||
"pages": [
|
||||
/*---------------------------------------------------------动画过渡界面--------------------------------*/
|
||||
{
|
||||
"path": "pages/transition/page1/page1",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/transition/page2/page2",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/transition/page3/page3",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/transition/page4/page4",
|
||||
"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/homepages/community/add_post/add_post",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/homepages/community/personal_center/personal_center",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
],
|
||||
"uniIdRouter": {},
|
||||
"tabBar": null
|
||||
}
|
||||
@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<view class="community_box">
|
||||
<!-- 头部信息 -->
|
||||
<view class="top_box">
|
||||
<!-- 头像 -->
|
||||
<view class="dog_image_box">
|
||||
<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'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/static/homepages/community/community/scss/community.scss"
|
||||
</style>
|
||||
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -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>
|
||||
@ -0,0 +1,54 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
token: uni.getStorageSync("access_token")
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
go_to_apple()//苹果
|
||||
{
|
||||
uni.navigateTo({
|
||||
url: "/pages/homepages/homes//pages/homepages/homes/dictionary/apple/apple"
|
||||
})
|
||||
},
|
||||
go_to_orange()//橘子
|
||||
{
|
||||
uni.navigateTo({
|
||||
url: "/pages/homepages/homes/dictionary/orange/orange"
|
||||
})
|
||||
},
|
||||
go_to_peach()//桃子
|
||||
{
|
||||
uni.navigateTo({
|
||||
url: "/pages/homepages/homes/choice_book/choice_book"
|
||||
})
|
||||
},
|
||||
go_to_watermelon()//西瓜
|
||||
{
|
||||
uni.navigateTo({
|
||||
url: "/pages/homepages/homes//pages/homepages/homes/dictionary/apple/apple"
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -0,0 +1,98 @@
|
||||
<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>
|
||||
<puppy_chat class="swiper_item"></puppy_chat>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<read_center class="swiper_item"></read_center>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<exercise class="swiper_item"></exercise>
|
||||
</swiper-item>
|
||||
<swiper-item>
|
||||
<community class="swiper_item"></community>
|
||||
</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_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>
|
||||
@ -0,0 +1,191 @@
|
||||
<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>
|
||||
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
@ -0,0 +1,52 @@
|
||||
<template>
|
||||
<!-- 页面1 图片 -->
|
||||
<view class="page1"></view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isTransitioning: false, // 控制渐变效果
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.startTransition(); // 在组件加载时开始渐变
|
||||
},
|
||||
methods: {
|
||||
startTransition() {
|
||||
this.isTransitioning = true;
|
||||
// 2秒后跳转到 page2
|
||||
setTimeout(() => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/transition/page2/page2'
|
||||
});
|
||||
}, 4000); // 2000毫秒后跳转
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page1 {
|
||||
background-image: url('@/static/transition/page1/pictures/page1.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column; /* 纵向排列 */
|
||||
align-items: center; /* 水平居中 */
|
||||
justify-content: center; /* 垂直居中 */
|
||||
opacity: 0; /* 初始透明度 */
|
||||
animation: fadeIn 2s forwards; /* 添加渐变动画 */
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0; /* 起始透明度 */
|
||||
}
|
||||
to {
|
||||
opacity: 1; /* 结束透明度 */
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<view class="background">
|
||||
<!--按钮-->
|
||||
<image class="button" @click="click" src="@/static/transition/page2/pictures/button.png"></image>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
click() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/transition/page3/page3' // 跳转到 page3
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
.background {
|
||||
background-image: url("@/static/transition/page2/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: 315px;
|
||||
height: 60px;
|
||||
bottom: 20%; /* 距离底部 20% 的位置 */
|
||||
left: 50%; /* 水平居中 */
|
||||
transform: translateX(-50%); /* 通过 translateX 使其居中 */
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,118 @@
|
||||
<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>
|
||||
<!-- 文字 -->
|
||||
<image class="text" src="/static/transition/page3/pictures/text.png"></image>
|
||||
<!-- 按钮 -->
|
||||
<image class="button" @click="goToPage3" src="/static/transition/page3/pictures/button.png"></image>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
goToPage3() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/transition/page4/page4' // 跳转到 page4
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.background {
|
||||
background-image: url("/static/transition/page3/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; /* 1秒后显示 */
|
||||
opacity: 0;
|
||||
}
|
||||
/* Human 动画，从页面中部向上移动 */
|
||||
.human {
|
||||
position: absolute;
|
||||
width: 75%;
|
||||
height: 48%;
|
||||
|
||||
|
||||
object-fit: contain; /* 保持图片比例 */
|
||||
animation: moveUp 2s ease forwards;
|
||||
top: 30%; /* 起始位置 */
|
||||
transform: translateY(-50%); /* 垂直居中 */
|
||||
}
|
||||
|
||||
/* Text 延迟显示 */
|
||||
.text {
|
||||
position: absolute;
|
||||
width: 90%;
|
||||
height: 17%;
|
||||
|
||||
object-fit: contain; /* 保持图片比例 */
|
||||
animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
|
||||
opacity: 0;
|
||||
top: 50%; /* 根据需要调整位置 */
|
||||
}
|
||||
|
||||
/* Button 延迟显示并加缩放特效，放在右下角 */
|
||||
.button {
|
||||
position: absolute;
|
||||
height: 10vh;
|
||||
width: 22vw;
|
||||
animation: fadeInScale 1s ease 2.5s forwards; /* 2.5秒后显示并缩放 */
|
||||
opacity: 0;
|
||||
right: 5%; /* 距右边 5% */
|
||||
bottom: 3%; /* 距底部 5% */
|
||||
}
|
||||
|
||||
/* 定义 human 上移动画 */
|
||||
@keyframes moveUp {
|
||||
from {
|
||||
top: 70%;
|
||||
}
|
||||
to {
|
||||
top: 25.8%; /* 移动到页面顶部 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>
|
||||
@ -0,0 +1,117 @@
|
||||
<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="goToPage5" src="/static/transition/page4/pictures/button.png"></image>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
goToPage5() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/transition/page5/page5' // 跳转到 page5
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.background {
|
||||
background-image: url("/static/transition/page4/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; /* 1秒后显示 */
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* Human 动画，从页面中部向上移动 */
|
||||
.human {
|
||||
position: absolute;
|
||||
width: 75%;
|
||||
height: 48%;
|
||||
|
||||
|
||||
object-fit: contain; /* 保持图片比例 */
|
||||
animation: moveUp 2s ease forwards;
|
||||
top: 30%; /* 起始位置 */
|
||||
transform: translateY(-50%); /* 垂直居中 */
|
||||
}
|
||||
|
||||
/* Text 延迟显示 */
|
||||
.text {
|
||||
position: absolute;
|
||||
width: 85%;
|
||||
height: 12%;
|
||||
|
||||
object-fit: contain; /* 保持图片比例 */
|
||||
animation: fadeIn 1s ease 2s forwards; /* 2秒后显示 */
|
||||
opacity: 0;
|
||||
top: 55%; /* 根据需要调整位置 */
|
||||
}
|
||||
|
||||
/* Button 延迟显示并加缩放特效，放在右下角 */
|
||||
.button {
|
||||
position: absolute;
|
||||
height: 10vh;
|
||||
width: 22vw;
|
||||
animation: fadeInScale 1s ease 2.5s forwards; /* 2.5秒后显示并缩放 */
|
||||
opacity: 0;
|
||||
right: 5%; /* 距右边 5% */
|
||||
bottom: 3%; /* 距底部 5% */
|
||||
}
|
||||
|
||||
/* 定义 human 上移动画 */
|
||||
@keyframes moveUp {
|
||||
from {
|
||||
top: 70%;
|
||||
}
|
||||
to {
|
||||
top: 28%; /* 移动到页面顶部 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>
|
||||
@ -0,0 +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 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>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue