@extends('layouts.main')
@section('content')

<script type="text/javascript" src='{{ asset('js/jquery.autoKana.js') }}'></script>
<script type="text/javascript" src='{{ asset('js/ajaxzip3.js') }}'></script>
<script type="text/javascript" src="{{ asset('js/jquery-ui.js') }}"></script>
<link media="screen" rel="stylesheet" type="text/css" href="{{ asset('css/jquery-ui.css') }}">

<script type="text/javascript">
    $(document).ready(
        function() {               
            $.fn.autoKana('#name01', '#kana01', {
                katakana : true  //true：カタカナ、false：ひらがな（デフォルト）
        });
    });
</script>

<script type="text/javascript">
	jQuery(document).ready(function(){
	   jQuery("#createform").validationEngine();
	});

	/**
	* @param {jqObject} the field where the validation applies
	* @param {Array[String]} validation rules for this field
	* @param {int} rule index
	* @param {Map} form options
	* @return an error string if validation failed
	*/
	function checkLtNumHifn(field, rules, i, options){
		if ( !field.val().match( /^[0-9a-zA-Z\-]+$/ ) ) {
			// un match
			return "* 半角英数 記号(-)で入力してください";
		}
	}

	function checkKatakana(field, rules, i, options){
		if ( !field.val().match( /^[ァ-ヺー]+$/ ) ) {
			// un match
			return "* 全角カタカナで入力してください";
		}
	}
</script>

<div class="container">
    {{ Form::open(['url' => 'order/update/' . $header->order_id, 'method' => 'POST', 'name' => 'form', 'id' => 'createform', 'files' => true]) }}
    {{ Form::hidden("order_id", $header->order_id, ["id"=>"order_id"]) }}
    <h5>受注情報</h5>

    <!-- データエリア -->
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">取引先情報</h3>
            </div>
            
            {{-- 通知メッセージ --}}
            @if ($message <> "")
                <div class="message">
                    {{ Form::label("message", $message, ["class"=>"form-control btn-success btn"]) }}
                </div>
            @endif

            @if (session()->has('errors'))
                <div class="alert alert-danger">
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
            
            <div class="panel-body">

                <table class="table">
                    <col width="10%" />
                    <col width="90%" />
                    <tr>
                        <td>受注番号</td>
                        <td>{{ $header->order_id }}</td>
                    </tr>
                    <tr>
                        <td>注文状況</td>
                        <td>{{ $header->status_name }}</td>
                    </tr>
                    <tr>
                        <td>受注日</td>
                        <td>{{ $header->create_date }}</td>
                    </tr>
                    <tr>
                        <td>顧客番号</td>
                        <td>{{ $header->customer_id }}</td>
                    </tr>
                    <tr>
                        <td>取引先名</td>
                        <td>{{ $header->order_company_name }}</td>
                    </tr>
                    <tr>
                        <td>担当者名</td>
                        <td>{{ $header->order_name01 }} {{ $header->order_name02 }}</td>
                    </tr>
                    <tr>
                        <td>E-Mail</td>
                        <td>{{ $header->order_email }}</td>
                    </tr>
                    <tr>
                        <td>電話番号</td>
                        <td>{{ $header->order_tel01 }} - {{ $header->order_tel02 }} - {{ $header->order_tel03 }}</td>
                    </tr>
                    <tr>
                        <td>FAX</td>
                        <td>{{ $header->order_fax01 }} - {{ $header->order_fax02 }} - {{ $header->order_fax03 }}</td>
                    </tr>
                    <tr>
                        <td>郵便番号</td>
                        <td>{{ $header->order_zip01 }} - {{ $header->order_zip02 }}</td>
                    </tr>
                    <tr>
                        <td>住所</td>
                        <td>{{ $header->prefname }}{{ $header->order_addr01 }}{{ $header->order_addr02 }}</td>
                    </tr>
                    <tr>
                        <td>小計</td>
                        <td>{{ $header->subtotal }}</td>
                    </tr>
                    <tr>
                        <td>消費税</td>
                        <td>{{ $header->tax }}</td>
                    </tr>
                    <tr>
                        <td>合計</td>
                        <td>{{ $header->total }}</td>
                    </tr>
                    <tr>
                        <td>備考1</td>
                        <td>{{ $header->message }}</td>
                    </tr>
                    <tr>
                        <td>備考2</td>
                        <td>{{ $header->note }}</td>
                    </tr>
                    <tr>
                        <td>回収用配送番号</td>
                        <td>{{ Form::text("memo01", $header->memo01, ["class"=>"form-control", "id"=>"memo01", 'style' => 'width:25%']) }}</td>
                    </tr>
                    <tr>
                        <td>発送用配送番号</td>
                        <td>{{ Form::text("memo02", $header->memo02, ["class"=>"form-control", "id"=>"memo02", 'style' => 'width:25%']) }}</td>
                    </tr>
                    <tr>
                        <td>作業店</td>
                        <td>{{ $header->name_abbr }}</td>
                    </tr>
                     
                </table>
            </div><!-- /.panel-body -->
        </div><!-- /.panel panel-default -->
                        
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">取引明細</h3>
            </div>
            <div class="panel-body">
                <table class="table">
                    <col width="10%" />
                    <col width="30%" />
                    <col width="10%" />
                    <col width="10%" />
                    <tr>
                        <td>製品コード</td>
                        <td>製品名</td>
                        <td>数量</td>
                        <td>単価</td>
                    </tr>
                    @foreach ($datas as $data)
                    <tr>
                        <td>{{ $data->product_name }}</td>
                        <td>{{ $data->product_code }}</td>
                        <td>{{ $data->quantity }}</td>
                        <td>{{ $data->price }}</td>
                    </tr>
                    @endforeach
                </table>
            
            </div><!-- /.panel-body -->
        </div><!-- /.panel panel-default -->
                   
        <div class="panel panel-default">
            <div class="panel-body">
                <div>
                    @if ($message == "")
                        {{ Form::hidden("status", $header->status) }}
                        {{ Form::button("更新", ["class"=>"btn btn-success", "id"=>"submit_btn"]) }}
                        {{ Form::button("キャンセル", ["class"=>"btn btn-default", "onClick"=>"javascript:window.history.back(-1);return false;"]) }}
                        <!-- <a href="#" data-toggle="modal" data-target="#deleteModal{!! $header->customer_id !!}">{!! Form::button(" 削除 ", ["class" => "btn btn-danger"]) !!}</a> -->
                    @else
                        {{ Form::button("キャンセル", ["class"=>"btn btn-default", "onClick"=>"location.href='/WASHMATE-ADMIN/public/order/index'"]) }}
                    @endif
                    
                </div>
                
            </div><!-- /.panel-body -->
        </div><!-- /.panel panel-default -->
    </div><!-- /.col-md-12 -->
                                                                    
    
    <!-- 作業店選択ダイアログ -->
    <div class="modal fade" id="customers">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h6 class="modal-title alert alert-success">作業店選択</h6>
                </div>
                <div class="modal-body">
                    <div style="display: inline-block; width: 99%; vertical-align: top;">
                        <table class="table">
                            <tr>
                                <td></td>
                                <td>コード</td>
                                <td>作業店名</td>
                                <td>作業店名（カナ）</td>
                                <td>郵便番号</td>
                                <td>都道府県</td>
                                <td>住所</td>
                                <td>TEL</td>
                            </tr>
                            @foreach($companies as $company)
                            <tr>
                                <td><a href="#" class="btn btn-warning" data-dismiss="modal" onClick="javascript:setCustomers('{{ $company->id }}', '{{ $company->code }}', '{{ $company->name1 }}', '{{ $company->name_phonetic }}', '{{ $company->tel1 }}', '{{ $company->zipcode }}', '{{ $company->address1 }}', '{{ $company->address2 }}')">セット</a></td>
                                <td>{{ $company->code }}</td>
                                <td>{{ $company->name1 }}</td>
                                <td>{{ $company->name_phonetic }}</td>
                                <td>{{ $company->zipcode }}</td>
                                <td>{{ $company->address1 }}</td>
                                <td>{{ $company->address2 }}</td>
                                <td>{{ $company->tel1 }}</td>
                            </tr>
                            @endforeach
                        </table>
                    </div>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
    <!-- /.部門選択ダイアログ -->
    {!! Form::close() !!}
    
</div>
    
<script Language="JavaScript">
    // 選択された店舗情報をセットする
    function setCustomers(id, code, name1, phonetic, person, tel1, zipcode, pref, address1) {
        document.getElementById("customer_id").value = id;
        document.getElementById("customer_code").value = code;
        document.getElementById("customer_name1").value = name1;
        document.getElementById("customer_phonetic").value = phonetic;
        document.getElementById("customer_person").value = person;
        document.getElementById("tel1").value = tel1;
        document.getElementById("zipcode").value = zipcode;
        document.getElementById("pref").value = pref;
        document.getElementById("address1").value = address1;

    }
</script>

<script>
  $(function() {
    $.datepicker.setDefaults({
        closeText: '閉じる',
        prevText: '<前',
        nextText: '次>',
        currentText: '今日',
        monthNames: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
        monthNamesShort: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
        dayNames: ['日曜日','月曜日','火曜日','水曜日','木曜日','金曜日','土曜日'],
        dayNamesShort: ['日','月','火','水','木','金','土'],
        dayNamesMin: ['日','月','火','水','木','金','土'],
        weekHeader: '週',
        dateFormat: 'yy/mm/dd',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: true,
        yearSuffix: '年',
        changeYear: true,  // 年選択をプルダウン化
        changeMonth: true, // 月選択をプルダウン化
        showWeek: true,
        buttonImage: "{{ asset('css/images/calendar-icon.png') }}",
        buttonText : "カレンダーから選択",
        buttonImageOnly: true,
        showOn: "both",
    });
    
    $('#contract_ymd').datepicker({
        onSelect: function(dat,inst){
            var week=$.datepicker.iso8601Week(new Date(dat));
//            $('#contract_ymd').val($.datepicker.formatDate('yyyy/mm/dd',new Date(dat))+(week<10?'0':'')+week)
        },
        beforeShow: function() {
            setTimeout(function(){
                $('.ui-datepicker').css('z-index', 99999999999999);
	    }, 0);
	},
    });
    
    $('#deliver_ymd').datepicker({
        onSelect: function(dat,inst){
            var week=$.datepicker.iso8601Week(new Date(dat));
//            $('#deliver_ymd').val($.datepicker.formatDate('yyyy/mm/dd',new Date(dat))+(week<10?'0':'')+week)
        },
        beforeShow: function() {
            setTimeout(function(){
                $('.ui-datepicker').css('z-index', 99999999999999);
	    }, 0);
	},
    });
    
    $('#next_ymd').datepicker({
        onSelect: function(dat,inst){
            var week=$.datepicker.iso8601Week(new Date(dat));
//            $('#next_ymd').val($.datepicker.formatDate('yyyy/mm/dd',new Date(dat))+(week<10?'0':'')+week)
        },
        beforeShow: function() {
            setTimeout(function(){
                $('.ui-datepicker').css('z-index', 99999999999999);
	    }, 0);
	},
    });
    
    $('#accept_ymd').datepicker({
        onSelect: function(dat,inst){
            var week=$.datepicker.iso8601Week(new Date(dat));
//            $('#accept_ymd').val($.datepicker.formatDate('yyyy/mm/dd',new Date(dat))+(week<10?'0':'')+week)
        },
        beforeShow: function() {
            setTimeout(function(){
                $('.ui-datepicker').css('z-index', 99999999999999);
	    }, 0);
	},
    });
    
    $('#complete_ymd').datepicker({
        onSelect: function(dat,inst){
            var week=$.datepicker.iso8601Week(new Date(dat));
//            $('#complete_ymd').val($.datepicker.formatDate('yyyy/mm/dd',new Date(dat))+(week<10?'0':'')+week)
        },
        beforeShow: function() {
            setTimeout(function(){
                $('.ui-datepicker').css('z-index', 99999999999999);
	    }, 0);
	},
    });
    
    $('#work_ymd').datepicker({
        beforeShow: function() {
            setTimeout(function(){
                $('.ui-datepicker').css('z-index', 99999999999999);
	    }, 0);
	},
        onSelect:function(selected_date) {
            document.getElementById("accept_ymd").value = selected_date;
            document.getElementById("complete_ymd").value = selected_date;
            setNextYear();            
        },
    });    
});
</script>    

<script>
/* ------------------------------
 Loading イメージ表示関数
 引数： msg 画面に表示する文言
 ------------------------------ */
function dispLoading(msg){
    // 引数なし（メッセージなし）を許容
    if( msg == undefined ){
        msg = "";
    }
    
    // 画面表示メッセージ
    var dispMsg = "<div class='loadingMsg'>" + msg + "</div>";
    
    // ローディング画像が表示されていない場合のみ出力
    if($("#loading").length == 0){
        $("body").append("<div id='loading'>" + dispMsg + "</div>");
    }
}
 
/* ------------------------------
 Loading イメージ削除関数
 ------------------------------ */
function removeLoading(){
    $("#loading").remove();
}    
</script>

<style>
#loading {
  display: table;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #fff;
  opacity: 0.8;
}
 
#loading .loadingMsg {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  padding-top: 140px;
  background: url("/ICS/public/img/loading.png") center center no-repeat;
}
</style>

<script>
jQuery( document ).ready( function() {
    jQuery( '#createform' ).validationEngine();
    jQuery( '#submit_btn' ).click( function() {
        if ( ! $( '#createform' ).validationEngine( 'validate' ) ) {
            // validate失敗
        } else {
            document.form.submit();
        }
        return false;
    } );
} );
</script>

@endsection