ht80/sheji(1)/pages/xinindex/xinindex.wxml

<view class="page-container">
  <!-- 顶部导航栏 -->
  <view class="top-nav">
    <text class="nav-title">红途定制 · 专属红色之旅</text>
    <image src="/images/logo.png" class="nav-logo" />
  </view>

  <!-- 背景图片放在最底层 -->
  <view class="map-container" style="height: {{layoutConfig.map * 100}}vh">
    <map 
      id="map" 
      longitude="118.0" 
      latitude="36.5" 
      scale="7" 
      markers="{{markers}}" 
      bindmarkertap="onMarkerTap" 
      longitude="{{longitude}}" 
      latitude="{{latitude}}" 
      scale="{{scale}}"
      markers="{{markers}}"
      style="width: 100%; height: 100%;"
    ></map>
    <view class="map-fade"></view>
    
    <!-- 红途定制快捷入口（悬浮在地图上） -->
    <view class="custom-quick-entry" bindtap="navigateToAiPlan">
      <image src="/images/index/生成攻略.png" class="quick-entry-icon" />
      <text class="quick-entry-text">立即定制行程</text>
      <view class="entry-highlight"></view>
    </view>
  </view>

  <!-- 红途定制核心模块 -->
  <view class="custom-core-module">
    <view class="module-header">
      <text class="module-title">红途定制 · 智能规划</text>
      <view class="module-desc">基于您的需求，生成专属红色旅游路线</view>
    </view>
    
    <!-- 定制选项卡 -->
    <view class="custom-tabs">
      <view class="tab-item active" data-type="history">历史主题</view>
      <view class="tab-item" data-type="education">研学教育</view>
      <view class="tab-item" data-type="red-story">红色故事</view>
      <view class="tab-item" data-type="custom">自定义</view>
    </view>
    
    <!-- 推荐定制方案 -->
    <view class="custom-recommendations">
      <block wx:for="{{recommendedPlans}}" wx:key="id">
        <view class="plan-card" bindtap="viewCustomPlan" data-id="{{item.id}}">
          <image src="{{item.coverImage}}" mode="widthFix" class="plan-image" />
          <view class="plan-info">
            <view class="plan-title">{{item.title}}</view>
            <view class="plan-meta">
              <text class="days">{{item.days}}天行程</text>
              <text class="spots">{{item.spotCount}}个景点</text>
              <text class="difficulty">{{item.difficulty}}</text>
            </view>
            <view class="plan-tags">
              <view class="tag" wx:for="{{item.tags}}" wx:key="tag">{{item}}</view>
            </view>
          </view>
          <view class="arrow-icon">→</view>
        </view>
      </block>
    </view>
    
    <!-- 立即定制按钮 -->
    <button class="start-custom-btn" bindtap="navigateToAiPlan">
      立即定制我的专属路线
    </button>
  </view>

  <!-- VR全景体验模块 -->
  <view class="vr-container" style="height: {{layoutConfig.vr * 100}}vh">
    <view class="section-header">
      <text class="section-title">VR全景体验</text>
      <view class="brush-stroke"></view>
    </view>
    
    <!-- 横向滚动VR列表 -->
    <scroll-view 
      class="vr-scroll" 
      scroll-x 
      enhanced 
      show-scrollbar="{{false}}"
    >
      <view class="vr-list">
        <block wx:for="{{vrList}}" wx:key="id">
          <view 
            class="vr-card" 
            bindtap="showWebView" 
            data-url="{{item.url}}"
            data-title="{{item.title}}"
          >
            <image src="{{item.thumb}}" mode="aspectFill" class="vr-image"/>
            <view class="vr-info">
              <text class="vr-title">{{item.title}}</text>
              <text class="vr-desc">{{item.desc}}</text>
            </view>
          </view>
        </block>
      </view>
    </scroll-view>
  </view>

  <!-- 功能菜单 -->
  <view class="menu">
    <view class="service-container">
      <view class="item highlight">
        <a href="#" class="service-link">
          <image 
            bindtap="navigateToAiPlan" 
            data-url="/pages/ai-plan/ai-plan" 
            src="/images/index/生成攻略.png" 
            class="img" 
          />
          <text class="title">红途定制</text>
        </a>
      </view>
      
      <view class="item">
        <a href="#" class="service-link">
          <image 
            bindtap="navigateTopage" 
            data-url="/pages/gongjiao/gongjiao" 
            src="/images/index/游学路线.png" 
            class="img" 
          />
          <text class="title">游学路线</text>
        </a>
      </view>
      
      <view class="item">
        <a href="#" class="service-link">
          <image 
            bindtap="navigateTopage" 
            data-url="/pages/search/search" 
            src="/images/搜索分类.png" 
            class="img" 
          />
          <text class="title">红游速搜</text>
        </a>
      </view>
      
      <view class="item">
        <a href="#" class="service-link">
          <image 
            bindtap="navigateTopage" 
            data-url="/pages/quiz/quiz" 
            src="/images/quiz-icon.png" 
            class="img" 
          />
          <text class="title">红史问答堂</text>
        </a>
      </view>
    </view>
  </view>

  <!-- 自定义全屏弹窗 -->
  <view 
    wx:if="{{showImageModal}}" 
    class="custom-modal"
    bindtap="hideImageModal"
  >
    <view class="modal-content" catchtap="stopPropagation">
      <scroll-view scroll-y class="scroll-container" style="height: 70vh;">
        <image 
          src="{{currentMarker.imageUrl}}" 
          mode="widthFix" 
          class="modal-image"
        />
        
        <view class="main-content">
          <view class="header">
            <view class="modal-title">{{currentMarker.title}}</view>
            <view class="modal-address">
              <text class="icon">📍</text>
              {{currentMarker.address}}
            </view>
          </view>
          
          <view class="modal-description">
            {{currentMarker.description}}
          </view>
          
          <view class="detail-list">
            <block wx:for="{{currentMarker.detail}}" wx:key="label">
              <view class="detail-item {{item.label.includes('门票') ? 'highlight-item' : ''}}">
                <text class="detail-label">{{item.label}}</text>
                <view class="detail-value-container">
                  <text wx:if="{{!item.label.includes('门票')}}">{{item.value}}</text>
                  <block wx:else>
                    <text class="{{item.value === '免费' ? 'free-text' : 'fee-text'}}">
                      {{item.value}}
                    </text>
                    <text wx:if="{{item.value === '免费'}}" class="free-badge">免费</text>
                  </block>
                </view>
              </view>
            </block>
          </view>
        </view>
      </scroll-view>
      
      <view class="action-bar">
        <button class="nav-btn" bindtap="openLocation">
          导航前往
        </button>
        <button class="close-btn" bindtap="hideImageModal">
          关闭
        </button>
      </view>
    </view>
    
    <view class="top-close" bindtap="hideImageModal">
      <text class="close-icon">×</text>
    </view>
  </view>

  <!-- WebView弹窗 -->
  <view wx:if="{{showWebView}}" class="vr-modal">
    <view class="modal-header">
      <text class="modal-title">{{currentVrTitle}}</text>
      <text class="close-btn" bindtap="hideWebView">×</text>
    </view>
    <web-view 
      src="{{webViewUrl}}"
      style="height: 85vh; width: 100%;"
    ></web-view>
  </view>

  <!-- 悬浮按钮 -->
  <view class="float-container">
    <image 
      src="/images/鸽子.png" 
      class="float-btn {{walking ? 'walking' : ''}}" 
      bindtap="showFloatMenu"
      bindtouchstart="touchStart"
      bindtouchmove="touchMove"
      bindtouchend="touchEnd"
      style="left: {{positionX}}px; top: {{positionY}}px;"
    ></image>

    <view class="float-menu" wx:if="{{showMenu}}">
      <view class="menu-item"><navigator url="/pages/quiz/quiz">红史问答堂</navigator></view>
      <view class="menu-item"><navigator url="/pages/favorites/favorites">我的收藏</navigator></view>
      <view class="menu-item"><navigator url="/pages/history/history">浏览历史</navigator></view>
    </view>
  </view>
</view>