133 lines
8.5 KiB
Plaintext
133 lines
8.5 KiB
Plaintext
<!-- result_show.wxml - 结果展示页面 -->
|
|
<view class="result-container">
|
|
<!-- 主要内容区域 -->
|
|
<view class="main-content">
|
|
<!-- 图片卡片容器（用于光晕效果） -->
|
|
<view class="image-card-container">
|
|
<!-- 图片显示 -->
|
|
<image class="result-image glow-effect" src="{{imagePath}}" mode="aspectFill" bindtap="handleImageClick" />
|
|
<!-- 结果气泡 -->
|
|
<view class="bubbles-container result-bubbles">
|
|
<view wx:for="{{bubbleList}}" wx:key="id" class="bubble-item bubble-interactive result-bubble result-bubble-{{index + 1}}" data-word="{{item.word}}" bindtap="handleBubbleClick" style="background: #007AFF; color: #fff;">
|
|
<text class="bubble-text">{{item.word}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 结果显示区域 -->
|
|
<view class="result-display-area display-area">
|
|
<!-- 内容区域 -->
|
|
<scroll-view class="display-content" scroll-y="true" enable-back-to-top="true" show-scrollbar="true" scroll-with-animation="true" style="flex: 1;">
|
|
<!-- 显示内容 -->
|
|
<view wx:if="{{!isLoadingContent}}" class="content-area">
|
|
<!-- 显示图片描述内容 -->
|
|
<view wx:if="{{displayType === 'description'}}" class="content-text">
|
|
<view wx:if="{{displayContent.length}}">
|
|
<view class="text-primary" wx:for="{{displayContent}}" wx:key="index" bindtap="handleDescriptionClick" data-index="{{index}}">
|
|
<text>{{item}}</text>
|
|
<t-icon name="microphone-1" class="microphone" size="40rpx" />
|
|
</view>
|
|
</view>
|
|
<text class="text-primary" wx:else>{{errorTip}}</text>
|
|
</view>
|
|
<!-- 显示单词详情内容 -->
|
|
<view wx:elif="{{displayType === 'word' && processedWordDetail}}" class="word-detail-container">
|
|
<!-- 遍历处理后的dict_list数组 -->
|
|
<view wx:for="{{processedWordDetail}}" wx:key="index" class="dict-item">
|
|
<!-- 标题栏 -->
|
|
<view class="word-header">
|
|
<view class="word-header-container">
|
|
<text class="word-title">{{currentWord}}</text>
|
|
<!-- 音标 -->
|
|
<view class="pronunciations">
|
|
<!-- 如果两种发音都存在 -->
|
|
<text wx:if="{{item.ukPronunciation && item.usPronunciation}}" class="ipa">
|
|
/{{item.ukPronunciation}} $ {{item.usPronunciation}}/
|
|
</text>
|
|
<!-- 只有 uk 发音 -->
|
|
<text wx:elif="{{item.ukPronunciation}}" class="ipa">
|
|
/{{item.ukPronunciation}}/
|
|
</text>
|
|
<!-- 只有 us 发音 -->
|
|
<text wx:elif="{{item.usPronunciation}}" class="ipa">
|
|
/{{item.usPronunciation}}/
|
|
</text>
|
|
<!-- 音频按钮 -->
|
|
<t-icon class="ipa-audio" wx:if="{{item.ukPronunciation && item.pronunciations && item.pronunciations.uk_audio}}" bind:click="playAudio" data-audio="{{item.pronunciations.uk_audio}}" name="sound" size="40rpx" data-name="{{item}}" />
|
|
<t-icon class="ipa-audio" wx:if="{{item.usPronunciation && item.pronunciations && item.pronunciations.us_audio}}" bind:click="playAudio" data-audio="{{item.pronunciations.us_audio}}" name="sound" size="40rpx" data-name="{{item}}" style="margin-left: 10rpx;" />
|
|
</view>
|
|
</view>
|
|
<!-- 频率标签 -->
|
|
<view class="frequency-tags">
|
|
<t-tag wx:if="{{item.transitive && item.transitive.length > 0}}" wx:for="{{item.transitive}}" wx:key="index" variant="light" theme="success" style="margin-right: 12rpx;">
|
|
{{item}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.part_of_speech}}" variant="light" theme="success" style="margin-right: 12rpx;">
|
|
{{item.part_of_speech}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.frequency && item.frequency.level_tag}}" variant="light" theme="danger" style="margin-left: 10rpx;font-family:arial, helvetica;">
|
|
{{item.frequency.level_tag}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.frequency && item.frequency.spoken_tag}}" variant="light" theme="warning" style="margin-left: 10rpx;">
|
|
{{item.frequency.spoken_tag}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.frequency && item.frequency.written_tag}}" variant="light" theme="warning" style="margin-left: 10rpx;">
|
|
{{item.frequency.written_tag}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.frequency && item.frequency.level_tag}}" variant="light" theme="danger" style="margin-left: 10rpx;font-family:arial, helvetica;">
|
|
{{item.frequency.level_tag}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.frequency && item.frequency.spoken_tag}}" variant="light" theme="warning" style="margin-left: 10rpx;">
|
|
{{item.frequency.spoken_tag}}
|
|
</t-tag>
|
|
<t-tag wx:if="{{item.frequency && item.frequency.written_tag}}" variant="light" theme="warning" style="margin-left: 10rpx;">
|
|
{{item.frequency.written_tag}}
|
|
</t-tag>
|
|
</view>
|
|
</view>
|
|
<!-- senses内容 -->
|
|
<view wx:if="{{item.senses}}" class="senses-container">
|
|
<t-collapse wx:for="{{item.senses}}" wx:key="index" class="word-collapse" defaultValue="{{item.senses[0].id}}" expandIcon>
|
|
<t-collapse-panel value="{{item.id}}" expand-icon="{{item.examples && item.examples.length > 0}}" disabled="{{item.examples && item.examples.length < 1}}">
|
|
<view class="word-collapse-header" slot="header">
|
|
<view wx:if="{{item.countability && item.countability.length > 0}}" style="display: inline;">
|
|
<t-tag wx:for="{{item.countability}}" wx:key="index" variant="light" style="margin-right: 12rpx;">
|
|
{{item}}
|
|
</t-tag>
|
|
</view>
|
|
<view wx:if="{{item.signpost_en && item.signpost_cn}}" style="display: inline; margin-right: 12rpx;">
|
|
<t-check-tag variant="light" default-checked content="{{ [item.signpost_en, item.signpost_en + ' / ' + item.signpost_cn ] }}" catch:tap="preventTagChange" />
|
|
</view>
|
|
<text>{{item.definitions[0].en}}</text>
|
|
<view wx:if="{{item.definitions[0] && item.definitions[0].cn}}" style="display: inline-block; margin-left: 12rpx; vertical-align: middle;height: 46rpx;">
|
|
<t-icon wx:if="{{!item.definitions[0].showTranslation}}" bind:click="toggleDefTranslation" catch:tap="preventTagChange" data-definition="{{item.definitions[0]}}" name="translate" size="36rpx" />
|
|
</view>
|
|
<text wx:if="{{item.definitions[0].cn && item.definitions[0].showTranslation}}" style="margin-left: 12rpx;color: #007AFF;">
|
|
{{item.definitions[0].cn}}
|
|
</text>
|
|
</view>
|
|
<view wx:for="{{item.examples}}" wx:key="index" style="vertical-align: middle;padding: 8rpx 0;">
|
|
<text>{{item.en}}</text>
|
|
<view wx:if="{{item.audio}}" class="word-collapse-content-icon">
|
|
<t-icon bind:click="playAudio" data-audio="{{item.audio}}" name="sound" size="34rpx" data-name="{{item}}" />
|
|
</view>
|
|
<view wx:if="{{item.cn && !item.showTranslation}}" class="word-collapse-content-icon">
|
|
<t-icon bind:click="toggleExampleTranslation" data-example="{{item}}" name="translate" size="34rpx" />
|
|
</view>
|
|
<text wx:if="{{item.cn && item.showTranslation}}" style="color: #007AFF;">
|
|
{{item.cn}}
|
|
</text>
|
|
</view>
|
|
</t-collapse-panel>
|
|
</t-collapse>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 默认提示 -->
|
|
<view wx:else class="content-text">
|
|
<text class="text-primary">点击图片查看描述，点击气泡查看单词详情</text>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</view> |