init project

miniprogram/pages/main/portfolio/index.ts

@@ -0,0 +1,151 @@
+// pages/main/portfolio/index.ts
+
+import config from "../../../config/index";
+import Events from "../../../utils/Events";
+import Time from "../../../utils/Time";
+import { Journal, JournalItemType } from "../journal/index";
+
+interface IPortfolioData {
+	page: {
+		index: number;
+		size: number;
+		type: string;
+		orderMap?: object;
+	}
+	list: Journal[];
+	isFetching: boolean;
+	isFinished: boolean;
+	stickyOffset: number;
+}
+
+Page({
+	data: <IPortfolioData>{
+		page: {
+			index: 0,
+			size: 8,
+			type: "PORTFOLIO",
+			orderMap: {
+				createdAt: "DESC"
+			}
+		},
+		list: [],
+		isFetching: false,
+		isFinished: false,
+		stickyOffset: 0
+	},
+	onLoad() {
+		Events.reset("JOURNAL_PORTFOLIO_REFRESH", () => {
+			this.setData({
+				page: {
+					index: 0,
+					size: 8,
+					type: "PORTFOLIO",
+					orderMap: {
+						createdAt: "DESC"
+					}
+				},
+				list: [],
+				isFetching: false,
+				isFinished: false
+			});
+			this.fetch();
+		});
+		this.getCustomNavbarHeight();
+		this.setData({
+			list: []
+		})
+		this.fetch();
+	},
+	onReachBottom() {
+		this.fetch();
+	},
+	getCustomNavbarHeight() {
+		const query = wx.createSelectorQuery();
+		query.select(".custom-navbar").boundingClientRect();
+		query.exec((res) => {
+			const { height = 0 } = res[0] || {};
+			this.setData({ stickyOffset: height });
+		});
+	},
+	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: async (resp: any) => {
+				const list = resp.data.data.list;
+				if (!list || list.length === 0) {
+					this.setData({
+						isFinished: true
+					})
+					return;
+				}
+				const result = list.map((journal: any) => {
+					return {
+						date: Time.toPassedDate(journal.createdAt),
+						idea: journal.idea,
+						lat: journal.lat,
+						lng: journal.lng,
+						location: journal.location,
+						items: journal.items.filter((item: any) => item.attachType === "THUMB").map((item: any) => {
+							const ext = JSON.parse(item.ext);
+							return {
+								type: ext.isVideo ? JournalItemType.VIDEO : JournalItemType.IMAGE,
+								thumbUrl: `${config.url}/attachment/read/${item.mongoId}`,
+								mongoId: item.mongoId,
+								source: journal.items.find((source: any) => source.id === ext.sourceId)
+							}
+						})
+					}
+				})
+				this.setData({
+					page: {
+						index: this.data.page.index + 1,
+						size: 8,
+						type: "PORTFOLIO",
+						orderMap: {
+							createdAt: "DESC"
+						}
+					},
+					list: this.data.list.concat(result),
+					isFinished: list.length < this.data.page.size
+				});
+			},
+			complete: () => {
+				this.setData({
+					isFetching: false
+				});
+			}
+		});
+	},
+	preview(e: WechatMiniprogram.BaseEvent) {
+		const journalIndex = e.target.dataset.journalIndex;
+		const itemIndex = e.target.dataset.itemIndex;
+		const items = this.data.list[journalIndex].items;
+		const total = items.length;
+		
+		const startIndex = Math.max(0, itemIndex - 25);
+		const endIndex = Math.min(total, startIndex + 50);
+		const newCurrentIndex = itemIndex - startIndex;
+
+		const sources = items.slice(startIndex, endIndex).map((item: any) => {
+			return {
+				url: `${config.url}/attachment/read/${item.source.mongoId}`,
+				type: item.type === 0 ? "image" : "video"
+			}
+		}) as any;
+		wx.previewMedia({
+			current: newCurrentIndex,
+			sources
+		})
+	}
+});