{% extends "base.html" %}

{% block title %}部门人力配置 - 工厂工时效率管理系统{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2><i class="bi bi-people"></i> 部门人力配置</h2>
    <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addModal">
        <i class="bi bi-plus-lg"></i> 新增配置
    </button>
</div>

<div class="card">
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th>部门</th>
                        <th>线别</th>
                        <th>应出勤直接人力</th>
                        <th>应出勤间接人力</th>
                        <th>正常工时</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for dept in depts %}
                    <tr>
                        <td>{{ dept.department }}</td>
                        <td>{{ dept.line }}</td>
                        <td>{{ dept.expected_direct_manpower }}</td>
                        <td>{{ dept.expected_indirect_manpower }}</td>
                        <td>{{ dept.normal_working_hours }}</td>
                        <td>
                            <button class="btn btn-sm btn-outline-primary edit-btn"
                                    data-id="{{ dept.id }}"
                                    data-department="{{ dept.department }}"
                                    data-line="{{ dept.line }}"
                                    data-direct="{{ dept.expected_direct_manpower }}"
                                    data-indirect="{{ dept.expected_indirect_manpower }}"
                                    data-hours="{{ dept.normal_working_hours }}">
                                <i class="bi bi-pencil"></i>
                            </button>
                            <button class="btn btn-sm btn-outline-danger delete-btn"
                                    data-id="{{ dept.id }}"
                                    data-name="{{ dept.department }} - {{ dept.line }}">
                                <i class="bi bi-trash"></i>
                            </button>
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- Add Modal -->
<div class="modal fade" id="addModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">新增部门人力配置</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <form id="addForm">
                    <div class="mb-3">
                        <label for="addDepartment" class="form-label">部门</label>
                        <input type="text" class="form-control" id="addDepartment" required>
                    </div>
                    <div class="mb-3">
                        <label for="addLine" class="form-label">线别</label>
                        <input type="text" class="form-control" id="addLine" required>
                    </div>
                    <div class="mb-3">
                        <label for="addDirect" class="form-label">应出勤直接人力</label>
                        <input type="number" class="form-control" id="addDirect" min="1" required>
                    </div>
                    <div class="mb-3">
                        <label for="addIndirect" class="form-label">应出勤间接人力</label>
                        <input type="number" class="form-control" id="addIndirect" min="0" value="0" required>
                    </div>
                    <div class="mb-3">
                        <label for="addHours" class="form-label">正常工时</label>
                        <input type="number" class="form-control" id="addHours" step="0.5" value="8" required>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="addSubmit">保存</button>
            </div>
        </div>
    </div>
</div>

<!-- Edit Modal -->
<div class="modal fade" id="editModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">编辑部门人力配置</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <form id="editForm">
                    <input type="hidden" id="editId">
                    <div class="mb-3">
                        <label for="editDepartment" class="form-label">部门</label>
                        <input type="text" class="form-control" id="editDepartment" required>
                    </div>
                    <div class="mb-3">
                        <label for="editLine" class="form-label">线别</label>
                        <input type="text" class="form-control" id="editLine" required>
                    </div>
                    <div class="mb-3">
                        <label for="editDirect" class="form-label">应出勤直接人力</label>
                        <input type="number" class="form-control" id="editDirect" min="1" required>
                    </div>
                    <div class="mb-3">
                        <label for="editIndirect" class="form-label">应出勤间接人力</label>
                        <input type="number" class="form-control" id="editIndirect" min="0" required>
                    </div>
                    <div class="mb-3">
                        <label for="editHours" class="form-label">正常工时</label>
                        <input type="number" class="form-control" id="editHours" step="0.5" required>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="editSubmit">保存</button>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script src="{{ url_for('static', filename='js/config-department.js') }}"></script>
{% endblock %}