flower-mp/pages/index/info.wxml
2025-10-09 17:57:04 +08:00

129 lines
5.2 KiB
Plaintext

<!--pages/index/info.wxml-->
<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: -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 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>
<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 class="flex flex-center flex-justify-between mt-16">
<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">每{{info.farms.wateringCycle}}天一次</view>
</view>
</view>
<view>
<t-button theme="primary" shape="round" size="small">完成</t-button>
</view>
</view>
<view class="flex flex-center flex-justify-between mt-16">
<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">每{{info.farms.liquidFertilizerCycle}}天一次</view>
</view>
</view>
<view>
<t-button shape="round" size="small">未完成</t-button>
</view>
</view>
<view class="flex flex-center flex-justify-between mt-16">
<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">每{{info.farms.rotationCycle}}天一次</view>
</view>
</view>
<view>
<t-button shape="round" size="small">未完成</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 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.farms.desc}}</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>
</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">
<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>
</view>
</view>
</view>
</view>
</view>