change ui

This commit is contained in:
sdaduanbilei 2025-11-14 14:12:57 +08:00
parent 81d68c96ab
commit ca702e0c4b
9 changed files with 91 additions and 106 deletions

View File

@ -17,7 +17,7 @@ Page({
pic: '',
form: {
name:'',
plantDate:'',
plantTime:'',
ossIds:[],
"carePlans": [{
"name": "浇水",
@ -72,14 +72,16 @@ Page({
onLoad(options) {
const date = dayjs(new Date().getTime()).format('YYYY-MM-DD')
const tmps = this.data.form
tmps.plantDate = date
tmps.plantTime = date
this.setData({form: tmps})
},
handleConfirm(e) {
const value = e.detail.value
const date = dayjs(value).format('YYYY-MM-DD')
this.data.form.plantDate = date
const tmps = this.data.form
tmps.plantTime = date
this.setData({form:tmps})
},
showDatePicker(){

View File

@ -31,7 +31,7 @@
<view class="mt-32">
<view class="custom-label font-14 ml-32">种植日期 </view>
</view>
<t-cell title="{{form.plantDate}}" right-icon="calendar-1" bind:tap="showDatePicker"></t-cell>
<t-cell title="{{form.plantTime}}" right-icon="calendar-1" bind:tap="showDatePicker"></t-cell>
</view>
</view>
<view class="row padding mt-32">

View File

@ -27,7 +27,7 @@ Page({
const tmps = res.data.map(e => {
if (e.imgList.length >0){
e.pic = e.imgList[0].url
e.expireDay = 2
}
return e
})

View File

@ -22,14 +22,14 @@
<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 wx:if="{{item.expireDay === 0}}" shape="round" theme="primary" variant="light-outline">今日</t-tag>
<t-tag wx:if="{{item.expireDay > 0}}" shape="round" theme="danger" variant="light-outline">已逾期{{item.expireDay}}天</t-tag>
<t-tag wx:if="{{item.expiredDays === 0}}" shape="round" theme="primary" variant="light-outline">今日</t-tag>
<t-tag wx:if="{{item.expiredDays > 0}}" shape="round" theme="danger" variant="light-outline">已逾期{{item.expiredDays}}天</t-tag>
</view>
<view class="font-14 grey mt-5">种植于:{{item.plantDate}}</view>
<view class="font-14 grey mt-5">种植于:{{item.plantTimeStr}}</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="saturation"></t-icon>
<t-icon name="{{item.icon}}" style="color: {{item.color}};"></t-icon>
</view>
</view>
</view>

View File

@ -23,20 +23,16 @@ Page({
api('/plant/detail','GET',data).then(res => {
if (res.code === 200){
const tmp = res.data
tmp.farms.suitableFertilizer = tmp.pestsDiseases.split(',')
if (tmp.ossList.length >0 ){
tmp.pic = tmp.ossList[0].url
tmp.picList = tmp.ossList.map(sub => sub.url)
if (tmp.imgList.length >0 ){
tmp.pic = tmp.imgList[0].url
tmp.picList = tmp.imgList.map(sub => sub.url)
}
console.log(tmp);
tmp.todayCares.map(e => e.period = tmp.carePlans.find(sub => sub.name === e.name).period)
this.setData({info:res.data})
console.log(this.data.info.todayCares);
}
})
api('/plant/todayFarm','GET',data).then(res => {
if (res.code === 200){
this.setData({farms:res.data})
}
})
},
goPreview(e){
@ -46,10 +42,16 @@ Page({
})
},
addFarmLog(e){
make(e){
const item = e.currentTarget.dataset.item
if (item.status === 2){
wx.showModal({
content: '已完成',
})
return
}
const data = {id:item.id,plantId:item.plantId, name:item.name,remark:'测试',status:2}
api('/plant/addRecord','POST',data,'json').then(res => {
api('/plant/makeCare','POST',data,'json').then(res => {
if (res.code === 200){
wx.showToast({
icon:'success',

View File

@ -2,10 +2,8 @@
<view>
<!-- top -->
<view class="top" style="position: relative; z-index: 2;">
<t-swiper style="width: 100vw;" height="640rpx" wx:if="{{info.pic}}" list="{{info.picList}}" >
<t-swiper style="width: 100vw;" height="640rpx" wx:if="{{info.pic}}" list="{{info.picList}}">
</t-swiper>
<image wx:else="" src="https://res.catter.cn/pub/2025/09/30/20250930150006852.png" style="width: 100vw; height: 680rpx;" mode="aspectFill"></image>
</view>
@ -18,99 +16,74 @@
</view>
<!-- info -->
<view style="background-color:white;margin-top: -160rpx;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 10rpx 32rpx">
<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-between" style="padding: 52rpx 32rpx 32rpx 32rpx">
<view class="flex flex-center flex-justify-start">
<view class="font-16 bold ">{{info.name}}</view>
<view class="font-12 grey ml-16">{{info.genus}}</view>
<view class="font-12 grey ml-16">种植于 {{info.plantTimeStr}} 已种植 {{info.plantDays}} 天</view>
</view>
<view style="width: 100rpx;" class="flex flex-center flex-justify-end" bind:tap="goEdit">
<t-icon name="setting"></t-icon>
</view>
</view>
<view style="padding: 0rpx 0 10rpx 32rpx" class="flex flex-center flex-justify-start font-12">
<view class="grey">常用名:</view>
<view>{{info.aliases}}</view>
</view>
<view style="padding: 0rpx 0 10rpx 32rpx" class="flex flex-center flex-justify-start font-12">
<view class="grey">植物学名:</view>
<view>{{info.latinName}}</view>
</view>
</view>
<view class="padding" style="padding-bottom: 240rpx;">
<view>
<view class="row padding mt-32">
<view>今日任务</view>
<view wx:if="{{info.todayFarms.length === 0}}">
<view class="flex flex-center flex-col padding">
<view >
<t-icon class="grey" name="notification-error"></t-icon>
</view>
<view class="font-14 grey">暂无任务</view>
</view>
</view>
<view class="flex flex-center flex-justify-between mt-16" wx:for="{{info.todayFarms}}">
<view class="flex flex-justify-start flex-aligin-center mt-16">
<t-avatar icon="color-invert" />
<view class="ml-16">
<view class="font-14 bold">{{item.name}}</view>
</view>
</view>
<view>
<t-button wx:if="{{item.status == 1}}" theme="danger" variant="outline" shape="round" size="small" data-item="{{item}}" bind:tap="addFarmLog">未完成</t-button>
<t-button wx:if="{{item.status == 2}}" theme="primary" shape="round" size="small" data-item="{{item}}" bind:tap="addFarmLog">完成</t-button>
<t-button wx:if="{{item.status == 3}}" disabled shape="round" size="small" >已跳过</t-button>
<t-button wx:if="{{item.status == 4}}" theme="danger" variant="outline" shape="round" size="small" data-item="{{item}}" bind:tap="addFarmLog">逾期</t-button>
</view>
</view>
</view>
<view class="row padding mt-32">
<view>当前状态</view>
<view class="flex flex-justify-start flex-aligin-center mt-16">
<t-avatar icon="color-invert" />
<view class="ml-16">
<view class="font-14 bold">当前:健康</view>
<view class="font-12 grey">健康状态</view>
</view>
</view>
<view class="flex flex-center mt-32">
<t-button theme="primary" icon="chat-bubble-error" shape="round" style="width: 100%;">AI 病害诊断</t-button>
</view>
</view>
<view class="row padding mt-32">
<view>养护提示</view>
<view>养护事项</view>
<view class="flex flex-center flex-justify-between mt-16">
<view class="flex flex-justify-start flex-aligin-center mt-16">
<view class="font-14 bold ml-16">{{info.growthHabit}}</view>
</view>
</view>
<view class="mt-16">
<t-tag class="margin-16" wx:for="{{info.farms.suitableFertilizer}}" theme="danger" style="margin-right: 10rpx;" variant="light">{{item}}</t-tag>
</view>
</view>
<view class="row padding mt-32">
<view>花期</view>
<view class="flex flex-center flex-justify-between mt-16">
<view class="flex flex-justify-start flex-aligin-center mt-16">
<view class="font-14 bold ml-16">{{info.floweringPeriod}}</view>
<view class="grid">
<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 class="flex flex-center flex-col padding">
<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>
</view>
<view class="mt-16">{{item.name}}</view>
<view class="mt-16 font-12 grey">每{{item.period}}天一次</view>
<view wx:if="{{item.status === 2}}">
<view class="mt-16 font-12 primary">已完成</view>
</view>
<view wx:else>
<view class="primary mt-16 font-12 " style="color: #DD524C;" wx:if="{{item.status === 4}}">已逾期{{item.expireDays}}天</view>
<view class="primary mt-16 font-12 " wx:if="{{item.expireDays === 0}}">今天</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="row padding mt-32">
<view>其他</view>
<view>养护记录</view>
<view class="flex flex-center flex-justify-between mt-16">
<view class="flex flex-justify-start flex-aligin-center mt-16">
<t-tag theme="primary" class="font-14 bold ml-16">{{info.lifeCycle}}</t-tag>
<t-tag theme="primary" class="font-14 bold ml-16">{{info.lightIntensity}}</t-tag>
<t-tag theme="primary" class="font-14 bold ml-16">{{info.lightType}}</t-tag>
<t-tag theme="primary" class="font-14 bold ml-16">{{info.foliageType}}</t-tag>
<view wx:if="{{info.careRecords.length > 0}}" class="full-width">
<view wx:for="{{info.careRecords}}" class="full-width">
<view class="flex full-width" >
<view style="width: 10rpx;" class="flex flex-center flex-col ">
<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>
</view>
<view style="width: 1px; background-color: #F6F6F6; height: 65%; margin-top: 10rpx;margin-bottom: 10rpx;"></view>
</view>
<view class="ml-32 mt-16 full-width padding" style="background-color: #F9FAFB; border-radius: 16rpx;margin-left:50rpx;">
<view>
<view>{{item.name}}</view>
<view class="font-12 grey mt-16 mb-16">{{item.careTimeStr}}</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>
</view>
</view>
</view>
</view>
</view>
</view>

View File

@ -1,4 +1,24 @@
/* pages/index/info.wxss */
page {
background-color: #F6F6F6;
}
.grid {
display: grid;
grid-template-columns: 50% 50%;
grid-row-gap: 16px;
grid-column-gap: 16px;
}
.camera{
background-color: #4fab5e3d;
width: 100rpx;
height: 100rpx;
border-radius: 50rpx;
}
.dot{
background-color: #4fab5e3d;
width: 60rpx;
height: 60rpx;
border-radius: 60rpx;
}

View File

@ -20,17 +20,5 @@
"bigPackageSizeSupport": false
},
"libVersion": "3.10.1",
"condition": {
"miniprogram": {
"list": [
{
"name": "pages/add/index",
"pathName": "pages/add/index",
"query": "",
"scene": null,
"launchMode": "default"
}
]
}
}
"condition": {}
}

View File

@ -38,7 +38,7 @@ export const api = (url, method = 'GET', params = {}, type = 'data') => {
wx.showModal({
content: result.data.msg
})
reject(err)
}
},