@extends('layouts.app')
@section('appjs')
<script type="application/javascript" src="{{ asset('js/app.js') }}"></script>
<meta name="csrf-token" content="{{ csrf_token() }}">

@endsection
@section('content')
@section('page_title')
Domain List
@endsection

<div class="container-fluid">
    <div class="card-header flex justify-content-between">
        <h3>Domain Details </h3>
        <div>
            <a href="{{url('showDomainTemplate')}}" class="btn btn-sm btn-dark">Create Domain</a>
        </div>
    </div>
<div class="card">
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-bordered table-hover" id="domainList">
                <thead>
                    <tr>
                        <th>Sl. NO.</th>
                        <th>Organisation Name</th>
                        <th>Mail Server</th>
                        <th>Email Account</th>
                        <th>From Domain</th>
                        <th>Created By</th>
                        <th>Created On</th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</div>
<script src="{{asset('js/jquery.dataTables.min.js')}}"></script>
<script src="{{ asset('js/bootstrap-toggle.min.js')}}"></script>
<script>
    domainList();
    //    fetch all data in data-table
    function domainList() {
        $("#domainList").DataTable().clear().destroy();
        $("#domainList").DataTable({
            "processing": true,
            "serverSide": true,
            "paging": true,
            "searching": true,
            "autowidth":true,
            "ordering": true,
            "scrollX": true,
            "order": [
                [1, "desc"]
            ],
            "language": {
                search: '',
                searchPlaceholder: "Search...",
            },
            "ajax": {
                "url": "{{ url('/emailDomainList') }}",
                "dataType": " json",
                "type": "POST",
                "data": {
                    _token: "{{csrf_token()}}",
                },
            },
            aoColumns: [{
                    data: "",
                    orderable: false,
                    render: function(data, type, row, meta) {
                        return meta.row + meta.settings._iDisplayStart + 1;
                    }
                },
                {
                    data:"organisation_name",
                    render: function(data, type, row, meta){
                        return ((row.organisation_name) ? row.organisation_name : "NA")
                    }
                },
                {
                    data:"server_name",
                    render: function(data, type, row, meta){
                        return ((row.server_name) ? row.server_name : "NA")
                    }
                },
                {
                    data:"email_ID",
                    render: function(data, type, row, meta){
                        return ((row.email_ID) ? row.email_ID : "NA")
                    }
                },
                {
                    data: "domain_name",
                    render: function(data, type, row, meta) {
                        return ((row.domain_name) ? row.domain_name : "NA")
                    }
                },
                {
                    data: "created_by",
                    render: function(data, type, row, meta) {
                        return ((row.created_by) ? row.created_by : "NA")
                    }
                },
                {
                    data: "created_on",
                    render: function(data, type, row, meta) {
                        return ((row.created_on) ? row.created_on : "NA")
                    }
                },
            ],
            "fnDrawCallback": function() {
                jQuery('.toggle-event').bootstrapToggle();
            }
        });
    }
</script>
@endsection