miniprogram-1/miniprogram/pages/upload/upload.wxml

<!-- upload.wxml - 主功能页面 -->
<navigation-bar title="" back="{{false}}" color="{{day_type === 'night' ? 'white' : 'black'}}" background="{{day_type === 'night' ? '#232946' : '#fffffe'}}">
  <view slot="left">
    <t-icon class="user-home" name="user-circle" size="46rpx" bind:tap="goProfile" />
  </view>
</navigation-bar>
<view class="{{['upload-container', day_type]}}">
  <!-- 主功能界面 -->
  <view class="main-content">
    <!-- 欢迎区域 -->
    <!-- <view class="welcome-section">
      <view class="welcome-card">
        <view class="user-info" wx:if="{{userInfo}}">
          <text class="nickname">你好，{{userInfo.nickName || '用户'}}</text>
        </view>
        <text class="welcome-text">选择一张图片开始识别</text>
      </view>
    </view> -->
    <!-- 欢迎区域 -->
    <view class="sunny-wrap" wx:if="{{ day_type !== 'night' }}">
      <image src="/static/sun-2.png" class="sunny-icon" />
      <image class="face {{facePosition}}" src="{{avatarSvgData}}" mode="aspectFit"></image>
      <!-- <view class="face {{facePosition}}">•ᴗ•</view> -->
      <!-- <view class="face {{facePosition}}">•◡•</view> -->
    </view>
    <view wx:else>
      <view class="moon-wrap">
        <t-icon name="moon-filled" class="moon-icon" size="160rpx" />
      </view>
      <div class="star-icon">★</div>
      <div class="star-icon-2">★</div>
    </view>
    <t-icon name="cloud-filled" class="cloud-icon" size="220rpx" />
    <view class="feature-section">
      <!-- <view class="date">{{ current_date }}</view> -->
      <!-- <view class="hello">{{DayTypeMap[day_type]}}</view> -->
      <!-- <view class="begin-text">用一个新单词, 开启美好的一天</view> -->
      <view class="camera-wrawpper {{!isLoading && todaySummary.length == 0 && groupedHistory.length == 0 && !takePhoto ? 'default' : ''}} {{takePhoto ? 'action' : ''}}">
        <view class="camera" bindtap="handleImageSelect">
          <view class="strip"></view>
          <view class="lens">
            <view class="lens-shutter"></view>
          </view>
          <view class="led"></view>
          <view class="btn"></view>
          <view class="bottom"></view>
        </view>
        <view class="photo-wrapper" wx:if="{{(todaySummary.length == 0 && groupedHistory.length == 0) || takePhoto}}">
          <view class="photo">
            <view class="photo-inner">
              <image class="photo-image" src="{{takePhoto ? photoPath : photoSvgData}}" mode="{{takePhoto ? 'widthFix' : 'aspectFit'}}"></image>
            </view>
          </view>
        </view>
        <view wx:if="{{takePhoto && showExpandLayer }}" class="photo-expand-layer" style="{{photoExpandTransform}} {{photoExpandTransition}}">
          <view class="photo-expand-inner" style="{{photoExpandCurrentWidth ? ('width: ' + photoExpandCurrentWidth + 'px;') : ''}}">
            <!-- <view class="expand-border-bg" style="{{expandBorderStyle}}"></view> -->
            <image class="photo-expand-image" src="{{takePhoto ? photoPath : photoSvgData}}" mode="widthFix"></image>
            <view class="scanner {{scannerVisible ? 'scanner-visible' : 'scanner-hidden'}}">
              <view class="star star1"></view>
              <view class="star star2"></view>
              <view class="star star3"></view>
            </view>
          </view>
        </view>
        <t-action-sheet id="t-action-sheet" bind:selected="handleSelected" />
      </view>
      <!-- <view class='button-wrapper'>
        <view class='button'>123</view>
        <view class='button-bg'></view>
      </view> -->
    </view>
    <view wx:if="{{!takePhoto && (todaySummary.length > 0 || groupedHistory.length > 0)}}" class="history-wrap">
      <view class="today-card" wx:for="{{todaySummary}}" wx:key="index">
        <p class="month-day">{{item.monthDay}}</p>
        <scroll-view class="images-list" scroll-x enable-flex>
          <view class="image-item-wrap" wx:for="{{item.images}}" wx:for-item="image" wx:key="index" catch:tap="onImageTap" data-image-id="{{image.image_id}}">
            <t-skeleton wx:if="{{image.thumbnail_loading}}" class="image-item" theme="image" animation="gradient" loading="{{true}}"></t-skeleton>
            <image wx:else class="image-item" src="{{image.thumbnail_url}}" mode="aspectFill" />
          </view>
        </scroll-view>
      </view>
      <view class="history-card" wx:for="{{groupedHistory}}" wx:key="index">
        <view class="history-card-title" wx:if="{{item.year < currentYear}}">{{item.year}}年</view>
        <view class="history-card-list">
          <view class="history-card-item" catch:tap="onImageCardTap" data-image-items="{{historyItem}}" wx:for="{{item.items}}" wx:for-item="historyItem" wx:for-index="index" wx:key="index">
            <p class="month-day">{{historyItem.monthDay}}</p>
            <scroll-view class="images-list" scroll-x enable-flex>
              <view class="image-item-wrap" wx:for="{{historyItem.images}}" wx:for-item="image" wx:key="index" catch:tap="onImageTap" data-image-id="{{image.image_id}}">
                <t-skeleton wx:if="{{image.thumbnail_loading}}" class="image-item" theme="image" animation="gradient" loading="{{true}}"></t-skeleton>
                <image wx:else class="image-item" src="{{image.thumbnail_url}}" mode="aspectFill" />
              </view>
            </scroll-view>
          </view>
        </view>
      </view>
      <t-action-sheet id="t-images-sheet" bind:selected="handleImageSelected" />
    </view>
    <!-- 历史记录区域 -->
    <!-- 仅在加载更多时显示骨架屏 -->
    <t-skeleton wx:if="{{isLoading && page >= 1}}" theme="paragraph" animation="gradient" loading="{{true}}"></t-skeleton>
    <!-- 使用提示 -->
    <!-- <view class="tips-section">
      <view class="tips-card">
        <text class="tips-title">使用提示</text>
        <view class="tips-list">
          <text class="tip-item">• 拍照时请确保光线充足</text>
          <text class="tip-item">• 图片会自动压缩以提高识别速度</text>
        </view>
      </view>
    </view> -->
  </view>
</view>