diff --git a/src/api/costShareListed.js b/src/api/costShareListed.js
new file mode 100644
index 0000000..01c2b16
--- /dev/null
+++ b/src/api/costShareListed.js
@@ -0,0 +1,117 @@
+import request from '@/utils/request'
+
+function str(v) {
+  return String(v ?? '').trim()
+}
+
+function unwrapListed(res) {
+  const root = res?.data ?? res
+  if (Array.isArray(root)) {
+    return { list: root, total: root.length }
+  }
+  if (root && typeof root === 'object') {
+    const list = Array.isArray(root.list)
+      ? root.list
+      : Array.isArray(root.data)
+        ? root.data
+        : Array.isArray(root.rows)
+          ? root.rows
+          : []
+    const total = Number(root.total ?? root.count ?? list.length)
+    return { list, total: Number.isFinite(total) && total >= 0 ? total : list.length }
+  }
+  return { list: [], total: 0 }
+}
+
+export function pickApiErrorMessage(err, fallback = '操作失败') {
+  return String(
+    err?.data?.message
+    || err?.data?.data?.message
+    || err?.message
+    || fallback,
+  ).trim() || fallback
+}
+
+function buildShareListedPayload(body = {}, filterKeys = []) {
+  const payload = { ...body }
+  if (payload.page != null) payload.page = Math.max(1, Number(payload.page) || 1)
+  if (payload.limit != null) payload.limit = Math.min(50, Math.max(1, Number(payload.limit) || 20))
+  for (const key of filterKeys) {
+    if (!str(payload[key])) delete payload[key]
+    else payload[key] = str(payload[key])
+  }
+  if (str(payload.start_time)) payload.start_time = str(payload.start_time)
+  else delete payload.start_time
+  if (str(payload.end_time)) payload.end_time = str(payload.end_time)
+  else delete payload.end_time
+  return payload
+}
+
+function buildAmortizePayload(body = {}) {
+  const payload = { ...body }
+  if (str(payload.start_time)) payload.start_time = str(payload.start_time)
+  else delete payload.start_time
+  if (str(payload.end_time)) payload.end_time = str(payload.end_time)
+  else delete payload.end_time
+  return payload
+}
+
+function createCostShareListed(path, filterKeys) {
+  return async function listed(body = {}) {
+    const payload = buildShareListedPayload(body, filterKeys)
+    const res = await request.post(path, payload)
+    const { list, total } = unwrapListed(res)
+    return { list: Array.isArray(list) ? list : [], total }
+  }
+}
+
+function createCostShareAmortize(path) {
+  return async function amortize(body = {}) {
+    return request.post(path, buildAmortizePayload(body))
+  }
+}
+
+const GOODS_WAREHOUSE = ['goods_code', 'warehouse_code']
+const GOODS_ONLY = ['goods_code']
+
+/** POST /api/cost/fixed_assets/share/listed */
+export const fixedAssetsShareListed = createCostShareListed(
+  '/api/cost/fixed_assets/share/listed',
+  GOODS_WAREHOUSE,
+)
+/** POST /api/cost/fixed_assets/amortize */
+export const fixedAssetsShareAmortize = createCostShareAmortize('/api/cost/fixed_assets/amortize')
+
+/** POST /api/cost/low_value_consumables/share/listed */
+export const lowValueConsumablesShareListed = createCostShareListed(
+  '/api/cost/low_value_consumables/share/listed',
+  GOODS_WAREHOUSE,
+)
+/** POST /api/cost/low_value_consumables/amortize */
+export const lowValueConsumablesShareAmortize = createCostShareAmortize(
+  '/api/cost/low_value_consumables/amortize',
+)
+
+/** POST /api/cost/purchasing_labor/share/listed */
+export const purchasingLaborShareListed = createCostShareListed(
+  '/api/cost/purchasing_labor/share/listed',
+  GOODS_ONLY,
+)
+/** POST /api/cost/purchasing_labor/amortize */
+export const purchasingLaborShareAmortize = createCostShareAmortize('/api/cost/purchasing_labor/amortize')
+
+/** POST /api/cost/sales_doc_labor/share/listed */
+export const salesDocLaborShareListed = createCostShareListed(
+  '/api/cost/sales_doc_labor/share/listed',
+  GOODS_ONLY,
+)
+/** POST /api/cost/sales_doc_labor/amortize */
+export const salesDocLaborShareAmortize = createCostShareAmortize('/api/cost/sales_doc_labor/amortize')
+
+/** POST /api/cost/warehouse_labor/share/listed */
+export const warehouseLaborShareListed = createCostShareListed(
+  '/api/cost/warehouse_labor/share/listed',
+  GOODS_WAREHOUSE,
+)
+/** POST /api/cost/warehouse_labor/amortize */
+export const warehouseLaborShareAmortize = createCostShareAmortize('/api/cost/warehouse_labor/amortize')
diff --git a/src/api/customerPrice.js b/src/api/customerPrice.js
index e4f7945..5ab255f 100644
--- a/src/api/customerPrice.js
+++ b/src/api/customerPrice.js
@@ -68,6 +68,109 @@ function parseJsonObject(raw) {
   return null
 }
 
+function parseJsonArray(raw) {
+  if (Array.isArray(raw)) return raw
+  if (typeof raw === 'string') {
+    const text = raw.trim()
+    if (!text) return null
+    try {
+      const parsed = JSON.parse(text)
+      return Array.isArray(parsed) ? parsed : null
+    } catch {
+      return null
+    }
+  }
+  return null
+}
+
+function parseCustomerPriceCustomRaw(raw) {
+  if (raw == null || raw === '') return null
+  if (typeof raw === 'object' && !Array.isArray(raw)) return raw
+  if (typeof raw === 'string') {
+    const text = raw.trim()
+    if (!text) return null
+    try {
+      const parsed = JSON.parse(text)
+      return parsed && typeof parsed === 'object' && !Array.isArray(parsed) ? parsed : null
+    } catch {
+      return null
+    }
+  }
+  return null
+}
+
+/** 特殊售价：兼容 custom 内/行级及历史字段名 */
+export function pickCustomerPriceSpecialAmount(...sources) {
+  for (const src of sources) {
+    if (!src || typeof src !== 'object') continue
+    for (const key of ['special_amount', 'special_price', 'special_sale_price']) {
+      const v = src[key]
+      if (v == null || v === '') continue
+      const n = Number(v)
+      if (Number.isFinite(n)) return n
+    }
+  }
+  return 0
+}
+
+/** modify_custom 分桶 key（bill_label + bill_tax） */
+export function customerPriceBillBucketKey({ bill_label, bill_tax, bill_code } = {}) {
+  const label = String(bill_label ?? '').trim()
+  const taxRaw = bill_tax
+  const hasTax = taxRaw != null && taxRaw !== '' && Number.isFinite(Number(taxRaw))
+  if (label && hasTax) return `${label}|${Number(taxRaw)}`
+  if (label) return label
+  return String(bill_code ?? '').trim()
+}
+
+/** Tab / 悬停展示：优先 bill_label（含税率） */
+export function formatCustomerPriceBillBucketLabel(key, meta) {
+  const label = String(meta?.bill_label ?? '').trim()
+  if (label) {
+    const tax = meta?.bill_tax
+    if (tax != null && tax !== '' && Number.isFinite(Number(tax))) {
+      return `${label}（${Number(tax)}%）`
+    }
+    return label
+  }
+  const k = String(key ?? '').trim()
+  if (!k) return '默认'
+  if (k.includes('|')) {
+    const [name, tax] = k.split('|')
+    if (name && tax) return `${name}（${tax}%）`
+    return name || k
+  }
+  return k
+}
+
+function mapExcessPerformanceArrayItem(item, idx) {
+  if (!item || typeof item !== 'object') return null
+  const bill_label = String(item.bill_label ?? '').trim()
+  const bill_tax = toPriceNum(item.bill_tax)
+  const bill_code = customerPriceBillBucketKey({ bill_label, bill_tax }) || String(idx)
+  return {
+    bill_code,
+    bill_label,
+    bill_tax,
+    rate: toPriceNum(item.rate),
+    amount: toPriceNum(item.fees ?? item.amount),
+  }
+}
+
+function mapBenefitArrayItem(item, idx) {
+  if (!item || typeof item !== 'object') return null
+  const bill_label = String(item.bill_label ?? '').trim()
+  const bill_tax = toPriceNum(item.bill_tax)
+  const bill_code = customerPriceBillBucketKey({ bill_label, bill_tax }) || String(idx)
+  return {
+    bill_code,
+    bill_label,
+    bill_tax,
+    rate: toPriceNum(item.rate),
+    fee: toPriceNum(item.fees ?? item.fee ?? item.amount),
+  }
+}
+
 /** @returns {{ rate: number, amount: number }} */
 export function createEmptyExcessPerformance() {
   return { rate: 0, amount: 0 }
@@ -84,9 +187,13 @@ function isNestedMetricEntry(value) {
     && ('rate' in value || 'amount' in value || 'fee' in value)
 }
 
-/** @returns {Array<{ bill_code: string, rate: number, amount: number }>} */
+/** 超额绩效：数组 [{ bill_label, bill_tax, rate, fees }] 或对象分桶 */
 export function parseExcessPerformanceGroups(src) {
   const row = src && typeof src === 'object' ? src : {}
+  const arr = parseJsonArray(row.excess_performance)
+  if (arr?.length) {
+    return arr.map(mapExcessPerformanceArrayItem).filter(Boolean)
+  }
   const json = parseJsonObject(row.excess_performance)
   if (json) {
     if (isNestedMetricEntry(json) && !Object.keys(json).some((k) => isNestedMetricEntry(json[k]))) {
@@ -115,9 +222,13 @@ export function parseExcessPerformanceGroups(src) {
   return []
 }
 
-/** @returns {Array<{ bill_code: string, rate: number, fee: number }>} */
+/** 好处费：数组 [{ bill_label, bill_tax, rate, fees }] 或对象分桶 */
 export function parseBenefitGroups(src) {
   const row = src && typeof src === 'object' ? src : {}
+  const arr = parseJsonArray(row.benefit)
+  if (arr?.length) {
+    return arr.map(mapBenefitArrayItem).filter(Boolean)
+  }
   const json = parseJsonObject(row.benefit)
   if (json) {
     if (isNestedMetricEntry(json) && !Object.keys(json).some((k) => isNestedMetricEntry(json[k]))) {
@@ -186,10 +297,6 @@ export function formatCustomerPriceMetricPair(group, amountKey = 'amount') {
   return `${rateText} / ${amtText}`
 }
 
-function metricGroupSignature(group, amountKey) {
-  return `${group?.rate ?? ''}|${group?.[amountKey] ?? ''}`
-}
-
 /**
  * 列表单元格：摘要 + 多种悬停
  * @param {Array<{ bill_code?: string, rate?: number }>} groups
@@ -204,24 +311,19 @@ export function summarizeCustomerPriceMetricGroups(groups, opts = {}) {
   }
 
   const fmt = (g) => formatCustomerPriceMetricPair(g, amountKey)
-  const pickBillLabel = (code) => {
-    const c = String(code || '').trim()
+  const pickBillLabel = (g) => {
+    if (g?.bill_label) return formatCustomerPriceBillBucketLabel(g.bill_code, g)
+    const c = String(g?.bill_code || '').trim()
     if (!c) return '默认'
-    return billNameMap[c] || c
+    return billNameMap[c] || formatCustomerPriceBillBucketLabel(c, g)
   }
 
   if (list.length === 1) {
     return { display: fmt(list[0]), multi: false, count: 1, tooltip: '' }
   }
 
-  const sig0 = metricGroupSignature(list[0], amountKey)
-  const allSame = list.every((g) => metricGroupSignature(g, amountKey) === sig0)
-  if (allSame) {
-    return { display: fmt(list[0]), multi: false, count: list.length, tooltip: '' }
-  }
-
   const tooltip = list
-    .map((g) => `${pickBillLabel(g.bill_code)}：${fmt(g)}`)
+    .map((g) => `${pickBillLabel(g)}：${fmt(g)}`)
     .join('\n')
 
   return {
@@ -275,13 +377,15 @@ export function createEmptyBenefitBucket() {
 }
 
 function groupsToPerformanceBuckets(groups) {
-  /** @type {Record<string, { rate: number, amount: number }>} */
+  /** @type {Record<string, { rate: number, amount: number, bill_label?: string, bill_tax?: number }>} */
   const buckets = {}
   for (const g of groups || []) {
-    const code = String(g.bill_code ?? '').trim()
+    const code = String(g.bill_code ?? customerPriceBillBucketKey(g) ?? '').trim()
     buckets[code] = {
       rate: toPriceNum(g.rate),
       amount: toPriceNum(g.amount),
+      bill_label: String(g.bill_label ?? '').trim(),
+      bill_tax: g.bill_tax == null || g.bill_tax === '' ? undefined : toPriceNum(g.bill_tax),
     }
   }
   if (!Object.keys(buckets).length) {
@@ -291,13 +395,15 @@ function groupsToPerformanceBuckets(groups) {
 }
 
 function groupsToBenefitBuckets(groups) {
-  /** @type {Record<string, { rate: number, fee: number }>} */
+  /** @type {Record<string, { rate: number, fee: number, bill_label?: string, bill_tax?: number }>} */
   const buckets = {}
   for (const g of groups || []) {
-    const code = String(g.bill_code ?? '').trim()
+    const code = String(g.bill_code ?? customerPriceBillBucketKey(g) ?? '').trim()
     buckets[code] = {
       rate: toPriceNum(g.rate),
       fee: toPriceNum(g.fee),
+      bill_label: String(g.bill_label ?? '').trim(),
+      bill_tax: g.bill_tax == null || g.bill_tax === '' ? undefined : toPriceNum(g.bill_tax),
     }
   }
   if (!Object.keys(buckets).length) {
@@ -350,6 +456,57 @@ export function serializeExcessPerformanceBuckets(buckets) {
   return out
 }
 
+function bucketBillMeta(key, bucket) {
+  const b = bucket && typeof bucket === 'object' ? bucket : {}
+  let bill_label = String(b.bill_label ?? '').trim()
+  let bill_tax = b.bill_tax == null || b.bill_tax === '' ? undefined : toPriceNum(b.bill_tax)
+  if (!bill_label) {
+    const k = String(key ?? '').trim()
+    if (k.includes('|')) {
+      const [name, tax] = k.split('|')
+      bill_label = String(name || '').trim()
+      if (tax !== '' && bill_tax == null) bill_tax = toPriceNum(tax)
+    } else {
+      bill_label = k
+    }
+  }
+  return { bill_label, bill_tax: bill_tax ?? 0 }
+}
+
+/** modify_custom：buckets → [{ bill_label, bill_tax, rate, fees }] */
+export function serializeExcessPerformanceBucketsAsCustomArray(buckets) {
+  const src = buckets && typeof buckets === 'object' ? buckets : {}
+  const namedKeys = Object.keys(src).filter((k) => String(k).trim() !== '')
+  const keys = namedKeys.length ? namedKeys : ['']
+  return keys.map((key) => {
+    const b = src[key] || createEmptyExcessPerformanceBucket()
+    const { bill_label, bill_tax } = bucketBillMeta(key, b)
+    return {
+      bill_label,
+      bill_tax,
+      rate: toPriceNum(b.rate),
+      fees: toPriceNum(b.amount),
+    }
+  })
+}
+
+/** modify_custom：buckets → [{ bill_label, bill_tax, rate, fees }] */
+export function serializeBenefitBucketsAsCustomArray(buckets) {
+  const src = buckets && typeof buckets === 'object' ? buckets : {}
+  const namedKeys = Object.keys(src).filter((k) => String(k).trim() !== '')
+  const keys = namedKeys.length ? namedKeys : ['']
+  return keys.map((key) => {
+    const b = src[key] || createEmptyBenefitBucket()
+    const { bill_label, bill_tax } = bucketBillMeta(key, b)
+    return {
+      bill_label,
+      bill_tax,
+      rate: toPriceNum(b.rate),
+      fees: toPriceNum(b.fee),
+    }
+  })
+}
+
 /** 编辑保存：buckets → 接口 JSON（有命名 key 则分桶，否则 { rate, fee }） */
 export function serializeBenefitBuckets(buckets) {
   const src = buckets && typeof buckets === 'object' ? buckets : {}
@@ -569,6 +726,27 @@ function normalizeCustomerPriceCustom(raw) {
     excess_profit_rate: toPriceNum(src.excess_profit_rate),
     excess_profit_amount: toPriceNum(src.excess_profit_amount),
     habitual_bargain_ratio: toPriceNum(src.habitual_bargain_ratio),
+    special_amount: pickCustomerPriceSpecialAmount(src),
+  }
+}
+
+/** 列表刷新后合并刚保存的 custom（listed 未回传 special_amount 时兜底） */
+export function applyCustomerPriceCustomSnapshot(row, snapshot) {
+  if (!row || typeof row !== 'object' || !snapshot || typeof snapshot !== 'object') return row
+  const customRaw = {
+    ...(row.custom && typeof row.custom === 'object' ? row.custom : {}),
+    ...snapshot,
+    special_amount: pickCustomerPriceSpecialAmount(snapshot, row.custom, row, snapshot),
+  }
+  const custom = normalizeCustomerPriceCustom(customRaw)
+  if (!custom) return row
+  return {
+    ...row,
+    has_custom: true,
+    custom,
+    custom_excess_performance_groups: custom.excess_performance_groups ?? [],
+    custom_benefit_groups: custom.benefit_groups ?? [],
+    special_amount: custom.special_amount,
   }
 }
 
@@ -583,38 +761,44 @@ export function createEmptyCustomerPriceCustomForm() {
     excess_profit_amount: 0,
     habitual_bargain_ratio: 0,
     benefit_buckets: groupsToBenefitBuckets([]),
+    special_amount: 0,
   }
 }
 
 /** 列表行 custom → 特殊定价表单；custom 为空则全 0 */
 export function customerPriceCustomFormFromRow(row) {
   const src = row && typeof row === 'object' ? row : {}
-  const custom = src.custom != null && typeof src.custom === 'object' ? src.custom : null
-  if (!custom) return createEmptyCustomerPriceCustomForm()
+  const customParsed = parseCustomerPriceCustomRaw(src.custom)
+  const custom = (src.custom != null && typeof src.custom === 'object')
+    ? src.custom
+    : customParsed
+  if (!custom && !src.has_custom) return createEmptyCustomerPriceCustomForm()
 
+  const customSrc = custom || {}
   const excess_performance_buckets = groupsToPerformanceBuckets(
-    Array.isArray(custom.excess_performance_groups) && custom.excess_performance_groups.length
-      ? custom.excess_performance_groups
-      : parseExcessPerformanceGroups(custom),
+    Array.isArray(customSrc.excess_performance_groups) && customSrc.excess_performance_groups.length
+      ? customSrc.excess_performance_groups
+      : parseExcessPerformanceGroups(customSrc),
   )
   const benefit_buckets = groupsToBenefitBuckets(
-    Array.isArray(custom.benefit_groups) && custom.benefit_groups.length
-      ? custom.benefit_groups
-      : parseBenefitGroups(custom),
+    Array.isArray(customSrc.benefit_groups) && customSrc.benefit_groups.length
+      ? customSrc.benefit_groups
+      : parseBenefitGroups(customSrc),
   )
   mergeCustomerPriceBucketKeys(excess_performance_buckets, benefit_buckets)
   return {
     ...createEmptyCustomerPriceCustomForm(),
-    sales_policy_type: custom.sales_policy_type == null ? 0 : toPriceNum(custom.sales_policy_type),
-    is_support_acceptance: custom.is_support_acceptance === true
-      || custom.is_support_acceptance === 1
-      || custom.is_support_acceptance === '1',
-    rebate_delay_base_months: toPriceNum(custom.rebate_delay_base_months),
+    sales_policy_type: customSrc.sales_policy_type == null ? 0 : toPriceNum(customSrc.sales_policy_type),
+    is_support_acceptance: customSrc.is_support_acceptance === true
+      || customSrc.is_support_acceptance === 1
+      || customSrc.is_support_acceptance === '1',
+    rebate_delay_base_months: toPriceNum(customSrc.rebate_delay_base_months),
     excess_performance_buckets,
-    excess_profit_rate: toPriceNum(custom.excess_profit_rate),
-    excess_profit_amount: toPriceNum(custom.excess_profit_amount),
-    habitual_bargain_ratio: toPriceNum(custom.habitual_bargain_ratio),
+    excess_profit_rate: toPriceNum(customSrc.excess_profit_rate),
+    excess_profit_amount: toPriceNum(customSrc.excess_profit_amount),
+    habitual_bargain_ratio: toPriceNum(customSrc.habitual_bargain_ratio),
     benefit_buckets,
+    special_amount: pickCustomerPriceSpecialAmount(src, customSrc),
   }
 }
 
@@ -626,11 +810,12 @@ export function buildCustomerPriceCustomWriteBody(form, { customer_price_code }
     sales_policy_type: toPriceNum(form?.sales_policy_type),
     is_support_acceptance: !!form?.is_support_acceptance,
     rebate_delay_base_months: toPriceNum(form?.rebate_delay_base_months),
-    excess_performance: serializeExcessPerformanceBuckets(form?.excess_performance_buckets),
+    excess_performance: serializeExcessPerformanceBucketsAsCustomArray(form?.excess_performance_buckets),
     excess_profit_rate: toPriceNum(form?.excess_profit_rate),
     excess_profit_amount: toPriceNum(form?.excess_profit_amount),
     habitual_bargain_ratio: toPriceNum(form?.habitual_bargain_ratio),
-    benefit: serializeBenefitBuckets(form?.benefit_buckets),
+    benefit: serializeBenefitBucketsAsCustomArray(form?.benefit_buckets),
+    special_amount: toPriceNum(form?.special_amount),
   }
 }
 
@@ -694,8 +879,20 @@ export function normalizeCustomerPriceRow(raw) {
   const benefit_groups = parseBenefitGroups(src)
   const excess_performance = normalizeExcessPerformanceFromRow(src)
   const benefit = normalizeBenefitFromRow(src)
-  const has_custom = src.custom != null && typeof src.custom === 'object'
-  const custom = has_custom ? normalizeCustomerPriceCustom(src.custom) : null
+  const has_custom = src.custom != null && typeof src.custom !== 'undefined'
+    && (parseCustomerPriceCustomRaw(src.custom) != null
+      || (typeof src.custom === 'object' && src.custom !== null)
+      || src.has_custom === true
+      || src.has_custom === 1
+      || src.has_custom === '1')
+  const customRaw = parseCustomerPriceCustomRaw(src.custom)
+    || (typeof src.custom === 'object' && src.custom !== null ? src.custom : null)
+  const custom = customRaw
+    ? normalizeCustomerPriceCustom({
+      ...customRaw,
+      special_amount: pickCustomerPriceSpecialAmount(src, customRaw),
+    })
+    : null
   return {
     ...src,
     customer_price_code,
@@ -718,6 +915,7 @@ export function normalizeCustomerPriceRow(raw) {
     habitual_bargain_ratio: toPriceNum(src.habitual_bargain_ratio),
     goods_categorys_list,
     goods_categorys_text,
+    special_amount: pickCustomerPriceSpecialAmount(src, customRaw, custom),
     goods_name: pickGoodsNameFromListedRow(src)
       || String(src.goods_name ?? src.goods?.name ?? src.name ?? '').trim(),
     company_name: String(
diff --git a/src/api/fixedAssetsCost.js b/src/api/fixedAssetsCost.js
new file mode 100644
index 0000000..2536bcc
--- /dev/null
+++ b/src/api/fixedAssetsCost.js
@@ -0,0 +1,4 @@
+export {
+  fixedAssetsShareListed,
+  pickApiErrorMessage,
+} from '@/api/costShareListed'
diff --git a/src/api/lowValueConsumablesCost.js b/src/api/lowValueConsumablesCost.js
new file mode 100644
index 0000000..d75613d
--- /dev/null
+++ b/src/api/lowValueConsumablesCost.js
@@ -0,0 +1,4 @@
+export {
+  lowValueConsumablesShareListed,
+  pickApiErrorMessage,
+} from '@/api/costShareListed'
diff --git a/src/api/pricingTable.js b/src/api/pricingTable.js
index a326e09..3f6f500 100644
--- a/src/api/pricingTable.js
+++ b/src/api/pricingTable.js
@@ -7,6 +7,7 @@ function str(v) {
 
 /** 默认内销（暂无出口场景） */
 export const PRICING_TRADE_DOMESTIC = 'DOMESTIC'
+export const PRICING_TRADE_EXPORT = 'EXPORT'
 
 /** 成本围栏 · 纳税身份 Tab（key 即接口 taxpayer_type 枚举） */
 export const PRICING_TAXPAYER_TABS = [
@@ -140,3 +141,64 @@ export async function pricingTableQuery(body = {}) {
 export function pickPricingTableError(err, fallback = '加载定价决策表失败') {
   return String(err?.data?.message || err?.message || fallback).trim() || fallback
 }
+
+function unwrapPricingCalculatePayload(res) {
+  const envelope = res?.data ?? res
+  if (envelope && typeof envelope === 'object' && !Array.isArray(envelope)) {
+    if (envelope.debug != null || envelope.data != null) return envelope.data ?? envelope
+  }
+  return envelope
+}
+
+/** 算价响应 → debug 文本（供弹窗展示） */
+export function formatPricingCalculateDebug(res) {
+  const payload = unwrapPricingCalculatePayload(res)
+  const debug = payload?.debug ?? res?.data?.debug ?? res?.debug
+  if (debug == null || debug === '') {
+    const fallback = payload && typeof payload === 'object' ? payload : (res?.data ?? res)
+    try {
+      return `(接口未返回 debug)\n\n${JSON.stringify(fallback, null, 2)}`
+    } catch {
+      return '(接口未返回 debug)'
+    }
+  }
+  if (typeof debug === 'string') return debug
+  try {
+    return JSON.stringify(debug, null, 2)
+  } catch {
+    return String(debug)
+  }
+}
+
+/** @deprecated 请用 formatPricingCalculateDebug */
+export const pickPricingCalculateDebug = formatPricingCalculateDebug
+
+/**
+ * POST /api/pricing/calculate
+ * 按商品（可选客户价格本 / 供货目录）批量展开维度并计算最优含税售价
+ */
+export async function pricingCalculate(body = {}) {
+  const taxpayer_type = str(body.taxpayer_type).toUpperCase() || PRICING_TAXPAYER_DEFAULT
+  const trade_type = str(body.trade_type) || PRICING_TRADE_DOMESTIC
+  const goods_code = str(body.goods_code)
+  if (!goods_code) throw new Error('缺少商品编码')
+  if (!PRICING_TAXPAYER_KEYS.has(taxpayer_type)) {
+    throw new Error(`纳税人身份无效：${taxpayer_type}`)
+  }
+
+  const payload = {
+    taxpayer_type,
+    trade_type,
+    goods_code,
+  }
+  const supply_collection_code = str(body.supply_collection_code)
+  const customer_price_code = str(body.customer_price_code)
+  if (supply_collection_code) payload.supply_collection_code = supply_collection_code
+  if (customer_price_code) payload.customer_price_code = customer_price_code
+
+  return request.post('/api/pricing/calculate', payload)
+}
+
+export function pickPricingCalculateError(err, fallback = '算价失败') {
+  return String(err?.data?.message || err?.message || fallback).trim() || fallback
+}
diff --git a/src/api/supplyCollectionGoods.js b/src/api/supplyCollectionGoods.js
index e9997d7..363df6b 100755
--- a/src/api/supplyCollectionGoods.js
+++ b/src/api/supplyCollectionGoods.js
@@ -296,7 +296,7 @@ export function extraFeeLogActionText(log) {
   const op = extraFeeLogOperator(log)
   const parts = []
   if (clock) parts.push(clock)
-  parts.push(`${tax} 追加 ${amt}`)
+  parts.push(`${tax} 修改为 ${amt}`)
   if (op) parts.push(op)
   return parts.join(' · ')
 }
@@ -377,9 +377,53 @@ export function mergeExtraFeesPatch(current, patch) {
 }
 
 /**
- * @param {Record<string, string>} addDraft
+ * 对比额外费用字段是否变化（空与 0 视为等价）
+ * @param {unknown} a
+ * @param {unknown} b
+ */
+function extraFeeAmountEqual(a, b) {
+  const sa = String(a ?? '').trim()
+  const sb = String(b ?? '').trim()
+  if (sa === '' && sb === '') return true
+  const na = sa === '' ? 0 : Number(sa)
+  const nb = sb === '' ? 0 : Number(sb)
+  if (Number.isNaN(na) || Number.isNaN(nb)) return sa === sb
+  return na === nb
+}
+
+/**
+ * 组装 extra_fees/set 请求体：amount 为修改后的目标值（非增量），仅包含相对 baseline 有变化的票种
+ * @param {Record<string, string>} editDraft
+ * @param {Record<string, string>} baseline
  * @param {string} [remark]
  */
+export function buildExtraFeesModifyList(editDraft, baseline, remark = '') {
+  const edit = editDraft && typeof editDraft === 'object' && !Array.isArray(editDraft)
+    ? editDraft
+    : {}
+  const base = baseline && typeof baseline === 'object' && !Array.isArray(baseline)
+    ? baseline
+    : {}
+  const rm = String(remark || '').trim()
+  const list = []
+  for (const f of COLLECTION_GOODS_EXTRA_FEE_FIELDS) {
+    const nextStr = String(edit[f.key] ?? '').trim()
+    const prevStr = String(base[f.key] ?? '').trim()
+    if (extraFeeAmountEqual(nextStr, prevStr)) continue
+    let amount = 0
+    if (nextStr !== '') {
+      const n = Number(nextStr)
+      if (Number.isNaN(n)) continue
+      amount = n
+    }
+    const item = { bill_tax: f.bill_tax, amount }
+    if (rm) item.remark = rm
+    list.push(item)
+  }
+  return list
+}
+
+/** @deprecated 累加模式已废弃，使用 buildExtraFeesModifyList */
 export function buildExtraFeesAddList(addDraft, remark = '') {
   const src = addDraft && typeof addDraft === 'object' && !Array.isArray(addDraft)
     ? addDraft
@@ -432,7 +476,7 @@ function parseExtraFeesLogPayload(data) {
 }
 
 /** @param {unknown} data */
-export function extractExtraFeesFromAddResponse(data) {
+export function extractExtraFeesFromSetResponse(data) {
   const coerced = coerceExtraFeesSource(data)
   if (!coerced || typeof coerced !== 'object') return null
   const row = coerced
@@ -454,11 +498,12 @@ export function extractExtraFeesFromAddResponse(data) {
 }
 
 /**
- * POST /api/supply/collection/goods/extra_fees/add
+ * POST /api/supply/collection/goods/extra_fees/set
+ * amount 为修改后的目标值；后端落库并记修改日志，返回更新后的 extra_fees
  * @param {{ supply_collection_code: string, goods_code: string, list: object[] }} body
  */
-export async function supplyCollectionGoodsExtraFeesAdd(body) {
-  const res = await request.post('/api/supply/collection/goods/extra_fees/add', body)
+export async function supplyCollectionGoodsExtraFeesSet(body) {
+  const res = await request.post('/api/supply/collection/goods/extra_fees/set', body)
   return unwrapResponseData(res)
 }
 
diff --git a/src/api/warehouseRdcDeploy.js b/src/api/warehouseRdcDeploy.js
index bcef1ff..e154bfd 100755
--- a/src/api/warehouseRdcDeploy.js
+++ b/src/api/warehouseRdcDeploy.js
@@ -15,10 +15,11 @@ function unwrapListed(res) {
   return []
 }
 
-/** 接口 form 侧 RDC 编码（读响应兼容旧字段） */
-export function pickFormWarehouseCode(raw) {
+/** 所在仓 RDC 编码（读响应兼容 form / 旧字段） */
+export function pickSelfWarehouseCode(raw) {
   return String(
-    raw?.form_warehouse_code
+    raw?.self_warehouse_code
+    ?? raw?.form_warehouse_code
     ?? raw?.source_warehouse_rdc_code
     ?? raw?.warehouse_rdc_code
     ?? raw?.rdc_code
@@ -26,10 +27,11 @@ export function pickFormWarehouseCode(raw) {
   ).trim()
 }
 
-/** 接口 to 侧 RDC 编码（读响应兼容旧字段；勿随意丢弃仅含 warehouse_code 的行） */
-export function pickToWarehouseCode(raw) {
+/** 源采购仓 RDC 编码（读响应兼容 to / 旧字段） */
+export function pickSourceWarehouseCode(raw) {
   return String(
-    raw?.to_warehouse_code
+    raw?.source_warehouse_code
+    ?? raw?.to_warehouse_code
     ?? raw?.deploy_warehouse_rdc_code
     ?? raw?.warehouse_rdc_code
     ?? raw?.rdc_code
@@ -38,8 +40,11 @@ export function pickToWarehouseCode(raw) {
   ).trim()
 }
 
-export function pickFormWarehouseCodes(body) {
-  const arr = body?.form_warehouse_codes ?? body?.source_warehouse_rdc_codes ?? []
+export function pickSelfWarehouseCodes(body) {
+  const arr = body?.self_warehouse_codes
+    ?? body?.form_warehouse_codes
+    ?? body?.source_warehouse_rdc_codes
+    ?? []
   return [...new Set(
     (Array.isArray(arr) ? arr : [])
       .map((c) => String(c ?? '').trim())
@@ -47,35 +52,47 @@ export function pickFormWarehouseCodes(body) {
   )]
 }
 
+/** @deprecated 使用 pickSelfWarehouseCode */
+export const pickFormWarehouseCode = pickSelfWarehouseCode
+
+/** @deprecated 使用 pickSourceWarehouseCode */
+export const pickToWarehouseCode = pickSourceWarehouseCode
+
+/** @deprecated 使用 pickSelfWarehouseCodes */
+export const pickFormWarehouseCodes = pickSelfWarehouseCodes
+
 export function normalizeRdcDeployRow(raw) {
   if (!raw || typeof raw !== 'object') return null
   const deploy_warehouse_code = String(
-    raw.deploy_warehouse_code ?? raw.warehouse_code ?? pickToWarehouseCode(raw) ?? '',
+    raw.deploy_warehouse_code ?? raw.warehouse_code ?? pickSourceWarehouseCode(raw) ?? '',
   ).trim()
-  const to_warehouse_code = pickToWarehouseCode(raw) || deploy_warehouse_code
-  if (!to_warehouse_code && !deploy_warehouse_code) return null
+  const source_warehouse_code = pickSourceWarehouseCode(raw) || deploy_warehouse_code
+  if (!source_warehouse_code && !deploy_warehouse_code) return null
   const deploy_warehouse_name = String(
     raw.deploy_warehouse_name
     ?? raw.to_warehouse_name
+    ?? raw.source_warehouse_name
     ?? raw.warehouse_name
     ?? raw.name
     ?? '',
   ).trim()
   const deploy_rdc_name = String(
     raw.to_warehouse_name
+    ?? raw.source_warehouse_name
     ?? raw.deploy_warehouse_rdc_name
     ?? raw.deploy_rdc_name
     ?? raw.rdc_name
     ?? raw.warehouse_rdc_name
     ?? '',
   ).trim()
-  const displayCode = to_warehouse_code || deploy_warehouse_code
+  const displayCode = source_warehouse_code || deploy_warehouse_code
   const displayName = deploy_rdc_name || deploy_warehouse_name
   const label = displayName && displayCode && displayName !== displayCode
     ? `${displayName}（${displayCode}）`
     : (displayName || displayCode)
   return {
     deploy_warehouse_code: deploy_warehouse_code || displayCode,
+    source_warehouse_code: displayCode,
     to_warehouse_code: displayCode,
     deploy_warehouse_name: deploy_warehouse_name || displayName,
     deploy_rdc_name: deploy_rdc_name || displayName,
@@ -84,7 +101,7 @@ export function normalizeRdcDeployRow(raw) {
   }
 }
 
-/** 可调配仓列表展示：优先 label / to 侧名称+编码 */
+/** 源采购仓列表展示：优先 label / 名称+编码 */
 export function formatRdcDeployRowLabel(row) {
   if (!row || typeof row !== 'object') return '—'
   const label = String(row.label ?? '').trim()
@@ -92,15 +109,19 @@ export function formatRdcDeployRowLabel(row) {
   const name = String(
     row.deploy_rdc_name
     ?? row.to_warehouse_name
+    ?? row.source_warehouse_name
     ?? row.row?.to_warehouse_name
+    ?? row.row?.source_warehouse_name
     ?? row.deploy_warehouse_name
     ?? row.warehouse_name
     ?? '',
   ).trim()
   const code = String(
-    row.to_warehouse_code
+    row.source_warehouse_code
+    ?? row.to_warehouse_code
     ?? row.deploy_warehouse_code
     ?? row.warehouse_code
+    ?? row.row?.source_warehouse_code
     ?? row.row?.to_warehouse_code
     ?? '',
   ).trim()
@@ -112,7 +133,7 @@ export function buildRdcDeploySourceCode(goodsRow, warehouseCode = '') {
   return pickRdcCodeFromGoodsRow(goodsRow, warehouseCode)
 }
 
-/** deploy 按物料定位：warehouse_code + goods_code */
+/** deploy/set 物料定位：warehouse_code + goods_code */
 export function buildRdcDeployGoodsLocateItem(raw, warehouseCode = '') {
   const warehouse_code = String(
     raw?.warehouse_code ?? buildRdcDeploySourceCode(raw, warehouseCode) ?? warehouseCode ?? '',
@@ -124,23 +145,23 @@ export function buildRdcDeployGoodsLocateItem(raw, warehouseCode = '') {
 
 /** deploy 查询 / link / unlink 共用查询体 */
 export function buildRdcDeployQueryBody(goodsRow, warehouseCode = '') {
-  const form_warehouse_code = buildRdcDeploySourceCode(goodsRow, warehouseCode)
+  const self_warehouse_code = buildRdcDeploySourceCode(goodsRow, warehouseCode)
   const goods_code = String(goodsRow?.goods_code ?? '').trim()
-  if (!form_warehouse_code || !goods_code) return null
-  return { form_warehouse_code, goods_code }
+  if (!self_warehouse_code || !goods_code) return null
+  return { self_warehouse_code, goods_code }
 }
 
 function normalizeDeployToListItem(raw) {
-  const to_warehouse_code = pickToWarehouseCode(raw)
-  if (!to_warehouse_code) return null
-  return { to_warehouse_code }
+  const source_warehouse_code = pickSourceWarehouseCode(raw)
+  if (!source_warehouse_code) return null
+  return { source_warehouse_code }
 }
 
 export function buildRdcDeployLinkBody(goodsRow, warehouseCode, deployTarget) {
   const base = buildRdcDeployQueryBody(goodsRow, warehouseCode)
-  const to_warehouse_code = pickToWarehouseCode(deployTarget)
-  if (!base || !to_warehouse_code) return null
-  return { ...base, to_warehouse_code }
+  const source_warehouse_code = pickSourceWarehouseCode(deployTarget)
+  if (!base || !source_warehouse_code) return null
+  return { ...base, source_warehouse_code }
 }
 
 export function buildRdcDeployUnlinkBody(goodsRow, warehouseCode, deployTarget) {
@@ -157,22 +178,22 @@ export function buildRdcDeploySetBody(goodsRow, warehouseCode, deployTargets) {
   return { list: [material], to_list }
 }
 
-/** POST /api/warehouse/rdc/deploy/candidates — 检查可调配仓候选 */
+/** POST /api/warehouse/rdc/deploy/candidates — 源采购仓候选项 */
 export function warehouseRdcDeployCandidates(body) {
-  const form_warehouse_codes = pickFormWarehouseCodes(body)
-  if (!form_warehouse_codes.length) {
-    return Promise.reject(new Error('deploy/candidates 缺少 form_warehouse_codes'))
+  const self_warehouse_codes = pickSelfWarehouseCodes(body)
+  if (!self_warehouse_codes.length) {
+    return Promise.reject(new Error('deploy/candidates 缺少 self_warehouse_codes'))
   }
-  const payload = { form_warehouse_codes }
+  const payload = { self_warehouse_codes }
   return request.post('/api/warehouse/rdc/deploy/candidates', payload).then((res) => res)
 }
 
-/** POST /api/warehouse/rdc/deploy — 可调配仓列表 */
+/** POST /api/warehouse/rdc/deploy — 源采购仓列表 */
 export async function warehouseRdcDeployListed(body) {
-  const form_warehouse_code = pickFormWarehouseCode(body)
+  const self_warehouse_code = pickSelfWarehouseCode(body)
   const goods_code = String(body?.goods_code ?? '').trim()
-  if (!form_warehouse_code || !goods_code) return []
-  const payload = { form_warehouse_code, goods_code }
+  if (!self_warehouse_code || !goods_code) return []
+  const payload = { self_warehouse_code, goods_code }
   const res = await request.post('/api/warehouse/rdc/deploy', payload)
   return unwrapListed(res).map(normalizeRdcDeployRow).filter(Boolean)
 }
@@ -181,12 +202,12 @@ export function rowToRdcDeploySetItem(row) {
   return normalizeDeployToListItem(row)
 }
 
-/** 合并已有可调配仓 + 新勾选（deploy/set 为按物料整表替换 to_list） */
+/** 合并已有源采购仓 + 新勾选（deploy/set 为按物料整表替换 to_list） */
 export function mergeRdcDeploySetList(existingRows, addedList) {
   const map = new Map()
   const push = (raw) => {
     const item = normalizeDeployToListItem(raw)
-    if (item) map.set(item.to_warehouse_code, item)
+    if (item) map.set(item.source_warehouse_code, item)
   }
   for (const row of existingRows || []) push(row)
   for (const item of addedList || []) push(item)
@@ -197,13 +218,13 @@ export function mergeRdcDeploySetList(existingRows, addedList) {
 export function subtractRdcDeploySetList(existingRows, removeRows) {
   const removeKeys = new Set(
     (removeRows || [])
-      .map((row) => pickToWarehouseCode(row))
+      .map((row) => pickSourceWarehouseCode(row))
       .filter(Boolean),
   )
   return (existingRows || [])
     .map(normalizeDeployToListItem)
     .filter(Boolean)
-    .filter((item) => !removeKeys.has(item.to_warehouse_code))
+    .filter((item) => !removeKeys.has(item.source_warehouse_code))
 }
 
 /**
@@ -230,7 +251,7 @@ export async function buildRdcDeploySetPayloadForMaterial(
 }
 
 /**
- * 批量关联可调配仓：按物料分别 deploy/set（避免不同物料互相覆盖）。
+ * 批量关联源采购仓：按物料分别 deploy/set（避免不同物料互相覆盖）。
  */
 export async function persistRdcDeploySetForRows(rows, anchorToDeployMap, warehouseCode, pickAnchorKey) {
   const pickKey = typeof pickAnchorKey === 'function' ? pickAnchorKey : () => ''
@@ -263,29 +284,29 @@ export function warehouseRdcDeploySet(body) {
 }
 
 function serializeDeployMutateBody(body) {
-  const form_warehouse_code = pickFormWarehouseCode(body)
-  const to_warehouse_code = pickToWarehouseCode(body)
+  const self_warehouse_code = pickSelfWarehouseCode(body)
+  const source_warehouse_code = pickSourceWarehouseCode(body)
   const goods_code = String(body?.goods_code ?? '').trim()
-  if (!form_warehouse_code || !to_warehouse_code || !goods_code) {
+  if (!self_warehouse_code || !source_warehouse_code || !goods_code) {
     return null
   }
-  return { form_warehouse_code, to_warehouse_code, goods_code }
+  return { self_warehouse_code, source_warehouse_code, goods_code }
 }
 
-/** POST /api/warehouse/rdc/deploy/link — 关联可调配仓 */
+/** POST /api/warehouse/rdc/deploy/link — 新增源采购仓关联 */
 export function warehouseRdcDeployLink(body) {
   const payload = serializeDeployMutateBody(body)
   if (!payload) {
-    return Promise.reject(new Error('deploy/link 缺少 form_warehouse_code / to_warehouse_code / goods_code'))
+    return Promise.reject(new Error('deploy/link 缺少 self_warehouse_code / source_warehouse_code / goods_code'))
   }
   return request.post('/api/warehouse/rdc/deploy/link', payload).then((res) => res)
 }
 
-/** POST /api/warehouse/rdc/deploy/unlink — 取关可调配仓 */
+/** POST /api/warehouse/rdc/deploy/unlink — 移除源采购仓关联 */
 export function warehouseRdcDeployUnlink(body) {
   const payload = serializeDeployMutateBody(body)
   if (!payload) {
-    return Promise.reject(new Error('deploy/unlink 缺少 form_warehouse_code / to_warehouse_code / goods_code'))
+    return Promise.reject(new Error('deploy/unlink 缺少 self_warehouse_code / source_warehouse_code / goods_code'))
   }
   return request.post('/api/warehouse/rdc/deploy/unlink', payload).then((res) => res)
 }
diff --git a/src/components/warehouse/WopsPageHeader.vue b/src/components/warehouse/WopsPageHeader.vue
new file mode 100644
index 0000000..b9a9e40
--- /dev/null
+++ b/src/components/warehouse/WopsPageHeader.vue
@@ -0,0 +1,53 @@
+<template>
+  <header class="wops-page-header">
+    <div class="wops-page-header-row">
+      <h2 class="wops-page-title">{{ title }}</h2>
+      <div
+        class="wops-page-header-toggle"
+        :class="{ 'is-empty': !hasToggle }"
+      >
+        <slot name="toggle" />
+      </div>
+      <span class="wops-page-total">共 {{ count }} 条</span>
+      <div
+        class="wops-page-header-bills"
+        :class="{ 'is-empty': !hasBills && !billSkeleton }"
+      >
+        <slot name="bills" />
+        <template v-if="billSkeleton">
+          <span
+            v-for="i in BILL_SKELETON_COUNT"
+            :key="`bill-sk-${i}`"
+            class="wops-bill-tab wops-bill-tab--skeleton"
+            aria-hidden="true"
+          />
+        </template>
+      </div>
+    </div>
+    <div
+      class="wops-page-header-actions"
+      :class="{ 'is-empty': !hasActions }"
+    >
+      <slot name="actions" />
+    </div>
+  </header>
+</template>
+
+<script setup>
+import { computed, useSlots } from 'vue'
+
+defineProps({
+  title: { type: String, required: true },
+  count: { type: Number, default: 0 },
+  /** 首次拉票据、列表仍空时显示骨架 Tab，避免高度跳动 */
+  billSkeleton: { type: Boolean, default: false },
+})
+
+const slots = useSlots()
+const hasToggle = computed(() => Boolean(slots.toggle))
+const hasBills = computed(() => Boolean(slots.bills))
+const hasActions = computed(() => Boolean(slots.actions))
+
+/** 加载中骨架 Tab 数量，与实际票据区视觉高度对齐，避免加载完成后撑高 */
+const BILL_SKELETON_COUNT = 4
+</script>
diff --git a/src/config/buildId.json b/src/config/buildId.json
index cadd8b8..1ade934 100755
--- a/src/config/buildId.json
+++ b/src/config/buildId.json
@@ -1,4 +1,4 @@
 {
-  "buildId": "20260707001",
-  "generatedAt": "2026-07-06T16:11:57.042Z"
+  "buildId": "20260707009",
+  "generatedAt": "2026-07-07T14:48:25.301Z"
 }
\ No newline at end of file
diff --git a/src/data/appChangelog.js b/src/data/appChangelog.js
index 574766f..6150a4b 100755
--- a/src/data/appChangelog.js
+++ b/src/data/appChangelog.js
@@ -42,11 +42,111 @@
  * @typedef {{ date: string, items: ChangelogItem[] }} ChangelogDay
  */
 
-/** 应用版本（如 0.7.029 → 侧栏 v0.7，弹窗 v0.7.029） */
-export const APP_VERSION = '0.7.029'
+/** 应用版本（如 0.7.032 → 侧栏 v0.7，弹窗 v0.7.032） */
+export const APP_VERSION = '0.7.032'
 
 /** @type {ChangelogDay[]} */
 export const APP_CHANGELOG = [
+  {
+    date: '2026-07-07',
+    items: [
+      {
+        icon: 'mdi:clipboard-list-outline',
+        kind: 'change',
+        text: '「统筹 → 录入商品 → 额外费用」弹窗布局收敛：左侧收窄为票种/当前值表格，备注移至表格右侧并撑满同高区域；右侧「修改日志」与左侧底边对齐，仅日志列表区内滚动，不再撑高整窗。',
+      },
+      {
+        icon: 'mdi:clipboard-list-outline',
+        kind: 'fix',
+        text: '「录入商品 → 额外费用」备注框：字数统计改为底部独立行，不与正文重叠；聚焦描边改外层容器绘制，出现滚动条时四周边框（含右侧蓝框）正常显示。',
+      },
+      {
+        icon: 'mdi:notebook-outline',
+        kind: 'add',
+        text: '「客户管理 → 客户价格本」顶栏新增「批量计算」，对接 `POST /api/pricing/calculate`（按 `customer_price_code`）；移除行内「计算」，算价 debug 弹窗宽 1200px、仅弹窗内滚动。',
+      },
+      {
+        icon: 'mdi:notebook-outline',
+        kind: 'change',
+        text: '「客户价格本」列表：状态列收窄为「启用/停用」；超额绩效/好处费列宽微调；操作列特殊定价/编辑/删除三按钮均分对齐，表头与状态/特价列底对齐居中。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'change',
+        text: '「仓库管理 → 源采购 RDC」deploy 五接口请求字段对齐后端：`form_warehouse_code(s)` → `self_warehouse_code(s)`，目标仓 `to_warehouse_code` → `source_warehouse_code`（`set` 的 `to_list[]` 同步）；读响应仍兼容旧字段名。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'fix',
+        text: '「源采购 RDC」移除关联改调 `POST /api/warehouse/rdc/deploy/unlink`，请求体补齐 `self_warehouse_code` + `goods_code` + `source_warehouse_code`；不再用 `deploy/set` 全量替换实现删除。',
+      },
+      {
+        icon: 'mdi:clipboard-list-outline',
+        kind: 'change',
+        text: '「统筹 → 录入商品 → 额外费用」改为当前值直接修改保存；接口由 `extra_fees/add` 更名为 `extra_fees/set`（`amount` 为目标值）；去掉「本次追加」列，右侧日志改称「修改日志」。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'change',
+        text: '「仓库管理 → 成本分摊预估」五页（固定资产/低值易耗/采购·销售·仓储用人成本）去掉「重新跑批」按钮；进页与重置仍先跑批，「查询」与翻页仅拉 listed。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'fix',
+        text: '「仓库管理」运维页与分摊页顶栏、筛选区布局统一：`WopsPageHeader` 固定高度（含视图切换/票据 Tab/操作按钮各槽位），无内容时不占位、左对齐；筛选区统一为 `.wops-page-filters` 灰底盒子与最小行高。业务页（如调货）与对应分摊页切换时列表起点不再上下跳动。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'add',
+        text: '「仓库管理 → 固定资产分摊预估」（`/warehouse/fixed-assets-share`）：对接 `POST /api/cost/fixed_assets/amortize` + `share/listed`；筛选 `goods_code`、`warehouse_code`；进页/查询先跑批再拉列表，翻页仅查 listed；列按接口返回 key 动态展示。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'add',
+        text: '「仓库管理 → 低值易耗品分摊预估」（`/warehouse/low-value-consumables-share`）：对接 `POST /api/cost/low_value_consumables/amortize` + `share/listed`；筛选 `goods_code`、`warehouse_code`；跑批与列表交互同固定资产分摊预估。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'add',
+        text: '「仓库管理 → 采购用人成本分摊预估」（`/warehouse/purchasing-labor-share`）：对接 `POST /api/cost/purchasing_labor/amortize` + `share/listed`；按 `goods_code` 查询；统计周期内按采购订单行数占比分摊采购部门工资。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'add',
+        text: '「仓库管理 → 销售用人成本分摊预估」（`/warehouse/sales-doc-labor-share`）：对接 `POST /api/cost/sales_doc_labor/amortize` + `share/listed`；按 `goods_code` 查询；统计周期内按发货单行数占比分摊销售部门工资。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'add',
+        text: '「仓库管理 → 仓储用人成本分摊预估」（`/warehouse/warehouse-labor-share`）：对接 `POST /api/cost/warehouse_labor/amortize` + `share/listed`；筛选 `goods_code`、`warehouse_code`；统计周期内按仓库加权难度系数分摊仓储人员成本。',
+      },
+      {
+        icon: 'mdi:warehouse',
+        kind: 'fix',
+        text: '「仓库管理」运维/分摊列表「暂无数据」「暂无费用票据」等空态字号接入 `--wh-fs-delta`（1920 基准，2560 +2px，3840 +4px）；主内容区统一定义变量，`.wops-empty` 与费用票据空提示改为动态字号。',
+      },
+      {
+        icon: 'mdi:notebook-outline',
+        kind: 'fix',
+        text: '「客户管理 → 客户价格本」列表超额绩效/好处费多组展示：有几条就显示「N种」+ 悬停明细（首条摘要不变），不再因各组数值相同而合并为单行。',
+      },
+      {
+        icon: 'mdi:notebook-outline',
+        kind: 'change',
+        text: '「客户价格本」`excess_performance` / `benefit` 兼容数组 `[{ bill_label, bill_tax, rate, fees }]` 与对象分桶；Tab / 列表悬停优先 `bill_label`（含税率）展示。',
+      },
+      {
+        icon: 'mdi:notebook-outline',
+        kind: 'change',
+        text: '「客户价格本 → 特殊定价 → 自定义」`modify_custom` 超额绩效/好处费改数组提交；底部「特殊售价」可编辑并保存 `special_amount`；保存后 listed 未回传时用快照合并列表展示。',
+      },
+      {
+        icon: 'mdi:notebook-outline',
+        kind: 'change',
+        text: '「客户价格本」批量编辑弹窗：是否启用/支持承兑/是否特价三开关独立一行；编辑/批量票据 Tab 票种名 + 橙色税率；定价参数数字框收窄、标签不换行。',
+      },
+    ],
+  },
   {
     date: '2026-07-06',
     items: [
diff --git a/src/layouts/index.vue b/src/layouts/index.vue
index 9cf2f55..2fc39e5 100755
--- a/src/layouts/index.vue
+++ b/src/layouts/index.vue
@@ -1825,6 +1825,7 @@ const handleModifyPassword = async () => {
   flex-direction: column;
   overflow-y: auto;  /* 允许垂直滚动 */
   overflow-x: hidden;  /* 隐藏横向滚动条 */
+  --wh-fs-delta: clamp(0px, calc((100vw - 1920px) * 0.003125), 4px);
 }
 
 /* 懒加载路由 chunk 未就绪时，避免主区域完全空白 */
diff --git a/src/router/index.js b/src/router/index.js
index ff8b65c..d023d85 100755
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -415,6 +415,16 @@ export const asyncRoutes = [
           powerKey: 'warehouse',
         },
       },
+      {
+        path: 'deploy-share',
+        name: 'WarehouseDeployShare',
+        component: () => import('@/views/base/DeployShareListed.vue'),
+        meta: {
+          title: '调货分摊',
+          icon: 'mdi:swap-horizontal',
+          powerKey: 'warehouse',
+        },
+      },
       {
         path: 'alloc',
         name: 'WarehouseAlloc',
@@ -425,6 +435,16 @@ export const asyncRoutes = [
           powerKey: 'warehouse',
         },
       },
+      {
+        path: 'alloc-share',
+        name: 'WarehouseAllocShare',
+        component: () => import('@/views/base/AllocShareListed.vue'),
+        meta: {
+          title: '配货分摊',
+          icon: 'mdi:truck-delivery-outline',
+          powerKey: 'warehouse',
+        },
+      },
       {
         path: 'freight',
         name: 'WarehouseFreight',
@@ -435,6 +455,16 @@ export const asyncRoutes = [
           powerKey: 'warehouse',
         },
       },
+      {
+        path: 'freight-share',
+        name: 'WarehouseFreightShare',
+        component: () => import('@/views/base/FreightShareListed.vue'),
+        meta: {
+          title: '运费分摊',
+          icon: 'mdi:truck-delivery-outline',
+          powerKey: 'warehouse',
+        },
+      },
       {
         path: 'waste',
         name: 'WarehouseWaste',
@@ -445,6 +475,16 @@ export const asyncRoutes = [
           powerKey: 'warehouse',
         },
       },
+      {
+        path: 'waste-share',
+        name: 'WarehouseWasteShare',
+        component: () => import('@/views/base/WasteShareListed.vue'),
+        meta: {
+          title: '损耗分摊',
+          icon: 'mdi:package-variant-closed-minus',
+          powerKey: 'warehouse',
+        },
+      },
       {
         path: 'purchase',
         name: 'WarehousePurchase',
@@ -455,6 +495,16 @@ export const asyncRoutes = [
           powerKey: 'warehouse',
         },
       },
+      {
+        path: 'purchasing-labor-share',
+        name: 'WarehousePurchasingLaborShare',
+        component: () => import('@/views/base/PurchasingLaborShareListed.vue'),
+        meta: {
+          title: '采购用人成本分摊',
+          icon: 'mdi:account-cash-outline',
+          powerKey: 'warehouse',
+        },
+      },
       {
         path: 'pr-cost',
         name: 'WarehousePrCost',
@@ -465,53 +515,53 @@ export const asyncRoutes = [
           powerKey: 'warehouse',
         },
       },
-      {
-        path: 'freight-share',
-        name: 'WarehouseFreightShare',
-        component: () => import('@/views/base/FreightShareListed.vue'),
-        meta: {
-          title: '运费分摊预估',
-          icon: 'mdi:truck-delivery-outline',
-          powerKey: 'warehouse',
-        },
-      },
       {
         path: 'pr-cost-share',
         name: 'WarehousePrCostShare',
         component: () => import('@/views/base/PrCostShareListed.vue'),
         meta: {
-          title: '公关分摊预估',
+          title: '公关分摊',
           icon: 'mdi:currency-usd',
           powerKey: 'warehouse',
         },
       },
       {
-        path: 'alloc-share',
-        name: 'WarehouseAllocShare',
-        component: () => import('@/views/base/AllocShareListed.vue'),
+        path: 'sales-doc-labor-share',
+        name: 'WarehouseSalesDocLaborShare',
+        component: () => import('@/views/base/SalesDocLaborShareListed.vue'),
         meta: {
-          title: '配货分摊预估',
-          icon: 'mdi:truck-delivery-outline',
+          title: '销售用人成本分摊',
+          icon: 'mdi:file-document-edit-outline',
           powerKey: 'warehouse',
         },
       },
       {
-        path: 'deploy-share',
-        name: 'WarehouseDeployShare',
-        component: () => import('@/views/base/DeployShareListed.vue'),
+        path: 'warehouse-labor-share',
+        name: 'WarehouseWarehouseLaborShare',
+        component: () => import('@/views/base/WarehouseLaborShareListed.vue'),
         meta: {
-          title: '调货分摊预估',
-          icon: 'mdi:swap-horizontal',
+          title: '仓储用人成本分摊',
+          icon: 'mdi:account-hard-hat-outline',
           powerKey: 'warehouse',
         },
       },
       {
-        path: 'waste-share',
-        name: 'WarehouseWasteShare',
-        component: () => import('@/views/base/WasteShareListed.vue'),
+        path: 'fixed-assets-share',
+        name: 'WarehouseFixedAssetsShare',
+        component: () => import('@/views/base/FixedAssetsShareListed.vue'),
         meta: {
-          title: '损耗分摊预估',
-          icon: 'mdi:package-variant-closed-minus',
+          title: '固定资产分摊',
+          icon: 'mdi:office-building-cog-outline',
+          powerKey: 'warehouse',
+        },
+      },
+      {
+        path: 'low-value-consumables-share',
+        name: 'WarehouseLowValueConsumablesShare',
+        component: () => import('@/views/base/LowValueConsumablesShareListed.vue'),
+        meta: {
+          title: '低值易耗品分摊',
+          icon: 'mdi:basket-outline',
           powerKey: 'warehouse',
         },
       },
@@ -1101,7 +1151,21 @@ router.beforeEach(async (to, from, next) => {
   }
 
   if (!bootstrapStore.ready) {
-    const redirect = to.fullPath && to.fullPath !== '/bootstrap' ? to.fullPath : undefined
+    const redirect =
+      to.fullPath && to.fullPath !== '/bootstrap' && to.fullPath !== '/login'
+        ? to.fullPath
+        : undefined
+
+    // 未登录：在登录页完成初始化（保留左上天气与日期）
+    if (!token) {
+      if (to.path === '/login') return next()
+      return next({
+        path: '/login',
+        query: redirect ? { redirect } : {},
+      })
+    }
+
+    if (to.path === '/bootstrap') return next()
     return next({
       path: '/bootstrap',
       query: redirect ? { redirect } : {},
diff --git a/src/styles/warehouseOpsFlexTable.css b/src/styles/warehouseOpsFlexTable.css
index 7aaf093..281f4b0 100644
--- a/src/styles/warehouseOpsFlexTable.css
+++ b/src/styles/warehouseOpsFlexTable.css
@@ -85,6 +85,10 @@
 .wops-flex-table.is-cols-share-waste {
   --wops-cols: 14fr 11fr 5fr 5fr 4fr 5fr 5fr 5fr 8fr;
 }
+/* 分摊结果 — 列数由接口字段动态决定（inline --wops-cols） */
+.wops-flex-table.is-cols-share-dynamic {
+  --wops-cols: repeat(4, minmax(96px, 1fr));
+}
 /* 公关费用（10 列）：费用编码略窄，集团 / 组织各加半份 */
 .wops-flex-table.is-cols-pr-cost {
   --wops-cols: 7fr 10.5fr 10.5fr 7fr 8fr 8fr 6fr 9fr 6fr 8fr;
@@ -105,6 +109,27 @@
   flex-direction: column;
 }
 
+/* 表头固定在表格顶部；loading 仅覆盖下方数据区 */
+.wops-flex-table > .wops-flex-head {
+  flex-shrink: 0;
+  position: static;
+}
+
+.wops-flex-body {
+  flex: 1;
+  min-height: 0;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  position: relative;
+}
+
+.wops-flex-body > .wops-flex-scroll {
+  flex: 1;
+  min-height: 0;
+}
+
 .wops-flex-row {
   display: grid;
   grid-template-columns: var(--wops-cols);
@@ -319,6 +344,7 @@
   padding: 12px 16px;
   color: #909399;
   text-align: center;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
 }
 
 .wops-op-link {
@@ -339,3 +365,213 @@
 .wops-op-link--danger:hover {
   color: #f78989;
 }
+
+/* ── 仓库运维页顶栏：title → 视图切换 → 条数 → 票据 Tab（左对齐）；操作按钮靠右 ── */
+.wops-page-header {
+  --wops-header-h: calc(36px + var(--wh-fs-delta, 0px));
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  gap: 12px 16px;
+  margin-bottom: 12px;
+  height: var(--wops-header-h);
+  min-height: var(--wops-header-h);
+  max-height: var(--wops-header-h);
+  box-sizing: border-box;
+}
+
+.wops-page-header-row {
+  flex: 1;
+  min-width: 0;
+  height: var(--wops-header-h);
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: 10px 12px;
+  box-sizing: border-box;
+}
+
+.wops-page-title {
+  margin: 0;
+  font-size: calc(16px + var(--wh-fs-delta, 0px));
+  font-weight: 600;
+  color: #303133;
+  flex-shrink: 0;
+  line-height: 1.2;
+}
+
+.wops-page-total {
+  flex-shrink: 0;
+  min-width: 56px;
+  font-size: 12px;
+  color: #909399;
+  white-space: nowrap;
+  line-height: 1.2;
+}
+
+.wops-page-header-toggle {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  height: var(--wops-header-h);
+  max-height: var(--wops-header-h);
+  overflow: hidden;
+}
+
+.wops-page-header-toggle.is-empty {
+  display: none;
+}
+
+.wops-page-header-bills {
+  flex: 1 1 auto;
+  min-width: 0;
+  height: var(--wops-header-h);
+  max-height: var(--wops-header-h);
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: 6px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  padding: 0;
+  box-sizing: border-box;
+  scrollbar-width: thin;
+  scrollbar-color: #e4e7ed transparent;
+}
+
+.wops-page-header-bills.is-empty {
+  display: none;
+}
+
+.wops-page-header-bills::-webkit-scrollbar { height: 4px; }
+.wops-page-header-bills::-webkit-scrollbar-thumb { background: #e4e7ed; border-radius: 2px; }
+
+.wops-page-header-actions {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  height: var(--wops-header-h);
+  max-height: var(--wops-header-h);
+  overflow: hidden;
+}
+
+.wops-page-header-actions.is-empty {
+  display: none;
+}
+
+/* ── 仓库运维页筛选区（统一灰底盒子 + 最小行高，左对齐） ── */
+.wops-page-filters {
+  flex-shrink: 0;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 12px;
+  padding: 10px 12px;
+  background: #f8fafc;
+  border: 1px solid #ebeef5;
+  border-radius: 8px;
+  box-sizing: border-box;
+  min-height: calc(46px + var(--wh-fs-delta, 0px));
+}
+
+.wops-page-filters > * {
+  flex: 0 0 auto;
+}
+
+.wops-page-filters .wops-filter-field {
+  width: 140px;
+}
+
+.wops-page-filters .wops-filter-field--goods {
+  width: 160px;
+}
+
+.wops-page-filters .wops-filter-field--wide {
+  width: 180px;
+}
+
+.wops-page-filters .el-date-editor.wops-filter-date {
+  width: 150px !important;
+  flex: 0 0 auto;
+}
+
+.wops-page-filters .el-date-editor.wops-filter-date--sm {
+  width: 132px !important;
+  flex: 0 0 auto;
+}
+
+.wops-bill-tab {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 5px 12px;
+  border: 1px solid #e4e7ed;
+  border-radius: 6px;
+  background: #f5f7fa;
+  color: #606266;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
+  cursor: pointer;
+  transition: background .15s, border-color .15s, color .15s;
+  max-width: 180px;
+}
+
+.wops-bill-tab:hover {
+  border-color: #c6d8f5;
+  background: #ecf5ff;
+  color: #409eff;
+}
+
+.wops-bill-tab.is-active {
+  border-color: #409eff;
+  background: #ecf5ff;
+  color: #409eff;
+  font-weight: 600;
+}
+
+.wops-bill-tab-name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
+
+.wops-bill-tab-tax {
+  flex-shrink: 0;
+  font-size: calc(11px + var(--wh-fs-delta, 0px));
+  color: #e6a23c;
+  background: #fdf6ec;
+  border-radius: 3px;
+  padding: 0 5px;
+  line-height: 17px;
+}
+
+.wops-bill-tab.is-active .wops-bill-tab-tax {
+  background: #fff;
+}
+
+.wops-bill-tab--skeleton {
+  width: 72px;
+  min-height: calc(28px + var(--wh-fs-delta, 0px));
+  padding: 0;
+  border-color: #ebeef5;
+  background: #f2f4f7;
+  cursor: default;
+  pointer-events: none;
+  animation: wops-bill-tab-skeleton-pulse 1.2s ease-in-out infinite;
+}
+
+@keyframes wops-bill-tab-skeleton-pulse {
+  0%, 100% { opacity: 0.55; }
+  50% { opacity: 0.9; }
+}
+
+.wops-bill-tabs-empty {
+  flex-shrink: 0;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
+  color: #c0c4cc;
+  white-space: nowrap;
+  padding: 0 8px;
+}
diff --git a/src/utils/costShareListedDisplay.js b/src/utils/costShareListedDisplay.js
new file mode 100644
index 0000000..0267409
--- /dev/null
+++ b/src/utils/costShareListedDisplay.js
@@ -0,0 +1,114 @@
+import { formatOpsLogTime } from '@/utils/warehouseOpsDisplay'
+
+export const COST_SHARE_COLUMN_LABELS = {
+  goods_code: '物料编码',
+  goods_name: '物料名称',
+  goods_display_name: '物料名称',
+  warehouse_code: '仓库编码',
+  warehouse_name: '仓库名称',
+  rdc_warehouse_code: 'RDC仓库编码',
+  rdc_warehouse_name: 'RDC仓库名称',
+  share_total_amount: '分摊总额',
+  unit_amount: '单件分摊',
+  ratio: '占比',
+  bill_tax: '税率',
+  share_time: '分摊时间',
+  ctime: '创建时间',
+}
+
+export const COST_SHARE_COLUMN_ORDER = [
+  'goods_code',
+  'goods_name',
+  'goods_display_name',
+  'warehouse_code',
+  'warehouse_name',
+  'rdc_warehouse_code',
+  'rdc_warehouse_name',
+]
+
+const SKIP_KEYS = new Set([
+  'goods_categorys',
+  'goods_categorys_list',
+  'category_path',
+])
+
+const TIME_KEYS = new Set(['share_time', 'ctime', 'create_time', 'update_time', 'amortize_time'])
+const NUM_KEYS = new Set([
+  'ratio',
+  'bill_tax',
+  'share_total_amount',
+  'unit_amount',
+  'purchase_count',
+  'total_count',
+  'amount',
+  'total_amount',
+])
+
+export function deriveCostShareColumns(list) {
+  const keys = new Set()
+  for (const row of list || []) {
+    if (!row || typeof row !== 'object') continue
+    for (const key of Object.keys(row)) {
+      if (SKIP_KEYS.has(key)) continue
+      const val = row[key]
+      if (val != null && typeof val === 'object') continue
+      keys.add(key)
+    }
+  }
+  const ordered = []
+  for (const key of COST_SHARE_COLUMN_ORDER) {
+    if (keys.has(key)) {
+      ordered.push({ key, label: COST_SHARE_COLUMN_LABELS[key] || key })
+      keys.delete(key)
+    }
+  }
+  const rest = [...keys].sort((a, b) => a.localeCompare(b, 'zh-CN'))
+  for (const key of rest) {
+    ordered.push({ key, label: COST_SHARE_COLUMN_LABELS[key] || key })
+  }
+  return ordered
+}
+
+export function costShareColHeadClass(key) {
+  if (NUM_KEYS.has(key) || key.endsWith('_amount') || key.endsWith('_count')) return 'wops-col--num'
+  if (TIME_KEYS.has(key) || key.endsWith('_time')) return 'wops-col--time'
+  if (key === 'goods_code' || key === 'goods_name' || key === 'goods_display_name') return 'wops-col--goods'
+  if (key.includes('warehouse') || key.includes('company') || key.includes('bloc')) return 'wops-col--wh'
+  return 'wops-col--plain'
+}
+
+function fmtNum(v, digits = 2) {
+  if (v == null || v === '') return '—'
+  const n = Number(v)
+  return Number.isFinite(n) ? n.toFixed(digits) : String(v)
+}
+
+export function formatCostShareCell(row, key) {
+  const v = row?.[key]
+  if (v == null || v === '') return '—'
+  if (TIME_KEYS.has(key) || key.endsWith('_time')) return formatOpsLogTime(v) || '—'
+  if (key === 'bill_tax') {
+    const n = Number(v)
+    return Number.isFinite(n) ? `${n}%` : String(v)
+  }
+  if (NUM_KEYS.has(key) || key.endsWith('_amount') || key.endsWith('_count') || key.endsWith('_ratio')) {
+    const digits = key.includes('ratio') ? 4 : 2
+    return fmtNum(v, digits)
+  }
+  if (typeof v === 'boolean') return v ? '是' : '否'
+  return String(v)
+}
+
+export function costShareCellTitle(row, key) {
+  const text = formatCostShareCell(row, key)
+  return text === '—' ? '' : text
+}
+
+export function costShareRowKey(row, idx) {
+  return [
+    row?.goods_code ?? '',
+    row?.warehouse_code ?? row?.rdc_warehouse_code ?? '',
+    row?.share_time ?? row?.ctime ?? '',
+    idx,
+  ].join(':')
+}
diff --git a/src/utils/whRdcDeployCandidatesTree.js b/src/utils/whRdcDeployCandidatesTree.js
index cbc756f..260a38f 100755
--- a/src/utils/whRdcDeployCandidatesTree.js
+++ b/src/utils/whRdcDeployCandidatesTree.js
@@ -344,7 +344,7 @@ export function groupDeployLinkRequests(rows, anchorToDeployMap, warehouseCode)
     const pick = anchorKey ? anchorToDeployMap?.[anchorKey] : null
     const body = buildRdcDeployLinkBody(row, warehouseCode, pick)
     if (!body) continue
-    const dedupe = `${body.form_warehouse_code}::${body.to_warehouse_code}`
+    const dedupe = `${body.self_warehouse_code}::${body.goods_code}::${body.source_warehouse_code}`
     if (seen.has(dedupe)) continue
     seen.add(dedupe)
     payloads.push(body)
@@ -370,7 +370,7 @@ export function groupDeploySetRequests(rows, anchorToDeployMap, warehouseCode) {
     })
   }
   return [...bySource.entries()].map(([sourceCode, deployMap]) => ({
-    form_warehouse_codes: [sourceCode],
+    self_warehouse_codes: [sourceCode],
     list: [...deployMap.values()],
   }))
 }
diff --git a/src/views/base/AllocShareListed.vue b/src/views/base/AllocShareListed.vue
index 5d31d1a..c3bab27 100644
--- a/src/views/base/AllocShareListed.vue
+++ b/src/views/base/AllocShareListed.vue
@@ -1,37 +1,36 @@
 <template>
   <div class="asl-page">
-    <header class="asl-header">
-      <div class="asl-header-main">
-        <h2 class="asl-title">配货分摊预估</h2>
-        <span class="asl-total">{{ !loading && queried ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="asl-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+    <WopsPageHeader
+      title="配货分摊"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #bills>
         <button
           type="button"
-          class="asl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="asl-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="asl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="asl-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="asl-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="asl-bill-tabs-empty">暂无费用票据</span>
-      </div>
-    </header>
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+    </WopsPageHeader>
 
-    <div class="asl-filters">
+    <div class="wops-page-filters">
       <el-date-picker
         v-model="batchRange.start_time"
         type="date"
@@ -39,7 +38,7 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="asl-filter-date"
+        class="wops-filter-date"
       />
       <el-date-picker
         v-model="batchRange.end_time"
@@ -48,14 +47,14 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="asl-filter-date"
+        class="wops-filter-date"
       />
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="asl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -63,7 +62,7 @@
         placeholder="RDC仓库编码"
         clearable
         size="small"
-        class="asl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -71,27 +70,28 @@
         placeholder="FDC仓库编码"
         clearable
         size="small"
-        class="asl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-button type="primary" size="small" @click="doSearch">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" :element-loading-text="loadingText" class="asl-body">
+    <div class="asl-body">
       <div class="wops-flex-table is-cols-share-alloc">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div
-              v-for="col in SHARE_COLUMNS"
-              :key="col.key"
-              class="wops-col asl-head-col"
-              :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
-            >
-              {{ col.label }}
-            </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div
+            v-for="col in SHARE_COLUMNS"
+            :key="col.key"
+            class="wops-col asl-head-col"
+            :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
+          >
+            {{ col.label }}
           </div>
+        </div>
 
+        <div v-loading="loading" :element-loading-text="loadingText" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && queried && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">暂无分摊结果</p>
           </div>
@@ -121,6 +121,7 @@
               <span class="wops-ellipsis">{{ formatOpsLogTime(row.share_time || row.ctime) }}</span>
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>
@@ -145,6 +146,7 @@
 import { onActivated, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
 import request from '@/utils/request'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import { formatOpsLogTime } from '@/utils/warehouseOpsDisplay'
 import { pickGoodsNameFromListedRow } from '@/utils/goodsCategorys'
@@ -205,7 +207,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -488,23 +490,10 @@ onActivated(initPage)
 }
 .asl-bill-tabs-empty {
   flex-shrink: 0;
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   padding: 0 8px;
 }
-.asl-filters {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  flex-shrink: 0;
-  margin-bottom: 12px;
-}
-.asl-filter-item {
-  width: 180px;
-}
-.asl-filter-date {
-  width: 150px;
-}
 .asl-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/CostShareListedPage.vue b/src/views/base/CostShareListedPage.vue
new file mode 100644
index 0000000..1a1f153
--- /dev/null
+++ b/src/views/base/CostShareListedPage.vue
@@ -0,0 +1,295 @@
+<template>
+  <div class="cost-share-page">
+    <WopsPageHeader
+      :title="title"
+      :count="total"
+    />
+
+    <div class="wops-page-filters">
+      <el-date-picker
+        v-model="batchRange.start_time"
+        type="date"
+        placeholder="分摊开始日期"
+        value-format="YYYY-MM-DD"
+        size="small"
+        clearable
+        class="wops-filter-date"
+      />
+      <el-date-picker
+        v-model="batchRange.end_time"
+        type="date"
+        placeholder="分摊结束日期"
+        value-format="YYYY-MM-DD"
+        size="small"
+        clearable
+        class="wops-filter-date"
+      />
+      <el-input
+        v-model="filters.goods_code"
+        placeholder="goods_code"
+        clearable
+        size="small"
+        class="wops-filter-field--wide"
+        @keyup.enter="doSearch"
+      />
+      <el-input
+        v-if="showWarehouseFilter"
+        v-model="filters.warehouse_code"
+        placeholder="warehouse_code"
+        clearable
+        size="small"
+        class="wops-filter-field--wide"
+        @keyup.enter="doSearch"
+      />
+      <el-button type="primary" size="small" @click="doSearch">查询</el-button>
+      <el-button size="small" @click="resetFilters">重置</el-button>
+    </div>
+
+    <div class="cost-share-table-wrap">
+      <el-table
+        :data="rows"
+        border
+        stripe
+        size="small"
+        height="100%"
+        class="cost-share-table"
+        empty-text="暂无数据"
+      >
+        <el-table-column
+          v-for="key in tableColumns"
+          :key="key"
+          :prop="key"
+          :label="key"
+          min-width="120"
+          show-overflow-tooltip
+          :formatter="cellFormatter"
+        />
+      </el-table>
+      <div
+        v-if="loading"
+        v-loading="loading"
+        :element-loading-text="loadingText"
+        class="cost-share-body-loading"
+      />
+    </div>
+
+    <div v-if="queried && total > 0" class="cost-share-footer">
+      <el-pagination
+        v-model:current-page="page"
+        v-model:page-size="limit"
+        :total="total"
+        :page-sizes="[20, 50]"
+        layout="total, sizes, prev, pager, next, jumper"
+        background
+        small
+        @current-change="fetchListedOnly"
+        @size-change="onSizeChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { onActivated, onMounted, reactive, ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
+import { pickApiErrorMessage } from '@/api/costShareListed'
+
+const props = defineProps({
+  title: { type: String, required: true },
+  fetchListed: { type: Function, required: true },
+  fetchAmortize: { type: Function, required: true },
+  showWarehouseFilter: { type: Boolean, default: true },
+})
+
+const loading = ref(false)
+const loadingText = ref('加载中…')
+const queried = ref(false)
+const rows = ref([])
+const total = ref(0)
+const page = ref(1)
+const limit = ref(20)
+
+const filters = reactive({
+  goods_code: '',
+  warehouse_code: '',
+})
+
+function pad2(n) {
+  return String(n).padStart(2, '0')
+}
+
+function fmtDate(d) {
+  return `${d.getFullYear()}-${pad2(d.getMonth() + 1)}-${pad2(d.getDate())}`
+}
+
+function defaultBatchRange() {
+  const now = new Date()
+  const start = new Date(now.getFullYear(), 0, 1)
+  return { start_time: fmtDate(start), end_time: fmtDate(now) }
+}
+
+const batchRange = reactive(defaultBatchRange())
+
+const tableColumns = ref([])
+
+function syncTableColumns(list) {
+  const next = [...tableColumns.value]
+  const seen = new Set(next)
+  for (const row of list) {
+    if (!row || typeof row !== 'object') continue
+    for (const key of Object.keys(row)) {
+      if (seen.has(key)) continue
+      seen.add(key)
+      next.push(key)
+    }
+  }
+  if (next.length) tableColumns.value = next
+}
+
+function cellFormatter(_row, _col, val) {
+  if (val == null || val === '') return '—'
+  if (typeof val === 'object') {
+    try {
+      return JSON.stringify(val)
+    } catch {
+      return String(val)
+    }
+  }
+  return String(val)
+}
+
+function buildAmortizeBody() {
+  const body = {}
+  const start_time = String(batchRange.start_time || '').trim()
+  const end_time = String(batchRange.end_time || '').trim()
+  if (start_time) body.start_time = start_time
+  if (end_time) body.end_time = end_time
+  return body
+}
+
+function buildListedBody() {
+  const body = { page: page.value, limit: limit.value, ...buildAmortizeBody() }
+  const goods_code = String(filters.goods_code || '').trim()
+  if (goods_code) body.goods_code = goods_code
+  if (props.showWarehouseFilter) {
+    const warehouse_code = String(filters.warehouse_code || '').trim()
+    if (warehouse_code) body.warehouse_code = warehouse_code
+  }
+  return body
+}
+
+async function runAmortizeStep() {
+  loadingText.value = '跑批中…'
+  await props.fetchAmortize(buildAmortizeBody())
+}
+
+async function loadListed() {
+  loadingText.value = '加载中…'
+  const res = await props.fetchListed(buildListedBody())
+  syncTableColumns(res.list)
+  rows.value = res.list
+  total.value = res.total
+  queried.value = true
+}
+
+async function fetchListedOnly() {
+  loading.value = true
+  try {
+    await loadListed()
+  } catch (e) {
+    ElMessage.error(pickApiErrorMessage(e, '查询失败'))
+  } finally {
+    loading.value = false
+  }
+}
+
+async function runBatchAndFetch() {
+  loading.value = true
+  try {
+    await runAmortizeStep()
+    await loadListed()
+  } catch (e) {
+    ElMessage.error(pickApiErrorMessage(e, '跑批失败'))
+  } finally {
+    loading.value = false
+  }
+}
+
+function doSearch() {
+  page.value = 1
+  fetchListedOnly()
+}
+
+function onSizeChange() {
+  page.value = 1
+  fetchListedOnly()
+}
+
+function resetFilters() {
+  Object.assign(batchRange, defaultBatchRange())
+  filters.goods_code = ''
+  if (props.showWarehouseFilter) filters.warehouse_code = ''
+  page.value = 1
+  runBatchAndFetch()
+}
+
+async function initPage() {
+  page.value = 1
+  await runBatchAndFetch()
+}
+
+onMounted(initPage)
+onActivated(initPage)
+</script>
+
+<style scoped>
+.cost-share-page {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  min-height: 0;
+  padding: 16px;
+  box-sizing: border-box;
+}
+.cost-share-table-wrap {
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+  position: relative;
+}
+.cost-share-body-loading {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: calc(36px + var(--wh-fs-delta, 0px));
+}
+.cost-share-table-wrap :deep(.el-table) {
+  height: 100%;
+}
+.cost-share-table-wrap :deep(.el-table__inner-wrapper) {
+  height: 100%;
+  position: relative;
+}
+.cost-share-table-wrap :deep(.el-table__body-wrapper) {
+  flex: 1;
+  min-height: 0;
+}
+.cost-share-table-wrap :deep(.el-table__empty-block) {
+  min-height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.cost-share-table-wrap :deep(.el-table__empty-text) {
+  color: #909399;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
+}
+.cost-share-footer {
+  flex-shrink: 0;
+  display: flex;
+  justify-content: flex-end;
+  padding-top: 10px;
+}
+</style>
diff --git a/src/views/base/DeployShareListed.vue b/src/views/base/DeployShareListed.vue
index 738f42d..56c4534 100644
--- a/src/views/base/DeployShareListed.vue
+++ b/src/views/base/DeployShareListed.vue
@@ -1,37 +1,36 @@
 <template>
   <div class="dsl-page">
-    <header class="dsl-header">
-      <div class="dsl-header-main">
-        <h2 class="dsl-title">调货分摊预估</h2>
-        <span class="dsl-total">{{ !loading && queried ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="dsl-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+    <WopsPageHeader
+      title="调货分摊"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #bills>
         <button
           type="button"
-          class="dsl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="dsl-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="dsl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="dsl-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="dsl-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="dsl-bill-tabs-empty">暂无费用票据</span>
-      </div>
-    </header>
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+    </WopsPageHeader>
 
-    <div class="dsl-filters">
+    <div class="wops-page-filters">
       <el-date-picker
         v-model="batchRange.start_time"
         type="date"
@@ -39,7 +38,7 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="dsl-filter-date"
+        class="wops-filter-date"
       />
       <el-date-picker
         v-model="batchRange.end_time"
@@ -48,14 +47,14 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="dsl-filter-date"
+        class="wops-filter-date"
       />
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="dsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -63,7 +62,7 @@
         placeholder="出库仓编码"
         clearable
         size="small"
-        class="dsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -71,27 +70,28 @@
         placeholder="入库仓编码"
         clearable
         size="small"
-        class="dsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-button type="primary" size="small" @click="doSearch">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" :element-loading-text="loadingText" class="dsl-body">
+    <div class="dsl-body">
       <div class="wops-flex-table is-cols-share-deploy">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div
-              v-for="col in SHARE_COLUMNS"
-              :key="col.key"
-              class="wops-col dsl-head-col"
-              :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
-            >
-              {{ col.label }}
-            </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div
+            v-for="col in SHARE_COLUMNS"
+            :key="col.key"
+            class="wops-col dsl-head-col"
+            :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
+          >
+            {{ col.label }}
           </div>
+        </div>
 
+        <div v-loading="loading" :element-loading-text="loadingText" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && queried && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">暂无分摊结果</p>
           </div>
@@ -121,6 +121,7 @@
               <span class="wops-ellipsis">{{ formatOpsLogTime(row.share_time || row.ctime) }}</span>
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>
@@ -145,6 +146,7 @@
 import { onActivated, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
 import request from '@/utils/request'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import { formatOpsLogTime } from '@/utils/warehouseOpsDisplay'
 import { pickGoodsNameFromListedRow } from '@/utils/goodsCategorys'
@@ -205,7 +207,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -488,23 +490,10 @@ onActivated(initPage)
 }
 .dsl-bill-tabs-empty {
   flex-shrink: 0;
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   padding: 0 8px;
 }
-.dsl-filters {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  flex-shrink: 0;
-  margin-bottom: 12px;
-}
-.dsl-filter-item {
-  width: 180px;
-}
-.dsl-filter-date {
-  width: 150px;
-}
 .dsl-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/FixedAssetsShareListed.vue b/src/views/base/FixedAssetsShareListed.vue
new file mode 100644
index 0000000..04f2fea
--- /dev/null
+++ b/src/views/base/FixedAssetsShareListed.vue
@@ -0,0 +1,14 @@
+<template>
+  <CostShareListedPage
+    title="固定资产分摊"
+    :fetch-listed="fixedAssetsShareListed"
+    :fetch-amortize="fixedAssetsShareAmortize"
+  />
+</template>
+
+<script setup>
+import CostShareListedPage from './CostShareListedPage.vue'
+import { fixedAssetsShareAmortize, fixedAssetsShareListed } from '@/api/costShareListed'
+
+defineOptions({ name: 'FixedAssetsShareListed' })
+</script>
diff --git a/src/views/base/FreightShareListed.vue b/src/views/base/FreightShareListed.vue
index 36d1351..bcccc95 100644
--- a/src/views/base/FreightShareListed.vue
+++ b/src/views/base/FreightShareListed.vue
@@ -1,37 +1,36 @@
 <template>
   <div class="fsl-page">
-    <header class="fsl-header">
-      <div class="fsl-header-main">
-        <h2 class="fsl-title">运费分摊预估</h2>
-        <span class="fsl-total">{{ !loading && queried ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="fsl-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+    <WopsPageHeader
+      title="运费分摊"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #bills>
         <button
           type="button"
-          class="fsl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="fsl-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="fsl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="fsl-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="fsl-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="fsl-bill-tabs-empty">暂无费用票据</span>
-      </div>
-    </header>
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+    </WopsPageHeader>
 
-    <div class="fsl-filters">
+    <div class="wops-page-filters">
       <el-date-picker
         v-model="batchRange.start_time"
         type="date"
@@ -39,7 +38,7 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="fsl-filter-date"
+        class="wops-filter-date"
       />
       <el-date-picker
         v-model="batchRange.end_time"
@@ -48,14 +47,14 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="fsl-filter-date"
+        class="wops-filter-date"
       />
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="fsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -63,7 +62,7 @@
         placeholder="供应组织编码"
         clearable
         size="small"
-        class="fsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -71,27 +70,28 @@
         placeholder="RDC仓库编码"
         clearable
         size="small"
-        class="fsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-button type="primary" size="small" @click="doSearch">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" :element-loading-text="loadingText" class="fsl-body">
+    <div class="fsl-body">
       <div class="wops-flex-table is-cols-share-freight">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div
-              v-for="col in SHARE_COLUMNS"
-              :key="col.key"
-              class="wops-col fsl-head-col"
-              :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
-            >
-              {{ col.label }}
-            </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div
+            v-for="col in SHARE_COLUMNS"
+            :key="col.key"
+            class="wops-col fsl-head-col"
+            :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
+          >
+            {{ col.label }}
           </div>
+        </div>
 
+        <div v-loading="loading" :element-loading-text="loadingText" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && queried && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">暂无分摊结果</p>
           </div>
@@ -124,6 +124,7 @@
               <span class="wops-ellipsis">{{ formatOpsLogTime(row.share_time || row.ctime) }}</span>
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>
@@ -148,6 +149,7 @@
 import { onActivated, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
 import request from '@/utils/request'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import { formatOpsLogTime } from '@/utils/warehouseOpsDisplay'
 import { pickGoodsNameFromListedRow } from '@/utils/goodsCategorys'
@@ -210,7 +212,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -492,23 +494,10 @@ onActivated(initPage)
 }
 .fsl-bill-tabs-empty {
   flex-shrink: 0;
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   padding: 0 8px;
 }
-.fsl-filters {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  flex-shrink: 0;
-  margin-bottom: 12px;
-}
-.fsl-filter-item {
-  width: 180px;
-}
-.fsl-filter-date {
-  width: 150px;
-}
 .fsl-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/LowValueConsumablesShareListed.vue b/src/views/base/LowValueConsumablesShareListed.vue
new file mode 100644
index 0000000..4d6ff53
--- /dev/null
+++ b/src/views/base/LowValueConsumablesShareListed.vue
@@ -0,0 +1,17 @@
+<template>
+  <CostShareListedPage
+    title="低值易耗品分摊"
+    :fetch-listed="lowValueConsumablesShareListed"
+    :fetch-amortize="lowValueConsumablesShareAmortize"
+  />
+</template>
+
+<script setup>
+import CostShareListedPage from './CostShareListedPage.vue'
+import {
+  lowValueConsumablesShareAmortize,
+  lowValueConsumablesShareListed,
+} from '@/api/costShareListed'
+
+defineOptions({ name: 'LowValueConsumablesShareListed' })
+</script>
diff --git a/src/views/base/PrCost.vue b/src/views/base/PrCost.vue
index ec7db44..2f3915c 100644
--- a/src/views/base/PrCost.vue
+++ b/src/views/base/PrCost.vue
@@ -1,25 +1,24 @@
 <template>
   <div class="prc-page">
     <!-- ── 顶部 ── -->
-    <header class="prc-header">
-      <div class="prc-header-main">
-        <h2 class="prc-title">公关费用</h2>
-        <span v-if="!loading && total > 0" class="prc-total">共 {{ total }} 条</span>
-      </div>
-      <div class="prc-header-actions">
+    <WopsPageHeader
+      title="公关费用"
+      :count="total"
+    >
+      <template #actions>
         <el-button type="success" size="small" @click="openAddDlg()">新增公关费用</el-button>
-      </div>
-    </header>
+      </template>
+    </WopsPageHeader>
 
     <!-- ── 筛选 ── -->
-    <div class="prc-filters">
+    <div class="wops-page-filters">
       <el-select
         v-model="filters.supplier_bloc_code"
         placeholder="供应商集团"
         clearable
         filterable
         size="small"
-        class="prc-filter-item"
+        class="wops-filter-field--wide"
         :loading="blocLoading"
       >
         <el-option v-for="b in blocOptions" :key="b.bloc_code" :label="b.label" :value="b.bloc_code" />
@@ -30,7 +29,7 @@
         placeholder="开始日期"
         value-format="YYYY-MM-DD"
         size="small"
-        class="prc-filter-item prc-filter-date"
+        class="wops-filter-date"
       />
       <el-date-picker
         v-model="filters.end_date"
@@ -38,29 +37,30 @@
         placeholder="结束日期"
         value-format="YYYY-MM-DD"
         size="small"
-        class="prc-filter-item prc-filter-date"
+        class="wops-filter-date"
       />
       <el-button type="primary" size="small" @click="search">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
     <!-- ── 表格 ── -->
-    <div v-loading="loading" class="prc-table-wrap">
+    <div class="prc-table-wrap">
       <div class="wops-flex-table is-cols-pr-cost">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--code prc-head-col prc-head-col--code">费用编码</div>
-            <div class="wops-col wops-col--wh prc-head-col prc-head-col--supplier-bloc">供应商集团</div>
-            <div class="wops-col wops-col--wh prc-head-col prc-head-col--supplier-co">供应组织</div>
-            <div class="wops-col wops-col--num prc-head-col prc-head-col--amount">金额</div>
-            <div class="wops-col wops-col--bill prc-head-col prc-head-col--bill">票据</div>
-            <div class="wops-col wops-col--time prc-head-col prc-head-col--date">招待日期</div>
-            <div class="wops-col wops-col--plain prc-head-col prc-head-col--goods">关联商品</div>
-            <div class="wops-col wops-col--remark prc-head-col prc-head-col--remark">备注</div>
-            <div class="wops-col wops-col--plain prc-head-col prc-head-col--status">状态</div>
-            <div class="wops-col wops-col--op prc-head-col prc-head-col--ops">操作</div>
-          </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--code prc-head-col prc-head-col--code">费用编码</div>
+          <div class="wops-col wops-col--wh prc-head-col prc-head-col--supplier-bloc">供应商集团</div>
+          <div class="wops-col wops-col--wh prc-head-col prc-head-col--supplier-co">供应组织</div>
+          <div class="wops-col wops-col--num prc-head-col prc-head-col--amount">金额</div>
+          <div class="wops-col wops-col--bill prc-head-col prc-head-col--bill">票据</div>
+          <div class="wops-col wops-col--time prc-head-col prc-head-col--date">招待日期</div>
+          <div class="wops-col wops-col--plain prc-head-col prc-head-col--goods">关联商品</div>
+          <div class="wops-col wops-col--remark prc-head-col prc-head-col--remark">备注</div>
+          <div class="wops-col wops-col--plain prc-head-col prc-head-col--status">状态</div>
+          <div class="wops-col wops-col--op prc-head-col prc-head-col--ops">操作</div>
+        </div>
 
+        <div v-loading="loading" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">暂无数据</p>
           </div>
@@ -115,6 +115,7 @@
               </template>
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>
@@ -249,6 +250,7 @@
 </template>
 
 <script setup>
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import { computed, onMounted, reactive, ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import request from '@/utils/request'
@@ -550,10 +552,6 @@ onMounted(() => {
 .prc-header-main { display: flex; align-items: center; gap: 12px; }
 .prc-title { margin: 0; font-size: 16px; font-weight: 600; color: #303133; }
 .prc-total { font-size: 12px; color: #909399; }
-.prc-filters { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
-.prc-filter-item { width: 180px; }
-.prc-filter-date { width: 148px; }
-
 .prc-table-wrap {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/PrCostShareListed.vue b/src/views/base/PrCostShareListed.vue
index 33d5c4c..83652f5 100644
--- a/src/views/base/PrCostShareListed.vue
+++ b/src/views/base/PrCostShareListed.vue
@@ -1,37 +1,36 @@
 <template>
   <div class="pcsl-page">
-    <header class="pcsl-header">
-      <div class="pcsl-header-main">
-        <h2 class="pcsl-title">公关分摊预估</h2>
-        <span class="pcsl-total">{{ !loading && queried ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="pcsl-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+    <WopsPageHeader
+      title="公关分摊"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #bills>
         <button
           type="button"
-          class="pcsl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="pcsl-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="pcsl-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="pcsl-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="pcsl-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="pcsl-bill-tabs-empty">暂无费用票据</span>
-      </div>
-    </header>
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+    </WopsPageHeader>
 
-    <div class="pcsl-filters">
+    <div class="wops-page-filters">
       <el-date-picker
         v-model="batchRange.start_time"
         type="date"
@@ -39,7 +38,7 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="pcsl-filter-date"
+        class="wops-filter-date"
       />
       <el-date-picker
         v-model="batchRange.end_time"
@@ -48,14 +47,14 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="pcsl-filter-date"
+        class="wops-filter-date"
       />
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="pcsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -63,27 +62,28 @@
         placeholder="供应组织编码"
         clearable
         size="small"
-        class="pcsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-button type="primary" size="small" @click="doSearch">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" :element-loading-text="loadingText" class="pcsl-body">
+    <div class="pcsl-body">
       <div class="wops-flex-table is-cols-share-pr">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div
-              v-for="col in SHARE_COLUMNS"
-              :key="col.key"
-              class="wops-col pcsl-head-col"
-              :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
-            >
-              {{ col.label }}
-            </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div
+            v-for="col in SHARE_COLUMNS"
+            :key="col.key"
+            class="wops-col pcsl-head-col"
+            :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
+          >
+            {{ col.label }}
           </div>
+        </div>
 
+        <div v-loading="loading" :element-loading-text="loadingText" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && queried && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">暂无分摊结果</p>
           </div>
@@ -117,6 +117,7 @@
               <span class="wops-ellipsis">{{ formatOpsLogTime(row.share_time || row.ctime) }}</span>
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>
@@ -141,6 +142,7 @@
 import { onActivated, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
 import request from '@/utils/request'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import { formatOpsLogTime } from '@/utils/warehouseOpsDisplay'
 import {
@@ -218,7 +220,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -497,23 +499,10 @@ onActivated(initPage)
 }
 .pcsl-bill-tabs-empty {
   flex-shrink: 0;
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   padding: 0 8px;
 }
-.pcsl-filters {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  flex-shrink: 0;
-  margin-bottom: 12px;
-}
-.pcsl-filter-item {
-  width: 180px;
-}
-.pcsl-filter-date {
-  width: 150px;
-}
 .pcsl-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/PurchasingLaborShareListed.vue b/src/views/base/PurchasingLaborShareListed.vue
new file mode 100644
index 0000000..911667a
--- /dev/null
+++ b/src/views/base/PurchasingLaborShareListed.vue
@@ -0,0 +1,18 @@
+<template>
+  <CostShareListedPage
+    title="采购用人成本分摊"
+    :fetch-listed="purchasingLaborShareListed"
+    :fetch-amortize="purchasingLaborShareAmortize"
+    :show-warehouse-filter="false"
+  />
+</template>
+
+<script setup>
+import CostShareListedPage from './CostShareListedPage.vue'
+import {
+  purchasingLaborShareAmortize,
+  purchasingLaborShareListed,
+} from '@/api/costShareListed'
+
+defineOptions({ name: 'PurchasingLaborShareListed' })
+</script>
diff --git a/src/views/base/SalesDocLaborShareListed.vue b/src/views/base/SalesDocLaborShareListed.vue
new file mode 100644
index 0000000..2c8d6f3
--- /dev/null
+++ b/src/views/base/SalesDocLaborShareListed.vue
@@ -0,0 +1,18 @@
+<template>
+  <CostShareListedPage
+    title="销售用人成本分摊"
+    :fetch-listed="salesDocLaborShareListed"
+    :fetch-amortize="salesDocLaborShareAmortize"
+    :show-warehouse-filter="false"
+  />
+</template>
+
+<script setup>
+import CostShareListedPage from './CostShareListedPage.vue'
+import {
+  salesDocLaborShareAmortize,
+  salesDocLaborShareListed,
+} from '@/api/costShareListed'
+
+defineOptions({ name: 'SalesDocLaborShareListed' })
+</script>
diff --git a/src/views/base/WarehouseLaborShareListed.vue b/src/views/base/WarehouseLaborShareListed.vue
new file mode 100644
index 0000000..2fe551a
--- /dev/null
+++ b/src/views/base/WarehouseLaborShareListed.vue
@@ -0,0 +1,17 @@
+<template>
+  <CostShareListedPage
+    title="仓储用人成本分摊"
+    :fetch-listed="warehouseLaborShareListed"
+    :fetch-amortize="warehouseLaborShareAmortize"
+  />
+</template>
+
+<script setup>
+import CostShareListedPage from './CostShareListedPage.vue'
+import {
+  warehouseLaborShareAmortize,
+  warehouseLaborShareListed,
+} from '@/api/costShareListed'
+
+defineOptions({ name: 'WarehouseLaborShareListed' })
+</script>
diff --git a/src/views/base/WasteShareListed.vue b/src/views/base/WasteShareListed.vue
index ef79e74..f78109a 100644
--- a/src/views/base/WasteShareListed.vue
+++ b/src/views/base/WasteShareListed.vue
@@ -1,13 +1,11 @@
 <template>
   <div class="wsl-page">
-    <header class="wsl-header">
-      <div class="wsl-header-main">
-        <h2 class="wsl-title">损耗分摊预估</h2>
-        <span class="wsl-total">{{ !loading && queried ? `共 ${total} 条` : '' }}</span>
-      </div>
-    </header>
+    <WopsPageHeader
+      title="损耗分摊"
+      :count="total"
+    />
 
-    <div class="wsl-filters">
+    <div class="wops-page-filters">
       <el-date-picker
         v-model="batchRange.start_time"
         type="date"
@@ -15,7 +13,7 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="wsl-filter-date"
+        class="wops-filter-date"
       />
       <el-date-picker
         v-model="batchRange.end_time"
@@ -24,14 +22,14 @@
         value-format="YYYY-MM-DD"
         size="small"
         clearable
-        class="wsl-filter-date"
+        class="wops-filter-date"
       />
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="wsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-input
@@ -39,27 +37,28 @@
         placeholder="RDC仓库编码"
         clearable
         size="small"
-        class="wsl-filter-item"
+        class="wops-filter-field--wide"
         @keyup.enter="doSearch"
       />
       <el-button type="primary" size="small" @click="doSearch">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" :element-loading-text="loadingText" class="wsl-body">
+    <div class="wsl-body">
       <div class="wops-flex-table is-cols-share-waste">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div
-              v-for="col in SHARE_COLUMNS"
-              :key="col.key"
-              class="wops-col wsl-head-col"
-              :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
-            >
-              {{ col.label }}
-            </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div
+            v-for="col in SHARE_COLUMNS"
+            :key="col.key"
+            class="wops-col wsl-head-col"
+            :class="[colHeadClass(col.key), colHeadColorClass(col.key)]"
+          >
+            {{ col.label }}
           </div>
+        </div>
 
+        <div v-loading="loading" :element-loading-text="loadingText" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && queried && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">暂无分摊结果</p>
           </div>
@@ -87,6 +86,7 @@
               <span class="wops-ellipsis">{{ formatOpsLogTime(row.share_time || row.ctime) }}</span>
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>
@@ -110,7 +110,7 @@
 <script setup>
 import { onActivated, onMounted, reactive, ref } from 'vue'
 import { ElMessage } from 'element-plus'
-import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import { formatOpsLogTime } from '@/utils/warehouseOpsDisplay'
 import { pickGoodsNameFromListedRow } from '@/utils/goodsCategorys'
 import {
@@ -310,19 +310,6 @@ onActivated(initPage)
   min-width: 60px;
   display: inline-block;
 }
-.wsl-filters {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-  flex-shrink: 0;
-  margin-bottom: 12px;
-}
-.wsl-filter-item {
-  width: 180px;
-}
-.wsl-filter-date {
-  width: 150px;
-}
 .wsl-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/WhAlloc.vue b/src/views/base/WhAlloc.vue
index 968435e..13cb18b 100644
--- a/src/views/base/WhAlloc.vue
+++ b/src/views/base/WhAlloc.vue
@@ -1,51 +1,51 @@
 <template>
   <div class="wha-page">
-    <header class="wha-header">
-      <div class="wha-header-main">
-        <h2 class="wha-title">配货</h2>
+    <WopsPageHeader
+      title="配货"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #toggle>
         <el-radio-group v-model="viewMode" size="small" class="wha-view-toggle" @change="onViewModeChange">
           <el-radio-button value="attr">物料配货汇总</el-radio-button>
           <el-radio-button value="logs">物料配货日志</el-radio-button>
         </el-radio-group>
-        <span class="wha-total">{{ !loading && total > 0 ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="wha-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+      </template>
+      <template #bills>
         <button
           type="button"
-          class="wha-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="wha-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="wha-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="wha-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="wha-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="wha-bill-tabs-empty">暂无费用票据</span>
-      </div>
-
-      <div class="wha-header-actions">
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+      <template #actions>
         <el-button v-if="viewMode === 'logs'" type="primary" size="small" @click="openAddDlg">新增日志</el-button>
-      </div>
-    </header>
+      </template>
+    </WopsPageHeader>
 
-    <div class="wha-filters">
+    <div class="wops-page-filters">
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="wha-filter-item wha-filter-goods"
+        class="wops-filter-field wops-filter-field--goods"
         @keyup.enter="search"
       />
       <el-select
@@ -54,7 +54,7 @@
         clearable
         filterable
         size="small"
-        class="wha-filter-item"
+        class="wops-filter-field"
       >
         <el-option
           v-for="w in warehouseOptions"
@@ -69,7 +69,7 @@
         clearable
         filterable
         size="small"
-        class="wha-filter-item"
+        class="wops-filter-field"
       >
         <el-option
           v-for="w in warehouseOptions"
@@ -84,7 +84,7 @@
         placeholder="配货属性编码"
         clearable
         size="small"
-        class="wha-filter-item"
+        class="wops-filter-field"
         @keyup.enter="search"
       />
       <template v-if="viewMode === 'logs'">
@@ -95,7 +95,7 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="wha-filter-date"
+          class="wops-filter-date--sm"
         />
         <el-date-picker
           v-model="filters.end_time"
@@ -104,39 +104,40 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="wha-filter-date"
+          class="wops-filter-date--sm"
         />
       </template>
       <el-button type="primary" size="small" @click="search">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" element-loading-text="加载中…" class="wha-body">
+    <div class="wha-body">
       <div
         class="wops-flex-table"
         :class="viewMode === 'attr' ? 'is-cols-attr-wh2 is-cols-alloc-attr' : 'is-cols-logs-wha'"
       >
-        <div class="wops-flex-scroll">
-          <div v-if="viewMode === 'attr'" class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods wha-head-col wha-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh wha-head-col wha-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh wha-head-col wha-head-col--fdc-wh">FDC仓</div>
-            <div class="wops-col wops-col--bill wha-head-col wha-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num wha-head-col wha-head-col--fees">费用</div>
-            <div class="wops-col wops-col--num wha-head-col wha-head-col--count">数量</div>
-            <div class="wops-col wops-col--code wha-head-col wha-head-col--code">属性编码</div>
-          </div>
-          <div v-else class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods wha-head-col wha-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh wha-head-col wha-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh wha-head-col wha-head-col--fdc-wh">FDC仓</div>
-            <div class="wops-col wops-col--bill wha-head-col wha-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num wha-head-col wha-head-col--count">数量</div>
-            <div class="wops-col wops-col--num wha-head-col wha-head-col--fees">费用</div>
-            <div class="wops-col wops-col--remark wha-head-col wha-head-col--remark">备注</div>
-            <div class="wops-col wops-col--time wha-head-col wha-head-col--time">时间</div>
-          </div>
+        <div v-if="viewMode === 'attr'" class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods wha-head-col wha-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh wha-head-col wha-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh wha-head-col wha-head-col--fdc-wh">FDC仓</div>
+          <div class="wops-col wops-col--bill wha-head-col wha-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num wha-head-col wha-head-col--fees">费用</div>
+          <div class="wops-col wops-col--num wha-head-col wha-head-col--count">数量</div>
+          <div class="wops-col wops-col--code wha-head-col wha-head-col--code">属性编码</div>
+        </div>
+        <div v-else class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods wha-head-col wha-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh wha-head-col wha-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh wha-head-col wha-head-col--fdc-wh">FDC仓</div>
+          <div class="wops-col wops-col--bill wha-head-col wha-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num wha-head-col wha-head-col--count">数量</div>
+          <div class="wops-col wops-col--num wha-head-col wha-head-col--fees">费用</div>
+          <div class="wops-col wops-col--remark wha-head-col wha-head-col--remark">备注</div>
+          <div class="wops-col wops-col--time wha-head-col wha-head-col--time">时间</div>
+        </div>
 
+        <div v-loading="loading" element-loading-text="加载中…" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">{{ loadError || '暂无数据' }}</p>
           </div>
@@ -201,6 +202,7 @@
               </div>
             </div>
           </template>
+          </div>
         </div>
       </div>
     </div>
@@ -281,6 +283,7 @@
 
 <script setup>
 import { onMounted, reactive, ref, watch } from 'vue'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import WhGoodsQuickPickDlg from '@/components/warehouse/WhGoodsQuickPickDlg.vue'
 import { ElMessage } from 'element-plus'
@@ -312,7 +315,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -669,39 +672,10 @@ onMounted(async () => {
   background: #fff;
 }
 .wha-bill-tabs-empty {
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   white-space: nowrap;
 }
-.wha-filters {
-  flex-shrink: 0;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-  margin-bottom: 12px;
-  padding: 10px 12px;
-  background: #f8fafc;
-  border: 1px solid #ebeef5;
-  border-radius: 8px;
-}
-.wha-filters > * {
-  flex: 0 0 auto;
-}
-.wha-filter-item {
-  width: 140px;
-}
-.wha-filter-goods {
-  width: 160px;
-}
-.wha-filter-date {
-  flex: 0 0 auto;
-  width: 132px;
-}
-.wha-filter-date :deep(.el-date-editor) {
-  width: 132px !important;
-  box-sizing: border-box;
-}
 .wha-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/WhFreight.vue b/src/views/base/WhFreight.vue
index 32650ce..8eaae2e 100644
--- a/src/views/base/WhFreight.vue
+++ b/src/views/base/WhFreight.vue
@@ -1,47 +1,48 @@
 <template>
   <div class="whf-page">
-    <header class="whf-header">
-      <div class="whf-header-main">
-        <h2 class="whf-title">运费管理</h2>
+    <WopsPageHeader
+      title="运费管理"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #toggle>
         <el-radio-group v-model="viewMode" size="small" class="whf-view-toggle" @change="onViewModeChange">
           <el-radio-button value="attr">物料运费汇总</el-radio-button>
           <el-radio-button value="logs">物料运费日志</el-radio-button>
         </el-radio-group>
-        <span class="whf-total">{{ !loading && total > 0 ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="whf-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+      </template>
+      <template #bills>
         <button
           type="button"
-          class="whf-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="whf-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="whf-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="whf-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="whf-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="whf-bill-tabs-empty">暂无费用票据</span>
-      </div>
-    </header>
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+    </WopsPageHeader>
 
-    <div class="whf-filters">
+    <div class="wops-page-filters">
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="whf-filter-item whf-filter-goods"
+        class="wops-filter-field wops-filter-field--goods"
         @keyup.enter="search"
       />
       <el-select
@@ -50,7 +51,7 @@
         clearable
         filterable
         size="small"
-        class="whf-filter-item"
+        class="wops-filter-field"
       >
         <el-option
           v-for="w in warehouseOptions"
@@ -65,7 +66,7 @@
         clearable
         filterable
         size="small"
-        class="whf-filter-item"
+        class="wops-filter-field"
       >
         <el-option
           v-for="c in supplyCompanyOptions"
@@ -80,7 +81,7 @@
         placeholder="运费属性编码"
         clearable
         size="small"
-        class="whf-filter-item"
+        class="wops-filter-field"
         @keyup.enter="search"
       />
       <template v-if="viewMode === 'logs'">
@@ -91,7 +92,7 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="whf-filter-date"
+          class="wops-filter-date--sm"
         />
         <el-date-picker
           v-model="filters.end_time"
@@ -100,39 +101,40 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="whf-filter-date"
+          class="wops-filter-date--sm"
         />
       </template>
       <el-button type="primary" size="small" @click="search">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" element-loading-text="加载中…" class="whf-body">
+    <div class="whf-body">
       <div
         class="wops-flex-table"
         :class="viewMode === 'attr' ? 'is-cols-attr-wh2 is-cols-freight-attr' : 'is-cols-logs-whf'"
       >
-        <div class="wops-flex-scroll">
-          <div v-if="viewMode === 'attr'" class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods whf-head-col whf-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh whf-head-col whf-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh whf-head-col whf-head-col--supply-co">供应公司</div>
-            <div class="wops-col wops-col--bill whf-head-col whf-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num whf-head-col whf-head-col--fees">费用</div>
-            <div class="wops-col wops-col--num whf-head-col whf-head-col--count">数量</div>
-            <div class="wops-col wops-col--code whf-head-col whf-head-col--code">属性编码</div>
-          </div>
-          <div v-else class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods whf-head-col whf-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh whf-head-col whf-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh whf-head-col whf-head-col--supply-co">供应公司</div>
-            <div class="wops-col wops-col--bill whf-head-col whf-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num whf-head-col whf-head-col--count">数量</div>
-            <div class="wops-col wops-col--num whf-head-col whf-head-col--fees">费用</div>
-            <div class="wops-col wops-col--remark whf-head-col whf-head-col--remark">备注</div>
-            <div class="wops-col wops-col--time whf-head-col whf-head-col--time">时间</div>
-          </div>
+        <div v-if="viewMode === 'attr'" class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods whf-head-col whf-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh whf-head-col whf-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh whf-head-col whf-head-col--supply-co">供应公司</div>
+          <div class="wops-col wops-col--bill whf-head-col whf-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num whf-head-col whf-head-col--fees">费用</div>
+          <div class="wops-col wops-col--num whf-head-col whf-head-col--count">数量</div>
+          <div class="wops-col wops-col--code whf-head-col whf-head-col--code">属性编码</div>
+        </div>
+        <div v-else class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods whf-head-col whf-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh whf-head-col whf-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh whf-head-col whf-head-col--supply-co">供应公司</div>
+          <div class="wops-col wops-col--bill whf-head-col whf-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num whf-head-col whf-head-col--count">数量</div>
+          <div class="wops-col wops-col--num whf-head-col whf-head-col--fees">费用</div>
+          <div class="wops-col wops-col--remark whf-head-col whf-head-col--remark">备注</div>
+          <div class="wops-col wops-col--time whf-head-col whf-head-col--time">时间</div>
+        </div>
 
+        <div v-loading="loading" element-loading-text="加载中…" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">{{ loadError || '暂无数据' }}</p>
           </div>
@@ -197,6 +199,7 @@
               </div>
             </div>
           </template>
+          </div>
         </div>
       </div>
     </div>
@@ -232,6 +235,7 @@ import {
   freightLogsListed,
   pickApiErrorMessage,
 } from '@/api/warehouseFreight'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import {
   enrichWarehouseOpsRows,
@@ -253,7 +257,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -553,39 +557,10 @@ onMounted(async () => {
   background: #fff;
 }
 .whf-bill-tabs-empty {
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   white-space: nowrap;
 }
-.whf-filters {
-  flex-shrink: 0;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-  margin-bottom: 12px;
-  padding: 10px 12px;
-  background: #f8fafc;
-  border: 1px solid #ebeef5;
-  border-radius: 8px;
-}
-.whf-filters > * {
-  flex: 0 0 auto;
-}
-.whf-filter-item {
-  width: 140px;
-}
-.whf-filter-goods {
-  width: 160px;
-}
-.whf-filter-date {
-  flex: 0 0 auto;
-  width: 132px;
-}
-.whf-filter-date :deep(.el-date-editor) {
-  width: 132px !important;
-  box-sizing: border-box;
-}
 .whf-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/WhPurchase.vue b/src/views/base/WhPurchase.vue
index ade89f2..4dbf040 100644
--- a/src/views/base/WhPurchase.vue
+++ b/src/views/base/WhPurchase.vue
@@ -1,53 +1,53 @@
 <template>
   <div class="whp-page">
-    <header class="whp-header">
-      <div class="whp-header-main">
-        <h2 class="whp-title">采购管理</h2>
+    <WopsPageHeader
+      title="采购管理"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #toggle>
         <el-radio-group v-model="viewMode" size="small" class="whp-view-toggle" @change="onViewModeChange">
           <el-radio-button value="collect">成本汇总</el-radio-button>
           <el-radio-button value="logs">采购日志</el-radio-button>
           <el-radio-button value="orders">采购订单</el-radio-button>
         </el-radio-group>
-        <span class="whp-total">{{ !loading && total > 0 ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="whp-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+      </template>
+      <template #bills>
         <button
           type="button"
-          class="whp-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="whp-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="whp-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="whp-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="whp-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="whp-bill-tabs-empty">暂无费用票据</span>
-      </div>
-
-      <div class="whp-header-actions">
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+      <template #actions>
         <el-button type="success" size="small" @click="openOrderDlg">新增采购订单</el-button>
-      </div>
-    </header>
+      </template>
+    </WopsPageHeader>
 
-    <div class="whp-filters">
+    <div class="wops-page-filters">
       <template v-if="viewMode === 'logs'">
         <el-input
           v-model="filters.goods_code"
           placeholder="物料编码"
           clearable
           size="small"
-          class="whp-filter-item whp-filter-goods"
+          class="wops-filter-field wops-filter-field--goods"
           @keyup.enter="search"
         />
         <el-select
@@ -56,7 +56,7 @@
           clearable
           filterable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
         >
           <el-option
             v-for="w in warehouseOptions"
@@ -71,7 +71,7 @@
           clearable
           filterable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
           :loading="supplierLoading"
         >
           <el-option
@@ -87,7 +87,7 @@
           clearable
           filterable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
           :loading="companyLoading"
         >
           <el-option
@@ -102,7 +102,7 @@
           placeholder="采购属性编码"
           clearable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
           @keyup.enter="search"
         />
         <el-date-picker
@@ -112,7 +112,7 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="whp-filter-date"
+          class="wops-filter-date--sm"
         />
         <el-date-picker
           v-model="filters.end_time"
@@ -121,7 +121,7 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="whp-filter-date"
+          class="wops-filter-date--sm"
         />
       </template>
       <template v-else-if="viewMode === 'orders'">
@@ -131,7 +131,7 @@
           clearable
           filterable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
           :loading="supplierBlocLoading"
           @change="onOrderFilterBlocChange"
         >
@@ -143,7 +143,7 @@
           clearable
           filterable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
         >
           <el-option v-for="c in orderFilterCompanyOptions" :key="'f-co-' + c.company_code" :label="c.label" :value="c.company_code" />
         </el-select>
@@ -153,12 +153,12 @@
           clearable
           filterable
           size="small"
-          class="whp-filter-item"
+          class="wops-filter-field"
         >
           <el-option v-for="b in expenseBills" :key="'f-bill-' + b.bill_code" :label="billTabTitle(b)" :value="normBillCode(b.bill_code)" />
         </el-select>
-        <el-date-picker v-model="filters.start_time" type="date" placeholder="开始日期" value-format="YYYY-MM-DD" size="small" clearable class="whp-filter-date" />
-        <el-date-picker v-model="filters.end_time" type="date" placeholder="结束日期" value-format="YYYY-MM-DD" size="small" clearable class="whp-filter-date" />
+        <el-date-picker v-model="filters.start_time" type="date" placeholder="开始日期" value-format="YYYY-MM-DD" size="small" clearable class="wops-filter-date--sm" />
+        <el-date-picker v-model="filters.end_time" type="date" placeholder="结束日期" value-format="YYYY-MM-DD" size="small" clearable class="wops-filter-date--sm" />
       </template>
       <template v-else>
         <el-input
@@ -166,7 +166,7 @@
           placeholder="采购属性编码"
           clearable
           size="small"
-          class="whp-filter-item whp-filter-code"
+          class="wops-filter-field wops-filter-field--wide"
           @keyup.enter="search"
         />
       </template>
@@ -174,23 +174,24 @@
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" element-loading-text="加载中…" class="whp-body">
+    <div class="whp-body">
       <!-- 采购订单列表（10 列） -->
       <div v-if="viewMode === 'orders'" class="wops-flex-table is-cols-orders-whp">
-        <div class="wops-flex-scroll">
-          <div class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--code whp-head-col whp-head-col--order-code">订单编码</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-bloc">供应商集团</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-co">供应组织</div>
-            <div class="wops-col wops-col--bill whp-head-col whp-head-col--bill">票据</div>
-            <div class="wops-col wops-col--time whp-head-col whp-head-col--date">采购日期</div>
-            <div class="wops-col wops-col--plain whp-head-col whp-head-col--goods-detail">商品明细</div>
-            <div class="wops-col wops-col--num whp-head-col whp-head-col--amount">总金额</div>
-            <div class="wops-col wops-col--op whp-head-col whp-head-col--confirm">订单确认</div>
-            <div class="wops-col wops-col--op whp-head-col whp-head-col--arrive">到库确认</div>
-            <div class="wops-col wops-col--op whp-head-col whp-head-col--ops">操作</div>
-          </div>
+        <div class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--code whp-head-col whp-head-col--order-code">订单编码</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-bloc">供应商集团</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-co">供应组织</div>
+          <div class="wops-col wops-col--bill whp-head-col whp-head-col--bill">票据</div>
+          <div class="wops-col wops-col--time whp-head-col whp-head-col--date">采购日期</div>
+          <div class="wops-col wops-col--plain whp-head-col whp-head-col--goods-detail">商品明细</div>
+          <div class="wops-col wops-col--num whp-head-col whp-head-col--amount">总金额</div>
+          <div class="wops-col wops-col--op whp-head-col whp-head-col--confirm">订单确认</div>
+          <div class="wops-col wops-col--op whp-head-col whp-head-col--arrive">到库确认</div>
+          <div class="wops-col wops-col--op whp-head-col whp-head-col--ops">操作</div>
+        </div>
 
+        <div v-loading="loading" element-loading-text="加载中…" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !orderRows.length" class="wops-empty-wrap">
             <p class="wops-empty">{{ loadError || '暂无采购订单' }}</p>
           </div>
@@ -250,6 +251,7 @@
               <span v-else class="whp-ol-muted">已到库</span>
             </div>
           </div>
+          </div>
         </div>
       </div>
 
@@ -258,28 +260,29 @@
         class="wops-flex-table"
         :class="viewMode === 'collect' ? 'is-cols-collect-whp' : 'is-cols-logs-whp'"
       >
-        <div class="wops-flex-scroll">
-          <div v-if="viewMode === 'collect'" class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods whp-head-col whp-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-co">供应公司</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--company">公司</div>
-            <div class="wops-col wops-col--bill whp-head-col whp-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num whp-head-col whp-head-col--fees">费用</div>
-            <div class="wops-col wops-col--num whp-head-col whp-head-col--count">数量</div>
-            <div class="wops-col wops-col--code whp-head-col whp-head-col--code">属性编码</div>
-          </div>
-          <div v-else class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods whp-head-col whp-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-co">供应公司</div>
-            <div class="wops-col wops-col--wh whp-head-col whp-head-col--company">公司</div>
-            <div class="wops-col wops-col--bill whp-head-col whp-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num whp-head-col whp-head-col--count">数量</div>
-            <div class="wops-col wops-col--num whp-head-col whp-head-col--fees">费用</div>
-            <div class="wops-col wops-col--time whp-head-col whp-head-col--time">时间</div>
-          </div>
+        <div v-if="viewMode === 'collect'" class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods whp-head-col whp-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-co">供应公司</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--company">公司</div>
+          <div class="wops-col wops-col--bill whp-head-col whp-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num whp-head-col whp-head-col--fees">费用</div>
+          <div class="wops-col wops-col--num whp-head-col whp-head-col--count">数量</div>
+          <div class="wops-col wops-col--code whp-head-col whp-head-col--code">属性编码</div>
+        </div>
+        <div v-else class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods whp-head-col whp-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--supplier-co">供应公司</div>
+          <div class="wops-col wops-col--wh whp-head-col whp-head-col--company">公司</div>
+          <div class="wops-col wops-col--bill whp-head-col whp-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num whp-head-col whp-head-col--count">数量</div>
+          <div class="wops-col wops-col--num whp-head-col whp-head-col--fees">费用</div>
+          <div class="wops-col wops-col--time whp-head-col whp-head-col--time">时间</div>
+        </div>
 
+        <div v-loading="loading" element-loading-text="加载中…" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">{{ loadError || '暂无数据' }}</p>
           </div>
@@ -338,6 +341,7 @@
               </div>
             </div>
           </template>
+          </div>
         </div>
       </div>
     </div>
@@ -589,6 +593,7 @@
 
 <script setup>
 import { computed, onMounted, reactive, ref, watch } from 'vue'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import WhCollectionGoodsPickPanel from '@/components/warehouse/WhCollectionGoodsPickPanel.vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
@@ -643,7 +648,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const allBillsMap = ref({})
 const activeBillCode = ref('')
@@ -1366,42 +1371,10 @@ onMounted(async () => {
   background: #fff;
 }
 .whp-bill-tabs-empty {
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   white-space: nowrap;
 }
-.whp-filters {
-  flex-shrink: 0;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-  margin-bottom: 12px;
-  padding: 10px 12px;
-  background: #f8fafc;
-  border: 1px solid #ebeef5;
-  border-radius: 8px;
-}
-.whp-filters > * {
-  flex: 0 0 auto;
-}
-.whp-filter-item {
-  width: 140px;
-}
-.whp-filter-goods {
-  width: 160px;
-}
-.whp-filter-code {
-  width: 180px;
-}
-.whp-filter-date {
-  flex: 0 0 auto;
-  width: 132px;
-}
-.whp-filter-date :deep(.el-date-editor) {
-  width: 132px !important;
-  box-sizing: border-box;
-}
 .whp-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/WhRdcDeployLinkDialog.vue b/src/views/base/WhRdcDeployLinkDialog.vue
index fc658d1..d7c92a0 100755
--- a/src/views/base/WhRdcDeployLinkDialog.vue
+++ b/src/views/base/WhRdcDeployLinkDialog.vue
@@ -295,7 +295,7 @@ async function fetchCandidatesTree(rows) {
   if (candidatesCache.value?.anchorKey === cacheKey) {
     return { tree: candidatesCache.value.tree }
   }
-  const res = await warehouseRdcDeployCandidates({ form_warehouse_codes: codes })
+  const res = await warehouseRdcDeployCandidates({ self_warehouse_codes: codes })
   const tree = buildDeployCandidatesTree(parseDeployCandidatesListedRows(res))
   // 空结果不缓存，下次打开仍重新请求
   if (tree.length) {
diff --git a/src/views/base/WhSrfRdcDeployPane.vue b/src/views/base/WhSrfRdcDeployPane.vue
index 5ade6eb..071c248 100755
--- a/src/views/base/WhSrfRdcDeployPane.vue
+++ b/src/views/base/WhSrfRdcDeployPane.vue
@@ -95,11 +95,11 @@
 import { computed, ref, watch } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import {
-  buildRdcDeploySetPayloadForMaterial,
+  buildRdcDeployUnlinkBody,
   buildRdcDeploySourceCode,
   formatRdcDeployRowLabel,
   warehouseRdcDeployListed,
-  warehouseRdcDeploySet,
+  warehouseRdcDeployUnlink,
 } from '@/api/warehouseRdcDeploy'
 import WhRdcDeployLinkDialog from './WhRdcDeployLinkDialog.vue'
 
@@ -177,7 +177,7 @@ async function loadDeployList() {
   const seq = ++loadSeq
   try {
     deployRows.value = await warehouseRdcDeployListed({
-      form_warehouse_code: code,
+      self_warehouse_code: code,
       goods_code: props.goodsRow?.goods_code,
     })
   } catch (e) {
@@ -190,32 +190,29 @@ async function loadDeployList() {
 }
 
 async function unlinkRows(rows) {
-  const sourceCode = sourceRdcCode.value
-  if (!sourceCode) {
-    ElMessage.warning('缺少 RDC 编码，无法移除')
+  if (!props.goodsRow) {
+    ElMessage.warning('缺少物料，无法移除')
     return
   }
   const targets = (rows || []).filter((r) => (
-    r?.to_warehouse_code || r?.warehouse_rdc_code
+    r?.source_warehouse_code || r?.to_warehouse_code || r?.warehouse_rdc_code
   ))
   if (!targets.length) {
-    ElMessage.warning('缺少可调配仓编码，无法移除')
+    ElMessage.warning('缺少源采购仓编码，无法移除')
     return
   }
   mutating.value = true
   try {
-    const payload = await buildRdcDeploySetPayloadForMaterial(
-      props.goodsRow,
-      props.warehouseCode,
-      { removeTargets: targets },
-    )
-    if (!payload) {
-      ElMessage.warning('缺少物料编码，无法移除')
-      return
+    for (const target of targets) {
+      const body = buildRdcDeployUnlinkBody(props.goodsRow, props.warehouseCode, target)
+      if (!body) {
+        ElMessage.warning('缺少所在仓、物料或源采购仓编码，无法移除')
+        return
+      }
+      await warehouseRdcDeployUnlink(body)
     }
-    await warehouseRdcDeploySet(payload)
     await loadDeployList()
-    ElMessage.success(`已移除 ${targets.length} 个可调配仓`)
+    ElMessage.success(`已移除 ${targets.length} 个源采购仓`)
   } catch (e) {
     ElMessage.error('移除失败：' + (e?.data?.message || e?.message || '未知错误'))
   } finally {
diff --git a/src/views/base/WhTransfer.vue b/src/views/base/WhTransfer.vue
index 9d2f893..9b460c4 100644
--- a/src/views/base/WhTransfer.vue
+++ b/src/views/base/WhTransfer.vue
@@ -1,51 +1,51 @@
 <template>
   <div class="wht-page">
-    <header class="wht-header">
-      <div class="wht-header-main">
-        <h2 class="wht-title">调货</h2>
+    <WopsPageHeader
+      title="调货"
+      :count="total"
+      :bill-skeleton="billLoading && !expenseBills.length"
+    >
+      <template #toggle>
         <el-radio-group v-model="viewMode" size="small" class="wht-view-toggle" @change="onViewModeChange">
           <el-radio-button value="attr">物料调配汇总</el-radio-button>
           <el-radio-button value="logs">物料调配日志</el-radio-button>
         </el-radio-group>
-        <span class="wht-total">{{ !loading && total > 0 ? `共 ${total} 条` : '' }}</span>
-      </div>
-
-      <div v-loading="billLoading" class="wht-bill-tabs" element-loading-background="rgba(255,255,255,0.6)">
+      </template>
+      <template #bills>
         <button
           type="button"
-          class="wht-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': !activeBillCode }"
           @click="selectAllBills"
         >
-          <span class="wht-bill-tab-name">全部</span>
+          <span class="wops-bill-tab-name">全部</span>
         </button>
         <button
           v-for="bill in expenseBills"
           :key="bill.bill_code"
           type="button"
-          class="wht-bill-tab"
+          class="wops-bill-tab"
           :class="{ 'is-active': activeBillCode === normBillCode(bill.bill_code) }"
           :title="billTabTitle(bill)"
           @click="selectBill(bill)"
         >
-          <span class="wht-bill-tab-name">{{ billTabParts(bill).name }}</span>
-          <span v-if="billTabParts(bill).tax" class="wht-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
+          <span class="wops-bill-tab-name">{{ billTabParts(bill).name }}</span>
+          <span v-if="billTabParts(bill).tax" class="wops-bill-tab-tax">{{ billTabParts(bill).tax }}%</span>
         </button>
-        <span v-if="!billLoading && !expenseBills.length" class="wht-bill-tabs-empty">暂无费用票据</span>
-      </div>
-
-      <div class="wht-header-actions">
+        <span v-if="!billLoading && !expenseBills.length" class="wops-bill-tabs-empty">暂无费用票据</span>
+      </template>
+      <template #actions>
         <el-button v-if="viewMode === 'logs'" type="primary" size="small" @click="openAddDlg">新增日志</el-button>
-      </div>
-    </header>
+      </template>
+    </WopsPageHeader>
 
-    <div class="wht-filters">
+    <div class="wops-page-filters">
       <el-input
         v-model="filters.goods_code"
         placeholder="物料编码"
         clearable
         size="small"
-        class="wht-filter-item wht-filter-goods"
+        class="wops-filter-field wops-filter-field--goods"
         @keyup.enter="search"
       />
       <el-select
@@ -54,7 +54,7 @@
         clearable
         filterable
         size="small"
-        class="wht-filter-item"
+        class="wops-filter-field"
       >
         <el-option
           v-for="w in warehouseOptions"
@@ -69,7 +69,7 @@
         clearable
         filterable
         size="small"
-        class="wht-filter-item"
+        class="wops-filter-field"
       >
         <el-option
           v-for="w in warehouseOptions"
@@ -84,7 +84,7 @@
         placeholder="调配属性编码"
         clearable
         size="small"
-        class="wht-filter-item"
+        class="wops-filter-field"
         @keyup.enter="search"
       />
       <template v-if="viewMode === 'logs'">
@@ -95,7 +95,7 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="wht-filter-date"
+          class="wops-filter-date--sm"
         />
         <el-date-picker
           v-model="filters.end_time"
@@ -104,39 +104,40 @@
           value-format="YYYY-MM-DD"
           size="small"
           clearable
-          class="wht-filter-date"
+          class="wops-filter-date--sm"
         />
       </template>
       <el-button type="primary" size="small" @click="search">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" element-loading-text="加载中…" class="wht-body">
+    <div class="wht-body">
       <div
         class="wops-flex-table"
         :class="viewMode === 'attr' ? 'is-cols-attr-wh2 is-cols-transfer-attr' : 'is-cols-logs-wht'"
       >
-        <div class="wops-flex-scroll">
-          <div v-if="viewMode === 'attr'" class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods wht-head-col wht-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh wht-head-col wht-head-col--out-wh">出库仓</div>
-            <div class="wops-col wops-col--wh wht-head-col wht-head-col--in-wh">入库仓</div>
-            <div class="wops-col wops-col--bill wht-head-col wht-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num wht-head-col wht-head-col--fees">费用</div>
-            <div class="wops-col wops-col--num wht-head-col wht-head-col--count">数量</div>
-            <div class="wops-col wops-col--code wht-head-col wht-head-col--code">属性编码</div>
-          </div>
-          <div v-else class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods wht-head-col wht-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh wht-head-col wht-head-col--out-wh">出库仓</div>
-            <div class="wops-col wops-col--wh wht-head-col wht-head-col--in-wh">入库仓</div>
-            <div class="wops-col wops-col--bill wht-head-col wht-head-col--bill">票据</div>
-            <div class="wops-col wops-col--num wht-head-col wht-head-col--count">数量</div>
-            <div class="wops-col wops-col--num wht-head-col wht-head-col--fees">费用</div>
-            <div class="wops-col wops-col--remark wht-head-col wht-head-col--remark">备注</div>
-            <div class="wops-col wops-col--time wht-head-col wht-head-col--time">时间</div>
-          </div>
+        <div v-if="viewMode === 'attr'" class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods wht-head-col wht-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh wht-head-col wht-head-col--out-wh">出库仓</div>
+          <div class="wops-col wops-col--wh wht-head-col wht-head-col--in-wh">入库仓</div>
+          <div class="wops-col wops-col--bill wht-head-col wht-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num wht-head-col wht-head-col--fees">费用</div>
+          <div class="wops-col wops-col--num wht-head-col wht-head-col--count">数量</div>
+          <div class="wops-col wops-col--code wht-head-col wht-head-col--code">属性编码</div>
+        </div>
+        <div v-else class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods wht-head-col wht-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh wht-head-col wht-head-col--out-wh">出库仓</div>
+          <div class="wops-col wops-col--wh wht-head-col wht-head-col--in-wh">入库仓</div>
+          <div class="wops-col wops-col--bill wht-head-col wht-head-col--bill">票据</div>
+          <div class="wops-col wops-col--num wht-head-col wht-head-col--count">数量</div>
+          <div class="wops-col wops-col--num wht-head-col wht-head-col--fees">费用</div>
+          <div class="wops-col wops-col--remark wht-head-col wht-head-col--remark">备注</div>
+          <div class="wops-col wops-col--time wht-head-col wht-head-col--time">时间</div>
+        </div>
 
+        <div v-loading="loading" element-loading-text="加载中…" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">{{ loadError || '暂无数据' }}</p>
           </div>
@@ -201,6 +202,7 @@
               </div>
             </div>
           </template>
+          </div>
         </div>
       </div>
     </div>
@@ -281,6 +283,7 @@
 
 <script setup>
 import { onMounted, reactive, ref, watch } from 'vue'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import WhGoodsQuickPickDlg from '@/components/warehouse/WhGoodsQuickPickDlg.vue'
 import { ElMessage } from 'element-plus'
@@ -312,7 +315,7 @@ const total = ref(0)
 const page = ref(1)
 const limit = ref(20)
 
-const billLoading = ref(false)
+const billLoading = ref(true)
 const expenseBills = ref([])
 const activeBillCode = ref('')
 
@@ -668,39 +671,10 @@ onMounted(async () => {
   background: #fff;
 }
 .wht-bill-tabs-empty {
-  font-size: 12px;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #c0c4cc;
   white-space: nowrap;
 }
-.wht-filters {
-  flex-shrink: 0;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-  margin-bottom: 12px;
-  padding: 10px 12px;
-  background: #f8fafc;
-  border: 1px solid #ebeef5;
-  border-radius: 8px;
-}
-.wht-filters > * {
-  flex: 0 0 auto;
-}
-.wht-filter-item {
-  width: 140px;
-}
-.wht-filter-goods {
-  width: 160px;
-}
-.wht-filter-date {
-  flex: 0 0 auto;
-  width: 132px;
-}
-.wht-filter-date :deep(.el-date-editor) {
-  width: 132px !important;
-  box-sizing: border-box;
-}
 .wht-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/base/WhWaste.vue b/src/views/base/WhWaste.vue
index 245695b..000cd4f 100644
--- a/src/views/base/WhWaste.vue
+++ b/src/views/base/WhWaste.vue
@@ -1,57 +1,58 @@
 <template>
   <div class="whw-page">
-    <header class="whw-header">
-      <div class="whw-header-main">
-        <h2 class="whw-title">损耗管理</h2>
+    <WopsPageHeader
+      title="损耗管理"
+      :count="total"
+    >
+      <template #toggle>
         <el-radio-group v-model="viewMode" size="small" class="whw-view-toggle" @change="onViewModeChange">
           <el-radio-button value="collect">总损耗汇总</el-radio-button>
           <el-radio-button value="logs">损耗明细</el-radio-button>
         </el-radio-group>
-        <span v-if="!loading && total > 0" class="whw-total">共 {{ total }} 条</span>
-      </div>
-
-      <div class="whw-header-actions">
+      </template>
+      <template #actions>
         <el-button v-if="viewMode === 'logs'" type="primary" size="small" @click="openAddDlg">新增记录</el-button>
-      </div>
-    </header>
+      </template>
+    </WopsPageHeader>
 
-    <div class="whw-filters">
+    <div class="wops-page-filters">
       <el-input
         v-model="filters.alloc_attr_code"
         placeholder="配货属性编码"
         clearable
         size="small"
-        class="whw-filter-item whw-filter-code"
+        class="wops-filter-field wops-filter-field--wide"
         @keyup.enter="search"
       />
       <el-button type="primary" size="small" @click="search">查询</el-button>
       <el-button size="small" @click="resetFilters">重置</el-button>
     </div>
 
-    <div v-loading="loading" element-loading-text="加载中…" class="whw-body">
+    <div class="whw-body">
       <div
         class="wops-flex-table"
         :class="viewMode === 'collect' ? 'is-cols-collect-waste' : 'is-cols-logs-whw'"
       >
-        <div class="wops-flex-scroll">
-          <div v-if="viewMode === 'collect'" class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods whw-head-col whw-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh whw-head-col whw-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh whw-head-col whw-head-col--fdc-wh">FDC仓</div>
-            <div class="wops-col wops-col--num whw-head-col whw-head-col--rdc-loss">RDC损耗</div>
-            <div class="wops-col wops-col--num whw-head-col whw-head-col--fdc-loss">FDC损耗</div>
-            <div class="wops-col wops-col--code whw-head-col whw-head-col--code">属性编码</div>
-          </div>
-          <div v-else class="wops-flex-row wops-flex-head">
-            <div class="wops-col wops-col--goods whw-head-col whw-head-col--goods">物料</div>
-            <div class="wops-col wops-col--wh whw-head-col whw-head-col--rdc-wh">RDC仓</div>
-            <div class="wops-col wops-col--wh whw-head-col whw-head-col--fdc-wh">FDC仓</div>
-            <div class="wops-col wops-col--num whw-head-col whw-head-col--rdc-loss">RDC损耗</div>
-            <div class="wops-col wops-col--num whw-head-col whw-head-col--fdc-loss">FDC损耗</div>
-            <div class="wops-col wops-col--remark whw-head-col whw-head-col--remark">备注</div>
-            <div class="wops-col wops-col--time whw-head-col whw-head-col--time">时间</div>
-          </div>
+        <div v-if="viewMode === 'collect'" class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods whw-head-col whw-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh whw-head-col whw-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh whw-head-col whw-head-col--fdc-wh">FDC仓</div>
+          <div class="wops-col wops-col--num whw-head-col whw-head-col--rdc-loss">RDC损耗</div>
+          <div class="wops-col wops-col--num whw-head-col whw-head-col--fdc-loss">FDC损耗</div>
+          <div class="wops-col wops-col--code whw-head-col whw-head-col--code">属性编码</div>
+        </div>
+        <div v-else class="wops-flex-row wops-flex-head">
+          <div class="wops-col wops-col--goods whw-head-col whw-head-col--goods">物料</div>
+          <div class="wops-col wops-col--wh whw-head-col whw-head-col--rdc-wh">RDC仓</div>
+          <div class="wops-col wops-col--wh whw-head-col whw-head-col--fdc-wh">FDC仓</div>
+          <div class="wops-col wops-col--num whw-head-col whw-head-col--rdc-loss">RDC损耗</div>
+          <div class="wops-col wops-col--num whw-head-col whw-head-col--fdc-loss">FDC损耗</div>
+          <div class="wops-col wops-col--remark whw-head-col whw-head-col--remark">备注</div>
+          <div class="wops-col wops-col--time whw-head-col whw-head-col--time">时间</div>
+        </div>
 
+        <div v-loading="loading" element-loading-text="加载中…" class="wops-flex-body">
+          <div class="wops-flex-scroll">
           <div v-if="!loading && !rows.length" class="wops-empty-wrap">
             <p class="wops-empty">{{ loadError || '暂无数据' }}</p>
           </div>
@@ -110,6 +111,7 @@
               </div>
             </div>
           </template>
+          </div>
         </div>
       </div>
     </div>
@@ -268,6 +270,7 @@
 
 <script setup>
 import { onMounted, reactive, ref } from 'vue'
+import WopsPageHeader from '@/components/warehouse/WopsPageHeader.vue'
 import WarehouseOpsNameCode from '@/components/warehouse/WarehouseOpsNameCode.vue'
 import { ElMessage } from 'element-plus'
 import { warehouseListed } from '@/api/warehouse'
@@ -592,24 +595,6 @@ onMounted(async () => {
 .whw-header-actions {
   margin-left: auto;
 }
-.whw-filters {
-  flex-shrink: 0;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-  margin-bottom: 12px;
-  padding: 10px 12px;
-  background: #f8fafc;
-  border: 1px solid #ebeef5;
-  border-radius: 8px;
-}
-.whw-filters > * {
-  flex: 0 0 auto;
-}
-.whw-filter-item {
-  width: 180px;
-}
 .whw-body {
   flex: 1;
   min-height: 0;
diff --git a/src/views/dealer/DealerPriceBook.vue b/src/views/dealer/DealerPriceBook.vue
index 6e9afbe..237b7ff 100644
--- a/src/views/dealer/DealerPriceBook.vue
+++ b/src/views/dealer/DealerPriceBook.vue
@@ -45,6 +45,16 @@
           >
             批量修改
           </el-button>
+          <el-button
+            class="dpb-batch-calc-btn"
+            type="success"
+            size="small"
+            :disabled="!selectedEditableRows.length || batchCalculating"
+            :loading="batchCalculating"
+            @click="runBatchCalculate"
+          >
+            批量计算
+          </el-button>
           <el-button
             type="warning"
             size="small"
@@ -91,7 +101,7 @@
                 <div class="dpb-col dpb-col--pair dpb-head-col dpb-head-col--benefit">好处费<span class="dpb-head-sub">（率/额）</span></div>
                 <div class="dpb-col dpb-col--flag dpb-head-col dpb-head-col--special">特价</div>
                 <div class="dpb-col dpb-col--flag dpb-head-col dpb-head-col--valid">状态</div>
-                <div class="dpb-col dpb-col--op dpb-head-col dpb-head-col--ops">操作</div>
+                <div class="dpb-col dpb-head-col dpb-head-col--ops">操作</div>
               </div>
 
               <div
@@ -178,14 +188,13 @@
                 <div class="dpb-col dpb-col--flag">
                   <span class="dpb-flag-text">{{ fmtBool(row.is_special_price) }}</span>
                 </div>
-                <div class="dpb-col dpb-col--flag">
-                  <el-tag
-                    size="small"
-                    :type="isTruthy(row.is_valid) ? 'success' : 'info'"
-                    effect="plain"
+                <div class="dpb-col dpb-col--flag dpb-col--valid">
+                  <span
+                    class="dpb-valid-text"
+                    :class="isTruthy(row.is_valid) ? 'is-on' : 'is-off'"
                   >
-                    {{ isTruthy(row.is_valid) ? '启用' : '停用' }}
-                  </el-tag>
+                    {{ fmtValidStatus(row.is_valid) }}
+                  </span>
                 </div>
                 <div class="dpb-col dpb-col--op">
                   <span class="dpb-op-link dpb-op-link--special" @click="openSpecialPrice(row)">特殊定价</span>
@@ -226,6 +235,22 @@
         将以下定价参数应用到已选 <strong>{{ batchEditRows.length }}</strong> 条价格本（客户：{{ activeCompanyLabel }}）。
       </p>
       <el-form ref="formRef" :model="form" :rules="formRules" label-width="120px" size="small" class="dpb-form">
+        <div v-if="formMode === 'batch'" class="dpb-form-batch-tools">
+          <div class="dpb-form-switch-bar dpb-form-switch-bar--batch">
+            <div class="dpb-form-switch-item">
+              <span class="dpb-form-switch-label">是否启用</span>
+              <el-switch v-model="form.is_valid" />
+            </div>
+            <div class="dpb-form-switch-item">
+              <span class="dpb-form-switch-label">支持承兑</span>
+              <el-switch v-model="form.is_support_acceptance" />
+            </div>
+            <div class="dpb-form-switch-item">
+              <span class="dpb-form-switch-label">是否特价</span>
+              <el-switch v-model="form.is_special_price" />
+            </div>
+          </div>
+        </div>
         <template v-if="formMode !== 'batch'">
           <el-row :gutter="16" class="dpb-form-meta-row">
             <el-col :span="16">
@@ -251,23 +276,19 @@
               </el-form-item>
             </el-col>
           </el-row>
+          <el-row :gutter="20" class="dpb-form-switch-row">
+            <el-col :span="8" :offset="4">
+              <el-form-item label="支持承兑" label-position="top" class="dpb-form-item--switch">
+                <el-switch v-model="form.is_support_acceptance" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="是否特价" label-position="top" class="dpb-form-item--switch">
+                <el-switch v-model="form.is_special_price" />
+              </el-form-item>
+            </el-col>
+          </el-row>
         </template>
-        <el-form-item v-else label="是否启用" class="dpb-form-item--switch-inline">
-          <el-switch v-model="form.is_valid" />
-        </el-form-item>
-
-        <el-row :gutter="20" class="dpb-form-switch-row">
-          <el-col :span="8" :offset="4">
-            <el-form-item label="支持承兑" label-position="top" class="dpb-form-item--switch">
-              <el-switch v-model="form.is_support_acceptance" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="是否特价" label-position="top" class="dpb-form-item--switch">
-              <el-switch v-model="form.is_special_price" />
-            </el-form-item>
-          </el-col>
-        </el-row>
 
         <div class="dpb-form-block">
           <div class="dpb-form-block-hd">定价参数</div>
@@ -305,9 +326,11 @@
                 type="button"
                 class="dpb-form-bill-tab"
                 :class="{ 'is-active': activeEditBillCode === code }"
+                :title="editBillTabTitle(code)"
                 @click="activeEditBillCode = code"
               >
-                <span class="dpb-form-bill-tab-name">{{ editBillTabLabel(code) }}</span>
+                <span class="dpb-form-bill-tab-name">{{ editBillTabParts(code).name }}</span>
+                <span v-if="editBillTabParts(code).tax" class="dpb-form-bill-tab-tax">{{ editBillTabParts(code).tax }}%</span>
               </button>
             </div>
 
@@ -421,6 +444,20 @@
       :submitting="addingPriceBook"
       @confirm="onCategoryGoodsPicked"
     />
+
+    <el-dialog
+      v-model="calculateDebugVisible"
+      :title="calculateDebugTitle"
+      width="760px"
+      class="dpb-calc-debug-dlg"
+      :close-on-click-modal="false"
+      destroy-on-close
+    >
+      <pre class="dpb-calc-debug-pre">{{ calculateDebugText }}</pre>
+      <template #footer>
+        <el-button type="primary" @click="calculateDebugVisible = false">关闭</el-button>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
@@ -434,6 +471,7 @@ import DealerPriceSceneGoodsDlg from './DealerPriceSceneGoodsDlg.vue'
 import DealerPriceCategoryGoodsDlg from './DealerPriceCategoryGoodsDlg.vue'
 import DealerPriceSpecialPriceDlg from './DealerPriceSpecialPriceDlg.vue'
 import {
+  applyCustomerPriceCustomSnapshot,
   customerPriceAdd,
   customerPriceListed,
   customerPriceRemove,
@@ -441,6 +479,7 @@ import {
   createEmptyCustomerPriceForm,
   customerPriceFormFromRow,
   fetchCustomerPriceGoodsCodes,
+  formatCustomerPriceBillBucketLabel,
   formatCustomerPriceAmount,
   formatCustomerPriceGoodsDisplay,
   formatCustomerPriceMonths,
@@ -458,6 +497,13 @@ import {
   normalizeFinanceBillType,
 } from '@/utils/financeBillTypes'
 import { pickDisplayCode, pickDisplayName } from '@/utils/warehouseOpsDisplay'
+import {
+  PRICING_TAXPAYER_DEFAULT,
+  PRICING_TRADE_DOMESTIC,
+  formatPricingCalculateDebug,
+  pickPricingCalculateError,
+  pricingCalculate,
+} from '@/api/pricingTable'
 
 defineOptions({ name: 'DealerPriceBook' })
 
@@ -504,12 +550,19 @@ const dialogVisible = ref(false)
 const specialPriceDlgVisible = ref(false)
 /** @type {import('vue').Ref<object|null>} */
 const specialPriceRow = ref(null)
+/** listed 未回传 special_amount 时，用最近一次保存快照兜底 */
+const lastCustomSaveByCode = new Map()
 const formMode = ref('add') // add | edit | batch
 const editPriceCode = ref('')
 const batchEditRows = ref([])
 const formRef = ref()
 const selected = ref(new Set())
 
+const calculateDebugVisible = ref(false)
+const calculateDebugTitle = ref('算价 debug')
+const calculateDebugText = ref('')
+const batchCalculating = ref(false)
+
 const formDialogTitle = computed(() => {
   if (formMode.value === 'batch') return `批量修改价格本（${batchEditRows.value.length} 条）`
   if (formMode.value === 'edit') return '编辑价格本'
@@ -599,9 +652,35 @@ function assignFormFromRow(row) {
   pickInitialEditBill()
 }
 
-function editBillTabLabel(code) {
-  const c = String(code || '').trim()
-  return expenseBillNameMap.value[c] || c || '—'
+function editBillTabParts(code) {
+  const key = String(code || '').trim()
+  const perf = form.excess_performance_buckets?.[key]
+  const benefit = form.benefit_buckets?.[key]
+  const meta = perf || benefit
+  if (meta?.bill_label) {
+    const tax = meta.bill_tax
+    const taxText = tax != null && tax !== '' && Number.isFinite(Number(tax))
+      ? String(Number(tax))
+      : ''
+    return { name: meta.bill_label, tax: taxText }
+  }
+  if (key.includes('|')) {
+    const [name, tax] = key.split('|')
+    return {
+      name: String(name || key).trim() || '—',
+      tax: String(tax ?? '').trim(),
+    }
+  }
+  const mapped = expenseBillNameMap.value[key]
+  if (mapped) return { name: mapped, tax: '' }
+  return { name: key || '—', tax: '' }
+}
+
+function editBillTabTitle(code) {
+  const key = String(code || '').trim()
+  const perf = form.excess_performance_buckets?.[key]
+  const benefit = form.benefit_buckets?.[key]
+  return formatCustomerPriceBillBucketLabel(key, perf || benefit)
 }
 
 function pickInitialEditBill() {
@@ -656,6 +735,74 @@ function fmtBool(v) {
   return '—'
 }
 
+function fmtValidStatus(v) {
+  if (v === true || v === 1 || v === '1') return '启用'
+  if (v === false || v === 0 || v === '0') return '停用'
+  return '—'
+}
+
+function buildPricingCalculateBody(row) {
+  const goods_code = String(row?.goods_code ?? '').trim()
+  const customer_price_code = pickCustomerPriceCode(row)
+  return {
+    taxpayer_type: PRICING_TAXPAYER_DEFAULT,
+    trade_type: PRICING_TRADE_DOMESTIC,
+    goods_code,
+    customer_price_code,
+  }
+}
+
+function pricingCalculateRowLabel(row) {
+  const name = pickGoodsDisplayName(row)
+  const code = String(row?.goods_code ?? '').trim()
+  if (name && code && name !== code) return `${name}（${code}）`
+  return name || code || '—'
+}
+
+function openCalculateDebug(title, debugText) {
+  calculateDebugTitle.value = title
+  calculateDebugText.value = String(debugText ?? '').trim()
+  calculateDebugVisible.value = true
+}
+
+async function runBatchCalculate() {
+  const targets = selectedEditableRows.value.filter((row) => {
+    const goods_code = String(row?.goods_code ?? '').trim()
+    const customer_price_code = pickCustomerPriceCode(row)
+    return goods_code && customer_price_code
+  })
+  if (!targets.length) {
+    ElMessage.warning('请先勾选可计算的物料')
+    return
+  }
+  if (batchCalculating.value) return
+
+  batchCalculating.value = true
+  const parts = []
+  let failCount = 0
+
+  for (let i = 0; i < targets.length; i += 1) {
+    const row = targets[i]
+    const label = pricingCalculateRowLabel(row)
+    parts.push(`========== ${i + 1}/${targets.length} · ${label} ==========`)
+    try {
+      const res = await pricingCalculate(buildPricingCalculateBody(row))
+      const debug = formatPricingCalculateDebug(res)
+      parts.push(debug || '（无 debug 内容）')
+    } catch (e) {
+      failCount += 1
+      parts.push(`【失败】${pickPricingCalculateError(e)}`)
+    }
+    if (i < targets.length - 1) parts.push('')
+  }
+
+  batchCalculating.value = false
+  openCalculateDebug(
+    `批量算价 debug · ${targets.length} 条${failCount ? `（${failCount} 条失败）` : ''}`,
+    parts.join('\n'),
+  )
+}
+
 function fmtNum(v) {
   if (v == null || v === '') return '—'
   const n = Number(v)
@@ -884,8 +1031,16 @@ function openSpecialPrice(row) {
   specialPriceDlgVisible.value = true
 }
 
-async function onSpecialPriceSaved() {
+async function onSpecialPriceSaved(snapshot) {
+  const code = String(snapshot?.customer_price_code || '').trim()
+  if (code) lastCustomSaveByCode.set(code, snapshot)
   await loadData()
+  if (!code || !lastCustomSaveByCode.has(code)) return
+  const saved = lastCustomSaveByCode.get(code)
+  rows.value = rows.value.map((row) => {
+    if (pickCustomerPriceCode(row) !== code) return row
+    return applyCustomerPriceCustomSnapshot(row, saved)
+  })
 }
 
 function openBatchEdit() {
@@ -1100,6 +1255,17 @@ onMounted(() => {
   gap: 8px;
   min-height: 24px;
 }
+.dpb-batch-calc-btn.el-button--success:not(.is-disabled) {
+  --el-button-bg-color: #16a34a;
+  --el-button-border-color: #15803d;
+  --el-button-hover-bg-color: #22c55e;
+  --el-button-hover-border-color: #16a34a;
+  --el-button-active-bg-color: #15803d;
+  --el-button-active-border-color: #166534;
+  font-weight: 700;
+  letter-spacing: 0.02em;
+  box-shadow: 0 1px 4px rgba(22, 163, 74, 0.35);
+}
 .dpb-selected-meta {
   font-size: 13px;
   color: #409eff;
@@ -1125,7 +1291,8 @@ onMounted(() => {
 }
 
 .dpb-flex-table {
-  --dpb-cols: 36px 12fr 7fr minmax(2.5em, 48px) minmax(3.5em, 68px) 7fr 7fr minmax(5em, 84px) 7fr minmax(2.5em, 48px) 4fr 196px;
+  --dpb-op-col: minmax(136px, max-content);
+  --dpb-cols: 36px 12fr 7fr minmax(2.5em, 48px) minmax(3.5em, 68px) 8fr 7fr minmax(5em, 84px) 8fr minmax(2.5em, 48px) minmax(3em, 52px) var(--dpb-op-col);
   flex: 1;
   min-height: 0;
   display: flex;
@@ -1198,8 +1365,15 @@ onMounted(() => {
 }
 .dpb-flex-head .dpb-col--pair { text-align: right; padding-right: 20px; }
 .dpb-flex-head .dpb-col--flag,
-.dpb-flex-head .dpb-col--op,
 .dpb-flex-head .dpb-col--sel { text-align: center; }
+.dpb-flex-head .dpb-col--flag.dpb-head-col,
+.dpb-flex-head .dpb-head-col--ops {
+  justify-content: center;
+  text-align: center;
+  align-items: flex-end;
+  padding-left: 0;
+  padding-right: 0;
+}
 .dpb-flex-head .dpb-col--sel {
   align-items: flex-end;
   justify-content: center;
@@ -1221,10 +1395,7 @@ onMounted(() => {
 .dpb-flex-head .dpb-col--pair {
   justify-content: flex-end;
 }
-.dpb-flex-head .dpb-col--flag,
-.dpb-flex-head .dpb-col--op {
-  justify-content: center;
-}
+
 .dpb-head-sub {
   font-weight: 400;
   font-size: calc(11px + var(--wh-fs-delta, 0px));
@@ -1371,21 +1542,47 @@ onMounted(() => {
 }
 .dpb-col--flag {
   display: flex;
-  align-items: center;
   justify-content: center;
 }
+.dpb-flex-data .dpb-col--flag {
+  align-items: center;
+}
 .dpb-flag-text {
   font-family: 'DingTalk_JinBuTi_Regular', sans-serif;
   font-size: calc(13px + var(--wh-fs-delta, 0px));
   color: #606266;
 }
+.dpb-col--valid {
+  justify-content: center;
+}
+.dpb-valid-text {
+  font-family: 'DingTalk_JinBuTi_Regular', sans-serif;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
+  font-weight: 600;
+  white-space: nowrap;
+}
+.dpb-valid-text.is-on { color: #67c23a; }
+.dpb-valid-text.is-off { color: #909399; }
+
 .dpb-col--op {
+  min-width: 0;
+}
+.dpb-flex-data .dpb-col--op {
   display: flex;
   align-items: center;
-  justify-content: center;
-  flex-wrap: wrap;
-  gap: 8px 18px;
-  padding: 0 4px;
+  justify-content: space-between;
+  width: 100%;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  box-sizing: border-box;
+}
+.dpb-flex-data .dpb-col--op .dpb-op-link {
+  flex: 0 0 auto;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  text-align: center;
 }
 
 .dpb-name {
@@ -1435,6 +1632,21 @@ onMounted(() => {
 .dpb-op-link--muted { color: #909399; }
 .dpb-op-link--muted:hover { color: #606266; }
 
+.dpb-calc-debug-pre {
+  margin: 0;
+  max-height: min(68vh, 640px);
+  overflow: auto;
+  padding: 12px 14px;
+  background: #1e1e1e;
+  color: #d4d4d4;
+  border-radius: 6px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  font-size: 12px;
+  line-height: 1.55;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
 .dpb-footer {
   flex-shrink: 0;
   padding: 10px 16px 14px;
@@ -1444,8 +1656,11 @@ onMounted(() => {
 }
 
 .dpb-form-num {
-  width: 108px;
-  max-width: 100%;
+  width: var(--dpb-param-input-w, 96px);
+  flex-shrink: 0;
+}
+.dpb-form-num :deep(.el-input) {
+  width: var(--dpb-param-input-w, 96px);
 }
 .dpb-form :deep(.el-form-item) {
   margin-bottom: 16px;
@@ -1487,13 +1702,16 @@ onMounted(() => {
 .dpb-form-bill-tabs {
   display: flex;
   flex-wrap: wrap;
+  align-items: center;
   gap: 6px;
   margin-bottom: 14px;
 }
 .dpb-form-bill-tab {
+  flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   gap: 4px;
+  max-width: 160px;
   padding: 4px 10px;
   border: 1px solid #dcdfe6;
   border-radius: 4px;
@@ -1501,6 +1719,12 @@ onMounted(() => {
   font-size: 12px;
   color: #606266;
   cursor: pointer;
+  transition: border-color 0.15s, background 0.15s, color 0.15s;
+}
+.dpb-form-bill-tab:hover {
+  border-color: #c6d8f5;
+  background: #ecf5ff;
+  color: #409eff;
 }
 .dpb-form-bill-tab.is-active {
   border-color: #409eff;
@@ -1508,7 +1732,14 @@ onMounted(() => {
   color: #409eff;
   font-weight: 600;
 }
+.dpb-form-bill-tab-name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
 .dpb-form-bill-tab-tax {
+  flex-shrink: 0;
   font-size: 11px;
   color: #e6a23c;
 }
@@ -1516,8 +1747,7 @@ onMounted(() => {
   color: #cf9236;
 }
 .dpb-form-param-shell {
-  --dpb-param-label-w: 7.5em;
-  --dpb-param-input-w: 108px;
+  --dpb-param-input-w: 96px;
   --dpb-param-gap: 10px;
   display: flex;
   flex-direction: column;
@@ -1528,16 +1758,16 @@ onMounted(() => {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  gap: 8px 32px;
+  gap: 10px 28px;
 }
 .dpb-form-param-pair {
-  display: grid;
-  grid-template-columns: var(--dpb-param-label-w) var(--dpb-param-input-w);
+  display: flex;
+  flex: 0 0 auto;
   align-items: center;
-  column-gap: var(--dpb-param-gap);
+  gap: var(--dpb-param-gap);
 }
 .dpb-form-param-label {
-  justify-self: start;
+  flex: 0 0 auto;
   text-align: left;
   font-size: 13px;
   line-height: 1.4;
@@ -1546,16 +1776,20 @@ onMounted(() => {
   cursor: default;
 }
 .dpb-form-param-rate {
-  display: grid;
-  grid-template-columns: var(--dpb-param-label-w) 1fr;
-  align-items: center;
-  column-gap: var(--dpb-param-gap);
-}
-.dpb-form-rate-fields {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  gap: 10px 20px;
+  gap: var(--dpb-param-gap);
+}
+.dpb-form-param-rate > .dpb-form-param-label {
+  min-width: 5.5em;
+}
+.dpb-form-rate-fields {
+  display: flex;
+  flex: 0 0 auto;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 10px 16px;
 }
 .dpb-form-rate-field {
   display: flex;
@@ -1579,7 +1813,7 @@ onMounted(() => {
 }
 .dpb-form-batch-tip {
   margin: 0 0 14px;
-  padding: 10px 12px;
+  padding: 10px 14px;
   background: #f4f8ff;
   border-radius: 6px;
   font-size: 13px;
@@ -1589,6 +1823,85 @@ onMounted(() => {
 </style>
 
 <style>
+/* 仅批量弹窗：三开关单行（append-to-body 须非 scoped） */
+.dpb-form-dlg .dpb-form-batch-tools {
+  padding: 0 14px;
+  margin-bottom: 14px;
+  box-sizing: border-box;
+}
+.dpb-form-dlg .dpb-form-switch-bar--batch {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 20px;
+  width: 100%;
+  box-sizing: border-box;
+}
+.dpb-form-dlg .dpb-form-switch-bar--batch .dpb-form-switch-item {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  gap: 8px;
+  flex: 0 0 auto;
+  white-space: nowrap;
+}
+.dpb-form-dlg .dpb-form-switch-bar--batch .dpb-form-switch-label {
+  flex-shrink: 0;
+  font-size: 13px;
+  line-height: 1;
+  color: #606266;
+  white-space: nowrap;
+}
+.dpb-form-dlg .dpb-form-bill-tabs {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 6px;
+  margin-bottom: 14px;
+}
+.dpb-form-dlg .dpb-form-bill-tab {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  max-width: 160px;
+  padding: 4px 10px;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  background: #fff;
+  font-size: 12px;
+  color: #606266;
+  cursor: pointer;
+  transition: border-color 0.15s, background 0.15s, color 0.15s;
+}
+.dpb-form-dlg .dpb-form-bill-tab:hover {
+  border-color: #c6d8f5;
+  background: #ecf5ff;
+  color: #409eff;
+}
+.dpb-form-dlg .dpb-form-bill-tab.is-active {
+  border-color: #409eff;
+  background: #ecf5ff;
+  color: #409eff;
+  font-weight: 600;
+}
+.dpb-form-dlg .dpb-form-bill-tab-name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
+.dpb-form-dlg .dpb-form-bill-tab-tax {
+  flex-shrink: 0;
+  font-size: 11px;
+  color: #e6a23c;
+}
+.dpb-form-dlg .dpb-form-bill-tab.is-active .dpb-form-bill-tab-tax {
+  color: #cf9236;
+}
 .dpb-metric-tooltip {
   white-space: pre-line;
   max-width: 320px;
diff --git a/src/views/dealer/DealerPriceSpecialPriceDlg.vue b/src/views/dealer/DealerPriceSpecialPriceDlg.vue
index 6583038..de5f88e 100644
--- a/src/views/dealer/DealerPriceSpecialPriceDlg.vue
+++ b/src/views/dealer/DealerPriceSpecialPriceDlg.vue
@@ -144,7 +144,7 @@
                     :class="{ 'is-active': activeCustomBucketTab === key }"
                     @click="activeCustomBucketTab = key"
                   >
-                    <span class="dps-bucket-tab-name">{{ key }}</span>
+                    <span class="dps-bucket-tab-name">{{ customBucketTabLabel(key) }}</span>
                   </button>
                 </div>
 
@@ -231,11 +231,11 @@
         <div class="dps-footer-price">
           <label class="dps-footer-label">特殊售价</label>
           <el-input-number
-            v-model="specialSalePrice"
+            v-model="customForm.special_amount"
             :controls="false"
             :precision="2"
-            disabled
-            placeholder="待计算"
+            :min="0"
+            placeholder="请输入"
             class="dps-footer-input"
           />
         </div>
@@ -266,7 +266,9 @@ import { getMaterialDetail } from '@/api/material'
 import {
   createEmptyCustomerPriceCustomForm,
   customerPriceCustomFormFromRow,
+  formatCustomerPriceBillBucketLabel,
   formatCustomerPriceGoodsDisplay,
+  buildCustomerPriceCustomWriteBody,
   formatCustomerPriceAmount,
   formatCustomerPriceRate,
   listCustomerPriceJsonBucketKeys,
@@ -308,7 +310,6 @@ const saving = ref(false)
 const removing = ref(false)
 const loadError = ref('')
 const activeRdcCode = ref('')
-const specialSalePrice = ref(null)
 /** @type {import('vue').Ref<object>} */
 const goodsWarehouse = ref({})
 const rdcOptions = ref([])
@@ -461,6 +462,12 @@ function resetCustomForm() {
   pickInitialCustomBucket()
 }
 
+function customBucketTabLabel(key) {
+  const perf = customForm.excess_performance_buckets?.[key]
+  const benefit = customForm.benefit_buckets?.[key]
+  return formatCustomerPriceBillBucketLabel(key, perf || benefit)
+}
+
 function normBillCode(code) {
   return String(code ?? '').trim()
 }
@@ -577,9 +584,11 @@ async function onConfirm() {
   }
   saving.value = true
   try {
+    const customer_price_code = pickCustomerPriceCode(row)
     await persistCustomerPriceModifyCustom(row, customForm)
+    const savedSnapshot = buildCustomerPriceCustomWriteBody(customForm, { customer_price_code })
     ElMessage.success('自定义已保存')
-    emit('saved')
+    emit('saved', savedSnapshot)
     visible.value = false
   } catch (e) {
     ElMessage.error(e?.data?.message || e?.message || '保存失败')
@@ -624,7 +633,6 @@ function onClosed() {
   activeTradeBillCode.value = ''
   activeCustomBucketTab.value = ''
   activeRdcCode.value = ''
-  specialSalePrice.value = null
   Object.assign(customForm, createEmptyCustomerPriceCustomForm())
 }
 
diff --git a/src/views/login/Login.vue b/src/views/login/Login.vue
index 95ebc22..5b9140e 100755
--- a/src/views/login/Login.vue
+++ b/src/views/login/Login.vue
@@ -8,33 +8,80 @@
     />
 
     <div
-      v-if="!showLoginForm && !loginSucceeded"
+      v-if="pageReady && !showLoginForm && !loginSucceeded"
       class="click-overlay"
       @click="handleScreenClick"
     ></div>
 
     <transition name="fade">
       <div v-if="!showLoginForm && !loginSucceeded" class="login-hint">
-        <p class="hint-text">请点击登录</p>
+        <p class="hint-text">{{ hintText }}</p>
+        <el-button
+          v-if="bootstrapFailed"
+          class="hint-retry"
+          type="primary"
+          @click="retryBootstrap"
+        >
+          重试
+        </el-button>
       </div>
     </transition>
   </div>
 </template>
 
 <script setup>
-import { onUnmounted, ref } from 'vue'
+import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { useRouter } from 'vue-router'
+import { useAppBootstrapStore } from '@/store/modules/appBootstrap'
+import { runAppBootstrap } from '@/utils/runAppBootstrap'
 import LoginFormModal from './components/LoginFormModal.vue'
 import WeatherInfo from './components/WeatherInfo.vue'
 
 const router = useRouter()
+const bootstrapStore = useAppBootstrapStore()
 
 const showLoginForm = ref(false)
 const loginSucceeded = ref(false)
+const pageReady = ref(false)
+const bootstrapFailed = ref(false)
+let bootstrapping = false
 let idleTimer = null
 
+const hintText = computed(() => {
+  if (bootstrapFailed.value) return '系统初始化失败'
+  if (!pageReady.value) return '系统初始化中…'
+  return '请点击登录'
+})
+
+async function finishBootstrap() {
+  if (bootstrapping) return
+  if (bootstrapStore.ready) {
+    pageReady.value = true
+    return
+  }
+  bootstrapping = true
+  bootstrapFailed.value = false
+  try {
+    await runAppBootstrap()
+    bootstrapStore.markReady()
+    pageReady.value = true
+  } catch {
+    bootstrapFailed.value = true
+  } finally {
+    bootstrapping = false
+  }
+}
+
+function retryBootstrap() {
+  void finishBootstrap()
+}
+
+onMounted(() => {
+  void finishBootstrap()
+})
+
 const handleScreenClick = () => {
-  if (!showLoginForm.value) {
+  if (pageReady.value && !showLoginForm.value) {
     showLoginForm.value = true
     resetIdleTimer()
   }
@@ -75,6 +122,11 @@ onUnmounted(() => {
   align-items: center;
   justify-content: center;
   overflow: hidden;
+  padding:
+    env(safe-area-inset-top, 0)
+    env(safe-area-inset-right, 0)
+    env(safe-area-inset-bottom, 0)
+    env(safe-area-inset-left, 0);
   background: url('/map.png') center center / cover no-repeat;
   background: image-set(
       url('/map.webp') type('image/webp'),
@@ -97,10 +149,18 @@ onUnmounted(() => {
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 6;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 24px;
   pointer-events: none;
   user-select: none;
 }
 
+.hint-retry {
+  pointer-events: auto;
+}
+
 .hint-text {
   font-size: 28px;
   font-weight: 500;
diff --git a/src/views/login/components/WeatherInfo.vue b/src/views/login/components/WeatherInfo.vue
index e7d3e1c..f38756e 100755
--- a/src/views/login/components/WeatherInfo.vue
+++ b/src/views/login/components/WeatherInfo.vue
@@ -187,8 +187,8 @@ onMounted(() => {
 <style scoped>
 .weather-info {
   position: fixed;
-  top: 16px;
-  left: 16px;
+  top: calc(16px + env(safe-area-inset-top, 0));
+  left: calc(16px + env(safe-area-inset-left, 0));
   z-index: 100;
   display: flex;
   align-items: center;
@@ -212,8 +212,8 @@ onMounted(() => {
 /* 大屏幕 */
 @media (min-width: 640px) {
   .weather-info {
-    top: 20px;
-    left: 32px;
+    top: calc(20px + env(safe-area-inset-top, 0));
+    left: calc(32px + env(safe-area-inset-left, 0));
     gap: 12px;
   }
 }
@@ -291,8 +291,8 @@ onMounted(() => {
 /* 移动端适配 - 移除大屏媒体查询，直接用默认样式 */
 @media (max-width: 639px) {
   .weather-info {
-    top: 16px;
-    left: 16px;
+    top: calc(16px + env(safe-area-inset-top, 0));
+    left: calc(16px + env(safe-area-inset-left, 0));
     padding: 8px 12px;
     gap: 6px;
   }
diff --git a/src/views/material/MaterialList.vue b/src/views/material/MaterialList.vue
index b2f133a..0c6f35e 100755
--- a/src/views/material/MaterialList.vue
+++ b/src/views/material/MaterialList.vue
@@ -10,16 +10,155 @@
 <template>
   <div class="material-page">
 
-    <!-- 页面 Header -->
-    <div class="ml-page-header">
+    <!-- 页面 Header（桌面） -->
+    <div class="ml-page-header ml-desktop-only">
       <div class="ml-header-left">
         <span class="ml-page-title">物料列表</span>
         <span class="ml-page-desc">管理并维护物料基础数据，需先在物料分类中设置末端分类</span>
       </div>
     </div>
 
-    <!-- 主卡片 -->
-    <div class="ml-card">
+    <!-- 移动 / Pad（≤992px，与 layouts 底栏断点一致） -->
+    <div v-if="isCompactView" class="ml-compact">
+      <header class="ml-compact-header">
+        <button
+          v-if="mlCompactView !== 'browse' || mlCompactStack.length"
+          type="button"
+          class="ml-compact-back"
+          aria-label="返回"
+          @click="mlCompactBack"
+        >
+          <el-icon><ArrowLeft /></el-icon>
+        </button>
+        <div class="ml-compact-header-main">
+          <h1 class="ml-compact-title">{{ mlCompactHeaderTitle }}</h1>
+          <p v-if="mlCompactBreadcrumb" class="ml-compact-breadcrumb">{{ mlCompactBreadcrumb }}</p>
+        </div>
+      </header>
+
+      <div class="ml-compact-search">
+        <el-input
+          v-model="query.keyword"
+          placeholder="搜索名称、编码..."
+          :prefix-icon="Search"
+          clearable
+          @keyup.enter="mlCompactRunSearch"
+        />
+        <el-button type="primary" @click="mlCompactRunSearch">搜索</el-button>
+      </div>
+
+      <!-- 分类浏览 -->
+      <section v-if="mlCompactView === 'browse'" class="ml-compact-body" v-loading="categoryTreeLoading">
+        <button
+          v-for="cat in mlCompactCategories"
+          :key="cat.id"
+          type="button"
+          class="ml-compact-cat-row"
+          @click="mlCompactEnterCategory(cat)"
+        >
+          <el-icon class="ml-compact-cat-icon" :class="{ 'is-final': cat.isFinal }">
+            <component :is="cat.isFinal ? Document : Folder" />
+          </el-icon>
+          <span class="ml-compact-cat-label">{{ cat.label }}</span>
+          <el-tag v-if="cat.isFinal" size="small" type="success" effect="plain">末端</el-tag>
+          <el-icon class="ml-compact-cat-arrow"><ArrowRight /></el-icon>
+        </button>
+        <div v-if="!categoryTreeLoading && !mlCompactCategories.length" class="ml-compact-empty">暂无分类</div>
+      </section>
+
+      <!-- 物料卡片 -->
+      <section v-else-if="mlCompactView === 'list'" class="ml-compact-body" v-loading="loading">
+        <div v-if="!loading && !tableData.length" class="ml-compact-empty">
+          {{ query.keyword ? `未找到与「${query.keyword}」相关的物料` : '暂无物料' }}
+        </div>
+        <button
+          v-for="row in tableData"
+          :key="mlRowKey(row)"
+          type="button"
+          class="ml-compact-goods-card"
+          @click="mlCompactOpenDetail(row)"
+        >
+          <div class="ml-compact-goods-name">{{ row.name || row.goods_name || row.goods_code }}</div>
+          <div class="ml-compact-goods-meta">
+            <span>{{ row.goods_code }}</span>
+            <span v-if="mlListCategoryLabel(row)">{{ mlListCategoryLabel(row) }}</span>
+          </div>
+        </button>
+        <div v-if="total > tableData.length" class="ml-compact-more">
+          <el-button :loading="loading" @click="mlCompactLoadMore">加载更多</el-button>
+        </div>
+      </section>
+
+      <!-- 详情：复用桌面组件，仅布局适配移动/Pad -->
+      <section v-else class="ml-compact-body ml-compact-detail" v-loading="mlCompactDetailLoading">
+        <div class="ml-compact-summary">
+          <div class="ml-compact-summary-row">
+            <span>物料编码</span>
+            <span>{{ mlCompactSummary.goodsCode || '—' }}</span>
+          </div>
+          <div class="ml-compact-summary-row">
+            <span>分类</span>
+            <span>{{ mlCompactSummary.categoryName || '—' }}</span>
+          </div>
+        </div>
+        <el-collapse v-model="mlCompactSections" class="ml-compact-collapse">
+          <el-collapse-item title="财务管理" name="finance">
+            <div v-if="mlCompactViewCat" class="ml-compact-mf-pane">
+              <MaterialFormTabPaneBody
+                v-if="mlSlotGlobalTabForCat(mlCompactViewCat.category_code, 'finance')"
+                flatten-groups
+                :cat="mlCompactViewCat"
+                :tab="mlSlotGlobalTabForCat(mlCompactViewCat.category_code, 'finance')"
+              />
+              <el-empty v-else :image-size="56" description="暂未配置财务管理页签" />
+            </div>
+          </el-collapse-item>
+          <el-collapse-item title="仓库管理" name="warehouse">
+            <div class="ml-compact-mf-pane ml-compact-mf-pane--warehouse">
+              <GlobalTabWarehousePanel
+                v-model="materialForm.goodsGlobal.warehouse"
+                :rdc-list="materialWarehouseRdcs"
+              />
+            </div>
+          </el-collapse-item>
+          <el-collapse-item title="成本围栏" name="cost">
+            <div class="ml-compact-mf-pane ml-compact-mf-pane--cost">
+              <GlobalTabCostPanel
+                :goods-code="materialEditingId || ''"
+                :rdc-list="materialWarehouseRdcs"
+              />
+            </div>
+          </el-collapse-item>
+          <el-collapse-item title="基础属性" name="basic">
+            <div v-if="mlCompactViewCat" class="ml-compact-mf-pane ml-compact-mf-pane--basic">
+              <el-form :model="mlCompactViewCat" label-width="90px" size="default" class="mf-cat-name-form">
+                <el-form-item label="物料名称">
+                  <el-input v-model="mlCompactViewCat.name" readonly style="width:100%" />
+                </el-form-item>
+                <el-form-item label="虚拟物料">
+                  <span>{{ materialForm.is_virtual ? '是' : '否' }}</span>
+                </el-form-item>
+              </el-form>
+              <div class="mf-category-attr-block">
+                <el-tabs v-model="mlCompactViewCat.activeTabCode" class="mf-tabs">
+                  <el-tab-pane
+                    v-for="tab in mlCategoryTabsForCat(mlCompactViewCat.category_code)"
+                    :key="tab.code"
+                    :label="tab.name"
+                    :name="tab.code"
+                  >
+                    <MaterialFormTabPaneBody :cat="mlCompactViewCat" :tab="tab" />
+                  </el-tab-pane>
+                </el-tabs>
+              </div>
+            </div>
+          </el-collapse-item>
+        </el-collapse>
+      </section>
+    </div>
+
+    <!-- 主卡片（桌面） -->
+    <div class="ml-card ml-desktop-only">
 
     <!-- 顶部筛选栏 -->
     <div class="filter-bar">
@@ -2405,7 +2544,7 @@ import { uploadAsset } from '@/utils/uploadAsset'
 import { getAssetUrl } from '@/config/assets'
 import { isFieldVisible, isOptionVisible, evalFormulaValue, evalFormulaFieldValue, isFieldRequired, isNumberFieldEmpty, applyConfigConstantsToValueMap, mergeFormulaFieldValuesIntoTabPayload } from '@/utils/fieldVisibility'
 import { coerceBooleanFieldValue } from '@/utils/tabFieldPalette'
-import { normalizeBusinessTypeFieldValue, isEmptyBusinessTypeFieldValue, serializeTabValuesBusinessTypeRefs } from '@/utils/businessTypeFieldValue'
+import { normalizeBusinessTypeFieldValue, isEmptyBusinessTypeFieldValue, serializeTabValuesBusinessTypeRefs, parseBusinessTypeFieldRef } from '@/utils/businessTypeFieldValue'
 import {
   mergeGlobalTabsWithCategoryTabs,
   parseGlobalTabSnapshotsFromFields,
@@ -2580,7 +2719,146 @@ const editFormTab = ref('basic')
 
 const windowW  = ref(window.innerWidth)
 const isMobile = computed(() => windowW.value <= 600)
-window.addEventListener('resize', () => { windowW.value = window.innerWidth })
+/** 与 layouts 移动/Pad 壳断点一致 */
+const isCompactView = computed(() => windowW.value <= 992)
+function onWindowResize() { windowW.value = window.innerWidth }
+window.addEventListener('resize', onWindowResize)
+
+/** 移动/Pad：browse 分类 | list 卡片 | detail 只读 */
+const mlCompactView = ref('browse')
+const mlCompactStack = ref([])
+const mlCompactDetailLoading = ref(false)
+const mlCompactActiveGoods = ref(null)
+const mlCompactSections = ref(['finance', 'warehouse', 'cost', 'basic'])
+
+const mlCompactCategories = computed(() => {
+  if (!mlCompactStack.value.length) return treeData.value
+  const last = mlCompactStack.value[mlCompactStack.value.length - 1]
+  const node = _findCategoryNodeById(treeData.value, last.id)
+  return node?.children || []
+})
+
+/** 移动详情当前分类行（与桌面 materialForm.categories 同源） */
+const mlCompactViewCat = computed(() => {
+  const cc = String(
+    mlCompactActiveGoods.value?.category_code
+    || materialEditingCategoryCode.value
+    || activeCatCode.value
+    || '',
+  ).trim()
+  if (!materialForm.categories.length) return null
+  if (!cc) return materialForm.categories[0]
+  return materialForm.categories.find((c) => c.category_code === cc) || materialForm.categories[0]
+})
+
+const mlCompactHeaderTitle = computed(() => {
+  if (mlCompactView.value === 'detail') {
+    return mlCompactSummary.value.name || mlCompactSummary.value.goodsCode || '物料详情'
+  }
+  if (mlCompactView.value === 'list') {
+    return query.keyword?.trim() ? '搜索结果' : (categoryPath.value[categoryPath.value.length - 1]?.label || '物料列表')
+  }
+  return '物料列表'
+})
+
+const mlCompactBreadcrumb = computed(() => {
+  if (mlCompactView.value === 'detail') return mlCompactSummary.value.goodsCode
+  if (mlCompactView.value === 'list' && query.keyword?.trim()) return `关键词：${query.keyword.trim()}`
+  if (!mlCompactStack.value.length) return '选择分类浏览物料'
+  return mlCompactStack.value.map((n) => n.label).join(' / ')
+})
+
+const mlCompactSummary = computed(() => {
+  const row = mlCompactActiveGoods.value
+  const cat = mlCompactViewCat.value
+  return {
+    goodsCode: String(materialEditingId.value || row?.goods_code || '').trim(),
+    name: cat?.name || row?.name || row?.goods_name || '',
+    categoryName: cat?.category_name || mlListCategoryLabel(row) || '',
+  }
+})
+
+function mlCompactEnterCategory(cat) {
+  if (cat.isFinal) {
+    handleCategoryClick(cat)
+    mlCompactView.value = 'list'
+    return
+  }
+  mlCompactStack.value = [...mlCompactStack.value, { id: cat.id, label: cat.label }]
+}
+
+function mlCompactRunSearch() {
+  if (!query.keyword?.trim()) {
+    ElMessage.info('请输入搜索关键词')
+    return
+  }
+  mlCompactStack.value = []
+  mlCompactView.value = 'list'
+  query.page = 1
+  loadData()
+}
+
+function mlCompactLoadMore() {
+  if (loading.value || tableData.value.length >= total.value) return
+  const nextPage = query.page + 1
+  loading.value = true
+  void (async () => {
+    try {
+      let res
+      if (query.keyword?.trim()) {
+        res = await searchMaterial({ keyword: query.keyword.trim(), page: nextPage, pageSize: query.pageSize })
+      } else {
+        res = await getMaterialList({
+          categoryId: selectedCategoryId.value,
+          keyword: '',
+          page: nextPage,
+          pageSize: query.pageSize,
+        })
+      }
+      const list = Array.isArray(res.list) ? res.list : []
+      tableData.value = [...tableData.value, ...list]
+      total.value = res.total ?? tableData.value.length
+      query.page = nextPage
+    } catch (e) {
+      ElMessage.error(e?.data?.message || e?.message || '加载失败')
+    } finally {
+      loading.value = false
+    }
+  })()
+}
+
+async function mlCompactOpenDetail(row) {
+  mlCompactActiveGoods.value = row
+  mlCompactView.value = 'detail'
+  mlCompactDetailLoading.value = true
+  try {
+    await openMaterialDialog('edit', row, { hydrateOnly: true })
+    const cc = String(row?.category_code || materialEditingCategoryCode.value || '').trim()
+    if (cc) activeCatCode.value = cc
+  } catch (e) {
+    ElMessage.error(e?.data?.message || e?.message || '详情加载失败')
+    mlCompactView.value = 'list'
+  } finally {
+    mlCompactDetailLoading.value = false
+  }
+}
+
+function mlCompactBack() {
+  if (mlCompactView.value === 'detail') {
+    mlCompactView.value = 'list'
+    mlCompactActiveGoods.value = null
+    return
+  }
+  if (mlCompactView.value === 'list') {
+    mlCompactView.value = 'browse'
+    query.keyword = ''
+    clearCategoryFilter()
+    return
+  }
+  if (mlCompactStack.value.length) {
+    mlCompactStack.value = mlCompactStack.value.slice(0, -1)
+  }
+}
 
 /** 物料弹窗宽度（须与 template width 一致） */
 const MF_DIALOG_VW = 0.88
@@ -4051,11 +4329,12 @@ onMounted(() => {
     } finally {
       categoryTreeLoading.value = false
     }
-    await Promise.all([loadData(), loadGlobalTabRuntimeList()])
+    await Promise.all([loadData(), loadGlobalTabRuntimeList(), loadTabTemplates()])
   })()
 })
 
 onUnmounted(() => {
+  window.removeEventListener('resize', onWindowResize)
   document.removeEventListener('visibilitychange', _onVisibilityChange)
   destroySelSortables()
 })
@@ -8098,11 +8377,22 @@ function fsToggleGoodsMulti(cat, field, goodsCode) {
   fsSetTokensMulti(cat, field, cur)
 }
 
-async function openMaterialDialog(mode, row = null) {
+async function openMaterialDialog(mode, row = null, opts = {}) {
+  const hydrateOnly = !!opts?.hydrateOnly
   const rowCcEarly = String(row?.category_code || '').trim()
   const rowGcEarly = String(row?.goods_code || '').trim()
   if (
-    mode === 'edit' && rowGcEarly
+    hydrateOnly
+    && mode === 'edit'
+    && rowGcEarly
+    && materialEditingId.value === rowGcEarly
+    && materialForm.categories.length > 0
+  ) {
+    return
+  }
+  if (
+    !hydrateOnly
+    && mode === 'edit' && rowGcEarly
     && materialDialogVisible.value
     && materialEditingId.value === rowGcEarly
     && materialEditingCategoryCode.value === rowCcEarly
@@ -8125,7 +8415,9 @@ async function openMaterialDialog(mode, row = null) {
   featureSelectOptionsMap.value = {}
   mlActiveNavKey.value = ML_NAV_FINANCE
   materialDialogLoading.value = true
-  materialDialogVisible.value = true   // 立即打开弹窗，内部显示加载态
+  if (!hydrateOnly) {
+    materialDialogVisible.value = true   // 立即打开弹窗，内部显示加载态
+  }
 
   try {
     await loadGlobalTabRuntimeList()
@@ -8582,6 +8874,7 @@ async function openMaterialDialog(mode, row = null) {
     }
   } finally {
     if (materialDialogLoading.value) materialDialogLoading.value = false
+    if (hydrateOnly) return
     await nextTick()
     const dlg  = document.querySelector('.el-dialog.material-form-dialog')
     const body = dlg?.querySelector('.el-dialog__body')
@@ -12439,4 +12732,175 @@ provide('mlTabPaneCtx', {
 .mf-more-chip--asm.is-default { border-style: solid; }
 .mf-more-chip--asm.is-picked { background: #e6a23c; border-color: #e6a23c; color: #fff; }
 .mf-more-empty { font-size: 13px; color: #c0c4cc; text-align: center; padding: 16px 0; }
+
+/* ===== 移动 / Pad（≤992px，同 layouts 底栏） ===== */
+.ml-desktop-only { display: block; }
+.ml-compact { display: none; }
+
+@media (max-width: 992px) {
+  .ml-desktop-only { display: none !important; }
+  .ml-compact {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    background: #f5f7fa;
+    padding-bottom: env(safe-area-inset-bottom, 0);
+  }
+  .material-page {
+    height: 100%;
+    min-height: 0;
+  }
+}
+
+.ml-compact-header {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  padding: 12px 16px;
+  padding-top: calc(12px + env(safe-area-inset-top, 0));
+  background: #fff;
+  border-bottom: 1px solid #ebeef5;
+  flex-shrink: 0;
+}
+.ml-compact-back {
+  flex-shrink: 0;
+  width: 36px;
+  height: 36px;
+  border: none;
+  border-radius: 8px;
+  background: #f3f4f6;
+  color: #374151;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.ml-compact-header-main { min-width: 0; flex: 1; }
+.ml-compact-title {
+  margin: 0;
+  font-size: 17px;
+  font-weight: 600;
+  color: #303133;
+  line-height: 1.3;
+}
+.ml-compact-breadcrumb {
+  margin: 4px 0 0;
+  font-size: 12px;
+  color: #909399;
+  word-break: break-all;
+}
+.ml-compact-search {
+  display: flex;
+  gap: 8px;
+  padding: 10px 16px;
+  background: #fff;
+  border-bottom: 1px solid #f0f0f0;
+  flex-shrink: 0;
+}
+.ml-compact-search :deep(.el-input) { flex: 1; }
+.ml-compact-body {
+  flex: 1;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
+  padding: 12px 16px calc(80px + env(safe-area-inset-bottom, 0));
+  min-height: 0;
+}
+.ml-compact-detail {
+  padding-bottom: calc(88px + env(safe-area-inset-bottom, 0));
+}
+.ml-compact-cat-row,
+.ml-compact-goods-card {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 14px;
+  margin-bottom: 10px;
+  border: 1px solid #ebeef5;
+  border-radius: 12px;
+  background: #fff;
+  text-align: left;
+  cursor: pointer;
+}
+.ml-compact-goods-card {
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 6px;
+}
+.ml-compact-cat-icon { font-size: 20px; color: #e6a23c; }
+.ml-compact-cat-icon.is-final { color: #67c23a; }
+.ml-compact-cat-label { flex: 1; font-size: 15px; font-weight: 500; color: #303133; }
+.ml-compact-cat-arrow { color: #c0c4cc; }
+.ml-compact-goods-name { font-size: 16px; font-weight: 600; color: #303133; word-break: break-word; }
+.ml-compact-goods-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  font-size: 12px;
+  color: #909399;
+}
+.ml-compact-empty,
+.ml-compact-muted {
+  text-align: center;
+  color: #909399;
+  font-size: 14px;
+  padding: 32px 16px;
+}
+.ml-compact-more { display: flex; justify-content: center; padding: 8px 0; }
+.ml-compact-summary {
+  background: #fff;
+  border-radius: 12px;
+  padding: 12px 16px;
+  margin-bottom: 12px;
+  border: 1px solid #ebeef5;
+}
+.ml-compact-summary-row {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 8px 0;
+  font-size: 14px;
+  border-bottom: 1px dashed #f0f0f0;
+}
+.ml-compact-summary-row:last-child { border-bottom: none; }
+.ml-compact-summary-row > span:first-child { color: #909399; flex-shrink: 0; }
+.ml-compact-summary-row > span:last-child { color: #303133; text-align: right; word-break: break-word; }
+.ml-compact-collapse { border: none; background: transparent; }
+.ml-compact-collapse :deep(.el-collapse-item) {
+  margin-bottom: 10px;
+  border: 1px solid #ebeef5;
+  border-radius: 12px;
+  overflow: hidden;
+  background: #fff;
+}
+.ml-compact-collapse :deep(.el-collapse-item__header) {
+  padding: 0 16px;
+  height: 48px;
+  font-weight: 600;
+  border-bottom: none;
+}
+.ml-compact-collapse :deep(.el-collapse-item__wrap) { border-top: 1px solid #f0f0f0; }
+.ml-compact-collapse :deep(.el-collapse-item__content) { padding: 12px 16px 16px; }
+.ml-compact-mf-pane {
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
+  min-width: 0;
+}
+.ml-compact-mf-pane :deep(.mf-fields-grid),
+.ml-compact-mf-pane :deep(.mf-global-tab-flat) {
+  min-width: min(100%, 720px);
+}
+.ml-compact-mf-pane--warehouse :deep(.gt-wh-split) {
+  min-width: 680px;
+}
+.ml-compact-mf-pane--cost :deep(.gt-cost-layout) {
+  min-width: 720px;
+}
+.ml-compact-mf-pane--basic :deep(.mf-detail-table) {
+  overflow-x: auto;
+}
+.ml-compact-mf-pane :deep(.mf-detail-table-wrap) {
+  overflow-x: auto;
+}
 </style>
diff --git a/src/views/supply/SupplyCollectionGoodsDlg.vue b/src/views/supply/SupplyCollectionGoodsDlg.vue
index ef0d3aa..6e16d34 100755
--- a/src/views/supply/SupplyCollectionGoodsDlg.vue
+++ b/src/views/supply/SupplyCollectionGoodsDlg.vue
@@ -1029,7 +1029,7 @@
   <el-dialog
     v-model="extraFeeDlgVisible"
     title="额外费用"
-    width="min(1100px, 94vw)"
+    width="min(780px, 94vw)"
     append-to-body
     destroy-on-close
     :close-on-click-modal="false"
@@ -1045,99 +1045,105 @@
       <div class="scc-extra-fee-split">
         <div class="scc-extra-fee-op-pane">
           <div class="scc-extra-fee-panel">
-            <table class="scc-extra-fee-table">
-              <thead>
-                <tr>
-                  <th class="scc-extra-fee-th scc-extra-fee-th--type">票种</th>
-                  <th class="scc-extra-fee-th scc-extra-fee-th--total">当前累计</th>
-                  <th class="scc-extra-fee-th scc-extra-fee-th--add">本次追加</th>
-                </tr>
-              </thead>
-              <tbody>
-                <tr
-                  v-for="field in extraFeeAllFields"
-                  :key="field.key"
-                  class="scc-extra-fee-row"
-                >
-                  <td class="scc-extra-fee-td scc-extra-fee-td--type">{{ field.label }}</td>
-                  <td class="scc-extra-fee-td scc-extra-fee-td--total">
-                    ¥{{ formatMoneyDisplay(extraFeeDlgRow.extra_fees[field.key]) }}
-                  </td>
-                  <td class="scc-extra-fee-td scc-extra-fee-td--add">
-                    <div class="scc-extra-fee-input-wrap">
-                      <el-input
-                        :id="`extra-fee-add-${field.key}`"
-                        v-model="extraFeeAddDraft[field.key]"
-                        size="small"
-                        placeholder="0.00"
-                        inputmode="decimal"
-                        class="scc-extra-fee-input"
-                      >
-                        <template #prefix>¥</template>
-                      </el-input>
-                    </div>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-            <div class="scc-extra-fee-remark">
-              <label class="scc-extra-fee-remark-label" for="extra-fee-remark">
-                备注<span class="scc-extra-fee-remark-hint">（可选）</span>
-              </label>
-              <el-input
-                id="extra-fee-remark"
-                v-model="extraFeeRemark"
-                maxlength="200"
-                show-word-limit
-                class="scc-extra-fee-remark-input"
-              />
+            <div class="scc-extra-fee-panel-inner">
+              <div class="scc-extra-fee-table-wrap">
+                <table class="scc-extra-fee-table">
+                  <thead>
+                    <tr>
+                      <th class="scc-extra-fee-th scc-extra-fee-th--type">票种</th>
+                      <th class="scc-extra-fee-th scc-extra-fee-th--value">当前值</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    <tr
+                      v-for="field in extraFeeAllFields"
+                      :key="field.key"
+                      class="scc-extra-fee-row"
+                    >
+                      <td class="scc-extra-fee-td scc-extra-fee-td--type">{{ field.label }}</td>
+                      <td class="scc-extra-fee-td scc-extra-fee-td--value">
+                        <div class="scc-extra-fee-input-wrap">
+                          <el-input
+                            :id="`extra-fee-value-${field.key}`"
+                            v-model="extraFeeEditDraft[field.key]"
+                            size="small"
+                            placeholder="0.00"
+                            inputmode="decimal"
+                            class="scc-extra-fee-input"
+                          >
+                            <template #prefix>¥</template>
+                          </el-input>
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </div>
+              <div class="scc-extra-fee-remark">
+                <label class="scc-extra-fee-remark-label" for="extra-fee-remark">
+                  备注<span class="scc-extra-fee-remark-hint">（可选）</span>
+                </label>
+                <div class="scc-extra-fee-remark-field">
+                  <el-input
+                    id="extra-fee-remark"
+                    v-model="extraFeeRemark"
+                    type="textarea"
+                    maxlength="200"
+                    show-word-limit
+                    resize="none"
+                    class="scc-extra-fee-remark-input"
+                  />
+                </div>
+              </div>
             </div>
           </div>
         </div>
 
         <aside class="scc-extra-fee-log-pane">
-          <div class="scc-extra-fee-log-hd">追加日志</div>
-          <div
-            v-loading="extraFeeLogLoading"
-            class="scc-extra-fee-log-scroll"
-            :class="{ 'is-empty': !extraFeeLogLoading && !extraFeeLogList.length }"
-          >
-            <p v-if="!extraFeeLogLoading && !extraFeeLogList.length" class="scc-extra-fee-log-empty">
-              暂无追加记录
-            </p>
-            <template v-for="(log, idx) in extraFeeLogList" :key="log.id ?? `${log.time}-${log.bill_tax}-${idx}`">
-              <div
-                v-if="showExtraFeeLogDateHeader(log, idx)"
-                class="scc-extra-fee-log-date-hd"
-              >
-                {{ formatExtraFeeLogDate(log.time) || '—' }}
-              </div>
-              <div class="scc-extra-fee-log-item">
-                <div class="scc-extra-fee-log-action">
-                  {{ extraFeeLogActionText(log) }}
-                </div>
-                <div v-if="log.remark" class="scc-extra-fee-log-remark">
-                  {{ log.remark }}
-                </div>
+          <div class="scc-extra-fee-log-panel">
+            <div class="scc-extra-fee-log-hd">修改日志</div>
+            <div
+              v-loading="extraFeeLogLoading"
+              class="scc-extra-fee-log-scroll"
+              :class="{ 'is-empty': !extraFeeLogLoading && !extraFeeLogList.length }"
+            >
+              <p v-if="!extraFeeLogLoading && !extraFeeLogList.length" class="scc-extra-fee-log-empty">
+                暂无修改记录
+              </p>
+              <template v-for="(log, idx) in extraFeeLogList" :key="log.id ?? `${log.time}-${log.bill_tax}-${idx}`">
                 <div
-                  v-if="log.after_amount != null && log.after_amount !== ''"
-                  class="scc-extra-fee-log-total"
+                  v-if="showExtraFeeLogDateHeader(log, idx)"
+                  class="scc-extra-fee-log-date-hd"
                 >
-                  累计 ¥{{ formatMoneyDisplay(log.after_amount) }}
+                  {{ formatExtraFeeLogDate(log.time) || '—' }}
                 </div>
-              </div>
-            </template>
+                <div class="scc-extra-fee-log-item">
+                  <div class="scc-extra-fee-log-action">
+                    {{ extraFeeLogActionText(log) }}
+                  </div>
+                  <div v-if="log.remark" class="scc-extra-fee-log-remark">
+                    {{ log.remark }}
+                  </div>
+                  <div
+                    v-if="log.after_amount != null && log.after_amount !== ''"
+                    class="scc-extra-fee-log-total"
+                  >
+                    当前 ¥{{ formatMoneyDisplay(log.after_amount) }}
+                  </div>
+                </div>
+              </template>
+            </div>
+            <el-pagination
+              v-if="extraFeeLogTotal > EXTRA_FEE_LOG_PAGE_SIZE"
+              v-model:current-page="extraFeeLogPage"
+              small
+              layout="prev, pager, next"
+              :page-size="EXTRA_FEE_LOG_PAGE_SIZE"
+              :total="extraFeeLogTotal"
+              class="scc-extra-fee-log-pager"
+              @current-change="loadExtraFeeLogs"
+            />
           </div>
-          <el-pagination
-            v-if="extraFeeLogTotal > EXTRA_FEE_LOG_PAGE_SIZE"
-            v-model:current-page="extraFeeLogPage"
-            small
-            layout="prev, pager, next"
-            :page-size="EXTRA_FEE_LOG_PAGE_SIZE"
-            :total="extraFeeLogTotal"
-            class="scc-extra-fee-log-pager"
-            @current-change="loadExtraFeeLogs"
-          />
         </aside>
       </div>
     </div>
@@ -1146,10 +1152,10 @@
       <el-button
         type="primary"
         :loading="extraFeeSaving"
-        :disabled="!extraFeeAddHasItems"
-        @click="submitExtraFeesAdd"
+        :disabled="!extraFeeHasChanges"
+        @click="submitExtraFeesModify"
       >
-        保存本次追加
+        保存修改
       </el-button>
     </template>
   </el-dialog>
@@ -1362,13 +1368,12 @@ import {
 import {
   buildCollectionGoodsUpdateBody,
   buildCollectionCopyGoodsBody,
-  buildExtraFeesAddList,
+  buildExtraFeesModifyList,
   COLLECTION_GOODS_EXTRA_FEE_FIELDS,
   COPY_COLLECTION_GOODS_FIELD_KEYS,
   COPY_COLLECTION_GOODS_FIELD_LABELS,
   emptyExtraFees,
-  extraFeesTotalsFromLatestLogEntries,
-  extractExtraFeesFromAddResponse,
+  extractExtraFeesFromSetResponse,
   extraFeeBillTaxLabel,
   extraFeeLogActionText,
   extraFeeLogOperator,
@@ -1379,7 +1384,6 @@ import {
   formatExtraFeeLogDate,
   formatExtraFeeLogTime,
   groupCollectionCopyGoodsByFields,
-  hasAnyExtraFeeValue,
   hydrateExtraFeesOnRow,
   mergeExtraFeesPatch,
   normalizeCollectionGoodsRow,
@@ -1390,7 +1394,7 @@ import {
   supplyCollectionCopyGoods,
   supplyCollectionGoodsAdd,
   supplyCollectionGoodsBatchAdd,
-  supplyCollectionGoodsExtraFeesAdd,
+  supplyCollectionGoodsExtraFeesSet,
   supplyCollectionGoodsRemove,
   supplyCollectionGoodsUpdate,
 } from '@/api/supplyCollectionGoods'
@@ -1498,7 +1502,8 @@ const copySelectedCodes = ref([])
 const copyGoodsDlgVisible = ref(false)
 const extraFeeDlgVisible = ref(false)
 const extraFeeDlgRow = ref(null)
-const extraFeeAddDraft = ref(emptyExtraFees())
+const extraFeeEditDraft = ref(emptyExtraFees())
+const extraFeeEditBaseline = ref(emptyExtraFees())
 const extraFeeRemark = ref('')
 const extraFeeSaving = ref(false)
 const extraFeeLogList = ref([])
@@ -1507,7 +1512,9 @@ const extraFeeLogPage = ref(1)
 const extraFeeLogLoading = ref(false)
 const EXTRA_FEE_LOG_PAGE_SIZE = 20
 const extraFeeAllFields = COLLECTION_GOODS_EXTRA_FEE_FIELDS
-const extraFeeAddHasItems = computed(() => buildExtraFeesAddList(extraFeeAddDraft.value).length > 0)
+const extraFeeHasChanges = computed(
+  () => buildExtraFeesModifyList(extraFeeEditDraft.value, extraFeeEditBaseline.value).length > 0,
+)
 const copyTargetsLoading = ref(false)
 const copyGoodsSubmitting = ref(false)
 /** @type {import('vue').Ref<{ code: string, name: string, meta: string }[]>} */
@@ -2748,8 +2755,10 @@ async function loadCopyTargetOptions() {
 }
 
 function openExtraFeeDlg(row) {
-  row.extra_fees = normalizeExtraFees(row.extra_fees ?? row.raw?.extra_fees)
-  extraFeeAddDraft.value = emptyExtraFees()
+  const normalized = normalizeExtraFees(row.extra_fees ?? row.raw?.extra_fees)
+  row.extra_fees = normalized
+  extraFeeEditDraft.value = { ...normalized }
+  extraFeeEditBaseline.value = { ...normalized }
   extraFeeRemark.value = ''
   extraFeeLogPage.value = 1
   extraFeeLogList.value = []
@@ -2761,7 +2770,8 @@ function openExtraFeeDlg(row) {
 
 function onExtraFeeDlgClosed() {
   extraFeeDlgRow.value = null
-  extraFeeAddDraft.value = emptyExtraFees()
+  extraFeeEditDraft.value = emptyExtraFees()
+  extraFeeEditBaseline.value = emptyExtraFees()
   extraFeeRemark.value = ''
   extraFeeLogList.value = []
   extraFeeLogTotal.value = 0
@@ -2769,10 +2779,10 @@ function onExtraFeeDlgClosed() {
 }
 
 async function tryCloseExtraFeeDlg() {
-  if (extraFeeAddHasItems.value) {
+  if (extraFeeHasChanges.value) {
     try {
       await ElMessageBox.confirm(
-        '本次追加尚未保存，确认关闭吗？',
+        '修改尚未保存，确认关闭吗？',
         '未保存的更改',
         {
           type: 'warning',
@@ -2816,20 +2826,16 @@ async function loadExtraFeeLogs(page = extraFeeLogPage.value) {
     )
     extraFeeLogList.value = list
     extraFeeLogTotal.value = total
-    const fromLogs = extraFeesTotalsFromLatestLogEntries(list)
-    if (hasAnyExtraFeeValue(fromLogs)) {
-      row.extra_fees = mergeExtraFeesPatch(row.extra_fees, fromLogs)
-    }
   } catch (e) {
     extraFeeLogList.value = []
     extraFeeLogTotal.value = 0
-    ElMessage.error(e?.data?.message || e?.message || '加载追加日志失败')
+    ElMessage.error(e?.data?.message || e?.message || '加载修改日志失败')
   } finally {
     extraFeeLogLoading.value = false
   }
 }
 
-async function submitExtraFeesAdd() {
+async function submitExtraFeesModify() {
   const row = extraFeeDlgRow.value
   const supply_collection_code = supplyCollectionCode.value
   const goods_code = String(row?.goods_code || '').trim()
@@ -2837,32 +2843,37 @@ async function submitExtraFeesAdd() {
     ElMessage.warning('缺少统筹集合或商品编码')
     return
   }
-  const list = buildExtraFeesAddList(extraFeeAddDraft.value, extraFeeRemark.value)
+  const list = buildExtraFeesModifyList(
+    extraFeeEditDraft.value,
+    extraFeeEditBaseline.value,
+    extraFeeRemark.value,
+  )
   if (!list.length) {
-    ElMessage.warning('请填写本次追加金额')
+    ElMessage.warning('请修改至少一项金额')
     return
   }
   extraFeeSaving.value = true
   try {
-    const data = await supplyCollectionGoodsExtraFeesAdd({
+    const data = await supplyCollectionGoodsExtraFeesSet({
       supply_collection_code,
       goods_code,
       list,
     })
-    const parsed = extractExtraFeesFromAddResponse(data)
+    const parsed = extractExtraFeesFromSetResponse(data)
     if (parsed) {
       row.extra_fees = mergeExtraFeesPatch(row.extra_fees, parsed)
       const nextSnap = new Map(goodsSaveSnapshot.value)
       nextSnap.set(goods_code, rowUpdateSnapshot(row))
       goodsSaveSnapshot.value = nextSnap
+      extraFeeEditDraft.value = { ...normalizeExtraFees(row.extra_fees) }
+      extraFeeEditBaseline.value = { ...extraFeeEditDraft.value }
     }
-    extraFeeAddDraft.value = emptyExtraFees()
     extraFeeRemark.value = ''
-    ElMessage.success('已保存本次追加')
+    ElMessage.success('已保存修改')
     emit('success')
     await loadExtraFeeLogs(1)
   } catch (e) {
-    ElMessage.error(e?.data?.message || e?.message || '保存追加失败')
+    ElMessage.error(e?.data?.message || e?.message || '保存修改失败')
   } finally {
     extraFeeSaving.value = false
   }
@@ -3600,7 +3611,9 @@ watch(poolPage, () => {
   if (poolPageCount.value > 1) nextTick(measurePoolPagerCount)
 })
 
-onBeforeUnmount(unbindPoolPagerLayout)
+onBeforeUnmount(() => {
+  unbindPoolPagerLayout()
+})
 
 async function initDialogContent() {
   poolInitSync = true
@@ -5028,34 +5041,54 @@ async function onSave() {
 }
 .scc-extra-fee-split {
   display: grid;
-  grid-template-columns: minmax(0, 7fr) minmax(0, 3fr);
+  grid-template-columns: minmax(0, 400px) 330px;
   gap: calc(10px + var(--wh-fs-delta, 0px));
   align-items: stretch;
 }
 .scc-extra-fee-op-pane {
   min-width: 0;
-  overflow: visible;
+  max-width: 400px;
+  align-self: start;
 }
 .scc-extra-fee-log-pane {
   min-width: 0;
   min-height: 0;
-  display: flex;
-  flex-direction: column;
+  position: relative;
+  overflow: hidden;
+  align-self: stretch;
+  box-sizing: border-box;
   border-left: 1px solid #ebeef5;
   padding-left: calc(10px + var(--wh-fs-delta, 0px));
 }
+.scc-extra-fee-log-panel {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  border: 1px solid #ebeef5;
+  border-radius: 8px;
+  overflow: hidden;
+  background: #fff;
+  box-sizing: border-box;
+}
 .scc-extra-fee-log-hd {
   flex-shrink: 0;
-  margin-bottom: calc(6px + var(--wh-fs-delta, 0px) * 0.5);
-  font-size: calc(12px + var(--wh-fs-delta, 0px));
+  padding: calc(5px + var(--wh-fs-delta, 0px) * 0.5) calc(8px + var(--wh-fs-delta, 0px));
+  font-size: calc(11px + var(--wh-fs-delta, 0px));
   font-weight: 600;
-  color: #606266;
+  color: #909399;
+  line-height: 1.35;
+  background: #fafafa;
+  border-bottom: 1px solid #f0f2f5;
 }
 .scc-extra-fee-log-scroll {
   flex: 1 1 0;
   min-height: 0;
+  overflow-x: hidden;
   overflow-y: auto;
-  padding-right: 2px;
+  padding: calc(4px + var(--wh-fs-delta, 0px) * 0.25) calc(8px + var(--wh-fs-delta, 0px));
+  box-sizing: border-box;
 }
 .scc-extra-fee-log-scroll.is-empty {
   display: flex;
@@ -5109,12 +5142,15 @@ async function onSave() {
 }
 .scc-extra-fee-log-pager {
   flex-shrink: 0;
-  margin-top: calc(6px + var(--wh-fs-delta, 0px) * 0.5);
+  margin: 0;
+  padding: calc(4px + var(--wh-fs-delta, 0px) * 0.25) calc(4px + var(--wh-fs-delta, 0px));
   justify-content: center;
+  border-top: 1px solid #f0f2f5;
+  background: #fafafa;
 }
-.scc-extra-fee-log-pager :deep(.el-pager li),
-.scc-extra-fee-log-pager :deep(.btn-prev),
-.scc-extra-fee-log-pager :deep(.btn-next) {
+.scc-extra-fee-log-pager .el-pager li,
+.scc-extra-fee-log-pager .btn-prev,
+.scc-extra-fee-log-pager .btn-next {
   font-size: calc(12px + var(--wh-fs-delta, 0px));
 }
 .scc-extra-fee-goods {
@@ -5141,14 +5177,24 @@ async function onSave() {
   border-radius: 8px;
   overflow: hidden;
   background: #fff;
+  box-sizing: border-box;
+}
+.scc-extra-fee-panel-inner {
+  display: grid;
+  grid-template-columns: auto minmax(120px, 1fr);
+  align-items: stretch;
+  min-height: 0;
+}
+.scc-extra-fee-table-wrap {
+  min-width: 0;
 }
 .scc-extra-fee-table {
   width: 100%;
   border-collapse: collapse;
-  table-layout: fixed;
+  table-layout: auto;
 }
 .scc-extra-fee-th {
-  padding: calc(6px + var(--wh-fs-delta, 0px) * 0.5) calc(8px + var(--wh-fs-delta, 0px));
+  padding: calc(5px + var(--wh-fs-delta, 0px) * 0.5) calc(8px + var(--wh-fs-delta, 0px));
   font-size: calc(11px + var(--wh-fs-delta, 0px));
   font-weight: 600;
   color: #909399;
@@ -5157,16 +5203,15 @@ async function onSave() {
   border-bottom: 1px solid #f0f2f5;
 }
 .scc-extra-fee-th--type {
-  width: 40%;
+  width: 1%;
+  white-space: nowrap;
+  padding-right: 10px;
 }
-.scc-extra-fee-th--total {
-  width: 26%;
-}
-.scc-extra-fee-th--add {
-  width: 34%;
+.scc-extra-fee-th--value {
+  width: auto;
 }
 .scc-extra-fee-td {
-  padding: calc(4px + var(--wh-fs-delta, 0px) * 0.25) calc(8px + var(--wh-fs-delta, 0px));
+  padding: calc(3px + var(--wh-fs-delta, 0px) * 0.25) calc(8px + var(--wh-fs-delta, 0px));
   font-size: calc(12px + var(--wh-fs-delta, 0px));
   color: #303133;
   vertical-align: middle;
@@ -5176,34 +5221,38 @@ async function onSave() {
   border-bottom: none;
 }
 .scc-extra-fee-td--type {
+  width: 1%;
   color: #606266;
   white-space: nowrap;
+  padding-right: 10px;
 }
-.scc-extra-fee-td--total {
-  font-weight: 600;
-  font-variant-numeric: tabular-nums;
-  color: #303133;
-}
-.scc-extra-fee-td--add {
+.scc-extra-fee-td--value {
+  width: auto;
   padding-top: calc(3px + var(--wh-fs-delta, 0px) * 0.25);
   padding-bottom: calc(3px + var(--wh-fs-delta, 0px) * 0.25);
 }
 .scc-extra-fee-input-wrap {
-  display: inline-block;
-  width: calc(118px + var(--wh-fs-delta, 0px) * 4);
+  display: block;
+  width: calc(128px + var(--wh-fs-delta, 0px) * 4);
   max-width: 100%;
-  vertical-align: middle;
 }
 .scc-extra-fee-input {
   width: 100%;
 }
 .scc-extra-fee-remark {
-  padding: calc(8px + var(--wh-fs-delta, 0px)) calc(10px + var(--wh-fs-delta, 0px));
-  border-top: 1px solid #f0f2f5;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  min-height: 0;
+  height: 100%;
+  padding: calc(6px + var(--wh-fs-delta, 0px) * 0.5) calc(8px + var(--wh-fs-delta, 0px));
+  border-left: 1px solid #f0f2f5;
   background: #fafafa;
+  box-sizing: border-box;
 }
 .scc-extra-fee-remark-label {
   display: block;
+  flex-shrink: 0;
   margin-bottom: calc(4px + var(--wh-fs-delta, 0px) * 0.25);
   font-size: calc(12px + var(--wh-fs-delta, 0px));
   font-weight: 600;
@@ -5214,28 +5263,66 @@ async function onSave() {
   font-weight: 400;
   color: #909399;
 }
-.scc-extra-fee-remark-input :deep(.el-input__wrapper) {
-  font-size: calc(12px + var(--wh-fs-delta, 0px));
-  min-height: calc(28px + var(--wh-fs-delta, 0px));
-  padding: 0 calc(8px + var(--wh-fs-delta, 0px) * 0.5);
+.scc-extra-fee-remark-field {
+  position: relative;
+  flex: 1 1 auto;
+  min-height: 0;
 }
-.scc-extra-fee-remark-input :deep(.el-input__inner) {
-  font-size: calc(12px + var(--wh-fs-delta, 0px));
-  height: calc(28px + var(--wh-fs-delta, 0px));
-  line-height: calc(28px + var(--wh-fs-delta, 0px));
+.scc-extra-fee-remark-input.el-textarea {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100% !important;
+  margin: 0;
+  border: 1px solid var(--el-border-color);
+  border-radius: var(--el-input-border-radius, 4px);
+  background: #fff;
+  box-sizing: border-box;
+  overflow: hidden;
 }
-.scc-extra-fee-remark-input :deep(.el-input__count) {
+.scc-extra-fee-remark-input.el-textarea:focus-within {
+  border-color: var(--el-color-primary);
+}
+.scc-extra-fee-remark-input .el-textarea__inner {
+  flex: 1 1 auto;
+  display: block;
+  width: 100%;
+  min-height: 0;
+  height: auto !important;
+  resize: none;
+  font-size: calc(12px + var(--wh-fs-delta, 0px));
+  line-height: 1.45;
+  padding: calc(6px + var(--wh-fs-delta, 0px) * 0.25) calc(8px + var(--wh-fs-delta, 0px) * 0.5);
+  box-sizing: border-box;
+  border: none;
+  box-shadow: none;
+  background: transparent;
+  overflow-y: auto;
+}
+.scc-extra-fee-remark-input .el-textarea__inner:focus {
+  border: none;
+  box-shadow: none;
+  outline: none;
+}
+.scc-extra-fee-remark-input .el-input__count {
+  position: static;
+  flex-shrink: 0;
+  align-self: flex-end;
+  margin: 0 calc(8px + var(--wh-fs-delta, 0px) * 0.5) calc(4px + var(--wh-fs-delta, 0px) * 0.25);
   font-size: calc(11px + var(--wh-fs-delta, 0px));
   line-height: 1.2;
+  background: transparent;
 }
-.scc-extra-fee-input :deep(.el-input__wrapper) {
+.scc-extra-fee-input .el-input__wrapper {
   min-height: calc(28px + var(--wh-fs-delta, 0px));
   padding: 0 calc(8px + var(--wh-fs-delta, 0px) * 0.5);
 }
-.scc-extra-fee-input :deep(.el-input__inner) {
+.scc-extra-fee-input .el-input__inner {
   font-size: calc(12px + var(--wh-fs-delta, 0px));
 }
-.scc-extra-fee-input :deep(.el-input__prefix) {
+.scc-extra-fee-input .el-input__prefix {
   color: #909399;
   font-size: calc(12px + var(--wh-fs-delta, 0px));
 }