Smart_platform_ui/src/components/tradeAgency/fee-info.vue

<template>
    <div>
        <avue-crud :option="optionD" :table-loading="loading" :data="form.feeCenterListD" id="out-table" ref="crudD"
            @selection-change="selectionDChange" @resetColumn="resetColumn('crudD', 'optionD', 'optionDBack', 381)"
            @saveColumn="saveColumn('crudD', 'optionD', 'optionDBack', 381)">
            <template slot="menuLeft">
                <div style="display: inline-block;margin-right: 20px" class="disabledBox fontSize">
                    <i class="el-icon-coin"></i>
                    <span>应收费用</span>
                </div>
                <el-button type="info" plain size="small" :disabled="disabled"
                    @click="allClick('一键保存', 'D')">一键保存</el-button>
                <el-button type="info" plain size="small" :disabled="disabled"
                    @click="allClick('一键编辑', 'D')">一键编辑</el-button>
                <el-button type="danger" plain size="small" :disabled="disabled || selectionDList.length == 0"
                    @click="allClick('批量删除', 'D')">批量删除</el-button>
                <el-button type="primary" plain size="small" :disabled="disabled || selectionDList.length == 0"
                    @click="allClick('生成账单', 'D')">生成账单</el-button>
                <el-button type="danger" plain size="small" :disabled="disabled || selectionDList.length == 0"
                    @click="allClick('撤销账单', 'D')">撤销账单</el-button>
                <!-- <el-button type="primary" plain size="small" :disabled="disabled"
                    @click="allClick('打印账单', 'D')">打印账单</el-button>
                <el-button type="success" plain size="small" :disabled="disabled"
                    @click="allClick('应收模板', 'D')">应收模板</el-button>
                <el-button type="primary" plain size="small" :disabled="disabled"
                    @click="allClick('生成应收', 'D')">生成应收</el-button> -->
            </template>
            <template slot="indexHeader" slot-scope="{row,index}">
                <el-button type="primary" size="mini" icon="el-icon-plus" :disabled="disabled" circle @click="addRow('D')">
                </el-button>
            </template>
            <template slot="index" slot-scope="{row,index}">
                <span>{{ index + 1 }}</span>
            </template>
            <template slot="corpCnName" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.corpCnName" placeholder="往来单位" key="id" label="cnName"
                    res="records" url="/blade-los/bcorps/listByType" :filterable="true" :remote="true" dataName="cnName"
                    @selectChange="rowDicChange('corpCnName', $event, row)"></dic-select>
                <span v-else>{{ row.corpCnName }}</span>
            </template>
            <template slot="feeCnName" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.feeCnName" placeholder="费用名称" key="id" label="cnName"
                    res="records" url="/blade-los/bfees/list" :filterable="true" :remote="true" dataName="cnName"
                    @selectChange="rowDicChange('feeCnName', $event, row)"></dic-select>
                <span v-else>{{ row.feeCnName }}</span>
            </template>
            <template slot="unitNo" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.unitNo" placeholder="收费标准" key="id" label="code"
                    url="/blade-los/bunits/selectList" :filterable="true"
                    @selectChange="rowDicChange('unitNo', $event, row)"></dic-select>
                <span v-else>{{ row.unitNo }}</span>
            </template>
            <tempalte slot="quantity" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.quantity" @change="countChange(row)" :controls="false"
                    placeholder="请输入 数量" size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.quantity }}</span>
            </tempalte>
            <tempalte slot="price" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.price" @change="countChange(row)" :controls="false"
                    placeholder="请输入 单价" size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.price }}</span>
            </tempalte>
            <template slot="curCode" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.curCode" placeholder="币别" key="id" label="code"
                    :url="'/blade-los/bcurrency/getExrate?date=' + form.contractDate + '&dc=' + row.dc" :filterable="true"
                    @selectChange="rowDicChange('curCode', $event, row)"></dic-select>
                <span v-else>{{ row.curCode }}</span>
            </template>
            <tempalte slot="exrate" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.exrate" @change="countChange(row)" :controls="false"
                    placeholder="请输入 汇率" size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.exrate }}</span>
            </tempalte>
            <tempalte slot="stlExrate" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.stlExrate" :controls="false" placeholder="请输入 结算汇率"
                    size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.stlExrate }}</span>
            </tempalte>
        </avue-crud>
        <avue-crud style="margin-top: 10px;" :option="optionC" :table-loading="loading" :data="form.feeCenterListC"
            id="out-table" ref="crudC" @selection-change="selectionCChange"
            @resetColumn="resetColumn('crudC', 'optionC', 'optionCBack', 382)"
            @saveColumn="saveColumn('crudC', 'optionC', 'optionCBack', 382)">
            <template slot="menuLeft">
                <div style="display: inline-block;margin-right: 20px" class="disabledBox fontSize">
                    <i class="el-icon-coin"></i>
                    <span>应付费用</span>
                </div>
                <el-button type="info" plain size="small" :disabled="disabled"
                    @click="allClick('一键保存', 'C')">一键保存</el-button>
                <el-button type="info" plain size="small" :disabled="disabled"
                    @click="allClick('一键编辑', 'C')">一键编辑</el-button>
                <el-button type="danger" plain size="small" :disabled="disabled || selectionCList.length == 0"
                    @click="allClick('批量删除', 'C')">批量删除</el-button>
                <el-button type="primary" plain size="small" :disabled="disabled || selectionCList.length == 0"
                    @click="allClick('生成账单', 'C')">生成账单</el-button>
                <el-button type="danger" plain size="small" :disabled="disabled || selectionCList.length == 0"
                    @click="allClick('撤销账单', 'C')">撤销账单</el-button>
                <!-- <el-button type="primary" plain size="small" :disabled="disabled"
                    @click="allClick('打印账单', 'C')">打印账单</el-button>
                <el-button type="success" plain size="small" :disabled="disabled"
                    @click="allClick('应付模板', 'C')">应付模板</el-button>
                <el-button type="primary" plain size="small" :disabled="disabled"
                    @click="allClick('生成应付', 'C')">生成应付</el-button> -->
            </template>
            <template slot="indexHeader" slot-scope="{row,index}">
                <el-button type="primary" size="mini" icon="el-icon-plus" :disabled="disabled" circle @click="addRow('C')">
                </el-button>
            </template>
            <template slot="index" slot-scope="{row,index}">
                <span>{{ index + 1 }}</span>
            </template>
            <template slot="corpCnName" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.corpCnName" placeholder="往来单位" key="id" label="cnName"
                    res="records" url="/blade-los/bcorps/listByType" :filterable="true" :remote="true" dataName="cnName"
                    @selectChange="rowDicChange('corpCnName', $event, row)"></dic-select>
                <span v-else>{{ row.corpCnName }}</span>
            </template>
            <template slot="feeCnName" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.feeCnName" placeholder="费用名称" key="id" label="cnName"
                    res="records" url="/blade-los/bfees/list" :filterable="true" :remote="true" dataName="cnName"
                    @selectChange="rowDicChange('feeCnName', $event, row)"></dic-select>
                <span v-else>{{ row.feeCnName }}</span>
            </template>
            <template slot="unitNo" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.unitNo" placeholder="收费标准" key="id" label="code"
                    url="/blade-los/bunits/selectList" :filterable="true"
                    @selectChange="rowDicChange('unitNo', $event, row)"></dic-select>
                <span v-else>{{ row.unitNo }}</span>
            </template>
            <tempalte slot="quantity" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.quantity" @change="countChange(row)" :controls="false"
                    placeholder="请输入 数量" size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.quantity }}</span>
            </tempalte>
            <tempalte slot="price" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.price" @change="countChange(row)" :controls="false"
                    placeholder="请输入 单价" size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.price }}</span>
            </tempalte>
            <template slot="curCode" slot-scope="{ row }">
                <dic-select v-if="row.$cellEdit" v-model="row.curCode" placeholder="币别" key="id" label="code"
                    :url="'/blade-los/bcurrency/getExrate?date=' + form.contractDate + '&dc=' + row.dc" :filterable="true"
                    @selectChange="rowDicChange('curCode', $event, row)"></dic-select>
                <span v-else>{{ row.curCode }}</span>
            </template>
            <tempalte slot="exrate" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.exrate" @change="countChange(row)" :controls="false"
                    placeholder="请输入 汇率" size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.exrate }}</span>
            </tempalte>
            <tempalte slot="stlExrate" slot-scope="{ row }">
                <el-input-number v-if="row.$cellEdit" v-model="row.stlExrate" :controls="false" placeholder="请输入 结算汇率"
                    size="small" style="width: 100%;"></el-input-number>
                <span v-else>{{ row.stlExrate }}</span>
            </tempalte>
        </avue-crud>
    </div>
</template>

<script>
import dicSelect from "@/components/dicSelect/main";
import { bcurrencyGetExrate } from "@/api/iosBasicData/rateManagement";
import { submitListTrade, feeRemove, generateBill, revokeBill } from "@/api/tradeAgency/tradeAgency";
import _ from "lodash";
export default {
    components: {
        dicSelect
    },
    props: {
        detailData: {},
        disabled: {
            type: Boolean,
            default: false,
        },
        form: {
            type: Object,
            default: () => {
            }
        }
    },
    data() {
        return {
            optionD: {},
            optionDBack: {
                height: 'auto',
                calcHeight: 30,
                menuWidth: 140,
                tip: false,
                border: true,
                addBtn: false,
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                menu: false,
                refreshBtn: false,
                selection: true,
                align: 'center',
                column: [
                    {
                        label: "index",
                        prop: "index",
                        width: "55",
                        headerslot: true,
                    },
                    {
                        label: "账单",
                        prop: "accStatus",
                        width: '80',
                        overHidden: true,
                        dicData: [{
                            label: '否',
                            value: 0
                        }, {
                            label: '是',
                            value: 1
                        }]
                    },
                    {
                        label: "往来单位",
                        prop: "corpCnName",
                        width: '160',
                        overHidden: true,
                    },
                    {
                        label: "费用名称",
                        prop: "feeCnName",
                        width: '120',
                        overHidden: true,
                    },
                    {
                        label: "收费标准",
                        prop: "unitNo",
                        width: '120',
                        overHidden: true,
                    },
                    {
                        label: "单价",
                        prop: "price",
                        overHidden: true,
                    },
                    {
                        label: "数量",
                        prop: "quantity",
                        overHidden: true,
                    },
                    {
                        label: "金额",
                        prop: "amount",
                        overHidden: true,
                    },
                    {
                        label: "币别",
                        prop: "curCode",
                        overHidden: true,
                    },
                    {
                        label: "外币金额",
                        prop: "amountLoc",
                        overHidden: true,
                    },
                    {
                        label: "汇率",
                        prop: "exrate",
                        overHidden: true,
                    },
                    {
                        label: "结算汇率",
                        prop: "stlExrate",
                        overHidden: true,
                    },
                    {
                        label: "备注",
                        prop: "remarks",
                        cell: true,
                        width: '200',
                        overHidden: true,
                    },
                ]
            },
            optionC: {},
            optionCBack: {
                height: 'auto',
                calcHeight: 30,
                menuWidth: 140,
                tip: false,
                border: true,
                addBtn: false,
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                menu: false,
                refreshBtn: false,
                selection: true,
                align: 'center',
                column: [
                    {
                        label: "index",
                        prop: "index",
                        width: "55",
                        headerslot: true,
                    },
                    {
                        label: "账单",
                        prop: "accStatus",
                        width: '80',
                        overHidden: true,
                        dicData: [{
                            label: '否',
                            value: 0
                        }, {
                            label: '是',
                            value: 1
                        }]
                    },
                    {
                        label: "往来单位",
                        prop: "corpCnName",
                        width: '160',
                        overHidden: true,
                    },
                    {
                        label: "费用名称",
                        prop: "feeCnName",
                        width: '120',
                        overHidden: true,
                    },
                    {
                        label: "收费标准",
                        prop: "unitNo",
                        width: '120',
                        overHidden: true,
                    },
                    {
                        label: "单价",
                        prop: "price",
                        overHidden: true,
                    },
                    {
                        label: "数量",
                        prop: "quantity",
                        overHidden: true,
                    },
                    {
                        label: "金额",
                        prop: "amount",
                        overHidden: true,
                    },
                    {
                        label: "币别",
                        prop: "curCode",
                        overHidden: true,
                    },
                    {
                        label: "外币金额",
                        prop: "amountLoc",
                        overHidden: true,
                    },
                    {
                        label: "汇率",
                        prop: "exrate",
                        overHidden: true,
                    },
                    {
                        label: "结算汇率",
                        prop: "stlExrate",
                        overHidden: true,
                    },
                    {
                        label: "备注",
                        prop: "remarks",
                        cell: true,
                        width: '200',
                        overHidden: true,
                    },
                ]
            },
            selectionDList: [],
            selectionCList: []

        }
    },
    async created() {
        this.optionD = await this.getColumnData(this.getColumnName(381), this.optionDBack);
        this.optionC = await this.getColumnData(this.getColumnName(382), this.optionCBack);
    },
    methods: {
        addRow(type) {
            if (!this.form.id) return this.$message.error('请保存数据');
            if (type == 'D') {
                this.form.feeCenterListD.push({
                    $cellEdit: true,
                    pid: this.form.id,
                    dc: type,
                    accStatus: 0,
                    businessType: this.form.businessType,
                    billNo: this.form.businessNo,
                    billDate: this.form.businessDate
                })
            }
            if (type == 'C') {
                this.form.feeCenterListC.push({
                    $cellEdit: true,
                    pid: this.form.id,
                    dc: type,
                    accStatus: 0,
                    businessType: this.form.businessType,
                    billNo: this.form.businessNo,
                    billDate: this.form.businessDate
                })
            }
        },
        countChange(row) {
            row.amount = _.multiply(Number(row.quantity ? row.quantity : 0), Number(row.price ? row.price : 0))
            if (row.feeCnName == '首付款' || row.feeCnName == '尾款') {
                row.amount = _.multiply(Number(row.amountLoc ? row.amountLoc : 0), Number(row.exrate ? row.exrate : 0))
            }
        },
        selectionDChange(list) {
            this.selectionDList = list
        },
        selectionCChange(list) {
            this.selectionCList = list
        },
        rowDicChange(name, row, el) {
            if (name == 'corpCnName') {
                if (row) {
                    el.corpId = row.id
                    el.corpEnName = row.enName
                    el.billCorpId = row.id
                    el.billCorpCnName = row.cnName
                } else {
                    el.corpId = null
                    el.corpEnName = null
                    el.billCorpId = null
                    el.billCorpCnName = null
                }
            }
            if (name == 'feeCnName') {
                if (row) {
                    el.feeId = row.id
                    el.feeCode = row.code
                    el.feeEnName = row.enName
                    el.curCode = row.curNo
                    el.elementsId = row.accElementId
                    el.elementsCode = row.elementsCode
                    el.elementsCnName = row.accElementName
                    el.elementsEnName = row.elementsEnName
                    bcurrencyGetExrate({ date: this.form.contractDate, dc: el.dc }).then(res => {
                        res.data.data.forEach(e => {
                            if (row.curNo == e.code) {
                                this.$set(el, 'exrate', e.exrate)
                            }
                        })
                    })
                } else {
                    el.feeId = null
                    el.feeCode = null
                    el.feeEnName = null
                    el.curCode = null
                    el.elementsId = null
                    el.elementsCode = null
                    el.elementsCnName = null
                    el.elementsEnName = null
                }
            }
            if (name == 'curCode') {
                if (row) {
                    bcurrencyGetExrate({ date: this.form.contractDate, dc: el.dc }).then(res => {
                        res.data.data.forEach(e => {
                            if (el.curCode == e.code) {
                                this.$set(el, 'exrate', e.exrate)
                            }
                        })
                    })
                } else {
                    el.exrate = null
                }
            }
        },
        allClick(name, type) {
            if (name == '一键保存') {
                if (type == 'D') {
                    this.form.feeCenterListD.forEach(e => {
                        this.$set(e, '$cellEdit', false)
                    })
                    const loading = this.$loading({
                        lock: true,
                        text: '加载中',
                        spinner: 'el-icon-loading',
                        background: 'rgba(255,255,255,0.7)'
                    });
                    submitListTrade(this.form.feeCenterListD).then(res => {
                        this.form.feeCenterListD = res.data.data
                        this.$message.success("保存成功");
                    }).finally(() => {
                        loading.close();
                    })
                }
                if (type == 'C') {
                    this.form.feeCenterListC.forEach(e => {
                        this.$set(e, '$cellEdit', false)
                    })
                    const loading = this.$loading({
                        lock: true,
                        text: '加载中',
                        spinner: 'el-icon-loading',
                        background: 'rgba(255,255,255,0.7)'
                    });
                    submitListTrade(this.form.feeCenterListC).then(res => {
                        this.form.feeCenterListC = res.data.data
                        this.$message.success("保存成功");
                    }).finally(() => {
                        loading.close();
                    })
                }
            }
            if (name == '一键编辑') {
                if (type == 'D') {
                    this.form.feeCenterListD.forEach(e => {
                        this.$set(e, '$cellEdit', true)
                    })
                }
                if (type == 'C') {
                    this.form.feeCenterListC.forEach(e => {
                        this.$set(e, '$cellEdit', true)
                    })
                }
            }
            if (name == '批量删除') {
                let multiList = []
                let arr = []
                for (let index in this.selectionDList) {
                    if (this.selectionDList[index].accStatus == 1) return this.$message.error("第" + (Number(this.selectionDList[index].$index) + 1) + "行不允许删除");
                }
                for (let index in this.selectionCList) {
                    if (this.selectionCList[index].accStatus == 1) return this.$message.error("第" + (Number(this.selectionCList[index].$index) + 1) + "行不允许删除");
                }
                if (type == 'D') {
                    this.$confirm("确定将选择数据删除?", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    }).then(() => {
                        multiList = this.selectionDList
                        arr = this.form.feeCenterListD
                        // 获取有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)
                                }
                            }
                        })
                        if (itemsWithId.length != 0) {
                            const loading = this.$loading({
                                lock: true,
                                text: '加载中',
                                spinner: 'el-icon-loading',
                                background: 'rgba(255,255,255,0.7)'
                            });
                            feeRemove({ ids: arrIds.join(',') }).then(res => {
                                this.$message.success("删除成功");
                            }).finally(() => {
                                loading.close();
                            })
                        }
                    })
                }
                if (type == 'C') {
                    this.$confirm("确定将选择数据删除?", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    }).then(() => {
                        multiList = this.selectionCList
                        arr = this.form.feeCenterListC
                        // 获取有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)
                                }
                            }
                        })
                        if (itemsWithId.length != 0) {
                            const loading = this.$loading({
                                lock: true,
                                text: '加载中',
                                spinner: 'el-icon-loading',
                                background: 'rgba(255,255,255,0.7)'
                            });
                            feeRemove({ ids: arrIds.join(',') }).then(res => {
                                this.$message.success("删除成功");
                            }).finally(() => {
                                loading.close();
                            })
                        }
                    })
                }
            }
            if (name == '生成账单') {
                if (type == 'D') {
                    for (let index in this.selectionDList) {
                        if (this.selectionDList[index].accStatus != 0) {
                            return this.$message.error("已生成账单");
                        }
                    }
                    this.$confirm("确定将选择数据生成账单?", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    }).then(() => {
                        const loading = this.$loading({
                            lock: true,
                            text: '加载中',
                            spinner: 'el-icon-loading',
                            background: 'rgba(255,255,255,0.7)'
                        });
                        generateBill({ id: this.form.id, feeCenterListD: this.selectionDList }).then(res => {
                            this.$message.success("成功生成账单");
                            this.$emit('getDetails', this.form.id)
                        }).finally(() => {
                            loading.close();
                        })
                    })
                }
                if (type == 'C') {
                    for (let index in this.selectionCList) {
                        if (this.selectionCList[index].accStatus != 0) {
                            return this.$message.error("已生成账单");
                        }
                    }
                    this.$confirm("确定将选择数据生成账单?", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    }).then(() => {
                        const loading = this.$loading({
                            lock: true,
                            text: '加载中',
                            spinner: 'el-icon-loading',
                            background: 'rgba(255,255,255,0.7)'
                        });
                        generateBill({ id: this.form.id, feeCenterListC: this.selectionCList }).then(res => {
                            this.$message.success("成功生成账单");
                            this.$emit('getDetails', this.form.id)
                        }).finally(() => {
                            loading.close();
                        })
                    })
                }


            }
            if (name == '撤销账单') {
                if (type == 'D') {
                    for (let index in this.selectionDList) {
                        if (this.selectionDList[index].accStatus != 1) {
                            return this.$message.error("未生成账单");
                        }
                    }
                    this.$confirm("确定将选择数据撤销账单?", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    }).then(() => {
                        const loading = this.$loading({
                            lock: true,
                            text: '加载中',
                            spinner: 'el-icon-loading',
                            background: 'rgba(255,255,255,0.7)'
                        });
                        revokeBill({ id: this.form.id, feeCenterListD: this.selectionDList }).then(res => {
                            this.$message.success("成功撤销账单");
                            this.$emit('getDetails', this.form.id)
                        }).finally(() => {
                            loading.close();
                        })
                    })
                }
                if (type == 'C') {
                    for (let index in this.selectionCList) {
                        if (this.selectionCList[index].accStatus != 1) {
                            return this.$message.error("未生成账单");
                        }
                    }
                    this.$confirm("确定将选择数据撤销账单?", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning"
                    }).then(() => {
                        const loading = this.$loading({
                            lock: true,
                            text: '加载中',
                            spinner: 'el-icon-loading',
                            background: 'rgba(255,255,255,0.7)'
                        });
                        revokeBill({ id: this.form.id, feeCenterListC: this.selectionCList }).then(res => {
                            this.$message.success("成功撤销账单");
                            this.$emit('getDetails', this.form.id)
                        }).finally(() => {
                            loading.close();
                        })
                    })
                }

            }
        },
        //自定义列保存
        async saveColumn(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 resetColumn(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;
            }
        },

    },
}
</script>

<style scoped lang="scss">
.disabledBox {
    display: flex;
    align-items: center;
}

.fontSize {
    font-size: 16px;
    color: #81B337;
}

.meetSize {
    font-size: 16px;
    color: #54BCBD;
}

::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>