@extends("admin.layouts.layout")

@php
    $pageTitle = __("actions.".last(explode("/",request()->url()))).$modelName;
@endphp

@section("content")
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    {!! form_start($form) !!}
                    @foreach($form->getFields() as $field)
                        {!! form_row($form->{$field->getName()},isset($vo[$field->getName()]) ? ["value"=>$vo[$field->getName()],"selected"=>$vo[$field->getName()]] : []) !!}
                        @if($field->getName()=="address")
                            <div class="mapimg" id="mapimg-box" style="position: relative">
                                <img style="position: absolute;top: 43%;left: 53%;transform: translate(-50%, -50%);z-index: 1;"
                                     src="https://3gimg.qq.com/lightmap/api_v2/2/4/117/theme/default/imgs/marker.png"
                                     alt="">
                                <div id="mapcontainer" style="height:200px; width: 100%;"></div>
                            </div>
                        @endif
                    @endforeach
                    {!!form_end($form)!!}
                </div>
            </div>
        </div>
    </div>
@endsection

@push("footer")
    <script type="text/javascript"
            src="https://map.qq.com/api/js?v=2.exp&key=D3HBZ-RAMHJ-KFHFR-KLK5H-OGWJ7-RNB63"></script>
    <script>
        function uploaderCallback(file, data, index) {
            $('input[data-uploader-index=' + index + ']').val("/storage/" + (data.folder ? data.folder + "/" : "") + data.name);
            return true;
        }

        $(function () {
            if ($("#address").length) {
                var mapimgBox = $("#mapimg-box");
                $("#address").before(mapimgBox.clone());
                mapimgBox.remove();
                initMap();
                $("#mapcontainer").bind("DOMNodeInserted", function (e) {
                    var tempCount = 0;
                    $("#mapcontainer .smnoprint").siblings().each(function () {
                        tempCount++;
                        if (tempCount == 2 || tempCount == 3) {
                            $(this).remove();
                        }
                    });
                });
                $("#address").blur(codeAddress);
            }
        });
        var citylocation, map, geocoder = null;
        var initMap = function () {
            var latitude = $("input[name=latitude]").val();
            var longitude = $("input[name=longitude]").val();

            map = new qq.maps.Map(document.getElementById('mapcontainer'), {
                // center: center,
                zoom: 16,
            });
            if (latitude != "" && longitude != "") {
                var center = new qq.maps.LatLng(latitude, longitude);
            } else {
                var center = new qq.maps.LatLng(31.835727, 119.905098);
            }
            map.panTo(center);

            qq.maps.event.addListener(map, 'dragend', function () {
                //地图移动停止后 获取经纬度
                $('#latitude').val(map.getCenter().lat);
                $('#longitude').val(map.getCenter().lng);
                var coord = new qq.maps.LatLng(map.getCenter().lat, map.getCenter().lng);
                geocoder.getAddress(coord);
            });
            //获取城市列表接口设置中心点
            citylocation = new qq.maps.CityService({
                complete: function (result) {
                    map.setCenter(result.detail.latLng);
                }
            });
            //调用地址解析类
            geocoder = new qq.maps.Geocoder({
                complete: function (result) {
                    map.setCenter(result.detail.location);
                    //请求成功后 给经纬度赋值
                    $('#address').val(result.detail.address);
                    $('input[name=latitude]').val(result.detail.location.lat);
                    $('input[name=longitude]').val(result.detail.location.lng);
                }
            });
            //调用searchLocalCity();方法    根据用户IP查询城市信息。
            if (latitude == "" && longitude == "") {
                citylocation.searchLocalCity();
            }
        };

        function codeAddress() {
            var address = $("#address").val();
            //通过getLocation();方法获取位置信息值
            if (address != "") {
                geocoder.getLocation(address);
            } else {
                $.NotificationApp.send("提示", "请输入地址以查询坐标！", 'top-center', '#ffbc00', 'warning');
            }

        }
    </script>
    <script src="/plugins/ueditor/ueditor.config.js"></script>
    <script src="/plugins/ueditor/ueditor.all.js"></script>
    <script type="text/plain" id="upload_ue"></script>
    <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script>
        $(function () {
            $("#content").removeClass("form-control");
            var ue = UE.getEditor('content');
        });

        function afterAddCollectionRow(ele) {
            var box = $(ele).closest("table").children("tbody").children(":last");
            setDatePicker(box);
            setDatetimePicker(box);
        }

        function uploaderCallback(file, data, index) {
            $('input[data-uploader-index=' + index + ']').val("/storage/" + (data.folder ? data.folder + "/" : "") + data.name);
            return true;
        }
    </script>
@endpush