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

fix

Browse Source
This commit is contained in:
wt 2025-09-30 16:01:37 +08:00
parent cf6c88b7a3
commit 6090085741
14 changed files with 276 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app.json
View File

@ -3,7 +3,8 @@
"pages/index/index",
"pages/add/index",
"pages/add/edit",
"pages/login/index"
"pages/login/index",
"pages/add/info"
],
"window": {
"navigationBarTextStyle": "black",

3
app.wxss
View File

@ -3,7 +3,8 @@ page {
--td-brand-color: #4FAB5F;
--td-brand-color-active: #4FAB5F;
color: #373737;
background: white
background: white;
}
.container {

13
pages/add/edit.js
View File

@ -7,6 +7,11 @@ Page({
* 页面的初始数据
*/
data: {
page:{
current:1,
pageSize:10
},
tmpList:[],
fileList:[],
form:{
name:'',
@ -22,8 +27,12 @@ Page({
},
fetchList(){
api('/farmTemplate/list','POST').then(res => {
console.log(res);
const data = {...this.data.page}
api('/farmTemplate/list','POST',data,'json').then(res => {
if (res.code === 200){
const tmps = res.data.list
this.setData({tmpList:tmps})
}
})
},

18
pages/add/edit.wxml
View File

@ -3,8 +3,8 @@
<view>
<t-input placeholder="请输入植物名称" borderless t-class="t-input" />
<view class="mt-16 ml-32 ">
<view class="font-12 grey">什么时候施肥（可选）</view>
<view class="mt-16 ml-32 " wx:for="{{tmpList}}">
<view class="font-12 grey">什么时候{{item.Name}}（可选）</view>
<view class="mt-16">
<t-radio-group default-value="0" borderless t-class="box">
<t-radio class="padding" block="{{false}}" label="每30天" value="0" />
@ -14,19 +14,7 @@
</t-radio-group>
</view>
</view>
<view class="mt-16 ml-32 ">
<view class="font-12 grey">何时进行修建（可选）</view>
<view class="mt-16">
<t-radio-group default-value="0" borderless t-class="box">
<t-radio class="padding" block="{{false}}" label="每30天" value="0" />
<t-radio class="padding" block="{{false}}" label="每40天" value="1" />
<t-radio class="padding" block="{{false}}" label="每50天" value="2" />
<t-radio class="padding" block="{{false}}" label="每60天" value="3" />
</t-radio-group>
</view>
</view>
<view class="mt-16 ml-32 ">
<view class="font-12 grey">上传花的照片（必填）</view>
<view class="mt-16">

12
pages/add/index.js
View File

@ -6,7 +6,11 @@ Page({
* 页面的初始数据
*/
data: {
list:[
{url:'https://res.catter.cn/pub/2025/09/30/20250930143920286.png',name:'金鱼吊兰'},
{url:'https://res.catter.cn/pub/2025/09/30/20250930145312611.png',name:'月季'},
{url:'https://res.catter.cn/pub/2025/09/30/20250930150006852.png',name:'多肉'}
]
},
/**
@ -16,9 +20,11 @@ Page({
},
goEdit(){
goInfo(){
wx.navigateTo({
url: '../add/edit',
url: '../add/info',
})
}
})

4
pages/add/index.json
View File

@ -1,4 +1,6 @@
{
"navigationBarTitleText": "添加",
"usingComponents": {}
"usingComponents": {
"t-search": "tdesign-miniprogram/search/search"
}
}

32
pages/add/index.wxml
View File

@ -1,22 +1,20 @@
<!--pages/add/index.wxml-->
<view class="flex flex-center flex-col">
<!-- <view class="card mt-32 flex flex-center flex-col" bind:tap="goEdit">
<view class="flex flex-center flex-col">
<view class="bg flex flex-center">
<t-icon name="add"></t-icon>
<view>
<view class="padding">
<t-search placeholder="请输入植物名称..." shape="round" />
</view>
<view class="font-14 bold padding">热门植物</view>
<view>
<view class="grid">
<view wx:for="{{list}}" wx:key="url" style="background-color: #F6F8FE; border-radius: 16rpx;">
<view class="item" bind:tap="goInfo">
<image class="pic" src="{{item.url}}" mode="aspectFill"></image>
</view>
<view style="padding: 16rpx 16rpx 16rpx 10rpx;" class="font-12 bold">{{item.name}}</view>
</view>
<view class="font-16 bold mt-16">花盆</view>
<view class="font-12 grey mt-16">添加新的花盆</view>
</view>
</view> -->
<view class="card mt-32 flex flex-center flex-col" style="background-color: #FCFAFF; border: #E9D0FC 1rpx solid;" bind:tap="goEdit">
<view class="flex flex-center flex-col">
<view class="bg flex flex-center" style="background-color: #E0BCFB;">
<t-icon name="add"></t-icon>
</view>
<view class="font-16 bold mt-16">植物</view>
<view class="font-12 grey mt-16">添加新植物，科学的进行种植！</view>
</view>
</view>
</view>

33
pages/add/index.wxss
View File

@ -1,11 +1,10 @@
/* pages/add/index.wxss */
.card {
width: 95vw;
height: 50vw;
margin: 16rpx;
border: #DAE2FD 1rpx solid;
border-radius: 16rpx;
background-color: #F6F8FE;
}
.bg {
@ -13,4 +12,32 @@
height: 100rpx;
background-color:#A4B7FA ;
border-radius: 100rpx;
}
.grid {
width: 100vw;
display: grid;
grid-template-columns: 1fr 1fr; /* 两列等分 */
gap: 32rpx; /* 图片间隔 */
box-sizing: border-box;
padding: 16rpx;
}
.item {
position: relative;
width: 100%;
padding-top: 75%; /* 高宽比 = 4:3，可以改成 100% 就是正方形 */
overflow: hidden;
}
.pic {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover; /* 小程序等效是 mode="aspectFill" */
border-top-left-radius: 16rpx;
border-top-right-radius: 16rpx;
}

70
pages/add/info.js Normal file
View File

@ -0,0 +1,70 @@
// pages/add/info.js
Page({
/**
* 页面的初始数据
*/
data: {
},
goBack(){
wx.navigateBack()
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

7
pages/add/info.json Normal file
View File

@ -0,0 +1,7 @@
{
"navigationStyle": "custom",
"usingComponents": {
"t-avatar": "tdesign-miniprogram/avatar/avatar",
"t-tag": "tdesign-miniprogram/tag/tag"
}
}

91
pages/add/info.wxml Normal file
View File

@ -0,0 +1,91 @@
<!--pages/add/info.wxml-->
<view>
<view>
<!-- top -->
<view class="top" style="position: relative; z-index: 2;">
<image src="https://res.catter.cn/pub/2025/09/30/20250930150006852.png" style="width: 100vw; height: 680rpx;" mode="aspectFill"></image>
</view>
<!-- back -->
<view style="z-index: 99;position: absolute; top: 110rpx; left: -20rpx; padding: 0 32rpx; " bind:tap="goBack">
<t-icon name="chevron-left" size="58rpx" style="color: white;"></t-icon>
</view>
<!-- 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 class="flex flex-center flex-justify-start" style="padding: 52rpx 0 10rpx 32rpx">
<view class="font-16 bold ">多肉</view>
<view class="font-12 grey ml-16">石榴属</view>
</view>
</view>
</view>
<view class="padding white-bg grey">
<view>多肉植物也叫多水植物、肉质植物，是指植物器官的茎或叶或根具有发达的薄壁组织用以贮藏水分，在外形上显得肥厚多汁的一类植物</view>
</view>
<view class="padding" style="padding-bottom: 240rpx;">
<view>
<view class="row padding ">
<view>浇水</view>
<view class="flex flex-justify-start flex-justify-start mt-16">
<t-avatar shape="round" icon="color-invert" />
<view class="font-14 bold ml-16">每7天一次</view>
</view>
</view>
<view class="row padding mt-32">
<view>施肥</view>
<view class="flex flex-justify-start flex-justify-start mt-16">
<t-avatar shape="round" icon="color-invert" />
<view>
<view class="bold ml-16">每1月一次</view>
<view class="ml-16 grey">液体肥料</view>
</view>
</view>
<view class="flex flex-justify-start flex-justify-start mt-32">
<t-avatar shape="round" icon="color-invert" />
<view>
<view class="bold ml-16">每1月一次</view>
<view class="ml-16 grey">缓释肥</view>
</view>
</view>
<view class="mt-32">推荐肥料</view>
<view class="mt-16">
<t-tag class="margin-16" variant="light" shape="round">树木、灌木专用肥料</t-tag>
<t-tag class="margin-16" variant="light" shape="round">通用型植物肥料</t-tag>
</view>
</view>
</view>
<view class="row padding mt-32">
<view>修剪</view>
<view class="flex flex-justify-start flex-justify-start mt-16">
<t-avatar shape="round" icon="color-invert" />
<view class="font-14 bold ml-16">每7天一次</view>
</view>
</view>
<view class="row padding mt-32">
<view>光照</view>
<view class="flex flex-justify-start flex-justify-start mt-16">
<t-avatar shape="round" icon="sunny" />
<view class="font-14 bold ml-16">喜阳、全日照</view>
</view>
<view class="mt-16 grey">多肉 喜阳，最好每天晒够6小时</view>
</view>
</view>
<view class="bottom">
<view class="flex flex-center flex-col">
<t-button shape="round" theme="primary" style="width: 80%;">获取养护日程</t-button>
<t-button shape="round" theme="text" style="width: 80%; margin-top: 16rpx;">立即拥有</t-button>
</view>
</view>
</view>

15
pages/add/info.wxss Normal file
View File

@ -0,0 +1,15 @@
/* pages/add/info.wxss */
page {
background-color: #F6F6F6;
}
.bottom {
position: fixed;
bottom: 0;
right: 0;
left: 0;
padding-top: 16rpx;
padding-bottom: 32rpx;
background-color: white;
}

17
pages/index/index.wxml
View File

@ -1,14 +1,19 @@
<!--index.wxml-->
<view class="flex flex-center">
<view wx-if="{{list.length === 0}}" class="flex flex-center flex-col " style="margin-top: 128rpx;" bind:tap="goAdd">
<view class="flex flex-center flex-col">
<view wx-if="{{list.length === 0}}" class="flex flex-center flex-col " style="margin-top: 268rpx;" >
<view class="empty flex flex-center flex-col">
<t-icon name="extension-off" size="42rpx"></t-icon>
</view>
<view class="mt-16 flex flex-center flex-col">
<view class="font-16 bold" >添加花盆</view>
<view class="font-12 grey mt-16">您还没有添加任何花盆</view>
<view class="font-16 bold" >暂无植物</view>
<view class="font-12 grey mt-16">您还没有添加任何植物</view>
</view>
<view style="width: 100vw; margin-top: 48rpx; " class="flex flex-center">
<t-button theme="primary" style="width: 60%;" size="small" shape="round" bind:tap="goAdd">添加您的第一颗植物</t-button>
</view>
</view>
<view class="bottom">
<view class="font-12 grey mt-16">您添加的植物将全部显示在这里</view>
</view>
</view>

7
pages/index/index.wxss
View File

@ -5,4 +5,11 @@
height: 140rpx;
background-color:#F6F6F6 ;
border-radius: 140rpx;
background-image: url("https://res.catter.cn/pub/2025/09/30/20250930143142508.png");
background-size: cover;
}
.bottom{
position: fixed;
bottom: 68rpx;
}