tire-platform-ui/src/views/iosBasicData/periodManagement/index.vue

<template>
    <div>
        <basic-container v-show="!detailsOpen">
            <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
                <el-tab-pane label="会计期间" name="first">
                    <avue-crud :option="option" :search.sync="search" v-model="form" :table-loading="loading"
                        :data="dataList" ref="crud" :key="key" @on-load="onLoad" @search-change="searchChange"
                        @refresh-change="refreshChange" @resetColumn="resetColumnTwo('crud', 'option', 'optionList', 366)"
                        @saveColumn="saveColumnTwo('crud', 'option', 'optionList', 366)" :page.sync="page">
                        <template slot-scope="{type,size,row,index}" slot="menu">
                            <el-button size="small" :type="type" :disabled="row.lockingStatus != 0"
                                @click="lock(row, 1)">锁定</el-button>
                            <el-button size="small" :type="type" :disabled="row.lockingStatus != 1 || row.isClosed != 0"
                                @click="lock(row, 2)">撤销锁定</el-button>
                            <el-button size="small" :type="type" :disabled="row.lockingStatus != 1 || row.isClosed != 0"
                                @click="inClose(row, 1)">结转</el-button>
                            <el-button size="small" :type="type" :disabled="row.isClosed != 1"
                                @click="inClose(row, 2)">反结转</el-button>
                        </template>
                        <template slot-scope="{type,size,row,$index}" slot="menuLeft">
                            <el-button type="success" size="small" @click="openDialog = true; title = '开账'" v-if="showBut">开
                                账</el-button>
                            <el-button type="success" size="small" @click="openDialog = true; title = '账套初始化'"
                                v-if="!showBut">账套初始化</el-button>
                        </template>
                    </avue-crud>
                </el-tab-pane>
                <el-tab-pane label="月末结转" name="second">
                    <avue-crud :option="option2" :search.sync="search2" v-model="form2" :table-loading="loading"
                        :data="dataList2" ref="crud2" :key="key" @on-load="onLoad2" @search-change="searchChange2"
                        @refresh-change="refreshChange2"
                        @resetColumn="resetColumnTwo('crud2', 'option2', 'optionList2', 367)"
                        @saveColumn="saveColumnTwo('crud2', 'option2', 'optionList2', 367)">
                        <template slot-scope="{type,size,row,index}" slot="menu">
                            <el-button size="small" :type="type" @click="editOpen(row)">模板修改</el-button>
                            <el-button size="small" :type="type" @click="generate(row)">生成凭证</el-button>
                        </template>
                        <!-- <template slot-scope="{type,size,row,$index}" slot="menuLeft">
                            <el-button icon="el-icon-plus" type="primary" size="small"
                                @click="detailsOpen = true">新建申请</el-button>
                        </template> -->
                    </avue-crud>
                </el-tab-pane>
            </el-tabs>
        </basic-container>
        <detailsPage v-if="detailsOpen" @goBack="goBack" :onLoad="form" :detailData="detailData">
        </detailsPage>
        <el-dialog v-dialogdrag append-to-body :title="title" :visible.sync="openDialog" width="30%"
            :before-close="handleClose">
            <span v-if="title == '汇兑损益汇率' || '期间损益汇率'" style="display: flex;align-items: center;">
                <avue-crud :data="itemData" :option="itemOption"></avue-crud>
            </span>
            <span v-else-if="title == '开账' || '账套初始化'" style="display: flex;align-items: center;">
                开账日期：<avue-date size="small" type="datetime" v-model="openDate" format="yyyy-MM-dd HH:mm:ss"
                    value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择开张日期"></avue-date>
            </span>
            <el-dialog v-dialogdrag append-to-body title="凭证明细" :visible.sync="itemOpenDialog" width="50%"
                :before-close="handleClose2">
                <span style="display: flex;align-items: center;">
                    <avue-crud :data="itemForm2.finVouchersItemsList" :option="itemOption2"></avue-crud>
                </span>
                <span slot="footer" class="dialog-footer">
                    <el-button size="mini" @click="itemOpenDialog = false">取 消</el-button>
                    <el-button size="mini" type="primary" @click="onPeriod()">确 定</el-button>
                </span>
            </el-dialog>
            <span slot="footer" class="dialog-footer">
                <el-button size="mini" @click="openDialog = false">取 消</el-button>
                <el-button v-if="title == '开账'" size="mini" type="primary" @click="onBill">确 定</el-button>
                <el-button v-if="title == '账套初始化'" size="mini" type="primary" @click="resetBill">确 定</el-button>
                <el-button v-if="title == '汇兑损益汇率' || '期间损益汇率'" size="mini" type="primary" @click="inPeriod">确 定</el-button>
            </span>
        </el-dialog>
        <el-dialog v-dialogdrag append-to-body title="业务审核未通过明细" :visible.sync="openDialog2" width="50%"
            :before-close="handleClose3">
            <span style="display: flex;align-items: center;">
                <avue-crud :data="dialogData" :option="dialogOption"></avue-crud>
            </span>
            <span slot="footer" class="dialog-footer">
                <el-button size="mini" @click="openDialog2 = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="exportBut()">导 出</el-button>
            </span>
        </el-dialog>
        <el-dialog v-dialogdrag append-to-body title="凭证未记账数据" :visible.sync="openDialog3" width="50%"
            :before-close="handleClose4">
            <span style="display: flex;align-items: center;">
                <avue-crud :data="dialogData2" :option="dialogOption2"></avue-crud>
            </span>
            <span slot="footer" class="dialog-footer">
                <el-button size="mini" @click="openDialog3 = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="exportBut2()">导 出</el-button>
            </span>
        </el-dialog>
    </div>
</template>
  
<script>
import { getList, currentPeriod, open, init, locking, revokeLocking, close, unclose, generateVouchers, submitPeriod, getPeriodExchangeRate } from "@/api/iosBasicData/periodManagement";
import detailsPage from "./detailsPage"
import { defaultDate4 } from "@/util/date";

export default {
    name: "index",
    components: {
        detailsPage
    },
    data() {
        return {
            dialogOption: {
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                addBtn: false,
                index: false,
                border: true,
                menu: false,
                header: false,
                align: "center",
                size: "small",
                column: [
                    {
                        label: '业务模块',
                        prop: 'businessType',
                        overHidden: true,
                    },
                    {
                        label: '单据号',
                        prop: 'billNo',
                        overHidden: true,
                    },
                    {
                        label: '业务日期',
                        prop: 'businessDate',
                        overHidden: true,
                    },
                    {
                        label: '提单号',
                        prop: 'mblno',
                        overHidden: true,
                    },
                    {
                        label: '操作员',
                        prop: 'operator',
                        overHidden: true,
                    },
                    {
                        label: '业务员',
                        prop: 'salesperson',
                        overHidden: true,
                    }
                ]
            },
            openDialog2: false,
            dialogData: [],
            dialogOption2: {
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                addBtn: false,
                index: false,
                border: true,
                menu: false,
                header: false,
                align: "center",
                size: "small",
                column: [
                    {
                        label: '年',
                        prop: 'year',
                        overHidden: true,
                    },
                    {
                        label: '月',
                        prop: 'month',
                        overHidden: true,
                    },
                    {
                        label: '凭证号',
                        prop: 'voucherNumber',
                        overHidden: true,
                    },
                    {
                        label: '凭证日期',
                        prop: 'voucherDate',
                        overHidden: true,
                    },
                    {
                        label: '制单人',
                        prop: 'operator',
                        overHidden: true,
                    }
                ]
            },
            openDialog3: false,
            dialogData2: [],
            itemForm: {},
            itemData: [],
            itemOption: {
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                addBtn: false,
                index: false,
                border: true,
                menu: false,
                header: false,
                align: "center",
                size: "small",
                column: [
                    {
                        label: '币种代码',
                        prop: 'curCode'
                    }, {
                        label: '币种名称',
                        prop: 'curName'
                    }, {
                        label: '汇率日期',
                        prop: 'curDate'
                    }, {
                        label: '汇率',
                        prop: 'exrate',
                        type: 'number',
                        precision: 4,
                        step: 4,
                        cell: true
                    }
                ]
            },
            itemForm2: {},
            itemOption2: {
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                addBtn: false,
                index: false,
                border: true,
                menu: false,
                header: false,
                align: "center",
                size: "small",
                column: [
                    {
                        label: '摘要',
                        prop: 'descr',
                        overHidden: true,
                    },
                    {
                        label: '代码名称',
                        prop: 'accountCode',
                        overHidden: true,
                    },
                    {
                        label: '本币金额',
                        overHidden: true,
                        children: [{
                            label: '借方',
                            prop: 'amountDr',
                            overHidden: true,
                        }, {
                            label: '货方',
                            prop: 'amountCr',
                            overHidden: true,
                        }]
                    },
                    {
                        label: '外币金额',
                        overHidden: true,
                        children: [{
                            label: '币种',
                            prop: 'curCode',
                            overHidden: true,
                        }, {
                            label: '汇率',
                            prop: 'exrate',
                            overHidden: true,
                        }, {
                            label: '借方',
                            prop: 'amountDrUsd',
                            overHidden: true,
                        }, {
                            label: '货方',
                            prop: 'amountCrUsd',
                            overHidden: true,
                        }]
                    }
                ]
            },
            showBut: false,
            title: '开账',
            openDate: null,
            openDialog: false,
            itemOpenDialog: false,
            activeName: 'first',
            detailsOpen: false,
            loading: false,
            search: {
                periodYear: defaultDate4()
            },
            form: {},
            dataList: [],
            detailData: {},
            page: {
                pageSize: 20,
                currentPage: 1,
                total: 0,
                pageSizes: [10, 20, 30, 40, 50, 100, 200, 300, 400, 500]
            },
            key: 0,
            option: {},
            optionList: {
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                addBtn: false,
                index: true,
                span: 8,
                border: true,
                height: "auto",
                searchMenuPosition: "right",
                align: "center",
                size: "small",
                menuWidth: 200,
                searchSpan: 8,
                searchIcon: true,
                searchIndex: 2,
                dialogWidth: "70%",
                column: [
                    {
                        label: '会计年度',
                        prop: "periodYear",
                        search: true,
                        overHidden: true,
                        hide: true,
                        type: "year",
                        valueFormat: "yyyy"
                    },
                    {
                        label: '期间',
                        prop: "periodDate",
                        overHidden: true,
                    },
                    {
                        label: '开始时间',
                        prop: "beginDate",
                        search: true,
                        overHidden: true,
                        type: "date",
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd 00:00:00"
                    },
                    {
                        label: '结束时间',
                        prop: "endDate",
                        type: "date",
                        overHidden: true,
                        search: true,
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd 23:59:59"
                    },
                    {
                        label: '结转状态',
                        prop: "isClosed",
                        type: 'select',
                        overHidden: true,
                        search: true,
                        dicData: [
                            {
                                label: '未结转',
                                value: 0,
                            }, {
                                label: '已结转',
                                value: 1,
                            }
                        ]
                    },
                    {
                        label: '结转时间',
                        prop: "closeDate",
                        searchProp: "closeDateList",
                        overHidden: true,
                        search: true,
                        type: "date",
                        searchRange: true,
                        searchDefaultTime: ["00:00:00", "23:59:59"],
                        format: "yyyy-MM-dd",
                        valueFormat: "yyyy-MM-dd HH:mm:ss"
                    }
                ]
            },
            search2: {},
            form2: {},
            dataList2: [],
            detailData2: {},
            option2: {},
            optionList2: {
                viewBtn: false,
                editBtn: false,
                delBtn: false,
                addBtn: false,
                index: true,
                span: 8,
                border: true,
                height: "auto",
                searchMenuPosition: "right",
                align: "center",
                size: "small",
                menuWidth: 200,
                dialogWidth: "70%",
                column: [
                    {
                        label: '结转凭证',
                        prop: "descr",
                        overHidden: true,
                    },
                    {
                        label: '开始时间',
                        prop: "date",
                        overHidden: true,
                    },
                    {
                        label: '状态',
                        prop: "status",
                        type: 'select',
                        overHidden: true,
                        dicData: [
                            {
                                label: '未结转',
                                value: 0,
                            }, {
                                label: '已结转',
                                value: 1,
                            }
                        ]
                    }
                ]
            },
        }
    },
    async created() {
        this.option = await this.getColumnData(this.getColumnName(366), this.optionList);
        this.option2 = await this.getColumnData(this.getColumnName(367), this.optionList2);
    },
    methods: {
        lock(row, type) {
            if (type == '1') {
                this.$confirm('是否锁定?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.loading = true
                    locking({ id: row.id }).then(res => {
                        if (res.data.msg == '审核未通过') {
                            this.loading = false
                            this.openDialog2 = true
                            this.dialogData=res.data.data
                        }else if(res.data.msg=='凭证未记账'){
                            this.loading = false
                            this.openDialog3 = true
                            this.dialogData2=res.data.data
                        } else {
                            this.loading = false
                            this.$message.success("锁定成功");
                            this.handleClick(this.activeName)
                            
                        }

                    })
                })
            } else {
                this.$confirm('是否撤销锁定?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.loading = true
                    revokeLocking({ id: row.id }).then(res => {
                        this.loading = false
                        this.$message.success("撤销锁定");
                        this.handleClick(this.activeName)
                    })
                })
            }
        },
        inClose(row, type) {
            if (type == '1') {
                this.$confirm('是否结转?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.loading = true
                    close({ id: row.id }).then(res => {
                        this.loading = false
                        this.$message.success("结转成功");
                        this.handleClick(this.activeName)
                    })
                })
            } else {
                this.$confirm('是否反结转?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.loading = true
                    unclose({ id: row.id }).then(res => {
                        this.loading = false
                        this.$message.success("反结转成功");
                        this.handleClick(this.activeName)
                    })
                })
            }
        },
        onBill() {
            this.$confirm('确认开账?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.loading = true
                open({ beginDate: this.openDate }).then(res => {
                    this.loading = false
                    this.$message.success("开账成功");
                    this.handleClick(this.activeName)
                    this.handleClose()
                })
            })
        },
        handleClose() {
            this.itemForm = {}
            this.openDate = null
            this.openDialog = false
        },
        handleClose2() {
            this.itemData2 = []
            this.itemOpenDialog = false
        },
        handleClose3() {
            this.dialogData = []
            this.openDialog2 = false
        },
        handleClose4() {
            this.dialogData2 = []
            this.openDialog3 = false
        },
        resetBill() {
            this.$confirm('确认账套初始化?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.loading = true
                init({ beginDate: this.openDate }).then(res => {
                    this.loading = false
                    this.$message.success("初始化成功");
                    this.handleClick(this.activeName)
                    this.handleClose()
                })
            })
        },
        handleClick(val) {
            if (val == 'first') {
                this.onLoad(this.page, this.search)
            } else {
                this.onLoad2(this.search2)
            }
        },
        goBack(type) {
            this.form = {}
            this.detailsOpen = false
            this.onLoad(this.page, this.search)
        },
        editOpen(row, status) {
            this.form = row
            this.detailData = {
                id: row.id,
                type: row.bsType,
                status: status
            };
            this.detailsOpen = true;
        },
        generate(row) {
            this.openDialog = true;
            this.itemForm = row;
            this.title = row.bsType == 'FM-CURRENCY-PL-TRANSFER' ? '汇兑损益汇率' : '期间损益汇率';
            getPeriodExchangeRate().then(res => {
                res.data.data.forEach(e => {
                    e.$cellEdit = true
                })
                this.itemData = res.data.data
            })
        },
        inPeriod() {
            let obj = {}
            obj = { ...this.itemForm, exchangeRateList: this.itemData }

            generateVouchers(obj).then(res => {
                console.log(res)
                this.itemForm2 = res.data.data
                this.handleClose()
                this.itemOpenDialog = true
            })

        },
        onPeriod() {
            if (this.itemForm2.finVouchersItemsList.length == 0) {
                return this.$message.error("明细不能为空");
            }
            this.$confirm('确定保存凭证?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.loading = true
                submitPeriod(this.itemForm2).then(res => {
                    this.$message.success("保存成功");
                    this.handleClose2()
                }).finally(() => {
                    this.loading = false
                })
            })

        },
        //刷新
        refreshChange() {
            this.onLoad(this.page, this.search)
        },
        searchChange(params, done) {
            this.page.currentPage = 1
            done();
            this.onLoad(this.page, params)
        },
        onLoad(page, params = {}) {
            console.log(params)
            params = {
                ...Object.assign(params, this.search),
                current: page.currentPage,
                size: page.pageSize,
            }
            this.loading = true
            getList(params).then(res => {
                this.dataList = res.data.data.records
                this.page.total = res.data.data.total;
                this.showBut = res.data.data.records.length == 0 ? true : false;
                this.loading = false
            }).finally(() => {
                this.loading = false
            })
        },
        //刷新
        refreshChange2() {
            this.onLoad2(this.search)
        },
        searchChange2(params, done) {
            this.page.currentPage = 1
            done();
            this.onLoad(params)
        },
        onLoad2(page, params = {}) {
            params = {
                ...params
            }
            this.loading = true
            currentPeriod(params).then(res => {
                this.dataList2 = res.data.data
                this.loading = false
            }).finally(() => {
                this.loading = false
            })
        },
        //自定义列保存
        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;
            }
        }
    }
}
</script>
  
<style scoped>
.bottomBox {
    padding: 3px 6px;
    border-radius: 12px;
    color: #fff;
    font-size: 10px;
}
</style>