gaoYuJournal/miniprogram/pages/main/moment/index.wxml

<!--pages/main/moment/index.wxml-->
<view class="custom-navbar">
	<t-navbar class="custom-navbar" title="瞬间" />
</view>
<view class="moment">
	<view class="tips">
		<text>由于微信限制，一次只能上传 20 张照片或视频，可以先在此页面分批次将所有照片或视频上传，</text>
		<text style="color: #F30">记得勾选原图</text>
		<text>。无需担心重复选择，已上传的文件不会再次上传。上传后有空再挑选归档，归档后此页面不再显示该照片或视频。</text>
	</view>
	<view class="action">
		<view class="line">
			<t-button
				class="btn upload"
				theme="primary"
				plain="true"
				disabled="{{isSubmitting}}"
				bind:tap="uploadMedia"
			>上传照片/视频</t-button>
			<t-button
				class="btn archive"
				theme="primary"
				plain="true"
				bind:tap="showArchivePopup"
				disabled="{{isSubmitting || list.length === 0 || !hasChecked}}"
			>归档已选</t-button>
		</view>
		<view class="line">
			<t-button
				class="btn clear"
				theme="primary"
				variant="outline"
				bind:tap="allChecked"
				disabled="{{isSubmitting || list.length === 0}}"
			>全选</t-button>
			<t-button
				class="btn clear"
				theme="danger"
				variant="outline"
				bind:tap="clearChecked"
				disabled="{{isSubmitting || list.length === 0 || !hasChecked}}"
			>清空已选</t-button>
			<t-button
				class="btn delete"
				theme="danger"
				variant="outline"
				bind:tap="deleteChecked"
				disabled="{{isSubmitting || list.length === 0 || !hasChecked}}"
			>删除已选</t-button>
		</view>
	</view>
	<view wx:if="{{isUploading}}" class="uploading">
		<progress
			class="progress"
			percent="{{uploadProgress}}"
			stroke-width="6"
		/>
		<view class="text">
			<view>{{uploaded}} / {{uploadTotal}}</view>
			<view>{{uploadSpeed}}</view>
		</view>
	</view>
	<view class="items">
		<view class="item" wx:for="{{list}}" wx:key="mongoId">
			<image
				class="thumbnail {{item.type}}"
				src="{{item.thumbURL}}"
				mode="widthFix"
				bind:tap="preview"
				data-index="{{index}}"
			></image>
			<t-checkbox
				class="checkbox"
				block="{{true}}"
				checked="{{item.checked}}"
				bind:change="onCheckChange"
				data-index="{{index}}"
			/>
			<view wx:if="{{item.checked}}" class="checkbox-fill"></view>
		</view>
	</view>
</view>
<t-popup
	class="archive-popup"
	visible="{{isVisibleArchivePopup}}"
	placement="bottom"
	usingCustomNavbar
	bind:visible-change="onArchivePopupVisibleChange"
>
	<!-- 选择归档方式 -->
	<view wx:if="{{archiveStep === 'select-type'}}" class="container select-type">
		<view class="header">
			<t-button
				class="btn cancel"
				bind:tap="toggleArchivePopup"
				variant="text"
			>取消</t-button>
			<view class="title">归档到</view>
			<view class="placeholder"></view>
		</view>
		<t-cell-group class="content">
			<t-cell
				title="新纪录"
				leftIcon="bookmark-add"
				arrow
				bind:tap="onArchiveToNew"
			/>
			<t-cell
				title="已存在记录"
				leftIcon="view-list"
				arrow
				bind:tap="onArchiveToExisting"
			/>
		</t-cell-group>
	</view>
	<!-- 归档表单 -->
	<view wx:if="{{archiveStep === 'form'}}" class="container form">
		<view class="header">
			<t-button
				class="btn back"
				bind:tap="onNewJournalBack"
				variant="text"
			>返回</t-button>
			<view class="title">归档到新纪录</view>
			<t-button
				class="btn confirm"
				theme="primary"
				bind:tap="archiveChecked"
				variant="text"
			>确定</t-button>
		</view>
		<view class="content">
			<view class="section">
				<textarea
					class="idea"
					placeholder="那一刻的想法..."
					model:value="{{idea}}"
				/>
			</view>
			<view class="section type">
				<text class="label">类型：</text>
				<t-radio-group bind:change="onChangeArchiveType" default-value="NORMAL" 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>
	</view>
	<!-- 选择已存在记录 -->
	<view wx:if="{{archiveStep === 'select-journal'}}" class="container select-journal">
		<view class="header">
			<t-button
				class="btn back"
				bind:tap="onJournalListCancel"
				variant="text"
			>返回</t-button>
			<view class="title">归档到已存在记录</view>
			<t-button
				class="btn confirm"
				bind:tap="onJournalListConfirm"
				theme="primary"
				variant="text"
				disabled="{{!selectedJournalId}}"
			>确定</t-button>
		</view>
		<view class="content">
			<journal-list
				visible="{{archiveStep === 'select-journal'}}"
				searchable="{{true}}"
				selectedId="{{selectedJournalId}}"
				bind:select="onJournalListSelect"
			/>
		</view>
	</view>
</t-popup>