diff --git a/docs/02-前端全局规范.md b/docs/02-前端全局规范.md index d48bb74..f9ea8b6 100644 --- a/docs/02-前端全局规范.md +++ b/docs/02-前端全局规范.md @@ -17,8 +17,8 @@ | 组件 | 用途 | 配置参数 | |------|------|---------| -| el-table | 列表展示 | border, stripe, size=default, header-cell-style背景#f5f7fa | -| el-table-column | 列定义 | show-overflow-tooltip=true 默认开启 | +| el-table | 列表展示 | border, stripe, size=default, header-cell-style背景#f5f7fa+居中, cell-style居中 | +| el-table-column | 列定义 | show-overflow-tooltip=true 默认开启, 所有列居中对齐 | | el-pagination | 分页 | page-sizes=[20,50,100], background=true, layout=total,sizes,prev,pager,next,jumper | | el-form | 表单 | label-width=120px, label-position=right, size=default | | el-dialog | 弹窗 | close-on-click-modal=false, close-on-press-escape=true, destroy-on-close=true | @@ -46,6 +46,8 @@ - **禁止使用下方浮出条**:不再使用表格底部浮出条(`position: sticky`)放置批量操作按钮 - **批量操作按钮的显示条件**:选中行数>0时才显示,按钮文本含数量如"批量删除(3)" - **行内操作列**:每行右侧的操作列(编辑/删除/查看等)保留在表格最后一列不变 +- **操作列按钮风格统一**:行内操作按钮统一使用 `el-button link` 类型,主操作(编辑/查看)`type=primary`,危险操作(删除)`type=danger`,其他操作(启用/停用)`type=primary` +- **操作列不换行**:操作列设置 `white-space: nowrap`,确保所有按钮在一行内显示,不因宽度不足换行 ### 防重复请求 diff --git a/docs/02-功能清单/管理后台/03-设备管理/03-01-设备列表页面.md b/docs/02-功能清单/管理后台/03-设备管理/03-01-设备列表页面.md index 72fc2df..679ce4a 100644 --- a/docs/02-功能清单/管理后台/03-设备管理/03-01-设备列表页面.md +++ b/docs/02-功能清单/管理后台/03-设备管理/03-01-设备列表页面.md @@ -46,11 +46,11 @@ | 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 | |--------|------|------|------|------|---------|------| | 选择框 | 50 | - | - | left | - | center | -| 机床名称 | - | y | - | left | tooltip | left | -| device_code | - | y | - | - | tooltip | left | +| 机床名称 | - | y | - | left | tooltip | center | +| device_code | - | y | - | - | tooltip | center | | 车间 | - | y | 下拉 | - | - | center | | 品牌 | - | y | 下拉 | - | - | center | -| IP地址 | - | - | - | - | - | left | +| IP地址 | - | - | - | - | - | center | | 在线状态 | - | - | - | - | - | center | | 绑定工人 | - | - | - | - | - | center | | 操作 | 180 | - | - | right | - | center | diff --git a/docs/02-功能清单/管理后台/04-品牌模板/04-01-品牌列表页面.md b/docs/02-功能清单/管理后台/04-品牌模板/04-01-品牌列表页面.md index c93da52..b6b39c7 100644 --- a/docs/02-功能清单/管理后台/04-品牌模板/04-01-品牌列表页面.md +++ b/docs/02-功能清单/管理后台/04-品牌模板/04-01-品牌列表页面.md @@ -36,7 +36,7 @@ | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | |--------|------|------|---------|------| -| 品牌名称 | - | y | tooltip | left | +| 品牌名称 | - | y | tooltip | center | | 状态 | - | - | - | center | | 映射字段数 | - | - | - | center | | 操作 | 180 | - | - | center | diff --git a/docs/02-功能清单/管理后台/05-采集地址/05-01-采集地址页面.md b/docs/02-功能清单/管理后台/05-采集地址/05-01-采集地址页面.md index 286eb35..8b4589a 100644 --- a/docs/02-功能清单/管理后台/05-采集地址/05-01-采集地址页面.md +++ b/docs/02-功能清单/管理后台/05-采集地址/05-01-采集地址页面.md @@ -35,8 +35,8 @@ | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | |--------|------|------|---------|------| -| 名称 | - | y | tooltip | left | -| URL | min-width=200 | - | tooltip | left | +| 名称 | - | y | tooltip | center | +| URL | min-width=200 | - | tooltip | center | | 品牌 | - | - | - | center | | 采集间隔 | - | - | - | center | | 状态 | - | - | - | center | diff --git a/docs/02-功能清单/管理后台/06-员工管理/06-01-员工管理页面.md b/docs/02-功能清单/管理后台/06-员工管理/06-01-员工管理页面.md index 638538b..665350b 100644 --- a/docs/02-功能清单/管理后台/06-员工管理/06-01-员工管理页面.md +++ b/docs/02-功能清单/管理后台/06-员工管理/06-01-员工管理页面.md @@ -47,11 +47,11 @@ | 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 | |--------|------|------|------|------|---------|------| | 选择框 | 50 | - | - | left | - | center | -| 工号 | - | y | - | - | tooltip | left | -| 姓名 | - | y | - | - | tooltip | left | +| 工号 | - | y | - | - | tooltip | center | +| 姓名 | - | y | - | - | tooltip | center | | 状态 | - | - | - | - | - | center | | 绑定机床数 | - | y | - | - | - | center | -| 绑定机床 | - | - | - | - | tooltip(逗号分隔) | left | +| 绑定机床 | - | - | - | - | tooltip(逗号分隔) | center | | 操作 | 120 | - | - | right | - | center | > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则:选择框固定50,数据列不设width自动均分,操作列固定120。 @@ -70,7 +70,7 @@ ### 6. 弹窗规格 **新增/编辑工人弹窗:** -- 宽度500px,遮罩有,ESC关闭是(脏数据检测),标题=新增工人/编辑工人 +- 宽度700px,遮罩有,ESC关闭是(脏数据检测),标题=新增工人/编辑工人 表单字段: @@ -78,12 +78,14 @@ |------|------|------|--------|------|------| | 工号 | el-input maxlength=50 | 是 | - | 必填+唯一性(新增时) | - | | 姓名 | el-input maxlength=50 | 是 | - | 必填 | - | -| 绑定机床 | el-select multiple filterable | 否 | 空 | - | 仅显示未绑定其他工人的机床 | +| 绑定机床 | el-transfer 穿梭框 | 否 | 空 | - | 左侧显示可选机床,右侧显示已绑定机床 | 说明: - 弹窗中不设"状态"字段,新增默认启用 -- 绑定机床下拉:查询cnc_machine中未绑定其他工人的机床(uk_machine约束确保一对一) -- 编辑时回填当前已绑定机床+可选未绑定机床 +- 绑定机床使用穿梭框(el-transfer):左侧列出可选机床,右侧显示已绑定机床 +- 穿梭框数据:查询cnc_machine中未绑定其他工人的机床(uk_machine约束确保一对一),编辑时含当前已绑定的 +- 机床不论在线/离线状态均可绑定(绑定关系不受机床在线状态限制) +- 穿梭框每项显示格式:`device_code (机床名称) - 车间` ### 7. 状态机 diff --git a/docs/02-功能清单/管理后台/07-产量报表/07-01-产量报表页面.md b/docs/02-功能清单/管理后台/07-产量报表/07-01-产量报表页面.md index ffeeb0c..c09f6b0 100644 --- a/docs/02-功能清单/管理后台/07-产量报表/07-01-产量报表页面.md +++ b/docs/02-功能清单/管理后台/07-产量报表/07-01-产量报表页面.md @@ -56,8 +56,8 @@ | 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 | |--------|------|------|------|------|---------|------| | 日期 | - | y | - | left | - | center | -| 机床名称 | - | y | - | - | tooltip | left | -| 程序名 | - | y | - | - | tooltip | left | +| 机床名称 | - | y | - | - | tooltip | center | +| 程序名 | - | y | - | - | tooltip | center | | 产量 | - | y | - | - | - | center | | 运行时间 | - | - | - | - | - | center | | 切削时间 | - | - | - | - | - | center | diff --git a/docs/02-功能清单/管理后台/08-告警中心/08-01-告警中心页面.md b/docs/02-功能清单/管理后台/08-告警中心/08-01-告警中心页面.md index 0f0c9b1..04dae04 100644 --- a/docs/02-功能清单/管理后台/08-告警中心/08-01-告警中心页面.md +++ b/docs/02-功能清单/管理后台/08-告警中心/08-01-告警中心页面.md @@ -59,9 +59,9 @@ | 选择框 | 50 | - | - | left | - | center | | 告警时间 | - | y | - | - | - | center | | 告警类型 | - | - | - | - | - | center | -| 标题 | - | - | - | - | tooltip | left | +| 标题 | - | - | - | - | tooltip | center | | 机床 | - | - | - | - | tooltip | center | -| 详情 | - | - | - | - | tooltip | left | +| 详情 | - | - | - | - | tooltip | center | | 处理状态 | - | - | - | - | - | center | | 操作 | 120 | - | - | right | - | center | diff --git a/docs/02-功能清单/管理后台/09-系统设置/09-01-系统设置页面.md b/docs/02-功能清单/管理后台/09-系统设置/09-01-系统设置页面.md index 47afe1e..e22b23b 100644 --- a/docs/02-功能清单/管理后台/09-系统设置/09-01-系统设置页面.md +++ b/docs/02-功能清单/管理后台/09-系统设置/09-01-系统设置页面.md @@ -68,10 +68,10 @@ | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | |--------|------|------|---------|------| -| 配置项(config_key) | - | - | tooltip | left | -| 配置值(config_value) | - | - | tooltip | left | +| 配置项(config_key) | - | - | tooltip | center | +| 配置值(config_value) | - | - | tooltip | center | | 值类型(value_type) | - | - | - | center | -| 说明(description) | - | - | tooltip | left | +| 说明(description) | - | - | tooltip | center | | 操作 | 160 | - | - | center | > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则:数据列不设width自动均分,操作列固定160。 @@ -102,7 +102,7 @@ | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | |--------|------|------|---------|------| -| 车间名称 | - | - | tooltip | left | +| 车间名称 | - | - | tooltip | center | | 排序 | - | y | - | center | | 状态 | - | - | - | center | | 操作 | 160 | - | - | center | diff --git a/docs/02-功能清单/管理后台/11-操作日志/11-01-操作日志页面.md b/docs/02-功能清单/管理后台/11-操作日志/11-01-操作日志页面.md index a145bd5..6be60f4 100644 --- a/docs/02-功能清单/管理后台/11-操作日志/11-01-操作日志页面.md +++ b/docs/02-功能清单/管理后台/11-操作日志/11-01-操作日志页面.md @@ -67,11 +67,11 @@ | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | |--------|------|------|---------|------| | 修正时间 | - | y(默认倒序) | - | center | -| 目标表 | - | - | tooltip | left | +| 目标表 | - | - | tooltip | center | | 目标ID | - | - | - | center | | 修正前 | - | - | - | center | | 修正后 | - | - | - | center | -| 修正原因 | - | - | tooltip | left | +| 修正原因 | - | - | tooltip | center | | 操作IP | - | - | - | center | > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则:数据列不设width自动均分。 @@ -93,8 +93,8 @@ |--------|------|------|---------|------| | 时间 | - | y(默认倒序) | - | center | | 级别 | - | - | - | center | -| 来源 | - | - | tooltip | left | -| 消息 | - | - | tooltip+点击展开详情 | left | +| 来源 | - | - | tooltip | center | +| 消息 | - | - | tooltip+点击展开详情 | center | > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则:数据列不设width自动均分。 diff --git a/frontend/src/styles/admin.scss b/frontend/src/styles/admin.scss index 2ae2117..fd42a1c 100644 --- a/frontend/src/styles/admin.scss +++ b/frontend/src/styles/admin.scss @@ -18,6 +18,16 @@ html, body, #app { --el-table-header-bg-color: #f5f7fa; } +/* 表格所有列居中对齐(表头+内容) */ +.el-table .el-table__cell { + text-align: center; +} + +/* 操作列按钮不换行 */ +.el-table .cell .el-button + .el-button { + margin-left: 8px; +} + /* 确认框警告图标颜色 */ .el-message-box__status.el-icon { color: var(--el-color-warning) !important; diff --git a/frontend/src/views/alert/AlertPage.vue b/frontend/src/views/alert/AlertPage.vue index 85ea5c0..745b0ff 100644 --- a/frontend/src/views/alert/AlertPage.vue +++ b/frontend/src/views/alert/AlertPage.vue @@ -67,8 +67,10 @@ - 标记已处理 - 查看 + + 标记已处理 + 查看 + diff --git a/frontend/src/views/brand/BrandListPage.vue b/frontend/src/views/brand/BrandListPage.vue index 3f8b19b..99fdf6a 100644 --- a/frontend/src/views/brand/BrandListPage.vue +++ b/frontend/src/views/brand/BrandListPage.vue @@ -8,14 +8,12 @@ {{row.isEnabled?'启用':'停用'}} - 编辑 - - - - 复制 - - {{row.isEnabled?'禁用':'启用'}} - 删除 + + 编辑 + 复制 + {{row.isEnabled?'禁用':'启用'}} + 删除 + diff --git a/frontend/src/views/collect-address/CollectAddressListPage.vue b/frontend/src/views/collect-address/CollectAddressListPage.vue index 2e7805e..9e542db 100644 --- a/frontend/src/views/collect-address/CollectAddressListPage.vue +++ b/frontend/src/views/collect-address/CollectAddressListPage.vue @@ -15,8 +15,10 @@ {{row.failCount}} 次 - 编辑 - 删除 + + 编辑 + 删除 + diff --git a/frontend/src/views/log/LogPage.vue b/frontend/src/views/log/LogPage.vue index 8cb4f35..3d2847a 100644 --- a/frontend/src/views/log/LogPage.vue +++ b/frontend/src/views/log/LogPage.vue @@ -96,7 +96,9 @@ - 查看详情 + + 查看详情 + diff --git a/frontend/src/views/machine/MachineListPage.vue b/frontend/src/views/machine/MachineListPage.vue index 481806d..5045132 100644 --- a/frontend/src/views/machine/MachineListPage.vue +++ b/frontend/src/views/machine/MachineListPage.vue @@ -60,12 +60,10 @@ - - - 查看详情 - - 编辑 - 删除 + + 编辑 + 删除 + diff --git a/frontend/src/views/production/ProductionPage.vue b/frontend/src/views/production/ProductionPage.vue index 6dd182f..53c6424 100644 --- a/frontend/src/views/production/ProductionPage.vue +++ b/frontend/src/views/production/ProductionPage.vue @@ -50,8 +50,12 @@ {{row.dataStatus==='normal'?'正常':row.dataStatus==='offline'?'离线':'缺失'}} {{row.isAdjusted?'✓':'-'}} - 修正 - 修正历史 + + + 修正 + 修正历史 + + diff --git a/frontend/src/views/settings/SettingsPage.vue b/frontend/src/views/settings/SettingsPage.vue index b76c705..55f56f4 100644 --- a/frontend/src/views/settings/SettingsPage.vue +++ b/frontend/src/views/settings/SettingsPage.vue @@ -20,8 +20,10 @@ - 编辑 - 重置 + + 编辑 + 重置 + @@ -66,9 +68,11 @@ - 编辑 - {{ row.isEnabled ? '停用' : '启用' }} - 删除 + + 编辑 + {{ row.isEnabled ? '停用' : '启用' }} + 删除 + diff --git a/frontend/src/views/worker/WorkerListPage.vue b/frontend/src/views/worker/WorkerListPage.vue index a33d937..8fb2d24 100644 --- a/frontend/src/views/worker/WorkerListPage.vue +++ b/frontend/src/views/worker/WorkerListPage.vue @@ -18,8 +18,10 @@ - 编辑 - 删除 + + 编辑 + 删除 + @@ -34,7 +36,7 @@ @size-change="handleSizeChange" /> - + workerForm?.validateField('code')"/> @@ -42,10 +44,15 @@ - - - - + + 取消保存 @@ -65,7 +72,7 @@ const loading=ref(false);const tableData=ref([]);const selectedRows=re // 分页信息 const pagination=ref<{ currentPage: number; pageSize: number; total: number }>({ currentPage: 1, pageSize: 20, total: 0 }) const dialogVisible=ref(false);const submitting=ref(false);const editingId=ref(null) -const availableMachines=ref<{ id: number; name: string }[]>([]) +const availableMachines=ref<{ id: number; label: string; name: string }[]>([]) const query=reactive({isEnabled:undefined as number | undefined,keyword:''}) const form=reactive({code:'',name:'',machineIds:[] as number[]}) const workerForm=ref(null) @@ -93,7 +100,7 @@ function handleEdit(row: Worker){editingId.value=row.id;Object.assign(form,{code async function handleSubmit(){submitting.value=true;try{const ok = await (workerForm.value?.validate ? new Promise((resolve)=>workerForm.value!.validate((valid:boolean)=>resolve(valid))) : Promise.resolve(true)); if(!ok){return} await request[editingId.value?'put':'post'](editingId.value?`/admin/worker/${editingId.value}`:'/admin/worker',{...form});ElMessage.success('保存成功');dialogVisible.value=false;loadData()}finally{submitting.value=false}} async function handleDelete(row:any){await ElMessageBox.confirm('确定删除【'+row.name+'】?此操作不可恢复。','提示',{type:'warning'});await request.delete(`/admin/worker/${row.id}`);ElMessage.success('已删除');loadData()} async function batchStatus(isEnabled:number){await ElMessageBox.confirm('确定对选中的'+selectedRows.value.length+'项操作?','提示',{type:'warning'});for(const id of selectedRows.value.map((r:any)=>r.id)){await request.put(`/admin/worker/${id}/toggle`,{isEnabled})};ElMessage.success('操作成功');loadData()} -async function loadDrops(){const r: ApiResponse<{ items: Array<{ id: number; name: string }> }> = await request.get('/admin/worker/available-machines'); availableMachines.value = r.data?.items ?? []} +async function loadDrops(){const r: ApiResponse<{ items: Array<{ id: number; name: string; deviceCode?: string; workshopName?: string }> }> = await request.get('/admin/worker/available-machines'); availableMachines.value = (r.data?.items ?? []).map(m => ({ id: m.id, name: m.name, label: `${m.deviceCode || m.name} (${m.name})${m.workshopName ? ' - ' + m.workshopName : ''}` }))} function handlePageChange(page:number){pagination.value.currentPage=page;loadData()} function handleSizeChange(size:number){pagination.value.pageSize=size;pagination.value.currentPage=1;loadData()} onMounted(()=>{loadData();loadDrops()})