表头内容居中+操作列按钮统一nowrap+员工穿梭框绑定机床

- 02-前端全局规范.md: el-table增加居中规则,操作按钮增加link统一风格+nowrap规则
- 8个页面设计文档§4: 对齐列全部改为center
- 06-01-员工管理页面.md: 弹窗改为穿梭框(el-transfer),宽度700px,离线机床可绑定
- admin.scss: 全局el-table单元格居中
- 8个Vue组件: 操作列按钮统一link风格+white-space:nowrap
- WorkerListPage.vue: el-select multiple改为el-transfer穿梭框,弹窗700px
main
haoliang 1 week ago
parent d1ac40ed26
commit 2065bf75c5

@ -17,8 +17,8 @@
| 组件 | 用途 | 配置参数 | | 组件 | 用途 | 配置参数 |
|------|------|---------| |------|------|---------|
| el-table | 列表展示 | border, stripe, size=default, header-cell-style背景#f5f7fa | | el-table | 列表展示 | border, stripe, size=default, header-cell-style背景#f5f7fa+居中, cell-style居中 |
| el-table-column | 列定义 | show-overflow-tooltip=true 默认开启 | | el-table-column | 列定义 | show-overflow-tooltip=true 默认开启, 所有列居中对齐 |
| el-pagination | 分页 | page-sizes=[20,50,100], background=true, layout=total,sizes,prev,pager,next,jumper | | 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-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 | | el-dialog | 弹窗 | close-on-click-modal=false, close-on-press-escape=true, destroy-on-close=true |
@ -46,6 +46,8 @@
- **禁止使用下方浮出条**:不再使用表格底部浮出条(`position: sticky`)放置批量操作按钮 - **禁止使用下方浮出条**:不再使用表格底部浮出条(`position: sticky`)放置批量操作按钮
- **批量操作按钮的显示条件**:选中行数>0时才显示按钮文本含数量如"批量删除(3)" - **批量操作按钮的显示条件**:选中行数>0时才显示按钮文本含数量如"批量删除(3)"
- **行内操作列**:每行右侧的操作列(编辑/删除/查看等)保留在表格最后一列不变 - **行内操作列**:每行右侧的操作列(编辑/删除/查看等)保留在表格最后一列不变
- **操作列按钮风格统一**:行内操作按钮统一使用 `el-button link` 类型,主操作(编辑/查看)`type=primary`,危险操作(删除)`type=danger`,其他操作(启用/停用)`type=primary`
- **操作列不换行**:操作列设置 `white-space: nowrap`,确保所有按钮在一行内显示,不因宽度不足换行
### 防重复请求 ### 防重复请求

@ -46,11 +46,11 @@
| 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 |
|--------|------|------|------|------|---------|------| |--------|------|------|------|------|---------|------|
| 选择框 | 50 | - | - | left | - | center | | 选择框 | 50 | - | - | left | - | center |
| 机床名称 | - | y | - | left | tooltip | left | | 机床名称 | - | y | - | left | tooltip | center |
| device_code | - | y | - | - | tooltip | left | | device_code | - | y | - | - | tooltip | center |
| 车间 | - | y | 下拉 | - | - | center | | 车间 | - | y | 下拉 | - | - | center |
| 品牌 | - | y | 下拉 | - | - | center | | 品牌 | - | y | 下拉 | - | - | center |
| IP地址 | - | - | - | - | - | left | | IP地址 | - | - | - | - | - | center |
| 在线状态 | - | - | - | - | - | center | | 在线状态 | - | - | - | - | - | center |
| 绑定工人 | - | - | - | - | - | center | | 绑定工人 | - | - | - | - | - | center |
| 操作 | 180 | - | - | right | - | center | | 操作 | 180 | - | - | right | - | center |

@ -36,7 +36,7 @@
| 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 |
|--------|------|------|---------|------| |--------|------|------|---------|------|
| 品牌名称 | - | y | tooltip | left | | 品牌名称 | - | y | tooltip | center |
| 状态 | - | - | - | center | | 状态 | - | - | - | center |
| 映射字段数 | - | - | - | center | | 映射字段数 | - | - | - | center |
| 操作 | 180 | - | - | center | | 操作 | 180 | - | - | center |

@ -35,8 +35,8 @@
| 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 |
|--------|------|------|---------|------| |--------|------|------|---------|------|
| 名称 | - | y | tooltip | left | | 名称 | - | y | tooltip | center |
| URL | min-width=200 | - | tooltip | left | | URL | min-width=200 | - | tooltip | center |
| 品牌 | - | - | - | center | | 品牌 | - | - | - | center |
| 采集间隔 | - | - | - | center | | 采集间隔 | - | - | - | center |
| 状态 | - | - | - | center | | 状态 | - | - | - | center |

@ -47,11 +47,11 @@
| 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 |
|--------|------|------|------|------|---------|------| |--------|------|------|------|------|---------|------|
| 选择框 | 50 | - | - | left | - | center | | 选择框 | 50 | - | - | left | - | center |
| 工号 | - | y | - | - | tooltip | left | | 工号 | - | y | - | - | tooltip | center |
| 姓名 | - | y | - | - | tooltip | left | | 姓名 | - | y | - | - | tooltip | center |
| 状态 | - | - | - | - | - | center | | 状态 | - | - | - | - | - | center |
| 绑定机床数 | - | y | - | - | - | center | | 绑定机床数 | - | y | - | - | - | center |
| 绑定机床 | - | - | - | - | tooltip(逗号分隔) | left | | 绑定机床 | - | - | - | - | tooltip(逗号分隔) | center |
| 操作 | 120 | - | - | right | - | center | | 操作 | 120 | - | - | right | - | center |
> 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则选择框固定50数据列不设width自动均分操作列固定120。 > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则选择框固定50数据列不设width自动均分操作列固定120。
@ -70,7 +70,7 @@
### 6. 弹窗规格 ### 6. 弹窗规格
**新增/编辑工人弹窗:** **新增/编辑工人弹窗:**
- 宽度500px遮罩有ESC关闭是(脏数据检测),标题=新增工人/编辑工人 - 宽度700px遮罩有ESC关闭是(脏数据检测),标题=新增工人/编辑工人
表单字段: 表单字段:
@ -78,12 +78,14 @@
|------|------|------|--------|------|------| |------|------|------|--------|------|------|
| 工号 | el-input maxlength=50 | 是 | - | 必填+唯一性(新增时) | - | | 工号 | el-input maxlength=50 | 是 | - | 必填+唯一性(新增时) | - |
| 姓名 | 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. 状态机 ### 7. 状态机

@ -56,8 +56,8 @@
| 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 筛选 | 固定 | 超长处理 | 对齐 |
|--------|------|------|------|------|---------|------| |--------|------|------|------|------|---------|------|
| 日期 | - | y | - | left | - | center | | 日期 | - | y | - | left | - | center |
| 机床名称 | - | y | - | - | tooltip | left | | 机床名称 | - | y | - | - | tooltip | center |
| 程序名 | - | y | - | - | tooltip | left | | 程序名 | - | y | - | - | tooltip | center |
| 产量 | - | y | - | - | - | center | | 产量 | - | y | - | - | - | center |
| 运行时间 | - | - | - | - | - | center | | 运行时间 | - | - | - | - | - | center |
| 切削时间 | - | - | - | - | - | center | | 切削时间 | - | - | - | - | - | center |

@ -59,9 +59,9 @@
| 选择框 | 50 | - | - | left | - | center | | 选择框 | 50 | - | - | left | - | center |
| 告警时间 | - | y | - | - | - | center | | 告警时间 | - | y | - | - | - | center |
| 告警类型 | - | - | - | - | - | center | | 告警类型 | - | - | - | - | - | center |
| 标题 | - | - | - | - | tooltip | left | | 标题 | - | - | - | - | tooltip | center |
| 机床 | - | - | - | - | tooltip | center | | 机床 | - | - | - | - | tooltip | center |
| 详情 | - | - | - | - | tooltip | left | | 详情 | - | - | - | - | tooltip | center |
| 处理状态 | - | - | - | - | - | center | | 处理状态 | - | - | - | - | - | center |
| 操作 | 120 | - | - | right | - | center | | 操作 | 120 | - | - | right | - | center |

@ -68,10 +68,10 @@
| 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 |
|--------|------|------|---------|------| |--------|------|------|---------|------|
| 配置项(config_key) | - | - | tooltip | left | | 配置项(config_key) | - | - | tooltip | center |
| 配置值(config_value) | - | - | tooltip | left | | 配置值(config_value) | - | - | tooltip | center |
| 值类型(value_type) | - | - | - | center | | 值类型(value_type) | - | - | - | center |
| 说明(description) | - | - | tooltip | left | | 说明(description) | - | - | tooltip | center |
| 操作 | 160 | - | - | center | | 操作 | 160 | - | - | center |
> 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则数据列不设width自动均分操作列固定160。 > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则数据列不设width自动均分操作列固定160。
@ -102,7 +102,7 @@
| 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 |
|--------|------|------|---------|------| |--------|------|------|---------|------|
| 车间名称 | - | - | tooltip | left | | 车间名称 | - | - | tooltip | center |
| 排序 | - | y | - | center | | 排序 | - | y | - | center |
| 状态 | - | - | - | center | | 状态 | - | - | - | center |
| 操作 | 160 | - | - | center | | 操作 | 160 | - | - | center |

@ -67,11 +67,11 @@
| 字段名 | 列宽 | 排序 | 超长处理 | 对齐 | | 字段名 | 列宽 | 排序 | 超长处理 | 对齐 |
|--------|------|------|---------|------| |--------|------|------|---------|------|
| 修正时间 | - | y(默认倒序) | - | center | | 修正时间 | - | y(默认倒序) | - | center |
| 目标表 | - | - | tooltip | left | | 目标表 | - | - | tooltip | center |
| 目标ID | - | - | - | center | | 目标ID | - | - | - | center |
| 修正前 | - | - | - | center | | 修正前 | - | - | - | center |
| 修正后 | - | - | - | center | | 修正后 | - | - | - | center |
| 修正原因 | - | - | tooltip | left | | 修正原因 | - | - | tooltip | center |
| 操作IP | - | - | - | center | | 操作IP | - | - | - | center |
> 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则数据列不设width自动均分。 > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则数据列不设width自动均分。
@ -93,8 +93,8 @@
|--------|------|------|---------|------| |--------|------|------|---------|------|
| 时间 | - | y(默认倒序) | - | center | | 时间 | - | y(默认倒序) | - | center |
| 级别 | - | - | - | center | | 级别 | - | - | - | center |
| 来源 | - | - | tooltip | left | | 来源 | - | - | tooltip | center |
| 消息 | - | - | tooltip+点击展开详情 | left | | 消息 | - | - | tooltip+点击展开详情 | center |
> 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则数据列不设width自动均分。 > 列宽规则见 `02-前端全局规范.md` el-table列宽均分规则数据列不设width自动均分。

@ -18,6 +18,16 @@ html, body, #app {
--el-table-header-bg-color: #f5f7fa; --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 { .el-message-box__status.el-icon {
color: var(--el-color-warning) !important; color: var(--el-color-warning) !important;

@ -67,8 +67,10 @@
</el-table-column> </el-table-column>
<el-table-column label="操作" width="120" fixed="right" align="center"> <el-table-column label="操作" width="120" fixed="right" align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-button v-if="!row.isResolved" link type="primary" @click="handleResolve(row)"></el-button> <div style="white-space:nowrap">
<el-button v-else link type="primary" @click="viewDetail(row)"></el-button> <el-button v-if="!row.isResolved" link type="primary" @click="handleResolve(row)"></el-button>
<el-button v-else link type="primary" @click="viewDetail(row)"></el-button>
</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>

@ -8,14 +8,12 @@
<el-table-column label="状态" align="center"><template #default="{row}"><el-tag :type="row.isEnabled?'success':'danger'" size="small">{{row.isEnabled?'启用':'停用'}}</el-tag></template></el-table-column> <el-table-column label="状态" align="center"><template #default="{row}"><el-tag :type="row.isEnabled?'success':'danger'" size="small">{{row.isEnabled?'启用':'停用'}}</el-tag></template></el-table-column>
<el-table-column prop="fieldCount" label="字段数" align="center"/> <el-table-column prop="fieldCount" label="字段数" align="center"/>
<el-table-column label="操作" width="180" align="center"><template #default="{row}"> <el-table-column label="操作" width="180" align="center"><template #default="{row}">
<el-button link type="primary" @click="goEdit(row.id)"></el-button> <div style="white-space:nowrap">
<!-- 复制按钮放在编辑之后 --> <el-button link type="primary" @click="goEdit(row.id)"></el-button>
<el-button text type="default" @click="handleCopy(row)" style="margin-left:6px; display:inline-flex; align-items:center; gap:6px"> <el-button link type="primary" @click="handleCopy(row)"></el-button>
<el-icon><CopyDocument/></el-icon> <el-button link type="primary" @click="handleToggle(row)">{{row.isEnabled?'':''}}</el-button>
复制 <el-button link type="danger" @click="handleDelete(row)"></el-button>
</el-button> </div>
<el-button link type="primary" @click="handleToggle(row)">{{row.isEnabled?'':''}}</el-button>
<el-button link type="danger" @click="handleDelete(row)"></el-button>
</template></el-table-column> </template></el-table-column>
</el-table> </el-table>
</div> </div>

@ -15,8 +15,10 @@
<el-table-column prop="machineCount" label="机床数" align="center"/> <el-table-column prop="machineCount" label="机床数" align="center"/>
<el-table-column prop="failCount" label="连续失败" align="center"><template #default="{row}"><el-tag :type="row.failCount===0?'success':row.failCount<=3?'warning':'danger'" size="small">{{row.failCount}} </el-tag></template></el-table-column> <el-table-column prop="failCount" label="连续失败" align="center"><template #default="{row}"><el-tag :type="row.failCount===0?'success':row.failCount<=3?'warning':'danger'" size="small">{{row.failCount}} </el-tag></template></el-table-column>
<el-table-column label="操作" width="120" align="center"><template #default="{row}"> <el-table-column label="操作" width="120" align="center"><template #default="{row}">
<el-button link type="primary" @click="handleEdit(row)"></el-button> <div style="white-space:nowrap">
<el-button link type="danger" @click="handleDelete(row)"></el-button> <el-button link type="primary" @click="handleEdit(row)"></el-button>
<el-button link type="danger" @click="handleDelete(row)"></el-button>
</div>
</template></el-table-column> </template></el-table-column>
</el-table> </el-table>
<el-dialog v-model="dialogVisible" :title="editingId?'编辑地址':'新增地址'" width="600px" destroy-on-close> <el-dialog v-model="dialogVisible" :title="editingId?'编辑地址':'新增地址'" width="600px" destroy-on-close>

@ -96,7 +96,9 @@
</el-table-column> </el-table-column>
<el-table-column label="操作" width="100" fixed="right" align="center"> <el-table-column label="操作" width="100" fixed="right" align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-button link type="primary" @click="viewSysDetail(row)"></el-button> <div style="white-space:nowrap">
<el-button link type="primary" @click="viewSysDetail(row)"></el-button>
</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>

@ -60,12 +60,10 @@
</el-table-column> </el-table-column>
<el-table-column label="操作" width="180" fixed="right" align="center"> <el-table-column label="操作" width="180" fixed="right" align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-button type="primary" plain @click="handleViewDetail(row)" style="margin-right:6px"> <div style="white-space:nowrap">
<el-icon><View/></el-icon> <el-button link type="primary" @click="handleEdit(row)"></el-button>
查看详情 <el-button link type="danger" @click="handleDelete(row)"></el-button>
</el-button> </div>
<el-button type="primary" plain @click="handleEdit(row)"></el-button>
<el-button link type="danger" @click="handleDelete(row)"></el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>

@ -50,8 +50,12 @@
<el-table-column prop="cuttingTime" label="切削时间" align="center"/> <el-table-column prop="cuttingTime" label="切削时间" align="center"/>
<el-table-column label="日状态" align="center"><template #default="{row}"><el-tag :type="row.dataStatus==='normal'?'info':row.dataStatus==='offline'?'danger':'warning'" size="small">{{row.dataStatus==='normal'?'正常':row.dataStatus==='offline'?'离线':'缺失'}}</el-tag></template></el-table-column> <el-table-column label="日状态" align="center"><template #default="{row}"><el-tag :type="row.dataStatus==='normal'?'info':row.dataStatus==='offline'?'danger':'warning'" size="small">{{row.dataStatus==='normal'?'正常':row.dataStatus==='offline'?'离线':'缺失'}}</el-tag></template></el-table-column>
<el-table-column label="修正" align="center"><template #default="{row}">{{row.isAdjusted?'✓':'-'}}</template></el-table-column> <el-table-column label="修正" align="center"><template #default="{row}">{{row.isAdjusted?'✓':'-'}}</template></el-table-column>
<el-table-column label="操作" width="180" align="center"><template #default="{row}"><el-button text type="primary" @click="handleAdjust(row)"></el-button> <el-table-column label="操作" width="180" align="center"><template #default="{row}">
<el-button text @click="showHistory(row)" style="margin-left:8px">修正历史</el-button></template></el-table-column> <div style="white-space:nowrap">
<el-button link type="primary" @click="handleAdjust(row)"></el-button>
<el-button link type="primary" @click="showHistory(row)"></el-button>
</div>
</template></el-table-column>
</el-table> </el-table>
<el-pagination v-model:current-page="page.page" v-model:page-size="page.pageSize" :page-sizes="[20,50,100]" :total="page.total" background layout="total,sizes,prev,pager,next,jumper"/> <el-pagination v-model:current-page="page.page" v-model:page-size="page.pageSize" :page-sizes="[20,50,100]" :total="page.total" background layout="total,sizes,prev,pager,next,jumper"/>

@ -20,8 +20,10 @@
<el-table-column prop="description" label="说明" show-overflow-tooltip /> <el-table-column prop="description" label="说明" show-overflow-tooltip />
<el-table-column label="操作" width="160" align="center"> <el-table-column label="操作" width="160" align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-button link type="primary" @click="editConfig(row)"></el-button> <div style="white-space:nowrap">
<el-button v-if="isSensitive(row.configKey)" link type="warning" @click="resetToken(row)"></el-button> <el-button link type="primary" @click="editConfig(row)"></el-button>
<el-button v-if="isSensitive(row.configKey)" link type="primary" @click="resetToken(row)"></el-button>
</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -66,9 +68,11 @@
</el-table-column> </el-table-column>
<el-table-column label="操作" width="160" align="center"> <el-table-column label="操作" width="160" align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-button link type="primary" @click="editWorkshop(row)"></el-button> <div style="white-space:nowrap">
<el-button link type="primary" @click="toggleWorkshop(row)">{{ row.isEnabled ? '' : '' }}</el-button> <el-button link type="primary" @click="editWorkshop(row)"></el-button>
<el-button link type="danger" @click="deleteWorkshop(row)" :disabled="row.machineCount > 0">删除</el-button> <el-button link type="primary" @click="toggleWorkshop(row)">{{ row.isEnabled ? '' : '' }}</el-button>
<el-button link type="danger" @click="deleteWorkshop(row)" :disabled="row.machineCount > 0">删除</el-button>
</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>

@ -18,8 +18,10 @@
<el-table-column prop="machineCount" label="绑定机床数" align="center"/> <el-table-column prop="machineCount" label="绑定机床数" align="center"/>
<el-table-column prop="machineNames" label="绑定机床" show-overflow-tooltip/> <el-table-column prop="machineNames" label="绑定机床" show-overflow-tooltip/>
<el-table-column label="操作" width="120" align="center"><template #default="{row}"> <el-table-column label="操作" width="120" align="center"><template #default="{row}">
<el-button link type="primary" @click="handleEdit(row)"></el-button> <div style="white-space:nowrap">
<el-button link type="danger" @click="handleDelete(row)" :disabled="row.machineCount>0">删除</el-button> <el-button link type="primary" @click="handleEdit(row)"></el-button>
<el-button link type="danger" @click="handleDelete(row)" :disabled="row.machineCount>0">删除</el-button>
</div>
</template></el-table-column> </template></el-table-column>
</el-table> </el-table>
<!-- 分页控件 --> <!-- 分页控件 -->
@ -34,7 +36,7 @@
@size-change="handleSizeChange" @size-change="handleSizeChange"
/> />
</div> </div>
<el-dialog v-model="dialogVisible" :title="editingId?'编辑工人':'新增工人'" width="500px" destroy-on-close> <el-dialog v-model="dialogVisible" :title="editingId?'编辑工人':'新增工人'" width="700px" destroy-on-close>
<el-form :model="form" :rules="rules" ref="workerForm" label-width="100px"> <el-form :model="form" :rules="rules" ref="workerForm" label-width="100px">
<el-form-item label="工号" prop="code"> <el-form-item label="工号" prop="code">
<el-input v-model="form.code" maxlength="50" @blur="()=>workerForm?.validateField('code')"/> <el-input v-model="form.code" maxlength="50" @blur="()=>workerForm?.validateField('code')"/>
@ -42,10 +44,15 @@
<el-form-item label="姓名" prop="name"> <el-form-item label="姓名" prop="name">
<el-input v-model="form.name" maxlength="50"/> <el-input v-model="form.name" maxlength="50"/>
</el-form-item> </el-form-item>
<el-form-item label="绑定机床" prop="machineIds"> <el-form-item label="绑定机床">
<el-select v-model="form.machineIds" multiple filterable> <el-transfer
<el-option v-for="m in availableMachines" :key="m.id" :label="m.name" :value="m.id"/> v-model="form.machineIds"
</el-select> :data="availableMachines"
:titles="['可选机床', '已绑定']"
:props="{ key: 'id', label: 'label' }"
filterable
filter-placeholder="搜索机床"
/>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer><el-button @click="dialogVisible=false"></el-button><el-button type="primary" :loading="submitting" @click="handleSubmit"></el-button></template> <template #footer><el-button @click="dialogVisible=false"></el-button><el-button type="primary" :loading="submitting" @click="handleSubmit"></el-button></template>
@ -65,7 +72,7 @@ const loading=ref(false);const tableData=ref<Worker[]>([]);const selectedRows=re
// //
const pagination=ref<{ currentPage: number; pageSize: number; total: number }>({ currentPage: 1, pageSize: 20, total: 0 }) 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<number|null>(null) const dialogVisible=ref(false);const submitting=ref(false);const editingId=ref<number|null>(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 query=reactive({isEnabled:undefined as number | undefined,keyword:''})
const form=reactive({code:'',name:'',machineIds:[] as number[]}) const form=reactive({code:'',name:'',machineIds:[] as number[]})
const workerForm=ref<FormInstance | null>(null) const workerForm=ref<FormInstance | null>(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<boolean>((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 handleSubmit(){submitting.value=true;try{const ok = await (workerForm.value?.validate ? new Promise<boolean>((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 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 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 handlePageChange(page:number){pagination.value.currentPage=page;loadData()}
function handleSizeChange(size:number){pagination.value.pageSize=size;pagination.value.currentPage=1;loadData()} function handleSizeChange(size:number){pagination.value.pageSize=size;pagination.value.currentPage=1;loadData()}
onMounted(()=>{loadData();loadDrops()}) onMounted(()=>{loadData();loadDrops()})

Loading…
Cancel
Save