fix
Hentua
2023-04-20 9bd759f5a7ad5fe0b47105efd7cacf3f4bf7e9a8
fix
1 files added
2 files modified
4169 ■■■■■ changed files
src/main/resources/static/febs/lay/extends/layarea.js 4073 ●●●●● patch | view | raw | blame | history
src/main/resources/templates/febs/views/modules/shop/add.html 91 ●●●● patch | view | raw | blame | history
src/main/resources/templates/index.html 5 ●●●●● patch | view | raw | blame | history
src/main/resources/static/febs/lay/extends/layarea.js
New file
Diff too large
src/main/resources/templates/febs/views/modules/shop/add.html
@@ -63,15 +63,39 @@
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label febs-form-item-require">地址:</label>
            <div class="layui-input-block">
                <input type="text" name="shopName" autocomplete="off" class="layui-input" id="tipinput">
        <div class="layui-form-item" id="area-picker">
            <div class="layui-form-label  febs-form-item-require">选择地区</div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="province" class="province-selector" lay-filter="province-1">
                    <option value="">请选择省</option>
                </select>
            </div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="city" class="city-selector" lay-filter="city-1">
                    <option value="">请选择市</option>
                </select>
            </div>
            <div class="layui-input-inline" style="width: 200px;">
                <select name="county" class="county-selector" lay-filter="county-1">
                    <option value="">请选择区</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">选择地址:</label>
            <label class="layui-form-label febs-form-item-require">详细地址</label>
            <div class="layui-input-block">
                <div class="layui-inline layui-col-md9">
                    <input type="text" name="shopName" autocomplete="off" class="layui-input" id="tipinput">
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" id="select-address" type="button">选择地址</button>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <div class="layui-input-block">
                <div style="padding: .1rem;">
                    <div id="container" class="map"></div>
@@ -94,7 +118,7 @@
</div>
<script data-th-inline="javascript">
    layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','layedit', 'laydate', 'upload'], function () {
    layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','layedit', 'laydate', 'upload', 'layarea'], function () {
        var $ = layui.$,
            febs = layui.febs,
            layer = layui.layer,
@@ -104,7 +128,10 @@
            laydate = layui.laydate,
            layedit = layui.layedit,
            $view = $('#shop-add'),
            validate = layui.validate;
            $selectAddress = $('#select-address'),
            $tipinput = $('#tipinput'),
            validate = layui.validate
            , layarea = layui.layarea;
        form.render();
@@ -198,20 +225,48 @@
            // })
        })
        var geocoder = new AMap.Geocoder({
        });
        var marker = new AMap.Marker();
        function geoCode() {
            var address = $tipinput.val()
            if (!address) {
                return;
            }
        // function currentLocationInfo() {
        //     map.getCity(function (info) {
        //         febs.alert.success('当前位置:' + info.province + ',' + info.city + ',' + info.district + ',区号:' + info.citycode);
        //     });
        // }
            geocoder.getLocation(address, function(status, result) {
                console.log(result);
                console.log(status)
                if (status === 'complete'&&result.geocodes.length) {
                    var lnglat = result.geocodes[0].location
                    document.getElementById('lnglat').value = lnglat;
                    marker.setPosition(lnglat);
                    map.add(marker);
                    map.setFitView(marker);
                }else{
                    log.error('根据地址查询位置失败');
                }
            });
        }
        // currentLocationInfo();
        //
        // //为地图注册click事件获取鼠标点击出的经纬度坐标
        // map.on('click', function (e) {
        //     febs.alert.success('经度:' + e.lnglat.getLng() + ',纬度:' + e.lnglat.getLat());
        // });
        layarea.render({
            elem: '#area-picker',
            change: function (res) {
                //选择结果
                console.log(res);
                map.getCity(function(info) {
                    var city = info.city ? info.city : info.province
                    if (res.city && city !== res.city) {
                        map.setCity(res.city)
                    }
                });
            }
        });
        $selectAddress.on('click', function() {
            geoCode();
        })
    });
</script>
<script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
src/main/resources/templates/index.html
@@ -19,7 +19,7 @@
            securityJsCode : '3d6014e2619ab82ab4f10fa908e15ba2'
        }
    </script>
    <script src="https://webapi.amap.com/maps?v=2.0&key=f734eff869207f9afbd5462a3ac6bff5&plugin=AMap.AutoComplete,AMap.PlaceSearch"></script>
    <script src="https://webapi.amap.com/maps?v=2.0&key=f734eff869207f9afbd5462a3ac6bff5&plugin=AMap.AutoComplete,AMap.PlaceSearch,AMap.Geocoder"></script>
    <link href="https://unpkg.com/@wangeditor/editor@5.0.1/dist/css/style.css" rel="stylesheet">
    <script src="https://unpkg.com/@wangeditor/editor@latest/dist/index.js"></script>
    <link rel="icon" th:href="@{febs/images/favicon.ico}" type="image/x-icon"/>
@@ -48,7 +48,8 @@
        treeSelect: 'lay/extends/treeSelect',
        apexcharts: 'lay/extends/apexcharts.min',
        eleTree: 'lay/extends/eleTree',
        xmSelect: 'lay/extends/xm-select'
        xmSelect: 'lay/extends/xm-select',
        layarea: 'lay/extends/layarea'
    }).use(['index']);
</script>
</body>