120 lines
2.5 KiB
TypeScript
120 lines
2.5 KiB
TypeScript
// components/journal-list/index.ts
|
||
import config from "../../config/index";
|
||
import { JournalPage, JournalPageType } from "../../types/Journal";
|
||
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: JournalPage;
|
||
}
|
||
|
||
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: 16,
|
||
type: JournalPageType.PREVIEW
|
||
}
|
||
},
|
||
observers: {
|
||
'visible': function(visible: boolean) {
|
||
if (visible && this.data.list.length === 0) {
|
||
this.fetch();
|
||
}
|
||
},
|
||
'type': function() {
|
||
this.setData({
|
||
page: {
|
||
index: 0,
|
||
size: 16,
|
||
type: JournalPageType.PREVIEW
|
||
},
|
||
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();
|
||
}
|
||
}
|
||
});
|