会员新增省市县区属性

member/src/main/resources/template/js/member/memberAdd.js

@@ -20,7 +20,10 @@ layui.config({
         shopUtil.queryStaffBelongStoreList(function (json){
             $("#storeId").html(getDataUseHandlebars($("#selectTemplate").html(), json));
         });
-        
+
+        // 加载行政区划-省
+        loadChildProvinceArea();
+
 	    matchingLanguage();
         form.render();
         form.on('submit(formAddBean)', function (data) {
@@ -29,6 +32,10 @@ layui.config({
                     contacts: $("#contacts").val(),
                     phone: $("#phone").val(),
                     email: $("#email").val(),
+                    provinceId: $("#provinceId").val(),
+                    cityId: $("#cityId").val(),
+                    addressAreaId: $("#addressAreaId").val(),
+                    townshipId: $("#townshipId").val(),
                     address: $("#address").val(),
                     description: $("#description").val(),
                     storeId: $("#storeId").val()
@@ -45,6 +52,96 @@ layui.config({
             return false;
         });
 
+        form.on('select(areaProvince)', function(data){
+            layui.$(data.elem).parent('dd').nextAll().remove();
+            if(isNull(data.value) || data.value == '请选择'){
+            }else{
+                loadChildCityArea();
+            }
+        });
+        form.on('select(areaCity)', function(data){
+            layui.$(data.elem).parent('dd').nextAll().remove();
+            if(isNull(data.value) || data.value == '请选择'){
+            }else{
+                loadChildArea();
+            }
+        });
+        form.on('select(area)', function(data){
+            layui.$(data.elem).parent('dd').nextAll().remove();
+            if(isNull(data.value) || data.value == '请选择'){
+            }else{
+                loadChildAreaTownShip();
+            }
+        });
+
+        // 省级行政区划
+        function loadChildProvinceArea(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea001", params:{}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="provinceId" win-verify="required" lay-filter="areaProvince" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        // 市级行政区划
+        function loadChildCityArea(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea002", params:{rowId: $("#provinceId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="cityId" win-verify="required" lay-filter="areaCity" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        // 县级行政区划
+        function loadChildArea(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea003", params:{rowId: $("#cityId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="addressAreaId" win-verify="required" lay-filter="area" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        // 镇级行政区划
+        function loadChildAreaTownShip(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea004", params:{rowId: $("#addressAreaId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="townshipId" win-verify="required" lay-filter="areaTownShip" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
         $("body").on("click", "#cancle", function(){
             parent.layer.close(index);
         });

member/src/main/resources/template/js/member/memberEdit.js

@@ -12,7 +12,7 @@ layui.config({
         showGrid({
             id: "showForm",
             url: shopBasePath + "member003",
-            params: {rowId:parent.rowId},
+            params: {rowId: parent.rowId},
             pagination: false,
             method: "GET",
             template: $("#beanTemplate").html(),
@@ -24,7 +24,10 @@ layui.config({
 			    	maxlength: 200,
 			    	tools: ['count', 'copy', 'reset']
 			    });
-            	
+
+                // 家庭地址
+                initArea(json.bean);//加载省级行政区划
+
 			    matchingLanguage();
                 form.render();
                 form.on('submit(formEditBean)', function (data) {
@@ -34,6 +37,10 @@ layui.config({
                             contacts: $("#contacts").val(),
                             phone: $("#phone").val(),
                             email: $("#email").val(),
+                            provinceId: $("#provinceId").val(),
+                            cityId: $("#cityId").val(),
+                            addressAreaId: $("#addressAreaId").val(),
+                            townshipId: $("#townshipId").val(),
                             address: $("#address").val(),
                             description: $("#description").val()
                         };
@@ -51,6 +58,162 @@ layui.config({
             }
         });
 
+        //初始化行政区划-省
+        function initArea(bean){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea001", params:{}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="provinceId" win-verify="required" lay-filter="areaProvince" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    if(!isNull(bean.provinceId)){
+                        $("#provinceId").val(bean.provinceId);
+                        initAreaCity(bean);
+                    }
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        //初始化行政区划-市
+        function initAreaCity(bean){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea002", params:{rowId: $("#provinceId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="cityId" win-verify="required" lay-filter="areaCity" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    if(!isNull(bean.cityId)){
+                        $("#cityId").val(bean.cityId);
+                        initAreaChildArea(bean);
+                    }
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        //初始化行政区划-县
+        function initAreaChildArea(bean){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea003", params:{rowId: $("#cityId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="addressAreaId" win-verify="required" lay-filter="area" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    if(!isNull(bean.addressAreaId)){
+                        $("#addressAreaId").val(bean.addressAreaId);
+                        initAreaTownShip(bean);
+                    }
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        //初始化行政区划-镇
+        function initAreaTownShip(bean){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea004", params:{rowId: $("#addressAreaId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="townshipId" win-verify="required" lay-filter="areaTownShip" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    if(!isNull(bean.townshipId)){
+                        $("#townshipId").val(bean.townshipId);
+                    }
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        form.on('select(areaProvince)', function(data){
+            layui.$(data.elem).parent('dd').nextAll().remove();
+            if(isNull(data.value) || data.value == '请选择'){
+            }else{
+                loadChildCityArea();
+            }
+        });
+        form.on('select(areaCity)', function(data){
+            layui.$(data.elem).parent('dd').nextAll().remove();
+            if(isNull(data.value) || data.value == '请选择'){
+            }else{
+                loadChildArea();
+            }
+        });
+        form.on('select(area)', function(data){
+            layui.$(data.elem).parent('dd').nextAll().remove();
+            if(isNull(data.value) || data.value == '请选择'){
+            }else{
+                loadChildAreaTownShip();
+            }
+        });
+
+        //市级行政区划
+        function loadChildCityArea(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea002", params:{rowId: $("#provinceId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="cityId" win-verify="required" lay-filter="areaCity" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        //县级行政区划
+        function loadChildArea(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea003", params:{rowId: $("#cityId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="addressAreaId" win-verify="required" lay-filter="area" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
+        //镇级行政区划
+        function loadChildAreaTownShip(){
+            AjaxPostUtil.request({url:reqBasePath + "commontarea004", params:{rowId: $("#addressAreaId").val()}, type:'json', method: "POST", callback:function(json){
+                if(json.returnCode == 0){
+                    var str = '<dd class="layui-col-xs3"><select id="townshipId" win-verify="required" lay-filter="areaTownShip" lay-search=""><option value="">请选择</option>';
+                    for(var i = 0; i < json.rows.length; i++){
+                        str += '<option value="' + json.rows[i].id + '">' + json.rows[i].name + '</option>';
+                    }
+                    str += '</select></dd>';
+                    $("#lockParentSel").append(str);
+                    form.render('select');
+                }else{
+                    winui.window.msg(json.returnMessage, {icon: 2,time: 2000});
+                }
+            }});
+        }
+
         $("body").on("click", "#cancle", function(){
             parent.layer.close(index);
         });

member/src/main/resources/template/tpl/member/memberAdd.html

@@ -36,7 +36,12 @@
                 </div>
             </div>
             <div class="layui-form-item layui-col-xs12">
-                <label class="layui-form-label">地址</label>
+                <label class="layui-form-label">家庭住址<i class="red">*</i></label>
+                <div class="layui-input-block" id="lockParentSel">
+                </div>
+            </div>
+            <div class="layui-form-item layui-col-xs12">
+                <label class="layui-form-label">详细地址</label>
                 <div class="layui-input-block">
                     <input type="text" id="address" name="address" placeholder="请输入地址" class="layui-input"/>
                 </div>

member/src/main/resources/template/tpl/member/memberEdit.html

@@ -34,9 +34,14 @@
             </div>
         </div>
         <div class="layui-form-item layui-col-xs12">
-            <label class="layui-form-label">地址</label>
+            <label class="layui-form-label">家庭住址<i class="red">*</i></label>
+            <div class="layui-input-block" id="lockParentSel">
+            </div>
+        </div>
+        <div class="layui-form-item layui-col-xs12">
+            <label class="layui-form-label">详细地址</label>
             <div class="layui-input-block">
-                <input type="text" id="address" name="address" value="{{address}}" placeholder="请输入地址" class="layui-input"/>
+                <input type="text" id="address" name="address" placeholder="请输入地址" class="layui-input" value="{{address}}"/>
             </div>
         </div>
         <div class="layui-form-item layui-col-xs12">

member/src/main/resources/template/tpl/member/memberInfo.html

@@ -41,8 +41,14 @@
             <div class="layui-input-block ver-center" id="enabled">
             </div>
         </div>
-        <div class="layui-form-item layui-col-xs6">
-            <label class="layui-form-label">地址：</label>
+        <div class="layui-form-item layui-col-xs12">
+            <label class="layui-form-label">家庭住址：</label>
+            <div class="layui-input-block ver-center">
+                {{provinceName}} {{cityName}} {{addressAreaName}} {{townshipName}}
+            </div>
+        </div>
+        <div class="layui-form-item layui-col-xs12">
+            <label class="layui-form-label">详细地址：</label>
             <div class="layui-input-block ver-center">
                 {{address}}
             </div>