xt-ems-front/src/views/energyBalance/components/balanceSheetData.vue

<template>
<!-- 平衡表数据维护 -->
    <div class="balanceSheetData">
        <div class="box">
            <div class="box-top">
                <el-form
                    style="overflow: hidden;"
                    :style="filterForm.show ? null : { height: '0px' }"
                    size="mini"
                    label-width="70px"
                >
                    <el-row>
                        <el-col :span="6">
                            <el-form-item label="时间粒度">
                                <el-select
                                filterable clearable
                                    v-model="filterForm.data.timegranid"
                                    placeholder=""
                                    style="width: 100%;"
                                >
                                    <el-option
                                        v-for="item of nameObj.timegranid.arr"
                                        :key="item.id"
                                        :value="item.id"
                                        :label="item.name"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="时间">
                                <!-- <el-date-picker
                                    v-model="filterForm.data.clock"
                                    type="date"
                                    placeholder=""
                                    style="width: 100%;"
                                    value-format="yyyy-MM-dd"
                                ></el-date-picker> -->
                                <zj-timegran-date
                                    v-model="filterForm.data.clock"
                                    style="width: 100%;"
                                    :timegranId="filterForm.data.timegranid"
                                    :oneFoo="getTableData"
                                    :defaultOffset="-1"
                                ></zj-timegran-date>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="工序">
                                <el-select
                                filterable clearable
                                    v-model="filterForm.data.workprocid"
                                    placeholder=""
                                    style="width: 100%;"
                                >
                                    <el-option
                                        v-for="item of nameObj.workprocid.arr"
                                        :key="item.id"
                                        :value="item.id"
                                        :label="item.name"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="能介">
                                <el-select
                                filterable clearable
                                    v-model="filterForm.data.energyid"
                                    placeholder=""
                                    style="width: 100%;"
                                >
                                    <el-option
                                        v-for="item of nameObj.energyid.arr"
                                        :key="item.id"
                                        :value="item.id"
                                        :label="item.name"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="6">
                            <el-form-item label="属性">
                                <el-select
                                filterable clearable
                                    v-model="filterForm.data.propertyid"
                                    placeholder=""
                                    style="width: 100%;"
                                >
                                    <el-option
                                        v-for="item of nameObj.propertyid.arr"
                                        :key="item.id"
                                        :value="item.id"
                                        :label="item.name"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="项目代码">
                                <el-input clearable
                                    v-model="filterForm.data.itemid"
                                    placeholder=""
                                    style="width: 100%;"
                                    @keyup.enter.native="getTableData(1)"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="项目名称">
                                <el-input clearable
                                    v-model="filterForm.data.itemname"
                                    placeholder=""
                                    style="width: 100%;"
                                    @keyup.enter.native="getTableData(1)"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="项目描述">
                                <el-input clearable
                                    v-model="filterForm.data.itemdesc"
                                    placeholder=""
                                    style="width: 100%;"
                                    @keyup.enter.native="getTableData(1)"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
                <div class="box-top-gjl">
                    <el-button
                        type="primary"
                        size="mini"
                        icon="el-icon-edit-outline"
                        v-privilege="activeMenu + 'PUT'"
                        @click="but_edit_plural()"
                        :loading="loading"
                    >修改</el-button>
                    <el-button
                        class="button"
                        type="primary"
                        size="mini"
                        icon="el-icon-refresh"
                        @click="againCount()"
                    >自动均摊</el-button>
                    <span v-show="difference" style="margin-left: 5px;">需均摊：{{difference}}</span>
                    <div style="float:right; text-align: right;">
                        <el-button
                            class="button"
                            type="primary"
                            size="mini"
                            icon="el-icon-search"
                            v-privilege="activeMenu + 'QUERY'"
                            @click="getTableData(1)"
                        >查询</el-button>
                        <el-button
                            class="button"
                            type="primary"
                            size="mini"
                            icon="el-icon-refresh"
                            v-privilege="activeMenu + 'QUERY'"
                            @click="tableDataCancel();"
                        >重置</el-button>
                        <el-button
                            size="mini"
                            :icon="filterForm.show ? 'el-icon-caret-top' : 'el-icon-caret-bottom'"
                            :title="filterForm.show ? '收起搜索区' : '展开搜索区'"
                            @click="filterForm.show = !filterForm.show;
                                $nextTick(() => {
                                    singleTableHeight = getRoleHeight($refs['boxBottom']) - 45;
                                }
                            );"
                        >{{ filterForm.show ? '收起' : '展开' }}</el-button>
                    </div>
                </div>
            </div>
            <div class="box-bottom" ref="boxBottom">
                <div class="table-box" ref="table_box">
                    <div class="table-left" :style="{ width: leftTableWidth + 'px' }">
                        <el-form
                            size="mini"
                            ref="dialog_form_arr_1"
                            label-width="0px"
                            :model="tableFormDataObj"
                        >
                            <el-table stripe
                                id="singleTable1"
                                ref="singleTable1"
                                :data="leftTableData"
                                v-loading="leftTableLoading"
                                style="width: 100%;"
                                :height="singleTableHeight"
                                border
                                size="mini"
                                highlight-current-row
                                show-summary
                                :summary-method="getSummaries"
                                @current-change="getTableDetailData"
                                @selection-change="handleSelectionChange"
                                @expand-change="getChildTable"
                            >
                                <el-table-column
                                    type="selection"
                                    width="40"
                                    align="center"
                                    fixed="left"
                                ></el-table-column>
                                <!-- <el-table-column
                                sortable
                                    prop="timegranid"
                                    label="时间粒度"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <span>{{ nameObj.timegranid.obj[scope.row.timegranid] ? nameObj.timegranid.obj[scope.row.timegranid] : scope.row.timegranid }}</span>
                                    </template>
                                </el-table-column> -->
                                <el-table-column
                                    type="expand"
                                    width="45"
                                >
                                    <template slot-scope="scope">
                                        <el-table stripe
                                            :data="scope.row.tableData"
                                            v-loading="scope.row.tableLoading"
                                            style="width: 500px; resize: horizontal;"
                                            border
                                            size="mini"
                                            highlight-current-row
                                        >
                                            <el-table-column
                                                sortable
                                                prop="itemname"
                                                label="项目名称"
                                                width="200px"
                                                :show-overflow-tooltip="true"
                                            ></el-table-column>
                                            <el-table-column
                                                sortable
                                                prop="timegranid"
                                                label="时间粒度"
                                                width="100px"
                                                :show-overflow-tooltip="true"
                                            >
                                                <template slot-scope="scope">
                                                    <span>{{ nameObj.timegranid.obj[scope.row.timegranid] ? nameObj.timegranid.obj[scope.row.timegranid] : scope.row.timegranid }}</span>
                                                </template>
                                            </el-table-column>
                                            <el-table-column
                                                sortable
                                                prop="clock"
                                                label="时间"
                                                width="100px"
                                                :show-overflow-tooltip="true"
                                            ></el-table-column>
                                            <el-table-column
                                                sortable
                                                prop="apportvalue"
                                                label="最终值"
                                                width="100px"
                                                :show-overflow-tooltip="true"
                                            ></el-table-column>
                                        </el-table>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="clock"
                                    label="时间"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="itemname"
                                    label="项目名称"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="actualvalue"
                                    label="计算值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="correctvalue"
                                    label="修正值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <el-form-item
                                            v-if="scope.row.isSelection"
                                            :prop="scope.row.itemid + '-' + scope.row.timegranid + '-' + scope.row.clock + '.correctvalue'"
                                            :rules="dialog.editorBox.form.rules.correctvalue"
                                        >
                                            <el-input
                                                style="width: 100%;"
                                                v-model="tableFormDataObj[scope.row.itemid + '-' + scope.row.timegranid + '-' + scope.row.clock].correctvalue"
                                                @change="correctvalueUpFoo(tableFormDataObj[scope.row.itemid + '-' + scope.row.timegranid + '-' + scope.row.clock]);"
                                                @focus="getTableDetailData(scope.row)"
                                            ></el-input>
                                            <template slot="error" slot-scope="scope">
                                                <p class="error" :title="scope.error">{{ scope.error }}</p>
                                            </template>
                                        </el-form-item>
                                        <span v-else>{{scope.row.correctvalue}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="apportvalue"
                                    label="最终值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <el-form-item
                                            v-if="scope.row.isSelection"
                                            :prop="scope.row.itemid + '-' + scope.row.timegranid + '-' + scope.row.clock + '.apportvalue'"
                                            :rules="dialog.editorBox.form.rules.apportvalue"
                                        >
                                            <el-input
                                                style="width: 100%;"
                                                v-model="tableFormDataObj[scope.row.itemid + '-' + scope.row.timegranid + '-' + scope.row.clock].apportvalue"
                                                @change="apportvalueUpFoo(tableFormDataObj[scope.row.itemid + '-' + scope.row.timegranid + '-' + scope.row.clock]);"
                                                @focus="getTableDetailData(scope.row)"
                                            ></el-input>
                                            <template slot="error" slot-scope="scope">
                                                <p class="error" :title="scope.error">{{ scope.error }}</p>
                                            </template>
                                        </el-form-item>
                                        <span v-else>{{scope.row.apportvalue}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="unitid"
                                    label="单位"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <span>{{ nameObj.unitid.obj[scope.row.unitid] ? nameObj.unitid.obj[scope.row.unitid] : scope.row.unitid }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="itemid"
                                    label="项目代码"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="itemdesc"
                                    label="项目描述"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                            </el-table>
                        </el-form>
                    </div>
                    <div class="table-tuodong" :style="{ height: singleTableHeight + 'px' }"
                        @mousedown="tableTDMousedown"
                    ></div>
                    <div class="table-right" :style="{ 'margin-left': (leftTableWidth + 7) + 'px' }">
                        <el-form
                            size="mini"
                            ref="dialog_form_arr_2"
                            label-width="0px"
                            :model="rightTableObj"
                        >
                            <el-table stripe
                                id="singleTable2"
                                ref="singleTable2"
                                :data="rightTableObj.tableData"
                                v-loading="tableLoading"
                                style="width: 100%;"
                                :height="singleTableHeight"
                                border
                                size="mini"
                                highlight-current-row
                                show-summary
                                :summary-method="getSummaries"
                            >
                                <el-table-column
                                sortable
                                    prop="itemname"
                                    label="项目名称"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="proportion"
                                    label="均摊比例"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <el-form-item
                                            v-if="dialog.fRow && dialog.fRow.isSelection"
                                            :prop="'tableData.' + scope.$index + '.proportion'"
                                            :rules="dialog.editorBox.form.rules.proportion"
                                        >
                                            <el-input
                                                style="width: 100%;"
                                                v-model="scope.row.proportion"
                                                @change="proportionFormat(scope.row);"
                                            ></el-input>
                                            <template slot="error" slot-scope="scope">
                                                <p class="error" :title="scope.error">{{ scope.error }}</p>
                                            </template>
                                        </el-form-item>
                                        <span v-else>{{scope.row.proportion}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="actualvalue"
                                    label="计算值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="correctvalue"
                                    label="修正值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <el-form-item
                                            v-if="dialog.fRow && dialog.fRow.isSelection"
                                            :prop="'tableData.' + scope.$index + '.correctvalue'"
                                            :rules="dialog.editorBox.form.rules.correctvalue"
                                        >
                                            <el-input
                                                style="width: 100%;"
                                                v-model="scope.row.correctvalue"
                                                @change="correctvalueUpFoo(scope.row);"
                                            ></el-input>
                                            <template slot="error" slot-scope="scope">
                                                <p class="error" :title="scope.error">{{ scope.error }}</p>
                                            </template>
                                        </el-form-item>
                                        <span v-else>{{scope.row.correctvalue}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="apportvalue"
                                    label="最终值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <el-form-item
                                            v-if="dialog.fRow && dialog.fRow.isSelection"
                                            :prop="'tableData.' + scope.$index + '.apportvalue'"
                                            :rules="dialog.editorBox.form.rules.apportvalue"
                                        >
                                            <el-input
                                                style="width: 100%;"
                                                v-model="scope.row.apportvalue"
                                                @change="apportvalueUpFoo(scope.row);"
                                            ></el-input>
                                            <template slot="error" slot-scope="scope">
                                                <p class="error" :title="scope.error">{{ scope.error }}</p>
                                            </template>
                                        </el-form-item>
                                        <span v-else>{{scope.row.apportvalue}}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="unitid"
                                    label="单位"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <span>{{ nameObj.unitid.obj[scope.row.unitid] ? nameObj.unitid.obj[scope.row.unitid] : scope.row.unitid }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="stdvalue"
                                    label="折标值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="sumvalue"
                                    label="累计值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="sumstdvalue"
                                    label="累计折标值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="ucvalue"
                                    label="单耗值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="sumucvalue"
                                    label="累计单耗值"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="timegranid"
                                    label="时间粒度"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                >
                                    <template slot-scope="scope">
                                        <span>{{ nameObj.timegranid.obj[scope.row.timegranid] ? nameObj.timegranid.obj[scope.row.timegranid] : scope.row.timegranid }}</span>
                                    </template>
                                </el-table-column>
                                <el-table-column
                                sortable
                                    prop="clock"
                                    label="时间"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="itemid"
                                    label="项目代码"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="itemdesc"
                                    label="项目描述"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                                <el-table-column
                                sortable
                                    prop="rectime"
                                    label="记录创建时间"
                                    min-width="100px"
                                    :show-overflow-tooltip="true"
                                ></el-table-column>
                            </el-table>
                        </el-form>
                    </div>
                </div>
                <el-pagination
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
                    :page-sizes="[10, 20, 50, 100, 500, 1000]"
                    :page-size="pageSize"
                    :current-page.sync="pageNum"
                    @size-change="tableSizeChange"
                    @current-change="getTableData()"
                    style="text-align: left;margin-top: 10px;"
                ></el-pagination>
            </div>
        </div>
    </div>
</template>

<script>
import { zCheckNumber1 } from '~/utils/validator.js'
import timegranDate from '~/components/zg/timegranDate.vue'
import {formatDate, XtcommonSummaries} from '@/utils/util.js';
export default {
    name: 'balanceSheetData',
    components: {
        'zj-timegran-date': timegranDate
    },
    data () {
        return {
            activeMenu: '',
            filterForm: {
                show: true,
                data: {
                    timegranid: '',
                    clock: '',
                    workprocid: '',
                    energyid: '',
                    propertyid: '',
                    itemid: '',
                    itemname: '',
                    itemdesc: ''
                },
                rules: {

                }
            },
            pageNum: 1,
            pageSize: 20,
            total: 0,
            singleTableHeight: 100,
            leftTableData: [],
            leftTableLoading: false,
            leftTableWidth: 550,
            difference: 0,
            rightTableObj: {
                tableData: [
                    // {
                    //     itemid: '06090001012R',
                    //     itemname: '供水原水实绩发生量',
                    //     unitid: '吨',
                    //     actualvalue: '47418',
                    //     correctvalue: '0',
                    //     apportvalue: '47418',
                    //     stdvalue: '0',
                    //     sumvalue: '1106342',
                    //     sumstdvalue: '',
                    //     ucvalue: '',
                    //     sumucvalue: '',
                    //     rectime: '20171017134639'
                    // }
                ]
            },
            multipleSelection: [],
            tableFormDataObj: {},
            nameObj: {
                timegranid: {
                    obj: {},
                    arr: []
                },
                workprocid: {
                    obj: {},
                    arr: []
                },
                energyid: {
                    obj: {},
                    arr: []
                },
                propertyid: {
                    obj: {},
                    arr: []
                },
                unitid: {
                    obj: {},
                    arr: []
                }
            },
            loading: false,
            tableLoading: false,
            dialog: {
                fRow: null,
                editorBox: {
                    form: {
                        rules: {
                            correctvalue: [
                                { required: true, message: '该项不能为空', trigger: 'change' },
                                { validator: zCheckNumber1, trigger: 'change' }
                            ],
                            apportvalue: [
                                { required: true, message: '该项不能为空', trigger: 'change' },
                                { validator: zCheckNumber1, trigger: 'change' }
                            ]
                        }
                    }
                }
            }
        }
    },
    created () {
        this.activeMenu = window.localStorage.getItem('activeMenu');
    },
    mounted () {
        let that = this;
        window.PEDataObj = {
            // 将数据绑定到window上，供main页面使用
            vm: that,
            // tableArr：用于导出成Excel的表格的信息
            tableArr: [
                {
                    name: '左表格',
                    id: 'singleTable1'
                },
                {
                    name: '右表格',
                    id: 'singleTable2'
                }
            ]
        };
        that.$nextTick(() => {
            // 立即获取的height有一定偏差，通过setTimeout延迟来解决
            setTimeout(() => {
                that.singleTableHeight = that.getRoleHeight(that.$refs['boxBottom']) - 45;
            }, 1);
        });
        that.getTimeGranData();
        that.getWorkprocIdData();
        that.getEnergyIdData();
        that.getPropertyIdData();
        that.getUnitIdData();
        // that.getTableData();
    },
    methods: {
        //  计算树区域高度
        getRoleHeight (dom) {
            return window.innerHeight - dom.offsetTop;
        },
        // 自定义的表格合计方法：只给指定列进行合计
        getSummaries (param) {
            const prop = ['actualvalue', 'correctvalue', 'apportvalue', 'sumvalue', 'proportion']; // 合计列绑定的prop
            return XtcommonSummaries(param, prop);
        },
        // 获取时间粒度(平衡表数据维护)
        getTimeGranData () {
            let that = this
            let url = 'pass/ems/v1/tcmdatasourcetimegrans/getTimegranRmBalanceValue';
            that.axios.get(url)
                .then(function (res) {
                    if (res.code === '0') {
                        let arr = [];
                        let obj = {};
                        for (let item of res.data) {
                            arr.push({
                                id: item.ID,
                                name: item.NAME
                            })
                            obj[item.ID] = item.NAME;
                            that.filterForm.data.timegranid = that.filterForm.data.timegranid ? that.filterForm.data.timegranid : item.ID;
                        }
                        that.nameObj.timegranid.arr = arr;
                        that.nameObj.timegranid.obj = obj;
                    } else {
                        that.$message.error(res.message);
                    }
                });
        },
        // 获取工序(平衡)
        getWorkprocIdData () {
            let that = this
            let url = 'pass/ems/v1/trmworkprocs/getIdAndName?isbalance=1';
            that.axios.get(url)
                .then(function (res) {
                    if (res.code === '0') {
                        let arr = [];
                        let obj = {};
                        for (let item of res.data) {
                            arr.push({
                                id: item.id,
                                name: item.name
                            })
                            obj[item.id] = item.name;
                        }
                        that.nameObj.workprocid.arr = arr;
                        that.nameObj.workprocid.obj = obj;
                    } else {
                        that.$message.error(res.message);
                    }
                });
        },
        // 获取能介(平衡表)
        getEnergyIdData () {
            let that = this
            let url = 'pass/ems/v1/trmenergys/selectNameAndId/?isbalance=1';
            that.axios.get(url)
                .then(function (res) {
                    if (res.code === '0') {
                        let arr = [];
                        let obj = {};
                        for (let item of res.data) {
                            arr.push({
                                id: item.id,
                                name: item.name
                            })
                            obj[item.id] = item.name;
                        }
                        that.nameObj.energyid.arr = arr;
                        that.nameObj.energyid.obj = obj;
                    } else {
                        that.$message.error(res.message);
                    }
                });
        },
        // 获取属性
        getPropertyIdData () {
            let that = this
            let url = 'pass/ems/v1/trmenergypropertys/getidandname/';
            that.axios.get(url)
                .then(function (res) {
                    if (res.code === '0') {
                        let arr = [];
                        let obj = {};
                        for (let item of res.data) {
                            arr.push({
                                id: item.id,
                                name: item.name
                            })
                            obj[item.id] = item.name;
                        }
                        that.nameObj.propertyid.arr = arr;
                        that.nameObj.propertyid.obj = obj;
                    } else {
                        that.$message.error(res.message);
                    }
                });
        },
        // 获取标准计量单位
        getUnitIdData () {
            let that = this
            let url = 'pass/ems/v1/trmunits/getIdAndName';
            that.axios.get(url)
                .then(function (res) {
                    if (res.code === '0') {
                        let arr = [];
                        let obj = {};
                        for (let item of res.data) {
                            arr.push({
                                id: item.id,
                                name: item.name
                            })
                            obj[item.id] = item.name;
                            if (item.name === '吨') {
                                that.nameObj.unitid.defaults = that.nameObj.unitid.defaults ? that.nameObj.unitid.defaults : item.id;
                            }
                        }
                        that.nameObj.unitid.arr = arr;
                        that.nameObj.unitid.obj = obj;
                    } else {
                        that.$message.error(res.message);
                    }
                });
        },
        // 获取表格中的数据
        getTableData (pageNum) {
            let that = this,
                params = {
                    timegranid: that.filterForm.data.timegranid,
                    clock: that.filterForm.data.clock,
                    workprocid: that.filterForm.data.workprocid,
                    energyid: that.filterForm.data.energyid,
                    propertyid: that.filterForm.data.propertyid,
                    itemid: that.filterForm.data.itemid,
                    itemname: that.filterForm.data.itemname,
                    itemdesc: that.filterForm.data.itemdesc,
                    fid: ''
                };
            that.pageNum = pageNum || that.pageNum;
            that.leftTableLoading = true;
            let url = 'pass/ems/v1/trmbalancevalues/getBalanceitemForPage/?pageNum=' + that.pageNum + '&pageSize=' + that.pageSize;
            that.axios.get(url, {
                params: params
            })
                .then(function (res) {
                    if (res.code === '0') {
                        let arr = [];
                        for (let item of res.data.list) {
                            arr.push({
                                itemid: item.ITEMID,
                                clock: item.CLOCK,
                                timegranid: item.TIMEGRANID,
                                itemname: item.ITEMNAME,
                                itemdesc: item.ITEMDESC,
                                unitid: item.UNITID,
                                actualvalue: item.ACTUALVALUE,
                                correctvalue: item.CORRECTVALUE,
                                apportvalue: item.APPORTVALUE,
                                stdvalue: item.STDVALUE,
                                sumvalue: item.SUMVALUE,
                                sumstdvalue: item.SUMSTDVALUE,
                                ucvalue: item.UCVALUE,
                                sumucvalue: item.SUMUCVALUE,
                                rectime: item.REC_TIME,
                                getTable: false,
                                tableData: [],
                                tableLoading: false,
                                energyid: item.ENERGYID
                            })
                        }
                        that.leftTableData = arr;
                        that.rightTableObj.tableData = [];
                        that.dialog.fRow = null;
                        that.total = res.data.total;
                    } else {
                        that.$message.error(res.message);
                    }
                    that.leftTableLoading = false;
                }).catch(function () {
                    that.leftTableLoading = false;
                });
        },
        // 改变表格显示条数
        tableSizeChange (val) {
            let that = this;
            that.pageSize = val;
            that.getTableData(1);
        },
        // 重置搜索
        tableDataCancel () {
            let that = this;
            for (let key in that.filterForm.data) {
                if (that.filterForm.data[key] instanceof Array) {
                    that.filterForm.data[key] = [];
                } else {
                    that.filterForm.data[key] = '';
                }
            }
            that.getTableData(1);
        },
        getTableDetailData (row) {
            let that = this;
            if (row) {
                if (row.childrenArr && row.childrenArr.length > 0) {
                    that.dialog.fRow = row;
                    that.upTableFormDataObj();
                } else {
                    let params = {
                        timegranid: row.timegranid,
                        clock: row.clock,
                        fid: row.itemid
                        // workprocid: row.workprocid,
                        // energyid: row.energyid,
                        // propertyid: row.propertyid
                    };
                    that.tableLoading = true;
                    let url = 'pass/ems/v1/trmbalancevalues/getBalanceitemList';
                    that.axios.get(url, {
                        params: params
                    })
                        .then(function (res) {
                            if (res.code === '0') {
                                let arr = [];
                                let sum = 0;
                                for (let item of res.data) {
                                    arr.push({
                                        itemid: item.ITEMID,
                                        clock: item.CLOCK,
                                        timegranid: item.TIMEGRANID,
                                        itemname: item.ITEMNAME,
                                        itemdesc: item.ITEMDESC,
                                        unitid: item.UNITID,
                                        actualvalue: item.ACTUALVALUE,
                                        correctvalue: item.CORRECTVALUE,
                                        apportvalue: item.APPORTVALUE,
                                        stdvalue: item.STDVALUE,
                                        sumvalue: item.SUMVALUE,
                                        sumstdvalue: item.SUMSTDVALUE,
                                        ucvalue: item.UCVALUE,
                                        sumucvalue: item.SUMUCVALUE,
                                        rectime: item.REC_TIME
                                    })
                                    sum = that.floatComputed(sum, item.APPORTVALUE, '+');
                                }
                                // 计算默认比例
                                let bl = 100;
                                for (let i = 0; i < arr.length; i++) {
                                    if (i === (arr.length - 1)) {
                                        arr[i].proportion = bl;
                                    } else {
                                        arr[i].proportion = that.floatComputed(arr[i].apportvalue == 0 ? 0.001 : arr[i].apportvalue, sum, '/');
                                        arr[i].proportion = that.floatComputed(arr[i].proportion, 100, '*');
                                        arr[i].proportion = arr[i].proportion.toFixed(2);
                                        bl = that.floatComputed(bl, arr[i].proportion, '-');
                                    }
                                }
                                row.childrenArr = arr;
                                that.dialog.fRow = row;
                                that.upTableFormDataObj();
                            } else {
                                that.$message.error(res.message);
                            }
                            that.tableLoading = false;
                        }).catch(function () {
                            that.tableLoading = false;
                        });
                }
            }
        },
        jsDifference () {
            let that = this;
            let fV = that.dialog.fRow.apportvalue,
                zV = 0;
            let xId = that.dialog.fRow.itemid + '-' + that.dialog.fRow.timegranid + '-' + that.dialog.fRow.clock;
            if (that.tableFormDataObj[xId]) {
                fV = that.tableFormDataObj[xId].apportvalue;
            }
            for (let item of that.rightTableObj.tableData) {
                zV = that.floatComputed(zV, item.apportvalue, '+');
            }
            that.difference = +that.floatComputed(fV, zV, '-').toFixed(3);
        },
        upTableFormDataObj () {
            // 更新右侧表格编辑模式绑定的数据
            let that = this;
            let fRow = that.dialog.fRow;
            if (fRow) {
                if (!fRow.tableFormDataArr || !fRow.isSelection) {
                    // 当前选中行被勾选时不更新tableFormDataObj
                    fRow.tableFormDataArr = JSON.parse(JSON.stringify(fRow.childrenArr));
                }
                if (fRow.isSelection) {
                    that.rightTableObj.tableData = fRow.tableFormDataArr;
                } else {
                    that.rightTableObj.tableData = fRow.childrenArr;
                }
                that.jsDifference();
            }
        },
        // 表格中多选按钮的相关方法
        handleSelectionChange (val) {
            let that = this;
            let tableFormDataObj = {};
            if (val.length > 1) {
                that.$refs.singleTable1.clearSelection();
                that.$refs.singleTable1.toggleRowSelection(val.pop());
                return false;
            }
            if (val.length === 1) {
                that.$refs.singleTable1.setCurrentRow(val[0]);
            }
            for (let item of that.leftTableData) {
                item.isSelection = false;
            }
            for (let item of val) {
                let obj = {};
                let xId = item.itemid + '-' + item.timegranid + '-' + item.clock;
                if (that.tableFormDataObj[xId]) {
                    // 如果已存在该数据则使用该数据
                    tableFormDataObj[xId] = that.tableFormDataObj[xId];
                } else {
                    // 否则则从对应行中获取行内原数据
                    for (let key in item) {
                        if (key !== 'childrenArr' && key !== 'tableFormDataArr') {
                            obj[key] = item[key];
                        }
                    }
                    tableFormDataObj[xId] = obj;
                }
                item.isSelection = true;
            }
            that.tableFormDataObj = tableFormDataObj;
            // if (val.length > 0) {
            that.upTableFormDataObj();
            // }
            that.multipleSelection = val;
        },
        // 批量修改
        but_edit_plural () {
            let that = this;
            if (that.multipleSelection.length > 0) {
                that.$refs['dialog_form_arr_1'].validate((valid) => {
                    if (valid) {
                        let SubmitData = [];
                        for (let key in that.tableFormDataObj) {
                            SubmitData.push({
                                clock: that.tableFormDataObj[key].clock,
                                timegranid: that.tableFormDataObj[key].timegranid,
                                itemid: that.tableFormDataObj[key].itemid,
                                correctvalue: that.tableFormDataObj[key].correctvalue,
                                apportvalue: that.tableFormDataObj[key].apportvalue
                            });
                        }
                        for (let item of that.multipleSelection) {
                            for (let dataObj of item.tableFormDataArr) {
                                SubmitData.push({
                                    clock: dataObj.clock,
                                    timegranid: dataObj.timegranid,
                                    itemid: dataObj.itemid,
                                    correctvalue: dataObj.correctvalue,
                                    apportvalue: dataObj.apportvalue
                                });
                            }
                        }
                        that.loading = true;
                        that.axios.put('pass/ems/v1/trmbalancevalues/batchUpdate', SubmitData)
                            .then(function (res) {
                                if (res.code === '0') {
                                    that.$message({
                                        message: '修改成功',
                                        type: 'success'
                                    });
                                    that.getTableData();
                                } else {
                                    that.$message.error(res.message);
                                }
                                that.loading = false;
                            }).catch(function () {
                                that.loading = false;
                            });
                        }
                });
            } else {
                this.$message.error('请勾选一条数据');
            }
        },
        correctvalueUpFoo (row) {
            let that = this;
            // 防止数据为无效值
            if (row.correctvalue === '' || !isFinite(row.correctvalue)) {
                row.correctvalue = 0;
                row.apportvalue = row.actualvalue;
            } else {
                row.apportvalue = that.floatComputed(row.actualvalue, row.correctvalue, '+');
            }
            that.jsDifference();
            // that.valueAllocation(row);
        },
        apportvalueUpFoo (row) {
            let that = this;
            if (row.apportvalue === '' || !isFinite(row.apportvalue)) {
                row.correctvalue = 0;
                row.apportvalue = row.actualvalue;
            } else {
                row.correctvalue = that.floatComputed(row.apportvalue, row.actualvalue, '-');
            }
            that.jsDifference();
            // that.valueAllocation(row);
        },
        // 按各自占比从新分配数值
        // valueAllocation (row) {
        //     let that = this;
        //     let xId = that.dialog.fRow.itemid + '-' + that.dialog.fRow.timegranid + '-' + that.dialog.fRow.clock;
        //     let tableFormDataArr = that.dialog.fRow.tableFormDataArr;
        //     let overageValue = 0;
        //     if (row === that.tableFormDataObj[xId]) {
        //         overageValue = +that.tableFormDataObj[xId].apportvalue;
        //     } else {
        //         overageValue = that.floatComputed(+that.tableFormDataObj[xId].apportvalue, +row.apportvalue, '-');
        //     }
        //     if (!isFinite(overageValue)) {
        //         overageValue = 0;
        //     }
        //     let overageValue1 = overageValue;
        //     let blValue = 0;
        //     for (let item of tableFormDataArr) {
        //         if (item !== row) {
        //             // 获取其他数据的总值，用于计算比例
        //             blValue = that.floatComputed(blValue, item.apportvalue, '+');
        //         }
        //     }
        //     for (let i = 0; i < tableFormDataArr.length; i++) {
        //         let item = tableFormDataArr[i];
        //         if (item !== row) {
        //             // 对其他数据按比例进行修改
        //             let bl = +item.apportvalue === 0 ? 0 : that.floatComputed(item.apportvalue, blValue, '/'); // 计算所占比例
        //             // console.log(bl)
        //             // console.log(item.actualvalue, overageValue, bl)
        //             if (!isFinite(bl)) {
        //                 bl = 0;
        //             }
        //             if (i < tableFormDataArr.length - 1) {
        //                 let value = that.floatComputed(overageValue, bl, '*');
        //                 item.apportvalue = value;
        //                 overageValue1 = that.floatComputed(overageValue1, value, '-');
        //             } else {
        //                 // 剩余的数直接给最后一个
        //                 // console.log('剩余:' + overageValue1)
        //                 item.apportvalue = overageValue1;
        //             }
        //             item.correctvalue = that.floatComputed(item.apportvalue, item.actualvalue, '-');
        //         } else {
        //             if (i === tableFormDataArr.length - 1) { // 如果row是最后一行，则把剩余数给倒数第二行
        //                 tableFormDataArr[i - 1].apportvalue = that.floatComputed(tableFormDataArr[i - 1].apportvalue, overageValue1, '+');
        //                 tableFormDataArr[i - 1].correctvalue = that.floatComputed(tableFormDataArr[i - 1].apportvalue, tableFormDataArr[i - 1].actualvalue, '-');
        //             }
        //         }
        //         let numArr = (item.apportvalue + '').split('.');
        //         if (numArr.length > 1) {
        //             if (numArr[1].length > 3) {
        //                 item.apportvalue = (+item.apportvalue).toFixed(3);
        //             }
        //         }
        //         let numArr1 = (item.correctvalue + '').split('.');
        //         if (numArr1.length > 1) {
        //             if (numArr1[1].length > 3) {
        //                 item.correctvalue = (+item.correctvalue).toFixed(3);
        //             }
        //         }
        //     }
        // },
        tableTDMousedown (e) {
            let that = this;
            let nowPageX = e.pageX,
                nowWidth = that.leftTableWidth,
                minWidth = 200,
                maxWidth = window.innerWidth - 200;
            that.$refs.table_box.style.userSelect = 'none';
            that.$refs.table_box.style.cursor = 'col-resize';
            that.$refs.table_box.onmousemove = function (e) {
                let bh = e.pageX - nowPageX;
                if (nowWidth + bh > maxWidth) {
                    that.leftTableWidth = maxWidth;
                } else if (nowWidth + bh < minWidth) {
                    that.leftTableWidth = minWidth;
                } else {
                    that.leftTableWidth = nowWidth + bh;
                }
            }
            that.$refs.table_box.onmouseup = function () {
                that.$refs.table_box.onmousemove = false;
                that.$refs.table_box.onmouseup = false;
                that.$refs.table_box.style.userSelect = '';
                that.$refs.table_box.style.cursor = ''
            }
        },
        // 对proportion的值进行处理，使其符合要求
        proportionFormat (row) {
            let that = this;
            if (row.proportion === '' || !isFinite(row.proportion)) {
                row.proportion = 0;
            }
        },
        // 重新计算，根据自定义的分配比例来自动调整最终值
        againCount () {
            let that = this;
            if (that.multipleSelection.length > 0) {
                for (let item of that.multipleSelection) {
                    let xId = item.itemid + '-' + item.timegranid + '-' + item.clock;
                    let objItem = that.tableFormDataObj[xId];
                    let bl = 0;
                    for (let dataObj of item.tableFormDataArr) {
                        bl = +that.floatComputed(bl, dataObj.proportion, '+');
                    }
                    if (bl !== 100) {
                        this.$message.error('所有比例之和不为100%，请调整比例后再执行计算。');
                        continue;
                    }
                    let sum = objItem.apportvalue;
                    for (let i = 0, ilength = item.tableFormDataArr.length; i < ilength; i++) {
                        if (i === (ilength - 1)) {
                            item.tableFormDataArr[i].apportvalue = sum;
                        } else {
                            let z = that.floatComputed(objItem.apportvalue, item.tableFormDataArr[i].proportion, '*');
                            item.tableFormDataArr[i].apportvalue = that.floatComputed(z, 100, '/');
                            sum = that.floatComputed(sum, item.tableFormDataArr[i].apportvalue, '-');
                        }
                        item.tableFormDataArr[i].correctvalue = that.floatComputed(item.tableFormDataArr[i].apportvalue, item.tableFormDataArr[i].actualvalue, '-');
                    }
                    that.jsDifference();
                }
            } else {
                this.$message.error('请勾选一条数据');
            }
        },
        getChildTable (row, expandedRows) {
            let that = this;
            if (!row.getTable) {
                let params = {
                        clock: row.clock,
                        energyid: row.energyid
                    };
                row.tableLoading = true;
                let url = 'pass/ems/v1/trmbalancevalues/getitem';
                that.axios.get(url, {
                    params: params
                })
                    .then(function (res) {
                        if (res.code === '0') {
                            let arr = [];
                            for (let item of res.data) {
                                arr.push({
                                    clock: item.CLOCK,
                                    itemname: item.ITEMNAME,
                                    timegranid: item.TIMEGRANID,
                                    apportvalue: item.APPORTVALUE
                                })
                            }
                            console.log(arr)
                            row.tableData = arr;
                            row.getTable = true;
                        } else {
                            that.$message.error(res.message);
                        }
                        row.tableLoading = false;
                    }).catch(function () {
                        row.tableLoading = false;
                    });
            }
        }
    }
}
</script>

<style lang="less">
.balanceSheetData {
    min-width: 700px;
    height: 100%;
    .box {
        height: 100%;
        padding: 15px 15px 0 15px;
        .box-top {
            .el-form-item {
                margin-bottom: 7px;
            }
            .box-top-gjl {
                overflow: hidden;
                // margin-top: -7px;
                padding: 7px 0;
                border-top: 1px solid #ccc;
                // border-bottom: 1px solid #ccc;
                // margin-bottom: 6px;
            }
        }
        .table-box {
            .table-left {
                float: left;
                width: 550px;
            }
            .table-tuodong {
                float: left;
                width: 5px;
                margin: 0 1px 0 1px;
                cursor: col-resize;
            }
            .table-right {
                margin-left: 557px;
            }
        }
        .el-table .el-table__row {
            height: 35px;
        }
        .el-table__body .el-form-item--mini.el-form-item {
            margin: 0px;
            .error {
                overflow: hidden;
                color: #f56c6c;
                font-size: 12px;
                line-height: 1;
            }
        }
        // 隐藏全选按钮
        thead .el-table-column--selection .cell {
            display: none;
        }
    }
}
</style>