244 lines
7.0 KiB
Plaintext
244 lines
7.0 KiB
Plaintext
<!--pages/main/journal-editor/index.wxml-->
|
||
<t-navbar title="{{mode === 'create' ? '新纪录' : '编辑记录'}}">
|
||
<text slot="left" bindtap="cancel">取消</text>
|
||
</t-navbar>
|
||
<scroll-view
|
||
class="container"
|
||
type="custom"
|
||
scroll-y
|
||
show-scrollbar="{{false}}"
|
||
scroll-into-view="{{intoView}}"
|
||
>
|
||
<view class="content">
|
||
<view wx:if="{{isLoading}}" class="loading">
|
||
<text>加载中...</text>
|
||
</view>
|
||
<block wx:else>
|
||
<view class="section">
|
||
<textarea
|
||
class="idea"
|
||
placeholder="这一刻的想法..."
|
||
model:value="{{idea}}"
|
||
/>
|
||
</view>
|
||
<view class="section type">
|
||
<text class="label">类型:</text>
|
||
<t-radio-group bind:change="onChangeType" default-value="{{type}}" borderless t-class="box">
|
||
<t-radio class="radio" block="{{false}}" label="日常" value="NORMAL" />
|
||
<t-radio class="radio" block="{{false}}" label="专拍" value="PORTFOLIO" />
|
||
</t-radio-group>
|
||
</view>
|
||
<view class="section time">
|
||
<text class="label">时间:</text>
|
||
<picker class="picker" mode="date" model:value="{{date}}">
|
||
<view class="picker">
|
||
{{date}}
|
||
</view>
|
||
</picker>
|
||
<picker class="picker" mode="time" model:value="{{time}}">
|
||
<view class="picker">
|
||
{{time}}
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
<view class="section location">
|
||
<text class="label">位置:</text>
|
||
<text wx:if="{{location}}" bind:tap="chooseLocation">{{location.text}}</text>
|
||
<text wx:else bind:tap="chooseLocation">选择位置..</text>
|
||
</view>
|
||
<view class="section media">
|
||
<view class="gallery">
|
||
<!-- 创建模式:mediaList 显示新选择的媒体 -->
|
||
<block wx:if="{{mode === 'create'}}">
|
||
<block wx:for="{{mediaList}}" wx:key="index">
|
||
<view class="item">
|
||
<!-- 图片 -->
|
||
<image
|
||
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
||
src="{{item.path}}"
|
||
class="thumbnail"
|
||
mode="aspectFill"
|
||
bindtap="preview"
|
||
data-index="{{index}}"
|
||
data-new-media="{{true}}"
|
||
></image>
|
||
<!-- 视频 -->
|
||
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
||
<image
|
||
src="{{item.thumbPath}}"
|
||
class="thumbnail"
|
||
mode="aspectFill"
|
||
bindtap="preview"
|
||
data-index="{{index}}"
|
||
data-new-media="{{true}}"
|
||
></image>
|
||
<t-icon class="play-icon" name="play" />
|
||
</view>
|
||
<!-- 删除 -->
|
||
<t-icon
|
||
class="delete"
|
||
name="close"
|
||
bindtap="deleteMedia"
|
||
data-index="{{index}}"
|
||
data-new-media="{{true}}"
|
||
/>
|
||
</view>
|
||
</block>
|
||
</block>
|
||
<!-- 编辑模式:mediaList 显示现有附件,newMediaList 显示新添加的附件 -->
|
||
<block wx:else>
|
||
<!-- 现有附件 -->
|
||
<block wx:for="{{mediaList}}" wx:key="attachmentId">
|
||
<view class="item">
|
||
<!-- 图片 -->
|
||
<image
|
||
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
||
src="{{item.thumbURL}}"
|
||
class="thumbnail"
|
||
mode="aspectFill"
|
||
bindtap="preview"
|
||
data-index="{{index}}"
|
||
data-new-media="{{false}}"
|
||
></image>
|
||
<!-- 视频 -->
|
||
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
||
<image
|
||
src="{{item.thumbURL}}"
|
||
class="thumbnail"
|
||
mode="aspectFill"
|
||
bindtap="preview"
|
||
data-index="{{index}}"
|
||
data-new-media="{{false}}"
|
||
></image>
|
||
<t-icon class="play-icon" name="play" />
|
||
</view>
|
||
<!-- 删除 -->
|
||
<t-icon
|
||
class="delete"
|
||
name="close"
|
||
bindtap="deleteMedia"
|
||
data-index="{{index}}"
|
||
data-new-media="{{false}}"
|
||
/>
|
||
</view>
|
||
</block>
|
||
<!-- 新选择附件 -->
|
||
<block wx:for="{{newMediaList}}" wx:key="index">
|
||
<view class="item new-item">
|
||
<!-- 图片 -->
|
||
<image
|
||
wx:if="{{item.type === mediaItemTypeEnum.IMAGE}}"
|
||
src="{{item.path}}"
|
||
class="thumbnail"
|
||
mode="aspectFill"
|
||
bindtap="preview"
|
||
data-index="{{index}}"
|
||
data-new-media="{{true}}"
|
||
></image>
|
||
<!-- 视频 -->
|
||
<view wx:if="{{item.type === mediaItemTypeEnum.VIDEO}}" class="video-container">
|
||
<image
|
||
src="{{item.thumbPath}}"
|
||
class="thumbnail"
|
||
mode="aspectFill"
|
||
bindtap="preview"
|
||
data-index="{{index}}"
|
||
data-new-media="{{true}}"
|
||
></image>
|
||
<t-icon class="play-icon" name="play" />
|
||
</view>
|
||
<!-- 新增标识 -->
|
||
<t-icon class="new-badge" name="add" />
|
||
<!-- 删除 -->
|
||
<t-icon
|
||
class="delete"
|
||
name="close"
|
||
bindtap="deleteMedia"
|
||
data-index="{{index}}"
|
||
data-new-media="{{true}}"
|
||
/>
|
||
</view>
|
||
</block>
|
||
</block>
|
||
|
||
<!-- 添加按钮 -->
|
||
<t-button
|
||
class="item add"
|
||
theme="primary"
|
||
plain="true"
|
||
disabled="{{isSaving}}"
|
||
bind:tap="addMedia"
|
||
>
|
||
<t-icon name="add" />
|
||
</t-button>
|
||
</view>
|
||
</view>
|
||
<view wx:if="{{isSaving}}" class="uploading">
|
||
<progress
|
||
class="progress"
|
||
percent="{{uploadProgress}}"
|
||
stroke-width="6"
|
||
/>
|
||
<view class="text">
|
||
<view>{{uploaded}} / {{uploadTotal}}</view>
|
||
<view>{{uploadSpeed}}</view>
|
||
</view>
|
||
</view>
|
||
<!-- 控制按钮 -->
|
||
<view class="ctrl">
|
||
<!-- 创建模式 -->
|
||
<block wx:if="{{mode === 'create'}}">
|
||
<t-button
|
||
class="clear"
|
||
theme="danger"
|
||
variant="outline"
|
||
disabled="{{isSaving}}"
|
||
bind:tap="clearMedia"
|
||
disabled="{{mediaList.length === 0}}"
|
||
>清空已选</t-button>
|
||
<t-button
|
||
class="submit"
|
||
theme="primary"
|
||
bind:tap="submit"
|
||
disabled="{{(!idea && mediaList.length === 0) || isSaving}}"
|
||
>提交</t-button>
|
||
</block>
|
||
<!-- 编辑模式 -->
|
||
<block wx:else>
|
||
<t-button
|
||
class="delete"
|
||
theme="danger"
|
||
bind:tap="deleteJournal"
|
||
disabled="{{isSaving}}"
|
||
>删除记录</t-button>
|
||
<t-button
|
||
class="save"
|
||
theme="primary"
|
||
bind:tap="submit"
|
||
disabled="{{(!idea && mediaList.length === 0 && newMediaList.length === 0) || isSaving}}"
|
||
>保存</t-button>
|
||
</block>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
</scroll-view>
|
||
<!-- 删除对话框(仅编辑模式) -->
|
||
<t-dialog
|
||
wx:if="{{mode === 'edit'}}"
|
||
visible="{{deleteDialogVisible}}"
|
||
title="删除记录"
|
||
confirm-btn="{{ {content: '删除', variant: 'text', theme: 'danger'} }}"
|
||
cancel-btn="取消"
|
||
bind:confirm="confirmDelete"
|
||
bind:cancel="cancelDelete"
|
||
>
|
||
<view slot="content" class="delete-dialog">
|
||
<view class="tips">
|
||
<text>此记录的照片和视频也会同步删除,删除后无法恢复,请输入 "</text>
|
||
<text style="color: var(--theme-error)">确认删除</text>
|
||
<text>" 以继续</text>
|
||
</view>
|
||
<t-input model:value="{{deleteConfirmText}}" placeholder="请输入:确认删除" />
|
||
</view>
|
||
</t-dialog>
|