@extends('admin.layout')

@section('content')

    <?php
    if (!isset($data)) $data = array();
    if (!$data && session("data")) {
        $data = session("data");
    }
    if (!$data && session('_old_input')) {
        $data = session("_old_input");
    }
    ?>
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>店铺管理</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link"> <i class="fa fa-chevron-up"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    @if(role('Store/Info/index'))
                        <div class="row">
                            <div class="col-sm-3 pull-right">
                                <a href="{{ U('Store/Info/index')}}" class="btn btn-sm btn-primary pull-right">返回列表</a>
                            </div>
                        </div>
                    @endif

                    <div class="row">
                        <div class="col-lg-10">
                            <form name="form_product" id="form-validation" action=""
                                  class="form-horizontal form-validation" accept-charset="UTF-8" method="post">


                                <div class="form-group">

                                    <label class="control-label col-sm-3">店铺名称</label>

                                    <div class="col-sm-9">
                                        <input id="data_name" name="data[name]" class="form-control"
                                               value="{{ $data['name'] or ''}}" required="" aria-required="true"
                                               placeholder="">
                                    </div>

                                </div>
                                <div class="form-group">

                                    <label class="control-label col-sm-3">店铺照片</label>

                                    <div class="col-sm-9">
                                        {!!  widget('Tools.ImgUpload')->single('img',"data[img]", isset($data['img'])? $data['img'] : "") !!}

                                    </div>

                                </div>

                                <!--引入高德地图API-->
                                <script type="text/javascript"
                                        src="https://webapi.amap.com/maps?v=1.3&key=533117702a063eae1dc26c183a1ac7bb&plugin=AMap.Autocomplete"></script>
                                <script type="text/javascript"
                                        src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
                                <div class="form-group">

                                    <label class="control-label col-sm-3">地址<span
                                                style="color: red">*</span></label>

                                    <div class="col-sm-9">
                                        <input n name="data[address]" readonly="true"
                                               class="form-control"
                                               value="{{ $data['address'] or ''}}" id="add" data-toggle="modal"
                                               data-target="#myModal">
                                    </div>

                                </div>

                                <input type="hidden" name="data[lon]" id="lon" value="{{$data['lon'] or ''}}">
                                <input type="hidden" name="data[lat]" id="lat" value="{{$data['lat'] or ''}}">

                                <div class="form-group">

                                    <label class="control-label col-sm-3">电话</label>

                                    <div class="col-sm-9">
                                        <input id="data_phone" name="data[phone]" class="form-control"
                                               value="{{ $data['phone'] or ''}}" required="" aria-required="true"
                                               placeholder="">
                                    </div>

                                </div>


                                <div class="form-group">
                                    <label class="control-label col-sm-3">&nbsp;</label>
                                    <div class="col-sm-9">
                                        <input type="hidden" name="_referer"
                                               value="<?php echo urlencode(request()->server('HTTP_REFERER'));?>"/>
                                        <input type="hidden" name="_token" value="<?php echo csrf_token(); ?>"/>
                                        <input type="submit" class="btn btn-success" style="margin-right:20px;">
                                        <input type="reset" class="btn btn-default">
                                    </div>
                                </div>

                            </form>
                        </div>
                        <!-- /.col-lg-10 -->
                    </div>
                    <!-- /.row -->
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog"
         aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="min-width:60%;">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel">
                        选择坐标
                    </h4>
                </div>
                <div class="modal-body">
                    <div id="container" style="width: 100%;min-height: 400px;"></div>
                    <div id="myPageTop">
                        <table>
                            <tr>
                                <td>
                                    <label>按关键字搜索：</label>
                                </td>
                                <td>

                                </td>

                            </tr>
                            <tr>
                                <td>
                                    <input style="margin-right: 10px;min-width:300px"
                                           value="{{ isset($data['address'])?$data['address'] : "" }}" type="text"
                                           placeholder="请输入关键字进行搜索" id="tipinput">
                                </td>
                                <td>
                                    <div style="margin-right: 10px;" class="btn btn-sm btn-primary"
                                         id="confirm">显示搜索点
                                    </div>
                                </td>
                                <td class="column2">
                                    <input type="hidden" readonly="true" id="lnglat">
                                </td>
                            </tr>
                        </table>
                        <br>
                        <button type="button" id="modal-close" class="btn btn-sm btn-primary text-center"
                                data-dismiss="modal">确认位置信息
                        </button>
                    </div>
                    <div id="panel"></div>
                </div>

            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
    </div>


    <script type="text/javascript">
        var map = new AMap.Map("container", {
            resizeEnable: true,
            zoom: 10
        });
        $("#confirm").click(function () {
            var val = $('#tipinput').val();
            AMap.service(["AMap.PlaceSearch"], function () {
                var placeSearch = new AMap.PlaceSearch({ //构造地点查询类
                    pageSize: 5,
                    pageIndex: 1,
                    map: map,
                    panel: "panel"
                });
                placeSearch.search(val);
            });
        });

        //为地图注册click事件获取鼠标点击出的经纬度坐标
        var clickEventListener = map.on('click', function (e) {
            document.getElementById("lnglat").value = e.lnglat.getLng() + ',' + e.lnglat.getLat();
        });

        AMap.plugin('AMap.Geocoder', function () {
            var geocoder = new AMap.Geocoder({});
            var marker = new AMap.Marker({
                map: map,
                bubble: true
            })
            map.on('click', function (e) {
                console.log(e);
                marker.setPosition(e.lnglat);
                $('#lon').val(e.lnglat.getLng());
                $('#lat').val(e.lnglat.getLat());
                geocoder.getAddress(e.lnglat, function (status, result) {
                    if (status == 'complete') {
                        console.log(result);
                        document.getElementById('tipinput').value = result.regeocode.formattedAddress
                    }
                })
            })

        });
        $("#modal-close").click(function () {
            var b = ($('#tipinput').val());
            console.log(b);
            $('#map').val(b);
            $('#add').val(b);
        });
        /*  $('.sg-datepicker').datepicker({
              format: 'yyyy-mm-dd',
              language: 'zh-CN'
          });*/
    </script>
@endsection