<view class="searchContainer">
  <!-- 头部搜索区域 -->
  <view class="header">
    <view class="searchInput">
      <text class="iconfont icon-search1 searchIcon"></text>
      <input type="text" value="{{searchContent}}" placeholder="{{placeholderContent}}" placeholder-class="placeholder" bindinput="handleInputChange"/>
      <text class="clear" bindtap="clearSearchContent" hidden="{{!searchContent}}">X</text>
    </view>
    <text class="cancel">취소</text>
  </view>

  <block wx:if='{{searchList.length}}'>
   <!-- 搜索内容展示 -->
   <view class="showSearchContent">
     <view class="searchContent">검색 내용: {{searchContent}}</view>
     <view class="searchList">
       <view class="searchItem" wx:for="{{searchList}}" wx:key="id">
         <text class="iconfont icon-search1"></text>
         <text class="content">{{item.name}}</text>
       </view>
     </view>
   </view>
  </block>


  <block wx:else>
    <!-- 搜索历史记录 -->
    <view class="history" wx:if="{{historyList.length}}">
      <view class="title">History</view>
      <view class="historyItem" wx:for="{{historyList}}" wx:key="{{item}}">
        {{item}}
      </view>
      <!-- 删除 -->
      <text class="iconfont icon-shanchu delete" bindtap="deleteSearchHistory"></text>
    </view>
    <!-- 热搜榜 -->
    <view class="hotContainer">
      <view class="title">Hot search list</view>
      <!-- 热搜列表 -->
      <view class="hotList">
        <view class="hotItem" wx:for="{{hotList}}" wx:key="searchWord">
          <text class="order">{{index + 1}}</text>
          <text>{{item.searchWord}}</text>
          <image class="iconImg" wx:if="{{item.iconUrl}}" src="{{item.iconUrl}}"></image>
        </view>
      </view>
    </view>
  </block>
</view>