{{template "header" .}}

<div class="container px-5 py-5 my-5 text-center">
    <div class="container w-50 text-start">
        <div class="alert alert-dismissible" id="common-alert" role="alert" style="display: none">
            <p></p>
            <button type="button" class="btn-close" onclick="($('#common-alert').hide())"></button>
        </div>
        {{if .User}}
            <h3>User: {{.User.FullName}} (ID: {{.User.UserID}})</h3>
            <p>----------------------------------------------------</p>
                <h2>Amo CRM</h2>
            {{if .AmoUrl}}
                <a class="btn btn-primary" href="{{.AmoUrl}}">Войти в Amo CRM</a>
            {{end}}
            <p>----------------------------------------------------</p>

            {{if .YandexUrl}}
                <a class="btn btn-primary" href="{{.YandexUrl}}">Войти в Яндекс</a>
                <p>----------------------------------------------------</p>
            {{else}}
                <h2>YaDisk Templates:</h2>
                {{range .YaDiskTemplates}}
                    <p>{{.Name}} | {{.Filename}}</p>
                {{end}}
                <h2>Create Event template</h2>
                <form id="form-template" action="/template/new" method="post">
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="name" name="name" placeholder="Name" required>
                        <label for="name">Name</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="filename" name="filename" placeholder="Filename"
                               required>
                        <label for="filename">Filename</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="storage" name="storage" placeholder="yadisk"
                               value="yadisk" readonly required>
                        <label for="storage">Storage</label>
                    </div>
                    <button type="submit" class="btn btn-primary">Create</button>
                </form>
                <p>----------------------------------------------------</p>
            {{end}}

            {{if .GoogleUrl}}
                <a class="btn btn-primary" href="{{.GoogleUrl}}">Войти в Google</a>
                <p>----------------------------------------------------</p>
            {{else}}
                <h2>Google Templates:</h2>
                {{range .GDiskTemplates}}
                    <p>{{.Name}} | {{.Filename}}</p>
                {{end}}
                <h2>Create Event template</h2>
                <form id="form-template" action="/template/new" method="post">
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="name" name="name" placeholder="Name" required>
                        <label for="name">Name</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="filename" name="filename" placeholder="Filename"
                               required>
                        <label for="filename">Filename</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="storage" name="storage" placeholder="gdisk"
                               value="gdisk" readonly required>
                        <label for="storage">Storage</label>
                    </div>
                    <button type="submit" class="btn btn-primary">Create</button>
                </form>
                <p>----------------------------------------------------</p>
            {{end}}

            {{if or (not .YandexUrl) (not .GoogleUrl)}}
                <h2>Init Event</h2>
                <form id="form-template-init" action="/template/init" method="post">
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="event_name" name="event_name"
                               placeholder="Event Name" required>
                        <label for="event_name">Event Name</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="number" class="form-control" id="doc_number" name="doc_number"
                               placeholder="Номер договора" required>
                        <label for="doc_number">Номер договора</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="client_name" name="client_name"
                               placeholder="Имя клиента" required>
                        <label for="client_name">Имя клиента</label>
                    </div>
                    <div class="form-floating mb-3">
                        <input type="text" class="form-control" id="signature" name="signature" placeholder="Подпись"
                               required>
                        <label for="signature">Подпись</label>
                    </div>
                    <button type="submit" class="btn btn-primary">Init</button>
                </form>
            {{else}}
            {{end}}
        {{else}}
            <p>Вы не авторизованы. Авторизуйтесь или зарегистрируйтесь</p>
        {{end}}
    </div>
</div>

{{template "footer" .}}

<script>
    $(function () {
        $('#form-template').on('submit', function (e) {
            e.preventDefault();
            var form = $(this);
            var alert = $('#common-alert');

            $.ajax({
                url: form.attr('action'),
                type: 'POST',
                dataType: 'json',
                data: JSON.stringify(form.serializeJSON()),
                success: function (result) {
                    location.reload();
                },
                error: function (result) {
                    console.log(result.responseText)
                    alert.addClass('alert-danger');
                    alert.show();
                    alert.children('p').html(result.responseText);
                },
            })
        })
    })
</script>

<script>
    $(function () {
        $('#form-template-init').on('submit', function (e) {
            e.preventDefault();
            var form = $(this);
            var alert = $('#common-alert');

            $.ajax({
                url: form.attr('action'),
                type: 'POST',
                dataType: 'json',
                data: JSON.stringify({
                    "event_name": $('#event_name').val(),
                    "data": {
                        "DocNumber": $('#doc_number').val(),
                        "ClientName": $('#client_name').val(),
                        "Signature": $('#signature').val(),
                    }
                }),
                success: function (result) {
                    location.reload();
                },
                error: function (result) {
                    console.log(result.responseText)
                    alert.addClass('alert-danger');
                    alert.show();
                    alert.children('p').html(result.responseText);
                },
            })
        })
    })
</script>