From 1c908dfc1a659f30220e43fb754fb0c86c7cccef Mon Sep 17 00:00:00 2001 From: lyf <2514544224@qq.com> Date: Thu, 27 Aug 2026 11:31:10 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B1=95=E7=A4=BA=E5=B1=95=E5=8E=85=E8=AE=B2?= =?UTF-8?q?=E8=A7=A3=E5=AF=B9=E8=B1=A1=E7=BC=96=E5=8F=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 接入目录分页接口返回的 externalCode 字段 - 在讲解对象标题下方统一展示编号 - 保留空编号对象的原有布局并补充回归测试 Made-with: Proma --- src/components/explain/ExplainGuideStopCatalog.vue | 4 +++- src/data/adapters/backendExplainDataAdapter.ts | 3 +++ src/domain/museum.ts | 2 ++ src/pages/explain/guide-stop-list.vue | 1 + tests/unit/BackendExplainContentProvider.spec.ts | 4 ++-- tests/unit/ExplainGuideStopCatalog.spec.ts | 4 +++- 6 files changed, 14 insertions(+), 4 deletions(-) diff --git a/src/components/explain/ExplainGuideStopCatalog.vue b/src/components/explain/ExplainGuideStopCatalog.vue index fdb6499..e18d50a 100644 --- a/src/components/explain/ExplainGuideStopCatalog.vue +++ b/src/components/explain/ExplainGuideStopCatalog.vue @@ -31,6 +31,7 @@ {{ stop.name }} + 编号：{{ stop.externalCode }} {{ availabilityLabel(stop) }} @@ -54,6 +55,7 @@ import GuideLoadingState from '@/components/navigation/GuideLoadingState.vue' export interface ExplainGuideStopCatalogItem { id: string name: string + externalCode?: string hallId?: string hallName?: string floorId?: string @@ -153,6 +155,6 @@ const handleScroll = (event: Event) => { const target = event.target as HTMLElem .header-back { position: absolute; left: 12px; top: 10px; width: 44px; height: 44px; display: flex; align-items: center; }.header-back-icon { width: 20px; height: 20px; position: relative; } .header-back-icon::before { content: ''; position: absolute; left: 3px; top: 4px; width: 10px; height: 10px; border-left: 1.5px solid #262421; border-bottom: 1.5px solid #262421; transform: rotate(45deg); } .header-back-text { display: none; }.header-title { max-width: calc(100% - 152px); padding: 0 8px; font-size: 18px; line-height: 26px; font-weight: 700; color: #262421; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .explain-scroll { height: 100%; padding: 80px 16px calc(16px + env(safe-area-inset-bottom)); box-sizing: border-box; background: #f7f9f2; }.host-navigation .explain-scroll { padding-top: 16px; } -.stop-list { display: flex; width: 100%; min-width: 0; flex-direction: column; gap: 4px; }.stop-card { width: 100%; min-width: 0; height: 80px; padding: 8px 0; display: flex; align-items: center; gap: 12px; box-sizing: border-box; overflow: hidden; border: 0; border-bottom: 1px solid #dbded4; border-radius: 0; background: transparent; }.stop-card:active { background: rgba(227, 235, 201, 0.4); }.stop-cover { flex: 0 0 64px; width: 64px; height: 64px; overflow: hidden; border-radius: 6px; background: #f5f5ed; }.stop-cover-fallback { font-size: 22px; line-height: 28px; color: #a9b29b; }.stop-copy { min-width: 0; display: flex; flex: 1; overflow: hidden; }.stop-name { display: -webkit-box; max-height: 40px; font-size: 14px; line-height: 20px; font-weight: 700; color: #262421; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }.stop-status { flex: 0 0 44px; width: 44px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: #e3ebc9; }.stop-status-text { font-size: 11px; line-height: 16px; color: #262421; white-space: nowrap; } +.stop-list { display: flex; width: 100%; min-width: 0; flex-direction: column; gap: 4px; }.stop-card { width: 100%; min-width: 0; min-height: 80px; padding: 8px 0; display: flex; align-items: center; gap: 12px; box-sizing: border-box; overflow: hidden; border: 0; border-bottom: 1px solid #dbded4; border-radius: 0; background: transparent; }.stop-card:active { background: rgba(227, 235, 201, 0.4); }.stop-cover { flex: 0 0 64px; width: 64px; height: 64px; overflow: hidden; border-radius: 6px; background: #f5f5ed; }.stop-cover-fallback { font-size: 22px; line-height: 28px; color: #a9b29b; }.stop-copy { min-width: 0; display: flex; flex: 1; flex-direction: column; justify-content: center; gap: 3px; overflow: hidden; }.stop-code { display: block; overflow: hidden; font-size: 11px; line-height: 16px; font-weight: 600; color: #68725d; text-overflow: ellipsis; white-space: nowrap; }.stop-name { display: -webkit-box; max-height: 40px; font-size: 14px; line-height: 20px; font-weight: 700; color: #262421; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }.stop-name + .stop-code { margin-top: 1px; }.stop-status { flex: 0 0 44px; width: 44px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: #e3ebc9; }.stop-status-text { font-size: 11px; line-height: 16px; color: #262421; white-space: nowrap; } .state-block { margin: 34px 0; padding: 22px 16px; box-sizing: border-box; text-align: center; border: 1px solid #e4e6df; border-radius: 8px; background: #fff; }.state-block.error { border-color: #e5c2c2; background: #fff7f7; }.state-title,.state-desc { display: block; }.state-title { font-size: 15px; line-height: 21px; font-weight: 700; color: #141412; }.state-desc { margin-top: 6px; font-size: 12px; line-height: 18px; color: #68725d; }.state-retry { margin-top: 12px; padding: 0 14px; font-size: 13px; line-height: 32px; color: #141412; background: #e0df00; border: 0; border-radius: 6px; }.load-more-state { min-height: 52px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); text-align: center; } diff --git a/src/data/adapters/backendExplainDataAdapter.ts b/src/data/adapters/backendExplainDataAdapter.ts index b01aaca..07ad86d 100644 --- a/src/data/adapters/backendExplainDataAdapter.ts +++ b/src/data/adapters/backendExplainDataAdapter.ts @@ -147,6 +147,8 @@ export interface BackendCatalogStopItem { mapX?: number | string | null mapY?: number | string | null name?: string | null + /** 馆方讲解编号，按字符串返回以保留前导零。 */ + externalCode?: string | null guideLevel?: string | null description?: string | null sort?: number | null @@ -350,6 +352,7 @@ export const toCatalogGuideStop = ( return { id, name: firstText(source.name, `讲解点${id}`), + externalCode: firstText(source.externalCode) || undefined, hallId: hall?.id, hallName: hall?.name, floorId: stringifyId(source.floorId) || hall?.floorId, diff --git a/src/domain/museum.ts b/src/domain/museum.ts index 7e23fa0..ef3d9cb 100644 --- a/src/domain/museum.ts +++ b/src/domain/museum.ts @@ -243,6 +243,8 @@ export interface MuseumExhibit { export interface ExplainGuideStop { id: string name: string + /** 馆方讲解编号，来自目录接口 externalCode，必须按字符串保留。 */ + externalCode?: string hallId?: string hallName?: string floorId?: string diff --git a/src/pages/explain/guide-stop-list.vue b/src/pages/explain/guide-stop-list.vue index 49ea6d0..1a4e026 100644 --- a/src/pages/explain/guide-stop-list.vue +++ b/src/pages/explain/guide-stop-list.vue @@ -43,6 +43,7 @@ let disposed = false const toGuideStopItems = (stops: ExplainGuideStop[]): ExplainGuideStopCatalogItem[] => stops.map((stop) => ({ id: stop.id, name: stop.name, + externalCode: stop.externalCode, hallId: stop.hallId, hallName: stop.hallName, floorId: stop.floorId, diff --git a/tests/unit/BackendExplainContentProvider.spec.ts b/tests/unit/BackendExplainContentProvider.spec.ts index 199f435..abf7a4c 100644 --- a/tests/unit/BackendExplainContentProvider.spec.ts +++ b/tests/unit/BackendExplainContentProvider.spec.ts @@ -26,7 +26,7 @@ describe('BackendExplainContentProvider hall stop paging', () => { data: { total: 30, list: pageNo === '1' - ? [{ stopId: 'stop-1', name: '对象一', imageStatus: 'READY', coverImageUrl: '/one.jpg', outlineId: 'outline-1', linkedExhibits: [] }] + ? [{ stopId: 'stop-1', name: '对象一', externalCode: '0231', imageStatus: 'READY', coverImageUrl: '/one.jpg', outlineId: 'outline-1', linkedExhibits: [] }] : [{ stopId: 'stop-2', name: '对象二', imageStatus: 'MISSING', outlineId: 'outline-1', linkedExhibits: [] }] } } @@ -38,7 +38,7 @@ describe('BackendExplainContentProvider hall stop paging', () => { ]) expect(first).toMatchObject({ total: 30, pageNo: 1, pageSize: 20, hasMore: true }) - expect(first.items[0]).toMatchObject({ id: 'stop-1', stopId: 'stop-1', hallName: '恐龙厅', outlineId: 'outline-1' }) + expect(first.items[0]).toMatchObject({ id: 'stop-1', stopId: 'stop-1', externalCode: '0231', hallName: '恐龙厅', outlineId: 'outline-1' }) expect(second.items.map((item) => item.id)).toEqual(['stop-2']) expect(requests.filter((url) => url.includes('/stops/page'))).toHaveLength(2) expect(requests.some((url) => url.includes('/outlines'))).toBe(false) diff --git a/tests/unit/ExplainGuideStopCatalog.spec.ts b/tests/unit/ExplainGuideStopCatalog.spec.ts index fadcb26..156d365 100644 --- a/tests/unit/ExplainGuideStopCatalog.spec.ts +++ b/tests/unit/ExplainGuideStopCatalog.spec.ts @@ -5,7 +5,7 @@ import { describe, expect, it } from 'vitest' import ExplainGuideStopCatalog from '@/components/explain/ExplainGuideStopCatalog.vue' const stops = [ - { id: 'ready', name: '一个很长很长很长很长很长的讲解对象名称', coverImageUrl: '/cover.jpg', audioStatus: 'READY', hasAudio: true, hasTextRecord: true }, + { id: 'ready', name: '一个很长很长很长很长很长的讲解对象名称', externalCode: '0231', coverImageUrl: '/cover.jpg', audioStatus: 'READY', hasAudio: true, hasTextRecord: true }, { id: 'text', name: '图文对象', hasTextRecord: true }, { id: 'none', name: '无内容对象' } ] @@ -22,6 +22,8 @@ describe('ExplainGuideStopCatalog', () => { expect(wrapper.findAll('.stop-status')).toHaveLength(3) expect(wrapper.text()).toContain('讲解') expect(wrapper.text()).toContain('图文') + expect(wrapper.get('.stop-code').text()).toBe('编号：0231') + expect(wrapper.findAll('.stop-code')).toHaveLength(1) expect(wrapper.text()).not.toContain('暂无内容') expect(wrapper.find('.hall-arrow').exists()).toBe(false) expect(wrapper.find('.stop-name').classes()).toContain('stop-name')