support archive moment to exist journal

miniprogram/app.json

@@ -7,8 +7,7 @@
 		"pages/main/travel/index",
 		"pages/main/about/index",
 		"pages/main/travel/luggage/index",
-		"pages/main/moment/index",
-		"pages/main/journal-list/index"
+		"pages/main/moment/index"
 	],
 	"darkmode": true,
 	"themeLocation": "theme.json",

miniprogram/components/journal-list/index.json

@@ -0,0 +1,10 @@
+{
+	"component": true,
+	"usingComponents": {
+		"t-cell": "tdesign-miniprogram/cell/cell",
+		"t-icon": "tdesign-miniprogram/icon/icon",
+		"t-button": "tdesign-miniprogram/button/button",
+		"t-loading": "tdesign-miniprogram/loading/loading",
+		"t-cell-group": "tdesign-miniprogram/cell-group/cell-group"
+	}
+}

miniprogram/components/journal-list/index.less

@@ -0,0 +1,30 @@
+/* components/journal-list/index.less */
+.journal-list {
+	width: 100%;
+	height: 100%;
+
+	.item {
+
+		&.selected {
+			background: var(--td-bg-color-secondarycontainer);
+		}
+
+		.thumb {
+			width: 96rpx;
+			height: 96rpx;
+			object-fit: cover;
+			background: var(--td-bg-color-component);
+			flex-shrink: 0;
+			margin-right: 16rpx;
+			border-radius: 8rpx;
+		}
+	}
+
+	.loading,
+	.finished,
+	.empty {
+		color: var(--td-text-color-placeholder);
+		padding: 24rpx 0;
+		text-align: center;
+	}
+}

miniprogram/components/journal-list/index.ts

@@ -0,0 +1,122 @@
+// components/journal-list/index.ts
+import config from "../../config/index";
+import Time from "../../utils/Time";
+
+export type JournalListItem = {
+	id: number;
+	date: string;
+	location?: string;
+	idea?: string;
+	thumbUrl?: string;
+}
+
+interface JournalListData {
+	list: JournalListItem[];
+	isFetching: boolean;
+	isFinished: boolean;
+	page: {
+		index: number;
+		size: number;
+		type?: string;
+	};
+}
+
+Component({
+	options: {
+		styleIsolation: 'apply-shared'
+	},
+	properties: {
+		visible: {
+			type: Boolean,
+			value: false
+		},
+		type: {
+			type: String,
+			value: undefined // NORMAL 或 PORTFOLIO，不传则获取所有类型
+		},
+		selectedId: {
+			type: Number,
+			value: undefined
+		}
+	},
+	data: <JournalListData>{
+		list: [],
+		isFetching: false,
+		isFinished: false,
+		page: {
+			index: 0,
+			size: 20,
+			type: undefined
+		}
+	},
+	observers: {
+		'visible': function(visible: boolean) {
+			if (visible && this.data.list.length === 0) {
+				this.fetch();
+			}
+		},
+		'type': function(type: string) {
+			this.setData({
+				page: {
+					index: 0,
+					size: 20,
+					type
+				},
+				list: [],
+				isFinished: false
+			});
+		}
+	},
+	methods: {
+		fetch() {
+			if (this.data.isFetching || this.data.isFinished) {
+				return;
+			}
+			this.setData({ isFetching: true });
+			wx.request({
+				url: `${config.url}/journal/list`,
+				method: "POST",
+				header: {
+					Key: wx.getStorageSync("key")
+				},
+				data: this.data.page,
+				success: (resp: any) => {
+					const list = resp.data.data.list;
+					if (!list || list.length === 0) {
+						this.setData({ isFinished: true });
+						return;
+					}
+					const result = list.map((journal: any) => {
+						// 获取第一张缩略图
+						const firstThumb = journal.items.find((item: any) => item.attachType === "THUMB");
+						return {
+							id: journal.id,
+							date: Time.toPassedDateTime(journal.createdAt),
+							idea: journal.idea,
+							location: journal.location,
+							thumbUrl: firstThumb ? `${config.url}/attachment/read/${firstThumb.mongoId}` : undefined
+						} as JournalListItem;
+					});
+					this.setData({
+						page: {
+							...this.data.page,
+							index: this.data.page.index + 1
+						},
+						list: this.data.list.concat(result),
+						isFinished: list.length < this.data.page.size
+					});
+				},
+				complete: () => {
+					this.setData({ isFetching: false });
+				}
+			});
+		},
+		onSelectItem(e: WechatMiniprogram.BaseEvent) {
+			const { id } = e.currentTarget.dataset;
+			this.triggerEvent('select', { id });
+		},
+		onScrollToLower() {
+			this.fetch();
+		}
+	}
+});

miniprogram/components/journal-list/index.wxml

@@ -0,0 +1,40 @@
+<!--components/journal-list/index.wxml-->
+<scroll-view
+	class="journal-list"
+	scroll-y
+	bindscrolltolower="onScrollToLower"
+>
+	<t-cell-group>
+		<t-cell
+			class="item {{selectedId === item.id ? 'selected' : ''}}"
+			wx:for="{{list}}"
+			wx:key="id"
+			title="{{item.date}}"
+			description="{{item.idea}}"
+			bind:tap="onSelectItem"
+			data-id="{{item.id}}"
+		>
+			<image
+				slot="left-icon"
+				wx:if="{{item.thumbUrl}}"
+				class="thumb"
+				src="{{item.thumbUrl}}"
+				mode="aspectFill"
+			/>
+			<t-icon wx:if="{{!item.thumbUrl}}" slot="left-icon" name="image-off" color="gray" size="96rpx" />
+			<t-icon
+				wx:if="{{selectedId === item.id}}"
+				slot="note"
+				class="check"
+				name="check"
+				size="48rpx"
+				color="var(--theme-wx)"
+			/>
+		</t-cell>
+	</t-cell-group>
+	<view wx:if="{{isFetching}}" class="loading">
+		<t-loading theme="dots" size="40rpx" />
+	</view>
+	<view wx:if="{{isFinished && list.length > 0}}" class="finished">没有更多了</view>
+	<view wx:if="{{!isFetching && list.length === 0}}" class="empty">暂无记录</view>
+</scroll-view>

miniprogram/pages/main/journal-list/index.json

@@ -1,3 +0,0 @@
-{
-	"usingComponents": {}
-}

miniprogram/pages/main/journal-list/index.less

@@ -1 +0,0 @@
-/* pages/main/journal-list/index.wxss */

miniprogram/pages/main/journal-list/index.ts

@@ -1,66 +0,0 @@
-// pages/main/journal-list/index.ts
-Page({
-
-	/**
-	 * 页面的初始数据
-	 */
-	data: {
-
-	},
-
-	/**
-	 * 生命周期函数--监听页面加载
-	 */
-	onLoad() {
-
-	},
-
-	/**
-	 * 生命周期函数--监听页面初次渲染完成
-	 */
-	onReady() {
-
-	},
-
-	/**
-	 * 生命周期函数--监听页面显示
-	 */
-	onShow() {
-
-	},
-
-	/**
-	 * 生命周期函数--监听页面隐藏
-	 */
-	onHide() {
-
-	},
-
-	/**
-	 * 生命周期函数--监听页面卸载
-	 */
-	onUnload() {
-
-	},
-
-	/**
-	 * 页面相关事件处理函数--监听用户下拉动作
-	 */
-	onPullDownRefresh() {
-
-	},
-
-	/**
-	 * 页面上拉触底事件的处理函数
-	 */
-	onReachBottom() {
-
-	},
-
-	/**
-	 * 用户点击右上角分享
-	 */
-	onShareAppMessage() {
-
-	}
-})

miniprogram/pages/main/journal-list/index.wxml

@@ -1,2 +0,0 @@
-<!--pages/main/journal-list/index.wxml-->
-<text>pages/main/journal-list/index.wxml</text>

miniprogram/pages/main/moment/index.json

@@ -1,10 +1,15 @@
 {
 	"usingComponents": {
+		"t-cell": "tdesign-miniprogram/cell/cell",
 		"t-popup": "tdesign-miniprogram/popup/popup",
 		"t-radio": "tdesign-miniprogram/radio/radio",
+		"t-dialog": "tdesign-miniprogram/dialog/dialog",
 		"t-navbar": "tdesign-miniprogram/navbar/navbar",
 		"t-button": "tdesign-miniprogram/button/button",
 		"t-checkbox": "tdesign-miniprogram/checkbox/checkbox",
+		"t-cell-group": "tdesign-miniprogram/cell-group/cell-group",
+		"journal-list": "../../../components/journal-list/index",
 		"t-radio-group": "tdesign-miniprogram/radio-group/radio-group"
-	}
+	},
+	"styleIsolation": "shared"
 }

miniprogram/pages/main/moment/index.less

@@ -102,66 +102,87 @@
 	}
 }
 
+.t-popup--bottom {
+	padding-bottom: 0 !important;
+}
+
 .archive-popup {
 
 	.container {
 		width: 100vw;
+		display: flex;
+		overflow: hidden;
 		background: var(--td-bg-color-container);
+		flex-direction: column;
 		border-top-left-radius: 16rpx;
 		border-top-right-radius: 16rpx;
 
+		&.select-journal {
+			max-height: 80vh;
+
+			.content {
+				flex: 1;
+				height: 0;
+			}
+		}
+
+		&.form {
+
+			.content {
+				padding: 16rpx 32rpx;
+
+				.section {
+					width: 100%;
+					margin-top: 1.5rem;
+
+					.label {
+						color: var(--theme-text-secondary);
+					}
+
+					&.type {
+						display: flex;
+
+						.radio {
+							margin-right: 1em;
+						}
+					}
+
+					&.time {
+						display: flex;
+
+						.picker {
+							margin-right: .25rem;
+						}
+					}
+				}
+			}
+		}
+
 		.header {
 			display: flex;
 			align-items: center;
 			height: 116rpx;
-	
+			border-bottom: 1px solid var(--td-component-stroke);
+
 			.title {
 				flex: 1;
 				color: var(--td-text-color-primary);
 				font-size: 36rpx;
 				text-align: center;
-				font-weight: 600;
+				font-weight: bold;
 			}
-		
+
+			.placeholder {
+				width: 128rpx;
+			}
+
 			.btn {
 				margin: 0 .5rem;
-		
+
+				&.back,
 				&.cancel {
 					color: var(--td-text-color-secondary);
 				}
-			
-				&.confirm {
-					color: var(--theme-success);
-				}
-			}
-		}
-
-		.content {
-			padding: 16rpx 32rpx;
-
-			.section {
-				width: 100%;
-				margin-top: 1.5rem;
-
-				.label {
-					color: var(--theme-text-secondary);
-				}
-
-				&.type {
-					display: flex;
-
-					.radio {
-						margin-right: 1em;
-					}
-				}
-
-				&.time {
-					display: flex;
-					
-					.picker {
-						margin-right: .25rem;
-					}
-				}
 			}
 		}
 	}

miniprogram/pages/main/moment/index.ts

@@ -25,6 +25,8 @@ type MD5Result = {
 	md5: string;
 }
 
+type ArchiveStep = "select-type" | "select-journal" | "form";
+
 interface MomentData {
 	list: Item[];
 	type: string;
@@ -42,6 +44,8 @@ interface MomentData {
 	uploadProgress: number;
 	isAuthLocation: boolean;
 	isVisibleArchivePopup: boolean;
+	archiveStep: ArchiveStep;
+	selectedJournalId: number | null;
 }
 
 Page({
@@ -60,7 +64,9 @@ Page({
 		uploadTotal: "0 MB",
 		uploadProgress: 0,
 		isAuthLocation: false,
-		isVisibleArchivePopup: false
+		isVisibleArchivePopup: false,
+		archiveStep: "select-type",
+		selectedJournalId: null
 	},
 	async onLoad() {
 		this.fetch();
@@ -163,7 +169,7 @@ Page({
 	preview(e: WechatMiniprogram.BaseEvent) {
 		const index = e.currentTarget.dataset.index;
 		const total = this.data.list.length;
-		
+
 		const startIndex = Math.max(0, index - 25);
 		const endIndex = Math.min(total, startIndex + 50);
 		const newCurrentIndex = index - startIndex;
@@ -240,7 +246,7 @@ Page({
 				});
 				// 过滤文件
 				const filterPath = md5Results.filter(item => filterMD5Result.indexOf(item.md5) !== -1)
-											 .map(item => item.path);
+					.map(item => item.path);
 				files = files.filter(file => filterPath.indexOf(file.tempFilePath) !== -1);
 				if (files.length === 0) {
 					wx.hideLoading();
@@ -295,7 +301,7 @@ Page({
 										});
 										uploadResolve(result.data[0].id);
 									} else {
-										uploadReject(new Error(`文件上传失败: ${result?.message || '未知错误'}`));
+										uploadReject(new Error(`文件上传失败: ${result?.message || "未知错误"}`));
 									}
 								},
 								fail: (err) => uploadReject(new Error(`文件上传失败: ${err.errMsg}`))
@@ -375,6 +381,47 @@ Page({
 			}
 		})
 	},
+	showArchivePopup() {
+		this.setData({
+			isVisibleArchivePopup: true,
+			archiveStep: "select-type",
+			selectedJournalId: null
+		});
+	},
+	onArchiveToNew() {
+		this.setData({
+			archiveStep: "form",
+			selectedJournalId: null
+		});
+	},
+	onArchiveToExisting() {
+		this.setData({
+			archiveStep: "select-journal",
+			selectedJournalId: null
+		});
+	},
+	onJournalListSelect(e: any) {
+		const { id } = e.detail;
+		this.setData({
+			selectedJournalId: id
+		});
+	},
+	onJournalListConfirm() {
+		if (this.data.selectedJournalId) {
+			this.archiveChecked();
+		}
+	},
+	onJournalListCancel() {
+		this.setData({
+			archiveStep: "select-type",
+			selectedJournalId: null
+		});
+	},
+	onNewJournalBack() {
+		this.setData({
+			archiveStep: "select-type"
+		});
+	},
 	toggleArchivePopup() {
 		this.setData({
 			isVisibleArchivePopup: !this.data.isVisibleArchivePopup
@@ -434,22 +481,26 @@ Page({
 				fail: handleFail
 			});
 		});
+		const archiveData: any = {
+			type: this.data.type,
+			idea: this.data.idea,
+			lat: this.data.location?.lat,
+			lng: this.data.location?.lng,
+			location: this.data.location?.text,
+			pusher: openId,
+			thumbIds: this.data.list.filter(item => item.checked).map(item => item.id)
+		};
+		// 如果选择了已存在的记录，添加 id 参数
+		if (this.data.selectedJournalId) {
+			archiveData.id = this.data.selectedJournalId;
+		}
 		wx.request({
 			url: `${config.url}/journal/moment/archive`,
 			method: "POST",
 			header: {
 				Key: wx.getStorageSync("key")
 			},
-			data: {
-				type: this.data.type,
-				idea: this.data.idea,
-				createdAt: Date.parse(`${this.data.date} ${this.data.time}`),
-				lat: this.data.location?.lat,
-				lng: this.data.location?.lng,
-				location: this.data.location?.text,
-				pusher: openId,
-				thumbIds: this.data.list.filter(item => item.checked).map(item => item.id)
-			},
+			data: archiveData,
 			success: async (resp: any) => {
 				if (resp.data && resp.data.code === 20000) {
 					Events.emit("JOURNAL_REFRESH");
@@ -458,11 +509,12 @@ Page({
 						idea: "",
 						list: [],
 						hasChecked: false,
-						isArchiving: false
+						isArchiving: false,
+						selectedJournalId: undefined,
+						isVisibleArchivePopup: false
 					});
 					await Toolkit.sleep(1000);
 					this.fetch();
-					this.toggleArchivePopup();
 				} else {
 					wx.showToast({ title: "归档失败", icon: "error" });
 					this.setData({

miniprogram/pages/main/moment/index.wxml

@@ -21,7 +21,7 @@
 				class="btn archive"
 				theme="primary"
 				plain="true"
-				bind:tap="toggleArchivePopup"
+				bind:tap="showArchivePopup"
 				disabled="{{isSubmitting || list.length === 0 || !hasChecked}}"
 			>归档已选</t-button>
 		</view>
@@ -87,18 +87,44 @@
 	usingCustomNavbar
 	bind:visible-change="onArchivePopupVisibleChange"
 >
-	<view class="container">
+	<!-- 选择归档方式 -->
+	<view wx:if="{{archiveStep === 'select-type'}}" class="container select-type">
 		<view class="header">
 			<t-button
 				class="btn cancel"
-				aria-role="button"
 				bind:tap="toggleArchivePopup"
 				variant="text"
 			>取消</t-button>
-			<view class="title">归档已选项</view>
+			<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"
-				aria-role="button"
+				theme="primary"
 				bind:tap="archiveChecked"
 				variant="text"
 			>确定</t-button>
@@ -138,4 +164,30 @@
 			</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'}}"
+				type="{{type}}"
+				selectedId="{{selectedJournalId}}"
+				bind:select="onJournalListSelect"
+			/>
+		</view>
+	</view>
 </t-popup>