support archive moment to exist journal

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>