|
|
@@ -38,12 +38,52 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 文字记录 -->
|
|
|
+ <!-- 文字记录 + 媒体附件 -->
|
|
|
<view class="card">
|
|
|
<view class="card-accent"></view>
|
|
|
<view class="card-body">
|
|
|
<text class="card-title">✍️ 文字记录</text>
|
|
|
<textarea class="note-input" v-model="note" placeholder="今天发生了什么?说说你的感受..." maxlength="500" />
|
|
|
+ <!-- 并排两个按钮 + 展开区域 -->
|
|
|
+ <view class="media-toolbar">
|
|
|
+ <view class="tool-btn" @tap="choosePhoto">
|
|
|
+ <text class="tool-icon">📷</text>
|
|
|
+ <text class="tool-label">上传照片</text>
|
|
|
+ <text class="tool-count" v-if="photos.length > 0">{{ photos.length }}/9</text>
|
|
|
+ </view>
|
|
|
+ <view class="tool-divider"></view>
|
|
|
+ <view class="tool-btn" @tap="toggleRecord">
|
|
|
+ <text class="tool-icon">🎙</text>
|
|
|
+ <text class="tool-label">{{ isRecording ? '录音中…' : (voicePath ? '已录制' : '录制音频') }}</text>
|
|
|
+ <text class="tool-count" v-if="isRecording">{{ recordSeconds }}s</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 照片缩略图 -->
|
|
|
+ <view class="photo-strip" v-if="photos.length > 0">
|
|
|
+ <view class="photo-item" v-for="(img, idx) in photos" :key="getPhotoKey(img, idx)" @tap="removePhoto(idx)">
|
|
|
+ <image :src="img" mode="aspectFill" class="photo-img"/>
|
|
|
+ <view class="photo-delete-overlay">
|
|
|
+ <text class="delete-icon">×</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 录音状态 -->
|
|
|
+ <view class="voice-strip" v-if="isRecording">
|
|
|
+ <view class="waveform">
|
|
|
+ <view class="wave-bar" v-for="n in 7" :key="n" :style="{animationDelay: (n * 0.1) + 's'}"></view>
|
|
|
+ </view>
|
|
|
+ <view class="voice-controls">
|
|
|
+ <view class="mini-btn cancel-mini" @tap="cancelRecord"><text>取消</text></view>
|
|
|
+ <view class="mini-btn done-mini" @tap="finishRecord"><text>完成</text></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="voice-strip" v-else-if="voicePath">
|
|
|
+ <view class="voice-player">
|
|
|
+ <text class="play-icon">▶</text>
|
|
|
+ <text class="voice-duration">{{ recordDurationText }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="delete-voice" @tap="deleteVoice"><text>×</text></view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -63,53 +103,14 @@
|
|
|
<view class="card-accent"></view>
|
|
|
<view class="card-body">
|
|
|
<text class="card-title">近期心情</text>
|
|
|
- <view class="history-list">
|
|
|
+<view class="history-list">
|
|
|
<view class="history-item" v-for="item in history" :key="item.id">
|
|
|
<view class="history-left">
|
|
|
<text class="history-type">{{ emotionIcon(item.emotionType) }} {{ emotionLabel(item.emotionType) }}</text>
|
|
|
<text class="history-content">{{ item.note || '-' }}</text>
|
|
|
-<!-- 并排两个按钮 + 展开区域 -->
|
|
|
- <view class="media-toolbar">
|
|
|
- <view class="tool-btn" @tap="choosePhoto">
|
|
|
- <text class="tool-icon">📷</text>
|
|
|
- <text class="tool-label">上传照片</text>
|
|
|
- <text class="tool-count" v-if="photos.length > 0">{{ photos.length }}/9</text>
|
|
|
- </view>
|
|
|
- <view class="tool-divider"></view>
|
|
|
- <view class="tool-btn" @tap="toggleRecord">
|
|
|
- <text class="tool-icon">🎙</text>
|
|
|
- <text class="tool-label">{{ isRecording ? '录音中…' : (voicePath ? '已录制' : '录制音频') }}</text>
|
|
|
- <text class="tool-count" v-if="isRecording">{{ recordSeconds }}s</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 照片缩略图 -->
|
|
|
- <view class="photo-strip" v-if="photos.length > 0">
|
|
|
- <view class="photo-item" v-for="(img, idx) in photos" :key="getPhotoKey(img, idx)" @tap="removePhoto(idx)">
|
|
|
- <image :src="img" mode="aspectFill" class="photo-img"/>
|
|
|
- <view class="photo-delete-overlay">
|
|
|
- <text class="delete-icon">×</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 录音状态 -->
|
|
|
- <view class="voice-strip" v-if="isRecording">
|
|
|
- <view class="waveform">
|
|
|
- <view class="wave-bar" v-for="n in 7" :key="n" :style="{animationDelay: (n * 0.1) + 's'}"></view>
|
|
|
- </view>
|
|
|
- <view class="voice-controls">
|
|
|
- <view class="mini-btn cancel-mini" @tap="cancelRecord"><text>取消</text></view>
|
|
|
- <view class="mini-btn done-mini" @tap="finishRecord"><text>完成</text></view>
|
|
|
+ <text class="history-date">{{ formatDate(item.createdAt) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="voice-strip" v-else-if="voicePath">
|
|
|
- <view class="voice-player">
|
|
|
- <text class="play-icon">▶</text>
|
|
|
- <text class="voice-duration">{{ recordDurationText }}</text>
|
|
|
- </view>
|
|
|
- <view class="delete-voice" @tap="deleteVoice"><text>×</text></view>
|
|
|
- </view>
|
|
|
- <text class="history-date">{{ formatDate(item.createdAt) }}</text>
|
|
|
- </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -234,7 +235,6 @@ export default {
|
|
|
removePhoto: function(idx) {
|
|
|
this.photos.splice(idx, 1)
|
|
|
},
|
|
|
- },
|
|
|
cancelRecord: function() {
|
|
|
this.recorderManager.stop()
|
|
|
this.voicePath = ''
|