弹窗加宽900px,穿梭框左侧过滤已绑定其他工人的机床,改为按需加载

main
haoliang 1 week ago
parent f865de2a9a
commit 3166ee94a5

@ -36,7 +36,7 @@
@size-change="handleSizeChange"
/>
</div>
<el-dialog v-model="dialogVisible" :title="editingId?'编辑工人':'新增工人'" width="700px" destroy-on-close>
<el-dialog v-model="dialogVisible" :title="editingId?'编辑工人':'新增工人'" width="900px" destroy-on-close>
<el-form :model="form" :rules="rules" ref="workerForm" label-width="100px">
<el-form-item label="工号" prop="code">
<el-input v-model="form.code" maxlength="50" @blur="()=>workerForm?.validateField('code')"/>
@ -48,7 +48,7 @@
<el-transfer
v-model="form.machineIds"
:data="availableMachines"
:titles="['全部机床', '已选择']"
:titles="['可绑定机床', '已选择']"
:props="{ key: 'id', label: 'label' }"
filterable
filter-placeholder="搜索机床"
@ -110,35 +110,50 @@ rules.code = [{ validator: validateWorkerCode, trigger: 'blur' }]
function resetQuery(){query.isEnabled=undefined;query.keyword='';loadData()}
function goDetail(id:number){router.push((isMock.value?'/mock/worker/':'/worker/')+id)}
async function loadData(){loading.value=true;try{const ps=pagination.value.pageSize;const cp=pagination.value.currentPage;const r: ApiResponse<{ items: Worker[]; total?: number }> = await request.get('/admin/worker',{params:{...query,page:cp,pageSize:ps}});tableData.value=r.data?.items||[];pagination.value.total= r.data?.total ?? (r.data?.items?.length ?? 0)}finally{loading.value=false}}
function handleAdd(){editingId.value=null;Object.assign(form,{code:'',name:'',machineIds:[]});dialogVisible.value=true}
function handleAdd(){editingId.value=null;Object.assign(form,{code:'',name:'',machineIds:[]});loadTransferData();dialogVisible.value=true}
async function handleEdit(row: Worker){
editingId.value=row.id
//
Object.assign(form,{code:row.code,name:row.name,machineIds:[]})
await loadTransferData(row.id)
dialogVisible.value=true
// ID
}
/** 加载穿梭框数据:未绑定的机床 + 当前编辑工人的已绑定机床 */
async function loadTransferData(workerId?: number){
try{
// +
const [rAll, rAvail] = await Promise.all([
request.get('/admin/machine',{params:{pageSize:999}}),
request.get('/admin/worker/available-machines')
])
const allMachines: any[] = (rAll as any).data?.items ?? []
const availIds = new Set(((rAvail as any).data?.items ?? []).map((m: any) => m.id))
//
let ownIds = new Set<number>()
if(workerId){
try{
const r: ApiResponse<{ items: Array<{machineId:number}> }> = await request.get(`/admin/worker/${row.id}/machines`)
form.machineIds = (r.data?.items ?? []).map(m => m.machineId)
}catch{/* 获取失败时保持为空 */}
const rOwn: ApiResponse<{ items: Array<{machineId:number}> }> = await request.get(`/admin/worker/${workerId}/machines`)
const items = rOwn.data?.items ?? []
ownIds = new Set(items.map((m: any) => m.machineId))
form.machineIds = items.map((m: any) => m.machineId)
}catch{}
}
//
availableMachines.value = allMachines
.filter((m: any) => availIds.has(m.id) || ownIds.has(m.id))
.map(m => ({ id: m.id, name: m.name, label: m.name, deviceCode: m.deviceCode, workshopName: m.workshopName, isOnline: m.isOnline, isEnabled: m.isEnabled }))
}catch{/* 接口不可用时保持为空 */}
}
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 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(){try{const r: ApiResponse<{ items: MachineItem[] }> = await request.get('/admin/machine',{params:{pageSize:999}}); availableMachines.value = (r.data?.items ?? []).map(m => ({ id: m.id, name: m.name, label: m.name, deviceCode: m.deviceCode, workshopName: m.workshopName, isOnline: m.isOnline, isEnabled: m.isEnabled }))}catch{/* 接口不可用时保持为空,不影响其他功能 */}}
function handlePageChange(page:number){pagination.value.currentPage=page;loadData()}
function handleSizeChange(size:number){pagination.value.pageSize=size;pagination.value.currentPage=1;loadData()}
/** 根据机床在线/启用状态返回色点内联样式 */
function dotStyle(m: MachineItem): Record<string, string> {
const color = !m.isEnabled ? '#f56c6c' : m.isOnline ? '#67c23a' : '#c0c4cc'
return { display: 'inline-block', width: '8px', height: '8px', borderRadius: '50%', marginRight: '6px', verticalAlign: 'middle', backgroundColor: color }
}
function getStatusClass(m: MachineItem): string {
if (!m.isEnabled) return 'status-disabled'
if (m.isOnline) return 'status-online'
return 'status-offline'
}
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()})
onMounted(()=>{loadData()})
</script>
<style scoped>
/* 穿梭框状态色点 */

Loading…
Cancel
Save