html/admin-web
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
ouyangxq
2026-10-20 23:34:11 +08:00
parent f155976f52
commit 13e4aa56ec
321 changed files with 6756 additions and 2110 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/modules/warehouse-resources/locations/pages/LocationsView.vue
+9 -8
View File
@@ -1,4 +1,5 @@
<script setup lang="ts">
import '@/styles/adminWorkbench.css'
import '@/styles/adminDensity.css'
import { computed, onMounted, reactive, ref, watch } from 'vue'
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
@@ -410,7 +411,7 @@ async function toggleStatus(row: PlatformLocationResource) {
? `确定停用“${row.locationCode}”吗？停用前后端会再次检查是否存在活动预占或占用。`
: `确定重新启用“${row.locationCode}”吗？仅启用仓库中的库位可以恢复可用。`,
`${action}库位`,
{ customClass: 'admin-density-confirm', type: nextStatus === 'AVAILABLE' ? 'success' : 'warning', confirmButtonText: `确认${action}`, cancelButtonText: '取消' },
{ customClass: 'admin-density-confirm admin-workbench', type: nextStatus === 'AVAILABLE' ? 'success' : 'warning', confirmButtonText: `确认${action}`, cancelButtonText: '取消' },
)
} catch {
return
@@ -435,7 +436,7 @@ async function removeLocation(row: PlatformLocationResource) {
await ElMessageBox.confirm(
`确定删除已停用库位“${row.locationCode}”吗？系统会保留审计记录，此操作不能直接恢复。`,
'删除库位',
{ customClass: 'admin-density-confirm', type: 'warning', confirmButtonText: '确认删除', cancelButtonText: '取消' },
{ customClass: 'admin-density-confirm admin-workbench', type: 'warning', confirmButtonText: '确认删除', cancelButtonText: '取消' },
)
} catch {
return
@@ -481,12 +482,12 @@ onMounted(() => {
</script>
<template>
<AdminPage as="div" class="location-page admin-density">
<AdminPage as="div" class="location-page admin-density admin-workbench">
<ListPageLayout aria-label="库位列表页面">
<section aria-label="库位列表区域"><DataTable appearance="integrated" :stripe="false" column-settings-mode="show" :results-visible="!loadError"
<section class="workbench-table is-page-surface" aria-label="库位列表区域"><DataTable appearance="integrated" :stripe="false" column-settings-mode="show" :results-visible="!loadError"
v-model:page="page"
v-model:page-size="pageSize"
:data="rows"
@@ -601,7 +602,7 @@ onMounted(() => {
v-model="editorOpen"
:title="editorMode === 'edit' && form.locationCode ? `${editorTitle} · ${form.locationCode}` : editorTitle"
width="min(1000px, calc(100vw - 28px))"
class="location-editor-dialog admin-density-dialog"
class="location-editor-dialog admin-density-dialog admin-workbench is-dialog"
:confirm-loading="saving"
:close-on-click-modal="false"
:close-on-press-escape="!saving"
@@ -680,15 +681,15 @@ onMounted(() => {
.state-alert .el-button { margin-top: var(--admin-space-4, 10px); }
.location-actions { white-space: nowrap; }
.location-cell { display: flex; min-width: 0; align-items: center; gap: var(--admin-space-4, 10px); }
.location-cell > span { display: grid; width: 20px; height: 20px; flex: 0 0 20px; place-items: center; border-radius: 7px; background: #eef3fa; color: var(--cc-primary); }
.location-cell > span { display: grid; width: 20px; height: 20px; flex: 0 0 20px; place-items: center; border-radius: 7px; background: var(--workbench-surface-soft); color: var(--workbench-primary); }
.location-cell > div, .stacked-value { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.location-cell strong, .stacked-value strong { overflow-wrap: anywhere; }
.location-cell small, .stacked-value small { color: var(--cc-muted); font-size: var(--admin-font-caption, 12px); }
.location-cell small, .stacked-value small { color: var(--workbench-muted); font-size: var(--admin-font-caption, 12px); }
.remark-cell { display: -webkit-box; overflow: hidden; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.editor-form { padding: 0; }
.editor-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--admin-space-5, 12px); }
.editor-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--admin-space-3, 8px); }
.editor-footer > span { color: var(--cc-muted); font-size: var(--admin-font-caption, 12px); }
.editor-footer > span { color: var(--workbench-muted); font-size: var(--admin-font-caption, 12px); }
.editor-footer > span i { color: var(--el-color-danger); font-style: normal; }
.editor-footer > div { display: flex; gap: var(--admin-space-3, 8px); }
.editor-footer :deep(.el-button + .el-button) { margin-left: 0; }
src/modules/warehouse-resources/pallets/pages/PalletsView.test.ts
+1 -1
View File
@@ -130,7 +130,7 @@ describe('PalletsView', () => {
})
it('uses the prototype-sized centered editor without an extra detail drawer', () => {
expect(palletsSource).not.toContain('<AppDrawer')
expect(palletsSource).toContain('width="min(560px, calc(100vw - 28px))" class="pallet-editor-dialog admin-density-dialog"')
expect(palletsSource).toContain('width="min(560px, calc(100vw - 28px))" class="pallet-editor-dialog admin-density-dialog admin-workbench is-dialog"')
expect(palletsSource).not.toContain('<el-drawer v-model="editorOpen"')
expect(densitySource).toContain('.admin-density-dialog.el-dialog .el-dialog__body { min-height: 0; overflow-y: auto;')
expect(palletsSource).toContain('.editor-field-grid { grid-template-columns: minmax(0, 1fr); }')
src/modules/warehouse-resources/pallets/pages/PalletsView.vue
+12 -12
View File
@@ -1,4 +1,5 @@
<script setup lang="ts">
import '@/styles/adminWorkbench.css'
import '@/styles/adminDensity.css'
import { computed, onMounted, reactive, ref, watch } from 'vue'
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
@@ -309,7 +310,7 @@ async function removePallet(row: PlatformPalletResource) {
await ElMessageBox.confirm(
`确定删除托盘“${row.palletCode}”吗？已预占或已占用的托盘无法删除。`,
'删除托盘',
{ customClass: 'admin-density-confirm', confirmButtonText: '删除', cancelButtonText: '取消', type: 'warning', confirmButtonClass: 'el-button--danger' },
{ customClass: 'admin-density-confirm admin-workbench', confirmButtonText: '删除', cancelButtonText: '取消', type: 'warning', confirmButtonClass: 'el-button--danger' },
)
} catch {
return
@@ -344,13 +345,13 @@ onMounted(() => {
</script>
<template>
<AdminPage as="div" class="pallet-page admin-density">
<AdminPage as="div" class="pallet-page admin-density admin-workbench">
<ListPageLayout aria-label="托盘列表页面">
<section aria-label="托盘列表区域"><DataTable appearance="integrated" :stripe="false" column-settings-mode="show" :results-visible="!loadError"
<section class="workbench-table is-page-surface" aria-label="托盘列表区域"><DataTable appearance="integrated" :stripe="false" column-settings-mode="show" :results-visible="!loadError"
v-model:page="page"
v-model:page-size="pageSize"
:data="rows"
@@ -424,7 +425,7 @@ onMounted(() => {
</DataTable></section>
</ListPageLayout>
<AppDialog v-model="editorOpen" :title="form.id && form.palletCode ? `${editorTitle} · ${form.palletCode}` : editorTitle" width="min(560px, calc(100vw - 28px))" class="pallet-editor-dialog admin-density-dialog" :close-on-click-modal="false" :confirm-loading="saving" :show-confirm="false" destroy-on-close>
<AppDialog v-model="editorOpen" :title="form.id && form.palletCode ? `${editorTitle} · ${form.palletCode}` : editorTitle" width="min(560px, calc(100vw - 28px))" class="pallet-editor-dialog admin-density-dialog admin-workbench is-dialog" :close-on-click-modal="false" :confirm-loading="saving" :show-confirm="false" destroy-on-close>
<el-form ref="formRef" :model="form" :rules="rules" label-position="top" class="editor-form density-form density-form--flush-end">
<div class="editor-field-grid">
<el-form-item label="所属仓库" prop="warehouseId" required>
@@ -479,18 +480,17 @@ onMounted(() => {
<style scoped>
.pallet-page { display: grid; min-width: 0; gap: var(--admin-space-6, 16px); }
.summary-grid { display:flex; flex-wrap:wrap; gap:var(--admin-space-3, 8px) 28px; padding:var(--admin-space-3, 8px) var(--admin-space-5, 12px); border:1px solid var(--cc-border); background:var(--admin-surface, #fff); }
.summary-grid { display:flex; flex-wrap:wrap; gap:var(--admin-space-3, 8px) 28px; padding:var(--admin-space-3, 8px) var(--admin-space-5, 12px); border:1px solid var(--workbench-border); background:var(--workbench-surface); }
.summary-grid article { display:flex; align-items:baseline; gap:var(--admin-space-3, 8px); }
.summary-grid span { color:var(--cc-muted); font-size:var(--admin-font-caption, 12px); }.summary-grid strong { font-size:var(--admin-font-section, 14px); }.summary-grid .idle { color:var(--el-color-success); }.summary-grid .occupied { color:var(--el-color-warning); }
.surface-panel { overflow: hidden; border: 1px solid var(--cc-border); border-radius: var(--admin-radius, 4px); background: var(--admin-surface, #fff); }
.summary-grid span { color:var(--workbench-muted); font-size:var(--admin-font-caption, 12px); }.summary-grid strong { font-size:var(--admin-font-section, 14px); }.summary-grid .idle { color:var(--el-color-success); }.summary-grid .occupied { color:var(--el-color-warning); }
.table-panel { min-width: 0; }
.context-empty { padding: var(--admin-space-6, 16px); color: var(--cc-muted); text-align: center; }
.context-empty { padding: var(--admin-space-6, 16px); color: var(--workbench-muted); text-align: center; }
.pallet-row-actions { white-space: nowrap; }
.pallet-cell { display: flex; align-items: center; gap: var(--admin-space-4, 10px); }
.stacked-value { display: grid; min-width: 0; gap: 3px; }
.stacked-value strong, .stacked-value small { overflow-wrap: anywhere; }
.stacked-value small { color: var(--cc-muted); font-size: var(--admin-font-caption, 12px); }
.pallet-cell > span { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 8px; background: var(--el-color-primary-light-9); color: var(--cc-primary); }
.stacked-value small { color: var(--workbench-muted); font-size: var(--admin-font-caption, 12px); }
.pallet-cell > span { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: 8px; background: var(--el-color-primary-light-9); color: var(--workbench-primary); }
.pallet-cell > span { width: 20px; height: 20px; }
.remark-text { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.55; }
.editor-form { padding: 0; }
@@ -499,11 +499,11 @@ onMounted(() => {
.summary-grid { grid-template-columns:1fr; }
.editor-field-grid { grid-template-columns: minmax(0, 1fr); }
}
.field-help { margin: var(--admin-space-2, 6px) 0 0; color: var(--cc-muted); font-size: var(--admin-font-caption, 12px); line-height: 1.5; }
.field-help { margin: var(--admin-space-2, 6px) 0 0; color: var(--workbench-muted); font-size: var(--admin-font-caption, 12px); line-height: 1.5; }
.drawer-footer { display: flex; justify-content: flex-end; gap: var(--admin-space-3, 8px); }
.drawer-footer :deep(.el-button + .el-button) { margin-left: 0; }
.pallet-editor-footer { align-items: center; justify-content: space-between; }
.pallet-editor-footer > span { color: var(--cc-muted); font-size: var(--admin-font-caption, 12px); }
.pallet-editor-footer > span { color: var(--workbench-muted); font-size: var(--admin-font-caption, 12px); }
.pallet-editor-footer > span i { color: var(--el-color-danger); font-style: normal; }
.pallet-editor-footer > div { display: flex; gap: var(--admin-space-3, 8px); }
.pallet-editor-footer > div :deep(.el-button + .el-button) { margin-left: 0; }