// components/journal-detail-panel/index.ts

interface JournalInfo {
	id: number;
	date: string;
	time: string;
	lat?: number;
	lng?: number;
	location?: string;
	idea?: string;
	items: Array<{
		type: number;
		thumbURL: string;
		sourceURL: string;
		mongoId: string;
	}>;
}

interface JournalDetailPanelData {
	currentJournalIndex: number;
}

Component({
	properties: {
		visible: {
			type: Boolean,
			value: false
		},
		title: {
			type: String,
			value: ""
		},
		journals: {
			type: Array,
			value: []
		},
		mode: {
			type: String,
			value: "DATE"
		}
	},
	data: <JournalDetailPanelData>{
		currentJournalIndex: 0,
	},

	observers: {
		'journals, visible'(journals: JournalInfo[], visible: boolean) {
			if (visible && journals && journals.length > 0) {
				// 显示时重置索引和 margin
				this.setData({
					currentJournalIndex: 0,
				});
			}
		}
	},

	methods: {
		/** 关闭详情 */
		closeDetail() {
			this.triggerEvent("close");
		},
		/** swiper 切换事件 */
		onSwiperChange(e: WechatMiniprogram.SwiperChange) {
			this.setData({
				currentJournalIndex: e.detail.current
			});
		},
		openLocation(e: WechatMiniprogram.BaseEvent) {
			const { journalIndex } = e.currentTarget.dataset;
			if (!journalIndex && this.properties.mode !== "LOCATION") {
				return;
			}
			const journals = this.properties.journals as JournalInfo[];
			const journal = journals[journalIndex || 0];
			if (journal.lat && journal.lng) {
				wx.openLocation({
					latitude: journal.lat,
					longitude: journal.lng,
				});
			}
		},

		/** 预览媒体 */
		previewMedia(e: WechatMiniprogram.BaseEvent) {
			const journals = this.properties.journals as JournalInfo[];
			if (!journals || journals.length === 0) {
				return;
			}
			const { itemIndex } = e.currentTarget.dataset;
			const items = journals[this.data.currentJournalIndex].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) => {
				return {
					url: item.sourceURL,
					type: item.type === 0 ? "image" : "video"
				}
			}) as any;
			wx.previewMedia({
				current: newCurrentIndex,
				sources
			})
		}
	}
});