yf-admin-ui/src/views/iosBasicData/fininvoicesOutput/fininvoicesDetails.vue

<template>
    <div class="borderless" v-loading="pageLoading">
        <div class="customer-head">
            <div class="customer-back">
                <el-button type="danger" style="border: none;background: none;color: red" icon="el-icon-arrow-left"
                    @click="backToList">返回列表
                </el-button>
            </div>
            <div class="add-customer-btn">
                <el-button type="success" size="small" :disabled="!form.id" plain @click="newbillFun">新建发票
                </el-button>
                <el-button size="small" type="warning" plain style="margin-right: 8px" :disabled="!form.id || editPower"
                    v-if="form.status == 3" :loading="saveLoading" @click="fininvoicesRevokeFinInvoicesfun">撤销开票
                </el-button>
                <el-button size="small" type="success" plain style="margin-right: 8px" :disabled="!form.id || editPower"
                    v-else :loading="saveLoading" @click="submit('开票')">确认开票
                </el-button>
                <el-button size="small" type="primary" :disabled="statusType || editPower" style="margin-right: 8px"
                    v-if="editSave" :loading="saveLoading" @click="editHandle">编 辑
                </el-button>
                <el-button size="small" type="primary" :disabled="statusType" style="margin-right: 8px" v-else
                    :loading="saveLoading" @click="editCustomer()">保 存
                </el-button>
            </div>
        </div>
        <div style="margin: 55px 5px 0px 5px;'">
            <el-tabs type="border-card">
                <el-tab-pane label="基础信息">
                    <el-form :model="form" ref="form" :rules="rules" label-width="90px" class="demo-ruleForm">
                        <trade-card title="基础信息" styleIocup="color:#4b9fe9">
                            <el-row>
                                <el-col :span="10">
                                    <div class="flexBoxLeft">
                                        <el-row>
                                            <el-col :span="12">
                                                <el-form-item label="所属公司" prop="branchName">
                                                    <dic-select v-model="form.branchName" placeholder="所属公司" key="id"
                                                        label="deptName" url="/blade-system/dept/top-list"
                                                        :filterable="true" :remote="true" dataName="deptName"
                                                        :disabled="editSave || !(roleName.includes('admin') || roleName.includes('总部')) || tableData.length"
                                                        @selectChange="dicChange('branchName', $event)"></dic-select>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="发票号码" prop="invoiceNo">
                                                    <el-input style="width: 100%;" v-model="form.invoiceNo" size="small"
                                                        autocomplete="off" :disabled="true" clearable
                                                        placeholder="发票号码">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="开票日期" prop="invoiceDate">
                                                    <el-date-picker v-model="form.invoiceDate" clearable
                                                        style="width: 100%;" type="date" size="small"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        value-format="yyyy-MM-dd" placeholder="请选择开票日期">
                                                    </el-date-picker>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="开票单位" prop="invCorpCnName">
                                                    <search-query :datalist="invCorpData"
                                                        :selectValue="form.invCorpCnName" :clearable="true"
                                                        :disabled="editSave || !form.corpId || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" :remote="true" :filterable="true"
                                                        placeholder="请选择开票单位"
                                                        :forParameter="{ key: 'id', label: 'invoiceHeader', value: 'id' }"
                                                        @corpChange="corpChange($event, 'invCorpCnName')"
                                                        @remoteMethod="invcorpsinvoiceheaderListfun"
                                                        @corpFocus="invcorpsinvoiceheaderListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="收/付" prop="dc">
                                                    <el-select v-model="form.dc" placeholder="请选择"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        size="small">
                                                        <el-option v-for="item in options" :key="item.value"
                                                            :label="item.label" :value="item.value">
                                                        </el-option>
                                                    </el-select>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="税号" prop="invCorpTaxNo">
                                                    <el-input style="width: 100%;" v-model="form.invCorpTaxNo"
                                                        size="small" autocomplete="off" :disabled="true" clearable
                                                        placeholder="请输入税号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="美元银行" prop="invCorpAccountBankUsd">
                                                    <el-input style="width: 100%;" v-model="form.invCorpAccountBankUsd"
                                                        size="small" autocomplete="off" :disabled="true" clearable
                                                        placeholder="请输入美元银行">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="美元账户" prop="invCorpAccountNoUsd">
                                                    <el-input style="width: 100%;" v-model="form.invCorpAccountNoUsd"
                                                        size="small" autocomplete="off" :disabled="true" clearable
                                                        placeholder="请输入美元账户">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col> <el-col :span="12">
                                                <el-form-item label="发票币种" prop="invCurCode">
                                                    <search-query :datalist="invCurCodeData"
                                                        :selectValue="form.invCurCode" :filterable="true"
                                                        :clearable="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" placeholder="请选择发票币种"
                                                        :forParameter="{ key: 'id', label: 'code', value: 'code' }"
                                                        @corpChange="corpChange($event, 'invCurCode')"
                                                        @corpFocus="invCurCodeRateListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="分单号" prop="hblno">
                                                    <el-input style="width: 100%;" v-model="form.hblno" size="small"
                                                        autocomplete="off" :disabled="editSave || tableData.length"
                                                        clearable placeholder="请输入分单号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                        </el-row>
                                        <el-row v-show="showForm">
                                            <el-col :span="12">
                                                <el-form-item label="人民币银行" prop="invCorpAccountBankCny">
                                                    <el-input style="width: 100%;" v-model="form.invCorpAccountBankCny"
                                                        size="small" autocomplete="off" :disabled="true" clearable
                                                        placeholder="请输入美元银行">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="人民币账户" prop="invCorpAccountNoCny">
                                                    <el-input style="width: 100%;" v-model="form.invCorpAccountNoCny"
                                                        size="small" autocomplete="off" :disabled="true" clearable
                                                        placeholder="请输入人民币账户">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="船名/航次" prop="vesselVoyno">
                                                    <el-input style="width: 100%;" v-model="form.vesselVoyno"
                                                        size="small" autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入船名/航次">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="开航日期" prop="etd">
                                                    <el-date-picker v-model="form.etd" clearable style="width: 100%;"
                                                        type="date" size="small"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        value-format="yyyy-MM-dd HH:mm:ss" placeholder="请输入开航日期">
                                                    </el-date-picker>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="装货港" prop="pol">
                                                    <search-query :datalist="polData" :selectValue="form.pol"
                                                        :filterable="true" :clearable="true" :remote="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" placeholder="请选择装货港"
                                                        :forParameter="{ key: 'id', label: 'enName', value: 'enName' }"
                                                        @corpChange="corpChange($event, 'pol')"
                                                        @remoteMethod="polBportsListfun" @corpFocus="polBportsListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="卸货港" prop="pod">
                                                    <search-query :datalist="podData" :selectValue="form.pod"
                                                        :filterable="true" :clearable="true" :remote="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" placeholder="请选择卸货港"
                                                        :forParameter="{ key: 'id', label: 'enName', value: 'enName' }"
                                                        @corpChange="corpChange($event, 'pod')"
                                                        @remoteMethod="podBportsListfun" @corpFocus="podBportsListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="目的地" prop="destination">
                                                    <search-query :datalist="destinationData"
                                                        :selectValue="form.destination" :filterable="true"
                                                        :clearable="true" :remote="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" placeholder="请选择目的地"
                                                        :forParameter="{ key: 'id', label: 'enName', value: 'enName' }"
                                                        @corpChange="corpChange($event, 'destination')"
                                                        @remoteMethod="destinationBportsListfun"
                                                        @corpFocus="destinationBportsListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="12">
                                                <el-form-item label="箱型箱量" prop="containers">
                                                    <el-input style="width: 100%;" v-model="form.containers"
                                                        size="small" autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入箱型箱量">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                        </el-row>
                                    </div>
                                </el-col>
                                <el-col :span="14">
                                    <div class="flexBoxRight">
                                        <!--<el-row>-->
                                        <!--    <el-col :span="4">-->
                                        <!--        <el-switch-->
                                        <!--            v-model="form.stlMode"-->
                                        <!--            active-value="1"-->
                                        <!--            inactive-value="0"-->
                                        <!--            active-color="#66dd7a"-->
                                        <!--            inactive-color="#4ea6ea"-->
                                        <!--            active-text="票结"-->
                                        <!--            inactive-text="月结">-->
                                        <!--        </el-switch>-->
                                        <!--    </el-col>-->
                                        <!--    <el-col :span="6">-->
                                        <!--        <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"-->
                                        <!--                     :disabled="editSave"-->
                                        <!--                     v-model="form.isDk">整票(不列费用明细)-->
                                        <!--        </el-checkbox>-->
                                        <!--    </el-col>-->
                                        <!--    <el-col :span="5">-->
                                        <!--        <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"-->
                                        <!--                     :disabled="editSave"-->
                                        <!--                     v-model="form.isRp">只提取开票费用-->
                                        <!--        </el-checkbox>-->
                                        <!--    </el-col>-->
                                        <!--    <el-col :span="3">-->
                                        <!--        <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"-->
                                        <!--                     :disabled="editSave"-->
                                        <!--                     v-model="form.isExportMblno">主单号-->
                                        <!--        </el-checkbox>-->
                                        <!--    </el-col>-->
                                        <!--    <el-col :span="3">-->
                                        <!--        <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"-->
                                        <!--                     :disabled="editSave"-->
                                        <!--                     v-model="form.isExportVslvoy">船名航次-->
                                        <!--        </el-checkbox>-->
                                        <!--    </el-col>-->
                                        <!--    <el-col :span="3">-->
                                        <!--        <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"-->
                                        <!--                     :disabled="editSave"-->
                                        <!--                     v-model="form.isExportHblno">分单号-->
                                        <!--        </el-checkbox>-->
                                        <!--    </el-col>-->
                                        <!--</el-row>-->
                                        <el-row>
                                            <el-col :span="8">
                                                <el-form-item label="结算单位" prop="corpCnName">
                                                    <search-query :datalist="corpData" :selectValue="form.corpCnName"
                                                        :clearable="true" :disabled="editSave || tableData.length"
                                                        :buttonIf="false" :remote="true" :filterable="true"
                                                        placeholder="请输入结算单位"
                                                        :forParameter="{ key: 'id', label: 'cnName', value: 'cnName' }"
                                                        @corpChange="corpChange($event, 'corpCnName')"
                                                        @remoteMethod="corpBcorpsListfun"
                                                        @corpFocus="corpBcorpsListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="费用名称" prop="feeCnName">
                                                    <dic-select v-model="form.feeCnName" placeholder="费用名称" key="id"
                                                        label="cnName" url="/blade-los/bfees/listAll" :filterable="true"
                                                        :multiple="true" :collapseTags="true"
                                                        :disabled="editSave || tableData.length"></dic-select>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="税控发票号" prop="taxInvoiceNo">
                                                    <el-input style="width: 100%;" v-model="form.taxInvoiceNo"
                                                        size="small" autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入税控发票号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="业务开始日期" prop="accountDateFrom">
                                                    <el-date-picker v-model="form.accountDateFrom" clearable
                                                        style="width: 100%;" type="date" size="small"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        value-format="yyyy-MM-dd" placeholder="选择业务日期">
                                                    </el-date-picker>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="业务结束日期" prop="accountDateTo">
                                                    <el-date-picker v-model="form.accountDateTo" clearable
                                                        style="width: 100%;" type="date" size="small"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        value-format="yyyy-MM-dd" placeholder="选择业务日期">
                                                    </el-date-picker>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="发票汇率" prop="exrate">
                                                    <el-input style="width: 100%;" v-model="form.exrate" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入发票汇率">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="16">
                                                <el-form-item label="业务编号" prop="businessNo">
                                                    <el-input style="width: 100%;" v-model="form.businessNo"
                                                        size="small" autocomplete="off"
                                                        :disabled="editSave || tableData.length" clearable
                                                        placeholder="请输入业务编号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="发票类型" prop="invType">
                                                    <search-query :datalist="invTypeData" :selectValue="form.invType"
                                                        :clearable="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" placeholder="请输入发票类型"
                                                        :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictKey' }"
                                                        @corpChange="corpChange($event, 'invType')"
                                                        @corpFocus="invTypeWorkDictsfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="16">
                                                <el-form-item label="主单编号" prop="mblno">
                                                    <el-input style="width: 100%;" v-model="form.mblno" size="small"
                                                        autocomplete="off" :disabled="editSave || tableData.length"
                                                        clearable placeholder="请输入主单编号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="对账单号" prop="checkNo">
                                                    <el-input style="width: 100%;" v-model="form.checkNo" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入对账单号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                        </el-row>
                                        <el-row v-show="showForm">
                                            <el-col :span="16">
                                                <el-form-item label="分单编号" prop="hblno">
                                                    <el-input style="width: 100%;" v-model="form.hblno" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入分单编号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="申请单号" prop="applyNo">
                                                    <el-input style="width: 100%;" v-model="form.applyNo" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入申请单号">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="BOOK NO" prop="bookingNo">
                                                    <el-input style="width: 100%;" v-model="form.bookingNo" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入BOOK NO">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="业务类型" prop="businessTypes">
                                                    <search-query :datalist="businessTypesData"
                                                        :selectValue="form.businessTypes" :clearable="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :buttonIf="false" :multiple="true" :collapseTags="true"
                                                        placeholder="请输入业务类型"
                                                        @corpChange="corpChange($event, 'businessTypes')">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="税率(%)" prop="taxRate">
                                                    <el-input style="width: 100%;" v-model="form.taxRate" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入税率">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="8">
                                                <el-form-item label="选择币种" prop="curCode">
                                                    <search-query :datalist="curData" :selectValue="form.curCode"
                                                        :filterable="true" :clearable="true"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        :remote="true" :buttonIf="false" placeholder="请输入选择币种"
                                                        :forParameter="{ key: 'id', label: 'code', value: 'code' }"
                                                        @remoteMethod="getRateListfun"
                                                        @corpChange="corpChange($event, 'curCode')"
                                                        @corpFocus="getRateListfun">
                                                    </search-query>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="16">
                                                <el-form-item label="邮箱" prop="yx">
                                                    <el-input style="width: 100%;" v-model="form.yx" size="small"
                                                        autocomplete="off"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        clearable placeholder="请输入邮箱">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="24">
                                                <el-form-item label="全电发票:" prop="elecRemarks">
                                                    <el-input style="width: 100%;" v-model="form.elecRemarks"
                                                        size="small"
                                                        :disabled="editSave || (tableData.length && invoicestype != 1)"
                                                        autocomplete="off" type="textarea" clearable
                                                        placeholder="请输入全电发票备注">
                                                    </el-input>
                                                </el-form-item>
                                            </el-col>
                                        </el-row>
                                    </div>
                                </el-col>
                            </el-row>
                            <div style="display: flex;justify-content:space-between;align-items: center;">
                                <div style="width: 40%;display: flex;justify-content:space-between;">
                                    <span>开票本币:{{ form.amountCny ? form.amountCny : '0.00' }}</span>
                                    <span>开票外币:{{ form.amountUsd ? form.amountUsd : '0.00' }}</span>
                                    <span>开票本币合计:{{ form.amountLoc ? form.amountLoc : '0.00' }}</span>
                                </div>
                                <div style="width: 60%;display: flex;justify-content:flex-end;align-items: center;">
                                    <el-checkbox style="margin-left: 10%" size="medium" :true-label="1" :false-label="0"
                                        :disabled="editSave" v-model="form.isExchangeToCny">转换成人民币
                                    </el-checkbox>
                                    <el-checkbox v-model="appendType" :disabled="editSave" false-label="检索"
                                        true-label="追加">追加</el-checkbox>
                                    <el-button type="primary" size="small"
                                        :disabled="editSave || (tableData.length > 0 && appendType == '检索')" plain
                                        @click="finstlbillslistAccBillV1fun(appendType)">提取费用
                                    </el-button>
                                    <el-button size="small" :disabled="tableData.length > 0" @click="ResetFilter">重置条件
                                    </el-button>
                                    <el-button icon="el-icon-arrow-down" type="text" size="small" v-if="!showForm"
                                        @click="showForm = true">开展</el-button>
                                    <el-button icon="el-icon-arrow-up" type="text" size="small" v-if="showForm"
                                        @click="showForm = false">收缩</el-button>
                                </div>
                            </div>
                        </trade-card>

                        <el-card style="margin-top: 10px">
                            <el-tabs v-model="detailTabs" type="card" @tab-click="handleClick">
                                <el-tab-pane label="费用明细" name="first">

                                    <fininvoicesitems ref="fininvoicesitems" :tableData="tableData"
                                        :handleSelectionData="handleSelectionData" :brfalse="!editSave"
                                        :invoicestype="invoicestype" :form="form"
                                        @handleSelectionChange="handleSelectionChange" @deletefun="detailsdeletionfun">
                                        <template slot="menuLeft">
                                            <div style="display: flex;">
                                                <search-query :datalist="serverData" :selectValue="form.serverName"
                                                    :clearable="true" :buttonIf="false" :filterable="true"
                                                    :forParameter="{ key: 'dictKey', label: 'dictValue', value: 'dictValue' }"
                                                    placeholder="请选择开票项目" @corpChange="corpChange($event, 'serverName')"
                                                    @corpFocus="serverWorkDictsfun">
                                                </search-query>
                                                <el-button style="margin-left: 10px" :disabled="editSave" size="small"
                                                    type="primary" @click="invoicingfun">生成开票明细</el-button>
                                                <el-button style="margin-left: 10px" :disabled="editSave" size="small"
                                                    type="warning" @click="invoicingRevokefun">撤销开票明细</el-button>
                                                <el-button size="small" :disabled="editSave" type="danger"
                                                    @click="batchDeletefun">一键删除</el-button>

                                                <el-input style="width: 10%;margin-left: 10px;"
                                                    v-model="invoiceAmountCNY" size="small" autocomplete="off"
                                                    type="numbers" clearable placeholder="开票金额">
                                                    <span style="line-height: 32px;" slot="suffix">本币</span>
                                                </el-input>
                                                <el-input style="width: 10%;margin-left: 5px;"
                                                    v-model="invoiceAmountUSD" size="small" autocomplete="off"
                                                    type="numbers" clearable placeholder="开票金额">
                                                    <span style="line-height: 32px;" slot="suffix">外币</span>
                                                </el-input>
                                                <el-button style="margin-left: 10px" :disabled="statusType" size="small"
                                                    type="primary" @click="invoiceMatchingfun()">匹配金额</el-button>
                                                <span style="font-size: 18px;font-weight: 600;margin-left: 50px;">
                                                    <span style="color: #67C23A;margin-right: 10px;">
                                                        本币:{{ amountSubSum }}元
                                                    </span>
                                                    <span style="color: #E6A23C;">
                                                        外币:{{ amountSubUsdSum }}元
                                                    </span>
                                                </span>
                                            </div>
                                        </template>
                                    </fininvoicesitems>
                                </el-tab-pane>
                                <el-tab-pane label="开票明细" name="second">
                                    <div style="margin-bottom: 10px;display: flex;">
                                        <el-button size="small" :disabled="editSave" type="danger"
                                            @click="invoicingBatchDelete">一键删除</el-button>
                                        <!-- <span style="font-size: 18px;font-weight: 600;margin-left: 100px;">
                                    <span style="color: #67C23A;">
                                        本币:{{ amountSubSum }}元
                                    </span>
                                </span> -->
                                    </div>
                                    <fininvoiceitemdetail :tableData="InvoicingList"
                                        :handleSelectionData="invoicingCheckboxData"
                                        @handleSelectionChange="invoicingCheckboxChange" @deletefun="invoiceDeletionfun"
                                        @savefun="invoiceSavefun">
                                    </fininvoiceitemdetail>
                                </el-tab-pane>
                            </el-tabs>
                        </el-card>
                        <el-card class="box-card" style="margin-top: 10px">
                            <el-row>
                                <el-col :span="5">
                                    <el-form-item label="业务编号" prop="billNo">
                                        <el-input style="width: 100%;" v-model="form.billNo" size="small"
                                            autocomplete="off" :disabled="true" clearable placeholder="请输入业务编号">
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5">
                                    <el-form-item label="单据日期" prop="billDate">
                                        <el-date-picker v-model="form.billDate" clearable style="width: 100%;"
                                            type="date" size="small" :disabled="true" value-format="yyyy-MM-dd HH:mm"
                                            placeholder="选择单据日期">
                                        </el-date-picker>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="5">
                                    <el-form-item label="制单人" prop="createUserName">
                                        <el-input style="width: 100%;" v-model="form.createUserName" size="small"
                                            autocomplete="off" :disabled="true" clearable placeholder="请输入制单人">
                                        </el-input>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-card>
                    </el-form>
                </el-tab-pane>
                <el-tab-pane label="文件中心">
                    <containerTitle title="上传附件"></containerTitle>
                    <c-upload :data="form.fileList" :enumerationValue="76" deleteUrl="/api/blade-los/filescenter/remove"
                        display :disabled="statusType"></c-upload>
                </el-tab-pane>
            </el-tabs>
        </div>
        <el-dialog title="选择数据" :visible.sync="retrievePopupsType" append-to-body width="70%"
            :close-on-click-modal="false">
            <div>
                <avue-crud :option="retrievePopupsOption" :data="retrievePopupsData" ref="retrievePopupsRef"
                    id="out-table">
                    <template slot="menu" slot-scope="{ row }">
                        <el-button type="text" size="small" @click.stop="retrievePopupsSelect(row)">选择
                        </el-button>
                    </template>
                </avue-crud>
            </div>
        </el-dialog>


    </div>
</template>

<script>
import { bcurexrateList } from "@/api/iosBasicData/rateManagement";
import fininvoicesitems from "@/views/iosBasicData/fininvoicesApplyfor/assembly/fininvoicesitems.vue";
import fininvoiceitemdetail from "@/views/iosBasicData/fininvoicesApplyfor/assembly/fininvoiceitemdetail.vue";
import { getRateList } from "@/api/iosBasicData/rateManagement";
import { finstlbillsGetByDetail, finstlbillsitemsRemove, finstlbillslistAccBillV1 } from "@/api/iosBasicData/finstlbills";
import { bcorpsbankList, corpsinvoiceheaderList, getBcorpsList } from "@/api/iosBasicData/bcorps";
import { bportsList } from "@/api/iosBasicData/bports";
import SearchQuery from "@/components/iosbasic-data/searchquery.vue";
import {
    fininvoicesDetail,
    fininvoicesSubmit,
    fininvoicesitemsRemove,
    generateFinInvoicesDetail,
    fininvoiceitemdetailRemove,
    revokeFinInvoicesDetail,
    fininvoiceitemdetailSubmit,
    fininvoicesGenerateFinInvoices,
    fininvoicesConfirmFinInvoices, fininvoicesRevokeFinInvoices
} from "@/api/iosBasicData/fininvoices";
import { getWorkDicts } from "@/api/system/dictbiz";
import { getCurrentDate } from "@/util/date";
import dicSelect from "@/components/dicSelect/main";
import { finstlbillslistAccBillByCorp } from '@/api/iosBasicData/finstlbills';
import { getMonthDate, getYearDate } from "@/util/date";
export default {
    components: { SearchQuery, fininvoicesitems, fininvoiceitemdetail, dicSelect },
    data() {
        return {
            amountSubSum: 0,
            amountSubUsdSum: 0,
            options: [
                {
                    value: null,
                    label: '全部'
                }, {
                    value: 'D',
                    label: '收'
                }, {
                    value: 'C',
                    label: '付'
                }
            ],
            showForm: false,
            retrievePopupsType: false, // 弹窗开启关闭
            retrievePopupsData: [], // 选择弹窗数据
            retrievePopupsOption: {
                border: true,
                calcHeight: 30,
                tip: false,
                height: '500px',
                index: true,
                addBtn: false,
                viewBtn: false,
                delBtn: false,
                editBtn: false,
                refreshBtn: false,
                columnBtn: false,
                menuWidth: '60',
                header: false,
                column: [
                    {
                        label: "客户中文名",
                        prop: "cnName",
                        overHidden: true,
                    },
                    {
                        label: "客户英文文名",
                        prop: "cnName",
                        overHidden: true,
                    },
                ]
            },
            invoiceAmountCNY: 0, // 费用明细开票金额输入框CNY
            invoiceAmountUSD: 0, // 费用明细开票金额输入框USD
            statusType: false, // 是否确认开票
            serverData: [], // 开票项目数据
            detailTabs: 'first',
            appendType: '检索',
            pageLoading: false, // 全屏加载
            saveLoading: false, // 按钮加载
            form: {
                branchId: JSON.parse(localStorage.getItem('sysitemData')).deptId,
                branchName: JSON.parse(localStorage.getItem('sysitemData')).deptName,
                dc: 'D',
                invCurCode: 'CNY',
                isRp: 1,
                invType: '全电发票',
                taxRate: 0,
                isExchangeToCny: 0,
                invoiceDate: getCurrentDate(),
            },
            tableData: [], // 费用明细数据
            InvoicingList: [], // 开票明细数据
            handleSelectionData: [], // 费用明细选择的数据
            invoicingCheckboxData: [], // 开票明细选择的数据
            corpData: [], // 结算单位数据
            invCorpData: [], // 开票单位
            bankReceiptData: [], // 结算单位银行账号数据
            // 业务类型
            businessTypesData: [
                {
                    label: '海运出口',
                    value: 'SE'
                }, {
                    label: '海运进口',
                    value: 'SI'
                }
            ],
            curData: [], // 币别
            destinationData: [], // 目的港
            podData: [], // 卸货港
            polData: [], // 装货港
            invCurCodeData: [], // 发票币种
            invTypeData: [], // 发票类型
            rules: {
                branchName: [{
                    required: true,
                    message: '',
                    trigger: 'blur'
                },],
                // corpCnName: [
                //     { required: true, message: '请输入付费对象', trigger: 'blur' },
                // ],
                invoiceDate: [
                    { required: true, message: '请输入开票日期', trigger: 'blur' },
                ],
                exrate: [
                    { required: true, message: '请输入导入汇率', trigger: 'blur' },
                ],
                taxRate: [
                    { required: true, message: '请输入所属税率', trigger: 'blur' },
                ],
                invCurCode: [
                    { required: true, message: '请输入所属发票币别', trigger: 'blur' },
                ],
            },
            roleName: [], // 当前的角色权限
            saberUserInfo: {}, // 当前登录人信息
            editPower: false, // 当前是否可以编辑
        }
    },
    props: {
        editSave: {
            type: Boolean,
            default: false
        }
    },
    watch: {
        // 监听 状态
        "form.status": {
            // 执行方法
            handler(oldValue, newValue) {
                if (oldValue == 3) {
                    this.statusType = true
                } else {
                    this.statusType = false
                }
            },
            deep: true, // 深度监听
            immediate: true  // 第一次改变就执行
        },
    },
    async created() {
        this.roleName = localStorage.getItem('roleName').split(',')
        await this.saveLocalCurrency()
        // 获取当前登录人个人信息
        this.saberUserInfo = JSON.parse(localStorage.getItem('saber-userInfo')).content
        if (!this.form.id) {
            this.form.invCurCode = this.getLocalCurrency()
            bcurexrateList({ current: 1, size: 35, type: '月汇率', code: 'USD', exrateYear: getYearDate() }).then(res => {
                for (let item of res.data.data.records) {
                    if (item.exrateMonth == getMonthDate()) {
                        this.$set(this.form, 'exrate', item.exrateReceipts)
                    }
                }
            })
            // getRateList({ current: 1, size: 30 }).then(res => {
            //     for (let item of res.data.data.records) {
            //         if (item.code == "USD") {
            //             this.$set(this.form, 'exrate', item.exrate)
            //         }
            //     }
            // })
        }
    },
    methods: {
        dicChange(name, row) {
            if (name == 'branchName') {
                if (row) {
                    this.form.branchId = row.id
                    this.saveLocalCurrency(row.id)
                } else {
                    this.form.branchId = null
                    this.form.branchName = null
                }
            }
        },
        handleClick() {
            this.amountSubSum = 0
            this.amountSubUsdSum = 0
        },
        ResetFilter() {
            this.form = {
                invCurCode: this.getLocalCurrency(),
                isRp: 1,
                invType: '全电发票',
                taxRate: 0,
                isExchangeToCny: 0,
                invoiceDate: getCurrentDate(),
            }
            getRateList({ current: 1, size: 30 }).then(res => {
                for (let item of res.data.data.records) {
                    if (item.code == "USD") {
                        this.$set(this.form, 'exrate', item.exrate)
                    }
                }
            })
        },
        // 开票明细编辑完成保存
        invoiceSavefun(row) {
            row.amountRate = this.form.taxRate
            // 销售额/(1+税率)×税率
            row.amountTax = (row.amount / (1 + (Number(row.amountRate) / 100)) * (Number(row.amountRate) / 100)).toFixed(2)
            fininvoiceitemdetailSubmit(row).then(res => {
                this.$message.success('操作成功')
                this.fininvoicesDetailfun(this.form.id)
            })
        },
        // 确认开票信息
        invoicingfun() {
            if (this.handleSelectionData.length == 0) {
                this.$message.warning('请选择数据')
                return;
            }
            if (!this.form.serverName) {
                this.$message.warning('请选择开票项目')
                return
            }
            let obj = this.form
            obj.finInvoicesItemsList = []
            obj.businessTypes = this.form.businessTypes ? this.form.businessTypes.join(',') : ''
            obj.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
            //开票日期
            if (this.form.invoiceDate) {
                obj.invoiceDate = this.form.invoiceDate.slice(0, 10) + ' 00:00:00'
            }
            // 业务日期
            if (this.form.accountDateFrom) {
                obj.accountDateFrom = this.form.accountDateFrom.slice(0, 10) + ' 00:00:00'
            }
            if (this.form.accountDateTo) {
                obj.accountDateTo = this.form.accountDateTo.slice(0, 10) + ' 00:00:00'
            }
            for (let item of this.handleSelectionData) {
                // 拿未开票的数据
                if (item.status == 0) {
                    if (item.currentCurCode == this.getLocalCurrency()) {
                        item.currentAmount = item.currentAmountCNY
                    } else {
                        item.currentAmount = item.currentAmountUSD
                    }
                    obj.finInvoicesItemsList.push(item)
                }
            }
            if (obj.finInvoicesItemsList.length == 0) {
                this.$message.warning('请选择未生成发票的数据')
                return
            }
            // 开票项目
            generateFinInvoicesDetail(obj).then(res => {
                this.$message.warning('操作成功')
                this.fininvoicesDetailfun(this.form.id)
            })
            this.detailTabs = 'second'
        },
        // 撤销开票信息
        invoicingRevokefun() {
            if (this.handleSelectionData.length == 0) {
                this.$message.warning('请选择数据')
                return;
            }
            let obj = this.form
            obj.finInvoicesItemsList = []
            obj.businessTypes = this.form.businessTypes ? this.form.businessTypes.join(',') : ''
            obj.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
            //开票日期
            if (this.form.invoiceDate) {
                obj.invoiceDate = this.form.invoiceDate.slice(0, 10) + ' 00:00:00'
            }
            // 业务日期
            if (this.form.accountDateFrom) {
                obj.accountDateFrom = this.form.accountDateFrom.slice(0, 10) + ' 00:00:00'
            }
            if (this.form.accountDateTo) {
                obj.accountDateTo = this.form.accountDateTo.slice(0, 10) + ' 00:00:00'
            }
            for (let item of this.handleSelectionData) {
                // 拿未开票的数据
                if (item.status == 1) {
                    if (item.currentCurCode == this.getLocalCurrency()) {
                        item.currentAmount = item.currentAmountCNY
                    } else {
                        item.currentAmount = item.currentAmountUSD
                    }
                    obj.finInvoicesItemsList.push(item)
                }
            }
            if (obj.finInvoicesItemsList.length == 0) {
                this.$message.warning('请选择已生成发票的数据')
                return
            }
            // 撤销开票项目
            revokeFinInvoicesDetail(obj).then(res => {
                this.$message.warning('操作成功')
                this.fininvoicesDetailfun(this.form.id)
            })
        },
        // 费用明细开票匹配
        invoiceMatchingfun() {
            if (this.invoiceAmountCNY != 0 || this.invoiceAmountUSD != 0) {
                let dataCNY = JSON.parse(JSON.stringify(this.invoiceAmountCNY))
                let dataUSD = JSON.parse(JSON.stringify(this.invoiceAmountUSD))
                for (let item of this.tableData) {
                    this.$refs.fininvoicesitems.$refs.tableRef.toggleRowSelection(item, false)
                    if (this.invoiceAmountCNY != 0) {
                        if (dataCNY < 0) {
                            dataCNY = 0
                        }
                        if (dataCNY > 1500) {
                            if (item.currentCurCode == this.getLocalCurrency()) {
                                this.$set(item, 'currentAmountCNY', 1500)
                                this.$refs.fininvoicesitems.$refs.tableRef.toggleRowSelection(item, true)
                                dataCNY -= 1500
                            }
                        } else {
                            if (item.currentCurCode == this.getLocalCurrency()) {
                                if (dataCNY != 0) {
                                    this.$refs.fininvoicesitems.$refs.tableRef.toggleRowSelection(item, true)
                                }
                                this.$set(item, 'currentAmountCNY', dataCNY)
                                dataCNY -= 1500
                            }
                        }
                    }
                    if (this.invoiceAmountUSD != 0) {
                        if (dataUSD < 0) {
                            dataUSD = 0
                        }
                        if (dataUSD > 1500) {
                            if (item.currentCurCode == 'USD') {
                                this.$set(item, 'currentAmountUSD', 1500)
                                this.$refs.fininvoicesitems.$refs.tableRef.toggleRowSelection(item, true)
                                dataUSD -= 1500
                            }
                        } else {
                            if (item.currentCurCode == 'USD') {
                                this.$set(item, 'currentAmountUSD', dataUSD)
                                if (dataUSD != 0) {
                                    this.$refs.fininvoicesitems.$refs.tableRef.toggleRowSelection(item, true)
                                }
                                dataUSD -= 1500
                            }
                        }
                    }
                }
            }


        },
        // 费用明细批量删除
        batchDeletefun() {
            if (this.handleSelectionData.length == 0) {
                return this.$message.warning('请选择要删除的数据')
            }
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                // 获取有id 的数据
                const itemsWithId = this.handleSelectionData.filter(item => item.hasOwnProperty('id'));
                let arrIds = itemsWithId.map(item => item.id) // 获取id 数据
                // 把选中的删除掉
                this.handleSelectionData.forEach((item) => {
                    for (let index in this.tableData) {
                        if (item.accBillNo == this.tableData[index].accBillNo) {
                            this.tableData.splice(Number(index), 1)
                        }
                    }
                })
                // 有id 的处理
                if (itemsWithId.length != 0) {
                    fininvoicesitemsRemove(arrIds.join(',')).then(res => {
                        this.$message.success('操作成功')
                    })
                }
            })
        },
        // 费用明细单个删除
        detailsdeletionfun(id, index) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                if (id) {
                    fininvoicesitemsRemove(id).then(res => {
                        this.$message.success('操作成功')
                    })
                }
                this.tableData.splice(index, 1)
            })
        },
        // 开票批量删除
        invoicingBatchDelete() {
            if (this.invoicingCheckboxData.length == 0) {
                return this.$message.warning('请选择要删除的数据')
            }
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                // 获取有id 的数据
                const itemsWithId = this.invoicingCheckboxData.filter(item => item.hasOwnProperty('id'));
                let arrIds = itemsWithId.map(item => item.id) // 获取id 数据
                // 把选中的删除掉
                this.invoicingCheckboxData.forEach((item) => {
                    for (let index in this.InvoicingList) {
                        if (item.id == this.InvoicingList[index].id) {
                            this.InvoicingList.splice(Number(index), 1)
                        }
                    }
                })
                // 有id 的处理
                if (itemsWithId.length != 0) {
                    fininvoiceitemdetailRemove(arrIds.join(',')).then(res => {
                        this.$message.success('操作成功')
                    })
                }
            })
        },
        // 开票明细单个删除
        invoiceDeletionfun(id, index) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                if (id) {
                    fininvoiceitemdetailRemove(id).then(res => {
                        this.$message.success('操作成功')
                    })
                }
                this.InvoicingList.splice(index, 1)
            })
        },
        // 下拉框的回调
        corpChange(value, name) {
            // 结算单位
            if (name == 'corpCnName') {
                if (!value) {
                    this.$set(this.form, 'corpId', '')
                    this.$set(this.form, 'corpCnName', '')
                    this.$set(this.form, 'corpEnName', '')
                    return
                }
                for (let item of this.corpData) {
                    if (item.cnName == value) {
                        this.$set(this.form, 'corpId', item.id)
                        this.$set(this.form, 'corpCnName', item.cnName)
                        this.$set(this.form, 'corpEnName', item.enName)
                        bcorpsbankList(1, 10, { pid: this.form.corpId }).then(res => {
                            if (res.data.data.records.length != 0) {
                                this.$set(this.form, 'bankReceiptAccountNo', res.data.data.records[0].accountNo)
                                this.$set(this.form, 'bankReceiptBankName', res.data.data.records[0].accountBank)
                            }
                        })
                        // 带出开票单位数据
                        corpsinvoiceheaderList(1, 20, { pid: this.form.corpId }).then(res => {
                            if (res.data.data.records.length != 0) {
                                this.$set(this.form, 'invCorpId', res.data.data.records[0].id)
                                this.$set(this.form, 'invCorpCnName', res.data.data.records[0].invoiceHeader)
                                this.$set(this.form, 'invCorpTaxNo', res.data.data.records[0].uscc) // 税号
                                this.$set(this.form, 'invCorpAccountBankUsd', res.data.data.records[0].accountBankUsd) // 美元银行
                                this.$set(this.form, 'invCorpAccountNoUsd', res.data.data.records[0].accountNoUsd) // 美元账户
                                this.$set(this.form, 'invCorpAccountBankCny', res.data.data.records[0].accountBankUsd) // 人民币银行
                                this.$set(this.form, 'invCorpAccountNoCny', res.data.data.records[0].accountNoUsd) // 人民币账户
                            }
                        })
                    }
                }
            }
            // 开票单位
            else if (name == 'invCorpCnName') {
                this.$set(this.form, 'invCorpAccountBankUsd', '')
                this.$set(this.form, 'invCorpAccountNoUsd', '')
                this.$set(this.form, 'invCorpAccountBankCny', '')
                this.$set(this.form, 'invCorpAccountNoCny', '')
                if (!value) {
                    this.$set(this.form, 'invCorpId', '')
                    this.$set(this.form, 'invCorpCnName', '')
                    return
                }
                for (let item of this.invCorpData) {
                    if (item.id == value) {
                        this.$set(this.form, 'invCorpId', item.id)
                        this.$set(this.form, 'invCorpCnName', item.invoiceHeader)
                        this.$set(this.form, 'invCorpTaxNo', item.uscc) // 税号
                        this.$set(this.form, 'invCorpAccountBankUsd', item.accountBankUsd) // 美元银行
                        this.$set(this.form, 'invCorpAccountNoUsd', item.accountNoUsd) // 美元账户
                        this.$set(this.form, 'invCorpAccountBankCny', item.accountBankUsd) // 人民币银行
                        this.$set(this.form, 'invCorpAccountNoCny', item.accountNoUsd) // 人民币账户
                    }
                }
            }
            // 结算单位银行账户
            else if (name == 'bankReceiptAccountNo') {
                for (let item of this.bankReceiptData) {
                    if (item.accountNo == value) {
                        this.$set(this.form, 'bankReceiptAccountNo', item.accountNo)
                        this.$set(this.form, 'bankReceiptBankName', item.accountBank)
                    }
                }
            }
            else {
                this.$set(this.form, name, value)
            }

        },
        // 费用明细表格多选
        handleSelectionChange(list) {
            this.amountSubSum = 0
            this.amountSubUsdSum = 0
            if (list.length) {
                list.forEach(e => {
                    this.amountSubSum += Number(e.currentAmountCNY ? e.currentAmountCNY : 0)
                    this.amountSubUsdSum += Number(e.currentAmountUSD ? e.currentAmountUSD : 0)
                })
            }
            this.handleSelectionData = list
        },
        // 开票明细表格多选
        invoicingCheckboxChange(list) {
            this.amountSubSum = 0
            this.amountSubUsdSum = 0
            if (list.length) {
                list.forEach(e => {
                    this.amountSubSum += Number(e.amount ? e.amount : 0)
                })
            }
            this.invoicingCheckboxData = list
        },
        // 编辑事件
        editHandle() {
            this.editSave = false
        },
        newbillFun() {
            if (this.statusType) {
                this.$emit('toAddEdit')
            } else {
                this.$confirm('是否需要保存?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.editCustomer('toAddEdit')
                }).catch(() => {
                    this.$emit('toAddEdit')
                });
            }
        },
        submit(type) {
            this.$confirm("确定进行确认开票操作?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                this.editCustomer(type)
            }).catch(() => {
                this.saveLoading = false
            });
        },
        // 保存按钮事件
        editCustomer(type) {
            this.$refs.form.validate((valid) => {
                if (!valid) return
                if (!this.form.id) {
                    // 是否选择从表数据
                    if (this.handleSelectionData.length == 0) {
                        this.$message.warning('请选择结算数据');
                        return;
                    }
                }
                this.form.type = '销项'
                this.form.billNoFormat = 'XXFP'
                this.form.businessTypeCode = 'XXFP'
                this.form.businessTypes = this.form.businessTypes ? this.form.businessTypes.join(',') : ''
                this.form.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
                //开票日期
                if (this.form.invoiceDate) {
                    this.form.invoiceDate = this.form.invoiceDate.slice(0, 10) + ' 00:00:00'
                }
                // 业务日期
                if (this.form.accountDateFrom) {
                    this.form.accountDateFrom = this.form.accountDateFrom.slice(0, 10) + ' 00:00:00'
                }
                if (this.form.accountDateTo) {
                    this.form.accountDateTo = this.form.accountDateTo.slice(0, 10) + ' 00:00:00'
                }
                if (this.form.id) {
                    this.form.finInvoicesItemsList = this.form.finInvoicesItemsList.map(item => {
                        if (item.currentCurCode == this.getLocalCurrency()) {
                            item.currentAmount = item.currentAmountCNY
                        } else {
                            item.currentAmount = item.currentAmountUSD
                        }
                        return item
                    })
                } else {
                    this.form.finInvoicesItemsList = this.handleSelectionData.map(item => {
                        if (item.currentCurCode == this.getLocalCurrency()) {
                            item.currentAmount = item.currentAmountCNY
                        } else {
                            item.currentAmount = item.currentAmountUSD
                        }
                        return item
                    })
                }
                this.form.finInvoiceItemDetailList = this.InvoicingList
                this.saveLoading = true
                if (type == '开票') {
                    fininvoicesSubmit(this.form).then(res => {
                        res.data.data.businessTypes = res.data.data.businessTypes ? res.data.data.businessTypes.split(',') : []
                        res.data.data.feeCnName = res.data.data.feeCnName ? res.data.data.feeCnName.split(',') : []
                        this.form = res.data.data
                        this.fininvoicesConfirmFinInvoicesfun()
                    }).finally(() => {
                        this.saveLoading = false
                    }).catch(error => {
                        this.fininvoicesDetailfun(this.form.id)
                    })
                } else if (type == 'toAddEdit') {
                    fininvoicesSubmit(this.form).then(res => {
                        this.$message.success('操作成功');
                        this.saveLoading = false // 关闭按钮动画
                        this.$emit(type)
                    }).catch(() => {
                        this.saveLoading = false
                    })
                } else {
                    this.fininvoicesSubmitfun(this.form)
                }
            })
        },
        retrievePopupsSelect(row) {
            this.$set(this.form, 'corpId', row.id)
            this.$set(this.form, 'corpCnName', row.cnName)
            this.$set(this.form, 'corpEnName', row.enName)
            bcorpsbankList(1, 10, { pid: row.id }).then(res => {
                if (res.data.data.records.length != 0) {
                    this.$set(this.form, 'bankReceiptAccountNo', res.data.data.records[0].accountNo)
                    this.$set(this.form, 'bankReceiptBankName', res.data.data.records[0].accountBank)
                }
            })
            // 带出开票单位数据
            corpsinvoiceheaderList(1, 20, { pid: row.id }).then(res => {
                if (res.data.data.records.length != 0) {
                    this.$set(this.form, 'invCorpId', res.data.data.records[0].id)
                    this.$set(this.form, 'invCorpCnName', res.data.data.records[0].invoiceHeader)
                    this.$set(this.form, 'invCorpTaxNo', res.data.data.records[0].uscc) // 税号
                    this.$set(this.form, 'invCorpAccountBankUsd', res.data.data.records[0].accountBankUsd) // 美元银行
                    this.$set(this.form, 'invCorpAccountNoUsd', res.data.data.records[0].accountNoUsd) // 美元账户
                    this.$set(this.form, 'invCorpAccountBankCny', res.data.data.records[0].accountBankUsd) // 人民币银行
                    this.$set(this.form, 'invCorpAccountNoCny', res.data.data.records[0].accountNoUsd) // 人民币账户
                }
            })
            this.retrievePopupsType = false
            this.finstlbillslistAccBillV1fun(this.appendType)
        },
        finstlbillslistAccBillByCorpfun() {
            let obj = {}
            if (this.form.accountDateFrom) {
                obj.accountDateFrom = this.form.accountDateFrom.slice(0, 10) + ' 00:00:00'
            }
            if (this.form.accountDateTo) {
                obj.accountDateTo = this.form.accountDateTo.slice(0, 10) + ' 00:00:00'
            }
            obj.type = '3'
            obj.branchId = this.form.branchId
            obj.branchName = this.form.branchName
            obj.billNo = this.form.businessNo // 业务编号
            obj.businessBillNo = this.form.billNo // 业务编号
            obj.mblno = this.form.mblno // 主单编号
            obj.hblno = this.form.hblno // 分单编号
            obj.bookingNo = this.form.bookingNo // 订舱号(BOOK NO)
            obj.curCode = this.form.curCode // 币种
            obj.businessType = this.form.businessTypes ? this.form.businessTypes.join(',') : '' // 业务类型
            obj.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
            finstlbillslistAccBillByCorp(obj).then(res => {
                this.retrievePopupsType = true
                this.retrievePopupsData = res.data.data
            })
        },
        // 检索
        finstlbillslistAccBillV1fun(type) {
            this.$refs.form.validate((valid) => {
                if (!valid) return
                if (this.form.businessNo || this.form.mblno || this.form.checkNo) {
                    if (!this.form.corpId) {
                        this.finstlbillslistAccBillByCorpfun()
                        return
                    }
                } else {
                    if (!this.form.corpId) {
                        this.$message.warning('请选择结算单位');
                        return
                    }
                }
                let obj = {}
                //开票日期
                if (this.form.invoiceDate) {
                    obj.invoiceDate = this.form.invoiceDate.slice(0, 10) + ' 00:00:00'
                }
                // 业务日期
                if (this.form.accountDateFrom) {
                    obj.accountDateFrom = this.form.accountDateFrom.slice(0, 10) + ' 00:00:00'
                }
                if (this.form.accountDateTo) {
                    obj.accountDateTo = this.form.accountDateTo.slice(0, 10) + ' 00:00:00'
                }

                obj.type = '3'
                obj.branchId = this.form.branchId
                obj.branchName = this.form.branchName
                obj.billNo = this.form.bookingNo // 账单号
                obj.businessBillNo = this.form.businessNo // 业务编号
                obj.mblno = this.form.mblno // 主单编号
                obj.hblno = this.form.hblno // 分单编号
                obj.bookingNo = this.form.bookingNo // 订舱号(BOOK NO)
                obj.curCode = this.form.curCode // 币种
                obj.businessType = this.form.businessTypes ? this.form.businessTypes.join(',') : '' // 业务类型
                obj.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
                obj.dc = this.form.dc
                // 判断是否有对账单号
                if (this.form.checkNo) {
                    obj.corpId = this.form.corpId // 结算单位
                    obj.checkNo = this.form.checkNo // CHK NO 对账单号
                    // obj.dc='D'
                    finstlbillsGetByDetail(obj).then(res => {
                        let arr = res.data.data.finStlBillsItemsList.map((item, index) => {
                            item.lineNo = Number(index) + 1 // 行号
                            item.currentCurCode = item.curCode
                            item.currentExrate = item.exrate
                            if (item.currentCurCode == this.getLocalCurrency()) {
                                // 本次发票金额
                                item.currentAmountCNY = item.appliedInvoiceCurrentAmount
                            } else {
                                // 本次发票金额
                                item.currentAmountUSD = item.appliedInvoiceCurrentAmount
                            }
                            delete item.id
                            return item
                        })
                        if (type == '追加') {
                            let a = [...this.tableData, ...arr,]
                            this.tableData = a.filter((obj, index) => {
                                return a.findIndex((elem) => {
                                    return elem.accBillNo === obj.accBillNo
                                }) === index;
                            });
                        } else {
                            // 获取有id 的数据
                            const itemsWithId = this.tableData.filter(item => item.hasOwnProperty('id'));
                            let arrIds = itemsWithId.map(item => item.id) // 获取id 数据
                            // 有id 的处理
                            if (itemsWithId.length != 0) {
                                finstlbillsitemsRemove(arrIds.join(',')).then(res => {
                                    this.$message.success('操作成功')
                                })
                            }
                            if (arr.length == 0) {
                                this.$message.warning('当前检索暂无数据！')
                            }
                            this.tableData = arr
                        }
                    })
                } else {
                    obj.billNo = this.form.businessNo // 业务编号
                    obj.corpCnName = this.form.corpId // 结算单位
                    obj.checkBillNo = this.form.checkNo // 对账单号
                    // obj.dc='D'
                    finstlbillslistAccBillV1(obj).then(res => {
                        let arr = res.data.data.map((item, index) => {
                            console.log(item)
                            item.lineNo = Number(index) + 1 // 行号
                            item.accBillId = item.id
                            item.accBillNo = item.billNo
                            item.billNo = item.businessBillNo
                            item.accDate = item.createTime
                            item.currentCurCode = item.curCode
                            item.currentExrate = item.exrate
                            item.dc = item.accountDc
                            if (item.currentCurCode == this.getLocalCurrency()) {
                                // 本次发票金额
                                item.currentAmountCNY = item.appliedInvoiceCurrentAmount
                            } else {
                                // 本次发票金额
                                item.currentAmountUSD = item.appliedInvoiceCurrentAmount
                            }
                            delete item.id
                            return item
                        })
                        if (type == '追加') {
                            let a = [...this.tableData, ...arr,]
                            this.tableData = a.filter((obj, index) => {
                                return a.findIndex((elem) => {
                                    return elem.accBillNo === obj.accBillNo
                                }) === index;
                            });
                        } else {
                            // 获取有id 的数据
                            const itemsWithId = this.tableData.filter(item => item.hasOwnProperty('id'));
                            let arrIds = itemsWithId.map(item => item.id) // 获取id 数据
                            // 有id 的处理
                            if (itemsWithId.length != 0) {
                                fininvoicesitemsRemove(arrIds.join(',')).then(res => {
                                    this.$message.success('操作成功')
                                })
                            }
                            if (arr.length == 0) {
                                this.$message.warning('当前检索暂无数据！')
                            }
                            this.tableData = arr
                        }

                    })
                }
            })

        },
        // 保存接口
        fininvoicesSubmitfun(obj) {
            fininvoicesSubmit(obj).then(res => {
                this.saveLoading = false
                this.$message.success('操作成功');
                this.fininvoicesDetailfun(res.data.data.id)
            }).catch(() => {
                this.saveLoading = false
            })
        },
        // 详情接口
        fininvoicesDetailfun(id) {
            this.pageLoading = true
            fininvoicesDetail(id).then(res => {
                this.form = res.data.data
                this.saveLocalCurrency(res.data.data.branchId)
                if (this.roleName.indexOf('admin') == -1 ? this.roleName.indexOf('允许修改他人业务') == -1 ? this.saberUserInfo.user_id != this.form.createUser : false : false) {
                    this.editPower = true
                } else {
                    this.editPower = false
                }
                this.form.businessTypes = this.form.businessTypes ? this.form.businessTypes.split(',') : [] // 业务类型转换成数组显示
                this.form.feeCnName = this.form.feeCnName ? this.form.feeCnName.split(',') : []
                this.tableData = this.form.finInvoicesItemsList.map(item => {
                    if (item.currentCurCode == this.getLocalCurrency()) {
                        item.currentAmountCNY = item.currentAmount
                    } else {
                        item.currentAmountUSD = item.currentAmount
                    }
                    return item
                })
                this.InvoicingList = this.form.finInvoiceItemDetailList.map(item => {
                    item.edit = false
                    return item
                })
            }).finally(() => {
                this.pageLoading = false
            })
        },
        // 开票获取数据
        fininvoicesGenerateFinInvoicesfun(billId, type) {
            this.pageLoading = true
            this.invoicestype = type ? type : 0
            fininvoicesGenerateFinInvoices({ billId }).then(res => {
                this.form = res.data.data
                this.form.businessTypes = this.form.businessTypes ? this.form.businessTypes.split(',') : [] // 业务类型转换成数组显示
                this.form.feeCnName = this.form.feeCnName ? this.form.feeCnName.split(',') : []
                // 判断是否是数组
                if (Array.isArray(this.form.finInvoicesItemsList)) {
                    this.tableData = this.form.finInvoicesItemsList.map(item => {
                        if (item.currentCurCode == this.getLocalCurrency()) {
                            item.currentAmountCNY = item.currentAmount
                        } else {
                            item.currentAmountUSD = item.currentAmount
                        }
                        return item
                    })
                }
                // 判断是否是数组
                if (Array.isArray(this.form.finInvoiceItemDetailList)) {
                    this.InvoicingList = this.form.finInvoiceItemDetailList.map(item => {
                        item.edit = false
                        return item
                    })
                }
            }).finally(() => {
                this.pageLoading = false
            })
        },
        // 确认申请
        fininvoicesConfirmFinInvoicesfun() {
            this.pageLoading = true
            this.form.businessTypes = this.form.businessTypes ? this.form.businessTypes.join(',') : ''
            this.form.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
            fininvoicesConfirmFinInvoices(this.form).then(res => {
                this.$message.success('操作成功');
                this.fininvoicesDetailfun(res.data.data.id)
            }).finally(() => {
                this.pageLoading = false
            }).catch(error => {
                this.fininvoicesDetailfun(this.form.id)
            })

        },
        // 撤销申请
        fininvoicesRevokeFinInvoicesfun() {
            this.$confirm("确定进行撤销确认发票操作?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(res => {
                this.pageLoading = true
                this.form.businessTypes = this.form.businessTypes ? this.form.businessTypes.join(',') : ''
                this.form.feeCnName = this.form.feeCnName ? this.form.feeCnName.join(',') : ''
                fininvoicesRevokeFinInvoices(this.form).then(res => {
                    this.$message.success('操作成功');
                    this.fininvoicesDetailfun(res.data.data.id)
                }).finally(() => {
                    this.pageLoading = false
                })
            })
        },
        //返回列表
        backToList() {
            this.$emit('goBack')
        },
        // 获取客户名称数据 往来单位数据
        corpBcorpsListfun(cnName) {
            getBcorpsList(1, 10, { cnName }).then(res => {
                this.corpData = res.data.data.records
            })
        },
        // 根据往来单位选择调用获取银行数据
        bcorpsbankListfun(accountNo) {
            bcorpsbankList(1, 10, {
                // curNo:this.cntyCode,
                pid: this.form.corpId,
                accountNo: accountNo
            }).then(res => {
                this.bankReceiptData = res.data.data.records
            })
        },
        // 根据往来单位选择调用获取发票抬头数据 开票单位数据
        invcorpsinvoiceheaderListfun(cnName) {
            corpsinvoiceheaderList(1, 20, { pid: this.form.corpId, cnName }).then(res => {
                this.invCorpData = res.data.data.records
            })
        },
        // 获取币别数据
        getRateListfun(cnName) {
            getRateList({ current: 1, size: 10, cnName }).then(res => {
                this.curData = res.data.data.records
            })
        },
        // 获取发票币别数据
        async invCurCodeRateListfun(cnName) {
            await this.checkRate(null, null, null, 2)
            this.invCurCodeData = this.getCheckRate()
        },
        // 目的地
        destinationBportsListfun(enName) {
            bportsList(1, 10, { enName }).then(res => {
                this.destinationData = res.data.data.records
            })
        },
        // 卸货港
        podBportsListfun(enName) {
            bportsList(1, 10, { enName }).then(res => {
                this.podData = res.data.data.records
            })
        },
        // 装货港
        polBportsListfun(enName) {
            bportsList(1, 10, { enName }).then(res => {
                this.polData = res.data.data.records
            })
        },
        // 发票类型字典数据
        invTypeWorkDictsfun() {
            getWorkDicts('inv_type_los').then(res => {
                this.invTypeData = res.data.data;
            })
        },
        serverWorkDictsfun() {
            getWorkDicts('Invoice_information_los').then(res => {
                this.serverData = res.data.data;
            })
        },

    },
}
</script>

<style scoped>
::v-deep .el-form-item__error {
    display: none;
}

::v-deep.el-form-item {
    margin-bottom: 0;
}

.cardBox {
    background: #fff;
    width: 100%;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 4px;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);
}

.flexBox {
    display: flex;
}

.flexBoxLeft {
    flex: 2;
    margin-right: 10px;
    //padding-bottom: 40px;
}

.flexBoxRight {
    flex: 3;
    //padding-bottom: 40px;
}
</style>