gaoYuJournal/miniprogram/pages/main/travel-detail/index.wxml

<!--pages/main/travel-detail/index.wxml-->
<view class="custom-navbar">
	<t-navbar title="出行详情" leftArrow bind:go-back="goBack">
		<view slot="right" class="edit-btn" bind:tap="toEdit">
			<t-icon name="edit" size="24px" />
		</view>
	</t-navbar>
</view>

<view class="travel-detail setting-bg">
	<!-- 加载状态 -->
	<t-loading wx:if="{{isLoading}}" theme="dots" size="40rpx" />
	<!-- 详情内容 -->
	<view wx:if="{{!isLoading && travel}}" class="content">
		<!-- 状态标签 -->
		<view class="section status">
			<t-tag
				size="large"
				theme="{{travel.status === 'PLANNING' ? 'default' : travel.status === 'ONGOING' ? 'warning' : 'success'}}"
				variant="outline"
				icon="{{statusIcons[travel.status]}}"
			>
				{{statusLabels[travel.status]}}
			</t-tag>
		</view>
		<!-- 标题 -->
		<view class="section title">{{travel.title || '未命名出行'}}</view>
		<!-- 基本信息 -->
		<t-cell-group class="section info">
			<view slot="title" class="title">基本信息</view>
			<t-cell left-icon="time" title="出行时间">
				<view slot="note">
					<text wx:if="{{travel.travelDate}}">{{travel.travelDate}} {{travel.travelTime}}</text>
					<text wx:else class="undecided-value">未定</text>
				</view>
			</t-cell>
			<t-cell left-icon="calendar" title="出行天数">
				<view slot="note">
					<text wx:if="{{travel.days}}">{{travel.days}} 天</text>
					<text wx:else class="undecided-value">未定</text>
				</view>
			</t-cell>
			<t-cell left-icon="{{transportIcons[travel.transportationType]}}" title="交通方式">
				<view slot="note">{{transportLabels[travel.transportationType]}}</view>
			</t-cell>
		</t-cell-group>
		<!-- 出行内容 -->
		<t-cell-group wx:if="{{travel.content}}" class="section">
			<view slot="title" class="title">详细说明</view>
			<t-cell title="{{travel.content}}" />
		</t-cell-group>
		<t-cell-group class="section locations">
			<view slot="title" class="title">地点列表</view>
			<t-cell class="header">
				<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-cell>
			<t-cell wx:if="{{isLoadingLocations}}" class="loading">
				<t-loading slot="title" theme="dots" size="40rpx" />
			</t-cell>
			<block wx:elif="{{0 < locations.length}}">
				<t-cell
					class="location"
					wx:for="{{locations}}"
					wx:key="id"
					title="{{item.title || '未命名地点'}}"
					bind:tap="toLocationDetail"
					data-id="{{item.id}}"
					arrow
				>
					<view slot="left-icon" class="thumb">
						<image wx:if="{{item.previewThumb}}" class="thumb-img" src="{{item.previewThumb}}" mode="aspectFill" />
						<view wx:else class="thumb-placeholder">
							<t-icon name="{{locationTypeIcons[item.type]}}" size="28px" color="var(--theme-wx)" />
						</view>
					</view>
					<view slot="note" class="note">{{locationTypeLabels[item.type]}}</view>
					<view slot="description" class="description">
						<view wx:if="{{item.requireIdCard}}" class="item">
							<t-icon name="user" size="14px" />
							<text>需要身份证</text>
						</view>
						<view wx:if="{{item.requireAppointment}}" class="item">
							<t-icon name="user" size="14px" />
							<text>需要预约</text>
						</view>
						<view wx:if="{{item.amount}}" class="item">
							<t-icon name="money" size="14px" />
							<text>¥{{item.amount}}</text>
						</view>
						<view wx:if="{{item.importance}}" class="item">
							<t-icon name="chart-bubble" size="14px" />
							<text>重要程度</text>
							<view class="stars orange">
								<t-icon
									wx:for="{{item.importance}}"
									wx:for-index="index"
									wx:key="index"
									name="star-filled"
									size="14px"
								/>
							</view>
						</view>
					</view>
				</t-cell>
			</block>
			<t-cell wx:else class="empty-state" description="暂无地点信息" />
		</t-cell-group>
		<!-- 操作按钮 -->
		<view class="section action">
			<t-button
				theme="danger"
				variant="outline"
				size="large"
				icon="delete"
				t-class="delete"
				bind:tap="deleteTravel"
			>
				删除
			</t-button>
			<t-button
				theme="primary"
				size="large"
				icon="edit"
				t-class="edit"
				bind:tap="toEdit"
			>
				编辑出行计划
			</t-button>
		</view>
	</view>
</view>

<!-- 删除确认对话框 -->
<t-dialog
	visible="{{deleteDialogVisible}}"
	title="删除出行计划"
	confirm-btn="{{ {content: '删除', variant: 'text', theme: 'danger'} }}"
	cancel-btn="取消"
	bind:confirm="confirmDelete"
	bind:cancel="cancelDelete"
>
	<view slot="content" class="delete-dialog">
		<view class="tips">
			<text>此计划的地点、图片和视频也会同步删除，删除后无法恢复，请输入 "</text>
			<text style="color: var(--theme-error)">确认删除</text>
			<text>" 以继续</text>
		</view>
		<t-input placeholder="请输入：确认删除" model:value="{{deleteConfirmText}}" />
	</view>
</t-dialog>