test/pages/pbService/sceneComfort/index.wxml

<!--pages/pbService/sceneComfort/index.wxml-->
<title title="{{title}}"></title>
<view class="my-top-search">
  <view class="my-search-box">
    <view class="iconfont icon-sousuo"></view>
    <input bindinput="inputKeyword" type="text" placeholder="请输入景区名称"></input>
    <view class="my-search-btn" bindtap="search">搜索</view>
  </view>
  <view class="select-box">
    <picker mode="selector" value="{{sceneLevelIndex}}" range="{{sceneLevel}}" range-key="name" bindchange="changeSceneLevel">
      <view class="picker feiyi-picker">
        <text style="{{sceneLevelIndex>0?'color:#0B898E':''}}">{{sceneLevelIndex>0?sceneLevel[sceneLevelIndex].name:"景区等级"}}</text>
        <view class="iconfont icon-xia"></view>
      </view>
    </picker>
    <picker mode="selector" value="{{comfortIndex}}" range="{{comfortLevel}}" range-key="desc" bindchange="changeComfortLevel">
      <view class="picker feiyi-picker">
        <text style="{{comfortIndex>0?'color:#0B898E':''}}">{{comfortIndex>0?comfortLevel[comfortIndex].desc:"舒适度"}}</text>
        <view class="iconfont icon-xia"></view>
      </view>
    </picker>
    <picker mode="selector" value="{{areaIndex}}" range="{{areas}}" range-key="area_name" bindchange="changeArea">
      <view class="picker feiyi-picker">
        <text style="{{areaIndex>0?'color:#0B898E':''}}">{{areaIndex>0?areas[areaIndex].area_name:'区/县'}}</text>
        <view class="iconfont icon-xia"></view>
      </view>
    </picker>
  </view>

</view>
<view style="height:200rpx"></view>

<view class="comfort-levels">
    <text style="color: #0B898E;">舒适度：</text>
    <view wx:if="{{index!=0}}" style="color:{{item.color}}" wx:for="{{comfortLevel}}" class="comfort-level">{{item.desc}}</view>
</view>
<view style="padding-top: 25rpx;" class="comfort-levels" wx:if="{{list[0]}}">更新时间:{{list[0].status_time}}</view>

<view class="comfort-container">
    <view class="comfort-head">
        <image style="width: 39.67rpx;height: 39.67rpx;" src="https://static.ticket.sz-trip.com/uploads/20250527/ca10f9d72f8d5f3696dee41081357c82.png"></image>
        <text style="height: fit-content;padding-left: 20rpx;">景区舒适度</text>
    </view>

    <view class="comfort-content" wx:if="{{list.length>0}}">
        <view class="ai-tip">
            <image style="width: 27.67rpx;height: 27.67rpx;" src="https://static.ticket.sz-trip.com/uploads/20250527/c3513e7eb0c43ece5f47a8f044063b64.png"></image>
            <text style="padding-left: 12rpx;">本预测趋势图由AI生成，内容仅供参考。</text>
        </view>
        
        <view class="item-container">
            <view class="comfort-item" wx:for="{{list}}" wx:key="index">
                <image class="comfort-item-img" src="{{item.img_url}}" mode="aspectFill"></image>
                <view class="comfort-item-content">
                    <view class="scene-title">
                        <view class="textOver">{{item.third_scene_name}}</view>
                        <view class="area-tag" wx:if="{{item.area}}">{{item.area}}</view>
                        <view class="slevel-tag" wx:if="{{(sceneLevelObj[item.scene_level])}}">{{sceneLevelObj[item.scene_level]}}</view>
                    </view>
                    
                        <view class="top-info">
                            <view style="flex: 1;flex-shrink: 0;">
                                <view class="comft">
                                    <view>当前:</view>
                                    <view class="two" style="color: {{item.comforLevel.color}};">{{item.comforLevel.desc}}</view>
                                </view>
                                <view class="progress-item">
                                    <progress percent="{{item.ins_carry_capacity/item.max_carry_capacity * 100}}" color="{{item.comforLevel.color}}" stroke-width="{{20 * radio}}" border-radius="{{10 * radio}}"></progress>
                                </view>
                            </view>
                            <view style="flex: 1;flex-shrink: 0;">
                                <view class="comft">
                                    <view>未来一小时:</view>
                                    <view class="two" style="color: {{item.hourflowLeve.color}};">{{item.hourflowLeve.desc}}</view>
                                </view>
                                <view class="progress-item">
                                    <progress percent="{{item.hour_flow/item.max_carry_capacity * 100}}" color="{{item.hourflowLeve.color}}" stroke-width="{{20 * radio}}" border-radius="{{10 * radio}}"></progress>
                                </view>
                            </view>
                        </view>
                        <view class="other-tip">
                            <text>更新时间:{{item.status_time}}</text>
                        </view>
                </view>

            </view>
        </view>
    </view>

</view>