|
|
|
@ -131,6 +131,7 @@ |
|
|
|
<script> |
|
|
|
import Chooselist from '@/views/modules/common/Chooselist'; |
|
|
|
import column from '@/views/modules/common/column';/*动态表头*/ |
|
|
|
import Sortable from 'sortablejs'; // 引入拖拽排序库 |
|
|
|
|
|
|
|
/*动态表头*/ |
|
|
|
import { |
|
|
|
@ -147,6 +148,7 @@ import { |
|
|
|
cancelScheduleWithScheduleQuery, |
|
|
|
resortJobUp, |
|
|
|
resortJobDown, |
|
|
|
batchUpdateSerialNumber, |
|
|
|
} from "@/api/shopOrder/shopOrder.js" |
|
|
|
|
|
|
|
export default { |
|
|
|
@ -166,6 +168,7 @@ export default { |
|
|
|
modelInputFlag: true, |
|
|
|
selectList: [], |
|
|
|
scheduleRow: {}, |
|
|
|
draggedItem: null, // 记录拖拽的项目 |
|
|
|
pageData: { |
|
|
|
site: this.$store.state.user.site, |
|
|
|
username: this.$store.state.user.name, |
|
|
|
@ -213,13 +216,13 @@ export default { |
|
|
|
{ |
|
|
|
userId: this.$store.state.user.name, |
|
|
|
functionId: 6023, |
|
|
|
serialNumber: '6023TableSScheduledSeqNo', |
|
|
|
serialNumber: '6023TableSerialNumber', |
|
|
|
tableId: "6023Table", |
|
|
|
tableName: "查询生产派工单表", |
|
|
|
columnProp: "sScheduledSeqNo", |
|
|
|
columnProp: "serialNumber", |
|
|
|
headerAlign: "center", |
|
|
|
align: "right", |
|
|
|
columnLabel: "订单优先级", |
|
|
|
columnLabel: "序号", |
|
|
|
columnHidden: false, |
|
|
|
columnImage: false, |
|
|
|
columnSortable: false, |
|
|
|
@ -246,6 +249,24 @@ export default { |
|
|
|
fixed: '', |
|
|
|
columnWidth: 120 |
|
|
|
}, |
|
|
|
{ |
|
|
|
userId: this.$store.state.user.name, |
|
|
|
functionId: 6023, |
|
|
|
serialNumber: '6023TableSeqNo', |
|
|
|
tableId: "6023Table", |
|
|
|
tableName: "查询生产派工单表", |
|
|
|
columnProp: "seqNo", |
|
|
|
headerAlign: "center", |
|
|
|
align: "left", |
|
|
|
columnLabel: "派工单单号", |
|
|
|
columnHidden: false, |
|
|
|
columnImage: false, |
|
|
|
columnSortable: false, |
|
|
|
sortLv: 0, |
|
|
|
status: true, |
|
|
|
fixed: '', |
|
|
|
columnWidth: 120 |
|
|
|
}, |
|
|
|
{ |
|
|
|
userId: this.$store.state.user.name, |
|
|
|
functionId: 6023, |
|
|
|
@ -786,24 +807,6 @@ export default { |
|
|
|
fixed: '', |
|
|
|
columnWidth: 80 |
|
|
|
}, |
|
|
|
{ |
|
|
|
userId: this.$store.state.user.name, |
|
|
|
functionId: 6023, |
|
|
|
serialNumber: '6023TableSeqNo', |
|
|
|
tableId: "6023Table", |
|
|
|
tableName: "查询生产派工单表", |
|
|
|
columnProp: "seqNo", |
|
|
|
headerAlign: "center", |
|
|
|
align: "left", |
|
|
|
columnLabel: "派工单单号", |
|
|
|
columnHidden: false, |
|
|
|
columnImage: false, |
|
|
|
columnSortable: false, |
|
|
|
sortLv: 0, |
|
|
|
status: true, |
|
|
|
fixed: '', |
|
|
|
columnWidth: 120 |
|
|
|
}, |
|
|
|
{ |
|
|
|
userId: this.$store.state.user.name, |
|
|
|
functionId: 6023, |
|
|
|
@ -979,10 +982,205 @@ export default { |
|
|
|
mounted() { |
|
|
|
this.$nextTick(() => { |
|
|
|
this.height = window.innerHeight - 180; |
|
|
|
// 初始化拖拽排序 |
|
|
|
this.initSortable(); |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
/*初始化拖拽排序*/ |
|
|
|
initSortable() { |
|
|
|
const el = document.querySelector('.el-table__body-wrapper tbody'); |
|
|
|
if (!el) return; |
|
|
|
|
|
|
|
Sortable.create(el, { |
|
|
|
animation: 150, // 动画时间 |
|
|
|
handle: 'tr', // 拖拽手柄，整行都可以拖拽 |
|
|
|
ghostClass: 'sortable-ghost', // 拖拽时的样式类 |
|
|
|
onEnd: this.handleDragEnd, // 拖拽结束时的回调 |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
/*拖拽结束处理*/ |
|
|
|
handleDragEnd(evt) { |
|
|
|
const { oldIndex, newIndex } = evt; |
|
|
|
|
|
|
|
console.log('=== 拖拽开始 ==='); |
|
|
|
console.log('oldIndex:', oldIndex, 'newIndex:', newIndex); |
|
|
|
|
|
|
|
// 如果位置没有变化，不处理 |
|
|
|
if (oldIndex === newIndex) { |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
// 获取被拖拽的项 |
|
|
|
const movedItem = this.dataList[oldIndex]; |
|
|
|
const targetSerialNumber = this.dataList[newIndex].serialNumber; |
|
|
|
|
|
|
|
console.log('被拖拽项:', movedItem.orderNo, '原序号:', movedItem.serialNumber); |
|
|
|
console.log('目标位置序号:', targetSerialNumber); |
|
|
|
|
|
|
|
// 记录被拖拽的项目（用于刷新后定位） |
|
|
|
this.draggedItem = { |
|
|
|
site: movedItem.site, |
|
|
|
orderNo: movedItem.orderNo, |
|
|
|
itemNo: movedItem.itemNo, |
|
|
|
seqNo: movedItem.seqNo, // 使用 seqNo（派工单号） |
|
|
|
newSerialNumber: targetSerialNumber // 记录目标位置的序号 |
|
|
|
}; |
|
|
|
|
|
|
|
// 移动数据（视觉上立即生效） |
|
|
|
this.dataList.splice(oldIndex, 1); |
|
|
|
this.dataList.splice(newIndex, 0, movedItem); |
|
|
|
|
|
|
|
console.log('移动后的dataList顺序:'); |
|
|
|
this.dataList.forEach((item, idx) => { |
|
|
|
console.log(` 位置${idx}: ${item.orderNo}-工序${item.itemNo} | SeqNo:${item.seqNo} | serial_number:${item.serialNumber}`); |
|
|
|
}); |
|
|
|
|
|
|
|
// 重新分配序号并保存到后端 |
|
|
|
this.reassignSerialNumbers(oldIndex, newIndex); |
|
|
|
}, |
|
|
|
|
|
|
|
/*重新分配序号（插入式排序）*/ |
|
|
|
reassignSerialNumbers(oldIndex, newIndex) { |
|
|
|
// 按照 site 和 resourceId 分组 |
|
|
|
const groupedData = {}; |
|
|
|
|
|
|
|
this.dataList.forEach((item) => { |
|
|
|
const key = `${item.site}_${item.sResourceID}`; |
|
|
|
if (!groupedData[key]) { |
|
|
|
groupedData[key] = []; |
|
|
|
} |
|
|
|
groupedData[key].push(item); |
|
|
|
}); |
|
|
|
|
|
|
|
// 对每个分组重新分配序号 |
|
|
|
const updateList = []; |
|
|
|
Object.keys(groupedData).forEach(key => { |
|
|
|
const group = groupedData[key]; |
|
|
|
|
|
|
|
// 按当前顺序重新分配序号（从1开始） |
|
|
|
group.forEach((item, index) => { |
|
|
|
const newSerialNumber = index + 1; |
|
|
|
|
|
|
|
// 只更新序号发生变化的记录 |
|
|
|
if (item.serialNumber !== newSerialNumber) { |
|
|
|
console.log(`更新序号: ${item.orderNo}-工序${item.itemNo}-SeqNo${item.seqNo} 从 ${item.serialNumber} 改为 ${newSerialNumber}`); |
|
|
|
updateList.push({ |
|
|
|
site: item.site, |
|
|
|
orderNo: item.orderNo, |
|
|
|
itemNo: item.itemNo, |
|
|
|
scheduleSeqNo: item.seqNo, // 使用 seqNo（派工单号），而不是 sScheduledSeqNo |
|
|
|
resourceId: item.sResourceID, |
|
|
|
serialNumber: newSerialNumber, |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
console.log('需要更新的记录数:', updateList.length); |
|
|
|
console.log('更新列表:', updateList); |
|
|
|
|
|
|
|
// 如果有需要更新的记录，调用后端接口 |
|
|
|
if (updateList.length > 0) { |
|
|
|
this.saveSortOrder(updateList); |
|
|
|
} else { |
|
|
|
console.log('没有需要更新的记录'); |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
/*保存排序到后端*/ |
|
|
|
saveSortOrder(updateList) { |
|
|
|
console.log('调用后端接口，更新序号...'); |
|
|
|
console.log('请求数据:', JSON.stringify(updateList, null, 2)); |
|
|
|
|
|
|
|
batchUpdateSerialNumber(updateList).then(({data}) => { |
|
|
|
console.log('后端响应:', data); |
|
|
|
|
|
|
|
if (data.code === 0) { |
|
|
|
this.$message.success('排序保存成功'); |
|
|
|
console.log('排序保存成功，准备刷新列表'); |
|
|
|
// 成功后刷新列表，并定位到拖拽的行 |
|
|
|
this.refreshAndLocate(); |
|
|
|
} else { |
|
|
|
console.error('排序保存失败:', data.msg); |
|
|
|
this.$message.error(data.msg || '排序保存失败'); |
|
|
|
// 失败时重新加载数据 |
|
|
|
this.getData(); |
|
|
|
this.draggedItem = null; |
|
|
|
} |
|
|
|
}).catch(error => { |
|
|
|
console.error('后端接口调用异常:', error); |
|
|
|
this.$message.error('排序保存失败: ' + error.message); |
|
|
|
// 失败时重新加载数据 |
|
|
|
this.getData(); |
|
|
|
this.draggedItem = null; |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
/*刷新列表并定位到拖拽的行*/ |
|
|
|
refreshAndLocate() { |
|
|
|
console.log('开始刷新列表并定位...'); |
|
|
|
|
|
|
|
// 刷新数据，等待加载完成 |
|
|
|
this.getData().then(() => { |
|
|
|
console.log('数据刷新完成，开始定位'); |
|
|
|
|
|
|
|
// 等待DOM更新后定位 |
|
|
|
this.$nextTick(() => { |
|
|
|
if (this.draggedItem) { |
|
|
|
console.log('查找拖拽项:', this.draggedItem); |
|
|
|
|
|
|
|
// 在刷新后的数据中找到拖拽的项目 |
|
|
|
const targetIndex = this.dataList.findIndex(item => |
|
|
|
item.site === this.draggedItem.site && |
|
|
|
item.orderNo === this.draggedItem.orderNo && |
|
|
|
item.itemNo === this.draggedItem.itemNo && |
|
|
|
item.seqNo === this.draggedItem.seqNo |
|
|
|
); |
|
|
|
|
|
|
|
console.log('找到目标行索引:', targetIndex); |
|
|
|
|
|
|
|
if (targetIndex !== -1) { |
|
|
|
const targetItem = this.dataList[targetIndex]; |
|
|
|
console.log('目标行信息:', targetItem.orderNo, '序号:', targetItem.serialNumber); |
|
|
|
|
|
|
|
// 找到目标行，设置为当前选中行 |
|
|
|
this.scheduleRow = targetItem; |
|
|
|
|
|
|
|
// 高亮显示该行 |
|
|
|
this.$nextTick(() => { |
|
|
|
const table = this.$el.querySelector('.el-table__body-wrapper'); |
|
|
|
if (table) { |
|
|
|
const rows = table.querySelectorAll('.el-table__row'); |
|
|
|
if (rows[targetIndex]) { |
|
|
|
// 滚动到目标行 |
|
|
|
rows[targetIndex].scrollIntoView({ |
|
|
|
behavior: 'smooth', |
|
|
|
block: 'center' |
|
|
|
}); |
|
|
|
|
|
|
|
// 触发行点击事件，高亮显示 |
|
|
|
rows[targetIndex].click(); |
|
|
|
console.log('已定位到目标行'); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
} else { |
|
|
|
console.log('未找到目标行'); |
|
|
|
} |
|
|
|
|
|
|
|
// 清除拖拽记录 |
|
|
|
this.draggedItem = null; |
|
|
|
} |
|
|
|
}); |
|
|
|
}).catch(error => { |
|
|
|
console.error('刷新数据失败:', error); |
|
|
|
this.draggedItem = null; |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
getBaseData(val) { |
|
|
|
if (this.tagNo === 24) { |
|
|
|
this.searchData.workCenterNo = val.WorkCenterNo |
|
|
|
@ -1019,10 +1217,24 @@ export default { |
|
|
|
}, |
|
|
|
|
|
|
|
getData() { |
|
|
|
searchProductionDispatchList(this.searchData).then(({data}) => { |
|
|
|
this.dataList = data.rows |
|
|
|
}); |
|
|
|
this.scheduleRow = null; |
|
|
|
// 添加时间戳防止缓存 |
|
|
|
const searchDataWithTimestamp = { |
|
|
|
...this.searchData, |
|
|
|
_timestamp: new Date().getTime() |
|
|
|
}; |
|
|
|
return searchProductionDispatchList(searchDataWithTimestamp).then(({data}) => { |
|
|
|
this.dataList = data.rows; |
|
|
|
console.log('数据加载完成，共', data.rows.length, '条记录'); |
|
|
|
|
|
|
|
// 打印前10条记录的序号（用于调试） |
|
|
|
console.log('前10条记录的序号:'); |
|
|
|
data.rows.slice(0, 10).forEach((item, idx) => { |
|
|
|
console.log(` ${idx}: ${item.orderNo}-工序${item.itemNo} | SeqNo:${item.seqNo} | serial_number:${item.serialNumber} | S_ScheduledSeqNo:${item.sScheduledSeqNo}`); |
|
|
|
}); |
|
|
|
|
|
|
|
return data.rows; |
|
|
|
}); |
|
|
|
}, |
|
|
|
//导出excel |
|
|
|
createExportData() { |
|
|
|
@ -1266,4 +1478,19 @@ export default { |
|
|
|
.el-textarea__inner { |
|
|
|
padding: 5px 5px; |
|
|
|
} |
|
|
|
|
|
|
|
/* 拖拽排序样式 */ |
|
|
|
.sortable-ghost { |
|
|
|
opacity: 0.4; |
|
|
|
background: #e8f4ff !important; |
|
|
|
} |
|
|
|
|
|
|
|
/* 鼠标悬停时显示可拖拽的提示 */ |
|
|
|
.el-table__body-wrapper tbody tr { |
|
|
|
cursor: move; |
|
|
|
} |
|
|
|
|
|
|
|
.el-table__body-wrapper tbody tr:hover { |
|
|
|
background-color: #f5f7fa; |
|
|
|
} |
|
|
|
</style> |
fengyuan_yang
2 months ago