@php
    //$fileDescription=\App\lib\FileTransaction::getFileTypeDescription("document").",".\App\lib\FileTransaction::getFileTypeDescription("image");
    $documentType=\App\lib\FileTransaction::FILE_TYPES["document"];
    $zipType=\App\lib\FileTransaction::FILE_TYPES["zip"]
@endphp
<div class="ibox-content">
    @include('components.dropzoneUpload',[
        'id'=> 'orderDocumentDropzone',
        'url'=> Route('saveApplicationStatusDetails'),
        'params'=> [
            "_token"=>csrf_token(),
            "saveType"=>"3",
            "orderItemId"=>$orderItemID,
            "status" =>$status->statusName
            ],
        'successCallback' => 'orderDocumentUploadSuccess',
        'addedfileCallback' => 'orderDocumentUploadAddedfile',
        'totaluploadprogressCallback' => 'orderDocumentUploadTotaluploadprogress',
        ])
        
    <div class="row mt-20">
        <div class="col-sm-12">
            <div class="attachment">
                <div class="upload-prompt">*文件出现“服务器同步中”提示，表示可以提交内容，不需等待</div>
                <div id="{{$typeLogID ?? 'filecollection'}}">

                    @foreach($status->documents as $document)
                        <div class="file-box documentItem" id="file-box_{{$document->documentID}}">
                            <div class="file count-info" style="@if($document->type == $tempstatus) background:gray @endif">
                            @include('components.itemsDownLoadFiles',[
									'isShowSync'=> 1,
									'id'=> $document->documentID,
									'format'=> $document->format,
									'filePath' => config('locations.customerDocument.asset').$document->filePath,
									'pdfPath'=> config('locations.customerDocument.asset').$document->pdfPath,
									'thumbnailPath'=> ((in_array($document->format,\App\lib\FileTransaction::FILE_TYPES["document"] ))?config('locations.customerDocumentThumbnail.asset'):config('locations.customerDocument.asset')).$document->thumbnailPath,
									'name'=> $document->name,
									'created_at' =>$document->created_at,
									'updated_at' =>$document->updated_at,
									'file_upload_status' => $document->file_upload_status,
								])
                            </div>
                        </div>
                    @endforeach

                </div>
                <div class="clearfix"></div>

                <div class="form-group col-sm-6 upload-remark">
                    <label>备注</label>
                    <textarea id="comment" placeholder="不超过200个汉字！" name="comment" class="form-control" maxlength="200">{{$status->note}}</textarea>
                </div>
                <label class="remark-prompt">不超过200个汉字！</label>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    let _typeLogID = "{{$typeLogID ?? rand(0,9999)}}";
	$(function () {
		$('.galpop-single').galpop();
	});

    $(".downloadimg_size").hide();
	function downloadwhole(fileURL,Newthis){        
        let fileName = $(Newthis).attr("data-name");
		$(Newthis).hide();
		$(Newthis).next("img").show();
		data=Newthis;
        var documentDownloader = new $.DocumentDownloader();
         documentDownloader.onSingleDownloaded="Singledownload";
        documentDownloader.singleDownload(fileURL,fileName,data);
	}
    function Singledownload(status,data){
      setTimeout(funcName,1000);   
      function funcName() {
        $(data).show();
		$(data).next("img").hide();
   }
    }

    function confirmDeleteUserDocument(event,documentID) {
        displayConfirmation('确认删除','确认要删除这个客户文件?','deleteUserDocument(\''+documentID+'\')');
    }

    function savefile(){
        if (document.getElementById("file").files.length === 0) return;
        displayNotification("开始上传", "info", 3000);
        save(3);
        // save using orderDetail blade save
    }

    function deleteUserDocument(documentID) {
        var data = {
            '_token': "{{ csrf_token() }}"
        };
        data['documentID'] = documentID;
        $.ajax({
            type:'POST',
            url:"{{route('deleteStatusDocument')}}",
            data:data,
            success:function(data){
                //getUploadDocumentAjax();
                removeItem(documentID);
            }
        });
    }
    function removeItem(documentID){
        $("#file-box_"+documentID).remove();
    }
    function addUploadedItem(data){
        clearInterval(timer)
	    let fileStatus ="";
        if(data.file_upload_status == 1){
            fileStatus+='<div class="loading-mask" data-id="'+data.id+'" data-type="1">服务器同步中</div>'
        }else if(data.file_upload_status == 2){
            fileStatus+='<div class="loading-mask" data-id="'+data.id+'" data-type="2">同步失败，请删除后重新上传</div>'
        }
        $("#mydropzone").html("");
        var html='<div class="file-box" id="file-box_'+data.id+'">';
        html+='<div class="file count-info"> '+fileStatus;
        html+='    <a><span class="label label-danger pull-right" onclick="confirmDeleteUserDocument(event,\''+data.id+'\')">x</span></a>';
        html+='        <div class="icon fileThumbnail">';
        var office_type = JSON.parse('{!! json_encode($documentType) !!}');
        let zipType = JSON.parse('{!! json_encode($zipType) !!}'); 
        console.log( data.format)
        if(office_type.indexOf(data.format) !== -1){
            html+='     <a class="download" href="javascript:;" onclick="documentItemPreviewPdf(\''+data.id+'\')">';
            html+='         <img class="preview-image" src="'+data.thumbnailURL+'?x-oss-process=image/resize,m_lfit,h_100,w_100" id="'+data.id+'"/>';
        html+='         </a>';
        }else if(zipType.indexOf(data.format) !== -1){
            html+='<div class="packageImage"><img src="{{asset('img/package.png')}}" alt=""></div>';
        }else{
            html+='     <a class="galpop-single" data-galpop-group="gallery" ' +
                        'file-downName="'+data.thumbnailURL+'"'+
                        'file-name="'+data.name+'.'+data.format+'" ' +
                        'href="'+data.thumbnailURL+'"' +
                        '>';
                        html+='         <img class="preview-image" src="'+data.thumbnailURL+'?x-oss-process=image/resize,m_lfit,h_100,w_100" id="'+data.id+'"/>';
        html+='         </a>';

        }
        
        html+='         </div>';
        html+='        <div class="file-name" > <input class="input-file-name" type="text" value="'+data.name+'" data-id="'+data.id+'"></div>';
        html+='    </div>';
        html+='    </div>';
       

        $("#"+_typeLogID).prepend(html);
   
        $('.galpop-single').galpop();
        let _params = [];
        $(".loading-mask").each(function(){
            let _type = $(this).attr("data-type"),
                _id = $(this).attr("data-id");
            if(_type == 1){
                _params.push(_id)
            }
        })
        if(_params.length > 0){
            initUploadInterval(_params.join(","))
        }
    }

    var fileUploadLength = 0;

    function orderDocumentUploadAddedfile(file,callbackData){        
        fileUploadLength ++;  
        var imgLen = $("#{{$typeLogID ?? 'filecollection'}}").find('div.file-box').length;
        if ((imgLen+fileUploadLength) > 10) {
            fileUploadLength --;  
            $("#mydropzone").html("");
            orderDocumentDropzone.showErrorMessage(file.name,"每个专业状态最多只能上传10个文件！");
            orderDocumentDropzone.removeFile(file);
            return false;
        }
    }

    function orderDocumentUploadSuccess(file,responseData,callbackData){
        fileUploadLength--;
        addUploadedItem(responseData.data);
        statusData = null;
    }

    function orderDocumentUploadTotaluploadprogress(progress,callbackData){
        $('#fujian').val(progress);
    }    
	
    setIsReadOnly();

    let currentVal = "";
    $(".attachment").on("focus","input.input-file-name",function () {
        currentVal = $(this).val()
    }).on("blur","input.input-file-name",function () {
        let blurVal = $(this).val();
        let replaceName = $(this).next().find("img.replaceImg_img"),
            galpopSingle = $(this).parents().prev().find("a.galpop-single");
        if(currentVal !== blurVal){
            if(blurVal == ""){
                $(this).val(currentVal);
                return
            }
            let documentID = $(this).attr("data-id");
            $.ajax({
                method: 'post',
                url: '{{route('changeDocumentName')}}',
                data: {
                    _token: '{{csrf_token()}}',
                    clientID: '{{$clientID}}',
                    status: loadingStatusValue,
                    orderItemID: '{{$orderItemID}}',
                    documentID: documentID,
                    newFileName: blurVal
                },
                success: function (data) {

                    if(data == "success"){
                        layer.msg("修改成功");
                        if(replaceName){
                            replaceName.attr("data-name",blurVal)
                        }
                        if(galpopSingle){
                            galpopSingle.attr("file-name",blurVal)
                        }
                    }else{
                        layer.msg("修改失敗");
                        $(this).val(currentVal);
                    }
                }
            });
        }
    })
</script>