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-09-14 15:33:35 +08:00
parent 23d956ba15
commit b0de9c026f
30 changed files with 270 additions and 240 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/modules/warehouse-resources/locations/pages/LocationsView.vue
+11 -10
View File
@@ -1,4 +1,5 @@
<script setup lang="ts">
import '@/styles/adminDensity.css'
import { computed, onMounted, reactive, ref, watch } from 'vue'
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
import { MapPin, Pencil, Plus, Power, Save, Trash2 } from '@lucide/vue'
@@ -434,7 +435,7 @@ async function removeLocation(row: PlatformLocationResource) {
await ElMessageBox.confirm(
`确定删除已停用库位“${row.locationCode}”吗？系统会保留审计记录，此操作不能直接恢复。`,
'删除库位',
{ type: 'warning', confirmButtonText: '确认删除', cancelButtonText: '取消' },
{ customClass: 'admin-density-confirm', type: 'warning', confirmButtonText: '确认删除', cancelButtonText: '取消' },
)
} catch {
return
@@ -480,7 +481,7 @@ onMounted(() => {
</script>
<template>
<AdminPage as="div" class="location-page">
<AdminPage as="div" class="location-page admin-density">
<ListPageLayout aria-label="库位列表页面">
<template #toolbar>
<QueryToolbar
@@ -602,7 +603,7 @@ onMounted(() => {
v-model="editorOpen"
:title="editorTitle"
width="min(560px, calc(100vw - 28px))"
class="location-editor-dialog"
class="location-editor-dialog admin-density-dialog"
:confirm-loading="saving"
:close-on-click-modal="false"
:close-on-press-escape="!saving"
@@ -682,22 +683,22 @@ onMounted(() => {
.location-actions { display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.location-actions :deep(.el-button) { margin-left: 0; }
.location-cell { display: flex; min-width: 0; align-items: center; gap: 10px; }
.location-cell > span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 7px; background: #eef3fa; color: var(--cc-primary); }
.location-cell > 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 > div, .stacked-value { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.location-cell strong, .stacked-value strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.location-cell small, .stacked-value small { color: var(--cc-muted); font-size: 11px; }
.location-cell strong, .stacked-value strong { overflow-wrap: anywhere; }
.location-cell small, .stacked-value small { color: var(--cc-muted); font-size: 12px; }
.remark-cell { display: -webkit-box; overflow: hidden; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
:global(.location-editor-dialog) { max-height: min(760px, calc(100vh - 32px)); display: flex; flex-direction: column; }
:global(.location-editor-dialog .el-dialog__body) { min-height: 0; overflow-y: auto; }
:global(.location-editor-dialog .el-dialog__footer) { flex: 0 0 auto; }
.editor-form { padding: 8px 24px 12px; }
.editor-form { padding: 0; }
.editor-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.editor-form :deep(.el-input-number), .editor-form :deep(.el-select) { width: 100%; }
.editor-form :deep(.el-form-item) { margin-bottom: 18px; }
.editor-form :deep(.el-form-item__label) { padding-bottom: 7px; color: #344054; font-size: 12px; font-weight: 650; line-height: 1.4; }
.editor-form :deep(.el-form-item) { margin-bottom: 14px; }
.editor-form :deep(.el-form-item__label) { padding-bottom: 4px; color: #344054; font-size: 12px; font-weight: 650; line-height: 1.4; }
.editor-remark-field { margin-bottom: 0 !important; }
.editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.editor-footer > span { color: var(--cc-muted); font-size: 11px; }
.editor-footer > span { color: var(--cc-muted); font-size: 12px; }
.editor-footer > span i { color: var(--el-color-danger); font-style: normal; }
.editor-footer > div { display: flex; gap: 8px; }
.editor-footer :deep(.el-button + .el-button) { margin-left: 0; }
src/modules/warehouse-resources/pallets/pages/PalletsView.vue
+14 -13
View File
@@ -1,4 +1,5 @@
<script setup lang="ts">
import '@/styles/adminDensity.css'
import { computed, onMounted, reactive, ref, watch } from 'vue'
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from 'element-plus'
import { Boxes, Pencil, Plus, Save, Trash2, Warehouse as WarehouseIcon } from '@lucide/vue'
@@ -343,7 +344,7 @@ onMounted(() => {
</script>
<template>
<AdminPage as="div" class="pallet-page">
<AdminPage as="div" class="pallet-page admin-density">
<section class="summary-grid" aria-label="托盘数量概览">
<article><span>托盘总数</span><strong>{{ summary.totalCount }}</strong></article>
<article><span>闲置托盘</span><strong class="idle">{{ summary.idleCount }}</strong></article>
@@ -423,7 +424,7 @@ onMounted(() => {
</section>
</ListPageLayout>
<AppDialog v-model="editorOpen" :title="editorTitle" width="min(560px, calc(100vw - 28px))" class="pallet-editor-dialog" :close-on-click-modal="false" :confirm-loading="saving" :show-confirm="false" destroy-on-close>
<AppDialog v-model="editorOpen" :title="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>
<el-form ref="formRef" :model="form" :rules="rules" label-position="top" class="editor-form">
<div class="editor-field-grid">
<el-form-item label="所属仓库" prop="warehouseId" required>
@@ -478,29 +479,29 @@ onMounted(() => {
<style scoped>
.pallet-page { display: grid; min-width: 0; gap: 16px; }
.summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.summary-grid article { display:grid; gap:8px; padding:18px 20px; border:1px solid var(--cc-border); border-radius:8px; background:#fff; }
.summary-grid span { color:var(--cc-muted); font-size:12px; }.summary-grid strong { font-size:26px; }.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: 8px; background: #fff; }
.summary-grid { display:flex; flex-wrap:wrap; gap:8px 28px; padding:8px 12px; border:1px solid var(--cc-border); background:#fff; }
.summary-grid article { display:flex; align-items:baseline; gap:8px; }
.summary-grid span { color:var(--cc-muted); font-size:12px; }.summary-grid strong { font-size: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: 4px; background: #fff; }
.table-panel { min-width: 0; }
.context-empty { padding: 56px 20px; color: var(--cc-muted); text-align: center; }
.context-empty { padding: 16px; color: var(--cc-muted); text-align: center; }
.pallet-row-actions { gap: 8px; white-space: nowrap; }
.pallet-row-actions :deep(.el-button + .el-button) { margin-left: 0; }
.pallet-cell { display: flex; align-items: center; gap: 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: 11px; }
.stacked-value small { color: var(--cc-muted); font-size: 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); }
.pallet-cell > span { width: 34px; height: 34px; }
.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; }
:global(.pallet-editor-dialog) { max-height: min(760px, calc(100vh - 32px)); display: flex; flex-direction: column; }
:global(.pallet-editor-dialog .el-dialog__body) { min-height: 0; overflow-y: auto; }
:global(.pallet-editor-dialog .el-dialog__footer) { flex: 0 0 auto; }
.editor-form { padding: 8px 24px 12px; }
.editor-form { padding: 0; }
.editor-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.editor-form :deep(.el-input-number), .editor-form :deep(.el-select) { width: 100%; }
.editor-form :deep(.el-form-item) { margin-bottom: 18px; }
.editor-form :deep(.el-form-item__label) { padding-bottom: 7px; color: #344054; font-size: 12px; font-weight: 650; line-height: 1.4; }
.editor-form :deep(.el-form-item) { margin-bottom: 14px; }
.editor-form :deep(.el-form-item__label) { padding-bottom: 4px; color: #344054; font-size: 12px; font-weight: 650; line-height: 1.4; }
@media (max-width: 720px) {
.summary-grid { grid-template-columns:1fr; }
.editor-field-grid { grid-template-columns: minmax(0, 1fr); }
@@ -510,7 +511,7 @@ onMounted(() => {
.drawer-footer { display: flex; justify-content: flex-end; gap: 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: 11px; }
.pallet-editor-footer > span { color: var(--cc-muted); font-size: 12px; }
.pallet-editor-footer > span i { color: var(--el-color-danger); font-style: normal; }
.pallet-editor-footer > div { display: flex; gap: 8px; }
.pallet-editor-footer > div :deep(.el-button + .el-button) { margin-left: 0; }