Compare commits

...

11 Commits

Author SHA1 Message Date
f837c4d4d9 update 1.5.2 2025-12-11 15:09:12 +08:00
3a8f7b0f19 fix location margin 2025-12-11 15:09:03 +08:00
dc71590bd9 fix progress 2025-12-11 15:06:50 +08:00
0cdef54954 fix menu position 2025-12-11 14:46:55 +08:00
fc6edcb5ab fix creater,editor preview 2025-12-11 14:26:16 +08:00
61171a6df7 fix openLocation fail 2025-12-11 14:17:24 +08:00
501745d937 fix bottom padding 2025-12-11 12:07:06 +08:00
1bf655c0dc refactor journal-detail-popup 2025-12-11 12:02:01 +08:00
0379a1d3b5 open Location in journal-map 2025-12-11 01:05:02 +08:00
861ae8baff support change type 2025-12-11 00:46:11 +08:00
2cb8f16ccc fix preview overflow 2025-12-11 00:27:58 +08:00
28 changed files with 633 additions and 522 deletions

View File

@ -7,10 +7,8 @@
flex-direction: column; flex-direction: column;
.year { .year {
color: var(--theme-text-secondary);
display: flex; display: flex;
padding: 16rpx 32rpx; padding: 16rpx 32rpx;
background: transparent;
align-items: center; align-items: center;
margin-bottom: 24rpx; margin-bottom: 24rpx;
justify-content: space-between; justify-content: space-between;
@ -52,16 +50,16 @@
.months { .months {
flex: 1; flex: 1;
height: 0; height: 0;
padding-bottom: 256rpx; padding-bottom: 210rpx;
.month { .month {
padding: 0 32rpx; padding: 0 32rpx;
.title { .title {
color: var(--theme-text); color: var(--theme-text);
font-size: 28rpx; font-size: 32rpx;
margin-top: 32rpx; margin-top: 32rpx;
font-weight: 600; font-weight: bold;
} }
.days { .days {

View File

@ -1,116 +0,0 @@
// 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
},
// 标题(如 "2024 年 1 月 1 日" 或位置名称)
title: {
type: String,
value: ""
},
// 日记列表
journals: {
type: Array,
value: []
},
// 是否显示标题位置图标
showLocationIcon: {
type: Boolean,
value: false
},
// 是否显示每条日记的日期
showJournalDate: {
type: Boolean,
value: true
},
// 是否显示每条日记的位置
showJournalLocation: {
type: Boolean,
value: true
}
},
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;
const journals = this.properties.journals as JournalInfo[];
const journal = journals[journalIndex];
if (journal.lat && journal.lng) {
wx.openLocation({
latitude: journal.lat,
longitude: journal.lng,
});
}
},
/** 预览媒体 */
previewMedia(e: WechatMiniprogram.BaseEvent) {
const { mediaIndex } = e.currentTarget.dataset;
const journals = this.properties.journals as JournalInfo[];
if (!journals || journals.length === 0) return;
// 使用当前 swiper 的索引
const journal = journals[this.data.currentJournalIndex];
const sources = journal.items.map((item: any) => ({
url: item.sourceURL,
type: item.type === 0 ? "image" : "video"
}));
wx.previewMedia({
current: mediaIndex,
sources: sources as WechatMiniprogram.MediaSource[]
});
}
}
});

View File

@ -12,12 +12,12 @@
overflow: hidden; overflow: hidden;
flex-direction: column; flex-direction: column;
.header { > .header {
display: flex; display: flex;
padding: 32rpx 32rpx 0 32rpx; padding: 32rpx 32rpx 0 32rpx;
flex-shrink: 0; flex-shrink: 0;
margin-bottom: 24rpx;
align-items: flex-start; align-items: flex-start;
margin-bottom: 24rpx;
justify-content: space-between; justify-content: space-between;
.info { .info {
@ -30,13 +30,19 @@
font-size: 32rpx; font-size: 32rpx;
font-weight: 600; font-weight: 600;
align-items: center; align-items: center;
margin-bottom: 8rpx;
.icon { .icon {
color: var(--theme-wx); color: var(--theme-wx);
font-size: 48rpx; font-size: 48rpx;
margin-right: 8rpx; margin-right: 8rpx;
} }
.text {
width: calc(100% - 90rpx);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
} }
} }
@ -50,9 +56,9 @@
color: var(--theme-wx); color: var(--theme-wx);
padding: 4rpx 12rpx; padding: 4rpx 12rpx;
font-size: 24rpx; font-size: 24rpx;
font-weight: 600; font-weight: bold;
border-radius: 12rpx;
background: var(--theme-bg-journal); background: var(--theme-bg-journal);
border-radius: 12rpx;
} }
} }
} }
@ -69,14 +75,24 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.journal-header { .header {
gap: 16rpx; gap: 16rpx;
display: flex; display: flex;
padding: 0 32rpx; padding: 0 32rpx;
flex-wrap: wrap;
flex-shrink: 0; flex-shrink: 0;
align-items: center;
margin-bottom: 16rpx; margin-bottom: 16rpx;
align-items: baseline;
.portfolio {
color: #FFF;
width: 52rpx;
padding: 4rpx 8rpx;
font-size: 24rpx;
background: var(--theme-wx);
text-align: center;
font-weight: bold;
border-radius: 8rpx;
}
.location { .location {
gap: 8rpx; gap: 8rpx;
@ -95,14 +111,9 @@
} }
} }
.date { .datetime {
flex: 1;
font-size: 28rpx; font-size: 28rpx;
font-weight: 600; font-weight: bold;
}
.time {
font-size: 24rpx;
} }
} }

View File

@ -0,0 +1,146 @@
// components/journal-detail-panel/index.ts
import { Journal } from "../../types/Journal";
import config from "../../config/index";
import { MediaAttachExt, MediaAttachType } from "../../types/Attachment";
import { MediaItem, MediaItemType } from "../../types/UI";
import Time from "../../utils/Time";
interface JournalDetailPanelData {
journals: Journal[];
currentJournalIndex: number;
}
Component({
properties: {
visible: {
type: Boolean,
value: false
},
ids: {
type: Array,
value: []
},
mode: {
type: String,
value: "DATE"
}
},
data: <JournalDetailPanelData>{
journals: [],
currentJournalIndex: 0,
},
observers: {
async 'ids, visible'(ids: number[], visible: boolean) {
if (visible && ids && 0 < ids.length) {
wx.showLoading({ title: "加载中...", mask: true });
try {
const journals: Journal[] = await new Promise((resolve, reject) => {
wx.request({
url: `${config.url}/journal/list/ids`,
method: "POST",
header: {
Key: wx.getStorageSync("key")
},
data: ids,
success: (resp: any) => {
if (resp.data.code === 20000) {
resolve(resp.data.data);
} else {
reject(new Error(resp.data.message || "加载失败"));
}
},
fail: reject
});
}) || [];
journals.forEach(journal => {
journal.date = Time.toPassedDate(journal.createdAt);
journal.time = Time.toTime(journal.createdAt);
journal.datetime = Time.toPassedDateTime(journal.createdAt);
const thumbItems = journal.items?.filter((item) => item.attachType === MediaAttachType.THUMB);
if (!thumbItems) {
return;
}
const mediaItems: MediaItem[] = thumbItems.map((thumbItem) => {
const ext = thumbItem.ext = JSON.parse(thumbItem.ext!.toString()) as MediaAttachExt;
const thumbURL = `${config.url}/attachment/read/${thumbItem.mongoId}`;
const sourceURL = `${config.url}/attachment/read/${ext.sourceMongoId}`;
return {
type: ext.isVideo ? MediaItemType.VIDEO : MediaItemType.IMAGE,
thumbURL,
sourceURL,
size: thumbItem.size || 0,
attachmentId: thumbItem.id
} as MediaItem;
});
journal.mediaItems = mediaItems;
})
this.setData({
journals,
currentJournalIndex: 0,
});
wx.hideLoading();
} catch (err: any) {
wx.hideLoading();
wx.showToast({
title: err.message || "加载失败",
icon: "error"
});
}
}
}
},
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 Journal[];
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 Journal[];
if (!journals || journals.length === 0) {
return;
}
const { itemIndex } = e.currentTarget.dataset;
const items = journals[this.data.currentJournalIndex].mediaItems!;
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
})
}
}
});

View File

@ -9,10 +9,11 @@
<view class="detail-content"> <view class="detail-content">
<view class="header"> <view class="header">
<view class="info"> <view class="info">
<view wx:if="{{title}}" class="title"> <view wx:if="{{mode === 'LOCATION'}}" class="title" catchtap="openLocation">
<t-icon wx:if="{{showLocationIcon}}" class="icon" name="location-filled" /> <t-icon wx:if="{{mode === 'LOCATION'}}" class="icon" name="location-filled" />
<text>{{title}}</text> <text class="text">{{journals[currentJournalIndex].location}}</text>
</view> </view>
<text wx:if="{{mode === 'DATE'}}" class="title">{{journals[currentJournalIndex].datetime}}</text>
</view> </view>
<view class="actions"> <view class="actions">
<view wx:if="{{journals.length > 1}}" class="indicator"> <view wx:if="{{journals.length > 1}}" class="indicator">
@ -25,9 +26,10 @@
<block wx:for="{{journals}}" wx:key="id"> <block wx:for="{{journals}}" wx:key="id">
<swiper-item class="swiper-item-wrapper"> <swiper-item class="swiper-item-wrapper">
<view class="journal-item"> <view class="journal-item">
<view class="journal-header"> <view class="header">
<view wx:if="{{item.type === 'PORTFOLIO'}}" class="portfolio">专拍</view>
<view <view
wx:if="{{item.location && showJournalLocation}}" wx:if="{{item.location && mode === 'DATE'}}"
class="location" class="location"
catchtap="openLocation" catchtap="openLocation"
data-journal-index="{{currentJournalIndex}}" data-journal-index="{{currentJournalIndex}}"
@ -35,19 +37,19 @@
<t-icon class="icon" name="location-filled" /> <t-icon class="icon" name="location-filled" />
<text class="text">{{item.location}}</text> <text class="text">{{item.location}}</text>
</view> </view>
<view wx:if="{{showJournalDate}}" class="date">{{item.date}}</view> <view wx:if="{{mode === 'LOCATION'}}" class="datetime">{{item.datetime}}</view>
</view> </view>
<view wx:if="{{item.idea}}" class="idea">{{item.idea}}</view> <view wx:if="{{item.idea}}" class="idea">{{item.idea}}</view>
<scroll-view wx:if="{{item.items && item.items.length > 0}}" scroll-y class="items-scroll"> <scroll-view wx:if="{{item.mediaItems && item.mediaItems.length > 0}}" scroll-y class="items-scroll">
<view class="items"> <view class="items">
<view class="wrapper"> <view class="wrapper">
<block wx:for="{{item.items}}" wx:key="mongoId" wx:for-item="media" wx:for-index="mediaIndex"> <block wx:for="{{item.mediaItems}}" wx:key="mongoId" wx:for-item="media" wx:for-index="itemIndex">
<image <image
class="item thumbnail {{media.type === 1 ? 'video' : 'image'}}" class="item thumbnail {{media.type === 1 ? 'video' : 'image'}}"
src="{{media.thumbURL}}" src="{{media.thumbURL}}"
mode="widthFix" mode="widthFix"
catchtap="previewMedia" catchtap="previewMedia"
data-media-index="{{mediaIndex}}" data-item-index="{{itemIndex}}"
/> />
</block> </block>
</view> </view>

View File

@ -26,7 +26,7 @@
</view> </view>
<view class="item"> <view class="item">
<text class="label">版本:</text> <text class="label">版本:</text>
<text>1.5.1</text> <text>1.5.2</text>
</view> </view>
<view class="item copyright"> <view class="item copyright">
<text>{{copyright}}</text> <text>{{copyright}}</text>

View File

@ -2,7 +2,9 @@
"component": true, "component": true,
"usingComponents": { "usingComponents": {
"t-icon": "tdesign-miniprogram/icon/icon", "t-icon": "tdesign-miniprogram/icon/icon",
"t-radio": "tdesign-miniprogram/radio/radio",
"t-button": "tdesign-miniprogram/button/button", "t-button": "tdesign-miniprogram/button/button",
"t-navbar": "tdesign-miniprogram/navbar/navbar" "t-navbar": "tdesign-miniprogram/navbar/navbar",
"t-radio-group": "tdesign-miniprogram/radio-group/radio-group"
} }
} }

View File

@ -16,6 +16,14 @@
width: 100%; width: 100%;
margin-top: 1.5rem; margin-top: 1.5rem;
&.type {
display: flex;
.radio {
margin-right: 1em;
}
}
&.time { &.time {
display: flex; display: flex;
@ -103,9 +111,20 @@
} }
} }
.progress { .uploading {
width: 100%; width: 100%;
margin-top: 1rem; margin-top: 1rem;
.progress {
margin-bottom: 8rpx;
}
.text {
color: var(--theme-text-secondary);
display: flex;
font-size: .8rem;
justify-content: space-between;
}
} }
.ctrl { .ctrl {

View File

@ -3,6 +3,8 @@ import Events from "../../../utils/Events";
import Time from "../../../utils/Time"; import Time from "../../../utils/Time";
import Toolkit from "../../../utils/Toolkit"; import Toolkit from "../../../utils/Toolkit";
import config from "../../../config/index"; import config from "../../../config/index";
import { JournalType } from "../../../types/Journal";
import IOSize, { Unit } from "../../../utils/IOSize";
enum MediaItemType { enum MediaItemType {
IMAGE, IMAGE,
@ -28,10 +30,16 @@ interface JournalEditorData {
idea: string; idea: string;
date: string; date: string;
time: string; time: string;
type: JournalType;
mediaList: MediaItem[]; mediaList: MediaItem[];
location?: Location; location?: Location;
qqMapSDK?: any; qqMapSDK?: any;
isAuthLocation: boolean; isAuthLocation: boolean;
uploaded: string;
uploadTotal: string;
uploadSpeed: string;
uploadProgress: number;
isSubmitting: boolean;
} }
Page({ Page({
@ -39,15 +47,18 @@ Page({
idea: "", idea: "",
date: "2025-06-28", date: "2025-06-28",
time: "16:00", time: "16:00",
type: JournalType.NORMAL,
mediaList: [], mediaList: [],
location: undefined, location: undefined,
submitText: "提交", isAuthLocation: false,
uploaded: "0",
uploadTotal: "0 MB",
uploadSpeed: "0 MB / s",
uploadProgress: 0,
isSubmitting: false, isSubmitting: false,
submitProgress: 0,
mediaItemTypeEnum: { mediaItemTypeEnum: {
...MediaItemType ...MediaItemType
}, }
isAuthLocation: false
}, },
async onLoad() { async onLoad() {
// 授权定位 // 授权定位
@ -97,6 +108,10 @@ Page({
}); });
}); });
}, },
onChangeType(e: any) {
const { value } = e.detail;
this.setData({ type: value });
},
async chooseLocation() { async chooseLocation() {
const location = await wx.chooseLocation({}); const location = await wx.chooseLocation({});
this.setData({ this.setData({
@ -153,14 +168,22 @@ Page({
}) })
}, },
preview(e: WechatMiniprogram.BaseEvent) { preview(e: WechatMiniprogram.BaseEvent) {
const itemIndex = e.currentTarget.dataset.index;
const total = this.data.mediaList.length;
const startIndex = Math.max(0, itemIndex - 25);
const endIndex = Math.min(total, startIndex + 50);
const newCurrentIndex = itemIndex - startIndex;
const sources = this.data.mediaList.slice(startIndex, endIndex).map(item => {
return {
url: item.path,
type: MediaItemType[item.type].toLowerCase()
} as WechatMiniprogram.MediaSource;
});
wx.previewMedia({ wx.previewMedia({
current: e.currentTarget.dataset.index, current: newCurrentIndex,
sources: this.data.mediaList.map(item => { sources
return {
url: item.path,
type: MediaItemType[item.type].toLowerCase()
} as WechatMiniprogram.MediaSource;
})
}); });
}, },
deleteMedia(e: WechatMiniprogram.BaseEvent) { deleteMedia(e: WechatMiniprogram.BaseEvent) {
@ -179,16 +202,15 @@ Page({
submit() { submit() {
const handleFail = () => { const handleFail = () => {
wx.showToast({ title: "上传失败", icon: "error" }); wx.showToast({ title: "上传失败", icon: "error" });
wx.hideLoading();
this.setData({ this.setData({
submitText: "提交",
isSubmitting: false isSubmitting: false
}) });
}; };
this.setData({ this.setData({
submitText: "正在提交..",
isSubmitting: true isSubmitting: true
}) });
// 获取 openId // 获取 openId
const getOpenId = new Promise<string>((resolve, reject) => { const getOpenId = new Promise<string>((resolve, reject) => {
@ -224,51 +246,97 @@ Page({
// 文件上传 // 文件上传
const uploadFiles = new Promise<string[]>((resolve, reject) => { const uploadFiles = new Promise<string[]>((resolve, reject) => {
const mediaList = this.data.mediaList || []; const mediaList = this.data.mediaList || [];
const total = mediaList.length; if (mediaList.length === 0) {
let completed = 0;
if (total === 0) {
resolve([]); resolve([]);
return; return;
} }
// 更新进度初始状态
this.setData({
submitProgress: 0,
});
const uploadPromises = mediaList.map((item) => { wx.showLoading({ title: "正在上传..", mask: true });
return new Promise<string>((uploadResolve, uploadReject) => {
wx.uploadFile({ // 计算总大小
url: `${config.url}/temp/file/upload`, const sizePromises = mediaList.map(item => {
return new Promise<number>((sizeResolve, sizeReject) => {
wx.getFileSystemManager().getFileInfo({
filePath: item.path, filePath: item.path,
name: "file", success: (res) => sizeResolve(res.size),
success: (resp) => { fail: (err) => sizeReject(err)
const result = JSON.parse(resp.data);
if (result && result.code === 20000) {
completed++;
// 更新进度
this.setData({
submitProgress: (completed / total),
});
uploadResolve(result.data[0].id);
} else {
uploadReject(new Error(`文件上传失败: ${result?.message || '未知错误'}`));
}
},
fail: (err) => uploadReject(new Error(`文件上传失败: ${err.errMsg}`))
}); });
}); });
}); });
// 并行执行所有文件上传 Promise.all(sizePromises).then(fileSizes => {
Promise.all(uploadPromises).then((tempFileIds) => { const totalSize = fileSizes.reduce((acc, size) => acc + size, 0);
const uploadTasks: WechatMiniprogram.UploadTask[] = [];
let uploadedSize = 0;
let lastUploadedSize = 0;
this.setData({ this.setData({
submitProgress: 1, uploadTotal: IOSize.format(totalSize, 2, Unit.MB)
});
// 计算上传速度
const speedUpdateInterval = setInterval(() => {
const chunkSize = uploadedSize - lastUploadedSize;
this.setData({
uploadSpeed: `${IOSize.format(chunkSize)} / s`
});
lastUploadedSize = uploadedSize;
}, 1000);
// 上传文件
const uploadPromises = mediaList.map(item => {
return new Promise<string>((uploadResolve, uploadReject) => {
const task = wx.uploadFile({
url: `${config.url}/temp/file/upload`,
filePath: item.path,
name: "file",
success: (resp) => {
const result = JSON.parse(resp.data);
if (result && result.code === 20000) {
uploadResolve(result.data[0].id);
} else {
uploadReject(new Error(`文件上传失败: ${result?.message || "未知错误"}`));
}
},
fail: (err) => uploadReject(new Error(`文件上传失败: ${err.errMsg}`))
});
// 监听上传进度
let prevProgress = 0;
task.onProgressUpdate((res) => {
const fileUploaded = (res.totalBytesExpectedToSend * res.progress) / 100;
const delta = fileUploaded - prevProgress;
uploadedSize += delta;
prevProgress = fileUploaded;
// 更新进度条
this.setData({
uploaded: IOSize.formatWithoutUnit(uploadedSize, 2, Unit.MB),
uploadProgress: Math.round((uploadedSize / totalSize) * 10000) / 100
});
});
uploadTasks.push(task);
});
});
Promise.all(uploadPromises).then((tempFileIds) => {
// 清除定时器
clearInterval(speedUpdateInterval);
uploadTasks.forEach(task => task.offProgressUpdate());
this.setData({
uploadProgress: 100,
uploadSpeed: "0 MB / s"
});
resolve(tempFileIds);
}).catch((e: Error) => {
// 取消所有上传任务
uploadTasks.forEach(task => task.abort());
clearInterval(speedUpdateInterval);
reject(e);
}); });
resolve(tempFileIds);
}).catch(reject); }).catch(reject);
}); });
// 并行执行获取 openId 和文件上传 // 并行执行获取 openId 和文件上传
Promise.all([getOpenId, uploadFiles]).then(([openId, tempFileIds]) => { Promise.all([getOpenId, uploadFiles]).then(([openId, tempFileIds]) => {
wx.showLoading({ title: "正在保存..", mask: true });
wx.request({ wx.request({
url: `${config.url}/journal/create`, url: `${config.url}/journal/create`,
method: "POST", method: "POST",
@ -276,31 +344,33 @@ Page({
Key: wx.getStorageSync("key") Key: wx.getStorageSync("key")
}, },
data: { data: {
type: "NORMAL",
idea: this.data.idea, idea: this.data.idea,
createdAt: Date.parse(`${this.data.date} ${this.data.time}`), type: this.data.type,
lat: this.data.location?.lat, lat: this.data.location?.lat,
lng: this.data.location?.lng, lng: this.data.location?.lng,
location: this.data.location?.text, location: this.data.location?.text,
pusher: openId, pusher: openId,
createdAt: Date.parse(`${this.data.date} ${this.data.time}`),
tempFileIds tempFileIds
}, },
success: async (resp: any) => { success: async () => {
Events.emit("JOURNAL_REFRESH"); Events.emit("JOURNAL_REFRESH");
wx.showToast({ title: "提交成功", icon: "success" }); wx.showToast({ title: "提交成功", icon: "success" });
this.setData({ this.setData({
idea: "", idea: "",
mediaList: [], mediaList: [],
submitText: "提交",
isSubmitting: false, isSubmitting: false,
uploaded: "0",
uploadTotal: "0 MB",
uploadProgress: 0
}); });
await Toolkit.sleep(1000); await Toolkit.sleep(1000);
wx.switchTab({ wx.switchTab({
url: "/pages/main/journal/index", url: "/pages/main/journal/index"
}) });
}, },
fail: handleFail fail: handleFail
}); });
}).catch(handleFail); }).catch(handleFail);
} }
}); });

View File

@ -17,6 +17,13 @@
model:value="{{idea}}" model:value="{{idea}}"
/> />
</view> </view>
<view class="section type">
<text class="label">类型:</text>
<t-radio-group bind:change="onChangeType" 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"> <view class="section time">
<text class="label">时间:</text> <text class="label">时间:</text>
<picker class="picker" mode="date" model:value="{{date}}"> <picker class="picker" mode="date" model:value="{{date}}">
@ -80,13 +87,17 @@
</t-button> </t-button>
</view> </view>
</view> </view>
<progress <view wx:if="{{isSubmitting}}" class="uploading">
wx:if="{{isSubmitting}}" <progress
class="progress" class="progress"
percent="{{submitProgress.toFixed(2) * 100}}" percent="{{uploadProgress}}"
show-info stroke-width="6"
stroke-width="4" />
/> <view class="text">
<view>{{uploaded}} / {{uploadTotal}}</view>
<view>{{uploadSpeed}}</view>
</view>
</view>
<view class="ctrl"> <view class="ctrl">
<t-button <t-button
class="clear" class="clear"
@ -101,7 +112,7 @@
theme="primary" theme="primary"
bind:tap="submit" bind:tap="submit"
disabled="{{(!idea && mediaList.length === 0) || isSubmitting}}" disabled="{{(!idea && mediaList.length === 0) || isSubmitting}}"
>{{submitText}}</t-button> >提交</t-button>
</view> </view>
</view> </view>
</scroll-view> </scroll-view>

View File

@ -1,8 +1,8 @@
{ {
"usingComponents": { "usingComponents": {
"t-navbar": "tdesign-miniprogram/navbar/navbar",
"calendar": "/components/calendar/index", "calendar": "/components/calendar/index",
"journal-detail-panel": "/components/journal-detail-panel/index" "t-navbar": "tdesign-miniprogram/navbar/navbar",
"journal-detail-popup": "/components/journal-detail-popup/index"
}, },
"navigationStyle": "custom" "navigationStyle": "custom"
} }

View File

@ -1,49 +1,28 @@
// pages/main/journal-date/index.ts // pages/main/journal-date/index.ts
import config from "../../../config/index"; import config from "../../../config/index";
import Time from "../../../utils/Time";
import { Journal, JournalPageType } from "../../../types/Journal"; import { Journal, JournalPageType } from "../../../types/Journal";
import { MediaAttachType } from "../../../types/Attachment"; import Time from "../../../utils/Time";
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 SelectedDateInfo {
displayDate: string;
journals: JournalInfo[];
}
interface JournalDateData { interface JournalDateData {
journalMap: Record<string, number[]>; // 存储每个日期的日记 id 列表 // 存储每个日期的日记 id 列表
selectedDate: SelectedDateInfo | null;
isLoading: boolean; isLoading: boolean;
popupVisible: boolean; // popup 显示状态 journalMap: Record<string, number[]>;
popupIds: number[];
popupVisible: boolean;
} }
Page({ Page({
data: <JournalDateData>{ data: <JournalDateData>{
journalMap: {},
selectedDate: null,
isLoading: true, isLoading: true,
popupVisible: false journalMap: {},
},
popupIds: [],
popupVisible: false,
},
async onLoad() { async onLoad() {
await this.loadJournals(); await this.loadJournals();
}, },
/** 加载所有日记 */ /** 加载所有日记 */
async loadJournals() { async loadJournals() {
this.setData({ isLoading: true }); this.setData({ isLoading: true });
@ -70,24 +49,19 @@ Page({
fail: reject fail: reject
}); });
}) || []; }) || [];
// 按日期分组,只存储 id // 按日期分组,只存储 id
const journalMap: Record<string, number[]> = {}; const journalMap: Record<string, number[]> = {};
list.forEach((journal: any) => { list.forEach((journal: any) => {
const date = new Date(journal.createdAt); const dateKey = Time.toDate(journal.createdAt);
const dateKey = `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
if (!journalMap[dateKey]) { if (!journalMap[dateKey]) {
journalMap[dateKey] = []; journalMap[dateKey] = [];
} }
journalMap[dateKey].push(journal.id); journalMap[dateKey].push(journal.id);
}); });
// 按 id 倒序排序每天的日记 // 按 id 倒序排序每天的日记
Object.keys(journalMap).forEach(dateKey => { Object.keys(journalMap).forEach(dateKey => {
journalMap[dateKey].sort((a, b) => b - a); journalMap[dateKey].sort((a, b) => b - a);
}); });
this.setData({ this.setData({
journalMap, journalMap,
isLoading: false isLoading: false
@ -100,12 +74,10 @@ Page({
this.setData({ isLoading: false }); this.setData({ isLoading: false });
} }
}, },
/** 日期选择事件(来自 calendar 组件) */ /** 日期选择事件(来自 calendar 组件) */
onDateSelect(e: WechatMiniprogram.CustomEvent) { onDateSelect(e: WechatMiniprogram.CustomEvent) {
const { date, year, month, day } = e.detail; const { date } = e.detail;
const journalIds = this.data.journalMap[date]; const journalIds = this.data.journalMap[date];
if (!journalIds || journalIds.length === 0) { if (!journalIds || journalIds.length === 0) {
wx.showToast({ wx.showToast({
title: "该日期无日记", title: "该日期无日记",
@ -113,81 +85,22 @@ Page({
}); });
return; return;
} }
// 调用接口获取详情 // 调用接口获取详情
this.loadJournalsByIds(journalIds, `${year}${month}${day}`); this.loadJournalsByIds(journalIds);
}, },
/** 根据 id 列表加载日记详情 */ /** 根据 id 列表加载日记详情 */
async loadJournalsByIds(ids: number[], displayDate: string) { async loadJournalsByIds(ids: number[]) {
wx.showLoading({ title: "加载中...", mask: true }); this.setData({
try { popupIds: ids,
const list: Journal[] = await new Promise((resolve, reject) => { popupVisible: true
wx.request({ });
url: `${config.url}/journal/list/ids`, wx.hideLoading();
method: "POST",
header: {
Key: wx.getStorageSync("key")
},
data: ids,
success: (resp: any) => {
if (resp.data.code === 20000) {
resolve(resp.data.data);
} else {
reject(new Error(resp.data.message || "加载失败"));
}
},
fail: reject
});
}) || [];
// 转换为 JournalInfo 格式
const journals: JournalInfo[] = list.sort((a, b) => a.createdAt! - b.createdAt!).map((journal: any) => {
const date = new Date(journal.createdAt);
return {
id: journal.id,
date: Time.toPassedDateTime(journal.createdAt),
time: `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`,
lat: journal.lat,
lng: journal.lng,
location: journal.location,
idea: journal.idea,
items: journal.items
.filter((item: any) => item.attachType === MediaAttachType.THUMB)
.map((item: any) => {
const ext = JSON.parse(item.ext);
return {
type: ext.isVideo ? 1 : 0,
thumbURL: `${config.url}/attachment/read/${item.mongoId}`,
sourceURL: `${config.url}/attachment/read/${ext.sourceMongoId}`,
mongoId: item.mongoId,
};
})
};
});
this.setData({
selectedDate: {
displayDate,
journals
},
popupVisible: true // 显示 popup
});
wx.hideLoading();
} catch (err: any) {
wx.hideLoading();
wx.showToast({
title: err.message || "加载失败",
icon: "error"
});
}
}, },
/** 关闭详情 */ /** 关闭详情 */
closeDetail() { closeDetail() {
this.setData({ this.setData({
popupVisible: false, popupVisible: false,
selectedDate: null popupIds: []
}); });
} }
}); });

View File

@ -9,11 +9,9 @@
</view> </view>
</view> </view>
<!-- 详情面板 --> <!-- 详情面板 -->
<journal-detail-panel <journal-detail-popup
visible="{{popupVisible}}" visible="{{popupVisible}}"
title="{{selectedDate.displayDate}}" ids="{{popupIds}}"
journals="{{selectedDate.journals}}" mode="DATE"
show-journal-date="{{false}}"
show-journal-location="{{true}}"
bind:close="closeDetail" bind:close="closeDetail"
/> />

View File

@ -2,9 +2,11 @@
"component": true, "component": true,
"usingComponents": { "usingComponents": {
"t-icon": "tdesign-miniprogram/icon/icon", "t-icon": "tdesign-miniprogram/icon/icon",
"t-input": "tdesign-miniprogram/input/input",
"t-radio": "tdesign-miniprogram/radio/radio",
"t-button": "tdesign-miniprogram/button/button", "t-button": "tdesign-miniprogram/button/button",
"t-navbar": "tdesign-miniprogram/navbar/navbar", "t-navbar": "tdesign-miniprogram/navbar/navbar",
"t-dialog": "tdesign-miniprogram/dialog/dialog", "t-dialog": "tdesign-miniprogram/dialog/dialog",
"t-input": "tdesign-miniprogram/input/input" "t-radio-group": "tdesign-miniprogram/radio-group/radio-group"
} }
} }

View File

@ -22,6 +22,14 @@
width: 100%; width: 100%;
margin-top: 1.5rem; margin-top: 1.5rem;
&.type {
display: flex;
.radio {
margin-right: 1em;
}
}
&.time { &.time {
display: flex; display: flex;
@ -111,9 +119,20 @@
} }
} }
.progress { .uploading {
width: 100%; width: 100%;
margin-top: 1rem; margin-top: 1rem;
.progress {
margin-bottom: 8rpx;
}
.text {
color: var(--theme-text-secondary);
display: flex;
font-size: .8rem;
justify-content: space-between;
}
} }
.ctrl { .ctrl {

View File

@ -4,22 +4,26 @@ import Time from "../../../utils/Time";
import Toolkit from "../../../utils/Toolkit"; import Toolkit from "../../../utils/Toolkit";
import config from "../../../config/index"; import config from "../../../config/index";
import { Location, MediaItem, MediaItemType, WechatMediaItem } from "../../../types/UI"; import { Location, MediaItem, MediaItemType, WechatMediaItem } from "../../../types/UI";
import { Journal } from "../../../types/Journal"; import { Journal, JournalType } from "../../../types/Journal";
import { MediaAttachExt, MediaAttachType } from "../../../types/Attachment"; import { MediaAttachExt, MediaAttachType } from "../../../types/Attachment";
import IOSize, { Unit } from "../../../utils/IOSize";
interface JournalEditorData { interface JournalEditorData {
id?: number; id?: number;
idea: string; idea: string;
date: string; date: string;
time: string; time: string;
type: JournalType;
mediaList: MediaItem[]; mediaList: MediaItem[];
newMediaList: WechatMediaItem[]; newMediaList: WechatMediaItem[];
location?: Location; location?: Location;
isAuthLocation: boolean; isAuthLocation: boolean;
isLoading: boolean; isLoading: boolean;
saveText: string;
isSaving: boolean; isSaving: boolean;
saveProgress: number; uploaded: string;
uploadTotal: string;
uploadSpeed: string;
uploadProgress: number;
mediaItemTypeEnum: any; mediaItemTypeEnum: any;
deleteDialogVisible: boolean; deleteDialogVisible: boolean;
deleteConfirmText: string; deleteConfirmText: string;
@ -31,13 +35,16 @@ Page({
idea: "", idea: "",
date: "2025-06-28", date: "2025-06-28",
time: "16:00", time: "16:00",
type: JournalType.NORMAL,
mediaList: [], mediaList: [],
newMediaList: [], newMediaList: [],
location: undefined, location: undefined,
saveText: "保存",
isSaving: false, isSaving: false,
saveProgress: 0,
isLoading: true, isLoading: true,
uploaded: "0",
uploadTotal: "0 MB",
uploadSpeed: "0 MB / s",
uploadProgress: 0,
mediaItemTypeEnum: { mediaItemTypeEnum: {
...MediaItemType ...MediaItemType
}, },
@ -114,6 +121,7 @@ Page({
idea: journal.idea || "", idea: journal.idea || "",
date: Time.toDate(journal.createdAt), date: Time.toDate(journal.createdAt),
time: Time.toTime(journal.createdAt), time: Time.toTime(journal.createdAt),
type: journal.type,
location: journal.location ? { location: journal.location ? {
lat: journal.lat, lat: journal.lat,
lng: journal.lng, lng: journal.lng,
@ -134,6 +142,10 @@ Page({
}, 1500); }, 1500);
} }
}, },
onChangeType(e: any) {
const { value } = e.detail;
this.setData({ type: value });
},
/** 选择位置 */ /** 选择位置 */
async chooseLocation() { async chooseLocation() {
const location = await wx.chooseLocation({}); const location = await wx.chooseLocation({});
@ -189,10 +201,16 @@ Page({
type: MediaItemType[item.type].toLowerCase() type: MediaItemType[item.type].toLowerCase()
})); }));
const allSources = [...sources, ...newSources]; const allSources = [...sources, ...newSources];
const currentIndex = isNewMedia ? this.data.mediaList.length + index : index; const itemIndex = isNewMedia ? this.data.mediaList.length + index : index;
const total = allSources.length;
const startIndex = Math.max(0, itemIndex - 25);
const endIndex = Math.min(total, startIndex + 50);
const newCurrentIndex = itemIndex - startIndex;
wx.previewMedia({ wx.previewMedia({
current: currentIndex, current: newCurrentIndex,
sources: allSources as WechatMiniprogram.MediaSource[] sources: allSources.slice(startIndex, endIndex) as WechatMiniprogram.MediaSource[]
}); });
}, },
/** 删除附件 */ /** 删除附件 */
@ -287,63 +305,111 @@ Page({
save() { save() {
const handleFail = () => { const handleFail = () => {
wx.showToast({ title: "保存失败", icon: "error" }); wx.showToast({ title: "保存失败", icon: "error" });
wx.hideLoading();
this.setData({ this.setData({
saveText: "保存",
isSaving: false isSaving: false
}); });
}; };
this.setData({ this.setData({
saveText: "正在保存..",
isSaving: true isSaving: true
}); });
// 收集保留的附件 ID缩略图 ID // 收集保留的附件 ID缩略图 ID
const attachmentIds = this.data.mediaList.map(item => item.attachmentId); const attachmentIds = this.data.mediaList.map(item => item.attachmentId);
// 上传新媒体文件 // 上传新媒体文件
const uploadFiles = new Promise<string[]>((resolve, reject) => { const uploadFiles = new Promise<string[]>((resolve, reject) => {
const total = this.data.newMediaList.length; if (this.data.newMediaList.length === 0) {
let completed = 0;
if (total === 0) {
resolve([]); resolve([]);
return; return;
} }
this.setData({
saveProgress: 0, wx.showLoading({ title: "正在上传..", mask: true });
});
// 上传临时文件 // 计算总大小
const uploadPromises = this.data.newMediaList.map((item) => { const sizePromises = this.data.newMediaList.map(item => {
return new Promise<string>((uploadResolve, uploadReject) => { return new Promise<number>((sizeResolve, sizeReject) => {
wx.uploadFile({ wx.getFileSystemManager().getFileInfo({
url: `${config.url}/temp/file/upload`,
filePath: item.path, filePath: item.path,
name: "file", success: (res) => sizeResolve(res.size),
success: (resp) => { fail: (err) => sizeReject(err)
const result = JSON.parse(resp.data);
if (result && result.code === 20000) {
completed++;
// 更新进度
this.setData({
saveProgress: (completed / total),
});
uploadResolve(result.data[0].id);
} else {
uploadReject(new Error(`文件上传失败: ${result?.message || '未知错误'}`));
}
},
fail: (err) => uploadReject(new Error(`文件上传失败: ${err.errMsg}`))
}); });
}); });
}); });
// 并行执行所有文件上传
Promise.all(uploadPromises).then((tempFileIds) => { Promise.all(sizePromises).then(fileSizes => {
const totalSize = fileSizes.reduce((acc, size) => acc + size, 0);
const uploadTasks: WechatMiniprogram.UploadTask[] = [];
let uploadedSize = 0;
let lastUploadedSize = 0;
this.setData({ this.setData({
saveProgress: 1, uploadTotal: IOSize.format(totalSize, 2, Unit.MB)
});
// 计算上传速度
const speedUpdateInterval = setInterval(() => {
const chunkSize = uploadedSize - lastUploadedSize;
this.setData({
uploadSpeed: `${IOSize.format(chunkSize)} / s`
});
lastUploadedSize = uploadedSize;
}, 1000);
// 上传文件
const uploadPromises = this.data.newMediaList.map(item => {
return new Promise<string>((uploadResolve, uploadReject) => {
const task = wx.uploadFile({
url: `${config.url}/temp/file/upload`,
filePath: item.path,
name: "file",
success: (resp) => {
const result = JSON.parse(resp.data);
if (result && result.code === 20000) {
uploadResolve(result.data[0].id);
} else {
uploadReject(new Error(`文件上传失败: ${result?.message || "未知错误"}`));
}
},
fail: (err) => uploadReject(new Error(`文件上传失败: ${err.errMsg}`))
});
// 监听上传进度
let prevProgress = 0;
task.onProgressUpdate((res) => {
const fileUploaded = (res.totalBytesExpectedToSend * res.progress) / 100;
const delta = fileUploaded - prevProgress;
uploadedSize += delta;
prevProgress = fileUploaded;
// 更新进度条
this.setData({
uploaded: IOSize.formatWithoutUnit(uploadedSize, 2, Unit.MB),
uploadProgress: Math.round((uploadedSize / totalSize) * 10000) / 100
});
});
uploadTasks.push(task);
});
});
Promise.all(uploadPromises).then((tempFileIds) => {
// 清除定时器
clearInterval(speedUpdateInterval);
uploadTasks.forEach(task => task.offProgressUpdate());
this.setData({
uploadProgress: 100,
uploadSpeed: "0 MB / s"
});
resolve(tempFileIds);
}).catch((e: Error) => {
// 取消所有上传任务
uploadTasks.forEach(task => task.abort());
clearInterval(speedUpdateInterval);
reject(e);
}); });
resolve(tempFileIds);
}).catch(reject); }).catch(reject);
}); });
// 提交保存 // 提交保存
uploadFiles.then((tempFileIds) => { uploadFiles.then((tempFileIds) => {
wx.showLoading({ title: "正在保存..", mask: true });
wx.request({ wx.request({
url: `${config.url}/journal/update`, url: `${config.url}/journal/update`,
method: "POST", method: "POST",
@ -353,6 +419,7 @@ Page({
data: { data: {
id: this.data.id, id: this.data.id,
idea: this.data.idea, idea: this.data.idea,
type: this.data.type,
lat: this.data.location?.lat, lat: this.data.location?.lat,
lng: this.data.location?.lng, lng: this.data.location?.lng,
location: this.data.location?.text, location: this.data.location?.text,
@ -368,8 +435,10 @@ Page({
Events.emit("JOURNAL_LIST_REFRESH"); Events.emit("JOURNAL_LIST_REFRESH");
wx.showToast({ title: "保存成功", icon: "success" }); wx.showToast({ title: "保存成功", icon: "success" });
this.setData({ this.setData({
saveText: "保存",
isSaving: false, isSaving: false,
uploaded: "0",
uploadTotal: "0 MB",
uploadProgress: 0
}); });
await Toolkit.sleep(1000); await Toolkit.sleep(1000);
wx.navigateBack(); wx.navigateBack();

View File

@ -21,6 +21,13 @@
model:value="{{idea}}" model:value="{{idea}}"
/> />
</view> </view>
<view class="section type">
<text class="label">类型:</text>
<t-radio-group bind:change="onChangeType" default-value="{{type}}" 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"> <view class="section time">
<text class="label">时间:</text> <text class="label">时间:</text>
<picker class="picker" mode="date" model:value="{{date}}"> <picker class="picker" mode="date" model:value="{{date}}">
@ -124,13 +131,17 @@
</t-button> </t-button>
</view> </view>
</view> </view>
<progress <view wx:if="{{isSaving}}" class="uploading">
wx:if="{{isSaving}}" <progress
class="progress" class="progress"
percent="{{saveProgress.toFixed(2) * 100}}" percent="{{uploadProgress}}"
show-info stroke-width="6"
stroke-width="4" />
/> <view class="text">
<view>{{uploaded}} / {{uploadTotal}}</view>
<view>{{uploadSpeed}}</view>
</view>
</view>
<view class="ctrl"> <view class="ctrl">
<t-button class="delete" theme="danger" bind:tap="deleteJournal" disabled="{{isSaving}}">删除记录</t-button> <t-button class="delete" theme="danger" bind:tap="deleteJournal" disabled="{{isSaving}}">删除记录</t-button>
<t-button <t-button
@ -138,7 +149,7 @@
theme="primary" theme="primary"
bind:tap="save" bind:tap="save"
disabled="{{(!idea && mediaList.length === 0 && newMediaList.length === 0) || isSaving}}" disabled="{{(!idea && mediaList.length === 0 && newMediaList.length === 0) || isSaving}}"
>{{saveText}}</t-button> >保存</t-button>
</view> </view>
</block> </block>
</view> </view>

View File

@ -1,7 +1,7 @@
{ {
"usingComponents": { "usingComponents": {
"t-navbar": "tdesign-miniprogram/navbar/navbar", "t-navbar": "tdesign-miniprogram/navbar/navbar",
"journal-detail-panel": "/components/journal-detail-panel/index" "journal-detail-popup": "/components/journal-detail-popup/index"
}, },
"navigationStyle": "custom" "navigationStyle": "custom"
} }

View File

@ -2,7 +2,6 @@
import config from "../../../config/index"; import config from "../../../config/index";
import Time from "../../../utils/Time"; import Time from "../../../utils/Time";
import { Journal, JournalPageType } from "../../../types/Journal"; import { Journal, JournalPageType } from "../../../types/Journal";
import { MediaAttachExt, MediaAttachType } from "../../../types/Attachment";
import Toolkit from "../../../utils/Toolkit"; import Toolkit from "../../../utils/Toolkit";
interface MapMarker { interface MapMarker {
@ -18,20 +17,6 @@ interface MapMarker {
}; };
} }
interface JournalInfo {
id: number;
date: string;
time: string;
location?: string;
idea?: string;
items: Array<{
type: number;
thumbURL: string;
sourceURL: string;
mongoId: string;
}>;
}
interface LocationMarker { interface LocationMarker {
locationKey: string; // 位置键 "lat,lng" locationKey: string; // 位置键 "lat,lng"
lat: number; lat: number;
@ -43,11 +28,6 @@ interface LocationMarker {
previewThumb?: string; // 预览缩略图 previewThumb?: string; // 预览缩略图
} }
interface SelectedLocationInfo {
location?: string;
journals: JournalInfo[];
}
interface JournalMapData { interface JournalMapData {
centerLat: number; centerLat: number;
centerLng: number; centerLng: number;
@ -56,9 +36,8 @@ interface JournalMapData {
locations: LocationMarker[]; // 位置标记列表 locations: LocationMarker[]; // 位置标记列表
customCalloutMarkerIds: string[]; // 改为 string[] 以支持 locationKey customCalloutMarkerIds: string[]; // 改为 string[] 以支持 locationKey
includePoints: Array<{ latitude: number; longitude: number }>; // 缩放视野以包含所有点 includePoints: Array<{ latitude: number; longitude: number }>; // 缩放视野以包含所有点
selectedLocation: SelectedLocationInfo | null; // 选中的位置信息 popupIds: number[];
showDetail: boolean; // 是否显示详情(控制 DOM 存在) popupVisible: boolean;
detailVisible: boolean; // 详情是否可见(控制动画)
isLoading: boolean; isLoading: boolean;
} }
@ -72,8 +51,8 @@ Page({
customCalloutMarkerIds: [], customCalloutMarkerIds: [],
includePoints: [], includePoints: [],
selectedLocation: null, selectedLocation: null,
showDetail: false, popupIds: [],
detailVisible: false, popupVisible: false,
isLoading: true, isLoading: true,
}, },
async onLoad() { async onLoad() {
@ -105,10 +84,8 @@ Page({
fail: reject fail: reject
}); });
}) || []; }) || [];
// 过滤有位置信息的记录,并按位置分组 // 过滤有位置信息的记录,并按位置分组
const locationMap = new Map<string, LocationMarker>(); const locationMap = new Map<string, LocationMarker>();
list.filter((journal: any) => journal.lat && journal.lng).forEach((journal: any) => { list.filter((journal: any) => journal.lat && journal.lng).forEach((journal: any) => {
// 保留 6 位小数作为位置键,约等于 0.1 米精度 // 保留 6 位小数作为位置键,约等于 0.1 米精度
const lat = Number(journal.lat.toFixed(6)); const lat = Number(journal.lat.toFixed(6));
@ -116,7 +93,6 @@ Page({
const locationKey = `${lat},${lng}`; const locationKey = `${lat},${lng}`;
if (!locationMap.has(locationKey)) { if (!locationMap.has(locationKey)) {
// 获取第一个有缩略图的日记
const thumbItem = journal.items.find((item: any) => item.attachType === "THUMB"); const thumbItem = journal.items.find((item: any) => item.attachType === "THUMB");
locationMap.set(locationKey, { locationMap.set(locationKey, {
locationKey, locationKey,
@ -129,7 +105,6 @@ Page({
previewThumb: thumbItem ? `${config.url}/attachment/read/${thumbItem.mongoId}` : undefined previewThumb: thumbItem ? `${config.url}/attachment/read/${thumbItem.mongoId}` : undefined
}); });
} }
const marker = locationMap.get(locationKey)!; const marker = locationMap.get(locationKey)!;
marker.journalIds.push(journal.id); marker.journalIds.push(journal.id);
marker.count++; marker.count++;
@ -141,9 +116,7 @@ Page({
} }
} }
}); });
const locations = Array.from(locationMap.values()); const locations = Array.from(locationMap.values());
if (locations.length === 0) { if (locations.length === 0) {
wx.showToast({ wx.showToast({
title: "暂无位置记录", title: "暂无位置记录",
@ -152,7 +125,6 @@ Page({
this.setData({ isLoading: false }); this.setData({ isLoading: false });
return; return;
} }
// 生成地图标记 // 生成地图标记
const markers: MapMarker[] = locations.map((location, index) => ({ const markers: MapMarker[] = locations.map((location, index) => ({
id: index, id: index,
@ -162,11 +134,11 @@ Page({
height: 30, height: 30,
customCallout: { customCallout: {
anchorY: -2, anchorY: -2,
anchorX: 0, // 随机错位避免近距离重叠
anchorX: Toolkit.random(-10, 10),
display: "ALWAYS" display: "ALWAYS"
} }
})); }));
// 所有标记的 locationKey 列表 // 所有标记的 locationKey 列表
const customCalloutMarkerIds = locations.map(l => l.locationKey); const customCalloutMarkerIds = locations.map(l => l.locationKey);
// 计算中心点(所有标记的平均位置) // 计算中心点(所有标记的平均位置)
@ -177,7 +149,6 @@ Page({
latitude: l.lat, latitude: l.lat,
longitude: l.lng longitude: l.lng
})); }));
this.setData({ this.setData({
locations, locations,
markers, markers,
@ -208,79 +179,18 @@ Page({
/** 加载位置详情(该位置的所有日记) */ /** 加载位置详情(该位置的所有日记) */
async loadLocationDetail(markerId: number) { async loadLocationDetail(markerId: number) {
const location = this.data.locations[markerId]; const location = this.data.locations[markerId];
if (!location) return; if (!location) {
return;
wx.showLoading({ title: "加载中...", mask: true });
try {
// 根据 journalIds 加载日记详情
const list: Journal[] = await new Promise((resolve, reject) => {
wx.request({
url: `${config.url}/journal/list/ids`,
method: "POST",
header: {
Key: wx.getStorageSync("key")
},
data: location.journalIds,
success: (resp: any) => {
if (resp.data.code === 20000) {
resolve(resp.data.data);
} else {
reject(new Error(resp.data.message || "加载失败"));
}
},
fail: reject
});
}) || [];
// 转换为 JournalInfo 格式
const journals: JournalInfo[] = list.map((journal: any) => {
const date = new Date(journal.createdAt);
return {
id: journal.id,
date: Time.toPassedDateTime(journal.createdAt),
time: `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`,
location: journal.location,
idea: journal.idea,
items: journal.items
.filter((item: any) => item.attachType === MediaAttachType.THUMB)
.map((item: any) => {
const ext = JSON.parse(item.ext);
return {
type: ext.isVideo ? 1 : 0,
thumbURL: `${config.url}/attachment/read/${item.mongoId}`,
sourceURL: `${config.url}/attachment/read/${ext.sourceMongoId}`,
mongoId: item.mongoId,
};
})
};
});
// 先显示元素,再触发动画
this.setData({
selectedLocation: {
location: location.location,
journals
},
showDetail: true
});
wx.nextTick(() => {
this.setData({ detailVisible: true });
});
wx.hideLoading();
} catch (err: any) {
wx.hideLoading();
wx.showToast({
title: err.message || "加载失败",
icon: "error"
});
} }
this.setData({
popupIds: location.journalIds,
popupVisible: true
});
}, },
/** 关闭详情 */ /** 关闭详情 */
async closeDetail() { async closeDetail() {
this.setData({ detailVisible: false });
await Toolkit.sleep(350);
this.setData({ this.setData({
showDetail: false, popupVisible: false,
selectedLocation: null selectedLocation: null
}); });
}, },

View File

@ -37,12 +37,9 @@
</view> </view>
</view> </view>
<!-- 详情面板 --> <!-- 详情面板 -->
<journal-detail-panel <journal-detail-popup
visible="{{showDetail && detailVisible}}" visible="{{popupVisible}}"
title="{{selectedLocation.location}}" ids="{{popupIds}}"
journals="{{selectedLocation.journals}}" mode="LOCATION"
show-location-icon="{{true}}"
show-journal-date="{{true}}"
show-journal-location="{{false}}"
bind:close="closeDetail" bind:close="closeDetail"
/> />

View File

@ -1,21 +1,18 @@
.custom-navbar { .more-menu {
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 999;
position: fixed;
background: var(--theme-bg-overlay);
.more-menu { .content {
top: 0; z-index: 1000;
left: 0;
width: 100%;
height: 100%;
position: fixed; position: fixed;
background: var(--theme-bg-overlay); background: var(--theme-bg-menu);
box-shadow: 0 0 12px var(--theme-shadow-medium);
.content { border-radius: 8rpx;
margin: 190rpx 0 0 12rpx;
z-index: 1;
position: fixed;
background: var(--theme-bg-menu);
box-shadow: 0 0 12px var(--theme-shadow-medium);
border-radius: 2px;
}
} }
} }
@ -66,6 +63,7 @@
.location { .location {
gap: 6rpx; gap: 6rpx;
display: flex; display: flex;
margin-top: 16rpx;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;

View File

@ -36,6 +36,8 @@ interface JournalData {
isFinished: boolean; isFinished: boolean;
stickyOffset: number; stickyOffset: number;
isShowMoreMenu: boolean; isShowMoreMenu: boolean;
menuTop: number;
menuLeft: number;
} }
Page({ Page({
@ -63,7 +65,9 @@ Page({
isFetching: false, isFetching: false,
isFinished: false, isFinished: false,
stickyOffset: 0, stickyOffset: 0,
isShowMoreMenu: false isShowMoreMenu: false,
menuTop: 0,
menuLeft: 0
}, },
onLoad() { onLoad() {
Events.reset("JOURNAL_REFRESH", () => { Events.reset("JOURNAL_REFRESH", () => {
@ -110,9 +114,30 @@ Page({
}); });
}, },
toggleMoreMenu() { toggleMoreMenu() {
this.setData({ if (!this.data.isShowMoreMenu) {
isShowMoreMenu: !this.data.isShowMoreMenu // 打开菜单时计算位置
}) const query = wx.createSelectorQuery();
query.select(".more").boundingClientRect();
query.exec((res) => {
if (res[0]) {
const { top, left, height } = res[0];
this.setData({
isShowMoreMenu: true,
menuTop: top + height + 16, // 按钮下方 8px
menuLeft: left
});
}
});
} else {
// 关闭菜单
this.setData({
isShowMoreMenu: false
});
}
},
/** 阻止事件冒泡 */
stopPropagation() {
// 空函数,仅用于阻止事件冒泡
}, },
toCreater() { toCreater() {
wx.navigateTo({ wx.navigateTo({
@ -198,8 +223,7 @@ Page({
}); });
}, },
preview(e: WechatMiniprogram.BaseEvent) { preview(e: WechatMiniprogram.BaseEvent) {
const journalIndex = e.target.dataset.journalIndex; const { journalIndex, itemIndex } = e.currentTarget.dataset;
const itemIndex = e.target.dataset.itemIndex;
const items = this.data.list[journalIndex].items; const items = this.data.list[journalIndex].items;
const total = items.length; const total = items.length;
@ -219,7 +243,7 @@ Page({
}) })
}, },
openLocation(e: WechatMiniprogram.BaseEvent) { openLocation(e: WechatMiniprogram.BaseEvent) {
const journalIndex = e.target.dataset.journalIndex; const { journalIndex } = e.currentTarget.dataset;
const journal = this.data.list[journalIndex] as Journal; const journal = this.data.list[journalIndex] as Journal;
if (journal.lat && journal.lng) { if (journal.lat && journal.lng) {
wx.openLocation({ wx.openLocation({

View File

@ -2,17 +2,22 @@
<t-navbar title="我们的记录"> <t-navbar title="我们的记录">
<view slot="left" class="more" bind:tap="toggleMoreMenu"> <view slot="left" class="more" bind:tap="toggleMoreMenu">
<t-icon name="view-list" size="24px" /> <t-icon name="view-list" size="24px" />
<view wx:if="{{isShowMoreMenu}}" class="more-menu">
<t-cell-group class="content" theme="card">
<t-cell title="新纪录" leftIcon="add" bind:tap="toCreater" />
<t-cell title="按列表查找" leftIcon="view-list" bind:tap="toSearch" />
<t-cell title="按日期查找" leftIcon="calendar-1" bind:tap="toDate" />
<t-cell title="按地图查找" leftIcon="location" bind:tap="toMap" />
</t-cell-group>
</view>
</view> </view>
</t-navbar> </t-navbar>
</view> </view>
<view wx:if="{{isShowMoreMenu}}" class="more-menu" catchtap="toggleMoreMenu">
<t-cell-group
class="content"
theme="card"
style="top: {{menuTop}}px; left: {{menuLeft}}px;"
catchtap="stopPropagation"
>
<t-cell title="新纪录" leftIcon="add" bind:tap="toCreater" />
<t-cell title="按列表查找" leftIcon="view-list" bind:tap="toSearch" />
<t-cell title="按日期查找" leftIcon="calendar-1" bind:tap="toDate" />
<t-cell title="按地图查找" leftIcon="location" bind:tap="toMap" />
</t-cell-group>
</view>
<t-indexes <t-indexes
class="journal-list" class="journal-list"
bind:scroll="onScroll" bind:scroll="onScroll"

View File

@ -125,8 +125,7 @@ Page({
}); });
}, },
preview(e: WechatMiniprogram.BaseEvent) { preview(e: WechatMiniprogram.BaseEvent) {
const journalIndex = e.target.dataset.journalIndex; const { journalIndex, itemIndex } = e.currentTarget.dataset;
const itemIndex = e.target.dataset.itemIndex;
const items = this.data.list[journalIndex].items; const items = this.data.list[journalIndex].items;
const total = items.length; const total = items.length;

View File

@ -67,7 +67,7 @@ Page({
}); });
}, },
toLuggageList(e: WechatMiniprogram.BaseEvent) { toLuggageList(e: WechatMiniprogram.BaseEvent) {
const name = e.target.dataset.name; const { name } = e.currentTarget.dataset;
wx.setStorageSync("luggage", { wx.setStorageSync("luggage", {
name, name,
luggage: this.data.luggage luggage: this.data.luggage
@ -91,8 +91,7 @@ Page({
}) })
}, },
preview(e: WechatMiniprogram.BaseEvent) { preview(e: WechatMiniprogram.BaseEvent) {
const index = e.target.dataset.index; const { index, imageIndex } = e.currentTarget.dataset;
const imageIndex = e.target.dataset.imageIndex;
const images = this.data.guides[index].images; const images = this.data.guides[index].images;
wx.previewMedia({ wx.previewMedia({
current: imageIndex, current: imageIndex,

View File

@ -1,5 +1,6 @@
import { Attachment } from "./Attachment"; import { Attachment } from "./Attachment";
import { Model, QueryPage } from "./Model"; import { Model, QueryPage } from "./Model";
import { MediaItem } from "./UI";
/** 日记 */ /** 日记 */
export type Journal = { export type Journal = {
@ -22,8 +23,22 @@ export type Journal = {
/** 天气 */ /** 天气 */
weatcher?: string; weatcher?: string;
// ---------- 以下为 VO 字段 ----------
/** 日期 */
date?: string;
/** 时间 */
time?: string;
/** 时间 */
datetime?: string;
/** 附件(照片、视频等) */ /** 附件(照片、视频等) */
items?: Attachment[]; items?: Attachment[];
/** 媒体项(由附件转) */
mediaItems?: MediaItem[];
} & Model; } & Model;
/** 日记类型 */ /** 日记类型 */

View File

@ -2,6 +2,8 @@
/** 系统媒体项目 */ /** 系统媒体项目 */
export type MediaItem = { export type MediaItem = {
journalId?: number;
/** 类型 */ /** 类型 */
type: MediaItemType; type: MediaItemType;
@ -62,3 +64,10 @@ export type Location = {
/** 描述 */ /** 描述 */
text?: string; text?: string;
} }
export enum JournalDetailType {
DATE = "DATE",
LOCATION = "LOCATION"
}