jucai/public/themes/default/views/mobile/app/company/com_img.blade.php

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

@push('meta')

@endpush

@push('css')
    <link rel="stylesheet" href="{{theme_asset('mobile/css/company.css')}}">
@endpush

@push('js')

@endpush
@section('content')
    <div class="split-block-title">
        据说上传了企业风采的企业都招到了优秀人才哦<br>
        800KB以内,最多8张,图片格式:jpg、gif、bmp、png
    </div>
    <div class="J_imgWrap <empty name='company_img'>qs-hidden</empty>">
        <div class="split-block"></div>
        <div class="com_img">
            <div class="imgul">
                <div class="imgli-group">
                    @if(!$imgList->isEmpty())
                        @foreach($imgList as $key=>$val)
                            <div class="imgli"><img src="{{upload_asset($val->image)}} "><span class="del_img" data-id="{{ $val->id }}"></span></div>
                        @endforeach
                    @endif
                </div>
                <div class="J_add_company_img imgadd"><input type="file" id="browseFile" class="browseFile"></div>
            </div>
            <div class="clear"></div>
        </div>
    </div>
    @if($imgList->isEmpty())
        <div id="J_imgWrapOrg" class="list_height plist-txt notarrow">
            <div class="pic"></div>
            <div class="tit font14">企业风采</div>
            <div class="describe com_certificate_add_btn font13">
                <div class="J_add_company_img qs-btn qs-btn-inline qs-btn-medium qs-btn-green mt125">
                    上传图片
                    <input type="file" id="browse" class="browseFile">
                </div>
            </div>
            <div class="arrow"></div>
            <div class="clear"></div>
        </div>
    @endif
@endsection
@section('script')
    <script src="{{ theme_asset('mobile/js/mobileBUGFix.mini.js') }}"></script>
    <script src="{{ theme_asset('mobile/js/LocalResizeIMG.js') }}"></script>
    <script src="{{ theme_asset('mobile/js/nprogress.js') }}"></script>
    <script>
        var comid = "{{ auth('web-company')->user()->id }}";
        $(".com_img").on("click",".del_img",function () {
            var $thisImg = $(this).parent();
            var imgid = $(this).data('id');
            var dialog = new QSpopout("删除企业风采");
            dialog.setContent("删除后将无法恢复，您确定要删除该图片吗？");
            dialog.getPrimaryBtn().on("click",function () {
                $.ajax({
                    type: "POST",
                    url:"{{ route($sub_site.'mobile.firm.com.del.img') }}",
                    data:{id:imgid,_token: "{{ csrf_token() }}"},
                    success:function (res) {
                        if(res.status==1){
                            $thisImg.remove();
                            qsToast({type:1,context:res.msg});

                        }else{
                            qsToast({type:2,context:res.msg});
                        }
                    }
                })

            })
            dialog.show();
        })
        $('#browseFile,#browse').localResizeIMG({
            width: 300,
            quality: 1,
            success: function (result) {
                var submitData={
                    images:result.clearBase64,
                    company_id:comid,
                    _token:"{{csrf_token()}}"
                };
                if ($('.imgli').length >= 8) {
                    qsToast({context: '最多可上传 8 张'});
                    return false;
                }
                NProgress.start();
                $.ajax({
                    type: "POST",
                    url: "{{route($sub_site.'mobile.firm.com.img.save')}}",
                    data: submitData,
                    dataType:"json",
                    success: function(result){
                        NProgress.done();
                        if(result.status == 1){
                            $('.imgli-group').append('<div class="imgli"><img src="'+result.path+'"><span class="del_img" data-id="'+result.imgId+'"></span></div>');
                            $('.J_imgWrap').removeClass('qs-hidden');
                            $('#J_imgWrapOrg').remove();
                            qsToast({type:1,context:result.msg});
                        }else{
                            qsToast({type:2,context:result.msg});
                        }
                    },
                    complete :function(XMLHttpRequest, textStatus){},
                    error:function(XMLHttpRequest, textStatus, errorThrown){ //上传失败
                        qsToast({type:2,context: '图片上传失败！'});
                    }
                });
            }
        });
    </script>
@endsection