Files
miniprogram-1/miniprogram/pages/upload/upload.wxml
2025-11-30 19:18:39 +08:00

149 lines
7.3 KiB
Plaintext
Executable File

<!-- 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 wx:if="{{showLoginView}}">
<view class="login-prompt card">
<text class="prompt-title">请先登录</text>
<text class="prompt-desc">使用图片识别功能需要先登录</text>
<button class="goto-login-btn" bindtap="checkLoginStatus">去登录</button>
</view>
</view>
<!-- 主功能界面 -->
<view wx:else 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="action-section welcome-card">
<view class="action-buttons">
<t-icon name="image-add" size="140rpx" bind:click="handleImageSelect" />
<t-action-sheet id="t-action-sheet" bind:selected="handleSelected" />
</view>
</view> -->
<view class="camera" bindtap="handleImageSelect">
<view class="strip"></view>
<view class="lens">
<view class="lens-shutter"></view>
</view>
<!-- <view class="shutter">
<view class="lens-outer"></view>
<view class="lens-inner"></view>
<view class="leaf a"></view>
<view class="leaf b"></view>
<view class="leaf c"></view>
</view> -->
<view class="led"></view>
<view class="btn"></view>
<view class="bottom"></view>
</view>
<view wx:if="{{todaySummary.length == 0 && groupedHistory.length == 0}}" class="photo-wrapper">
<view class="photo">
<view class="photo-inner">
<image class="photo-image" src="{{photoSvgData}}" mode="aspectFit"></image>
</view>
</view>
</view>
<t-action-sheet id="t-action-sheet" bind:selected="handleSelected" />
</view>
<view 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 class="card-wrapper">
<view class="card-normal">
<image class="card-image" src="/static/sun-2.png" />
<view class="aurora-wrapper">
<view class="aurora"></view>
</view>
</view> -->
<!-- <view class="card-ascii">
<view class="ascii-content">
MAX_PARTICLES = 2500; const TRANSITION = 0.05; function clamp(n,
a, b) { return Math.max(a, Math.min(b, n)); } function lerp(a, b,
t) { return a + (b - a) * t; } const now = () => performance.now(
); function rng(min, max) { return Math.random() * (max - min) + m
in; } class Particle0 { constructor(x, y, vx, vy, r, a) { this.x =
x; this.y = y; this.vx = vx; this.vy = vy; this.r = r; this.a = a
; } step(dt) { this.x += this.vx * dt; this.y += this.vy * dt; } }
class Particle1 { constructor(x, y, vx, vy, r, a) { this.x = x; t
his.y = y; this.vx = vx; this.vy = vy; this.r = r; this.a = a; } s
tep(dt) { this.x += this.vx * dt; this.y += this.vy * dt; } } clas
s Particle2 { constructor(x, y, vx, vy, r, a) { this.x = x; this.y
= y; this.vx = vx; this.vy = vy; this.r = r; this.a = a; } step(d
t) { this.x += this.vx * dt; this.y += this.vy * dt; } } const sca
nner = { x: Math.floor(window.innerWidth / 2), width: SCAN_WIDTH,
glow: 3.5, }; function drawParticle(ctx, p) { ctx.globalAlpha = cl
amp(p.a, 0, 1); ctx.drawImage(gradient, p.x - p.r, p.y - p.r, p.r
* 2, p.r * 2); } function tick(t)
</view>
</view> -->
<!-- <view class="scanner"></view> -->
<!-- </view> -->
</view>
</view>