<script>
import {
    getSuppliesTemplate, getyy,
    listSuppliesTemplate,
    roleList,
    templateListid
} from '@/api/ruoyi-myLuckyexcel/myluckyexcel'
import { powerall, powerdata } from "@/api/power/power.js";
import {
    importTSExcel
} from "@/api/conversion/power";
// import luckysheet from 'luckysheet'
import LuckyExcel from "luckyexcel";
//导入库export.js 这个文件是es6的,不能在普通的HTML文件直接引入js文件(虽然都是js文件,但是有区别,具体请百度es6与es5)!需要把es6转es5才可以直接引入使用!
/*import {materialList} from "@/api/ruoyi-myLuckyexcel/myluckyexcel";*/
import { v4 as uuidv4 } from "uuid";
import { exportExcel } from "../../../../public/exportExcel";
import { jxdfxt, setTs } from "@/views/system/power/ass.js";


import { machGzdata } from "@/Wages/conversTsk.js";
import { machLxGzdata } from "@/Wages/conversLxk.js";
import { getyyData, transformJson, tzcCreateData } from '@/utils/tzc'
// import { config } from "vue/types/umd";
var fileName = "新建XLSX工作表"; //定义表名
var rule = [];
var tempId;
var uuid1;
var modify = false;
var that;
export default {
    props: {
        kobj: {
            type: Object,
        },
        depssfilter: {
            type: Array,
            // 定义默认值
        },
        itemConfig: {
            type: Object,
        },
        CConfig:{
            type: Object,
        }
    },
    name: "Mymodule",
    data() {
        return {
            views:'汇总',
            shuju:'',
            wageMonth: "",
            //汇总表数据 || 凭证数据
            luckyrule: '',
            //详细信息
            phone: "",
            //未导入成本材料表模板所有数据
            jsondata: "",
            //编码数据
            showMask: false,
            uuid: "",
            selectedOption: "",
            luckysheetData: "",
            luckysheetDatas: "",
            depss: [],
            fileList: [],
            VoucherForm: "",
            all: "",
            sum: [],
            //后端要的数据
            currfile: '',
            // 查询参数
            queryParams: {
                status: 0,
            },
            mineId: '',//矿ID
        };
    },
    created() {
        that = this;
        //刷新页面时进行的操作
        this.getList();
    },

    mounted() {
        this.init();
        fileName = "新建XLSX工作表";
    },
    methods: {
        huizi(){
            this.views = '汇总';
            luckysheet.create({
                container: "luckysheet", // Luckysheet 的容器元素 ID
                title: '汇总', // Excel 文件名
                allowEdit: false, //作用:是否允许前台编辑
                data: this.shuju, // Excel 数据
                showinfobar: false, //是否显示顶部名称栏
                lang: "zh",
            });
            this.shuju = null;
        },
        //查询材料编码
        //手机号
        open() {
            this.$prompt("请输入用友系统的用户名", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                inputPattern: /^(?:\+?86)?1[3-9]\d{9}$/,
                inputErrorMessage: "手机号格式不正确",
            })
                .then(({ value }) => {
                    this.$message({
                        type: "success",
                        message: "你的用户名是: " + value,
                    });
                    this.phone = value;
                    this.zhuan();
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "取消输入",
                    });
                    this.showMask = false;
                });
        },
        /** 页面刷新时展示的数据*/
        getList() {
            listSuppliesTemplate(this.queryParams).then((response) => {
                response.rows.forEach((row) => {
                    if (row.templateName.includes("六矿")) {
                        row.disabled = true;
                    }
                });
                this.depss = response.rows;
            });
            getSuppliesTemplate(1248).then((response) => {
                const sysSupplies = response.rows;
                this.luckysheetDatas = JSON.parse(
                    sysSupplies[0].templateContent
                );
            });
        },
        open4() {
            this.$message.error("请仔细检查所导入表");
        },
        /** Luckyexcel文档 */
        init() {
            let options = {
                container: "luckysheet", //luckysheet为容器id
                title: "",
                lang: "zh",
                showinfobar: false,
                data: [
                    {
                        name: "sheet1", //工作表名称
                        color: "", //工作表颜色
                        index: 0, //工作表索引
                        status: 1, //激活状态
                        order: 0, //工作表的下标
                        hide: 0, //是否隐藏
                        row: 50, //行数
                        column: 20, //列数
                        defaultRowHeight: 19, //自定义行高
                        defaultColWidth: 73, //自定义列宽
                        celldata: [], //初始化使用的单元格数据
                        config: {
                            merge: {}, //合并单元格
                            rowlen: {}, //表格行高
                            columnlen: {}, //表格列宽
                            rowhidden: {}, //隐藏行
                            colhidden: {}, //隐藏列
                            borderInfo: {}, //边框
                            authority: {}, //工作表保护
                        },
                    },
                ],
            };
            luckysheet.create(options);
        },

        handleSuccess(response, file, fileList) {

        },
        //电力数据后台导入成功后,数据展示到前台
        loadTableData(evt) {
            this.sum.push(evt);
            if (modify) {
                this.$confirm(
                    "再次导入将会清空表内数据,是否继续操作?",
                    "注意!!!",
                    {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    }
                )
                    .then(async () => {
                        // 确认继续后刷新页面返回模板
                        getSuppliesTemplate(this.selectedOption)
                            .then((response) => {
                                const sysSupplies = response.rows;
                                this.luckysheetData =
                                    sysSupplies[0].templateContent;
                                let json_data = JSON.parse(
                                    sysSupplies[0].templateContent
                                );
                                luckysheet.destroy();
                                luckysheet.create({
                                    container: "luckysheet", // Luckysheet 的容器元素 ID
                                    title: fileName, // Excel 文件名
                                    data: json_data, // Excel 数据
                                    allowEdit: false, //作用:是否允许前台编辑
                                    showinfobar: false, //是否显示顶部名称栏
                                    lang: "zh",
                                });
                                modify = false;
                                this.open(this.sum);
                            })
                            .then(async () => { })
                            .catch(() => { });
                    })
                    .catch(() => {
                        // 用户点击了取消按钮
                        this.$message({
                            type: "info",
                            message: "操作已取消",
                        });
                    });
            } else {
                this.open(evt);
                this.showMask = true;
                LuckyExcel(evt, (exportJson) => {
                    //获取导入表格所有数据exportJson
                    this.open(exportJson)
                        .then(async () => { })
                        .catch((error) => {
                            this.$message({
                                message: error.message,
                                type: "error",
                            });
                        })
                        .finally(() => {
                            // 导入完成后关闭遮罩层
                            this.showMask = false;
                        });
                });
            }
        },

        async handleFileChange(evt) {
            // if (!this.value.includes("凭证")) {
                //组装后台接口数据
                this.currfile = evt

            // }
            this.loadTableData(evt);
            //前台加载数据
        },
        handleOptionChange(value, mine_id) {
            templateListid(value).then((response) => {
                this.luckyrule = JSON.parse(response.rows[0].templateContent);
                this.luckyrule.forEach(item => {
                    item.data = luckysheet.transToData(item.celldata)
                })
            });
            that.mineId = mine_id.id
            let lod = this.$loading({
                lock: true,
                text: "加载中",
                background: "rgba(0, 0, 0, 0.7)",
            });
            //根据选中的下拉选项值获取相应的信息
            getSuppliesTemplate(this.selectedOption)
                .then((response) => {
                    lod.close();
                    modify = false;
                    tempId = this.selectedOption;
                    uuid1 = this.uuid = uuidv4().substring(0, 8);
                    const sysSupplies = response.rows;
                    this.luckysheetData = sysSupplies[0].templateContent;
                    var json_data = JSON.parse(sysSupplies[0].templateContent);
                    this.jsondata = json_data;
                    let suffixArr = sysSupplies[0].templateName.split(".");
                    fileName = suffixArr[0];
                    //luckysheet.destroy()
                    luckysheet.create({
                        container: "luckysheet", // Luckysheet 的容器元素 ID
                        title: fileName, // Excel 文件名
                        data: json_data, // Excel 数据
                        showinfobar: false,
                        allowEdit: false, //是否显示顶部名称栏
                        lang: "zh",
                        index: "0", //工作表索引
                        status: "1", //激活状态
                    });
                    this.value = fileName;


                })
                .catch(() => {
                    lod.close();
                    // 处理错误逻辑,这里是一个空的错误处理函数
                    this.$message.error("查询失败,发生未知错误!");
                });
        },
        //转换方法
        zhuan() {
            const promises = this.sum.map((item) => {
                return new Promise((resolve, reject) => {
                    LuckyExcel.transformExcelToLucky(item, (lucksheetfile) => {
                        resolve(lucksheetfile);
                    });
                });
            });
            Promise.all(promises).then((results) => {
                //唐山矿规则
                let powerDAO = JSON.stringify({
                    mineId: that.mineId,
                    importTime: that.wageMonth,
                    type: 0,
                    powerDetails: [jxdfxt(results[0].sheets).transformedJSON]
                })
                let powerAllDAO = JSON.stringify({
                    mineId: that.mineId,
                    importTime: that.wageMonth,
                    type: 0,
                    powerDetails: jxdfxt(results[0].sheets).transformed
                })
                let form1 = new FormData()
                form1.append("file", this.currfile);
                form1.append("powerDAO", powerDAO);
                form1.append("powerAllDAO", powerAllDAO);

                powerall(form1).then(res => {
                    if(res.code==200){
                        setTs(res, this.luckyrule, this.CConfig, this.itemConfig)
                    }
                })
                this.showMask = false

            });
        },
        handleExport: debounce(function () {
            // handleExport

            exportExcel(luckysheet.getAllSheets(), fileName);
        }, 500),

        async tsdlcrpz() {
            this.views = '凭证';
            this.shuju = luckysheet.getAllSheets();
            // 第一步取数
            let data = getyyData(luckysheet.getAllSheets(), '010101')
            let objJson = {
                borrow: data.map(item => { return { ...item, is_debit: 0, mining: '010101' } })
            }
            // 第二步调接口处理res
            let res = await getyy(JSON.stringify(objJson))
            let loan = [{
                is_debit: 1,
                money: 0,
                name: '其他贷方金额',
                account_code: '2241005',
                classary: "转电力分配",
                mining: "010101"
            }]
            res.data.borrow.forEach(item => {
                if (item.account_code) {
                    loan[0].money = (Number(item.money) + Number(loan[0].money)).toFixed(2);
                }
            })
            res.data.loan = loan;
            // 第三步 生成凭证
            let template = await getSuppliesTemplate(1248)
            let createData = tzcCreateData(
                JSON.parse(template.rows[0].templateContent),
                transformJson(res.data),
                luckysheet,
                this.phone,
                this.wageMonth
            );

            luckysheet.create({
                container: "luckysheet", // Luckysheet 的容器元素 ID
                title: '凭证', // Excel 文件名
                allowEdit: false, //作用:是否允许前台编辑
                data: createData, // Excel 数据
                showinfobar: false, //是否显示顶部名称栏
                lang: "zh",
            });
        },
    },
};
// debounce函数定义
function debounce(func, delay) {
    let timer;
    return function () {
        const context = this;
        const args = arguments;
        clearTimeout(timer);
        timer = setTimeout(function () {
            func.apply(context, args);
        }, delay);
    };
}
</script>

<template>
    <div class="app-container">
        <el-form ref="queryForm" size="small" :inline="true" label-width="68px">
            <el-form-item label="模板" prop="name">
                <el-select v-model="selectedOption" ref="mySelect" size="mini" filterable placeholder="请选择您要查看的模板"
                    @change="handleOptionChange($event, kobj, depssfilter[0])">
                    <el-option v-for="item in depss.filter(item => depssfilter.includes(item.id))" :key="item.id"
                        :label="item.templateName" :value="item.id" :disabled="item.disabled">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="时间" prop="wageMonth">
                <el-date-picker v-model="wageMonth" value-format="yyyy-MM" type="month" placeholder="选择月">
                </el-date-picker>
            </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button type="warning" plain icon="el-icon-upload2" size="mini" @click="handleExport">导出</el-button>
            </el-col>
            <el-col :span="1.5"
                    v-if="views === '汇总'"
            >
                <el-upload type="file" name="file" ref="upload" :headers="{ 'Content-Type': 'multipart/form-data' }"
                    :before-upload="handleFileChange" action='' accept='.xlsx' :limit="3" multiple :file-list="fileList"
                    :show-file-list="false" :on-success="handleSuccess">
                    <el-button plain :disabled="!wageMonth || !jsondata"

                               size="mini" icon="el-icon-download"
                        type="primary">导入</el-button> </el-upload>
                <el-button :plain="true" style="display: none;" @click="open4">错误</el-button>

            </el-col>
            <el-col :span="1.5" v-if="views === '汇总'">
                <el-button size="mini" @click="tsdlcrpz">
                    生凭证
                </el-button>
            </el-col>
            <el-col :span="1.5" v-else>
                <el-button size="mini" @click="huizi">
                    返回汇总
                </el-button>
            </el-col>
        </el-row>
        <!-- luckysheet容器 -->
        <div id="luckysheet"
            style="margin: 0px; padding: 0px; position: absolute; width: 100%; height:80vh; z-index: 0">
        </div>
        <div v-if="showMask" class="mask">
            <div class="loading-spinner"></div>
        </div>
    </div>
</template>


<style scoped src="@/assets/css/power/index.css"></style>