优化

src/modules/warehouse-resources/locations/api/platformLocations.test.ts

@@ -0,0 +1,112 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { http } from '@/shared/api/http'
+import {
+  changePlatformLocationStatus,
+  createPlatformLocation,
+  deletePlatformLocation,
+  getPlatformLocation,
+  listPlatformLocations,
+  updatePlatformLocation,
+  type SavePlatformLocationRequest,
+} from './platformLocations'
+
+vi.mock('@/shared/api/http', () => ({
+  http: { get: vi.fn(), post: vi.fn(), put: vi.fn(), patch: vi.fn(), delete: vi.fn() },
+  unwrapApiResponse: <T>(response: { data: T }) => response.data,
+}))
+
+const payload: SavePlatformLocationRequest = {
+  warehouseId: '190000000000000101',
+  zoneCode: 'A',
+  zoneName: '常规区',
+  locationCode: 'A1-01',
+  locationName: 'A1 区 01 位',
+  locationType: 'SHELF',
+  maxWeightKg: 500,
+  status: 'AVAILABLE',
+  remark: null,
+  version: 3,
+}
+
+describe('platform location API', () => {
+  beforeEach(() => {
+    vi.mocked(http.get).mockReset()
+    vi.mocked(http.post).mockReset()
+    vi.mocked(http.put).mockReset()
+    vi.mocked(http.patch).mockReset()
+    vi.mocked(http.delete).mockReset()
+  })
+
+  it('uses the implemented paged list and detail contracts', async () => {
+    const page = { records: [], page: '2', size: '20', total: '21', pages: '2' }
+    const detail = { location: { id: '19001' }, warehouseCode: 'CN-YW-01', warehouseName: '义乌仓' }
+    vi.mocked(http.get)
+      .mockResolvedValueOnce({ code: '200', message: 'success', data: page })
+      .mockResolvedValueOnce({ code: '200', message: 'success', data: detail })
+
+    await expect(listPlatformLocations({
+      page: 2,
+      size: 20,
+      tenantId: '9223372036854775806',
+      warehouseId: '190000000000000101',
+      zoneCode: ' A ',
+      locationCode: ' A1 ',
+      locationType: 'SHELF',
+      status: 'AVAILABLE',
+    })).resolves.toEqual({ records: [], page: 2, size: 20, total: 21, pages: 2 })
+    await expect(getPlatformLocation('9223372036854775806', '190000000000000101', '19001')).resolves.toEqual(detail)
+
+    expect(http.get).toHaveBeenNthCalledWith(1, '/platform/v1/locations', {
+      params: {
+        tenantId: '9223372036854775806', page: 2, size: 20, warehouseId: '190000000000000101',
+        zoneCode: 'A', locationCode: 'A1', locationType: 'SHELF', status: 'AVAILABLE',
+      },
+    })
+    expect(http.get).toHaveBeenNthCalledWith(2, '/platform/v1/locations/19001', {
+      params: { tenantId: '9223372036854775806', warehouseId: '190000000000000101' },
+    })
+  })
+
+  it('omits empty customer, warehouse, and filter values from all-customer list requests', async () => {
+    const page = { records: [], page: 1, size: 20, total: 0, pages: 0 }
+    vi.mocked(http.get).mockResolvedValue({ code: '200', message: 'success', data: page })
+
+    await expect(listPlatformLocations({
+      page: 1,
+      size: 20,
+      tenantId: '',
+      warehouseId: '',
+      zoneCode: '',
+      locationCode: '',
+      locationType: '',
+      status: '',
+    })).resolves.toEqual(page)
+
+    expect(http.get).toHaveBeenCalledWith('/platform/v1/locations', {
+      params: { page: 1, size: 20 },
+    })
+  })
+
+  it('sends versioned create, update, status, and delete requests', async () => {
+    vi.mocked(http.post).mockResolvedValue({ code: '200', message: 'success', data: '19001' })
+    vi.mocked(http.put).mockResolvedValue({ code: '200', message: 'success', data: null })
+    vi.mocked(http.patch).mockResolvedValue({ code: '200', message: 'success', data: null })
+    vi.mocked(http.delete).mockResolvedValue({ code: '200', message: 'success', data: null })
+
+    await expect(createPlatformLocation(10001, payload)).resolves.toBe('19001')
+    await expect(updatePlatformLocation(10001, payload.warehouseId, '19001', payload)).resolves.toBeNull()
+    await expect(changePlatformLocationStatus(10001, payload.warehouseId, '19001', 'DISABLED', 3)).resolves.toBeNull()
+    await expect(deletePlatformLocation(10001, payload.warehouseId, '19001', 4)).resolves.toBeNull()
+
+    expect(http.post).toHaveBeenCalledWith('/platform/v1/locations', payload, { params: { tenantId: 10001 } })
+    expect(http.put).toHaveBeenCalledWith('/platform/v1/locations/19001', payload, {
+      params: { tenantId: 10001, warehouseId: payload.warehouseId },
+    })
+    expect(http.patch).toHaveBeenCalledWith('/platform/v1/locations/19001/status', { status: 'DISABLED', version: 3 }, {
+      params: { tenantId: 10001, warehouseId: payload.warehouseId },
+    })
+    expect(http.delete).toHaveBeenCalledWith('/platform/v1/locations/19001', {
+      params: { tenantId: 10001, warehouseId: payload.warehouseId, version: 4 },
+    })
+  })
+})

src/modules/warehouse-resources/locations/api/platformLocations.ts

@@ -0,0 +1,148 @@
+import { http, unwrapApiResponse, type ApiEnvelope } from '@/shared/api/http'
+
+export type PlatformLocationStatus = 'AVAILABLE' | 'RESERVED' | 'OCCUPIED' | 'DISABLED'
+export type EditablePlatformLocationStatus = 'AVAILABLE' | 'DISABLED'
+export type PlatformLocationType = 'SHELF' | 'PALLET' | 'FLOOR' | 'FLOW_RACK'
+
+export interface PlatformLocationResource {
+  id: number | string
+  tenantId: number | string
+  warehouseId: number | string
+  warehouseCode?: string | null
+  warehouseName?: string | null
+  zoneCode: string
+  zoneName: string
+  locationCode: string
+  locationName: string | null
+  locationType: PlatformLocationType
+  maxWeightKg: number | string | null
+  sharedOverflow: boolean | null
+  status: PlatformLocationStatus
+  remark: string | null
+  version: number
+  createdAt?: string | null
+  updatedAt?: string | null
+}
+
+export interface PlatformLocationDetail {
+  location: PlatformLocationResource
+  warehouseCode: string
+  warehouseName: string
+}
+
+export interface PlatformLocationPage {
+  records: PlatformLocationResource[]
+  page: number
+  size: number
+  total: number
+  pages: number
+}
+
+export interface PlatformLocationQuery {
+  page?: number
+  size?: number
+  tenantId?: number | string
+  warehouseId?: number | string
+  zoneCode?: string
+  locationCode?: string
+  locationType?: PlatformLocationType | ''
+  status?: PlatformLocationStatus | ''
+}
+
+export interface SavePlatformLocationRequest {
+  warehouseId: number | string
+  zoneCode: string
+  zoneName: string
+  locationCode: string
+  locationName: string | null
+  locationType: PlatformLocationType
+  maxWeightKg: number | null
+  status: EditablePlatformLocationStatus
+  remark: string | null
+  version?: number
+}
+
+const basePath = '/platform/v1/locations'
+
+export async function listPlatformLocations(query: PlatformLocationQuery) {
+  const zoneCode = query.zoneCode?.trim()
+  const locationCode = query.locationCode?.trim()
+  const response = await http.get<ApiEnvelope<PlatformLocationPage>, ApiEnvelope<PlatformLocationPage>>(basePath, {
+    params: {
+      page: query.page ?? 1,
+      size: query.size ?? 20,
+      ...(query.tenantId ? { tenantId: query.tenantId } : {}),
+      ...(query.warehouseId ? { warehouseId: query.warehouseId } : {}),
+      ...(zoneCode ? { zoneCode } : {}),
+      ...(locationCode ? { locationCode } : {}),
+      ...(query.locationType ? { locationType: query.locationType } : {}),
+      ...(query.status ? { status: query.status } : {}),
+    },
+  })
+  const result = unwrapApiResponse(response)
+  return {
+    ...result,
+    page: Number(result.page),
+    size: Number(result.size),
+    total: Number(result.total),
+    pages: Number(result.pages),
+  }
+}
+
+export async function getPlatformLocation(
+  tenantId: number | string,
+  warehouseId: number | string,
+  id: number | string,
+) {
+  const response = await http.get<ApiEnvelope<PlatformLocationDetail>, ApiEnvelope<PlatformLocationDetail>>(
+    `${basePath}/${id}`,
+    { params: { tenantId, warehouseId } },
+  )
+  return unwrapApiResponse(response)
+}
+
+export async function createPlatformLocation(tenantId: number | string, payload: SavePlatformLocationRequest) {
+  const response = await http.post<ApiEnvelope<number | string>, ApiEnvelope<number | string>>(basePath, payload, {
+    params: { tenantId },
+  })
+  return unwrapApiResponse(response)
+}
+
+export async function updatePlatformLocation(
+  tenantId: number | string,
+  warehouseId: number | string,
+  id: number | string,
+  payload: SavePlatformLocationRequest,
+) {
+  const response = await http.put<ApiEnvelope<null>, ApiEnvelope<null>>(`${basePath}/${id}`, payload, {
+    params: { tenantId, warehouseId },
+  })
+  return unwrapApiResponse(response)
+}
+
+export async function changePlatformLocationStatus(
+  tenantId: number | string,
+  warehouseId: number | string,
+  id: number | string,
+  status: EditablePlatformLocationStatus,
+  version: number,
+) {
+  const response = await http.patch<ApiEnvelope<null>, ApiEnvelope<null>>(
+    `${basePath}/${id}/status`,
+    { status, version },
+    { params: { tenantId, warehouseId } },
+  )
+  return unwrapApiResponse(response)
+}
+
+export async function deletePlatformLocation(
+  tenantId: number | string,
+  warehouseId: number | string,
+  id: number | string,
+  version: number,
+) {
+  const response = await http.delete<ApiEnvelope<null>, ApiEnvelope<null>>(`${basePath}/${id}`, {
+    params: { tenantId, warehouseId, version },
+  })
+  return unwrapApiResponse(response)
+}

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

@@ -0,0 +1,310 @@
+import ElementPlus from 'element-plus'
+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'
+import { useAccessPreviewStore } from '@/core/access/accessPreview'
+import { useAuthStore } from '@/core/auth/auth'
+import {
+  getPlatformLocation,
+  listPlatformLocations,
+  type PlatformLocationResource,
+} from '../api/platformLocations'
+import { listPlatformTenants, type PlatformTenantResource } from '../../../iam/api/platformIam'
+import { listPlatformWarehouses, type PlatformWarehouseResource } from '../../../warehouses/api/platformWarehouses'
+import QueryToolbar, { type QueryField, type QueryModel } from '@/shared/components/QueryToolbar.vue'
+import DataTable from '@/shared/components/DataTable.vue'
+import LocationsView from './LocationsView.vue'
+
+vi.mock('../../../iam/api/platformIam', () => ({ listPlatformTenants: vi.fn() }))
+vi.mock('../../../warehouses/api/platformWarehouses', () => ({ listPlatformWarehouses: vi.fn() }))
+vi.mock('../api/platformLocations', () => ({
+  listPlatformLocations: vi.fn(),
+  getPlatformLocation: vi.fn(),
+  createPlatformLocation: vi.fn(),
+  updatePlatformLocation: vi.fn(),
+  changePlatformLocationStatus: vi.fn(),
+  deletePlatformLocation: vi.fn(),
+}))
+
+class ResizeObserverStub implements ResizeObserver {
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+}
+
+function createMemoryStorage(): Storage {
+  const values = new Map<string, string>()
+  return {
+    get length() { return values.size },
+    clear: () => values.clear(),
+    getItem: (key) => values.get(key) ?? null,
+    key: (index) => [...values.keys()][index] ?? null,
+    removeItem: (key) => values.delete(key),
+    setItem: (key, value) => values.set(key, value),
+  }
+}
+
+const tenant = (id: number | string): PlatformTenantResource => ({
+  id,
+  tenantCode: String(id),
+  tenantName: '雪花企业',
+  status: 'ACTIVE',
+  legalName: '雪花企业',
+  legalRepresentative: null,
+  unifiedSocialCreditCode: null,
+  contactName: null,
+  contactPhone: null,
+  contactEmail: null,
+  servicePackage: null,
+  contactWechat: null,
+  salesOwnerName: null,
+  paymentTermDays: null,
+  enterpriseType: null,
+  establishedDate: null,
+  registeredCapital: null,
+  registeredCapitalCurrency: null,
+  registeredAddress: null,
+  internalRemark: null,
+  createdAt: null,
+  approvedAt: null,
+})
+
+const tenantId = '9223372036854775806'
+const warehouseId = '9223372036854775805'
+const warehouse: PlatformWarehouseResource = {
+  id: warehouseId,
+  tenantId,
+  warehouseCode: 'CN-YW-01',
+  warehouseName: '义乌收货仓',
+  warehouseType: 'DOMESTIC',
+  countryCode: 'CN',
+  timezone: 'Asia/Shanghai',
+  contactName: null,
+  contactPhone: null,
+  contactEmail: null,
+  status: 'ACTIVE',
+  remark: null,
+}
+
+const availableLocation: PlatformLocationResource = {
+  id: '9223372036854775804',
+  tenantId,
+  warehouseId,
+  zoneCode: 'A',
+  zoneName: '常规区',
+  locationCode: 'A1-01',
+  locationName: 'A1 区 01 位',
+  locationType: 'SHELF',
+  maxWeightKg: '500.000',
+  sharedOverflow: false,
+  status: 'AVAILABLE',
+  remark: '靠近入库口',
+  version: 3,
+  updatedAt: '2026-08-04T10:20:00',
+}
+
+const occupiedLocation: PlatformLocationResource = {
+  ...availableLocation,
+  id: '9223372036854775803',
+  locationCode: 'A1-02',
+  locationName: 'A1 区 02 位',
+  status: 'OCCUPIED',
+  version: 5,
+}
+
+async function mountView() {
+  vi.stubGlobal('localStorage', createMemoryStorage())
+  vi.stubGlobal('sessionStorage', createMemoryStorage())
+  const pinia = createPinia()
+  setActivePinia(pinia)
+  const auth = useAuthStore()
+  auth.token = 'token'
+  auth.permissions = [
+    'platform:location:list',
+    'platform:location:create',
+    'platform:location:edit',
+    'platform:location:status',
+    'platform:location:delete',
+  ]
+  useAccessPreviewStore().initializeAfterLogin()
+  const wrapper = mount(LocationsView, {
+    attachTo: document.body,
+    global: { plugins: [pinia, ElementPlus] },
+  })
+  await flushPromises()
+  return wrapper
+}
+
+async function selectScope(wrapper: VueWrapper) {
+  let toolbar = wrapper.findComponent(QueryToolbar)
+  toolbar.vm.$emit('update:modelValue', { ...(toolbar.props('modelValue') as QueryModel), customerId: tenantId })
+  await flushPromises()
+  toolbar = wrapper.findComponent(QueryToolbar)
+  toolbar.vm.$emit('update:modelValue', { ...(toolbar.props('modelValue') as QueryModel), warehouseId })
+  await flushPromises()
+  const searchButton = toolbar.findAll('button').find((button) => button.text().trim() === '查询')
+  await searchButton!.trigger('click')
+  await flushPromises()
+}
+
+enableAutoUnmount(afterEach)
+afterAll(() => vi.unstubAllGlobals())
+
+describe('LocationsView', () => {
+  beforeEach(() => {
+    vi.stubGlobal('ResizeObserver', ResizeObserverStub)
+    document.body.innerHTML = ''
+    vi.mocked(listPlatformTenants).mockReset().mockResolvedValue({
+      records: [tenant(tenantId)], page: 1, size: 200, total: 1, pages: 1,
+    })
+    vi.mocked(listPlatformWarehouses).mockReset().mockResolvedValue({
+      records: [warehouse], page: 1, size: 200, total: 1, pages: 1,
+    })
+    vi.mocked(listPlatformLocations).mockReset().mockResolvedValue({
+      records: [availableLocation, occupiedLocation], page: 1, size: 20, total: 2, pages: 1,
+    })
+    vi.mocked(getPlatformLocation).mockReset().mockResolvedValue({
+      location: availableLocation, warehouseCode: warehouse.warehouseCode, warehouseName: warehouse.warehouseName,
+    })
+  })
+
+  it('starts with all customers and queries the full list without empty IDs', async () => {
+    const wrapper = await mountView()
+    const toolbar = wrapper.findComponent(QueryToolbar)
+    const fields = toolbar.props('fields') as QueryField[]
+
+    expect(listPlatformTenants).toHaveBeenCalledWith({ page: 1, size: 200 })
+    expect(wrapper.find('[aria-label="所属企业"]').exists()).toBe(true)
+    expect(fields[0]?.placeholder).toBe('全部客户')
+    expect((toolbar.props('modelValue') as QueryModel).customerId).toBe('')
+    expect(fields.map(({ key, width }) => [key, width])).toEqual([
+      ['customerId', 260], ['warehouseId', 240], ['zoneCode', 210],
+      ['locationCode', 220], ['locationType', 170], ['status', 160],
+    ])
+    expect(listPlatformWarehouses).not.toHaveBeenCalled()
+    expect(listPlatformLocations).toHaveBeenCalledWith({
+      page: 1,
+      size: 20,
+      zoneCode: '',
+      locationCode: '',
+      locationType: '',
+      status: '',
+    })
+    const searchButton = toolbar.findAll('button').find((button) => button.text().trim() === '查询')
+    await searchButton!.trigger('click')
+    await flushPromises()
+    expect(listPlatformLocations).toHaveBeenCalledTimes(2)
+    expect(wrapper.text()).not.toContain('请选择客户')
+    expect(wrapper.text()).not.toContain('请选择所属企业')
+    expect(wrapper.text()).not.toContain('租户')
+    expect(wrapper.text()).not.toContain('企业 ID')
+  })
+
+  it('loads the selected customer, warehouse, and location hierarchy without narrowing snowflake IDs', async () => {
+    const wrapper = await mountView()
+    await selectScope(wrapper)
+
+    expect(wrapper.find('.table-panel .panel-heading').exists()).toBe(false)
+    expect(listPlatformWarehouses).toHaveBeenCalledWith(tenantId, 1, 200)
+    expect(listPlatformLocations).toHaveBeenLastCalledWith({
+      page: 1,
+      size: 20,
+      tenantId,
+      warehouseId,
+      zoneCode: '',
+      locationCode: '',
+      locationType: '',
+      status: '',
+    })
+    expect(wrapper.text()).toContain('义乌收货仓')
+    expect(wrapper.text()).toContain('A1-01')
+    expect(wrapper.findAll('thead th').map((item) => item.text().trim())).toEqual([
+      '操作', '库位编码', '所属仓库', '库区', '库位类型', '最大承重（kg）', '状态', '备注',
+    ])
+  })
+
+  it('keeps the operation column first and hides edit actions for occupied resources', async () => {
+    const wrapper = await mountView()
+    await selectScope(wrapper)
+    const headings = wrapper.findAll('thead th').map((item) => item.text().trim())
+    expect(headings[0]).toBe('操作')
+
+    const bodyRows = wrapper.findAll('tbody tr')
+    expect(bodyRows[0]?.text()).toContain('编辑')
+    expect(bodyRows[1]?.text()).toContain('详情')
+    expect(bodyRows[1]?.text()).not.toContain('编辑')
+    expect(bodyRows[1]?.text()).not.toContain('更多')
+  })
+
+  it('opens an authenticated detail view with warehouse context', async () => {
+    const wrapper = await mountView()
+    const detailButton = wrapper.find('.el-table__body-wrapper tbody tr button')
+    expect(detailButton.text()).toBe('详情')
+    await detailButton.trigger('click')
+    await flushPromises()
+
+    expect(getPlatformLocation).toHaveBeenCalledWith(tenantId, warehouseId, availableLocation.id)
+    expect(document.body.textContent).toContain('库位详情')
+    expect(document.body.textContent).toContain('义乌收货仓（CN-YW-01）')
+    expect(document.body.textContent).toContain(`所属企业雪花企业（${tenantId}）`)
+    expect(document.body.textContent).not.toContain('企业 ID')
+    expect(document.body.textContent).toContain('库位名称A1 区 01 位')
+    expect(document.body.textContent).toContain('v3')
+  })
+
+  it('presents occupied locations as read-only business resources', async () => {
+    vi.mocked(getPlatformLocation).mockResolvedValueOnce({
+      location: occupiedLocation,
+      warehouseCode: warehouse.warehouseCode,
+      warehouseName: warehouse.warehouseName,
+    })
+    const wrapper = await mountView()
+    const occupiedRow = wrapper.findAll('tbody tr')[1]
+    await occupiedRow!.find('button').trigger('click')
+    await flushPromises()
+
+    expect(document.body.textContent).toContain('状态已占用')
+    expect(document.body.textContent).toContain('当前库位正在被业务使用，只允许查看。')
+  })
+
+  it('clears customer and warehouse on reset and immediately restores the full query', async () => {
+    const wrapper = await mountView()
+    await selectScope(wrapper)
+    const toolbar = wrapper.findComponent(QueryToolbar)
+    const resetButton = toolbar.findAll('button').find((button) => button.text().trim() === '重置')
+
+    await resetButton!.trigger('click')
+    await flushPromises()
+
+    const model = wrapper.findComponent(QueryToolbar).props('modelValue') as QueryModel
+    expect(model.customerId).toBe('')
+    expect(model.warehouseId).toBe('')
+    expect(listPlatformLocations).toHaveBeenLastCalledWith({
+      page: 1,
+      size: 20,
+      zoneCode: '',
+      locationCode: '',
+      locationType: '',
+      status: '',
+    })
+    expect(wrapper.text()).not.toContain('请选择客户')
+  })
+
+  it('paginates the all-customer list without adding customer or warehouse IDs', async () => {
+    vi.mocked(listPlatformLocations).mockResolvedValue({
+      records: [availableLocation, occupiedLocation], page: 1, size: 20, total: 40, pages: 2,
+    })
+    const wrapper = await mountView()
+    wrapper.findComponent(DataTable).vm.$emit('update:page', 2)
+    await flushPromises()
+
+    expect(listPlatformLocations).toHaveBeenLastCalledWith({
+      page: 2,
+      size: 20,
+      zoneCode: '',
+      locationCode: '',
+      locationType: '',
+      status: '',
+    })
+  })
+})

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

@@ -0,0 +1,808 @@
+<script setup lang="ts">
+import { computed, onMounted, reactive, ref, watch } from 'vue'
+import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
+import { Eye, MapPin, MoreHorizontal, Pencil, Plus, Power, Trash2 } from '@lucide/vue'
+import { listPlatformTenants, type PlatformTenantResource } from '@/modules/iam'
+import { useAccessPreviewStore } from '@/core/access/accessPreview'
+import { useUnsavedWorkRegistration } from '@/core/unsaved-work/useUnsavedWorkRegistration'
+import { getApiErrorDetails, type ApiErrorDetails } from '@/shared/api/http'
+import ApiErrorMeta from '@/shared/components/ApiErrorMeta.vue'
+import DataTable, { type DataTableColumn } from '@/shared/components/DataTable.vue'
+import QueryToolbar, { type QueryField, type QueryModel } from '@/shared/components/QueryToolbar.vue'
+import {
+  changePlatformLocationStatus,
+  createPlatformLocation,
+  deletePlatformLocation,
+  getPlatformLocation,
+  listPlatformLocations,
+  updatePlatformLocation,
+  type EditablePlatformLocationStatus,
+  type PlatformLocationDetail,
+  type PlatformLocationQuery,
+  type PlatformLocationResource,
+  type PlatformLocationStatus,
+  type PlatformLocationType,
+  type SavePlatformLocationRequest,
+} from '../api/platformLocations'
+import { listPlatformWarehouses, type PlatformWarehouseResource } from '../../../warehouses/api/platformWarehouses'
+
+type DrawerMode = 'view' | 'create' | 'edit'
+type LocationFilters = QueryModel & {
+  customerId: string
+  warehouseId: string
+  zoneCode: string
+  locationCode: string
+  locationType: PlatformLocationType | ''
+  status: PlatformLocationStatus | ''
+}
+type AppliedLocationFilters = {
+  zoneCode: string
+  locationCode: string
+  locationType: PlatformLocationType | ''
+  status: PlatformLocationStatus | ''
+}
+
+const access = useAccessPreviewStore()
+const customers = ref<PlatformTenantResource[]>([])
+const customerLoading = ref(false)
+const customerError = ref<ApiErrorDetails | null>(null)
+const loadedCustomerId = ref<string | null>(null)
+const warehouses = ref<PlatformWarehouseResource[]>([])
+const warehouseLoading = ref(false)
+const warehouseError = ref<ApiErrorDetails | null>(null)
+const loading = ref(false)
+const loadError = ref<ApiErrorDetails | null>(null)
+const rows = ref<PlatformLocationResource[]>([])
+const page = ref(1)
+const pageSize = ref(20)
+const total = ref(0)
+const drawerOpen = ref(false)
+const drawerMode = ref<DrawerMode>('view')
+const drawerLoading = ref(false)
+const drawerError = ref<ApiErrorDetails | null>(null)
+const detail = ref<PlatformLocationDetail | null>(null)
+const saving = ref(false)
+const actionLoadingIds = ref(new Set<string>())
+const formRef = ref<FormInstance>()
+let customerLoadSequence = 0
+let locationLoadSequence = 0
+
+const filters = ref<LocationFilters>({ customerId: '', warehouseId: '', zoneCode: '', locationCode: '', locationType: '', status: '' })
+const appliedFilters = ref<AppliedLocationFilters>({ zoneCode: '', locationCode: '', locationType: '', status: '' })
+const selectedCustomerId = computed(() => String(filters.value.customerId || ''))
+const selectedWarehouseId = computed(() => String(filters.value.warehouseId || ''))
+const queryFields = computed<QueryField[]>(() => [
+  {
+    key: 'customerId',
+    type: 'select',
+    width: 260,
+    placeholder: customerError.value ? '客户列表加载失败' : '全部客户',
+    props: { 'aria-label': '所属企业', filterable: true, disabled: customerLoading.value || Boolean(customerError.value) || selectionDisabled.value },
+    options: customers.value.map((customer) => ({
+      value: String(customer.id),
+      label: `${customer.tenantName}（${customer.tenantCode || customer.id}）`,
+    })),
+  },
+  {
+    key: 'warehouseId',
+    type: 'select',
+    width: 240,
+    placeholder: warehouseLoading.value ? '仓库加载中' : '所属仓库',
+    props: {
+      'aria-label': '所属仓库',
+      filterable: true,
+      disabled: selectionDisabled.value || warehouseLoading.value || !customerReady.value || warehouses.value.length === 0,
+    },
+    options: warehouses.value.map((warehouse) => ({
+      value: String(warehouse.id),
+      label: `${warehouse.warehouseName}（${warehouse.warehouseCode}）`,
+      disabled: warehouse.status !== 'ACTIVE',
+    })),
+  },
+  { key: 'zoneCode', type: 'input', width: 210, placeholder: '库区编码', props: { maxlength: 50, 'aria-label': '库区编码' } },
+  { key: 'locationCode', type: 'input', width: 220, placeholder: '库位编码', props: { maxlength: 50, 'aria-label': '库位编码' } },
+  {
+    key: 'locationType', type: 'select', width: 170, placeholder: '全部类型', props: { 'aria-label': '库位类型' },
+    options: [
+      { label: '货架位', value: 'SHELF' },
+      { label: '托盘位', value: 'PALLET' },
+      { label: '地堆位', value: 'FLOOR' },
+      { label: '流利架', value: 'FLOW_RACK' },
+    ],
+  },
+  {
+    key: 'status', type: 'select', width: 160, placeholder: '全部状态', props: { 'aria-label': '库位状态' },
+    options: [
+      { label: '可用', value: 'AVAILABLE' },
+      { label: '已预占', value: 'RESERVED' },
+      { label: '已占用', value: 'OCCUPIED' },
+      { label: '已停用', value: 'DISABLED' },
+    ],
+  },
+])
+
+const emptyForm = () => ({
+  id: '',
+  customerId: selectedCustomerId.value,
+  warehouseId: selectedWarehouseId.value,
+  zoneCode: '',
+  zoneName: '',
+  locationCode: '',
+  locationName: '',
+  locationType: 'SHELF' as PlatformLocationType,
+  maxWeightKg: null as number | null,
+  status: 'AVAILABLE' as EditablePlatformLocationStatus,
+  remark: '',
+  version: 0,
+})
+const form = reactive(emptyForm())
+const rules: FormRules<typeof form> = {
+  zoneCode: [{ required: true, message: '请输入库区编码', trigger: 'blur' }],
+  zoneName: [{ required: true, message: '请输入库区名称', trigger: 'blur' }],
+  locationCode: [
+    { required: true, message: '请输入库位编码', trigger: 'blur' },
+    {
+      validator: (_rule, value: string, callback) => {
+        if (value.trim().toUpperCase() === 'A0') callback(new Error('A0 是系统共享溢出位保留编码'))
+        else callback()
+      },
+      trigger: 'blur',
+    },
+  ],
+  locationType: [{ required: true, message: '请选择库位类型', trigger: 'change' }],
+  status: [{ required: true, message: '请选择状态', trigger: 'change' }],
+}
+
+const selectedWarehouse = computed(() => warehouses.value.find((item) => String(item.id) === selectedWarehouseId.value) ?? null)
+const customerReady = computed(() => Boolean(selectedCustomerId.value) && loadedCustomerId.value === selectedCustomerId.value && !warehouseLoading.value)
+const createReady = computed(() => customerReady.value && Boolean(selectedWarehouse.value) && !loading.value)
+const editorOpen = computed(() => drawerOpen.value && drawerMode.value !== 'view')
+const editorTitle = computed(() => drawerMode.value === 'create' ? '新增库位' : '编辑库位')
+const drawerTitle = computed(() => drawerMode.value === 'view' ? '库位详情' : editorTitle.value)
+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()))
+const emptyDescription = computed(() => filtered.value ? '暂无符合筛选条件的库位' : '暂无库位数据')
+
+const { captureBaseline } = useUnsavedWorkRegistration({
+  key: 'location-editor',
+  label: editorTitle,
+  isOpen: editorOpen,
+  model: form,
+  requiredPermission: editorPermission,
+})
+
+const statusMeta: Record<PlatformLocationStatus, { label: string; type: 'success' | 'warning' | 'danger' | 'info' }> = {
+  AVAILABLE: { label: '可用', type: 'success' },
+  RESERVED: { label: '已预占', type: 'warning' },
+  OCCUPIED: { label: '已占用', type: 'danger' },
+  DISABLED: { label: '已停用', type: 'info' },
+}
+const typeLabels: Record<PlatformLocationType, string> = {
+  SHELF: '货架位',
+  PALLET: '托盘位',
+  FLOOR: '地堆位',
+  FLOW_RACK: '流利架',
+}
+
+const columns: DataTableColumn[] = [
+  { key: 'actions', label: '操作', width: 210, fixed: 'left', slotName: 'actions' },
+  { key: 'location', label: '库位编码', minWidth: 190, slotName: 'location' },
+  { key: 'warehouse', label: '所属仓库', minWidth: 210, slotName: 'warehouse' },
+  { key: 'zone', label: '库区', minWidth: 150, slotName: 'zone' },
+  { key: 'locationType', label: '库位类型', width: 120, slotName: 'locationType' },
+  { key: 'maxWeightKg', label: '最大承重（kg）', minWidth: 140, slotName: 'maxWeightKg' },
+  { key: 'status', label: '状态', width: 110, slotName: 'status' },
+  { key: 'remark', label: '备注', minWidth: 220, slotName: 'remark' },
+]
+
+function apiId(value: string) {
+  return value
+}
+
+function optionalText(value: string) {
+  return value.trim() || null
+}
+
+function formatDateTime(value?: string | null) {
+  return value?.replace('T', ' ').slice(0, 16) || '—'
+}
+
+function formatWeight(value: number | string | null) {
+  if (value === null || value === '') return '—'
+  const numeric = Number(value)
+  return Number.isFinite(numeric) ? `${numeric.toLocaleString('zh-CN', { maximumFractionDigits: 3 })} kg` : `${value} kg`
+}
+
+function canEdit(row: PlatformLocationResource) {
+  return access.can('platform:location:edit')
+    && !row.sharedOverflow
+    && (row.status === 'AVAILABLE' || row.status === 'DISABLED')
+}
+
+function canChangeStatus(row: PlatformLocationResource) {
+  return access.can('platform:location:status')
+    && !row.sharedOverflow
+    && (row.status === 'AVAILABLE' || row.status === 'DISABLED')
+}
+
+function canDelete(row: PlatformLocationResource) {
+  return access.can('platform:location:delete') && !row.sharedOverflow && row.status === 'DISABLED'
+}
+
+function actionError(error: unknown, fallback: string) {
+  const details = getApiErrorDetails(error, fallback)
+  ElMessage.error(details.requestId ? `${details.message}（requestId: ${details.requestId}）` : details.message)
+}
+
+function requireCreateScope() {
+  if (!createReady.value || !selectedCustomerId.value || !selectedWarehouseId.value) {
+    ElMessage.warning('所属企业和仓库数据尚未加载完成，请稍后重试')
+    return null
+  }
+  return { customerId: apiId(selectedCustomerId.value), warehouseId: apiId(selectedWarehouseId.value) }
+}
+
+function recordScope(row: PlatformLocationResource) {
+  return { customerId: apiId(String(row.tenantId)), warehouseId: apiId(String(row.warehouseId)) }
+}
+
+function customerLabel(customerId: number | string) {
+  const customer = customers.value.find((item) => String(item.id) === String(customerId))
+  return customer ? `${customer.tenantName}（${customer.tenantCode || customer.id}）` : String(customerId)
+}
+
+async function loadCustomers() {
+  customerLoading.value = true
+  customerError.value = null
+  try {
+    const result = await listPlatformTenants({ page: 1, size: 200 })
+    customers.value = result.records
+  } catch (error) {
+    customers.value = []
+    customerError.value = getApiErrorDetails(error, '所属企业列表加载失败，请稍后重试')
+  } finally {
+    customerLoading.value = false
+  }
+}
+
+async function loadWarehouses(customerId = selectedCustomerId.value) {
+  if (!customerId) return
+  const sequence = ++customerLoadSequence
+  warehouseLoading.value = true
+  warehouseError.value = null
+  filters.value = { ...filters.value, warehouseId: '' }
+  warehouses.value = []
+  try {
+    const result = await listPlatformWarehouses(apiId(customerId), 1, 200)
+    if (sequence !== customerLoadSequence) return
+    warehouses.value = result.records
+    loadedCustomerId.value = customerId
+  } catch (error) {
+    if (sequence !== customerLoadSequence) return
+    loadedCustomerId.value = null
+    warehouseError.value = getApiErrorDetails(error, '仓库列表加载失败，请稍后重试')
+  } finally {
+    if (sequence === customerLoadSequence) warehouseLoading.value = false
+  }
+}
+
+async function loadLocations() {
+  const sequence = ++locationLoadSequence
+  loading.value = true
+  loadError.value = null
+  try {
+    const query: PlatformLocationQuery = {
+      page: page.value,
+      size: pageSize.value,
+      zoneCode: appliedFilters.value.zoneCode,
+      locationCode: appliedFilters.value.locationCode,
+      locationType: appliedFilters.value.locationType,
+      status: appliedFilters.value.status,
+    }
+    if (selectedCustomerId.value) query.tenantId = apiId(selectedCustomerId.value)
+    if (selectedWarehouseId.value) query.warehouseId = apiId(selectedWarehouseId.value)
+    const result = await listPlatformLocations(query)
+    if (sequence !== locationLoadSequence) return
+    rows.value = result.records
+    total.value = result.total
+  } catch (error) {
+    if (sequence !== locationLoadSequence) return
+    rows.value = []
+    total.value = 0
+    loadError.value = getApiErrorDetails(error, '库位列表加载失败，请稍后重试')
+  } finally {
+    if (sequence === locationLoadSequence) loading.value = false
+  }
+}
+
+function applyFilters(model: QueryModel) {
+  appliedFilters.value = {
+    zoneCode: String(model.zoneCode || ''),
+    locationCode: String(model.locationCode || ''),
+    locationType: (model.locationType || '') as PlatformLocationType | '',
+    status: (model.status || '') as PlatformLocationStatus | '',
+  }
+  if (page.value === 1) void loadLocations()
+  else page.value = 1
+}
+
+function assignForm(resource: PlatformLocationResource) {
+  Object.assign(form, {
+    id: String(resource.id),
+    customerId: String(resource.tenantId),
+    warehouseId: String(resource.warehouseId),
+    zoneCode: resource.zoneCode,
+    zoneName: resource.zoneName,
+    locationCode: resource.locationCode,
+    locationName: resource.locationName ?? '',
+    locationType: resource.locationType,
+    maxWeightKg: resource.maxWeightKg === null ? null : Number(resource.maxWeightKg),
+    status: resource.status as EditablePlatformLocationStatus,
+    remark: resource.remark ?? '',
+    version: resource.version,
+  })
+}
+
+function openCreate() {
+  if (!requireCreateScope()) return
+  Object.assign(form, emptyForm(), {
+    status: selectedWarehouse.value?.status === 'ACTIVE' ? 'AVAILABLE' : 'DISABLED',
+  })
+  detail.value = null
+  drawerError.value = null
+  drawerMode.value = 'create'
+  captureBaseline()
+  drawerOpen.value = true
+  void formRef.value?.clearValidate()
+}
+
+async function loadDetail(row: PlatformLocationResource, mode: 'view' | 'edit') {
+  const scope = recordScope(row)
+  drawerMode.value = mode
+  drawerOpen.value = true
+  drawerLoading.value = true
+  drawerError.value = null
+  detail.value = null
+  try {
+    const result = await getPlatformLocation(scope.customerId, scope.warehouseId, row.id)
+    detail.value = result
+    if (mode === 'edit') {
+      assignForm(result.location)
+      captureBaseline()
+      void formRef.value?.clearValidate()
+    }
+  } catch (error) {
+    drawerError.value = getApiErrorDetails(error, '库位详情加载失败，请稍后重试')
+  } finally {
+    drawerLoading.value = false
+  }
+}
+
+function buildPayload(): SavePlatformLocationRequest {
+  return {
+    warehouseId: apiId(form.warehouseId),
+    zoneCode: form.zoneCode.trim(),
+    zoneName: form.zoneName.trim(),
+    locationCode: form.locationCode.trim(),
+    locationName: optionalText(form.locationName),
+    locationType: form.locationType,
+    maxWeightKg: form.maxWeightKg,
+    status: form.status,
+    remark: optionalText(form.remark),
+    ...(form.id ? { version: form.version } : {}),
+  }
+}
+
+async function saveLocation() {
+  const scope = form.id
+    ? { customerId: apiId(form.customerId), warehouseId: apiId(form.warehouseId) }
+    : requireCreateScope()
+  if (!scope) return
+  const valid = await formRef.value?.validate().catch(() => false)
+  if (!valid) return
+  saving.value = true
+  try {
+    const payload = buildPayload()
+    if (form.id) await updatePlatformLocation(scope.customerId, scope.warehouseId, form.id, payload)
+    else await createPlatformLocation(scope.customerId, payload)
+    drawerOpen.value = false
+    ElMessage.success(form.id ? '库位资料已更新' : '库位已创建')
+    await loadLocations()
+  } catch (error) {
+    actionError(error, '库位保存失败，请检查后重试')
+    if (form.id) await loadLocations()
+  } finally {
+    saving.value = false
+  }
+}
+
+function setActionLoading(id: number | string, active: boolean) {
+  const next = new Set(actionLoadingIds.value)
+  if (active) next.add(String(id))
+  else next.delete(String(id))
+  actionLoadingIds.value = next
+}
+
+async function toggleStatus(row: PlatformLocationResource) {
+  const scope = recordScope(row)
+  if (!canChangeStatus(row)) return
+  const nextStatus: EditablePlatformLocationStatus = row.status === 'AVAILABLE' ? 'DISABLED' : 'AVAILABLE'
+  const action = nextStatus === 'AVAILABLE' ? '启用' : '停用'
+  try {
+    await ElMessageBox.confirm(
+      nextStatus === 'DISABLED'
+        ? `确定停用“${row.locationCode}”吗？停用前后端会再次检查是否存在活动预占或占用。`
+        : `确定重新启用“${row.locationCode}”吗？仅启用仓库中的库位可以恢复可用。`,
+      `${action}库位`,
+      { type: nextStatus === 'AVAILABLE' ? 'success' : 'warning', confirmButtonText: `确认${action}`, cancelButtonText: '取消' },
+    )
+  } catch {
+    return
+  }
+  setActionLoading(row.id, true)
+  try {
+    await changePlatformLocationStatus(scope.customerId, scope.warehouseId, row.id, nextStatus, row.version)
+    ElMessage.success(`库位 ${row.locationCode} 已${action}`)
+    await loadLocations()
+  } catch (error) {
+    actionError(error, `${action}库位失败`)
+    await loadLocations()
+  } finally {
+    setActionLoading(row.id, false)
+  }
+}
+
+async function removeLocation(row: PlatformLocationResource) {
+  const scope = recordScope(row)
+  if (!canDelete(row)) return
+  try {
+    await ElMessageBox.confirm(
+      `确定删除已停用库位“${row.locationCode}”吗？系统会保留审计记录，此操作不能直接恢复。`,
+      '删除库位',
+      { type: 'warning', confirmButtonText: '确认删除', cancelButtonText: '取消' },
+    )
+  } catch {
+    return
+  }
+  setActionLoading(row.id, true)
+  try {
+    await deletePlatformLocation(scope.customerId, scope.warehouseId, row.id, row.version)
+    ElMessage.success(`库位 ${row.locationCode} 已删除`)
+    await loadLocations()
+  } catch (error) {
+    actionError(error, '删除库位失败')
+    await loadLocations()
+  } finally {
+    setActionLoading(row.id, false)
+  }
+}
+
+function handleMoreAction(row: PlatformLocationResource, command: string) {
+  if (command === 'status') void toggleStatus(row)
+  if (command === 'delete') void removeLocation(row)
+}
+
+watch(
+  () => access.can(editorPermission.value),
+  (allowed) => {
+    if (allowed || !editorOpen.value) return
+    drawerOpen.value = false
+  },
+  { flush: 'sync' },
+)
+
+watch([page, pageSize], () => { void loadLocations() })
+watch(selectedCustomerId, (customerId) => {
+  drawerOpen.value = false
+  loadedCustomerId.value = null
+  warehouses.value = []
+  filters.value = { ...filters.value, warehouseId: '' }
+  if (customerId) void loadWarehouses(customerId)
+})
+watch(selectedWarehouseId, () => {
+  drawerOpen.value = false
+})
+
+onMounted(() => {
+  void loadCustomers()
+  void loadLocations()
+})
+</script>
+
+<template>
+  <div class="business-page location-page">
+    <QueryToolbar
+      v-model="filters"
+      ariaLabel="库位筛选"
+      :fields="queryFields"
+      @search="applyFilters"
+    >
+      <template #actions>
+        <el-button
+          v-if="access.can('platform:location:create')"
+          type="primary"
+          :disabled="!createReady"
+          @click="openCreate"
+        ><Plus :size="16" />新增库位</el-button>
+      </template>
+    </QueryToolbar>
+
+    <el-alert v-if="customerError" type="warning" :closable="false" show-icon class="state-alert">
+      <template #title>所属企业列表加载失败</template>
+      <p>{{ customerError.message }}</p>
+      <ApiErrorMeta :details="customerError" />
+      <el-button size="small" @click="loadCustomers">重新加载所属企业</el-button>
+    </el-alert>
+    <el-alert v-if="warehouseError" type="error" :closable="false" show-icon class="state-alert">
+      <template #title>仓库列表加载失败</template>
+      <p>{{ warehouseError.message }}</p>
+      <ApiErrorMeta :details="warehouseError" />
+      <el-button size="small" @click="loadWarehouses()">重新加载仓库</el-button>
+    </el-alert>
+    <el-alert v-else-if="customerReady && warehouses.length === 0" type="info" :closable="false" show-icon title="当前所属企业暂无仓库">
+      请先在仓库管理中建立仓库，再维护库位。
+    </el-alert>
+    <el-alert v-if="loadError" type="error" :closable="false" show-icon class="state-alert">
+      <template #title>库位列表加载失败</template>
+      <p>{{ loadError.message }}</p>
+      <ApiErrorMeta :details="loadError" />
+      <el-button size="small" @click="loadLocations()">重新查询</el-button>
+    </el-alert>
+
+    <section class="surface-panel table-panel">
+      <DataTable
+        v-model:page="page"
+        v-model:page-size="pageSize"
+        :data="rows"
+        :columns="columns"
+        :loading="loading"
+        :total="total"
+        :page-sizes="[20, 50, 100, 200]"
+        row-key="id"
+        aria-label="库位列表"
+        :empty-text="emptyDescription"
+      >
+        <template #actions="{ row }">
+          <div class="table-actions location-actions">
+            <el-button link type="primary" :disabled="loading" @click="loadDetail(row as PlatformLocationResource, 'view')">
+              <Eye :size="15" />详情
+            </el-button>
+            <el-button
+              v-if="canEdit(row as PlatformLocationResource)"
+              link
+              type="primary"
+              :disabled="loading"
+              @click="loadDetail(row as PlatformLocationResource, 'edit')"
+            ><Pencil :size="15" />编辑</el-button>
+            <el-dropdown
+              v-if="canChangeStatus(row as PlatformLocationResource) || canDelete(row as PlatformLocationResource)"
+              trigger="click"
+              :disabled="loading || actionLoadingIds.has(String((row as PlatformLocationResource).id))"
+              @command="handleMoreAction(row as PlatformLocationResource, String($event))"
+            >
+              <el-button link type="primary" aria-label="更多库位操作"><MoreHorizontal :size="16" />更多</el-button>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item v-if="canChangeStatus(row as PlatformLocationResource)" command="status">
+                    <Power :size="15" />{{ (row as PlatformLocationResource).status === 'AVAILABLE' ? '停用' : '启用' }}
+                  </el-dropdown-item>
+                  <el-dropdown-item v-if="canDelete(row as PlatformLocationResource)" command="delete" divided>
+                    <Trash2 :size="15" />删除
+                  </el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
+          </div>
+        </template>
+        <template #location="{ row }">
+          <div class="location-cell">
+            <span><MapPin :size="17" /></span>
+            <div>
+              <strong>{{ (row as PlatformLocationResource).locationCode }}</strong>
+              <small>{{ (row as PlatformLocationResource).locationName || '未命名库位' }}</small>
+            </div>
+            <el-tag v-if="(row as PlatformLocationResource).sharedOverflow" size="small" type="warning">系统位</el-tag>
+          </div>
+        </template>
+        <template #zone="{ row }">
+          <div class="stacked-value"><strong>{{ (row as PlatformLocationResource).zoneName }}</strong><small>{{ (row as PlatformLocationResource).zoneCode }}</small></div>
+        </template>
+        <template #warehouse="{ row }">
+          <div class="stacked-value">
+            <strong>{{ (row as PlatformLocationResource).warehouseName || selectedWarehouse?.warehouseName || '—' }}</strong>
+            <small>{{ (row as PlatformLocationResource).warehouseCode || selectedWarehouse?.warehouseCode || '—' }}</small>
+          </div>
+        </template>
+        <template #locationType="{ row }">{{ typeLabels[(row as PlatformLocationResource).locationType] }}</template>
+        <template #maxWeightKg="{ row }">{{ formatWeight((row as PlatformLocationResource).maxWeightKg) }}</template>
+        <template #status="{ row }">
+          <el-tag :type="statusMeta[(row as PlatformLocationResource).status].type" effect="light">
+            {{ statusMeta[(row as PlatformLocationResource).status].label }}
+          </el-tag>
+        </template>
+        <template #remark="{ row }"><span class="remark-cell">{{ (row as PlatformLocationResource).remark || '—' }}</span></template>
+        <template #empty>
+          <el-empty v-if="!loading" :description="emptyDescription">
+            <el-button
+              v-if="selectedWarehouseId && !filtered && access.can('platform:location:create')"
+              type="primary"
+              @click="openCreate"
+            ><Plus :size="16" />新增第一个库位</el-button>
+          </el-empty>
+        </template>
+        <template #pagination-left="{ total: tableTotal }"><span>共 {{ tableTotal }} 个库位</span></template>
+      </DataTable>
+    </section>
+
+    <el-drawer
+      v-model="drawerOpen"
+      :title="drawerTitle"
+      size="min(620px, 100vw)"
+      class="business-drawer location-drawer"
+      :close-on-click-modal="false"
+      :close-on-press-escape="!saving"
+      :show-close="!saving"
+    >
+      <div v-loading="drawerLoading" class="drawer-content">
+        <el-alert v-if="drawerError" type="error" :closable="false" show-icon title="库位详情加载失败">
+          <p>{{ drawerError.message }}</p>
+          <ApiErrorMeta :details="drawerError" />
+        </el-alert>
+
+        <template v-else-if="drawerMode === 'view' && detail">
+          <section class="detail-identity">
+            <div class="detail-identity__icon"><MapPin :size="24" /></div>
+            <div>
+              <h3>{{ detail.location.locationCode }}</h3>
+              <p>{{ detail.location.locationName || '未命名库位' }}</p>
+            </div>
+            <el-tag :type="statusMeta[detail.location.status].type">{{ statusMeta[detail.location.status].label }}</el-tag>
+          </section>
+          <el-descriptions :column="2" border class="detail-descriptions">
+            <el-descriptions-item label="所属企业">{{ customerLabel(detail.location.tenantId) }}</el-descriptions-item>
+            <el-descriptions-item label="所属仓库">{{ detail.warehouseName }}（{{ detail.warehouseCode }}）</el-descriptions-item>
+            <el-descriptions-item label="库位编码">{{ detail.location.locationCode }}</el-descriptions-item>
+            <el-descriptions-item label="库位名称">{{ detail.location.locationName || '—' }}</el-descriptions-item>
+            <el-descriptions-item label="库区">{{ detail.location.zoneName }}（{{ detail.location.zoneCode }}）</el-descriptions-item>
+            <el-descriptions-item label="库位类型">{{ typeLabels[detail.location.locationType] }}</el-descriptions-item>
+            <el-descriptions-item label="最大承重">{{ formatWeight(detail.location.maxWeightKg) }}</el-descriptions-item>
+            <el-descriptions-item label="状态">{{ statusMeta[detail.location.status].label }}</el-descriptions-item>
+            <el-descriptions-item label="资源版本">v{{ detail.location.version }}</el-descriptions-item>
+            <el-descriptions-item label="更新时间">{{ formatDateTime(detail.location.updatedAt) }}</el-descriptions-item>
+            <el-descriptions-item label="系统共享位">{{ detail.location.sharedOverflow ? '是，仅系统自动分配' : '否' }}</el-descriptions-item>
+            <el-descriptions-item label="备注">{{ detail.location.remark || '—' }}</el-descriptions-item>
+          </el-descriptions>
+          <el-alert
+            v-if="detail.location.status === 'RESERVED' || detail.location.status === 'OCCUPIED'"
+            type="warning"
+            :closable="false"
+            show-icon
+            title="当前库位正在被业务使用，只允许查看。"
+          />
+          <el-alert
+            v-if="detail.location.sharedOverflow"
+            type="info"
+            :closable="false"
+            show-icon
+            title="A0 是系统共享溢出位，不能编辑、停用或删除。"
+          />
+        </template>
+
+        <el-form
+          v-else-if="drawerMode !== 'view'"
+          ref="formRef"
+          :model="form"
+          :rules="rules"
+          label-position="top"
+          class="drawer-form"
+          :disabled="saving"
+        >
+          <div class="editor-scope">
+            <MapPin :size="18" />
+            <div><strong>{{ detail?.warehouseName || selectedWarehouse?.warehouseName }}（{{ detail?.warehouseCode || selectedWarehouse?.warehouseCode }}）</strong><span>所属企业：{{ customerLabel(form.customerId) }} · 保存后不可跨仓移动</span></div>
+          </div>
+          <section class="form-section">
+            <h3>库位标识</h3>
+            <p class="section-description">库位编码在当前企业和仓库内唯一；编辑后不能移动到其他仓库。</p>
+            <div class="form-grid two-cols">
+              <el-form-item label="库位编码" prop="locationCode" required>
+                <el-input v-model.trim="form.locationCode" maxlength="50" placeholder="例如 A1-01" />
+              </el-form-item>
+              <el-form-item label="库位名称">
+                <el-input v-model.trim="form.locationName" maxlength="100" placeholder="例如 A1 区 01 位" />
+              </el-form-item>
+              <el-form-item label="库区编码" prop="zoneCode" required>
+                <el-input v-model.trim="form.zoneCode" maxlength="50" placeholder="例如 A" />
+              </el-form-item>
+              <el-form-item label="库区名称" prop="zoneName" required>
+                <el-input v-model.trim="form.zoneName" maxlength="100" placeholder="例如 常规区" />
+              </el-form-item>
+            </div>
+          </section>
+
+          <section class="form-section">
+            <h3>资源属性</h3>
+            <div class="form-grid two-cols">
+              <el-form-item label="库位类型" prop="locationType" required>
+                <el-select v-model="form.locationType" placeholder="请选择库位类型">
+                  <el-option label="货架位" value="SHELF" />
+                  <el-option label="托盘位" value="PALLET" />
+                  <el-option label="地堆位" value="FLOOR" />
+                  <el-option label="流利架" value="FLOW_RACK" />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="最大承重（kg）">
+                <el-input-number v-model="form.maxWeightKg" :min="0.001" :precision="3" :step="10" controls-position="right" placeholder="选填" />
+              </el-form-item>
+            </div>
+            <el-form-item v-if="drawerMode === 'create'" label="初始状态" prop="status" required>
+              <el-radio-group v-model="form.status">
+                <el-radio-button value="AVAILABLE" :disabled="selectedWarehouse?.status !== 'ACTIVE'">可用</el-radio-button>
+                <el-radio-button value="DISABLED">停用</el-radio-button>
+              </el-radio-group>
+              <p v-if="selectedWarehouse?.status !== 'ACTIVE'" class="form-help">当前仓库已停用，新库位只能以停用状态创建。</p>
+            </el-form-item>
+            <div v-else class="readonly-status">
+              <span>当前状态</span>
+              <el-tag :type="statusMeta[form.status].type">{{ statusMeta[form.status].label }}</el-tag>
+              <small>状态只能通过列表中的启停操作变更。</small>
+            </div>
+          </section>
+
+          <section class="form-section">
+            <h3>备注</h3>
+            <el-form-item label="内部说明">
+              <el-input v-model.trim="form.remark" type="textarea" :rows="4" maxlength="500" show-word-limit placeholder="请输入库位位置、使用限制或其他说明" />
+            </el-form-item>
+          </section>
+        </el-form>
+      </div>
+
+      <template #footer>
+        <div class="drawer-footer">
+          <el-button :disabled="saving" @click="drawerOpen = false">{{ drawerMode === 'view' ? '关闭' : '取消' }}</el-button>
+          <el-button v-if="drawerMode !== 'view'" type="primary" :loading="saving" @click="saveLocation">保存库位</el-button>
+        </div>
+      </template>
+    </el-drawer>
+  </div>
+</template>
+
+<style scoped>
+.state-alert p { margin: 6px 0 0; line-height: 1.55; }
+.state-alert .el-button { margin-top: 10px; }
+.location-actions { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
+.location-actions :deep(.el-button) { margin-left: 0; }
+.location-cell { display: flex; min-width: 0; align-items: center; gap: 10px; }
+.location-cell > span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 7px; background: #eef3fa; color: var(--cc-primary); }
+.location-cell > div, .stacked-value { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
+.location-cell strong, .stacked-value strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.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; }
+.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); }
+.detail-identity h3 { margin: 0; font-size: 18px; }
+.detail-identity p { margin: 4px 0 0; color: var(--cc-muted); font-size: 12px; }
+.detail-descriptions :deep(.el-descriptions__label) { width: 118px; }
+.section-description { margin: -3px 0 14px; color: var(--cc-muted); font-size: 12px; line-height: 1.55; }
+.drawer-form :deep(.el-input-number), .drawer-form :deep(.el-select) { width: 100%; }
+.editor-scope { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; padding: 12px; background: #f7f9fc; color: var(--cc-primary); }
+.editor-scope div { display: grid; min-width: 0; gap: 2px; }
+.editor-scope strong, .editor-scope span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.editor-scope span { color: var(--cc-muted); font-size: 12px; }
+.form-help { margin: 6px 0 0; color: var(--cc-muted); font-size: 12px; line-height: 1.55; }
+.readonly-status { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 12px; background: #f7f9fc; }
+.readonly-status > span { color: var(--cc-text); font-size: 13px; font-weight: 600; }
+.readonly-status small { color: var(--cc-muted); font-size: 11px; }
+
+@media (max-width: 720px) {
+  .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%; }
+  .detail-descriptions :deep(tr) { display: grid; grid-template-columns: 108px minmax(0, 1fr); }
+  .detail-descriptions :deep(.el-descriptions__cell) { display: block; width: auto; }
+}
+</style>