sdaduanbilei/flower-mp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

管理员可以修改项目所属人

Browse Source
This commit is contained in:
sdaduanbilei 2025-11-21 11:56:13 +08:00
parent 1dd62e3e4b
commit e1d5caf192
11 changed files with 334 additions and 182 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
pages/community/add.js
View File

@ -1,11 +1,15 @@
// pages/community/add.js // pages/community/add.js
const config = require("../../config/config")
const { api } = require("../../utils/api")
Page({ Page({
/** /**
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
content: '',
ossIds: [],
fileList: []
}, },
/** /**
@ -15,6 +19,96 @@ Page({
}, },
upload(e) {
const {
files
} = e.detail;
console.log(files);
this.setData({
fileList: files
})
},
remove(e) {
const {
index
} = e.detail;
const {
fileList
} = this.data
fileList.splice(index, 1);
this.setData({
fileList
});
},
input(e) {
const value = e.detail.value
this.setData({
content: value
})
},
submit() {
if (this.data.content.length === 0) {
wx.showModal({
content: '请输入这一刻的想法',
})
return
}
wx.showLoading({
title: '请稍后',
})
// 上传图片
const uploadTasks = this.data.fileList.map(file => this.uploadSingle(file));
Promise.all(uploadTasks)
.then(ossIds => {
console.log("全部上传成功", ossIds);
// ossIds 是一个 [id1, id2, id3...]
this.save(ossIds);
})
.catch(err => {
console.error("有上传失败", err);
wx.showToast({
title: '上传失败',
icon: 'none'
});
});
},
save(ids){
const data = {content:this.data.content,ossIds: ids,title:this.data.content}
api('/post/add','POST',data,'json').then(res => {
if (res.code === 200){
wx.navigateBack()
} else{
wx.showModal({
content: res.msg
})
}
})
},
uploadSingle(file) {
console.log(file);
return new Promise((resolve, reject) => {
wx.uploadFile({
filePath: file.url,
name: 'file',
header: {
'Authorization': 'Bearer ' + wx.getStorageSync('token'),
},
url: config.baseUrl + '/oss/upload',
success: res => {
const data = JSON.parse(res.data);
if (data.code === 200) {
resolve(data.data.file.id); // 返回 ossId
} else {
reject(data);
}
},
fail: reject
});
})
},
/** /**
* 生命周期函数--监听页面初次渲染完成 * 生命周期函数--监听页面初次渲染完成
*/ */

6
pages/community/add.wxml
View File

@ -4,10 +4,10 @@
<view></view> <view></view>
<view> <view>
<t-textarea t-class="external-class" placeholder="这一刻的想法" disableDefaultPadding="{{true}}" /> <t-textarea t-class="external-class" placeholder="这一刻的想法" disableDefaultPadding="{{true}}" bind:change="input" />
</view> </view>
<view> <view>
<t-upload disabled mediaType="{{['video','image']}}" max="{{9}}" files="{{fileList}}" bind:add="handleAdd" bind:remove="handleRemove"> <t-upload mediaType="{{['image']}}" max="{{9}}" files="{{fileList}}" bind:add="upload" bind:remove="remove">
</t-upload> </t-upload>
</view> </view>
@ -37,7 +37,7 @@
</view> </view>
<view class="full-width flex flex-center " style="margin-top: 96rpx;"> <view class="full-width flex flex-center " style="margin-top: 96rpx;">
<t-button theme="primary" style="width: 80%;" shape="round">发布</t-button> <t-button theme="primary" style="width: 80%;" shape="round" bind:tap="submit">发布</t-button>
</view> </view>
</view> </view>
</view> </view>

35
pages/community/index.js
View File

@ -1,3 +1,5 @@
const { api } = require("../../utils/api")
// pages/community/index.js // pages/community/index.js
Page({ Page({
@ -5,16 +7,11 @@ Page({
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
list:[ page:{
{ current:0,
content:'植物园的枫叶🍁', pageSize:10
imgList:["https://pic1.zhimg.com/v2-e58efabf7a05544e04b6004b9b63e645_720w.jpg?source=172ae18b"]
}, },
{ list:[]
content:"下周就要冷了！ 是不是今天就是今年最后一个适合看花看景的秋日了....",
imgList:["https://res.catter.cn/pub/2025/11/18/20251118170136790.png","https://res.catter.cn/pub/2025/11/18/20251118170155441.png"]
}
]
}, },
/** /**
@ -41,7 +38,27 @@ Page({
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
*/ */
onShow() { onShow() {
this.fetchList()
},
fetchList(){
const data = {...this.data.page}
api('/post/page','POST',data,'json').then(res => {
if (res.code === 200){
console.log(res.data);
const tmps = res.data.list
this.setData({list:tmps})
}
})
},
like(e){
const {id,hasLiked} = e.currentTarget.dataset.item
api( hasLiked === 1 ? '/post/cancelLike':'/post/like','GET',{id}).then(res => {
if (res.code === 200){
this.fetchList()
}
})
}, },
/** /**

12
pages/community/index.wxml
View File

@ -21,25 +21,25 @@
<view class="mt-16"> <view class="mt-16">
<view wx:if="{{item.imgList.length == 1}}"> <view wx:if="{{item.imgList.length == 1}}">
<view wx:for="{{item.imgList}}"> <view wx:for="{{item.imgList}}">
<image src="{{item}}" style="border-radius: 16rpx; height: 50vw; width: 100%;" mode="aspectFill"></image> <image src="{{item.url}}" style="border-radius: 16rpx; height: 50vw; width: 100%;" mode="aspectFill"></image>
</view> </view>
</view> </view>
<view wx:else class="grid" > <view wx:else class="grid" >
<view class="item" wx:for="{{item.imgList}}"> <view class="item" wx:for="{{item.imgList}}">
<view> <view>
<image src="{{item}}" style="width: 100%;height: 30vw; border-radius: 16rpx;" mode="aspectFill" b></image> <image src="{{item.url}}" style="width: 100%;height: 30vw; border-radius: 16rpx;" mode="aspectFill" b></image>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="mt-32 flex flex-center flex-justify-end"> <view class="mt-32 flex flex-center flex-justify-end">
<view class="flex flex-center"> <view class="flex flex-center" data-item="{{item}}" bind:tap="like">
<t-icon name="thumb-up"></t-icon> <t-icon name="{{item.hasLiked === 1 ?'thumb-up-filled':'thumb-up'}}" style="color: {{item.hasLiked === 1 ?'red':''}};" ></t-icon>
<view class="ml-16">10</view> <view class="ml-16">{{item.likeCount}}</view>
</view> </view>
<view class="flex flex-center ml-32"> <view class="flex flex-center ml-32">
<t-icon name="chat-bubble-smile"></t-icon> <t-icon name="chat-bubble-smile"></t-icon>
<view class="ml-16">4</view> <view class="ml-16">{{item.commentCount}}</view>
</view> </view>
</view> </view>
</view> </view>

9
pages/garden/index.js
View File

@ -26,13 +26,8 @@ Page({
this.setData({list:[]}) this.setData({list:[]})
return return
} }
const tmps = res.data.map(e => {
if (e.imgList.length >0){ this.setData({list:res.data})
e.pic = e.imgList[0].url
}
return e
})
this.setData({list:tmps})
} }
}) })
}, },

56
pages/garden/index.wxml
View File

@ -28,18 +28,22 @@
<!-- list 数据 --> <!-- list 数据 -->
<scroll-view scroll-y="{{true}}" wx:else> <scroll-view scroll-y="{{true}}" wx:else>
<view class="padding"> <view class="padding">
<view class="mb-16 bo">必做任务 （2）</view> <view wx:for="{{list}}" >
<view wx:for="{{list}}" class="row padding mb-32" data-id="{{item.id}}" bind:tap="goInfo"> <view class="mb-16 bo">{{item.name}}</view>
<view wx:for="{{item.careList}}">
<view class="row padding mb-32" data-id="{{item.id}}" bind:tap="goInfo">
<view class="flex flex-center flex-justify-start"> <view class="flex flex-center flex-justify-start">
<image class="pic" mode="aspectFill" wx:if="{{item.pic}}" src="{{item.pic}}"></image> <image class="pic" mode="aspectFill" wx:if="{{item.plant.imgList[0].url}}" src="{{item.plant.imgList[0].url}}"></image>
<image class="pic" mode="aspectFill" wx:else src="https://res.catter.cn/pub/2025/09/30/20250930143920286.png"></image> <image class="pic" mode="aspectFill" wx:else src="https://res.catter.cn/pub/2025/09/30/20250930143920286.png"></image>
<view style="margin-left:16rpx;" class="full-width"> <view style="margin-left:16rpx;" class="full-width">
<view class="flex flex-center flex-justify-between full-width"> <view class="flex flex-center flex-justify-between full-width">
<view class="font-16 bold">{{item.name}}</view> <view class="font-16 bold">{{item.plant.name}}</view>
<t-tag shape="round" theme="primary">立即完成</t-tag> <t-tag wx:if="{{item.todayCare.status === 1}}" shape="round" theme="primary">立即完成</t-tag>
<t-tag wx:if="{{item.todayCare.status === 2}}" shape="round">已完成</t-tag>
<t-tag wx:if="{{item.todayCare.status === 3}}" shape="round" theme="primary">跳过</t-tag>
<t-tag wx:if="{{item.todayCare.status === 4}}" shape="round" theme="danger">已逾期{{item.todayCare.expireDays}}天</t-tag>
</view> </view>
<view class="flex flex-center flex-justify-start mt-16 "> <view class="flex flex-center flex-justify-start mt-16 ">
<view class="font-12 grey">需要养护：</view>
<view class="mr-16 flex flex-center" wx:for="{{item.todayCares}}"> <view class="mr-16 flex flex-center" wx:for="{{item.todayCares}}">
<t-icon name="{{item.icon}}" style="color: {{item.color}};"></t-icon> <t-icon name="{{item.icon}}" style="color: {{item.color}};"></t-icon>
</view> </view>
@ -47,50 +51,12 @@
</view> </view>
</view> </view>
</view> </view>
<!-- 已逾期 -->
<view class="mb-16 bo">已逾期 （2）</view>
<view wx:for="{{list}}" class="row padding mb-32" data-id="{{item.id}}" bind:tap="goInfo">
<view class="flex flex-center flex-justify-start">
<image class="pic" mode="aspectFill" wx:if="{{item.pic}}" src="{{item.pic}}"></image>
<image class="pic" mode="aspectFill" wx:else src="https://res.catter.cn/pub/2025/09/30/20250930143920286.png"></image>
<view style="margin-left:16rpx;" class="full-width">
<view class="flex flex-center flex-justify-between full-width">
<view class="font-16 bold">{{item.name}}</view>
<t-tag shape="round" variant="outline" theme="danger">立即完成</t-tag>
</view>
<view class="flex flex-center flex-justify-start mt-16 ">
<view class="font-12 grey">需要养护：</view>
<view class="mr-16 flex flex-center" wx:for="{{item.todayCares}}">
<t-icon name="{{item.icon}}" style="color: {{item.color}};"></t-icon>
</view>
</view>
</view>
</view> </view>
</view> </view>
<!-- 今日已经完成 -->
<view class="mb-16 bo">今日已完成 （2）</view>
<view wx:for="{{list}}" class="row padding mb-32" data-id="{{item.id}}" bind:tap="goInfo">
<view class="flex flex-center flex-justify-start">
<image class="pic" mode="aspectFill" wx:if="{{item.pic}}" src="{{item.pic}}"></image>
<image class="pic" mode="aspectFill" wx:else src="https://res.catter.cn/pub/2025/09/30/20250930143920286.png"></image>
<view style="margin-left:16rpx;" class="full-width">
<view class="flex flex-center flex-justify-between full-width">
<view class="font-16 bold">{{item.name}}</view>
</view>
<view class="flex flex-center flex-justify-start mt-16 ">
<view class="font-12 grey">需要养护：</view>
<view class="mr-16 flex flex-center" wx:for="{{item.todayCares}}">
<t-icon name="{{item.icon}}" style="color: {{item.color}};"></t-icon>
</view>
</view>
</view>
</view>
</view>
</view> </view>
</scroll-view> </scroll-view>
</view> </view>

48
pages/garden/info.wxml
View File

@ -16,32 +16,49 @@
</view> </view>
<!-- info --> <!-- info -->
<view style="background-color:white;margin-top: -100rpx;z-index: 99;position: absolute; width: 100vw; border-top-right-radius: 50rpx; border-top-left-radius: 50rpx;"> <view style="background-color:white;margin-top: -140rpx;z-index: 99;position: absolute; width: 100vw; border-top-right-radius: 50rpx; border-top-left-radius: 50rpx;">
<view class="flex flex-center flex-justify-between" style="padding: 52rpx 32rpx 32rpx 32rpx"> <view class="flex flex-center flex-justify-between" style="padding: 52rpx 32rpx 32rpx 32rpx">
<view class="flex flex-center flex-justify-start"> <view>
<view class="font-16 bold ">{{info.name}}</view> <view class="font-16 bold ">{{info.name}}</view>
<view class="font-12 grey ml-16">种植于 {{info.plantTimeStr}} 已种植 {{info.plantDays}} 天</view> <view class="font-12 grey mt-16">陪伴你第 {{info.plantDays}} 天 · 种植于 {{info.plantTimeStr}}</view>
</view> </view>
<view style="width: 100rpx;" class="flex flex-center flex-justify-end" bind:tap="goEdit"> <view style="width: 100rpx;" class="flex flex-center flex-justify-end" bind:tap="goEdit">
<t-icon name="setting"></t-icon> <t-icon name="setting"></t-icon>
</view> </view>
</view> </view>
</view> </view>
<view class="padding" style="padding-bottom: 240rpx;">
<view style="padding-bottom: 240rpx;">
<view class="white-bg padding flex flex-center flex-justify-between">
<view class="font-12">
<view> <view>
<view class="row padding mt-32"> 🌡 温度适宜：16–23°C
</view>
<view>
🌞 今日光照：良好
</view>
<view>
💧 湿度 适宜
</view>
</view>
<view>
<t-tag theme="primary" shape="round" variant="outline">记录此刻</t-tag>
</view>
</view>
<view class="padding">
<view>
<view class="row padding">
<view>养护事项</view> <view>养护事项</view>
<view class="flex flex-center flex-justify-between mt-16"> <view class="flex flex-center flex-justify-between mt-16">
<view class="flex flex-justify-start flex-aligin-center mt-16"> <view class="flex flex-justify-start flex-aligin-center mt-16">
<view class="font-14 bold ml-16">{{info.growthHabit}}</view> <view class="font-14 bold ml-16">{{info.growthHabit}}</view>
</view> </view>
</view> </view>
<view class="mt-16"> <view>
<view class="grid"> <view class="grid">
<view wx:for="{{info.todayCares}}" class="full-width" data-item="{{item}}" bind:tap="make"> <view wx:for="{{info.todayCares}}" class="full-width" data-item="{{item}}" bind:tap="make">
<view style="background-color: {{item.color}}3C; border-radius: 16rpx; width: 100%;"> <view style="background-color: #FAFAFA; border-radius: 16rpx; width: 100%; border: {{item.color}}3C 1px solid;">
<view class="flex flex-center flex-col padding"> <view class="flex flex-center flex-col padding">
<view class="camera flex flex-center" style="background-color:{{item.color ? item.color+'3C':'red'}};"> <view class="camera flex flex-center" style="background-color:{{item.color ? item.color+'3C':'red'}};">
<t-icon name="{{item.icon}}" class="primary" style="color:{{item.color ? item.color:'red'}};" size="24"></t-icon> <t-icon name="{{item.icon}}" class="primary" style="color:{{item.color ? item.color:'red'}};" size="24"></t-icon>
@ -67,7 +84,7 @@
<view class="flex flex-center flex-justify-between mt-16"> <view class="flex flex-center flex-justify-between mt-16">
<view wx:if="{{info.careRecords.length > 0}}" class="full-width"> <view wx:if="{{info.careRecords.length > 0}}" class="full-width">
<view wx:for="{{info.careRecords}}" class="full-width"> <view wx:for="{{info.careRecords}}" class="full-width">
<view class="flex full-width" > <view class="flex full-width">
<view style="width: 10rpx;" class="flex flex-center flex-col "> <view style="width: 10rpx;" class="flex flex-center flex-col ">
<view class="dot flex flex-center" style="background-color: {{item.color}}3c;"> <view class="dot flex flex-center" style="background-color: {{item.color}}3c;">
<t-icon name="{{item.icon}}" style="color: {{item.color}};" size="20"></t-icon> <t-icon name="{{item.icon}}" style="color: {{item.color}};" size="20"></t-icon>
@ -76,8 +93,10 @@
</view> </view>
<view class="ml-32 mt-16 full-width padding" style="background-color: #F9FAFB; border-radius: 16rpx;margin-left:50rpx;"> <view class="ml-32 mt-16 full-width padding" style="background-color: #F9FAFB; border-radius: 16rpx;margin-left:50rpx;">
<view> <view>
<view class="flex flex-center flex-justify-between">
<view>{{item.name}}</view> <view>{{item.name}}</view>
<view class="font-12 grey mt-16 mb-16">{{item.careTimeStr}}</view> <view class="font-12 grey ml-16">{{item.careTimeStr}}</view>
</view>
<view wx:if="{{item.lastPeriod === 0}}" style="background-color: {{item.color}}3c; color: {{item.color}}; padding: 8rpx; border-radius: 30rpx;margin-top: 8rpx;font-size: 12px;">今天</view> <view wx:if="{{item.lastPeriod === 0}}" style="background-color: {{item.color}}3c; color: {{item.color}}; padding: 8rpx; border-radius: 30rpx;margin-top: 8rpx;font-size: 12px;">今天</view>
<view class="mt-16 font-12">{{item.remark}}</view> <view class="mt-16 font-12">{{item.remark}}</view>
</view> </view>
@ -87,6 +106,15 @@
</view> </view>
</view> </view>
</view> </view>
<view class="row padding mt-32">
<view>植物知识卡</view>
</view>
<view class="row padding mt-32">
<view>成就徽章</view>
</view>
</view>
</view> </view>
</view> </view>
</view> </view>

2
pages/garden/info.wxss
View File

@ -5,7 +5,7 @@ page {
.grid { .grid {
display: grid; display: grid;
grid-template-columns: 50% 50%; grid-template-columns: 47% 47%;
grid-row-gap: 16px; grid-row-gap: 16px;
grid-column-gap: 16px; grid-column-gap: 16px;
} }

30
pages/index/index.js
View File

@ -36,7 +36,6 @@ Page({
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
*/ */
onShow() { onShow() {
this.setData({leftList:[],rightList:[]})
this.fetchList() this.fetchList()
}, },
fetchList() { fetchList() {
@ -49,50 +48,47 @@ Page({
if (res.data === null) { if (res.data === null) {
return return
} }
this.setData({leftList:[],rightList:[]})
const tmps = res.data.list.map(e => { const tmps = res.data.list.map(e => {
e.pic = e.imgList[0].url e.pic = e.imgList[0].url
e.cover = e.imgList[0]
return e return e
}) })
this.addItems(tmps) this.addItems(tmps)
// this.setData({ this.setData({
// list: tmps list: tmps
// }) })
} }
}) })
}, },
addItems(newItems) { addItems(newItems) {
newItems.forEach(item => { let h1 = 0;
let h2 = 0;
newItems.forEach((item,index) => {
// 动态获取图片尺寸 // 动态获取图片尺寸
wx.getImageInfo({ if (index % 2 === 0) {
src: item.pic,
success: res => {
const scale = res.width / res.height;
const imgHeight = 345 / scale; // 假设宽度是 345rpx
if (this.data.leftHeight <= this.data.rightHeight) {
this.data.leftList.push(item); this.data.leftList.push(item);
this.data.leftHeight += imgHeight; h1 += item.cover.height / item.cover.width;
} else { } else {
this.data.rightList.push(item); this.data.rightList.push(item);
this.data.rightHeight += imgHeight; h2 += item.cover.height / item.cover.width;
} }
this.setData({ this.setData({
leftList: this.data.leftList, leftList: this.data.leftList,
rightList: this.data.rightList, rightList: this.data.rightList,
}); });
}
});
}); });
}, },
goInfo(e){ goInfo(e){
console.log(e);
const id = e.currentTarget.dataset.id const id = e.currentTarget.dataset.id
wx.navigateTo({ wx.navigateTo({
url: '../index/info?id=' + id, url: '../garden/info?id=' + id,
}) })
}, },

70
pages/index/index.wxml
View File

@ -10,37 +10,73 @@
<view class="bold mt-16 ml-16" style="font-size: 40px;">20 ℃ </view> <view class="bold mt-16 ml-16" style="font-size: 40px;">20 ℃ </view>
</view> </view>
<view wx:if="{{leftList.length > 0}}"> <view wx:if="{{leftList.length > 0}}">
<view>花园健康度 83 分， 今日需养护 2 株植物</view> <view> 今日需养护 2 株植物</view>
<view class="mt-16 font-12" style="color: #E2B43F;">龟背竹长期未更新照片</view> <view class="mt-16 font-12" style="color: #E2B43F;">龟背竹长期未更新照片</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view style="height: 89vh;" wx:if="{{leftList.length > 0}}"> <view style="height: 89vh;" wx:if="{{list.length > 0}}">
<view class="waterfall" scroll-y="{{true}}"> <view class="waterfall" scroll-y="{{true}}">
<view class="column"> <view class="column">
<block wx:for="{{rightList}}" wx:key="id"> <block wx:for="{{leftList}}" wx:key="id" >
<view class="mb-32 card"> <view class="card mb-16" data-id="{{item.id}}" bind:tap="goInfo">
<view class="img-wrapper" >
<image src="{{item.pic}}" mode="widthFix" class="img"></image> <image src="{{item.pic}}" mode="widthFix" class="img"></image>
<view style="padding: 0 16rpx 16rpx 16rpx ;"> <view class="overlay" style="margin-bottom: 26rpx;">
<view class="font-16 bold">{{item.name}}</view> <view class="font-14 bold">{{item.name}}</view>
<view class="grey font-12">今日无需养护</view> <view class="flex flex-center flex-justify-start mt-5">
<view class="grey font-12">上次养护：2 天前</view> <t-icon name="heart" size="12"></t-icon>
<view class="grey font-12">健康指数：83%</view> <text class="small ml-5">陪伴 · {{item.plantDays}} 天</text>
</view>
</view>
</view>
<view class="info font-12">
<view wx:if="{{item.todayCares}}" class="flex flex-center flex-justify-start">
<t-icon name="saturation" style="color: #4B84EE;"></t-icon>
<view class="ml-5 small">
今日需养护
</view>
</view>
<view wx:else>
<t-icon name="saturation" style="color: #4B84EE;"></t-icon>
<view class=" smallml-5">
今日无需养护
</view>
</view>
<view class="mt-5 grey small">上次养护：{{item.lastPeriod ? itme.lastPeriod:'-' }} 天前</view>
</view> </view>
</view> </view>
</block> </block>
</view> </view>
<view class="column"> <view class="column">
<block wx:for="{{leftList}}" wx:key="id"> <block wx:for="{{rightList}}" wx:key="id" >
<view class="mb-32 card"> <view class="card mb-16" data-id="{{item.id}}" bind:tap="goInfo">
<view class="img-wrapper" >
<image src="{{item.pic}}" mode="widthFix" class="img"></image> <image src="{{item.pic}}" mode="widthFix" class="img"></image>
<view style="padding: 0 16rpx 16rpx 16rpx ;"> <view class="overlay" style="margin-bottom: 26rpx;">
<view class="font-16 bold">{{item.name}}</view> <view class="font-14 bold">{{item.name}}</view>
<view class="grey font-12">今日无需养护</view> <view class="flex flex-center flex-justify-start mt-5">
<view class="grey font-12">上次养护：2 天前</view> <t-icon name="heart" size="12"></t-icon>
<view class="grey font-12">健康指数：83%</view> <text class="small ml-5">陪伴 · {{item.plantDays}} 天</text>
</view>
</view>
</view>
<view class="info font-12">
<view wx:if="{{item.todayCares}}" class="flex flex-center flex-justify-start">
<t-icon name="saturation" style="color: #4B84EE;"></t-icon>
<view class="ml-5 small">
今日需养护
</view>
</view>
<view wx:else>
<t-icon name="saturation" style="color: #4B84EE;"></t-icon>
<view class="ml-5 small">
今日无需养护
</view>
</view>
<view class="mt-5 grey small">上次养护：{{item.lastPeriod ? itme.lastPeriod:'-' }} 天前</view>
</view> </view>
</view> </view>
</block> </block>
@ -52,7 +88,7 @@
<view class="empty flex flex-center flex-col"> <view class="empty flex flex-center flex-col">
</view> </view>
<view class="mt-16 flex flex-center flex-col"> <view class="mt-16 flex flex-center flex-col">
<view class="font-16 bold">欢迎来到你的秘密花园 🌿~</view> <view class="font-14 bold">欢迎来到你的秘密花园 🌿~</view>
<view class="font-12 grey mt-16">从添加第一盆植物开始你的养花之旅吧</view> <view class="font-12 grey mt-16">从添加第一盆植物开始你的养花之旅吧</view>
</view> </view>
<view style="width: 100vw; margin-top: 32rpx; " class="flex flex-center flex-col"> <view style="width: 100vw; margin-top: 32rpx; " class="flex flex-center flex-col">

26
pages/index/index.wxss
View File

@ -15,18 +15,17 @@
.waterfall { .waterfall {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 32rpx; padding:16rpx;
} }
.column { .column {
width: 48%; width: 49%;
} }
.card { .card {
box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.06); box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.06);
background-color: white; background-color: white;
border-radius: 12rpx; border-radius: 12rpx;
} }
.img { .img {
@ -56,3 +55,24 @@
grid-column-gap: 12px; grid-column-gap: 12px;
border-radius: 12rpx; border-radius: 12rpx;
} }
.img-wrapper { position: relative; }
.overlay {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 6rpx 16rpx;
background: rgba(0,0,0,0.5);
color: #fff;
}
.small {
font-size: 22rpx;
opacity: 0.9;
}
.info {
padding-top: 0rpx;
padding-left: 16rpx;
padding-bottom: 16rpx;
}