{{--
  Template Name: Accesstrade Link Generator
--}}

@extends('layouts.app')

@section('content')
  {{-- <h3>Accesstrade Link Generator</h3> --}}
<form>
  <div class="columns">
    <div class="column is-8">
      <div class="field">
        <label class="label">Link gốc</label>
        <div class="control">
          <input class="input" type="text" id="url" placeholder="URL" value="" />
        </div>
      </div>
    </div>
    <div class="column is-4">
      <div class="field">
        <label class="label">Tên miền</label>
        <div class="control">
          <div class="select" style="width: 100%">
            <select id="tracking_domain" style="width: 100%">
              <option value="https://go.isclix.com">go.isclix.com</option>
              <option value="https://fast.accesstrade.com.vn">fast.accesstrade.com.vn</option>
            </select>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="columns">
    <div class="column">
      <div class="field">
        <label class="label">Utm Source</label>
        <div class="control">
          <input class="input" type="text" id="utm_source" placeholder="Nguồn chiến dịch (vd. facebook, google)" />
        </div>
      </div>
    </div>
    <div class="column">
      <div class="field">
        <label class="label">Utm Medium</label>
        <div class="control">
          <input class="input" type="text" id="utm_medium" placeholder="Cách tiếp thị (vd. email, cpc, banner)" />
        </div>
      </div>
    </div>
  </div>
  <div class="columns">
    <div class="column">
      <div class="field">
        <label class="label">Utm Campain</label>
        <div class="control">
          <input class="input" type="text" id="utm_campaign" placeholder="Tên chiến dịch" />
        </div>
      </div>
    </div>
    <div class="column">
      <div class="field">
        <label class="label">Utm Content</label>
        <div class="control">
          <input class="input" type="text" id="utm_content" placeholder="Nội dung chiến dịch" />
        </div>
      </div>
    </div>
  </div>
  <div class="columns">
    <div class="column">
      <div class="field">
        <label class="checkbox">
          <input type="checkbox" id="use_shorturl" class="has-mgr-sm" />
          <div class="control" style="display: inline-block">Dùng link thu gọn</div>
        </label>
      </div>
    </div>
  </div>
  <div class="columns">
    <div class="column is-12">
      <div class="field is-grouped">
        <div class="control">
          <button id="createLink" class="button is-link">Tạo link</button>
        </div>
        <div class="control" style="flex-grow: 1">
          <button type="reset" class="button is-link is-light">Xoá</button>
        </div>
        <div class="control">
          @if (defined('ACCESSTRADE_ID'))
            <input id="accesstrade_id" class="input" placeholder="Accesstrade ID" type="hidden" value="{!! ACCESSTRADE_ID !!}" />
          @else
            <input id="accesstrade_id" class="input" placeholder="Accesstrade ID" type="text" value="" />
          @endif
        </div>
      </div>
    </div>
  </div>
  <div class="columns">
    <div class="column" id="notification-container">
    </div>
  </div>
</form>
@endsection