[RAPID-fix] 컬럼 리사이즈 colgroup 연동, Select2 드래그 복사 방식 개선

- 컬럼 리사이즈: col 요소와 th를 동시에 수정하여 table-layout:fixed에서 동작
- Select2 드래그 복사: mousedown 시 열림 방지, 클릭(mouseup)으로만 열리게 변경
- 드래그 시 텍스트 선택만 되고 드롭다운 안 열림

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-26 14:43:37 +09:00
parent b1acc193ee
commit fccc5945bd
2 changed files with 62 additions and 46 deletions

View File

@@ -105,22 +105,27 @@
}
});
var startX, startWidth, $th;
var startX, startWidth, $th, colIndex, $col;
$(document).on('mousedown', '#itemListTable .col-resizer', function(e) {
$th = $(this).parent();
colIndex = $th.index();
$col = $table.find('colgroup col').eq(colIndex);
startX = e.pageX;
startWidth = $th.outerWidth();
$('body').css('cursor', 'col-resize');
$(document).on('mousemove.colResize', function(e) {
var newWidth = startWidth + (e.pageX - startX);
if(newWidth >= 40) {
$th.css('width', newWidth + 'px');
$th.css('min-width', newWidth + 'px');
$col.css('width', newWidth + 'px');
$th.css({'width': newWidth + 'px', 'min-width': newWidth + 'px'});
}
});
$(document).on('mouseup.colResize', function() {
$('body').css('cursor', '');
$(document).off('mousemove.colResize mouseup.colResize');
});
@@ -131,34 +136,37 @@
// ===== Select2 드래그 복사 지원 =====
function fn_initSelect2DragCopy() {
var isDragging = false;
var startX = 0, startY = 0;
// Select2의 기본 mousedown 열림을 차단하고, click(mouseup)으로만 열리게 변경
$(document).on('mousedown', '#itemListTable .select2-container', function(e) {
// select2-selection__clear(x버튼)은 그대로 동작
if($(e.target).hasClass('select2-selection__clear')) return;
// 품목 그리드 내 Select2에만 적용
$(document).on('mousedown', '#itemListTable .select2-selection', function(e) {
isDragging = false;
startX = e.pageX;
startY = e.pageY;
var $container = $(this);
var $select = $container.prev('select');
var startX = e.pageX, startY = e.pageY;
var wasDragged = false;
$(document).on('mousemove.s2drag', function(e) {
var dx = Math.abs(e.pageX - startX);
var dy = Math.abs(e.pageY - startY);
if(dx > 5 || dy > 5) {
isDragging = true;
// Select2 열림 방지 (mousedown 시점)
$select.on('select2:opening.dragcopy', function(ev) {
ev.preventDefault();
});
$(document).on('mousemove.s2drag', function(ev) {
if(Math.abs(ev.pageX - startX) > 3 || Math.abs(ev.pageY - startY) > 3) {
wasDragged = true;
}
});
$(document).on('mouseup.s2drag', function() {
setTimeout(function() { isDragging = false; }, 100);
$(document).off('mousemove.s2drag mouseup.s2drag');
});
});
// 방지 해제
$select.off('select2:opening.dragcopy');
// 드래그이면 Select2 열림 방지
$(document).on('select2:opening', '#itemListTable select', function(e) {
if(isDragging) {
e.preventDefault();
}
// 드래그가 아니면 (클릭이면) Select2 열
if(!wasDragged) {
setTimeout(function() { $select.select2('open'); }, 10);
}
});
});
}

View File

@@ -106,22 +106,27 @@
}
});
var startX, startWidth, $th;
var startX, startWidth, $th, colIndex, $col;
$(document).on('mousedown', '#itemListTable .col-resizer', function(e) {
$th = $(this).parent();
colIndex = $th.index();
$col = $table.find('colgroup col').eq(colIndex);
startX = e.pageX;
startWidth = $th.outerWidth();
$('body').css('cursor', 'col-resize');
$(document).on('mousemove.colResize', function(e) {
var newWidth = startWidth + (e.pageX - startX);
if(newWidth >= 40) {
$th.css('width', newWidth + 'px');
$th.css('min-width', newWidth + 'px');
$col.css('width', newWidth + 'px');
$th.css({'width': newWidth + 'px', 'min-width': newWidth + 'px'});
}
});
$(document).on('mouseup.colResize', function() {
$('body').css('cursor', '');
$(document).off('mousemove.colResize mouseup.colResize');
});
@@ -132,34 +137,37 @@
// ===== Select2 드래그 복사 지원 =====
function fn_initSelect2DragCopy() {
var isDragging = false;
var startX = 0, startY = 0;
// Select2의 기본 mousedown 열림을 차단하고, click(mouseup)으로만 열리게 변경
$(document).on('mousedown', '#itemListTable .select2-container', function(e) {
// select2-selection__clear(x버튼)은 그대로 동작
if($(e.target).hasClass('select2-selection__clear')) return;
// 품목 그리드 내 Select2에만 적용
$(document).on('mousedown', '#itemListTable .select2-selection', function(e) {
isDragging = false;
startX = e.pageX;
startY = e.pageY;
var $container = $(this);
var $select = $container.prev('select');
var startX = e.pageX, startY = e.pageY;
var wasDragged = false;
$(document).on('mousemove.s2drag', function(e) {
var dx = Math.abs(e.pageX - startX);
var dy = Math.abs(e.pageY - startY);
if(dx > 5 || dy > 5) {
isDragging = true;
// Select2 열림 방지 (mousedown 시점)
$select.on('select2:opening.dragcopy', function(ev) {
ev.preventDefault();
});
$(document).on('mousemove.s2drag', function(ev) {
if(Math.abs(ev.pageX - startX) > 3 || Math.abs(ev.pageY - startY) > 3) {
wasDragged = true;
}
});
$(document).on('mouseup.s2drag', function() {
setTimeout(function() { isDragging = false; }, 100);
$(document).off('mousemove.s2drag mouseup.s2drag');
});
});
// 방지 해제
$select.off('select2:opening.dragcopy');
// 드래그이면 Select2 열림 방지
$(document).on('select2:opening', '#itemListTable select', function(e) {
if(isDragging) {
e.preventDefault();
}
// 드래그가 아니면 (클릭이면) Select2 열
if(!wasDragged) {
setTimeout(function() { $select.select2('open'); }, 10);
}
});
});
}