Compare commits
No commits in common. 'master' and 'master' have entirely different histories.
@ -1,141 +0,0 @@
|
||||
<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>
|
@ -1,190 +1,17 @@
|
||||
<template>
|
||||
<view class="community_box">
|
||||
<!-- 头部信息 -->
|
||||
<view class="top_box">
|
||||
<!-- 头像 -->
|
||||
<view class="dog_image_box" @click="toPersonCenter">
|
||||
<image class="dog_image" src="../../../../static/homepages/community/community/pictures/dog_image.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="words_box">
|
||||
<!-- 标题 -->
|
||||
<view class="title_box">fit journey社区</view>
|
||||
<view class="tip_word_box">搜索他人的健康秘诀</view>
|
||||
</view>
|
||||
<view class="add_image_box">
|
||||
<image
|
||||
class="add_image"
|
||||
src="../../../../static/homepages/community/community/pictures/add_image.png"
|
||||
mode="widthFix"
|
||||
@click="toAddPostPage"
|
||||
></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="line_box"></view>
|
||||
<!-- 帖子 -->
|
||||
<view class="post_body">
|
||||
<scroll-view class="post_scroll_box" scroll-y="true">
|
||||
<view class="post_box" v-for="(item, index) in posts" :key="index">
|
||||
<view class="post_top_box">
|
||||
<view class="post_avatar_box">
|
||||
<image class="post_avatar" :src=item.avatar mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="post_info">
|
||||
<view class="post_name">{{item.name}}</view>
|
||||
<view class="post_date">{{item.date}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="post_word_box">{{item.word}}</view>
|
||||
<view class="post_images_box">
|
||||
<community_image_box class="post_images" :imgList='item.imgList' :num='item.imgList.length'></community_image_box>
|
||||
</view>
|
||||
<view class="post_bottom_box">
|
||||
<view class="comments_box">
|
||||
<image class="chat_icon" src="../../../../static/homepages/community/community/pictures/chat_icon.png" mode="widthFix"></image>
|
||||
<view class="comments_num">{{item.comments_num}}</view>
|
||||
</view>
|
||||
<view class="like_box">
|
||||
<image
|
||||
class="love_icon"
|
||||
:src=getLikeImage(index)
|
||||
mode="widthFix"
|
||||
@click="likeClick(index)"
|
||||
></image>
|
||||
<view class="like_num">{{item.like_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
<!-- 底部导航栏 -->
|
||||
<tarbar_community class="tarbar_box"></tarbar_community>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Community from "@/components/swiper/community.vue";
|
||||
import community_image_box from "../../../../components/community_image_box/community_image_box.vue";
|
||||
export default {
|
||||
components: {Community, community_image_box},
|
||||
data() {
|
||||
return {
|
||||
posts:[
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年9月31日',
|
||||
word:'今天去海边锻炼看见的,真是太美了啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:1,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'puppy',
|
||||
date:'2024年11月13日',
|
||||
word:'今天去海边锻炼看见的,真是太美了',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:12,
|
||||
like_num:17,
|
||||
islike:false,
|
||||
},
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年10月13日',
|
||||
word:'今天去海边锻炼看见的',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:10,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年1月13日',
|
||||
word:'今天去锻炼',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:10,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
mounted(){
|
||||
this.getAllPost()
|
||||
},
|
||||
computed:{
|
||||
likeImages() {
|
||||
return this.posts.map((post, index) => ({
|
||||
index,
|
||||
image: post.islike ? '../../../../static/homepages/community/community/pictures/red_love_image.png' : '../../../../static/homepages/community/community/pictures/love_image.png'
|
||||
}));
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
getLikeImage(index) {
|
||||
//TODO:获取点赞的图片
|
||||
const item = this.likeImages.find(item => item.index === index);
|
||||
return item ? item.image : '';
|
||||
},
|
||||
getAllPost(){
|
||||
//TODO:获取所有的帖子
|
||||
const app = getApp()
|
||||
uni.request({
|
||||
url:app.globalData.fit_journey_community_address + '/post/getAll',
|
||||
method:"GET",
|
||||
success:(res) => {
|
||||
console.log('getAllPost')
|
||||
console.log(res)
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('getAllPost fail')
|
||||
console.log(err.log)
|
||||
},
|
||||
})
|
||||
},
|
||||
likeClick(index){
|
||||
//TODO:点赞
|
||||
if (this.posts[index].islike){
|
||||
this.posts[index].islike = false
|
||||
this.posts[index].like_num--
|
||||
}
|
||||
else{
|
||||
this.posts[index].islike = true
|
||||
this.posts[index].like_num++
|
||||
}
|
||||
},
|
||||
toAddPostPage(){
|
||||
//TODO:转到发布帖子界面
|
||||
uni.navigateTo({
|
||||
url:'/pages/homepages/community/add_post/add_post'
|
||||
})
|
||||
},
|
||||
toPersonCenter(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/homepages/community/personal_center/personal_center'
|
||||
})
|
||||
}
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/static/homepages/community/community/scss/community.scss";
|
||||
|
||||
</style>
|
||||
|
@ -1,229 +1,17 @@
|
||||
<template>
|
||||
<view class="person_center_box">
|
||||
<view class="person_center_top">
|
||||
<view class="return_box">
|
||||
<image
|
||||
class="return_image"
|
||||
src="../../../../static/homepages/community/personal_center/pictures/left_arrow.png"
|
||||
mode="widthFix"
|
||||
></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="person_center_body">
|
||||
<view class="info_box">
|
||||
<view class="height_box">
|
||||
<view class="height_data">{{height}}cm</view>
|
||||
<view class="height_words">身高</view>
|
||||
</view>
|
||||
<image class="avatar_box" src="" mode="widthFix"></image>
|
||||
<view class="weight_box">
|
||||
<view class="weight_data">{{weight}}kg</view>
|
||||
<view class="weight_words">体重</view>
|
||||
</view>
|
||||
<view class="name_box">{{name}}</view>
|
||||
<view class="tip_box">{{tip}}</view>
|
||||
</view>
|
||||
<view class="btns_box">
|
||||
<button class="changeInfoBtn">个人中心修改信息</button>
|
||||
<button class="addPostBtn" @click="toAddPostPage">去发布帖子</button>
|
||||
</view>
|
||||
<view class="posts_box">
|
||||
<view class="post_nav_box">
|
||||
<view class="toMypost_box post_nav">
|
||||
<view class="toMypost" @click="myPostClick">我的帖子</view>
|
||||
<view class="bottom_line" v-if="isMyPost"></view>
|
||||
</view>
|
||||
<view class="toLikepost_box post_nav">
|
||||
<view class="toLikepost" @click="likePostClick">我的点赞</view>
|
||||
<view class="bottom_line" v-if="!isMyPost"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="posts">
|
||||
<view class="post_box" v-for="(item, index) in posts" :key="index">
|
||||
<view class="post_top_box">
|
||||
<view class="post_avatar_box">
|
||||
<image class="post_avatar" :src=item.avatar mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="post_info">
|
||||
<view class="post_name">{{item.name}}</view>
|
||||
<view class="post_date">{{item.date}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="post_word_box">{{item.word}}</view>
|
||||
<view class="post_images_box">
|
||||
<community_image_box class="post_images" :imgList='item.imgList' :num='item.imgList.length'></community_image_box>
|
||||
</view>
|
||||
<view class="post_bottom_box">
|
||||
<view class="comments_box">
|
||||
<image class="chat_icon" src="../../../../static/homepages/community/community/pictures/chat_icon.png" mode="widthFix"></image>
|
||||
<view class="comments_num">{{item.comments_num}}</view>
|
||||
</view>
|
||||
<view class="like_box">
|
||||
<image
|
||||
class="love_icon"
|
||||
:src=getLikeImage(index)
|
||||
mode="widthFix"
|
||||
@click="likeClick(index)"
|
||||
></image>
|
||||
<view class="like_num">{{item.like_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import community_image_box from "../../../../components/community_image_box/community_image_box.vue";
|
||||
export default {
|
||||
components: {community_image_box},
|
||||
data() {
|
||||
return {
|
||||
name:'puppy',
|
||||
height:187,
|
||||
weight:71,
|
||||
tip:'这是一条个性签名',
|
||||
isMyPost:true,
|
||||
likePosts:[
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年9月31日',
|
||||
word:'这是我喜欢的帖子',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:1,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
],
|
||||
myPosts:[
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年9月31日',
|
||||
word:'今天去海边锻炼看见的,真是太美了啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:1,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'puppy',
|
||||
date:'2024年11月13日',
|
||||
word:'今天去海边锻炼看见的,真是太美了',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:12,
|
||||
like_num:17,
|
||||
islike:false,
|
||||
},
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年10月13日',
|
||||
word:'今天去海边锻炼看见的',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:10,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
{
|
||||
avatar:'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
name:'cat',
|
||||
date:'2024年1月13日',
|
||||
word:'今天去锻炼',
|
||||
imgList:[
|
||||
'../../../../static/homepages/community/community/pictures/dog_image.png',
|
||||
],
|
||||
comments_num:10,
|
||||
like_num:100,
|
||||
islike:false,
|
||||
},
|
||||
],
|
||||
posts:[],
|
||||
};
|
||||
},
|
||||
mounted(){
|
||||
this.getAllPost()
|
||||
this.posts = this.myPosts
|
||||
},
|
||||
computed:{
|
||||
likeImages() {
|
||||
return this.posts.map((post, index) => ({
|
||||
index,
|
||||
image: post.islike ? '../../../../static/homepages/community/community/pictures/red_love_image.png' : '../../../../static/homepages/community/community/pictures/love_image.png'
|
||||
}));
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
myPostClick(){
|
||||
this.isMyPost = true
|
||||
this.posts = this.myPosts
|
||||
},
|
||||
likePostClick(){
|
||||
this.isMyPost = false
|
||||
this.posts = this.likePosts
|
||||
},
|
||||
getLikeImage(index) {
|
||||
//TODO:获取点赞的图片
|
||||
const item = this.likeImages.find(item => item.index === index);
|
||||
return item ? item.image : '';
|
||||
},
|
||||
getAllPost(){
|
||||
//TODO:获取所有的帖子
|
||||
const app = getApp()
|
||||
uni.request({
|
||||
url:app.globalData.fit_journey_community_address + '/post/getAll',
|
||||
method:"GET",
|
||||
success:(res) => {
|
||||
console.log('getAllPost')
|
||||
console.log(res)
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('getAllPost fail')
|
||||
console.log(err.log)
|
||||
},
|
||||
})
|
||||
},
|
||||
likeClick(index){
|
||||
//TODO:点赞
|
||||
if (this.posts[index].islike){
|
||||
this.posts[index].islike = false
|
||||
this.posts[index].like_num--
|
||||
}
|
||||
else{
|
||||
this.posts[index].islike = true
|
||||
this.posts[index].like_num++
|
||||
}
|
||||
},
|
||||
toAddPostPage(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/homepages/community/add_post/add_post'
|
||||
})
|
||||
}
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "../../../../static/homepages/community/personal_center/scss/personal_center.scss"
|
||||
<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,17 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
@ -1,189 +0,0 @@
|
||||
<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>
|
@ -1,206 +1,17 @@
|
||||
<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>
|
||||
|
||||
</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}`);
|
||||
},
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</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,17 @@
|
||||
<template>
|
||||
<view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
Before Width: | Height: | Size: 8.3 KiB |
Before Width: | Height: | Size: 1.1 KiB |
@ -1,169 +0,0 @@
|
||||
.add_post_box{
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
position: relative;
|
||||
.addpost_top_box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// background-color: #55aaff;
|
||||
height: 10vh;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 5%;
|
||||
.return_box{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #E6EEFA;
|
||||
height: 5.5vh;
|
||||
width: 5.5vh;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 5vw;
|
||||
.return_image{
|
||||
width: 3vh;
|
||||
}
|
||||
}
|
||||
.title_box{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 550;
|
||||
font-size: 2.8vh;
|
||||
width: fit-content;
|
||||
// line-height: 33px;
|
||||
/* or 92% */
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.publish_btn{
|
||||
position: absolute;
|
||||
right: 5vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #5790DF;
|
||||
box-shadow: 0px 14.8205px 29.641px rgba(87, 144, 223, 0.5);
|
||||
border-radius: 20px;
|
||||
padding: 1vh 2vh;
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-size: 1.5vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
.addpost_tip_box{
|
||||
position: absolute;
|
||||
top: 15vh;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 1.9vh;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #CCB8B8;
|
||||
padding-bottom: 1vh;
|
||||
border-bottom: 1px solid #000000;
|
||||
}
|
||||
.addpost_box{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 25vh;
|
||||
width: 90%;
|
||||
.post_box{
|
||||
background-color: #B2CBF0;
|
||||
border-radius: 30px;
|
||||
padding: 5vh 2vh;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 5vh;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
}
|
||||
.post_top_box{
|
||||
display: flex;
|
||||
.post_avatar_box{
|
||||
width: 5vh;
|
||||
height: 5vh;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 2vh;
|
||||
.post_avatar{
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
.post_info{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.post_word_box{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
color: #000000;
|
||||
margin-top: 2.5vh;
|
||||
background-color: #E6EEFA;
|
||||
border-radius: 8px;
|
||||
box-sizing: border-box;
|
||||
padding: 1.5vh 1.5vh;
|
||||
height: 5.5vh;
|
||||
width:100%;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.post_images_box{
|
||||
width: 100%;
|
||||
height:70%;
|
||||
// .post_images{
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// }
|
||||
.myimgDV {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.justify {
|
||||
justify-content: space-between;
|
||||
}
|
||||
.receiveimage {
|
||||
margin-top: 28rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
.doublepic {
|
||||
// height: 100%;
|
||||
width: 49%;
|
||||
margin-right: 12rpx;
|
||||
margin-bottom: 12rpx;
|
||||
&:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Before Width: | Height: | Size: 438 B |
Before Width: | Height: | Size: 620 B |
Before Width: | Height: | Size: 44 KiB |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 2.2 KiB |
@ -1,196 +0,0 @@
|
||||
.community_box{
|
||||
padding: 5vh 5vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
.top_box{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 10vh;
|
||||
// border-bottom: 1.48205px solid #000000;
|
||||
.dog_image_box{
|
||||
// height: 8vh;
|
||||
// width: 8vh;
|
||||
height: 110rpx;
|
||||
width: 110rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #D9D9D9;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.dog_image{
|
||||
width: 85rpx;
|
||||
}
|
||||
}
|
||||
.words_box{
|
||||
height: 100%;
|
||||
width: 60%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
.title_box{
|
||||
width: fit-content;
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 3vh;
|
||||
line-height: 33px;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
}
|
||||
.tip_word_box{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 2vh;
|
||||
line-height: 33px;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #CCB8B8;
|
||||
}
|
||||
}
|
||||
.add_image_box{
|
||||
// height: 8vh;
|
||||
// width: 8vh;
|
||||
height: 110rpx;
|
||||
width: 110rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #D9D9D9;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.add_image{
|
||||
width: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 分割线
|
||||
.line_box{
|
||||
width: 70%;
|
||||
border-bottom: 1.48205px solid #000000;
|
||||
position: absolute;
|
||||
top: 17vh;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.post_body{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 20vh;
|
||||
width: 90%;
|
||||
.post_scroll_box{
|
||||
height: 69vh;
|
||||
}
|
||||
.post_box{
|
||||
background-color: #E6EEFA;
|
||||
border-radius: 30px;
|
||||
padding: 2vh 2vh;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 5vh;
|
||||
width: 100%;
|
||||
// height: 55vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// height:900rpx;
|
||||
position: relative;
|
||||
.post_top_box{
|
||||
display: flex;
|
||||
.post_avatar_box{
|
||||
width: 5vh;
|
||||
height: 5vh;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 2vh;
|
||||
.post_avatar{
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
.post_info{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.post_word_box{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
color: #000000;
|
||||
margin-top: 2.5vh;
|
||||
}
|
||||
.post_images_box{
|
||||
width: 100%;
|
||||
height:70%;
|
||||
.post_images{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.post_bottom_box{
|
||||
position: absolute;
|
||||
bottom: 0%;
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
padding: 0% 6%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
backdrop-filter: blur(2px);
|
||||
/* Note: backdrop-filter has minimal browser support */
|
||||
border-radius: 0px 0px 30px 30px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
.comments_box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
// width: 10%;
|
||||
.chat_icon{
|
||||
width: 3.2vh;
|
||||
}
|
||||
.comments_num{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 2vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
.like_box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
margin-left: 4%;
|
||||
// width: 10%;
|
||||
.love_icon{
|
||||
width: 3.2vh;
|
||||
}
|
||||
.like_num{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 2vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 761 KiB |
@ -1,308 +0,0 @@
|
||||
.person_center_box{
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
position: relative;
|
||||
.person_center_top{
|
||||
height: 25vh;
|
||||
background-image: url("@/static/homepages/community/personal_center/pictures/top_background.png");
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
.return_box{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #E6EEFA;
|
||||
height: 5.5vh;
|
||||
width: 5.5vh;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 5vw;
|
||||
top: 2vh;
|
||||
.return_image{
|
||||
width: 3vh;
|
||||
}
|
||||
}
|
||||
}
|
||||
.person_center_body{
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 100vw;
|
||||
height: 82vh;
|
||||
top: 18vh;
|
||||
background: #E6EEFA;
|
||||
border-radius: 50px 50px 0px 0px;
|
||||
.info_box{
|
||||
width: 100vw;
|
||||
height: 20vh;
|
||||
position: relative;
|
||||
// background-color: #fff;
|
||||
.height_box{
|
||||
width: fit-content;
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
left: 19vw;
|
||||
.height_data{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
margin-bottom: 0.5vh;
|
||||
}
|
||||
.height_words{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 1.8vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
.weight_box{
|
||||
width: fit-content;
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
right: 19vw;
|
||||
.weight_data{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
margin-bottom: 0.5vh;
|
||||
}
|
||||
.weight_words{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 1.8vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
.avatar_box{
|
||||
background-color: #fff;
|
||||
width: 12vh;
|
||||
height: 12vh;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
.name_box{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 52%;
|
||||
transform: translateX(-50%);
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2.1vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #000000;
|
||||
}
|
||||
.tip_box{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 70%;
|
||||
width: 100vw;
|
||||
transform: translateX(-50%);
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-size: 1.8vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: #6C7A9C;
|
||||
}
|
||||
}
|
||||
.btns_box{
|
||||
display: flex;
|
||||
height: 5vh;
|
||||
.changeInfoBtn{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 35vw;
|
||||
font-size: 1.6vh;
|
||||
background: #fff;
|
||||
box-shadow: 0px 14.8205px 29.641px rgba(0, 0, 0, 0.25);
|
||||
border-radius: 29.641px;
|
||||
}
|
||||
.addPostBtn{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 35vw;
|
||||
font-size: 1.6vh;
|
||||
background: #fff;
|
||||
box-shadow: 0px 14.8205px 29.641px rgba(0, 0, 0, 0.25);
|
||||
border-radius: 29.641px;
|
||||
}
|
||||
}
|
||||
.posts_box{
|
||||
margin-top: 4vh;
|
||||
height: 52vh;
|
||||
width: 100vw;
|
||||
position: relative;
|
||||
.post_nav_box{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.post_nav{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
width: 20vw;
|
||||
height: 3vh;
|
||||
margin: 0vh 2vw;
|
||||
position: relative;
|
||||
.toMypost{
|
||||
position: absolute;
|
||||
top: 0%;
|
||||
}
|
||||
.toLikepost{
|
||||
position: absolute;
|
||||
top: 0%;
|
||||
}
|
||||
.bottom_line{
|
||||
margin-top: 6px;
|
||||
height: 1px;
|
||||
width: 5vw;
|
||||
border-bottom:2px solid #000000 ;
|
||||
background: #6C7A9C;
|
||||
border-radius: 2.9641px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.posts{
|
||||
background-color: #fff;
|
||||
border-radius: 50px 50px 0px 0px;
|
||||
box-sizing: border-box;
|
||||
margin-top: 2vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 49vh;
|
||||
padding: 0vw 3vw 0vw 3vw;
|
||||
position: relative;
|
||||
.post_box{
|
||||
background-color: #E6EEFA;
|
||||
border-radius: 30px;
|
||||
padding: 2vh 2vh;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 5vh;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
margin-top: 3vh;
|
||||
.post_top_box{
|
||||
display: flex;
|
||||
.post_avatar_box{
|
||||
width: 5vh;
|
||||
height: 5vh;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 2vh;
|
||||
.post_avatar{
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
.post_info{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.post_word_box{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 2vh;
|
||||
color: #000000;
|
||||
margin-top: 2.5vh;
|
||||
}
|
||||
.post_images_box{
|
||||
width: 100%;
|
||||
height:70%;
|
||||
.post_images{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.post_bottom_box{
|
||||
position: absolute;
|
||||
bottom: 0%;
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
padding: 0% 6%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
backdrop-filter: blur(2px);
|
||||
/* Note: backdrop-filter has minimal browser support */
|
||||
border-radius: 0px 0px 30px 30px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
.comments_box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
// width: 10%;
|
||||
.chat_icon{
|
||||
width: 3.2vh;
|
||||
}
|
||||
.comments_num{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 2vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
.like_box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
margin-left: 4%;
|
||||
// width: 10%;
|
||||
.love_icon{
|
||||
width: 3.2vh;
|
||||
}
|
||||
.like_num{
|
||||
font-family: 'Poppins';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 2vh;
|
||||
text-align: center;
|
||||
letter-spacing: -0.604677px;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Before Width: | Height: | Size: 139 KiB |
Before Width: | Height: | Size: 158 KiB |
Before Width: | Height: | Size: 191 KiB |
Before Width: | Height: | Size: 112 KiB |
Before Width: | Height: | Size: 181 KiB |
Before Width: | Height: | Size: 93 KiB |
Before Width: | Height: | Size: 150 KiB |
Before Width: | Height: | Size: 354 KiB |
Before Width: | Height: | Size: 100 KiB |
Before Width: | Height: | Size: 54 KiB |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 67 KiB |
Before Width: | Height: | Size: 104 KiB |
Before Width: | Height: | Size: 66 KiB |
Before Width: | Height: | Size: 3.8 KiB |
Before Width: | Height: | Size: 113 KiB |
@ -1,133 +0,0 @@
|
||||
export const foodCaloriesDB = {
|
||||
// 主食类
|
||||
'米饭': 116,
|
||||
'馒头': 223,
|
||||
'面条': 110,
|
||||
'包子': 200,
|
||||
'饺子': 220,
|
||||
'油条': 389,
|
||||
'面包': 265,
|
||||
'粥': 50,
|
||||
'炒面': 260,
|
||||
'炒饭': 290,
|
||||
|
||||
// 肉类
|
||||
'猪肉': 143,
|
||||
'牛肉': 106,
|
||||
'鸡肉': 167,
|
||||
'鸭肉': 240,
|
||||
'羊肉': 203,
|
||||
'鱼肉': 100,
|
||||
'虾': 85,
|
||||
'蛋': 155,
|
||||
|
||||
// 蔬菜类
|
||||
'西红柿': 20,
|
||||
'黄瓜': 16,
|
||||
'胡萝卜': 36,
|
||||
'白菜': 20,
|
||||
'菠菜': 23,
|
||||
'生菜': 15,
|
||||
'茄子': 24,
|
||||
'土豆': 81,
|
||||
'青椒': 20,
|
||||
|
||||
// 水果类
|
||||
'苹果': 52,
|
||||
'香蕉': 89,
|
||||
'橙子': 47,
|
||||
'葡萄': 69,
|
||||
'西瓜': 32,
|
||||
'梨': 51,
|
||||
'草莓': 32,
|
||||
'柚子': 39,
|
||||
|
||||
// 饮品类
|
||||
'牛奶': 79,
|
||||
'豆浆': 31,
|
||||
'可乐': 42,
|
||||
'果汁': 54,
|
||||
'咖啡': 1,
|
||||
'奶茶': 150,
|
||||
|
||||
// 常见菜品
|
||||
'西红柿炒鸡蛋': 100,
|
||||
'宫保鸡丁': 260,
|
||||
'鱼香肉丝': 195,
|
||||
'红烧肉': 425,
|
||||
'糖醋里脊': 290,
|
||||
'麻婆豆腐': 174,
|
||||
'青椒炒肉': 180,
|
||||
'回锅肉': 327,
|
||||
'蒜蓉炒菜心': 45,
|
||||
'炒青菜': 30,
|
||||
'土豆炖牛肉': 215,
|
||||
'红烧排骨': 289,
|
||||
'清炒白菜': 35,
|
||||
'炸鸡': 260,
|
||||
'水煮鱼': 180,
|
||||
'酸菜鱼': 168,
|
||||
|
||||
// 零食类
|
||||
'薯片': 536,
|
||||
'巧克力': 546,
|
||||
'饼干': 435,
|
||||
'爆米花': 382,
|
||||
'坚果': 607,
|
||||
'冰淇淋': 267,
|
||||
'蛋糕': 257,
|
||||
|
||||
// 快餐类
|
||||
'汉堡': 295,
|
||||
'披萨': 266,
|
||||
'炸薯条': 312,
|
||||
'炸鸡翅': 246,
|
||||
'热狗': 290
|
||||
}
|
||||
|
||||
// 模糊搜索函数
|
||||
export const searchFood = (keyword) => {
|
||||
keyword = keyword.toLowerCase()
|
||||
const results = []
|
||||
|
||||
for (const [food, calories] of Object.entries(foodCaloriesDB)) {
|
||||
if (food.toLowerCase().includes(keyword)) {
|
||||
results.push({
|
||||
name: food,
|
||||
calories: calories
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
return results
|
||||
}
|
||||
|
||||
// 获取单个食物的卡路里
|
||||
export const getFoodCalories = (foodName) => {
|
||||
// 直接匹配
|
||||
if (foodCaloriesDB[foodName]) {
|
||||
return foodCaloriesDB[foodName]
|
||||
}
|
||||
|
||||
// 模糊匹配
|
||||
const results = searchFood(foodName)
|
||||
if (results.length > 0) {
|
||||
return results[0].calories
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
// 获取食物分类列表
|
||||
export const getFoodCategories = () => {
|
||||
return {
|
||||
'主食类': ['米饭', '馒头', '面条', '包子', '饺子', '油条', '面包', '粥'],
|
||||
'肉类': ['猪肉', '牛肉', '鸡肉', '鸭肉', '羊肉', '鱼肉', '虾', '蛋'],
|
||||
'蔬菜类': ['西红柿', '黄瓜', '胡萝卜', '白菜', '菠菜', '生菜', '茄子', '土豆', '青椒'],
|
||||
'水果类': ['苹果', '香蕉', '橙子', '葡萄', '西瓜', '梨', '草莓', '柚子'],
|
||||
'饮品类': ['牛奶', '豆浆', '可乐', '果汁', '咖啡', '奶茶'],
|
||||
'常见菜品': ['西红柿炒鸡蛋', '宫保鸡丁', '鱼香肉丝', '红烧肉', '糖醋里脊', '麻婆豆腐'],
|
||||
'零食类': ['薯片', '巧克力', '饼干', '爆米花', '坚果', '冰淇淋', '蛋糕'],
|
||||
'快餐类': ['汉堡', '披萨', '炸薯条', '炸鸡翅', '热狗']
|
||||
}
|
||||
}
|
@ -1 +0,0 @@
|
||||
.
|
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 128 KiB |
@ -1,111 +0,0 @@
|
||||
.background {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 75%;
|
||||
top: 4%;
|
||||
z-index: -3;
|
||||
|
||||
}
|
||||
|
||||
#chat_scroll{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 12%;
|
||||
height: 65vh;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.chat {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
// top: 12%;
|
||||
height: 100%;
|
||||
// z-index: -1;
|
||||
// padding: 10px;
|
||||
// overflow-y: auto;
|
||||
// -webkit-overflow-scrolling: touch;
|
||||
display: flex;
|
||||
flex-direction: column; /* 消息从上往下显示 */
|
||||
|
||||
}
|
||||
.chat_area {
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
max-width: 75%;
|
||||
word-wrap: break-word;
|
||||
display: flex;
|
||||
flex-direction: row; /* 头像和消息水平排列 */
|
||||
align-items: center; /* 内容垂直居中 */
|
||||
}
|
||||
.user_message {
|
||||
/*background-color: #7879F1; */
|
||||
color: white;
|
||||
margin-top: 2%; /* 让用户的消息气泡靠右 */
|
||||
margin-right: 5%; /* AI消息靠左 */
|
||||
margin-left: auto; /* 让AI的消息气泡靠右 */
|
||||
text-align: left;
|
||||
word-break: break-word; /* 自动换行 */
|
||||
}
|
||||
.ai_message {
|
||||
/*background-color: #e5e5ea;*/
|
||||
color: black;
|
||||
margin-left: 2%; /* 用户消息靠右 */
|
||||
margin-right: auto; /* 让用户的消息气泡靠左 */
|
||||
text-align: left;
|
||||
word-break: break-word; /* 自动换行 */
|
||||
}
|
||||
.avatar_container {
|
||||
right: 10%;
|
||||
height: 100%;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
.ai_avatar_container {
|
||||
margin-right: 10px; /* AI头像与气泡的间距 */
|
||||
}
|
||||
.user_avatar_container {
|
||||
margin-left: 10px; /* 用户头像与气泡的间距 */
|
||||
}
|
||||
.ai_avatar, .user_avatar {
|
||||
right: 5%;
|
||||
width: 40px; /* 头像的大小 */
|
||||
height: 40px; /* 头像的大小 */
|
||||
border-radius: 50%; /* 头像圆形 */
|
||||
}
|
||||
.message_content {
|
||||
max-width: 80%; /* 限制消息气泡的最大宽度 */
|
||||
}
|
||||
.user_message_content{
|
||||
background-color: #7879F1;
|
||||
border-radius: 15px;
|
||||
}
|
||||
.ai_message_content{
|
||||
background-color: #e5e5ea;
|
||||
border-radius: 15px;
|
||||
}
|
||||
.input_box {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 9%;
|
||||
top: 79%;
|
||||
}
|
||||
.input_box_background {
|
||||
position: absolute;
|
||||
width: 98%;
|
||||
height: 90%;
|
||||
left: 1%;
|
||||
top: 5%;
|
||||
}
|
||||
.input_words {
|
||||
position: absolute;
|
||||
width: 70%;
|
||||
height: 80%;
|
||||
left: 5%;
|
||||
top: 10%;
|
||||
}
|
||||
.send_button {
|
||||
position: absolute;
|
||||
width: 12%;
|
||||
height: 70%;
|
||||
left: 84%;
|
||||
top: 15%;
|
||||
}
|
Before Width: | Height: | Size: 64 KiB |
Before Width: | Height: | Size: 2.1 MiB |
Before Width: | Height: | Size: 6.5 KiB |
Before Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 16 KiB |
Before Width: | Height: | Size: 153 KiB |
Before Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 171 KiB |
Before Width: | Height: | Size: 46 KiB |
Before Width: | Height: | Size: 159 KiB |
Before Width: | Height: | Size: 23 KiB |