@extends('layouts.landing')

@section('title', 'Email Settings')

@section('content')
<div class="row">
    <div class="col-12 col-xxl-4 col-xl-4 col-lg-4">
        @include('elements.settings-menu')
    </div>
    <div class="col-12 col-xxl-8 col-xl-8 col-lg-8">
        <div class="card w-100 border-0 p-0 bg-white shadow-xss rounded-xxl">
            <div class="card-body p-4">
                <h5>Email Settings</h5>
                <div class="row">
                    <div class="col-12">
                        <form class="pb-4" action="{{route('account.page-email-save', $user->id)}}" method="POST">
                            @csrf
                            <input type="hidden" name="parent_id" value="{{$user->creatorId()}}">
                            <div class="">
                                <p class="font-xss text-gray-500">Set up your email service credentials for sending and receiving emails. Currently support <a href="https://newsletter.tribearc.com/" target="_blank" class="text-color"> Tribearc Mail </a>, <a href="https://www.mailgun.com/" target="_blank" class="text-color">Mailgun</a>, and <a href="https://sendgrid.com/" target="_blank" class="text-color">Sendgrid</a></p>
                                <div class="mt-2 pt-2 mb-3">
                                    <div class="row">
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    Mailing Service
                                                </label>
                                                <select name="mailer_type" class="form-select w-100">
                                                    <option value="tribearc">Tribearc Mail</option>
                                                    <option value="mailgun">Mailgun</option>
                                                    <option value="sendgrid">Sendgrid</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    Mailer Type
                                                </label>
                                                <select name="mailer_type" class="form-select w-100" id="mailerType" onchange="mailType('api', 'smtp', this)">
                                                    <option value="api">API</option>
                                                    <option value="smtp">SMTP</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row" id="api">
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    Api key
                                                </label>
                                                <input type="text" name="api_key" class="form-control" value="{{@$email_setting->api_key}}">
                                            </div>
                                        </div>
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    List ID
                                                </label>
                                                <input type="text" name="list_id" class="form-control" value="{{@$email_setting->list_id}}">
                                            </div>
                                        </div>
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    Api URL
                                                </label>
                                                <input type="text" name="url" class="form-control" value="{{@$email_setting->url}}" placeholder="https://api_url.com/send">
                                            </div>
                                        </div>
                                    </div>
                                    <div id="smtp" style="display: none">
                                        <div class="row">
                                            <div class="col-12 col-lg-6 col-xl-6">
                                                <div class="form-group">
                                                    <label class="form-label mb-1">
                                                        Mailer Host
                                                    </label>
                                                    <input type="text" name="mailer_host" class="form-control" value="{{@$email_setting->mailer_host}}" placeholder="smtp.mailservice.com">
                                                </div>
                                            </div>
                                            <div class="col-12 col-lg-6 col-xl-6">
                                                <div class="form-group">
                                                    <label class="form-label mb-1">
                                                        Mailer Port
                                                    </label>
                                                    <input type="number" name="mailer_port" class="form-control" value="{{@$email_setting->mailer_port}}" placeholder="587">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-12 col-lg-6 col-xl-6">
                                                <div class="form-group">
                                                    <label class="form-label mb-1">
                                                        Mailer Username
                                                    </label>
                                                    <input type="text" name="mailer_username" class="form-control" value="{{@$email_setting->mailer_username}}">
                                                </div>
                                            </div>
                                            <div class="col-12 col-lg-6 col-xl-6">
                                                <div class="form-group">
                                                    <label class="form-label mb-1">
                                                        Mailer Password
                                                    </label>
                                                    <input type="password" name="mailer_password" class="form-control" value="{{@$email_setting->mailer_password}}">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-12 col-lg-6 col-xl-6">
                                                <div class="form-group">
                                                    <label class="form-label mb-1">
                                                        Mailer Domain
                                                    </label>
                                                    <input type="text" name="mailer_domain" class="form-control" value="{{@$email_setting->mailer_domain}}" placeholder="mailservice.com">
                                                </div>
                                            </div>
                                            <div class="col-12 col-lg-6 col-xl-6">
                                                <div class="form-group">
                                                    <label class="form-label mb-1">
                                                        Mailer Encryption
                                                    </label>
                                                    <input type="text" name="mailer_cncryption" class="form-control" value="{{@$email_setting->mailer_cncryption}}" placeholder="tls">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    From Name
                                                </label>
                                                <input type="text" name="from_name" class="form-control" value="{{@$email_setting->from_name}}" placeholder="Community Name">
                                            </div>
                                        </div>
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    From Email
                                                </label>
                                                <input type="text" name="from_email" class="form-control" value="{{@$email_setting->from_email}}" placeholder="from_community@example.com">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    Reply To
                                                </label>
                                                <input type="text" name="reply_to" class="form-control" value="{{@$email_setting->reply_to}}" placeholder="reply_to_community@example.com">
                                            </div>
                                        </div>
                                        <div class="col-12 col-lg-6 col-xl-6">
                                            <div class="form-group">
                                                <label class="form-label mb-1">
                                                    Business Name
                                                </label>
                                                <input type="text" name="business_name" class="form-control" value="{{@$email_setting->business_name}}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="form-label mb-1">
                                            Business Address
                                        </label>
                                        <textarea name="business_address" class="form-control">{{@$email_setting->business_address}}</textarea>
                                    </div>
                                    <div class="form-group">
                                        <label class="form-label mb-1">
                                            Community Email List
                                        </label>
                                        <textarea name="email_list" placeholder="amdin email lists, coma separated" class="form-control">{{@$email_setting->email_list}}</textarea>
                                    </div>
                                    <div class="form-group mt-4 text-end">
                                        <button type="submit" name="submit" onclick="this.classList.toggle('button--loading')" class="button_load btn custom-btn">
                                            <span class="button__text"><i class="mdi mdi-check"></i> Save changes</span>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    function mailType(api, smtp, element) {
        document.getElementById(api).style.display = element.value == 'api' ? 'flex' : 'none';
        document.getElementById(smtp).style.display = element.value == 'smtp' ? 'initial' : 'none';
    }
</script>
@endsection