{% block recommendHouse %}
<!-- 新增房源弹出层 -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <div class="row">
                    <div class="col-md-3">
                        <select id="myModal_cityId" class="form-control">
                            <option value="-1"> 城市</option>
                            {% for item in city %}
                            <option value="{{ item.id }}">{{ item.value }}</option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="col-md-3">
                        <select id="myModal_areaId" class="form-control">
                            <option value = "-1">区域</option>
                        </select>
                    </div>
                    <div class="col-md-3">
                        <select id="myModal_plateId" class="form-control">
                            <option value = "-1">板块</option>
                        </select>
                    </div>
                    <div class="col-md-3">
                        <select id="myModal_price" class="form-control">
                            <option value = "-1">价格</option>
                        </select>
                    </div>
                    <div class="col-md-3">
                        <select id="myModal_buildProperty" class="form-control">
                            <option value = "-1">房型</option>
                            {% for item in buildProperty %}
                            <option value="{{ item.id }}">{{ item.value }}</option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="col-md-3">
                        <select id="myModal_room" class="form-control">
                            <option value = "-1">类型</option>
                            {% for item in room %}
                            <option value="{{ item.id }}">{{ item.value }}</option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="col-md-3">
                        <select  id="myModal_acreage" class="form-control">
                            <option value = "-1">面积</option>
                        </select>
                    </div>
                    <div class="col-md-6">
                        <input type="text" placeholder="请出入楼盘名/地段名搜索" id="myModal_searchtext" class="form-control">
                    </div>
                    <div class="col-md-2">
                        <button type="button" class="button action" id="myModal_search">搜索</button>
                    </div>
                </div>
            </div>
            <div class="modal-body " style="height: 500px;overflow: auto;">
                <ul id="modal_houseList">
                </ul>
            </div>
        </div>
    </div>
</div>

<script>
    function close_modal_houseList(){
        $("#myModal").modal('hide');
    }

    function init_modal_houseList(callback,houseType){
        judgeHouseType(houseType);
        $("#myModal").on("shown.bs.modal",function(){
            setCityArea();
        });

        $("#myModal").find("select").change(function(){
            judgeHouseType(houseType);
        });

        //添加房源中搜索框的搜索
        $("#myModal_search").click(function(){
            judgeHouseType(houseType);
        });

        //将推荐房源模态框中选中的房源显示到界面中
        $("#modal_houseList").on("click",".row",function(){
            callback($(this).data());
        });


    };
    function setCityArea(){
        var acreage =$("#myModal_acreage");
        var price = $("#myModal_price");
        var city = $("#myModal_cityId");
        var area = $("#myModal_areaId");
        var plate = $('#myModal_plateId');
        if($("#baseCity").length>0){
            var cityId = $("#baseCity").val();
            city.val(cityId);
            searchCity(cityId,area);
        }else{
            var cityId = city.val();
        }

        city.change(function(){
            var cityId = city.val();
            var areaId = area.val();
            area.find('option:not(:first-child)').remove();
            plate.find('option:not(:first-child)').remove();
            searchCity(cityId,area);
            //城市面积联动
            searchAcreage(cityId, acreage);
            //城市联动房子价格
            searchTotalPrice(cityId, price);
        });

        area.change(function () {
            var cityId = city.val();
            var areaId = area.val();
            $("#modal_houseList").find(".row").remove();
            plate.find('option:not(:first-child)').remove();
            searchArea(cityId, areaId, plate)
        });
        //城市面积联动
        searchAcreage(cityId, acreage);
        //城市联动房子价格
        searchTotalPrice(cityId, price);
    }

    function judgeHouseType(type){
        if($.isNumeric(type)){
            addList(type);
            return;
        }
        if(type == "newHouse"){
            addList(0);
        }else if(type == "secHandHouse"){
            addList(1);
        }else if(type == "rentHouse"){
            addList(2);
        }
    }

    function addList(houseType){
        var params = {
            action:"searchHouse",
            cityId:$("#myModal_cityId").val(),
            districtId:$("#myModal_areaId").val(),
            plateId:$("#myModal_plateId").val(),
            buildPropertyId:$("#myModal_buildProperty").val(),
            roomId:$("#myModal_room").val(),
            acreage:$("#myModal_acreage").val(),
            totalPrice:$("#myModal_price").val(),
            searchText:$("#myModal_searchtext").val(),
            houseType:houseType
        };
        $.ajax({
            type: "post",
            url: "/tospur/wp-admin/admin-ajax.php",
            data: params,
            success:function(json){
                $("#modal_houseList").find(".row").remove();
                if(json.result){
                    var result = json.result;
                    var urlParams = getUrlParmas();
                    for(var i = 0; i <result.length; i++){
                        var item = result[i];
                        var name = item["name"];
                        var id = item['id'];
                        var imgUrl = item['path'];
                        var row = $("<div>").addClass("row").css("margin-bottom","10px");
                        var left = $("<div>").addClass("col-md-3");
                        var img = $("<img>").attr({"src":imgUrl,"height":90,"width":140,"style":"margin-right:50px"});
                        left.append(img);
                        var right = $("<div>").addClass("col-md-3");
                        var label = $("<label>").append(name);
                        right.append(label);
                        row.append(left).append(right).data(item);
                        if(urlParams["id"]!=id){
                            $("#modal_houseList").append(row);
                        }
                    }
                }
            }
        });
    }
</script>
{% endblock %}