 <!--   
 <script src="/static/js/jqueryrotate-master/jQueryRotate.js"></script>
 -->   
<link href="/static/js/viewer-master/dist/viewer.css" rel="stylesheet">
<script src="/static/js/viewer-master/dist/viewer.min.js"></script>

<script type="text/javascript">    
    $(document).ready(function(){   
        var dlgId='#custom-url-modal';
        $(dlgId+' .btn-approve,'+dlgId+' .btn-reject,'+dlgId+' .btn-scrap')
                .unbind('click').bind('click',function(){  
            var btn_ids=$(this).attr('class').split(' ');
            var action='';
            var msg='';
            if(btn_ids.indexOf("btn-scrap")>-1){
                action='scrap';
                msg='申请已作废';
            }else{
                if(btn_ids.indexOf("btn-reject")>-1){
                    action='reject';
                    msg="申请已驳回";
                }else{
                    action='approve';
                    msg="申请已通过申核";
                }
            };
            var app_id=$(dlgId+' .app_id').val();
            $(dlgId).modal('hide');
            $.ajax({
                type:'POST',
                url:'{{request.path}}',
                dataType:'json',
                data:{"id":app_id,"action":action},
                success: function(data) {  
                    if(data.e!=''){
                        toastr.error(data.e); 
                    }else{                        
                        toastr.success(msg);
                        $('#tb_application tbody a[app_id="'+app_id+'"]').closest('tr').find('td:nth-child(10)').text(data.status);                        
                    };
                },
                beforeSend: function (xhr, settings) {                    
                        xhr.setRequestHeader("X-CSRFToken", '{{csrf_token}}');                    
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    alert('连接服务器失败');
                    return;
                }  
            });
        });


        //var $image = $('#image');
        //$image.viewer({
        //    inline: true,
        //    viewed: function() {
        //        $image.viewer('zoomTo', 1);
        //    }
        //});
        // Get the Viewer.js instance after initialized
        //var viewer = $image.data('viewer');
        // View a list of images
        $('#images').viewer();



        //$('#bg-modal').on('click','.btn-rotate-right',function(){
        //    var p=$(this).closest('div'); 
        //    $(p).find('.img-invoice').rotate(90);
        //});
        //$('#bg-modal').on('click','.btn-rotate-left',function(){
        //    var p=$(this).closest('div'); 
        //    $(p).find('.img-invoice').rotate(-90);
        //});
    });
</script>




<div class="row">
    <input class='app_id' type='hidden' value='{{id}}' />
    <div style="display: flex;padding: 1rem;font-size: 1.4rem;border-bottom: 1px solid #d5d5d5;">
        {% ifequal payment_method 1 %}
            <div>
                收款人实名: <b>{{payee_name}}</b> 
            </div>
            <div style="margin-left:1.5rem;">
                金额: ￥ <b>{{amount}}</b> 
            </div>
            <div style="margin-left:2rem;">
                申请人微信: <img src="{{wx_headimgurl}}" style="width:25px;height:25px;" />
            </div>
            <div style="margin-left:0.5rem;">
                <b>{{wx_nickname}}</b>
            </div>
        {% else %}
            <div>
                收款行: <b>{{bank_name}}</b> 
            </div>
            <div style="margin-left:1.5rem;">
                帐号: <b>{{bank_account}}</b>
            </div>
            <div style="margin-left:2rem;">
                收款人: <b>{{payee}}</b>
            </div>
            <div style="margin-left:0.5rem;">            
                金额：￥ <b>{{amount}}</b> 
            </div>
        {% endifequal %}
        <div style="margin-left:1.5rem;">
            发票图片张数: {{images | length}}
        </div>
    </div>
   
    <div class='row' id='images'>
        {% for img in images %}            
            <img class='img-invoice' src="{{img.image}}"
            style='max-height:500px;max-width:300px;margin:10px;cursor:pointer;'></img>               
        {% endfor %}        
    </div>

</div>
