@extends('layouts.layout')
@section('body_class', 'nav-md')
@section('body_content')
    <div class="container body">
        <div class="main_container">
            @include('includes.sidebar')
            <div class="right_col" role="main">
                <div class="page-title">
                    <div class="row">
                        <div class="col-md-6 col-sm-12">
                            <div class="title_left">
                                <h3><i class="fa fa-opencart"></i> Webstore New Campaign</h3>
                            </div>
                        </div>
                        <div class="col-md-6 col-sm-12 col-xs-12">
                            @include('pages.webstore.campaign_flashsale.steps_wizard')
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div>

                <div class="row">
                    <div class="col-xs-12">
                        <div class="x_panel">
                            <div class="x_content">
                                <form id="form_add_campaign" class="form-horizontal" method="post" action="{{ route('webstore_flashsale_step1_save') }}">
                                    <div class="x_title">
                                        <div class="row">
                                            <div class="col-sm-8">
                                                <div class="title_left">
                                                    <h2>New Campaign</h2>
                                                    <div class="clearfix"></div>
                                                </div>
                                            </div>
                                            <div class="col-sm-4 text-right">
                                                <button type="button" class="btn btn-danger" onclick="cancelConfirm()"><i class="fa fa-times"></i> Cancel</button>
                                                <button type="submit" class="btn btn-primary"><i class="fa fa-arrow-right"></i> Next</button>
                                            </div>
                                        </div>
                                    </div>

                                    {{ csrf_field() }}
                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label">Campaign Sponsor :</label>
                                        <div class="col-xs-12 col-sm-4">
                                            <select class="form-control" name="campaign_sponsor" id="campaign_sponsor" required>
                                                <option value="" disabled selected>Pilih</option>
                                                @foreach ($fs_sponsors as $row)
                                                    <option value="{{ $row->id }}">{{ $row->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    

                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label">Campaign Type :</label>
                                        <div class="col-xs-12 col-sm-4">
                                            <select class="form-control" name="campaign_type" id="campaign_type" required>
                                                <option value="" disabled selected>Pilih</option>
                                                @foreach ($fs_types as $row)
                                                    <option value="{{ $row->id }}">{{ $row->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label">Start date :</label>
                                        <div class="col-xs-12 col-sm-4">
                                            <input type="date" class="form-control" name="start_date" id="start_date"
                                                value="{{ $request['start'] }}" required/>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label">End date :</label>
                                        <div class="col-xs-12 col-sm-4">
                                            <input type="date" class="form-control" name="end_date" id="end_date"
                                                value="{{ $request['end'] }}" required/>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label class="col-xs-12 col-sm-2 control-label">Campaign Name :</label>
                                        <div class="col-xs-12 col-sm-4">
                                            <input type="text" name="campaign_name" id="campaign_name" class="form-control" placeholder="name" required>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @include('includes.footer')
        </div>
    </div>
@endsection


@section("scripts")
    @include('includes.helper_js')
    <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script>
    <script type="text/javascript">
        $('#form_add_campaign').on('submit', function() {
            let start_date = parseInt((($('#start_date').val()).replace('-', '')).replace('-', ''));
            let end_date = parseInt((($('#end_date').val()).replace('-', '')).replace('-', ''));

            if(start_date > end_date) {
                alert('Tanggal mulai tidak boleh lebih besar dari tanggal berakhirnya campaign.');
                return false;
            }
            return true;
        });

        function cancelConfirm() {
            if (confirm('Apakah Anda yakin ingin membatalkan Campaign ini ?')) {
                $('#cover-spin').show();
                location = '{{ route("webstore_flashsale") }}';
            }
        }

        $("#form_add_campaign").on("submit", function() {
            $('#cover-spin').show();
        })
    </script>
@endsection