@{
    ViewBag.Title = "发票明细";
    Layout = "~/Views/Shared/_content.cshtml";
}
<script src="/Scripts/jquery.easyui.min.js" type="text/javascript"></script>
<link href="/Content/themes/blue/easyui.css" rel="stylesheet" />
<link href="/Content/Site.css" rel="stylesheet" />
<script src="/Scripts/common.js"></script>
<link href="/Content/data_grid_list.css" rel="stylesheet" />
<script src="/Scripts/op/jquery.rewrite.js"></script>

<div class="layui-form" style="padding:10px;" id="content">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>发票明细</legend>
    </fieldset>
    <div class="layui-form-item">
        <label class="layui-form-label">客户id：</label>
        <div class="layui-input-inline">
            <span id="ResId" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">客户姓名：</label>
        <div class="layui-input-block">
            <span id="CNameTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">订单列表：</label>
        <div class="layui-input-block">
            <table class="layui-hide" id="tabl1" lay-filter="tabl1"></table>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">订单金额：</label>
        <div class="layui-input-block">
            <span id="OrderPriceTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">退款金额：</label>
        <div class="layui-input-block">
            <span id="RefundPriceTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">发票类型：</label>
        <div class="layui-input-block">
            <span id="InvoiceTypeTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">抬头名称：</label>
        <div class="layui-input-block">
            <span id="InvoiceTitleTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice2 invoice3">
        <label class="layui-form-label">税号：</label>
        <div class="layui-input-block">
            <span id="TaxCodeTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">开户银行：</label>
        <div class="layui-input-block">
            <span id="BankTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">开户账号：</label>
        <div class="layui-input-block">
            <span id="AccountTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">企业地址：</label>
        <div class="layui-input-block">
            <span id="CompanyAddressTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">企业电话：</label>
        <div class="layui-input-block">
            <span id="CompanyTelTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">开票金额：</label>
        <div class="layui-input-block">
            <span id="InvoicePriceTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">电子邮箱：</label>
        <div class="layui-input-block">
            <span id="EmailTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">寄送地址：</label>
        <div class="layui-input-block">
            <span id="SendAddressTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item invoice invoice2 invoice3">
        <label class="layui-form-label">授权委托书：</label>
        <div class="layui-input-block">
            <img class="layui-upload-img layui-form-mid" id="PowerOfAttorneyImg" width="100">
            <a href="" target="_blank" id="PowerOfAttorneyFile" class="layui-form-mid layui-font-blue"></a>
        </div>
    </div>
    <div class="layui-form-item invoice invoice2 invoice3">
        <label class="layui-form-label">营业执照：</label>
        <div class="layui-input-block">
            <img class="layui-upload-img layui-form-mid" id="BusinessLicenseImg" width="100">
            <a href="" target="_blank" id="BusinessLicenseFile" class="layui-form-mid layui-font-blue"></a>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">一般纳税人证明：</label>
        <div class="layui-input-block">
            <img class="layui-upload-img layui-form-mid" id="GeneralTaxPayerImg" width="100">
            <a href="" target="_blank" id="GeneralTaxPayerFile" class="layui-form-mid layui-font-blue"></a>
        </div>
    </div>
    <div class="layui-form-item invoice invoice3">
        <label class="layui-form-label">转帐流水证明：</label>
        <div class="layui-input-block">
            <img class="layui-upload-img layui-form-mid" id="ProofOfFlowImg" width="100">
            <a href="" target="_blank" id="ProofOfFlowFile" class="layui-form-mid layui-font-blue"></a>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">开票状态：</label>
        <div class="layui-input-block">
            <span id="InvoiceStatusTxt" class="layui-form-mid"></span>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">发票：</label>
        <div class="layui-input-block">
            <a id="InvoiceFileTxt" href="#" target="_blank" class="layui-form-mid layui-font-blue"></a>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">开票时间：</label>
        <div class="layui-input-block">
            <span id="InvoiceDateTxt" class="layui-form-mid"></span>
        </div>
    </div>
</div>


<script>
    var selectRow = {};

    layui.use(['table'], function () {
        var table = layui.table;
        var token = $.cookie("AuthToken");

        var imageFile = 'jpg|png|gif|bmp|jpeg';

        //var url = "@ViewBag.ApiUrl/InvoiceService.svc/Detail";
        //var data = { id:@Request.QueryString["id"] }
        //var url = "http://localhost:55047/InvoiceHandler.ashx";
        var url = "@ViewBag.ApiUrl/InvoiceHandler.ashx";
        var data = { action: 'detail', id:@Request.QueryString["id"] }
        $.ajax({
            type: 'get',
            url: url,
            headers: { auth: token },
            data: data,
            dataType: 'json',
            success: function (rep) {
                //console.log(rep);
                $('.invoice').each(function () { $(this).hide(); });
                if (rep.retmsg.InvoiceType == 2) {
                    $('.invoice2').each(function () { $(this).show(); });
                }
                if (rep.retmsg.InvoiceType == 3) {
                    $('.invoice3').each(function () { $(this).show(); });
                }
                $("#id").val(rep.retmsg.Id);
                $("#ResId").html(rep.retmsg.ResId);
                $("#CNameTxt").html(rep.retmsg.CName);
                $("#OrderPriceTxt").html(rep.retmsg.OrderPrice);
                $("#RefundPriceTxt").html(rep.retmsg.RefundPrice);
                $("#InvoiceTypeTxt").html(rep.retmsg.InvoiceTypeName);
                $("#InvoiceTitleTxt").html(rep.retmsg.InvoiceTitle);
                $("#TaxCodeTxt").html(rep.retmsg.TaxCode);
                $("#BankTxt").html(rep.retmsg.Bank);
                $("#AccountTxt").html(rep.retmsg.Account);
                $("#CompanyAddressTxt").html(rep.retmsg.CompanyAddress);
                $("#CompanyTelTxt").html(rep.retmsg.CompanyTel);
                $("#InvoicePriceTxt").html(rep.retmsg.InvoicePrice).addClass('layui-font-red');
                $("#EmailTxt").html(rep.retmsg.Email);
                $("#SendAddressTxt").html(rep.retmsg.SendAddress);
                if (rep.retmsg.PowerOfAttorney != "" && rep.retmsg.PowerOfAttorney != null) {
                    var powerofattorneyType = rep.retmsg.PowerOfAttorney.substring(rep.retmsg.PowerOfAttorney.lastIndexOf(".") + 1, rep.retmsg.PowerOfAttorney.length);
                    if (imageFile.indexOf(powerofattorneyType) != -1) {
                        //找到了，说明是图片
                        $("#PowerOfAttorneyFile").hide();
                        $("#PowerOfAttorneyImg").attr("src", rep.retmsg.PowerOfAttorney).wrap('<a href="' + rep.retmsg.PowerOfAttorney + '" target="_blank"></a>');
                    }
                    else {
                        $("#PowerOfAttorneyImg").hide();
                        $("#PowerOfAttorneyFile").attr('href', rep.retmsg.PowerOfAttorney).text(rep.retmsg.PowerOfAttorney.substring(rep.retmsg.PowerOfAttorney.lastIndexOf("/") + 1, rep.retmsg.PowerOfAttorney.length));
                    }
                }
                if (rep.retmsg.BusinessLicense != "" && rep.retmsg.BusinessLicense != null) {
                    var businesslicenseType = rep.retmsg.BusinessLicense.substring(rep.retmsg.BusinessLicense.lastIndexOf(".") + 1, rep.retmsg.BusinessLicense.length);
                    if (imageFile.indexOf(businesslicenseType) != -1) {
                        $("#BusinessLicenseFile").hide();
                        $("#BusinessLicenseImg").attr("src", rep.retmsg.BusinessLicense).wrap('<a href="' + rep.retmsg.BusinessLicense + '" target="_blank"></a>');
                    }
                    else {
                        $("#BusinessLicenseImg").hide();
                        $("#BusinessLicenseFile").attr('href', rep.retmsg.BusinessLicense).text(rep.retmsg.BusinessLicense.substring(rep.retmsg.BusinessLicense.lastIndexOf("/") + 1, rep.retmsg.BusinessLicense.length));
                    }
                }
                if (rep.retmsg.GeneralTaxPayer != "" && rep.retmsg.GeneralTaxPayer != null) {
                    var generaltaxpayerType = rep.retmsg.GeneralTaxPayer.substring(rep.retmsg.GeneralTaxPayer.lastIndexOf(".") + 1, rep.retmsg.GeneralTaxPayer.length);
                    if (imageFile.indexOf(generaltaxpayerType) != -1) {
                        $("#GeneralTaxPayerFile").hide();
                        $("#GeneralTaxPayerImg").attr("src", rep.retmsg.GeneralTaxPayer).wrap('<a href="' + rep.retmsg.GeneralTaxPayer + '" target="_blank"></a>');
                    }
                    else {
                        $("#GeneralTaxPayerImg").hide();
                        $("#GeneralTaxPayerFile").attr('href', rep.retmsg.GeneralTaxPayer).text(rep.retmsg.GeneralTaxPayer.substring(rep.retmsg.GeneralTaxPayer.lastIndexOf("/") + 1, rep.retmsg.GeneralTaxPayer.length))
                    }
                }
                if (rep.retmsg.ProofOfFlow != "" && rep.retmsg.ProofOfFlow != null) {
                    var proofofflowType = rep.retmsg.ProofOfFlow.substring(rep.retmsg.ProofOfFlow.lastIndexOf(".") + 1, rep.retmsg.ProofOfFlow.length);
                    if (imageFile.indexOf(proofofflowType) != -1) {
                        $("#ProofOfFlowFile").hide();
                        $("#ProofOfFlowImg").attr("src", rep.retmsg.ProofOfFlow).wrap('<a href="' + rep.retmsg.ProofOfFlow + '" target="_blank"></a>');
                    }
                    else {
                        $("#ProofOfFlowImg").hide();
                        $("#ProofOfFlowFile").attr('href', rep.retmsg.ProofOfFlow).text(rep.retmsg.ProofOfFlow.substring(rep.retmsg.ProofOfFlow.lastIndexOf("/") + 1, rep.retmsg.ProofOfFlow.length));
                    }
                }

                $("#InvoiceStatusTxt").html(rep.retmsg.InvoiceStatusName);
                if (rep.retmsg.InvoiceFile != "" && rep.retmsg.InvoiceFile != null) {
                    var pdf = rep.retmsg.InvoiceFile.substring(rep.retmsg.InvoiceFile.lastIndexOf("/") + 1, rep.retmsg.InvoiceFile.length);
                    $("#InvoiceFileTxt").html(pdf).attr('href', rep.retmsg.InvoiceFile);
                }
                $("#InvoiceDateTxt").html(rep.retmsg.InvoiceDate);

                if (rep.retmsg.InvoiceStatus == -2) {
                    //驳回
                    $('#InvoiceStatusTxt').attr("style", "color:#ffb800");
                }
                else if (rep.retmsg.InvoiceStatus == 0) {
                    //开票中
                    $('#InvoiceStatusTxt').attr("style", "color:#01aaed");
                }
                else if (rep.retmsg.InvoiceStatus == 1) {
                    //已开票
                    $('#InvoiceStatusTxt').attr("style", "color:#009688");
                }
                else if (rep.retmsg.InvoiceStatus == 2) {
                    //已作废
                    $('#InvoiceStatusTxt').attr("style","color:#ff5722");
                }

                table.render({
                    id: 'tabl1'
                    , elem: '#tabl1'
                    , limit: 500
                    , cols: [[
                        { field: 'OrderId', title: '订单号' }
                        , { field: 'InvoicePrice', title: '可开票金额', templet: function (res) { return '<div style="color:red">' + res.InvoicePrice + '</div>'; } }
                        , { field: 'Price', title: '付款金额' }
                        , { field: 'RefundPrice', title: '退款金额' }
                        , { field: 'OrderStatusName', title: '订单状态' }
                        , { field: 'ChannelName', title: '事业部' }
                    ]]
                    , data: JSON.parse(rep.retmsg.Orders)
                });
            }
        });
    });
</script>