@extends('mobile.module.layouts.content')
@push('meta')

@endpush

@push('css')
    <link href="{{ theme_asset('mobile/css/common.css') }}" rel="stylesheet">
    <link href="{{ theme_asset('mobile/css/jobs.css') }}" rel="stylesheet">
    <style>
        .drop_content a{color: #666666;text-decoration: none;}
        .qspageso {display:block;position:static;}
        .qspageso .topbg .soselect {left: .35rem;}
        .qspageso .topbg .soimput {margin-left:0;width: 5.5rem;}
        .qspageso .topbg .choose-s-type-group {left:auto;height: 1.6rem;}
        .job-list-item .info .line-two .salary {width: 40%;}
        .job-list-item .info .line-two .category {width: 40%;}
        .alw-layer {background-image:none;}
        .alw-layer img{width: 70%;margin: 0 auto;margin-top: 200px;display: block;}
    </style>
@endpush

@push('js')

@endpush

@section('content')

    <img src="https://www.jucai.gov.cn/storage/admin/images/n0Ikan703LJK4bNGzT58JsMf3amoRKDuv5wlqUgQ.jpeg" width="100%" />
    <div class="qspageso link_gray6">
        <div class="topbg">
            <input value="@if(array_get($params, 'keyword')){{$params['keyword']}}@endif" type="text" class="soimput" id="J_soinput" placeholder="请输入关键字">
            <div class="soselect qs-relative for-event">
            <span class="for-type-txt">
                @if(array_get($params, 'key_name'))
                    @if($params['key_name'] == 'job_name')
                        搜职位
                    @else
                        搜公司
                    @endif
                @else
                    搜职位
                @endif
            </span>
                <input type="hidden" class="for-type-code" id="key_name" name="key_name" value="@if(array_get($params, 'key_name')){{$params['key_name']}}@else {{'job_name'}} @endif">
            </div>

            <div class="so-close js-so-close"></div>

            <div class="rightbtn-so for-event" id="J_submit">搜索</div>

            <div class="choose-s-type-group">
                <div class="choose-s-type-cell qs-relative">
                    <div class="qs-center qs-relative">
                        <div class="choose-s-type-list font14" data-code="job_name" data-title="职位">职位</div>
                    </div>
                    <div class="qs-center">
                        <div class="choose-s-type-list sl2 font14" data-code="company_name" data-title="公司">公司</div>
                    </div>
                </div>
            </div>
            <div class="search_ajax"><ul id="search_mes"></ul></div>
        </div>
    </div>

    {{--过滤条件--}}
    <div class="filter-group x2 filter-outer">
        <div id="f-mask"></div>
        <div class="filter-outer">
            <div class="filter-list js-filter" data-tag="1">
                <div class="filter-cell">
                    <div class="filter-cell-txt f-normal-txt-eduction">
                        @if(array_get($params,'education')=='')
                            学历要求
                        @else
                            {{ $categories['AIX_education'][$params['education']]['demand'] }}
                        @endif
                    </div>
                </div>
            </div>
            <div class="filter-list js-filter" data-tag="2">
                <div class="filter-cell">
                    <div class="filter-cell-txt f-normal-txt-experience">
                        @if(array_get($params,'experience')=='')
                            经验
                        @else
                            {{ $categories['AIX_experience'][$params['experience']]['demand'] }}
                        @endif
                    </div>
                </div>
            </div>

            <div class="clear"></div>

            <div class="qs-actionmore"></div>

            <form id="searchForm" action="" method="get">
                <input type="hidden" class="" name="keyword" value="@if(array_get($params, 'keyword')){{$params['keyword']}}@endif">
                <input type="hidden" class="" name="key_name" value="@if(array_get($params, 'key_name')){{$params['key_name']}}@endif">
                <input type="hidden" class="f-normal-code-education" name="education" value="{{$params['education'] or ''}}">
                <input type="hidden" class="f-normal-code-experience" name="experience" value="{{$params['experience'] or ''}}">
            </form>
        </div>
        <div class="con-filter">
            <div class="f-box f-box-city"></div>
            <div class="f-box f-box-wage">
                <div class="f-box-inner">
                    @if($categories['AIX_education'])
                        @foreach($categories['AIX_education'] as $k=>$v)
                            <li>
                                <a class="f-item f-item-normal @if(array_get($params,'education')==$v['id']) select @endif" href="javascript:;" data-type="education" data-code="{{$v['id']}}" data-title="{{$v['demand']}}">
                                    {{$v['demand']}}
                                </a>
                            </li>
                        @endforeach
                    @endif
                </div>
                <div class="f-btn-submit qs-center">
                    <div onclick="window.location='{{route("mobile.quanzhida",array_merge($params, array("education"=>"")))}}';" class="qs-btn qs-btn-inline qs-btn-medium qs-btn-orange">
                        不限
                    </div>
                </div>
            </div>
            <div class="f-box f-box-experience">
                <div class="f-box-inner">
                    @if($categories['AIX_experience'])
                        @foreach($categories['AIX_experience'] as $k=>$v)
                            <li>
                                <a class="f-item f-item-normal @if(array_get($params,'experience')==$v['id']) select @endif" href="javascript:;" data-type="experience" data-code="{{$v['id']}}" data-title="{{$v['demand']}}">
                                    {{$v['demand']}}
                                </a>
                            </li>
                        @endforeach
                    @endif
                </div>
                <div class="f-btn-submit qs-center">
                    <div onclick="window.location='{{route($sub_site."mobile.quanzhida",array_merge($params, array("experience"=>"")))}}';" class="qs-btn qs-btn-inline qs-btn-medium qs-btn-orange">
                        不限
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{--职位列表--}}
    <div class="drop_content">
        <div class="add_data">
            @include('mobile.app.active.ajax.quanzhida_list')
        </div>
    </div>

    <div class="alw-layer">
        <img src="{{theme_asset('mobile/images/quanzhida/qrcode_quanzhida.png')}}" alt="">
    </div>

    <script type="text/javascript" src="{{theme_asset('mobile/js/QSfilter.js')}}"></script>
    <script type="text/javascript" src="{{theme_asset('mobile/js/qsCategory.js')}}"></script>
    <script type="text/javascript" charset="utf-8" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script src="{{ theme_asset('mobile/js/dropload.min.js') }}"></script>
    <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak={{subsite_config('aix.system.map.map.map_ak')}}&s=1"></script>
@endsection

@section('script')
    <script>
        $('.topbg .soselect').on('click', function () {
            $('.topbg').toggleClass('for-type');
        })
        $('.choose-s-type-cell .qs-center').on('click', function () {
            var stypeCode = $(this).find('.choose-s-type-list').data('code');
            var stypeTitle = $(this).find('.choose-s-type-list').data('title');
            $('.for-type-code').val(stypeCode);
            $('.for-type-txt').text('搜' + stypeTitle);
            $('.topbg').toggleClass('for-type');
        });

        $('#J_submit').click(function(){
            var keyword = $('#J_soinput').val();
            var key_name = $('#key_name').val();
            location.href = '{{url('mobile/active/quanzhida')}}?key_name=' + key_name + '&keyword=' + keyword;
        });

        // 更多列表左右切换
        $('.js-more-l').on('click', function () {
            var targetId = $(this).data('id');
            $('.f-box-more').toggleClass('qs-actionsheet-toggle-left');
            $('#' + targetId).toggleClass('qs-actionsheet-toggle');
        })
        $('.f-more-back-btn').on('click', function () { // 更多列表切换返回
            $('.f-box-more').toggleClass('qs-actionsheet-toggle-left');
            $('.f-more-content').removeClass('qs-actionsheet-toggle');
        })
        $('.f-more-back-a').on('click', function () { // 更多列表项点击
            var thisType = $(this).data('type');
            var thisTitle = $(this).data('title');
            var thisCode = $(this).data('code');
            $('.f-more-l-code-' + thisType).val(thisCode);
            $('.f-more-l-txt-' + thisType).text(thisTitle);
            $('.f-box-more').toggleClass('qs-actionsheet-toggle-left');
            $('.f-more-content').removeClass('qs-actionsheet-toggle');
        })
        // 除更多和读取缓存之外的下拉列表
        $('.f-item-normal').on('click', function () {
            var thisType = $(this).data('type');
            var thisTitle = $(this).data('title');
            var thisCode = $(this).data('code');
            $('.f-normal-code-' + thisType).val(thisCode);
            $('.f-normal-txt-' + thisType).text(thisTitle);
            $('body').removeClass('filter-fixed');
            $('.f-box-' + thisType).addClass('qs-hidden');
            $('.js-filter').removeClass('active');
            $('#f-mask').hide();
            goPage();
        })
        // 清空已选分类
        $('.js-clearjob-jobcategory').on('click', function () {
            $('.qs-recover-code-job').val('');
            goPage();
        })
        // 跳转方法
        function goPage() {
            var toSearchPage = "{{route($sub_site.'mobile.quanzhida')}}";
            window.location.href = toSearchPage + '?'+$('#searchForm').serialize();
        }
        // 点击筛选
        $('#f-do-filter').on('click', function () {
            goPage();
        });
        $('.js-filter').on('click', function () {
            $('.f-more-content').removeClass('qs-actionsheet-toggle');
            $('.f-box-more').removeClass('qs-actionsheet-toggle-left');
            var filter = new QSfilter($(this));
            document.getElementById('f-mask').ontouchstart = function(e){ e.preventDefault(); }
        });
        /* 显示分享 覆盖层 */
        function share() {
            $(".alw-layer").show();
        }
        //分享按钮
        $(".alw-layer").on("click", function() {
            $(this).hide();
        });

        $(function(){
            var page = 1;
            $('.drop_content').dropload({
                scrollArea : window,
                domUp : {
                    domClass   : 'dropload-up',
                    domRefresh : '<div class="dropload-refresh">加载中...</div>',
                    domUpdate  : '<div class="dropload-update">加载中...</div>',
                    domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>'
                },
                domDown : {
                    domClass   : 'dropload-down',
                    domRefresh : '<div class="dropload-refresh">加载中...</div>',
                    domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>',
                    domNoData  : '<div class="dropload-noData">没有更多数据~~</div>'
                },
                loadUpFn : function(me){
                    page = 1;
                    @if($params)
                        var mobile_url ='{{ url($current_url) }}&page='+page;
                    @else
                        var mobile_url ='{{ url($current_url) }}?page='+page;
                    @endif
                    mobile_url = mobile_url.replace(/&amp;/g,"&");
                    $.ajax({
                        type: 'GET',
                        url: mobile_url,
                        dataType: 'json',
                        success: function(result){
                            if (result.status ==1) {
                                $('.add_data').html(result.data);
                            } else {
                                me.lock();
                                me.noData();
                            }
                            me.resetload();
                        },
                        error: function(xhr, type){
                            me.resetload();
                        }
                    });
                },
                loadDownFn : function(me){
                    page++;
                            @if($params)
                    var mobile_url ='{{ url($current_url) }}&page='+page;
                            @else
                    var mobile_url ='{{ url($current_url) }}?page='+page;
                    @endif
                        mobile_url = mobile_url.replace(/&amp;/g,"&");
                    $.ajax({
                        type: 'GET',
                        url: mobile_url,
                        dataType: 'json',
                        success: function(result){
                            if (result.status ==1) {
                                $('.add_data').append(result.data);
                            } else {
                                me.lock();
                                me.noData();
                            }
                            me.resetload();
                        },
                        error: function(xhr, type){
                            me.resetload();
                        }
                    });
                },
                threshold : 50
            });
        });
    </script>
@endsection