refactor travel

miniprogram/pages/main/travel/index.wxml

@@ -1,30 +1,108 @@
-<!--pages/main/travel/travel.wxml-->
+<!--pages/main/travel/index.wxml-->
 <view class="custom-navbar">
-	<t-navbar title="北海之旅" />
+	<t-navbar title="旅行计划">
+		<view slot="left" class="filter-btn" bind:tap="toggleFilterMenu">
+			<t-icon name="filter" size="24px" />
+		</view>
+	</t-navbar>
 </view>
-<view class="travel">
-	<t-cell title="小糕的旅行装备" arrow bindtap="toLuggageList" data-name="gao"></t-cell>
-	<t-cell title="夜雨的旅行装备" arrow bindtap="toLuggageList" data-name="yu"></t-cell>
-	<t-collapse class="collapse" bind:change="onCollapseChange" expandMutex expandIcon>
-		<t-collapse-panel
-			class="panel"
-			wx:for="{{guides}}"
-			header="{{item.title}}"
-			value="{{index}}"
-			wx:key="index"
-		>
-			<view wx:if="{{item.images}}" class="images">
-				<block wx:for="{{item.images}}" wx:for-item="image" wx:for-index="imageIndex" wx:key="imageIndex">
-					<image
-						class="image"
-						src="{{image}}"
-						mode="widthFix"
-						bindtap="preview"
-						data-index="{{index}}"
-						data-image-index="{{imageIndex}}"
-					></image>
-				</block>
+
+<!-- 筛选菜单 -->
+<view wx:if="{{isShowFilterMenu}}" class="filter-menu" catchtap="toggleFilterMenu">
+	<t-cell-group
+		class="content"
+		theme="card"
+		style="top: {{menuTop}}px; left: {{menuLeft}}px;"
+		catchtap="stopPropagation"
+	>
+		<t-cell
+			title="全部"
+			leftIcon="bulletpoint"
+			bind:tap="filterByStatus"
+			data-status="ALL"
+			rightIcon="{{currentStatus === 'ALL' ? 'check' : ''}}"
+		/>
+		<t-cell
+			title="计划中"
+			leftIcon="calendar"
+			bind:tap="filterByStatus"
+			data-status="PLANNING"
+			rightIcon="{{currentStatus === 'PLANNING' ? 'check' : ''}}"
+		/>
+		<t-cell
+			title="进行中"
+			leftIcon="play-circle"
+			bind:tap="filterByStatus"
+			data-status="ONGOING"
+			rightIcon="{{currentStatus === 'ONGOING' ? 'check' : ''}}"
+		/>
+		<t-cell
+			title="已完成"
+			leftIcon="check-circle"
+			bind:tap="filterByStatus"
+			data-status="COMPLETED"
+			rightIcon="{{currentStatus === 'COMPLETED' ? 'check' : ''}}"
+		/>
+	</t-cell-group>
+</view>
+
+<!-- 旅行列表 -->
+<view class="travel-list">
+	<!-- 空状态 -->
+	<t-empty
+		wx:if="{{!isFetching && list.length === 0}}"
+		icon="travel"
+		description="暂无旅行计划"
+	/>
+
+	<!-- 列表内容 -->
+	<view
+		wx:for="{{list}}"
+		wx:for-item="travel"
+		wx:for-index="travelIndex"
+		wx:key="id"
+		class="travel-card"
+		bind:tap="toDetail"
+		data-id="{{travel.id}}"
+	>
+		<view class="card-header">
+			<t-tag
+				theme="{{travel.status === 'PLANNING' ? 'default' : travel.status === 'ONGOING' ? 'warning' : 'success'}}"
+				variant="light"
+				icon="{{statusIcons[travel.status]}}"
+			>
+				{{statusLabels[travel.status]}}
+			</t-tag>
+		</view>
+
+		<view class="card-body">
+			<view class="title">{{travel.title || '未命名旅行'}}</view>
+
+			<view wx:if="{{travel.content}}" class="content">{{travel.content}}</view>
+
+			<view class="meta">
+				<view class="meta-item">
+					<t-icon name="time" size="16px" class="icon" />
+					<text class="text">{{travel.travelDate}} {{travel.travelTime}}</text>
+				</view>
+
+				<view wx:if="{{travel.days}}" class="meta-item">
+					<t-icon name="calendar" size="16px" class="icon" />
+					<text class="text">{{travel.days}} 天</text>
+				</view>
+
+				<view wx:if="{{travel.transportationType}}" class="meta-item">
+					<t-icon name="{{travel.transportationType === 'PLANE' ? 'flight-takeoff' : travel.transportationType === 'TRAIN' ? 'map-route' : travel.transportationType === 'SELF_DRIVING' ? 'control-platform' : 'location'}}" size="16px" class="icon" />
+					<text class="text">{{transportLabels[travel.transportationType]}}</text>
+				</view>
 			</view>
-		</t-collapse-panel>
-	</t-collapse>
-</view>
+		</view>
+	</view>
+
+	<!-- 加载完成提示 -->
+	<view wx:if="{{isFinished && 0 < list.length}}" class="finished">没有更多了</view>
+</view>
+<!-- 新建按钮 -->
+<view class="fab" bind:tap="toCreate">
+	<t-icon name="add" size="24px" color="#fff" />
+</view>