93 lines
4.0 KiB
PHP
93 lines
4.0 KiB
PHP
|
<?php
|
||
|
|
$CURRENT_SECTION = 'process';
|
||
|
|
include '../inc/header.php';
|
||
|
|
?>
|
||
|
|
<div class="container" style="max-width:1280px; margin-top:24px;">
|
||
|
|
<div class="d-flex align-items-center justify-content-between mb-3">
|
||
|
|
<h2 class="m-0">공정 생성 / 수정</h2>
|
||
|
|
<div class="d-flex gap-2">
|
||
|
|
<a href="/tenant/process/processes.php" class="btn btn-outline-secondary">취소</a>
|
||
|
|
<button class="btn btn-primary">저장</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<form>
|
||
|
|
<div class="row g-3">
|
||
|
|
<div class="col-md-6">
|
||
|
|
<label class="form-label">공정명 <span class="text-danger">*</span></label>
|
||
|
|
<input type="text" class="form-control" placeholder="예) 절곡">
|
||
|
|
</div>
|
||
|
|
<div class="col-md-6">
|
||
|
|
<label class="form-label">설명</label>
|
||
|
|
<input type="text" class="form-control" placeholder="선택 입력">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<hr class="my-4">
|
||
|
|
|
||
|
|
<h4 class="mb-1">작업 리스트</h4>
|
||
|
|
<p class="text-muted small mb-3">작업별로 시작/완료 피드백 필요 여부를 설정할 수 있습니다.</p>
|
||
|
|
|
||
|
|
<div id="task-list"></div>
|
||
|
|
|
||
|
|
<div class="text-end mt-2">
|
||
|
|
<button id="btn-add-task" type="button" class="btn btn-outline-secondary">+ 작업 추가</button>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<template id="task-row-tpl">
|
||
|
|
<div class="card task-row mb-2">
|
||
|
|
<div class="card-body">
|
||
|
|
<div class="row g-2 align-items-center">
|
||
|
|
<div class="col-md-4">
|
||
|
|
<label class="form-label mb-1">작업명 <span class="text-danger">*</span></label>
|
||
|
|
<input type="text" class="form-control task-name" placeholder="예) 절단작업">
|
||
|
|
</div>
|
||
|
|
<div class="col-md-3">
|
||
|
|
<div class="form-check mt-4">
|
||
|
|
<input class="form-check-input task-need-start" type="checkbox" id="">
|
||
|
|
<label class="form-check-label">작업 시작 피드백 필요</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-3">
|
||
|
|
<div class="form-check mt-4">
|
||
|
|
<input class="form-check-input task-need-end" type="checkbox" id="">
|
||
|
|
<label class="form-check-label">작업 완료 피드백 필요</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-md-2 text-end">
|
||
|
|
<button type="button" class="btn btn-sm btn-danger btn-remove-task mt-4">삭제</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
(function(){
|
||
|
|
const list = document.getElementById('task-list');
|
||
|
|
const tpl = document.getElementById('task-row-tpl').content;
|
||
|
|
|
||
|
|
function addRow(prefill){
|
||
|
|
const node = document.importNode(tpl, true);
|
||
|
|
if (prefill){
|
||
|
|
if (prefill.name) node.querySelector('.task-name').value = prefill.name;
|
||
|
|
if (prefill.needStart) node.querySelector('.task-need-start').checked = true;
|
||
|
|
if (prefill.needEnd) node.querySelector('.task-need-end').checked = true;
|
||
|
|
}
|
||
|
|
node.querySelector('.btn-remove-task').addEventListener('click', e=>{
|
||
|
|
e.target.closest('.task-row').remove();
|
||
|
|
});
|
||
|
|
list.appendChild(node);
|
||
|
|
}
|
||
|
|
|
||
|
|
// seed
|
||
|
|
addRow({name:'절단작업', needStart:true, needEnd:true});
|
||
|
|
addRow({name:'미싱작업', needStart:false, needEnd:true});
|
||
|
|
|
||
|
|
document.getElementById('btn-add-task').addEventListener('click', ()=> addRow());
|
||
|
|
})();
|
||
|
|
</script>
|
||
|
|
<?php include '../inc/footer.php'; ?>
|