/**
* Created by xiangc on 2017/8/6.
*/
<template>
    <section>
        <el-row class="summary-row">
            <el-col :span="12" class="el-col">
                <BaseInfoTable
                        :xianjin="baseInfo.xianjin"
                        :qiandan="baseInfo.qiandan"
                        :shishou="baseInfo.shishou"
                        :lirun="baseInfo.lirun"
                ></BaseInfoTable>
            </el-col>
            <el-col :span="12" class="el-col">
                <ProfitAllotTable
                        :dijie="allotInfo.dijie"
                        :quanpei="allotInfo.quanpei"
                        :chedui="allotInfo.chedui"
                        :gongsi="allotInfo.gongsi"
                ></ProfitAllotTable>
            </el-col>
        </el-row>
        <el-row>
            <el-table
                    :data="accountInfo"
            >
                <el-table-column
                        prop="name"
                        label="名称"
                ></el-table-column>
                <el-table-column
                        prop="people_count"
                        label="人数"
                ></el-table-column>
                <el-table-column
                        prop="profit"
                        label="利润"
                ></el-table-column>
                <el-table-column
                        prop="allot_str"
                        label="分配方式"
                ></el-table-column>
                <el-table-column
                        prop="pay_type_name"
                        label="签单/现付"
                ></el-table-column>
                <el-table-column
                        prop="status_name"
                        label="审验状态"
                ></el-table-column>
                <el-table-column label="操作">
                    <template scope="scope">
                        <el-button
                                size="small"
                                @click="handleEdit(scope.$index, scope.row)">编辑
                        </el-button>
                        <el-button
                                size="small"
                                type="danger"
                                @click="handleDelete(scope.$index, scope.row)">删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-row>

        <div class="block bottom-buttons">
            <span class="bottom_botton_wraper">
                <el-button type="primary" class="button"
                           @click.native="saveSubmit">保存</el-button>
                <el-button type="primary" class="button"
                           @click.native="handleAdd">新增模块</el-button>
            </span>
        </div>

        <TeamAccountDialog
                :formData="addFormData"
                :form_visible="addFormVisible"
                @on_submit="addSubmit"
                @onClose="addFormVisible = false"
                :accountConfig="accountConfig"
                :teamId="teamId"
                :title="'添加'"
        ></TeamAccountDialog>

        <TeamAccountDialog
                :formData="editFormData"
                :form_visible="editFormVisible"
                @on_submit="editSubmit"
                @onClose="editFormVisible = false"
                :accountConfig="accountConfig"
                :teamId="teamId"
                :title="'编辑'"
        ></TeamAccountDialog>
    </section>
</template>

<script>
    import {mapActions, mapState} from 'vuex';
    import ElRow from "element-ui/packages/row/src/row";
    import ElCol from "element-ui/packages/col/src/col";
    import Config from '../../api/config'
    import {getDataListPage} from '../../api/api'
    import TeamAccountDialog from '../components/teamdetail/TeamAccountDialog.vue'
    import {calculateProfit, calcuAllotInfoTable, calcuBaseInfoTable} from '../../tools/utils'
    import BaseInfoTable from '../components/teamdetail/BaseInfoTable.vue'
    import ProfitAllotTable from '../components/teamdetail/ProfitAllotTable.vue'

    export default {
        components: {
            ElCol,
            ElRow,
            TeamAccountDialog,
            BaseInfoTable,
            ProfitAllotTable,
        },
        data: function () {
            return {
                addFormVisible: false,
                addFormData: {},
                editFormVisible: false,
                editFormData: {},
                baseInfo: {
                    xianjin: 0,
                    qiandan: 0,
                    shishou: 0,
                    lirun: 0,
                },
                allotInfo: {
                    dijie: 0,
                    quanpei: 0,
                    chedui: 0,
                    gongsi: 0,
                },
                accountInfo: []
            }
        },
        props: {},
        methods: {
            ...mapActions([
                'refreshAccountConfig',
            ]),
            formatData: function (inarr) {
                inarr.forEach(item => {
                    item.profit = calculateProfit(
                        item.sell_price, item.back_price,
                        item.people_count, item.with_cash
                    );

                    if (item.pay_type == 0) {
                        item.pay_type_name = "签单";
                    } else {
                        item.pay_type_name = "现付";
                    }

                    if (item.allot_type == 1) {
                        item.allot_type_name = "比例";
                    } else {
                        item.allot_type_name = "利润";
                    }

                    item.allot_str = ('(' + item.allot_type_name + ')'
                        + item.allot_local + '\\' + item.allot_company + '\\'
                        + item.allot_driver + '\\' + item.allot_company);


                });
                return inarr;
            },
            saveSubmit: function () {
                console.log("saveSubmit called");
            },
            addSubmit: function () {
                this.addFormVisible = false;
                this.getData();
            },
            editSubmit: function () {
                this.editFormVisible = false;
                this.getData();
            },
            handleAdd: function () {
                this.addFormVisible = true;
                this.addFormData = {
                    type_id: 2,   // 类型
                    date_on: "",  // 日期
                    sell_price: "",
                    back_price: "",
                    with_cash: "",
                    flow_account: 0,
                    flow_num: "",
                    parking_price: "",
                    pay_type: 2,
                    allot_type: 1,
                    allot_local: "",
                    allot_national: "",
                    allot_driver: "",
                    allot_company: "",
                };
            },
            handleEdit: function (row_index, row) {
                console.log(row);
                this.editFormData = Object.assign({}, row);
                this.editFormData.editstate = true;
                this.editFormVisible = true;
            },
            getData: function () {
                if (Object.keys(this.$route.params).length > 0) {
                    getDataListPage(Config.entityName.ACCOUNT, this.$route.params).then(
                        (resp) => {
                            this.accountInfo = this.formatData(resp.data.data.data);
                            this.calcSummaryInfo();
                        }
                    )
                }
            },
            calcSummaryInfo() {
                var baseInfo = {
                    xianjin: 0,
                    qiandan: 0,
                    shishou: 0,
                    lirun: 0,
                };

                var allotInfo = {
                    dijie: 0,
                    quanpei: 0,
                    chedui: 0,
                    gongsi: 0,
                };
                
                function sumKeys(sourceObj, destObj) {
                    var keys = Object.keys(sourceObj);
                    for (let k_index = 0; k_index < keys.length; k_index++) {
                        destObj[keys[k_index]] += sourceObj[keys[k_index]];
                    }
                }

                for (let index = 0; index < this.accountInfo.length; index++) {
                    var formData = this.accountInfo[index];
                    var tempBaseInfo = calcuBaseInfoTable(formData);
                    var tempAllotInfo = calcuAllotInfoTable(formData);
                    sumKeys(tempBaseInfo, baseInfo);
                    sumKeys(tempAllotInfo, allotInfo);
                }

                Object.assign(this.baseInfo, baseInfo);
                Object.assign(this.allotInfo, allotInfo);
            }
        },
        computed: {
            ...mapState([
                'accountConfig',
            ]),
            teamId: function () {
                return this.$route.params['team_id'];
            }
        },
        mounted: function () {
            this.refreshAccountConfig();
            this.getData();
        }
    }
</script>

<style scoped lang="scss">
    .summary-row {
        .el-col {
            padding: 5px;
        }
    }
</style>