@extends('layout')

@section('pageTitle', "購物車｜".config('globals.app_name'))


@section('content')
<link rel="stylesheet" href="{{ asset('css/cart.css?'.rand(10000,99999)) }}">
<style>

.cart-box{
    margin-bottom: 1rem;
    font-size: 16px;
}

form{
    width: 500px;
    margin-left: auto;
    margin-right: auto;
}

</style>
<section class="container">
    <div class="row">
        <div class="col-12">
            <h1 class="color-all-title big-title p-3">｜購物車｜</h1>
            <div class="step-box">
                <img src="/images/info/step2.jpg" alt="">
            </div>
        </div>
        <div class="col-12">
            <h3 class="color-all-title big-title m-3 text-center">收貨人資訊</h3>
            <form action="/process/addOrder" method="get" enctype="multipart/form-data">
                <div class="form-group">
                    <label for="input-name" class="mb-3 d-flex product-title">收貨人姓名<span class="worrytext" style="display: none;">請輸入領貨人姓名</span></label>
                    <input type="text" id="name" name="name" class="form-control form-control-text" placeholder="">
                </div>
                <div class="form-group">
                    <label for="input-phone" class="mb-3 d-flex product-title">收貨人電話
                    <span class="worrytext" style="display: none;">請輸入收貨人電話</span></label>
                    <input type="phone" id="phone" name="phone" class="form-control form-control-text" placeholder="">
                </div>
                <div class="form-group">
                    <label for="input-phone" class="mb-3 d-flex product-title">收貨人信箱
                    <span class="worrytext" style="display: none;">請輸入收貨人信箱</span></label>
                    <input type="email" id="email" name="email" class="form-control form-control-text" placeholder="">
                </div>
                <div class="form-group">
                    <label for="input-phone" class="mb-3 d-flex product-title">收貨人地址</label>
                    <div class="row">
                        <div class="col-md-6 form-group">
                            <span class="select-cart-form">
                                <select id="city" name="city" class="form-control ">
                                    <option value="" disabled="" class="">城市/縣</option>
                                    <option value="新北市">新北市</option><option value="臺北市">臺北市</option><option value="桃園市">桃園市</option><option value="臺中市">臺中市</option><option value="臺南市">臺南市</option><option value="高雄市">高雄市</option><option value="基隆市">基隆市</option><option value="新竹市">新竹市</option><option value="嘉義市">嘉義市</option><option value="新竹縣">新竹縣</option><option value="苗栗縣">苗栗縣</option><option value="彰化縣">彰化縣</option><option value="南投縣">南投縣</option><option value="雲林縣">雲林縣</option><option value="嘉義縣">嘉義縣</option><option value="屏東縣">屏東縣</option><option value="宜蘭縣">宜蘭縣</option><option value="花蓮縣">花蓮縣</option><option value="臺東縣">臺東縣</option><option value="澎湖縣">澎湖縣</option><option value="金門縣">金門縣</option><option value="連江縣">連江縣</option>
                                </select>
                            </span>
                        </div>
                        <div class="col-md-6 form-group">
                            <span class="select-cart-form">
                                <select id="town" name="town" class="form-control"><option value="板橋區">板橋區</option><option value="新莊區">新莊區</option><option value="中和區">中和區</option><option value="永和區">永和區</option><option value="土城區">土城區</option><option value="樹林區">樹林區</option><option value="三峽區">三峽區</option><option value="鶯歌區">鶯歌區</option><option value="三重區">三重區</option><option value="蘆洲區">蘆洲區</option><option value="五股區">五股區</option><option value="泰山區">泰山區</option><option value="林口區">林口區</option><option value="八里區">八里區</option><option value="淡水區">淡水區</option><option value="三芝區">三芝區</option><option value="石門區">石門區</option><option value="金山區">金山區</option><option value="萬里區">萬里區</option><option value="汐止區">汐止區</option><option value="瑞芳區">瑞芳區</option><option value="貢寮區">貢寮區</option><option value="平溪區">平溪區</option><option value="雙溪區">雙溪區</option><option value="新店區">新店區</option><option value="深坑區">深坑區</option><option value="石碇區">石碇區</option><option value="坪林區">坪林區</option><option value="烏來區">烏來區</option></select>
                            </span>
                        </div>
                    </div>
                    <input type="text" id="address" name="address" class="form-control form-control-text" placeholder="地址">
                </div>
                <div class="form-group">
                    <label for="input-phone" class="mb-3 d-flex product-title">備註</label>
                    <textarea id="remarks" class="form-control" name="remarks" placeholder="有什麼想告訴賣家嗎？" rows="5"></textarea>
                </div>
                <div class="form-group">
                    <button type="submit" class="btn btn-large btn-block btn-gold">送出訂單</button>
                </div>
            </form>
        </div>
    </div>

    <script>
        var townarray = {'新北市':'板橋區,新莊區,中和區,永和區,土城區,樹林區,三峽區,鶯歌區,三重區,蘆洲區,五股區,泰山區,林口區,八里區,淡水區,三芝區,石門區,金山區,萬里區,汐止區,瑞芳區,貢寮區,平溪區,雙溪區,新店區,深坑區,石碇區,坪林區,烏來區','臺北市':'中正區,大同區,中山區,松山區,大安區,萬華區,信義區,士林區,北投區,內湖區,南港區,文山區','桃園市':'桃園區,中壢區,平鎮區,八德區,楊梅區,蘆竹區,大溪區,龍潭區,龜山區,大園區,觀音區,新屋區,復興區','臺中市':'中區,東區,南區,西區,北區,北屯區,西屯區,南屯區,太平區,大里區,霧峰區,烏日區,豐原區,后里區,石岡區,東勢區,新社區,潭子區,大雅區,神岡區,大肚區,沙鹿區,龍井區,梧棲區,清水區,大甲區,外埔區,大安區,和平區','臺南市':'中西區,東區,南區,北區,安平區,安南區,永康區,歸仁區,新化區,左鎮區,玉井區,楠西區,南化區,仁德區,關廟區,龍崎區,官田區,麻豆區,佳里區,西港區,七股區,將軍區,學甲區,北門區,新營區,後壁區,白河區,東山區,六甲區,下營區,柳營區,鹽水區,善化區,大內區,山上區,新市區,安定區','高雄市':'楠梓區,左營區,鼓山區,三民區,鹽埕區,前金區,新興區,苓雅區,前鎮區,旗津區,小港區,鳳山區,大寮區,鳥松區,林園區,仁武區,大樹區,大社區,岡山區,路竹區,橋頭區,梓官區,彌陀區,永安區,燕巢區,田寮區,阿蓮區,茄萣區,湖內區,旗山區,美濃區,內門區,杉林區,甲仙區,六龜區,茂林區,桃源區,那瑪夏區','基隆市':'仁愛區,中正區,信義區,中山區,安樂區,暖暖區,七堵區','新竹市':'東區,北區,香山區','嘉義市':'東區,西區','新竹縣':'竹北市,竹東鎮,新埔鎮,關西鎮,湖口鄉,新豐鄉,峨眉鄉,寶山鄉,北埔鄉,芎林鄉,橫山鄉,尖石鄉,五峰鄉','苗栗縣':'苗栗市,頭份市,竹南鎮,後龍鎮,通霄鎮,苑裡鎮,卓蘭鎮,造橋鄉,西湖鄉,頭屋鄉,公館鄉,銅鑼鄉,三義鄉,大湖鄉,獅潭鄉,三灣鄉,南庄鄉,泰安鄉','彰化縣':'彰化市,員林市,和美鎮,鹿港鎮,溪湖鎮,二林鎮,田中鎮,北斗鎮,花壇鄉,芬園鄉,大村鄉,永靖鄉,伸港鄉,線西鄉,福興鄉,秀水鄉,埔心鄉,埔鹽鄉,大城鄉,芳苑鄉,竹塘鄉,社頭鄉,二水鄉,田尾鄉,埤頭鄉,溪州鄉','南投縣':'南投市,埔里鎮,草屯鎮,竹山鎮,集集鎮,名間鄉,鹿谷鄉,中寮鄉,魚池鄉,國姓鄉,水里鄉,信義鄉,仁愛鄉','雲林縣':'斗六市,斗南鎮,虎尾鎮,西螺鎮,土庫鎮,北港鎮,林內鄉,古坑鄉,大埤鄉,莿桐鄉,褒忠鄉,二崙鄉,崙背鄉,麥寮鄉,臺西鄉,東勢鄉,元長鄉,四湖鄉,口湖鄉,水林鄉','嘉義縣':'太保市,朴子市,布袋鎮,大林鎮,民雄鄉,溪口鄉,新港鄉,六腳鄉,東石鄉,義竹鄉,鹿草鄉,水上鄉,中埔鄉,竹崎鄉,梅山鄉,番路鄉,大埔鄉,阿里山鄉','屏東縣':'屏東市,潮州鎮,東港鎮,恆春鎮,萬丹鄉,長治鄉,麟洛鄉,九如鄉,里港鄉,鹽埔鄉,高樹鄉,萬巒鄉,內埔鄉,竹田鄉,新埤鄉,枋寮鄉,新園鄉,崁頂鄉,林邊鄉,南州鄉,佳冬鄉,琉球鄉,車城鄉,滿州鄉,枋山鄉,霧臺鄉,瑪家鄉,泰武鄉,來義鄉,春日鄉,獅子鄉,牡丹鄉,三地門鄉','宜蘭縣':'宜蘭市,頭城鎮,羅東鎮,蘇澳鎮,礁溪鄉,壯圍鄉,員山鄉,冬山鄉,五結鄉,三星鄉,大同鄉,南澳鄉','花蓮縣':'花蓮市,鳳林鎮,玉里鎮,新城鄉,吉安鄉,壽豐鄉,光復鄉,豐濱鄉,瑞穗鄉,富里鄉,秀林鄉,萬榮鄉,卓溪鄉','臺東縣':'臺東市,成功鎮,關山鎮,長濱鄉,池上鄉,東河鄉,鹿野鄉,卑南鄉,大武鄉,綠島鄉,太麻里鄉,海端鄉,延平鄉,金峰鄉,達仁鄉,蘭嶼鄉','澎湖縣':'馬公市,湖西鄉,白沙鄉,西嶼鄉,望安鄉,七美鄉','金門縣':'金城鎮,金湖鎮,金沙鎮,金寧鄉,烈嶼鄉,烏坵鄉','連江縣':'南竿鄉,北竿鄉,莒光鄉,東引鄉'};
        $(document).ready(function(){
            set_town();
            $('#city').change(function(){
                set_town();
            });
        });
        function set_town()
        {
            var city = $('#city').val();
            var strarray = townarray[city].split(',');

            var html = "";
            for(var i=0;i<strarray.length;i++)
            {
                html += '<option value="'+strarray[i]+'">'+strarray[i]+'</option>';
            }
            $('#town').html(html);
        }
    </script>

</section>
@endsection