{!! Form::open(['route' => 'admin::options::save', 'class' => 'form-horizontal']) !!}
<table class="table">
    <colgroup>
        <col>
        <col width="75" class="text-center">
        <col>
        <col width="150" class="text-center">
    </colgroup>
    <thead>
        <tr>
            <th class="text-center">
                {{ trans('Options::moduleList.tables.moduleInfo.name') }}
            </th>
            <th class="text-center">
                {{ trans('Options::moduleList.tables.moduleInfo.version') }}
            </th>
            <th class="text-center">
                {{ trans('Options::moduleList.tables.moduleInfo.description') }}
            </th>
            <th class="text-center">
                {{ trans('Options::moduleList.modal.dependency.header') }}
            </th>
        </tr>
    </thead>
    <tbody>
        @foreach($moduleList as $key => $moduleInfo)
            <tr>
                <td>
                    {!! $moduleInfo['title'] !!}
                </td>
                <td class="text-center">
                    {!! $moduleInfo['version'] !!}
                </td>
                <td>
                    {!! $moduleInfo['description'] !!}
                </td>
                <td class="text-center">
                    @if( !empty( $moduleInfo['dependencies'] ) && $moduleInfo['dependencies']->isNotEmpty() )
                        <!-- Button trigger modal -->
                        <button type="button" class="btn btn-o btn-success" data-toggle="modal" data-target="#module-dependency-{{ $key }}">
                            {{ trans('global.show') }}
                        </button>

                        <!-- Modal -->
                        <div class="modal fade" id="module-dependency-{{ $key }}" tabindex="-1" role="dialog" aria-labelledby="module-dependency-{{ $key }}" aria-hidden="true">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <div class="modal-header text-center">
                                        <h5 class="modal-title">
                                            {{ trans('Options::moduleList.modal.dependency.header') }}
                                        </h5>
                                    </div>
                                    <div class="modal-body">
                                        <table class="table  table-bordered">
                                            <colgroup>
                                                <col width="240">
                                                <col width="75" class="text-center">
                                                <col width="75" class="text-center">
                                            </colgroup>
                                            <thead>
                                                <tr>
                                                    <th rowspan="2" class="text-center">
                                                        {{ trans('Options::moduleList.tables.moduleDependency.name') }}
                                                    </th>
                                                    <th colspan="2" class="text-center">
                                                        {{ trans('Options::moduleList.tables.moduleDependency.version') }}
                                                    </th>
                                                </tr>
                                                <tr>
                                                    <th class="text-center">
                                                        {{ trans('Options::moduleList.tables.moduleDependency.min') }}
                                                    </th>
                                                    <th class="text-center">
                                                        {{ trans('Options::moduleList.tables.moduleDependency.max') }}
                                                    </th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach($moduleInfo['dependencies'] as $name => $dependency)
                                                    <tr>
                                                        <td class="text-left">
                                                            {!! $dependency['title']??$name !!}
                                                        </td>
                                                        <td class="text-center">
                                                            {!! $dependency['min']??'' !!}
                                                        </td>
                                                        <td class="text-center">
                                                            {!! $dependency['max']??'' !!}
                                                        </td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">
                                            {{ trans('global.close') }}
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>

                    @endif
                </td>
            </tr>
        @endforeach
    </tbody>
</table>