feat: switch explain flow to API data

src/components/explain/ExplainHallSelect.vue

@@ -101,11 +101,16 @@
             </view>
 
             <view class="hall-main">
-              <text class="hall-name">{{ stop.name }}</text>
+              <view class="stop-title-row">
+                <text class="hall-name">{{ stop.name }}</text>
+                <view v-if="stop.guideLevel" class="guide-level-badge">
+                  <text class="guide-level-text">{{ stop.guideLevel }}</text>
+                </view>
+              </view>
               <text v-if="stop.description" class="stop-desc">{{ stop.description }}</text>
               <view class="hall-meta-row">
                 <view class="floor-badge">
-                  <text class="floor-badge-text">{{ stop.hasAudio ? '可讲解' : '图文' }}</text>
+                  <text class="floor-badge-text">{{ stop.audioStatus === 'READY' ? '可讲解' : '图文' }}</text>
                 </view>
                 <text class="hall-meta-text">{{ stop.floorId || selectedHallName || '楼层待补充' }}</text>
               </view>
@@ -158,6 +163,8 @@ export interface ExplainGuideStopSelectItem {
   coverImageUrl?: string
   description?: string
   hasAudio?: boolean
+  audioStatus?: string
+  guideLevel?: string
 }
 
 export type ExplainSelectStage = 'hall' | 'unit' | 'stop'
@@ -422,6 +429,7 @@ const handleBack = () => {
 }
 
 .hall-name {
+  min-width: 0;
   font-size: 17px;
   line-height: 24px;
   font-weight: 800;
@@ -431,6 +439,38 @@ const handleBack = () => {
   white-space: nowrap;
 }
 
+.stop-title-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+}
+
+.guide-level-badge {
+  flex-shrink: 0;
+  max-width: 92px;
+  height: 22px;
+  padding: 0 7px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  background: #151713;
+  border-radius: 6px;
+}
+
+.guide-level-text {
+  display: block;
+  max-width: 100%;
+  font-size: 12px;
+  line-height: 16px;
+  font-weight: 700;
+  color: #e0df00;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .hall-meta-row {
   margin-top: 10px;
   display: flex;