add fiilter for travel location list

This commit is contained in:
Timi
2025-12-20 14:45:42 +08:00
parent df7cfa95a0
commit b64e2767c2
3 changed files with 66 additions and 6 deletions

View File

@ -42,6 +42,27 @@
.header { .header {
padding: 16rpx 32rpx; padding: 16rpx 32rpx;
.left-actions {
gap: 16rpx;
display: flex;
align-items: center;
.type-picker {
.picker-button {
gap: 8rpx;
color: var(--theme-wx);
border: 1px solid var(--theme-wx);
display: flex;
padding: 14rpx 24rpx 14rpx 32rpx;
font-size: 26rpx;
background: var(--theme-bg-card);
align-items: center;
border-radius: 16rpx;
}
}
}
} }
.location { .location {

View File

@ -3,7 +3,7 @@
import Time from "../../../utils/Time"; import Time from "../../../utils/Time";
import { TravelApi } from "../../../api/TravelApi"; import { TravelApi } from "../../../api/TravelApi";
import { TravelLocationApi } from "../../../api/TravelLocationApi"; import { TravelLocationApi } from "../../../api/TravelLocationApi";
import { Travel, TravelStatusLabel, TravelStatusIcon, TransportationTypeLabel, TravelLocation, TravelLocationTypeLabel, TravelLocationTypeIcon, TransportationTypeIcon } from "../../../types/Travel"; import { Travel, TravelStatusLabel, TravelStatusIcon, TransportationTypeLabel, TravelLocation, TravelLocationTypeLabel, TravelLocationTypeIcon, TransportationTypeIcon, TravelLocationType } from "../../../types/Travel";
interface TravelDetailData { interface TravelDetailData {
/** 出行详情 */ /** 出行详情 */
@ -28,6 +28,10 @@ interface TravelDetailData {
locationTypeLabels: typeof TravelLocationTypeLabel; locationTypeLabels: typeof TravelLocationTypeLabel;
/** 地点类型图标映射 */ /** 地点类型图标映射 */
locationTypeIcons: typeof TravelLocationTypeIcon; locationTypeIcons: typeof TravelLocationTypeIcon;
/** 地点类型选项 */
locationTypes: string[];
/** 选中的地点类型索引 */
selectedLocationTypeIndex: number;
/** 删除对话框可见性 */ /** 删除对话框可见性 */
deleteDialogVisible: boolean; deleteDialogVisible: boolean;
/** 删除确认文本 */ /** 删除确认文本 */
@ -47,6 +51,8 @@ Page({
transportIcons: TransportationTypeIcon, transportIcons: TransportationTypeIcon,
locationTypeLabels: TravelLocationTypeLabel, locationTypeLabels: TravelLocationTypeLabel,
locationTypeIcons: TravelLocationTypeIcon, locationTypeIcons: TravelLocationTypeIcon,
locationTypes: ["全部", ...Object.values(TravelLocationTypeLabel)],
selectedLocationTypeIndex: 0,
deleteDialogVisible: false, deleteDialogVisible: false,
deleteConfirmText: "" deleteConfirmText: ""
}, },
@ -109,12 +115,29 @@ Page({
this.setData({ isLoadingLocations: true }); this.setData({ isLoadingLocations: true });
try { try {
const { selectedLocationTypeIndex, locationTypes } = this.data;
// 构建查询条件
const equalsExample: { [key: string]: number | string } = {
travelId: Number(travelId)
};
// 添加类型过滤(索引 0 表示"全部"
if (0 < selectedLocationTypeIndex) {
const selectedTypeLabel = locationTypes[selectedLocationTypeIndex];
const selectedType = Object.keys(TravelLocationTypeLabel).find(
key => TravelLocationTypeLabel[key as TravelLocationType] === selectedTypeLabel
) as TravelLocationType | undefined;
if (selectedType) {
equalsExample.type = selectedType;
}
}
const result = await TravelLocationApi.getList({ const result = await TravelLocationApi.getList({
index: 0, index: 0,
size: 100, size: 999,
equalsExample: { equalsExample
travelId: Number(travelId)
}
}); });
this.setData({ locations: result.list }); this.setData({ locations: result.list });
@ -125,6 +148,14 @@ Page({
} }
}, },
/** 地点类型改变 */
onLocationTypeChange(e: WechatMiniprogram.PickerChange) {
const index = Number(e.detail.value);
this.setData({ selectedLocationTypeIndex: index });
// 重新从接口获取过滤后的数据
this.fetchLocations(this.data.travelId);
},
/** 编辑出行 */ /** 编辑出行 */
toEdit() { toEdit() {
const { travel } = this.data; const { travel } = this.data;

View File

@ -52,7 +52,15 @@
<t-cell-group class="section locations"> <t-cell-group class="section locations">
<view slot="title" class="title">地点列表</view> <view slot="title" class="title">地点列表</view>
<t-cell class="header"> <t-cell class="header">
<t-button slot="left-icon" theme="primary" icon="map" size="small" bind:tap="toMap">地图浏览</t-button> <view slot="left-icon" class="left-actions">
<t-button theme="primary" icon="map" size="small" bind:tap="toMap">地图浏览</t-button>
<picker class="type-picker" mode="selector" range="{{locationTypes}}" value="{{selectedLocationTypeIndex}}" bind:change="onLocationTypeChange">
<view class="picker-button">
<text>{{locationTypes[selectedLocationTypeIndex]}}</text>
<t-icon class="icon" name="chevron-down" size="16px" />
</view>
</picker>
</view>
<t-icon slot="right-icon" name="add" size="20px" color="var(--theme-wx)" bind:tap="toAddLocation" /> <t-icon slot="right-icon" name="add" size="20px" color="var(--theme-wx)" bind:tap="toAddLocation" />
</t-cell> </t-cell>
<t-cell wx:if="{{isLoadingLocations}}" class="loading"> <t-cell wx:if="{{isLoadingLocations}}" class="loading">