Smart_platform_ui/src/views/iosBasicData/aiamends/assembly/amendsCostdetails.vue

<template>
    <div>
        <avue-crud :option="option"
                   :table-loading="loading"
                   :data="tableData"
                   v-model="form"
                   id="out-table"
                   :header-cell-class-name="headerClassName"
                   ref="crud"
                   :row-style="{height:'20px'}"
                   :cell-style="{padding:'0px'}"
                   @selection-change="handleSelectionChange"
                   @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 322.1)"
                   @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 322.1)" >
            <template slot="menuLeft">
                <el-button type="danger" plain size="small" :disabled="disabled"
                           @click="batchDelete" >一键删除
                </el-button>
                <el-button type="info" plain size="small" :disabled="disabled"
                           @click="feecenterSubmitListfun">一键保存
                </el-button>
                <el-button type="info" plain size="small" :disabled="disabled"
                           @click="oneclickEditingfun">一键编辑
                </el-button>
                <el-button type="primary" plain size="small" :disabled="!form.id"
                           @click="printingCostsfun()">打印账单</el-button>
            </template>
            <template slot="indexHeader" slot-scope="scope">
                <el-button type="primary" size="small" icon="el-icon-plus" circle
                           :disabled="disabled"
                           @click="addfun"></el-button>
            </template>
            <template slot="index" slot-scope="scope">
                <span>{{scope.index + 1}}</span>
            </template>
            <template slot="accStatus" slot-scope="{row,size}">
                <span>{{row.accStatus?'是':'否'}}</span>
            </template>
            <template slot="dc" slot-scope="{row,size}">
                <search-query v-if="editType"
                              :datalist="dcData"
                              :selectValue="row.dc"
                              :filterable="true"
                              :clearable="true"
                              :remote="true"
                              :buttonIf="false"
                              :disabled="dcDisabled"
                              @corpChange="corpChange($event,'dc',row)"
                              placeholder="请选择收/付">
                </search-query>
                <span v-else >{{row.dc}}</span>
            </template>
            <template slot="corpCnName" slot-scope="{ row }">
                <search-query v-if="editType"
                              :datalist="corpCnNameData"
                              :selectValue="row.corpCnName"
                              :filterable="true"
                              :clearable="true"
                              :remote="true"
                              :buttonIf="false"
                              :forParameter="{key:'id',label:'cnName',value:'cnName'}"
                              @remoteMethod="getBcorpsListfun($event,'corpCnName')"
                              @corpChange="corpChange($event,'corpCnName',row)"
                              @corpFocus="getBcorpsListfun($event,'corpCnName')" >
                </search-query>
                <span v-else >{{row.corpCnName}}</span>
            </template>
            <template slot="feeCnName" slot-scope="{ row }">
                <search-query v-if="editType"
                              :datalist="feeCnNameData"
                              :selectValue="row.feeCnName"
                              :filterable="true"
                              :clearable="true"
                              :remote="true"
                              :buttonIf="false"
                              :forParameter="{key:'id',label:'cnName',value:'cnName'}"
                              @remoteMethod="bfeesListfun($event,'feeCnName')"
                              @corpChange="corpChange($event,'feeCnName',row)"
                              @corpFocus="bfeesListfun($event,'feeCnName')" >
                </search-query>
                <span v-else >{{row.feeCnName}}</span>
            </template>
            <template slot="elementsCnName" slot-scope="{ row }">
                <search-query v-if="editType"
                              :datalist="elementsData"
                              :selectValue="row.elementsCnName"
                              :filterable="true"
                              :clearable="true"
                              :remote="true"
                              :buttonIf="false"
                              :forParameter="{key:'id',label:'cnName',value:'cnName'}"
                              @remoteMethod="getBaccelementsListfun($event,'elementsCnName')"
                              @corpChange="corpChange($event,'elementsCnName',row,)"
                              @corpFocus="getBaccelementsListfun($event,'elementsCnName')" >
                </search-query>
                <span v-else >{{row.elementsCnName}}</span>
            </template>
            <template slot="paymode" slot-scope="{ row }">
                <search-query v-if="editType"
                              :datalist="paymodeData"
                              :selectValue="row.paymode"
                              :clearable="true"
                              :buttonIf="false"
                              :forParameter="{key:'dictKey',label:'dictValue',value:'dictKey'}"
                              @corpChange="corpChange($event,'paymode',row)"
                              @corpFocus="paymodeWorkDictsfun" >
                </search-query>
                <span v-else>{{row.paymode}}</span>
            </template>
            <template slot="unitNo" slot-scope="{ row }">
                <search-query v-if="editType"
                              :datalist="unitNoData"
                              :selectValue="row.unitNo"
                              :filterable="true"
                              :clearable="true"
                              :remote="true"
                              :buttonIf="false"
                              :forParameter="{key:'id',label:'code',value:'code',disabled:'status'}"
                              @corpFocus="getBunitsPagefun"
                              @corpChange="corpChange($event,'unitNo',row)" >
                </search-query>
                <span v-else>{{row.unitNo}}</span>
            </template>
            <template slot="curCode" slot-scope="{ row }">
                <search-query v-if="editType"
                              :datalist="curCodeData"
                              :selectValue="row.curCode"
                              :filterable="true"
                              :clearable="true"
                              :remote="true"
                              :buttonIf="false"
                              :forParameter="{key:'id',label:'code',value:'code'}"
                              @remoteMethod="bcurrencyGetExratefun(row.dc)"
                              @corpChange="corpChange($event,'curCode',row)"
                              @corpFocus="bcurrencyGetExratefun(row.dc)" >
                </search-query>
                <span v-else>{{row.curCode}}</span>
            </template>
            <template slot="isTax" slot-scope="{row}">
                <span>{{row.isTax?'是':'否'}}</span>
            </template>
            <template slot="price" slot-scope="{ row }">
                <el-input v-if="editType" type="number" v-model="row.price" size="small" :min="1"
                          placeholder="请输入" @blur="priceinputfun($event,row)"></el-input>
                <span v-else>{{row.price}}</span>
            </template>
            <template slot="quantity" slot-scope="{ row }">
                <el-input v-if="editType" type="number" v-model="row.quantity" size="small" :min="1"
                          placeholder="请输入" @blur="quantityinputfun(row)"></el-input>
                <span v-else>{{row.quantity}}</span>
            </template>
            <template slot="remarks" slot-scope="{ row }">
                <el-input v-if="editType" v-model="row.remarks" size="small"
                          placeholder="请输入" ></el-input>
                <span v-else>{{row.remarks}}</span>
            </template>
            <template slot-scope="scope" slot="menu">
                <el-button type="text" size="small" :disabled="disabled" @click="deletefun(scope.row,scope.index,)">删除</el-button>
            </template>
        </avue-crud>
    </div>
</template>

<script>
    import {getBcorpsList} from "@/api/iosBasicData/bcorps";
    import {bfeesList} from "@/api/iosBasicData/bfees";
    import {getBaccelementsList} from "@/api/iosBasicData/baccelements";
    import {bcurrencyGetExrate} from "@/api/iosBasicData/rateManagement";
    import {getWorkDicts} from "@/api/system/dictbiz";
    import {getBunitsPage} from "@/api/iosBasicData/bunits";
    import SearchQuery from "@/components/iosbasic-data/searchquery.vue";
    import {dateFormat} from "@/util/date";
    import {
        feecenterRemove,
        feecenterSubmitList
    } from "@/api/iosBasicData/feecenter";
    import {amendsDetail} from "@/api/iosBasicData/amends";

    export default {
        components: {SearchQuery},
        props:{
            tableData:{
                type:Array,
                default:[]
            },
            editType:{
                type:Boolean,
                default:false,
            },
            form:{
                type:Object,
                default:{}
            },
            disabled:{
                type:Boolean,
                default:false
            },
            // dc 列禁用
            dcDisabled:{
                type:Boolean,
                default:false
            }
        },
        data(){
            return {
                option:{},
                optionBack:{
                    stripe:true,
                    maxHeight:'250',
                    calcHeight: 30,
                    tip: false,
                    searchShow: true,
                    searchMenuSpan: 6,
                    border: true,
                    selection: true,
                    dialogClickModal: false,
                    addBtn:false,
                    viewBtn:false,
                    delBtn:false,
                    editBtn:false,
                    menuWidth:'100',
                    refreshBtn:false,
                    column:[
                        {
                            label: "index",
                            prop: "index",
                            width: "55",
                            headerslot:true,
                        },
                        {
                            label: "账单",
                            prop: "accStatus",
                            width: "60",
                        },
                        {
                            label: "收/付",
                            prop: "dc",
                            width: "100",
                        },
                        {
                            label: "往来单位",
                            prop: "corpCnName",
                            width: "160",
                            overHidden:true,
                        },
                        {
                            label: "费用简称",
                            prop: "feeCnName",
                            width: "120",
                            overHidden:true,
                        },
                        {
                            label: "预付/到付",
                            prop: "paymode",
                            width: "120",
                        },
                        {
                            label: "计量单位",
                            prop: "unitNo",
                            width: "120",
                        },
                        {
                            label: "币种",
                            prop: "curCode",
                            width: "120",
                        },
                        {
                            label: "汇率",
                            prop: "exrate",
                            width: "100",
                        },
                        {
                            label: "单价",
                            prop: "price",
                            width: "120",
                        },
                        {
                            label: "数量",
                            prop: "quantity",
                            width: "120",
                        },
                        {
                            label: "CNY(含税)",
                            prop: "rmbAmount",
                            width: "100",
                        },
                        {
                            label: "USD(含税)",
                            prop: "usdAmount",
                            width: "100",
                        },
                        {
                            label: "CNY(净额)",
                            prop: "rmbAmountNet",
                            width: "100",
                        },
                        {
                            label: "USD(净额)",
                            prop: "usdAmountNet",
                            width: "100",
                        },
                        {
                            label: "核算要素",
                            prop: "elementsCnName",
                            width: "120",
                            overHidden:true,
                        },
                        {
                            label: "付费申请金额",
                            prop: "appliedAmount",
                            width: "120",
                        },
                        {
                            label: "发票申请金额",
                            prop: "appliedInvoiceAmount",
                            width: "120",
                        },
                        {
                            label: "已开票金额",
                            prop: "uninvoicedAmount",
                            width: "120",
                        },
                        {
                            label: "已结算金额",
                            prop: "stlTtlAmount",
                            width: "120",
                        },
                        {
                            label: "备注",
                            prop: "remarks",
                            width: "100",
                        },
                        {
                            label: "单价是否含税",
                            prop: "isTax",
                            width: "120",
                        },
                    ]
                },
                loading:false,
                form:{},
                // 收/付
                dcData:[
                    {
                        label:'收',
                        value:'D'
                    },
                    {
                        label:'付',
                        value:'C'
                    }
                ],
                corpCnNameData:[], // 往来单位数据
                feeCnNameData:[], // 费用数据
                elementsData:[], // 核算要素
                paymodeData:[], // 预付到付数据
                unitNoData:[],  // 计算单位数据
                curCodeData:[],  // 币别数据
                handleSelectionData:[], // 多选选择的数据
            }
        },
        async created() {
            this.option = await this.getColumnData(this.getColumnName(322.1), this.optionBack);
        },
        methods:{
            printingCostsfun(){
                this.$emit('printingCostsfun')
            },
            // 应收新增
            addfun(){
                this.$emit('addfun')
            },
            // 一键编辑
            oneclickEditingfun(){
                this.$emit('oneclickEditingfun')
            },
            // 一键删除
            batchDelete(){
                this.$confirm("确定将选择数据删除?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                }).then(()=>{
                    let multiList = this.handleSelectionData
                    let arr = this.tableData
                    // 获取有id 的数据
                    const itemsWithId = multiList.filter(item => item.hasOwnProperty('id'));
                    let arrIds = itemsWithId.map(item=>item.id) // 获取id 数据
                    // 把选中的删除掉
                    multiList.forEach((item)=>{
                        for (let index in arr) {
                            if (JSON.stringify(item) == JSON.stringify(arr[index])) {
                                arr.splice(Number(index),1)
                            }
                        }
                    })
                    // 有id 的处理
                    if(itemsWithId.length != 0) {
                        feecenterRemove(arrIds.join(',')).then(res=>{
                            this.$message.success('操作成功')
                            // this.$emit('billsDetailfun')
                        })
                    }
                })
            },
            // 小删除
            deletefun(row,index) {
                this.$confirm("确定将选择数据删除?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                }).then(()=>{
                    if (row.id) {
                        // 删除接口
                        feecenterRemove(row.id).then(res=>{
                            this.$message({
                                type: "success",
                                message: "操作成功!"
                            });
                            this.$emit('amendsDetailfun')
                        })
                    }else {
                        this.tableData.splice(index, 1)
                    }
                })
            },
            // 下拉的回调
            corpChange(value,name,row) {
                if (name == 'corpCnName') {
                    if (!value) {
                        this.$set(row,'corpCnName','')
                        this.$set(row,'corpEnName','')
                        this.$set(row,'corpId','')
                    }
                    for(let item of this.corpCnNameData) {
                        if (item.cnName == value){
                            this.$set(row,'corpCnName',item.cnName)
                            this.$set(row,'corpEnName',item.enName)
                            this.$set(row,'corpId',item.id)
                        }
                    }
                }else if (name == 'feeCnName') {
                    if (!value) {
                        this.$set(row,'feeCnName','')
                        this.$set(row,'feeEnName','')
                        this.$set(row,'feeId','')
                        this.$set(row,'feeCode','')
                        // 选择费用简称带出核算要素
                        this.$set(row,'elementsId','')
                        this.$set(row,'elementsCnName','')
                        this.$set(row,'elementsCode','')
                        this.$set(row,'elementsEnName','')
                    }
                    for(let item of this.feeCnNameData) {
                        if (item.cnName == value){
                            this.$set(row,'feeCnName',item.cnName)
                            this.$set(row,'feeEnName',item.enName)
                            this.$set(row,'feeId',item.id)
                            this.$set(row,'feeCode',item.code)
                            // 选择费用简称带出核算要素
                            this.$set(row,'elementsId',item.accElementId)
                            this.$set(row,'elementsCnName',item.accElementName)
                            this.$set(row,'elementsCode',item.elementsCode)
                            this.$set(row,'elementsEnName',item.elementsEnName)
                            // 拿取费用简称下的计量单位
                            this.getBunitsPagefun(true,item,row)
                            // 币别
                            this.$set(row,'curCode',item.curNo)
                            // 汇率
                            bcurrencyGetExrate({
                                date:this.form.etd?this.form.etd.slice(0,10) + ' 00:00:00':dateFormat(new Date(), "yyyy-MM-dd") + ' 00:00:00', // 开船日期
                                dc:row.dc
                            }).then(res=>{
                                for (let item of res.data.data) {
                                    if (item.code == row.curCode) {
                                        this.$set(row,'exrate',item.exrate)
                                    }
                                }
                            })
                            // 计算金额
                            this.$set(row,'amount',Number(row.price) * Number(row.quantity?row.quantity:0))
                            if (row.curCode == 'CNY') {
                                this.$set(row,'rmbAmount',row.amount)
                                this.$set(row,'usdAmount','')
                                this.$set(row,'rmbAmountNet',row.amount)
                                this.$set(row,'usdAmountNet','')
                            }else {
                                this.$set(row,'usdAmount',row.amount)
                                this.$set(row,'rmbAmount','')
                                this.$set(row,'usdAmountNet',row.amount)
                                this.$set(row,'rmbAmountNet','')
                            }
                        }
                    }
                }else if (name == 'unitNo') {
                    // 计量单位
                    this.$set(row,name,value)
                    for (let item of this.unitNoData) {
                        if (item.code == value) {
                            // 按箱型
                            if (item.quantityRule == 1) {
                                // 选择的箱那边的数据
                                if (item.boxquantity) {
                                    this.$set(row,'quantity',item.boxquantity)
                                }
                            }
                            // 按票
                            if (item.quantityRule == 2) {
                                this.$set(row,'quantity',1)
                            }
                            // 按重量
                            if (item.quantityRule == 3) {
                                this.$set(row,'quantity',this.form.grossWeight)
                            }
                            // 按TEU
                            if (item.quantityRule == 4) {
                                this.$set(row,'quantity',item.boxquantity)
                            }
                            // 按尺码
                            if (item.quantityRule == 5) {
                                this.$set(row,'quantity',this.form.measurement)
                            }
                            // 按件数
                            if (item.quantityRule == 6) {
                                this.$set(row,'quantity',this.form.quantity)
                            }
                        }
                    }
                    this.$set(row,'amount',Number(row.price?row.price:0) * Number(row.quantity?row.quantity:0))
                    if (row.curCode == 'CNY') {
                        this.$set(row,'rmbAmount',row.amount)
                        this.$set(row,'usdAmount','')
                        this.$set(row,'rmbAmountNet',row.amount)
                        this.$set(row,'usdAmountNet','')
                    }else {
                        this.$set(row,'usdAmount',row.amount)
                        this.$set(row,'rmbAmount','')
                        this.$set(row,'usdAmountNet',row.amount)
                        this.$set(row,'rmbAmountNet','')
                    }
                } else if (name == 'elementsCnName') {
                    if (!value) {
                        this.$set(row,'elementsId','')
                        this.$set(row,'elementsCnName','')
                        this.$set(row,'elementsCode','')
                        this.$set(row,'elementsEnName','')
                    }
                    // 核算要素
                    for (let item of this.elementsData) {
                        if (item.cnName == value) {
                            this.$set(row,'elementsId',item.id)
                            this.$set(row,'elementsCnName',item.cnName)
                            this.$set(row,'elementsCode',item.code)
                            this.$set(row,'elementsEnName',item.enName)
                        }
                    }
                }else if (name == 'curCode') {
                    for(let item of this.curCodeData) {
                        if (item.code == value){
                            if (item.code == 'USD') {
                                if (Number(item.exrate) <= 1) {
                                    this.$message.warning('当前选择的币别汇率不能小于零')
                                    return
                                }
                            }else {
                                if (Number(item.exrate) == 0) {
                                    this.$message.warning('当前选择的币别汇率不能为零')
                                    return
                                }
                            }
                            this.$set(row,'curCode',item.code)
                            this.$set(row,'exrate',item.exrate)
                            this.$set(row,'amount',Number(row.price) * Number(row.quantity?row.quantity:0))
                            if (row.curCode == 'CNY') {
                                this.$set(row,'rmbAmount',row.amount)
                                this.$set(row,'usdAmount','')
                                this.$set(row,'rmbAmountNet',row.amount)
                                this.$set(row,'usdAmountNet','')
                            }else {
                                this.$set(row,'usdAmount',row.amount)
                                this.$set(row,'rmbAmount','')
                                this.$set(row,'usdAmountNet',row.amount)
                                this.$set(row,'rmbAmountNet','')
                            }
                        }
                    }
                } else {
                    this.$set(row,name,value)
                }

            },
            // 费用信息明细保存按钮
            feecenterSubmitListfun(){
                if (!this.form.id) {
                    return this.$message.warning('请先保存数据')
                }
                // 判断必填项
                let sum = '请输入'
                for (let item of this.tableData) {
                    if (!item.dc) {
                        sum += ` 应收序号${item.$index + 1}收/付`
                    }
                    if (!item.corpId) {
                        sum += ` 应收序号${item.$index + 1}往来单位`
                    }
                    if (!item.feeId) {
                        sum += ` 应收序号${item.$index + 1}费用简称`
                    }
                    if (!item.elementsId) {
                        sum += ` 应收序号${item.$index + 1}核算要素`
                    }
                    if (!item.curCode) {
                        sum += ` 应收序号${item.$index + 1}币种`
                    }
                }
                if(sum != '请输入') {
                    this.$confirm(sum, {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    })
                    return;
                }
                this.$confirm("确定保存全部的费用信息?", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                }).then(()=>{
                    this.tableData.map((row,index)=>{
                        row.dc = row.dc
                        row.pid = this.form.id
                        row.sort = Number(index) + 1
                        row.businessType = this.form.businessType // 业务类型
                        row.billType = this.form.billType // 单据类型
                        row.billNo = this.form.billNo // 单据编号
                        row.billDate = this.form.billDate // 单据日期
                        row.billCorpId = this.form.corpId // 主表客户 id
                        row.billCorpCnName = this.form.corpCnName // 主表客户中文名称
                        row.billCorpEnName = this.form.corpEnName // 主表客户英文名称
                        row.lineId = this.form.lineId // 航线 id
                        row.lineCnName = this.form.lineCnName // 航线中文名称
                        row.lineEnName = this.form.lineEnName // 航线英文名称
                        row.vesselId = this.form.vesselId // 船名 id
                        row.vesselCnName = this.form.vesselCnName // 中文船名
                        row.vesselEnName = this.form.vesselEnName // 英文船名
                        row.voyageNo = this.form.voyageNo // 航次
                        row.mblno = this.form.mblno // MB/L NO
                        row.hblno = this.form.hblno // HB/L NO
                        row.etd = this.form.etd // 开船日期
                        row.eta = this.form.eta // 到港日期
                        row.polId = this.form.polId // 装货港 id
                        row.polCode = this.form.polCode // 装货港代码
                        row.polCnName = this.form.polCnName // 装货港中文名称
                        row.polEnName = this.form.polEnName // 装货港英文名称
                        row.podId = this.form.podId // 卸货港 id
                        row.podCode = this.form.podCode // 卸货港代码
                        row.podCnName = this.form.podCnName // 卸货港中文名称
                        row.podEnName = this.form.podEnName // 卸货港英文名称
                        row.corpArgreementNo = this.form.corpArgreementNo // 客户约号
                    })
                    feecenterSubmitList(this.tableData).then(res=>{
                        this.$message({
                            type: "success",
                            message: "操作成功!"
                        });
                        this.$emit('amendsDetailfun')
                    })
                })

            },
            // 单价
            priceinputfun(value,row){
                if (Number(value) <= 0) {
                    this.$message({
                        type: "warning",
                        message: "单价不能输入负数!"
                    });
                    return
                }
                this.$set(row,'amount',Number(row.price) * Number(row.quantity?row.quantity:0))
                // 判断是否有币种
                if (!row.curCode) {
                    return;
                }
                if (row.curCode == 'CNY') {
                    this.$set(row,'rmbAmount',row.amount)
                    this.$set(row,'usdAmount','')
                    this.$set(row,'rmbAmountNet',row.amount)
                    this.$set(row,'usdAmountNet','')
                }else {
                    this.$set(row,'usdAmount',row.amount)
                    this.$set(row,'rmbAmount','')
                    this.$set(row,'usdAmountNet',row.amount)
                    this.$set(row,'rmbAmountNet','')
                }
            },
            // 数量
            quantityinputfun(row) {
                if (row.quantity <= 0) {
                    this.$message({
                        type: "warning",
                        message: "数量不能输入负数!"
                    });
                    this.$set(row,'quantity',1)
                    return
                }
                this.$set(row,'amount',Number(row.price?row.price:0) * Number(row.quantity))
                // 判断是否有币种
                if (!row.curCode) {
                    return;
                }
                if (row.curCode == 'CNY') {
                    this.$set(row,'rmbAmount',row.amount)
                    this.$set(row,'usdAmount','')
                }else {
                    this.$set(row,'usdAmount',row.amount)
                    this.$set(row,'rmbAmount','')
                }
            },
            // 获取客户数据
            getBcorpsListfun(cnName){
                getBcorpsList(1,10,{cnName}).then(res=>{
                    this.corpCnNameData = res.data.data.records
                })
            },
            // 获取费用数据
            bfeesListfun(cnName){
                bfeesList(1,10,{cnName}).then(res=>{
                    this.feeCnNameData = res.data.data.records
                })
            },
            // 获取费用信息 核算要素信息
            getBaccelementsListfun(cnName){
                getBaccelementsList(1,10,{cnName}).then(res=>{
                    this.elementsData = res.data.data.records
                })
            },
            // 获取预付到付字典数据
            paymodeWorkDictsfun(){
                getWorkDicts('payment_method_los').then((res) => {
                    this.paymodeData = res.data.data
                })
            },
            // 获取币别数据
            bcurrencyGetExratefun(dc){
                bcurrencyGetExrate({
                    date:this.form.etd?this.form.etd.slice(0,10) + ' 00:00:00':dateFormat(new Date(), "yyyy-MM-dd") + ' 00:00:00', // 开船日期
                    dc:dc
                }).then(res=>{
                    this.curCodeData = res.data.data
                })
            },
            // 获取计算属性
            async getBunitsPagefun(type,feeRow,row){
                let srcBillId = null
                if (this.form.billType == 'MH') {
                    srcBillId = this.form.masterId
                }else {
                    srcBillId = this.form.id
                }
                const res = await getBunitsPage({srcBillId})
                this.unitNoData = []
                let boxarr40 = ['40HC','40GP']
                let boxarr20 = ['20GP']
                let teunum = 0
                for (let item of res.data.data) {
                    // 按箱型
                    if (item.quantityRule != 1) {
                        // TEU
                        if (item.quantityRule == 4) {
                            for (let data of this.form.preContainersList) {
                                if (boxarr40.indexOf(data.cntrTypeCode) != -1) {
                                    teunum += Number(data.quantity) * 2
                                }else if (boxarr20.indexOf(data.cntrTypeCode) != -1) {
                                    teunum += Number(data.quantity)
                                }
                            }
                            this.unitNoData.push({...item, boxquantity: teunum})
                        }else {
                            this.unitNoData.push(item) // 不是TEU和不是箱的走这个
                        }
                    }
                }
                let arr = this.form.preContainersList.map(item=>{
                    return {
                        quantityRule:1, // 1 是按箱量
                        code:item.cntrTypeCode,
                        boxquantity:item.quantity,
                    }
                })
                this.unitNoData = [...arr,...this.unitNoData]
                // 选择费用时带出第一条
                if (type) {
                    let feeunitNodata = []
                    for (let item of this.unitNoData) {
                        if (item.quantityRule == feeRow.unitNo) {
                            feeunitNodata.push(item)
                        }
                    }
                    this.corpChange(feeunitNodata[0].code,'unitNo',row)
                }
            },

            // 多选选择的数据
            handleSelectionChange(arr){
                // this.$emit('handleSelectionChange',arr)
                this.handleSelectionData = arr
            },
            //自定义列保存
            async saveColumnTwo(ref, option, optionBack, code) {
                /**
                 * 已定义全局方法，直接使用，saveColumnData保存列数据方法,参数传值(表格名称，当前表格的option数据)
                 * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
                 * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
                 */
                const inSave = await this.saveColumnData(this.getColumnName(code), this[option]);
                if (inSave) {
                    this.$message.success("保存成功");
                    //关闭窗口
                    this.$refs[ref].$refs.dialogColumn.columnBox = false;
                }
            },
            //自定义列重置
            async resetColumnTwo(ref, option, optionBack, code) {
                this[option] = this[optionBack];
                const inSave = await this.delColumnData(this.getColumnName(code), this[optionBack]);
                if (inSave) {
                    this.$message.success("重置成功");
                    this.$refs[ref].$refs.dialogColumn.columnBox = false;
                }
            },
            // 更改表格颜色
            headerClassName(tab) {
                //颜色间隔
                let back = ""
                if (tab.columnIndex >= 0 && tab.column.level === 1) {
                    if (tab.columnIndex % 2 === 0) {
                        back = "back-one"
                    } else if (tab.columnIndex % 2 === 1) {
                        back = "back-two"
                    }
                }
                return back;
            },

        },
    }
</script>

<style scoped>
::v-deep#out-table .back-one {
    background: #ecf5ff !important;
    text-align: center;
    padding: 4px 0;
}

::v-deep#out-table .back-two {
    background: #ecf5ff !important;
    text-align: center;
    padding: 4px 0;
}
</style>