@{
    ViewData["MainNum"] = "6";
    ViewData["SubNum"] = "2";
    ViewData["Title"] = "運維作業記錄";
}

<ol class="breadcrumb page-breadcrumb">
    <li class="breadcrumb-item"><a href="javascript:void(0);">運維管理</a></li>
    <li class="breadcrumb-item active">運維作業記錄</li>
    <li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
</ol>
<div class="subheader">
    <h1 class="subheader-title">
        <i class="subheader-icon fal fa-globe"></i> 運維作業記錄
    </h1>
</div>

<!-- Your main content goes below here: -->
<div id="panel-5" class="panel">
    <div class="panel-container show">
        <div class="panel-content">
            <div class="row mb-5 d-flex justify-content-start">
                <div class="pr-3">
                    <div class="btn-group btn-group-md">
                        <button type="button" class="btn btn-success waves-effect waves-themed">全部</button>
                        <button type="button" class="btn btn-secondary waves-effect waves-themed">維修</button>
                        <button type="button" class="btn btn-secondary waves-effect waves-themed">巡檢</button>
                        <button type="button" class="btn btn-secondary waves-effect waves-themed">清洗</button>
                    </div>
                </div>
                <div class="pr-3">
                    <button type="button" class="btn btn-secondary waves-effect waves-themed">近30天</button>
                </div>
                <div class="pr-3">
                    <div class="form-group">
                        <input class="form-control" id="example-date" type="date" name="date" value="2023-07-23">
                    </div>
                </div>
            </div>


            <div class="row d-flex justify-content-end px-3">
                <button type="button" class="btn btn-info waves-effect waves-themed mb-3 mr-2">
                    <span class="fal fa-file-excel mr-1"></span>
                    匯出
                </button>
                <a href="javascript:;" class="btn btn-success waves-effect waves-themed mb-3 mr-2" data-toggle="modal" data-target="#companyrule">
                    <span class="fal fa-plus mr-1"></span>
                    維修單
                </a>
            </div>
            <div class="frame-wrap">
                <table id="operation_recode_table" class="table table-bordered table-hover m-0 text-center">
                    <thead class="thead-themed">
                        <tr>
                            <th>電廠</th>
                            <th>表單號</th>
                            <th>項目</th>
                            <th>類型</th>
                            <th>狀態</th>
                            <th>處理人員</th>
                            <th>本次作業預計</th>
                            <th>照片</th>
                            <th>完成時間</th>
                            @*<th>功能</th>*@
                        </tr>
                    </thead>
                    <tbody>
                        @*<tr>
                            <th scope="row">新竹巨城站</th>
                            <td>op20210630001</td>
                            <td>維修</td>
                            <td>逆變器異常</td>
                            <td>
                                <div class="custom-control custom-checkbox">
                                    <input type="checkbox" class="custom-control-input" id="defaultChecked" checked="">
                                    <label class="custom-control-label" for="defaultChecked">完成</label>
                                </div>
                            </td>
                            <td>王小明</td>
                            <td></td>
                            <td><img src="img/thumbs/pic-3.png" class="pr-2"><img src="img/thumbs/pic-3.png" class="pr-2"></td>
                            <td>2021-03-5</td>
                            <td>
                                <a href="javascript:;" type="button" class="btn btn-primary btn-pills waves-effect waves-themed" data-toggle="modal" data-target="#addpeople">修改</a>
                                <button type="button" class="btn btn-danger btn-pills waves-effect waves-themed">刪除</button>
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">新竹巨城站</th>
                            <td>
                                <a href="javascript:;" class="btn btn-success waves-effect waves-themed mb-3 mr-2" data-toggle="modal" data-target="#companyrule">
                                    填寫表單
                                </a>
                            </td>
                            <td>維修</td>
                            <td>逆變器異常</td>
                            <td>
                                <div class="custom-control custom-checkbox">
                                    <input type="checkbox" class="custom-control-input" id="defaultChecked" checked="">
                                    <label class="custom-control-label" for="defaultChecked">完成</label>
                                </div>
                            </td>
                            <td>王小明</td>
                            <td></td>
                            <td><img src="img/thumbs/pic-3.png" class="pr-2"><img src="img/thumbs/pic-3.png" class="pr-2"></td>
                            <td>2021-03-5</td>
                            <td>
                                <a href="javascript:;" type="button" class="btn btn-primary btn-pills waves-effect waves-themed" data-toggle="modal" data-target="#addpeople">修改</a>
                                <button type="button" class="btn btn-danger btn-pills waves-effect waves-themed">刪除</button>
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">新竹巨城站</th>
                            <td>
                                <a href="javascript:;" class="btn btn-success waves-effect waves-themed mb-3 mr-2" data-toggle="modal" data-target="#companyrule">
                                    填寫表單
                                </a>
                            </td>
                            <td>維修</td>
                            <td>逆變器異常</td>
                            <td>
                                <div class="custom-control custom-checkbox">
                                    <input type="checkbox" class="custom-control-input" id="defaultChecked" checked="">
                                    <label class="custom-control-label" for="defaultChecked">完成</label>
                                </div>
                            </td>
                            <td>王小明</td>
                            <td></td>
                            <td><img src="img/thumbs/pic-3.png" class="pr-2"><img src="img/thumbs/pic-3.png" class="pr-2"></td>
                            <td>2021-03-5</td>
                            <td>
                                <a href="javascript:;" type="button" class="btn btn-primary btn-pills waves-effect waves-themed" data-toggle="modal" data-target="#addpeople">修改</a>
                                <button type="button" class="btn btn-danger btn-pills waves-effect waves-themed">刪除</button>
                            </td>
                        </tr>*@

                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

@section Scripts{
    <script>
        var operationRecodeTable;
        var selected_id = 0;

        $(function () {
            //#region 運維作業記錄 DataTable
            operationRecodeTable = $("#operation_recode_table").DataTable({
                "pageLength": 20,
                "paging": true,
                "lengthChange": false,
                "searching": false,
                "ordering": false,
                "info": true,
                "autoWidth": false,
                "responsive": true,
                @*"order": [[5, "desc"]],*@
                "columns": [{
                    "data": "powerStationName"
                }, {
                    "data": "formId"
                }, {
                    "data": "WorkTypeText"
                }, {
                    "data": "fixDo"
                }, {
                    "data": "workPersonName"
                }, {
                    "data": "operationPredict"
                }, {
                    "data": "fileList"
                }, {
                    "data": "finishTime"
                }],
                "language": {
                    "emptyTable": "無資料...",
                    "processing": "處理中...",
                    "loadingRecords": "載入中...",
                    "lengthMenu": "顯示 _MENU_ 項結果",
                    "zeroRecords": "沒有符合的結果",
                    "info": "顯示第 _START_ 至 _END_ 項結果，共 _TOTAL_ 項",
                    "infoEmpty": "顯示第 0 至 0 項結果，共 0 項",
                    "infoFiltered": "(從 _MAX_ 項結果中過濾)",
                    "infoPostFix": "",
                    "search": "搜尋:",
                    "paginate": {
                        "first": "第一頁",
                        "previous": "上一頁",
                        "next": "下一頁",
                        "last": "最後一頁"
                    },
                    "aria": {
                        "sortAscending": ": 升冪排列",
                        "sortDescending": ": 降冪排列"
                    }
                },
                'createdRow': function (row, data, dataIndex) {
                    $(row).attr('data-id', data.id);
                },
                "ajax": {
                    "url": "/Operation/OperationRecodeList",
                    "type": "POST",
                    "data": function (d) {
                        d.CityIds = [1];
                        d.PowerStationIds = [15, 16];
                        d.WorkType = $('#company_phone').val();
                        d.Range = $('#company_taxIDNumber').val();
                    },
                    "dataSrc": function (rel) {
                        if (rel.data.code == "9999") {
                            toast_error(rel.data.msg);
                            return;
                        }

                        data = rel.data.data;

                        if (data == null || data.length == 0) {
                            this.data = [];
                        }

                        return data;
                    }
                }
            });
            //#endregion

            //#region 公司權限池列表 DataTable
            companyAuthTable = $("#company_auth_table").DataTable({
                "paging": true,
                "lengthChange": false,
                "searching": false,
                "ordering": true,
                "info": true,
                "autoWidth": false,
                "responsive": true,
                "order": [[1, "desc"]],
                "columns": [{
                    "data": "authCode"
                }, {
                    "data": "mainName"
                }, {
                    "data": "subName"
                }],
                "columnDefs": [{
                    'targets': 0,
                    'searchable': false,
                    'orderable': false,
                    'className': 'dt-body-center',
                    'render': function (data, type, full, meta) {
                        var check_html = "";
                        check_html += '<div class="custom-control custom-checkbox">';
                        if (full.checkAuth > 0) {
                            check_html += '<input type="checkbox" class="custom-control-input" name="selectedAuthPage[]" id="auth-page-' + data + '" value="' + data + '" checked /> ';
                        } else {
                            check_html += '<input type="checkbox" class="custom-control-input" name="selectedAuthPage[]" id="auth-page-' + data + '" value="' + data + '" /> ';
                        }
                        check_html += '<label class="custom-control-label" for="auth-page-' + data + '" />';
                        check_html += '</div>';
                        return check_html;
                    }
                }],
                "language": {
                    "emptyTable": "無資料...",
                    "processing": "處理中...",
                    "loadingRecords": "載入中...",
                    "lengthMenu": "顯示 _MENU_ 項結果",
                    "zeroRecords": "沒有符合的結果",
                    "info": "顯示第 _START_ 至 _END_ 項結果，共 _TOTAL_ 項",
                    "infoEmpty": "顯示第 0 至 0 項結果，共 0 項",
                    "infoFiltered": "(從 _MAX_ 項結果中過濾)",
                    "infoPostFix": "",
                    "search": "搜尋:",
                    "paginate": {
                        "first": "第一頁",
                        "previous": "上一頁",
                        "next": "下一頁",
                        "last": "最後一頁"
                    },
                    "aria": {
                        "sortAscending": ": 升冪排列",
                        "sortDescending": ": 降冪排列"
                    }
                },
                'createdRow': function (row, data, dataIndex) {
                    $(row).attr('data-authCode', data.authCode);
                },
                "ajax": {
                    "url": "/Company/GetCompanyAuthByCompanyId",
                    "type": "POST",
                    "data": function (d) {
                        d.Id = selected_id;
                    },
                    "dataSrc": function (rel) {
                        if (rel.data.code == "9999") {
                            toast_error(rel.data.msg);
                            return;
                        }

                        data = rel.data.data;

                        if (data == null || data.length == 0) {
                            this.data = [];
                        }

                        return data;
                    }
                }
            });
            //#endregion

            //#region 公司權限池全選
            $("#select-all-company-auth").change(function () {

                var rows = companyAuthTable.rows({ 'search': 'applied' }).nodes();

                if (this.checked) {
                    $('input[type="checkbox"]', rows).prop('checked', this.checked);
                } else {
                    $('input[type="checkbox"]', rows).prop('checked', this.checked);
                }
            });
            //#endregion
        });

        //#region 搜尋公司列表
        function SearchCompany() {
            companyTable.ajax.reload();
        }
        //#endregion

        //#region 新增公司基本資料
        function AddCompany() {

            selected_id = 0;
            $("#company-modal .modal-title").html("公司基本資料 - 新增");
            $("#company-form").trigger("reset");

            $("#company-modal").modal();
        }
        //#endregion

        //#region 編輯公司資料
        $('#company_table').on("click", "button.edit-btn", function () {

            $("#company-modal .modal-title").html("公司基本資料 - 編輯");

            selected_id = $(this).parents('tr').attr('data-id');

            //取得單一公司基本資料
            var url = "/Company/GetOneCompany/";

            var send_data = {
                id: selected_id
            }

            $.post(url, send_data, function (rel) {
                if (rel.code != "0000") {
                    toast_error(rel.msg);
                    return;
                }

                $("#company_name_modal").val(rel.data.name);
                $("#company_taxIDNumber_modal").val(rel.data.taxIDNumber);
                $("#company_phone_modal").val(rel.data.phone);
                $("#company_address_modal").val(rel.data.address);
                $("#company_registerUpperLimit_modal").val(rel.data.registerUpperLimit);

                $("#company-modal").modal();
            }, 'json');

        });
        //#endregion

        //#region 公司資料表單驗證
        $("#company-form").validate({
            rules: {
                company_name_modal: {
                    required: true,
                },
                company_taxIDNumber_modal: {
                    required: true,
                    maxlength: 8,
                },
            },
        });
        //#endregion

        //#region 儲存公司資料
        function SaveComapny() {

            if ($("#company-form").valid()) {
                var url = "/Company/SaveCompany";

                var formData = new FormData();
                var logos = $('#company_logo_modal')[0].files;

                formData.append("Id", selected_id);
                formData.append("Name", $("#company_name_modal").val());
                formData.append("TaxIDNumber", $("#company_taxIDNumber_modal").val());
                formData.append("Phone", $("#company_phone_modal").val());
                formData.append("Address", $("#company_address_modal").val());
                formData.append("RegisterUpperLimit", $("#company_registerUpperLimit_modal").val());
                if (logos.length > 0) {
                    formData.append("LogoFile", logos[0])
                }

                $.ajax({
                    type: "POST",
                    url: url,
                    data: formData,
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function (rel) {
                        if (rel.code != "0000") {
                            toast_error(rel.msg);
                            return;
                        }

                        toast_ok(rel.msg);
                        $('#company-modal').modal('hide');

                        companyTable.ajax.reload();
                    }
                });
            }
        }
        //#endregion

        //#region 刪除公司
        $('#company_table').on("click", "button.del-btn", function () {

            selected_id = $(this).parents('tr').attr('data-id');
            Swal.fire(
                {
                    title: "刪除",
                    text: "你確定是否刪除此筆資料?",
                    type: "warning",
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonText: "是",
                    cancelButtonText: "否"
                }).then(function (result) {
                    if (result.value) {
                        //取得單一系統管理員
                        var url = "/Company/DeleteOneCompany/";
                        var send_data = {
                            Id: selected_id
                        }
                        $.post(url, send_data, function (rel) {
                            if (rel.code == "9999") {
                                toast_error(rel.msg);
                                return;
                            }
                            else if (rel.code == "9998") {
                                toast_error(rel.msg);
                                return;
                            }

                            toast_ok(rel.msg);
                            companyTable.ajax.reload();
                        }, 'json');
                    }
                });
        });
        //#endregion

        //#region 編輯公司權限池
        $('#company_table').on("click", "button.company-auth-btn", function () {

            selected_id = $(this).parents('tr').attr('data-id');

            $("#select-all-company-auth").prop("checked", false);

            companyAuthTable.ajax.reload();

            $("#company-auth-modal").modal();
        });
        //#endregion

        //#region 儲存公司權限池
        function SaveComapnyAuth() {

            var rows = companyAuthTable.rows({ 'search': 'applied' }).nodes();
            //取得被選擇的權限
            var checkAuths = $("input[name='selectedAuthPage[]']:checked", rows).map(function () {
                return $(this).val();
            }).get();

            var url = "/Company/SaveCompanyAuth";

            var send_data = {
                SelectedCompanyId: selected_id,
                CheckAuths: checkAuths
            }

            $.post(url, send_data, function (rel) {
                if (rel.code != "0000") {
                    toast_error(rel.msg);
                    return;
                }

                toast_ok(rel.msg);
                $("#company-auth-modal").modal('hide');

                companyAuthTable.ajax.reload();
            }, 'json');
        }
        //#endregion
    </script>
}