优化

src/modules/warehouse-resources/locations/pages/LocationsView.test.ts

@@ -1,4 +1,6 @@
 import ElementPlus from 'element-plus'
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
 import { createPinia, setActivePinia } from 'pinia'
 import { enableAutoUnmount, flushPromises, mount, type VueWrapper } from '@vue/test-utils'
 import { afterAll, afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
@@ -15,6 +17,8 @@ import QueryToolbar, { type QueryField, type QueryModel } from '@/shared/compone
 import DataTable from '@/shared/components/DataTable.vue'
 import LocationsView from './LocationsView.vue'
 
+const locationsSource = readFileSync(resolve(process.cwd(), 'src/modules/warehouse-resources/locations/pages/LocationsView.vue'), 'utf8')
+
 vi.mock('../../../warehouses/api/platformWarehouses', () => ({ listAllPlatformWarehouses: vi.fn() }))
 vi.mock('../api/platformLocations', () => ({
   listPlatformLocations: vi.fn(),
@@ -138,6 +142,12 @@ enableAutoUnmount(afterEach)
 afterAll(() => vi.unstubAllGlobals())
 
 describe('LocationsView', () => {
+  it('uses the prototype-sized centered editor while retaining the detail drawer', () => {
+    expect(locationsSource).toContain("drawerMode.value === 'view' ? AppDrawer : AppDialog")
+    expect(locationsSource).toContain("width: 'min(560px, calc(100vw - 28px))'")
+    expect(locationsSource).toContain(':global(.location-editor-dialog .el-dialog__body) { min-height: 0; overflow-y: auto; }')
+    expect(locationsSource).toContain('.drawer-form :deep(.form-grid.two-cols) { grid-template-columns: minmax(0, 1fr); }')
+  })
   beforeEach(() => {
     vi.stubGlobal('ResizeObserver', ResizeObserverStub)
     document.body.innerHTML = ''

src/modules/warehouse-resources/locations/pages/LocationsView.vue

@@ -7,6 +7,7 @@ import { useUnsavedWorkRegistration } from '@/core/unsaved-work/useUnsavedWorkRe
 import { getApiErrorDetails, type ApiErrorDetails } from '@/shared/api/http'
 import AdminPage from '@/shared/components/AdminPage.vue'
 import ApiErrorMeta from '@/shared/components/ApiErrorMeta.vue'
+import AppDialog from '@/shared/components/AppDialog.vue'
 import AppDrawer from '@/shared/components/AppDrawer.vue'
 import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.vue'
 import FormSection from '@/shared/components/FormSection.vue'
@@ -149,6 +150,10 @@ const domesticWarehouses = computed(() => warehouses.value.filter((warehouse) =>
 const editorOpen = computed(() => drawerOpen.value && drawerMode.value !== 'view')
 const editorTitle = computed(() => drawerMode.value === 'create' ? '新增库位' : '编辑库位')
 const drawerTitle = computed(() => drawerMode.value === 'view' ? '库位详情' : editorTitle.value)
+const drawerContainer = computed(() => drawerMode.value === 'view' ? AppDrawer : AppDialog)
+const drawerContainerProps = computed(() => drawerMode.value === 'view'
+  ? { size: 'min(620px, 94vw)', showConfirm: false }
+  : { width: 'min(560px, calc(100vw - 28px))', showConfirm: false, destroyOnClose: true })
 const editorPermission = computed(() => drawerMode.value === 'create' ? 'platform:location:create' : 'platform:location:edit')
 const selectionDisabled = computed(() => drawerOpen.value || saving.value || actionLoadingIds.value.size > 0)
 const filtered = computed(() => Object.values(appliedFilters.value).some((value) => String(value || '').trim()))
@@ -646,14 +651,14 @@ onMounted(() => {
       </section>
     </ListPageLayout>
 
-    <AppDrawer
+    <component
+      :is="drawerContainer"
       v-model="drawerOpen"
       :title="drawerTitle"
-      size="min(620px, 94vw)"
-      class="location-drawer"
+      v-bind="drawerContainerProps"
+      :class="drawerMode === 'view' ? 'location-drawer' : 'location-editor-dialog'"
       :loading="drawerLoading"
       :confirm-loading="saving"
-      :show-confirm="false"
       :close-on-click-modal="false"
       :close-on-press-escape="!saving"
       :show-close="!saving"
@@ -785,7 +790,7 @@ onMounted(() => {
           <el-button v-if="drawerMode !== 'view'" type="primary" :loading="saving" @click="saveLocation"><Save :size="16" />保存库位</el-button>
         </div>
       </template>
-    </AppDrawer>
+    </component>
   </AdminPage>
 </template>
 
@@ -801,6 +806,9 @@ onMounted(() => {
 .location-cell small, .stacked-value small { color: var(--cc-muted); font-size: 11px; }
 .remark-cell { display: -webkit-box; overflow: hidden; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
 .drawer-content { min-height: 260px; }
+:global(.location-editor-dialog) { max-height: min(760px, calc(100vh - 32px)); display: flex; flex-direction: column; }
+:global(.location-editor-dialog .el-dialog__body) { min-height: 0; overflow-y: auto; }
+:global(.location-editor-dialog .el-dialog__footer) { flex: 0 0 auto; }
 .drawer-content > .el-alert + .el-alert, .detail-descriptions + .el-alert { margin-top: 14px; }
 .detail-identity { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin-bottom: 18px; }
 .detail-identity__icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 10px; background: #eef3fa; color: var(--cc-primary); }
@@ -820,6 +828,7 @@ onMounted(() => {
 :global(.location-action-menu .location-action-menu__danger:not(.is-disabled)) { color: var(--el-color-danger); }
 
 @media (max-width: 720px) {
+  .drawer-form :deep(.form-grid.two-cols) { grid-template-columns: minmax(0, 1fr); }
   .detail-identity { grid-template-columns: 44px minmax(0, 1fr); }
   .detail-identity > .el-tag { grid-column: 2; justify-self: start; }
   .detail-descriptions :deep(.el-descriptions__body), .detail-descriptions :deep(table), .detail-descriptions :deep(tbody) { display: block; width: 100%; }