<#include "/incloud/header.ftl" />
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html>
<@header></@header>

<body class="hold-transition skin-blue sidebar-mini">
    <div class="wrapper">

        <@top></@top>
        <@left></@left>

        <!-- Content Wrapper. Contains page content -->
        <div class="content-wrapper">
            <!-- Content Header (Page header) -->
            <section class="content-header">
                <h1>
                    统计信息录入1
                    <small>Optional description</small>
                </h1>
                <ol class="breadcrumb">
                    <li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>
                    <li class="active">Here</li>
                </ol>
            </section>
            <!-- Main content -->
            <section class="content container-fluid" id="app">
                <div class="box-body">
                    <!--查询区域-->
                    <div class="query">
                        <el-form :inline="true" :model="con" class="demo-form-inline">
                            <el-form-item label="" :label-width="queryLabelWidth">
                                <el-date-picker v-model="con.createTime" type="daterange" range-separator="至"
                                    start-placeholder="新增开始日期" end-placeholder="新增结束日期">
                                </el-date-picker>
                            </el-form-item>
                            <el-form-item label="" :label-width="queryLabelWidth">
                                <el-date-picker v-model="con.dataTime" type="daterange" range-separator="至"
                                    start-placeholder="数据开始日期" end-placeholder="数据结束日期">
                                </el-date-picker>
                            </el-form-item>
                            <el-form-item label="" :label-width="queryLabelWidth">
                                <el-cascader placeholder="景区" v-model="con.companyScenic"
                                    :options="companyScenicOptions" :props="{ multiple: true }">
                            </el-form-item>
                            </el-cascader>
                            <el-form-item label="" :label-width="queryLabelWidth">
                                <el-input v-model="con.name" placeholder="姓名" maxlength="4" minlength="2"></el-input>
                            </el-form-item>
                            <el-form-item label="" :label-width="queryLabelWidth">
                                <el-button type="primary" @click="loadTable1()">查询</el-button>
                            </el-form-item>
                        </el-form>
                    </div>
                    <!--功能按钮区-->
                    <div class="buttonDiv">
                        <el-button size="mini" type="primary" class="pagination-but" @click="addClick">新增
                        </el-button>
                    </div>
                    <!--表格区-->
                    <el-table border :data="tableData" style="width: 100%">
                        <el-table-column min-width="150px" label="上报日期" prop="createTime">
                        </el-table-column>
                        <el-table-column min-width="150px" label="上报人" prop="manager">
                        </el-table-column>
                        <el-table-column min-width="150px" label="公司" prop="company">
                        </el-table-column>
                        <el-table-column min-width="150px" label="景区" prop="scenic">
                        </el-table-column>
                        <el-table-column min-width="150px" label="数据日期" prop="staticDate">
                        </el-table-column>
                        <el-table-column label="操作" min-width="300px">
                            <template slot-scope="scope">
                                <el-button size="mini" type="primary" @click="table1View(scope.$index, scope.row)">
                                    查看
                                </el-button>
                                <el-button size="mini" type="primary" @click="table1View(scope.$index, scope.row,'edit')">修改
                                </el-button>
                                <el-button size="mini" type="danger" @click="table1Del(scope.$index, scope.row)">删除
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <!--分页-->
                    <div class="block">
                        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                            :current-page="con.currentPage" :page-sizes="[1,10, 50, 200, 500]" :page-size="con.pageSize"
                            layout="total, sizes, prev, pager, next, jumper, slot" :total="con.total">
                        </el-pagination>
                    </div>
                    <!--对话框1 新增-->
                    <el-dialog title="新增" :visible.sync="dialog1Visible" :custom-class="'ele-dialog'" :center="true">
                            <span class="demonstration">数据日期</span>
                            <el-date-picker
                                v-model="staticDate"
                                :disabled="disableStaticDate"
                                type="date"
                                format="yyyy-MM-dd"
                                value-format="yyyy-MM-dd"
                                :clearable = "false"
                                :editable = "false"
                                placeholder="选择日期">
                            </el-date-picker>
                        <el-collapse v-model="collapse">
                            <el-collapse-item title="大峡谷景区" name="0" v-if="addData[0].show">
                                <el-form :model="addData[0]" status-icon :label-width="formLabelWidth" inline ref="form0" :disabled="disableForm">
                                    <template v-for="(item,i) in addData[0].income">
                                        <el-form-item :label="item.item" :prop="'income['+i+'].sum'" :rules="commonRule">
                                            <el-input-number v-model="item.sum" controls-position="right" :min="0"></el-input-number>
                                        </el-form-item>
                                    </template>
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[0],2,6)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[0],'total',$event)"></el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[0],0,2)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[0],'personTimes',$event)"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="水车坪景区" name="1" v-if="addData[1].show">
                                <el-form :model="addData[1]" status-icon :label-width="formLabelWidth" inline ref="form1" :disabled="disableForm">
                                    <template v-for="(item,i) in addData[1].income">
                                        <el-form-item :label="item.item" :prop="'income['+i+'].sum'" :rules="commonRule">
                                            <el-input-number v-model="item.sum" controls-position="right" :min="0"></el-input-number>
                                        </el-form-item>
                                    </template>
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[1],0,2)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[1],'total',$event)"></el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[1].personTimes" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false">
                                    </el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="濯水景区" name="2" v-if="addData[2].show">
                                <el-form :model="addData[2]" status-icon :label-width="formLabelWidth" inline ref="form2" :disabled="disableForm">
                                    <template v-for="(item,i) in addData[2].income">
                                        <el-form-item :label="item.item" :prop="'income['+i+'].sum'" :rules="commonRule">
                                            <el-input-number v-model="item.sum" controls-position="right" :min="0"></el-input-number>
                                        </el-form-item>
                                    </template>
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[2],2,14)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[2],'total',$event)"></el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[2],0,2)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[2],'personTimes',$event)"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="小南海" name="3"  v-if="addData[3].show">
                                <el-form :model="addData[3]" status-icon :label-width="formLabelWidth" inline ref="form3" :disabled="disableForm">
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[3].total" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false">
                                    </el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[3].personTimes" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="十三寨" name="4"  v-if="addData[4].show">
                                <el-form :model="addData[4]" status-icon :label-width="formLabelWidth" inline ref="form4" :disabled="disableForm">
                                    <template v-for="(item,i) in addData[4].income">
                                        <el-form-item :label="item.item" :prop="'income['+i+'].sum'" :rules="commonRule">
                                            <el-input-number v-model="item.sum" controls-position="right" :min="0"></el-input-number>
                                        </el-form-item>
                                    </template>
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[4],2,3)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[4],'total',$event)"></el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[4],0,2)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[4],'personTimes',$event)"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="神龟峡景区" name="5"  v-if="addData[5].show">
                                <el-form :model="addData[5]" status-icon :label-width="formLabelWidth" inline ref="form5" :disabled="disableForm">
                                    <template v-for="(item,i) in addData[5].income">
                                        <el-form-item :label="item.item" :prop="'income['+i+'].sum'" :rules="commonRule">
                                            <el-input-number v-model="item.sum" controls-position="right" :min="0"></el-input-number>
                                        </el-form-item>
                                    </template>
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[5],2,3)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[5],'total',$event)"></el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[5],0,2)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[5],'personTimes',$event)"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="官村" name="6"  v-if="addData[6].show">
                                <el-form :model="addData[6]" status-icon :label-width="formLabelWidth" inline ref="form6" :disabled="disableForm">
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[6].total" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false">
                                    </el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[6].personTimes" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="爱莉丝" name="7"  v-if="addData[7].show">
                                <el-form :model="addData[7]" status-icon :label-width="formLabelWidth" inline ref="form7" :disabled="disableForm">
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[7].total" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false">
                                    </el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        v-model="addData[7].personTimes" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                            <el-collapse-item title="阿蓬江旅行社公司" name="8" v-if="addData[8].show">
                                <el-form :model="addData[8]" status-icon :label-width="formLabelWidth" inline ref="form8" :disabled="disableForm">
                                    <template v-for="(item,i) in addData[8].income">
                                        <el-form-item :label="item.item" :prop="'income['+i+'].sum'" :rules="commonRule">
                                            <el-input-number v-model="item.sum" controls-position="right" :min="0"></el-input-number>
                                        </el-form-item>
                                    </template>
                                    <el-form-item label="合计收入" prop="total" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[8],0,4)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[8],'total',$event)"></el-input-number>
                                    </el-form-item>
                                    <el-form-item label="合计人次" prop="personTimes" :rules="commonRule">
                                        <el-input-number 
                                        :value="countVal(addData[8],4,7)" 
                                        controls-position="right" 
                                        :min="0" 
                                        :controls="false"
                                        @input="bind(addData[8],'personTimes',$event)"></el-input-number>
                                    </el-form-item>
                                </el-form>
                            </el-collapse-item>
                        </el-collapse>
                        <div slot="footer" class="dialog-footer">
                            <el-button type="primary" @click="dialog1Sub('dialog1')" :disabled="disableForm">提 交</el-button>
                            <el-button @click="dialog1Visible = false">取 消</el-button>
                        </div>
                    </el-dialog>
                </div>
            </section>
            <!-- /.content -->
        </div>
        <!-- Main Footer -->
        <@footer></@footer>
    </div>
</body>
<script src="/js/util/dyAjax.js"></script>
<script>
    $(function () {
        const initIncomeFunc = arr => Array.from(arr, item => { return { item, sum: 0 } })
        const TYPE_AUTHORITY = { authority: 0, companyScenic: [[0, 0]] }
        const COMPANY_SCENIC = [
            {
                value: 0,
                label: '巴拉胡景区管理公司',
                children: [
                    { value: 0, label: '大峡谷景区' },
                    { value: 1, label: '水车坪景区' },
                    { value: 2, label: '濯水景区' },
                    { value: 3, label: '小南海' },
                    { value: 4, label: '十三寨' }]
            }, {
                value: 1,
                label: '芭拉胡公司',
                children: [
                    { value: 5, label: '神龟峡景区' }]
            }, {
                value: 2,
                label: '爱莉丝公司',
                children: [
                    { value: 6, label: '官村' },
                    { value: 7, label: '爱莉丝' }]
            }, {
                value: 3,
                label: '阿蓬江旅行社公司',
                children: [{ value: 8, label: '阿蓬江旅行社公司' }]
            }]
        const FULL_ADD_DATA = [
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[0].label,
                    scenic: COMPANY_SCENIC[0].children[0].label,
                    income: initIncomeFunc(['门票 散客人次', '门票 团队人次', '门票收入', '中转车收入', '停车费收入', '玻璃桥索道收入'])
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[0].label,
                    scenic: COMPANY_SCENIC[0].children[1].label,
                    income: initIncomeFunc(['骑马收入', '露营收入'])
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[0].label,
                    scenic: COMPANY_SCENIC[0].children[2].label,
                    income: initIncomeFunc(['暗河门票 散客人次', '暗河门票 团队人次', '门票收入', '花田收入', '钟楼收入',
                        '芭茅岛酒店收入', '蒲花河酒店收入', '水乐园收入', '特产馆收入', '暗河购物中心收入',
                        '观光车收入', '竹筏收入', '快艇收入', '水上自行车收入'])
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[0].label,
                    scenic: COMPANY_SCENIC[0].children[3].label
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[0].label,
                    scenic: COMPANY_SCENIC[0].children[4].label,
                    income: initIncomeFunc(['门票 散客人次', '门票 团队人次', '门票收入'])
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[1].label,
                    scenic: COMPANY_SCENIC[1].children[0].label,
                    income: initIncomeFunc(['船票 散客人次', '船票 团队人次', '船票收入'])
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[2].label,
                    scenic: COMPANY_SCENIC[2].children[0].label
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[2].label,
                    scenic: COMPANY_SCENIC[2].children[1].label
                },
                {
                    total:0,
                    show:false,
                    personTimes:0,
                    company: COMPANY_SCENIC[3].label,
                    scenic: COMPANY_SCENIC[3].children[0].label,
                    income: initIncomeFunc(['组团收入', '地接收入', '研学收入','导服收入','组团人次','地接人次','研学人次','收入合计','合计人次'])
                }
            ]
        const copy = obj => JSON.parse(JSON.stringify(obj))


        var option = {
            mixins: [dyMixin],
            data() {
                return {
                    disableStaticDate:false,
                    disableForm: false,
                    staticDate:new Date().toJSON().slice(0,10),
                    formLabelWidth:'200px',
                    collapse: ['0', '1', '2', '3', '4', '5', '6', '7', '8'],
                    companyScenic: undefined,
                    companyScenicOptions: [...COMPANY_SCENIC],
                    con: { dataTime: undefined, companyScenic: undefined, currentPage: 1, pageSize: 10, total: 0, createTime: undefined, },//查询条件
                    tableData: [],
                    dialog1Visible: false,//对话框隐藏
                    addData:copy(FULL_ADD_DATA),
                    editData: {},//编辑数据
                    typeAuthority: Object.assign(TYPE_AUTHORITY),//角色数据
                    roleIds: [],
                    dialog2Visible: false,//编辑弹框隐藏
                    dialog3Visible: false,//角色弹框隐藏
                    commonRule: {
                        required: true, trigger: ['blur','change'], message: '不能为空'
                    },
                    MANAGE_STATUS: { '正常': "1", '无效': "0" },//账户状态
                }
            },
            mounted: function () {
                this.loadTable1();
            },
            methods: {
                addClick(){
                    let _this = this;
                    $.dyAjax('/inputInfo/getTypeAuthority', {}, function (data) {
                        _this.dialog1Visible = true
                        _this.addData = copy(FULL_ADD_DATA)
                        _this.addData.forEach((item,i) => item.show = data.includes(i) )
                        _this.collapse = Array.from(data, item => item+'')
                        _this.disableStaticDate = false
                        _this.disableForm = false
                    });
                },
                countVal(scenic,form,to){
                    return scenic.income.slice(form,to).reduce((acc,cur) => acc+cur.sum,0)
                },
                bind(bindVal,key,val){
                    bindVal[key] = val
                },
                // 表1 冻结 解结
                table1FreezeUnfreeza(id, stutes) {
                    let _this = this;
                    let isFreeze = stutes === _this.MANAGE_STATUS.无效;
                    this.$confirm(isFreeze ? '确定冻结' : '确定解冻?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        $.dyAjax('/inputInfo/freezeUnfreeza', { id: id, status: stutes }, function (data) {
                            _this.$message({ message: '操作成功', type: 'success' });
                            _this.loadTable1();
                        });
                    }).catch(() => {
                    });
                },
                //编辑
                table1Edit(index, row) {
                    let _this = this;
                    $.dyAjax('/inputInfo/get/' + row.id, {}, function (data) {
                        _this.editData = data;
                        _this.dialog2Visible = true;
                        console.log(data);
                    }, 'get');
                },
                //翻页大小改变事件
                handleSizeChange(val) {
                    var _this = this;
                    _this.con.pageSize = val;
                    _this.loadTable1();
                },
                //翻页翻页事件
                handleCurrentChange(val) {
                    var _this = this;
                    _this.con.currentPage = val;
                    _this.loadTable1();
                },
                //对话框1提交事件
                dialog1Sub: function (formName) {
                    var _this = this;
                    const promises = [];
                    _this.addData.forEach((el,i)=>{
                        if (el.show){
                            promises.push(this.$refs['form'+i].validate())
                        }
                    })
                    Promise.allSettled(promises).then((results) => {
                       const fail = results.findIndex(result => result.status==='rejected' )>-1
                        if (!fail) {
                            const datas = Object.assign([],_this.addData)
                            datas.forEach(el => el.staticDate = this.staticDate)
                            const datasFilter = datas.filter(el => el.show)
                            const method = datasFilter[0].id?'/inputInfo/edit':'/inputInfo/add'
                            $.dyjAjax(method, datasFilter, function (data) {
                                _this.loadTable1(function () {
                                    _this.$message({
                                        type: 'success',
                                        message: '成功!'
                                    });
                                    _this.dialog1Visible = false;
                                });
                            });
                        } else {
                            return false;
                        }
                    });
                },
                //加载表数据
                loadTable1: function (callback) {
                    var _this = this;
                    $.dyjAjax('/inputInfo/page', this.con, function (data) {
                        callback && callback(data);
                        console.log(data)
                        _this.tableData = data.records;
                        _this.con.total = data.total;
                        _this.con.currentPage = data.current;
                        _this.con.pageSize = data.size;
                    });
                },
                //删除
                table1Del: function (index, row) {
                    let _this = this;
                    console.log(row);
                    this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        $.dyAjax('/inputInfo/del', { id: row.id }, function (data) {
                            _this.loadTable1(function () {
                                _this.$message({
                                    type: 'success',
                                    message: '删除成功!'
                                });
                            });
                        });
                    }).catch(() => {
                    });
                },
                // 查看
                table1View: function (index, row,type = 'view') {
                    const {personTimes,scenic,staticDate,total,id} = row
                    var _this = this;
                    $.dyAjax('/inputInfo/get', {id}, function (data) {
                        _this.addData = copy(FULL_ADD_DATA)
                        _this.addData.forEach(item => {
                            if(item.scenic === scenic){
                                item.show = true
                                item.income = data
                                Object.assign(item,{personTimes,scenic,staticDate,total,id})
                            }else{
                                item.show = false
                            }
                        })
                        _this.dialog1Visible = true
                        _this.disableStaticDate = true
                        _this.disableForm = type === 'view'
                    });
                },
            },
        };
        var app = Vue.extend(option);
        new app().$mount('#app');
    });
</script>

</html>