<style>
.effect .combobox-control{
    width: 100%;
}
</style>

<div style="margin-top: 30px" class="panel panel-default">
    <div class="panel-heading">
        <h3>Tiến độ lập kế hoạch và thực hiện Kế Hoạch Truyền Thông - Cấp Thôn </h3>
    </div>
    <div style="margin-left: 16px; margin-top: 20px" block-bind="toolbar"></div>
    <div class="" style="margin-left: 26px; margin-right: 20px; text-align: left;" block-bind="content">
        <div class="row" style="margin-top: 30px;">
            <div class="form-inline form-group col-md-6">
                <label>Năm đánh giá:</label>
                <input type="text" placeholder="YYYY" class="form-control" data-bind="value:nambaocao">
            </div>
            <div class="col-md-6 form-group form-inline ">
                <label>Kỳ đánh giá:</label>
                <input id="kydanhgia" disabled type="text" class="form-control">
            </div>
        </div>

        <div class="table1">
            <h3 style="margin-bottom:10px;">I. Thông tin chung</h3>
            <div class="row">
                <div class="col-md-12">
                    <table class="table">
                        <tbody>
                            <tr>
                                <td>Tỉnh/Thành phố</td>
                                <td><input type="text" class="form-control" data-bind="dict:tinhthanh" /></td>
                                <td>Quận/Huyện</td>
                                <td><input type="text" class="form-control" data-bind="dict:quanhuyen" /></td>
                            </tr>
                            <tr>
                                <td>Xã/Phường</td>
                                <td><input type="text" class="form-control" data-bind="dict:xaphuong" /></td>
                                <td>Thôn/Xóm</td>
                                <td><input type="text" class="form-control" data-bind="dict:thonxom" /></td>
                            </tr>
                            <tr>
                                <td class="col-md-6">1. Xây dựng dự thảo kế hoạch BCC</td>
                                <td colspan="3" class="col-md-6 effect"><input type="text" class="form-control" data-bind="value:tiendo_xaydung" /></td>
                            </tr>
                            <tr>
                                <td class="col-md-6">2. VIHEMA và WB rà soát, chấp thuận bản kế hoạch BCC</td>
                                <td colspan="3" class="col-md-6 effect"><input type="text" class="form-control" data-bind="value:tiendo_rasoat" /></td>
                            </tr>
                            <tr>
                                <td class="col-md-6">3. Tỉnh phê duyệt kế hoạch BCC</td>
                                <td colspan="3" class="col-md-6 effect">
                                    <input type="text" class="form-control" data-bind="value:tiendo_pheduyet" />
                                    <div class="row hide" id="pheduyet_extra">
                                        <div class="col-lg-7 form-group"><span class="glyphicon glyphicon-arrow-right"></span> Ngày/tháng/năm phê
                                            duyệt:</div>
                                        <div class="col-lg-5 form-group">
                                            <input type="text" data-bind="value:ngay_pheduyet" />
                                        </div>
                                        <div class="col-lg-7 form-group">
                                            <span class="glyphicon glyphicon-arrow-right"></span> Số hoạt động BCC cốt lõi trong kế hoạch phê duyệt
                                        </div>
                                        <div class="col-lg-5 form-group">
                                            <input type="text" data-bind="value:sohoatdong_cotloi_pheduyet" />
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td class="col-md-6">4. Số hoạt động BCC cốt lõi đã hoàn thành đến thời điểm báo cáo</td>
                                <td  class="col-md-6" colspan="3"><input type="text" class="form-control" data-bind="value:sohoatdong_cotloi_hoanthanh" /></td>
                            </tr>
                            <!-- <tr>
                                <td class="col-md-6">Ngành</td>
                                <td class="col-md-6"><input type="text" class="form-control" data-bind="dict:nganh"/></td>
                            </tr> -->
                            <tr>
                                <td class="col-md-6">Tổng số giảng viên cấp thôn</td>
                                <td class="col-md-6" colspan="3"><input type="text" class="form-control" data-bind="value:giangvien" /></td>
                            </tr>
                            <tr>
                                <td class="col-md-6">Tổng số giảng viên cấp thôn là nữ</td>
                                <td class="col-md-6" colspan="3"><input type="text" class="form-control" data-bind="value:giangvien_nu" /></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <div id="addItem">
                    <button class="btn btn-sm btn-success" id="add_dmhoatdong">Thêm mới hoạt động</button>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <table class="table table-align is-table">
                    <thead>
                        <tr>
                            <th colspan="2" class="background-colorTH">Hoạt động</th>
                            <th class="background-colorTH">Mục tiêu</th>
                            <th class="background-colorTH">Tiến độ thực hiện/ <br>Kết quả đạt được
                            </th>
                            <th class="background-colorTH">Ngành</th>
                            <th colspan="3" class="background-colorTH text-center">Số người tham gia</th>
                        </tr>
                    </thead>
                    <tbody id="danhsachhoatdong_list">
                        <tr class="background-colorTH">
                            <td>(1)</td>
                            <td>(2)</td>
                            <td>(3)</td>
                            <td></td>
                            <td colspan="3"></td>
                            <td></td>
                        </tr>
                        <tr class="custom" style="background: #F0F0F0;;">
                            <td colspan="4">
                                <p>Liệt kê các hoạt động được thực hiện theo kế hoạch BCC</p>
                            </td>
                            <td>Tổng số người tham gia</td>
                            <td>Số người tham gia là nữ</td>
                            <td>Số người tham gia là DTTS</td>
                            <td></td>
                        </tr>
                        <tr>
                            <td colspan="4" class="text-left" style="color: red; font-weight: bold;">Hoạt động
                                cấp thôn</td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                    </tbody>

                    <tfoot>
                        <!-- <td style="min-width: 125px;"><input style="margin-bottom: 10px;" type="text" class="form-control" data-bind="value:hoatdong" /></td>
                    <td style="min-width: 111px;"><input type="text" class="form-control" data-bind="value:muctieu" /></td>
                    <td style="min-width: 100px;"><input type="text" class="form-control" data-bind="value:ketqua_datduoc" /></td>
                    <td><input type="text" class="form-control" data-bind="value:tongsonguoi_thamgia" /></td>
                    <td><input type="text" class="form-control" data-bind="value:songuoi_lanu" /></td>
                    <td><input type="text" class="form-control" data-bind="value:songuoi_dantocthieuso" /></td> -->
                    </tfoot>
                </table>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <div class="text-justify">
                    <p style="text-decoration: underline;">Ghi chú:</p>
                    - (1) Hoạt động: ghi tên hoạt động, có thể bổ sung các hoạt động khác mà tỉnh đã triển khai<br>
                    - (2) Cột “Mục tiêu”: điền số lượng các hoạt động<br>
                    - (3) Cột “Kết quả”: điền theo số hoạt động
                </div>
            </div>
        </div>
    </div>
</div>