<template>
    <div class="seach">
        <el-form class="generat-seach" :inline="true" :model="queryForm">
            <el-form-item label="场站" class="!mb-0">
                <el-select v-model="queryForm.station" class="w-[150px]" @change="funStationChange">
                    <el-option v-for="item in stationList" :key="item.id" :label="item.name" :value="item.id">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="风机" class="!mb-0">
                <el-select multiple class="w-[150px]" v-model="queryForm.wtIds" @clear="checkAll = false" collapse-tags>
                    <el-option label="全选" :class="{'selected': checkAll}" @click="funCheckAll"></el-option>
                    <el-option v-for="item in windList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="开始时间" class="!mb-0">
                <div class="search-input">
                    <el-date-picker type="date" class="!w-[150px]" v-model="queryForm.st"></el-date-picker>
                </div>
            </el-form-item>
            <el-form-item label="结束时间" class="!mb-0">
                <el-date-picker type="date" class="!w-[150px]" v-model="queryForm.et"></el-date-picker>
            </el-form-item>
            <el-form-item label="等间隔" class="!mb-0">
                <el-radio-group v-model="queryForm.interval">
                    <el-radio :label="1">一秒钟</el-radio>
                    <el-radio :label="2">一分钟</el-radio>
                    <el-radio :label="3">十分钟</el-radio>
                    <el-radio :label="4">十五分钟</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item class="!mb-0">
                <el-button type="primary" @click="funSubmit">执行</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import SubmitBtn from '@/components/generatingCapacityComponent/SubmitBtn.vue'
    import {
        ElMessage
    } from 'element-plus'
    import {
        apiGetbaseStation,
        apiGetbaseWindturbine,
        apiGetpowerpreparedata
    } from '@/api/gengra'
    export default {
        components: {
            SubmitBtn
        },
        data() {
            return {
                queryForm: {
                    station: '',
                    wtIds: [],
                    st: Date.now() - 30 * 24 * 60 * 60 * 1000,
                    et: Date.now(),
                    interval: 3
                },
                checkAll: true,
                stationList: [],
                windList: []
            }
        },
        mounted() {
            this.funGetStation()
        },
        methods: {
            funSubmit() {
                const startDate = new Date(this.queryForm.st).setHours(0, 0, 0, 0)
                const endDate = new Date(this.queryForm.et).setHours(0, 0, 0, 0)
                const query = {
                    station: this.queryForm.station,
                    wtIds: this.queryForm.wtIds.join(),
                    st: new Date(startDate).getTime(),
                    et: new Date(endDate).getTime(),
                    interval: this.queryForm.interval
                }
                switch (this.queryForm.interval) {
                    case 2:
                        query.interval = 60
                        break;
                    case 3:
                        query.interval = 600
                        break;
                    case 4:
                        query.interval = 900
                        break;
                }
                apiGetpowerpreparedata(query).then(res => {
                    if (res.code === 200) {
                        ElMessage.success(res.msg)
                    }
                })
            },
            /**场站 */
            funGetStation() {
                let that = this
                apiGetbaseStation().then(res => {
                    if (res) {
                        that.stationList = res.data
                        if (that.stationList.length) {
                            that.queryForm.station = that.stationList[0].id
                            that.funGetWind(that.queryForm.station)
                        }
                    }
                })
            },
            funStationChange(stationId) {
                if (stationId) {
                    this.funGetWind(stationId)
                } else {
                    this.windList = []
                }
            },
            /**风机 */
            funGetWind(stationId) {
                let that = this
                apiGetbaseWindturbine({
                    stationId: stationId
                }).then(res => {
                    if (res) {
                        that.windList = res.data
                        that.queryForm.wtIds = res.data.map(o => o.id)
                        that.checkAll = true
                    }
                })
            },
            funCheckAll() {
                this.checkAll = !this.checkAll
                if (this.checkAll) {
                    this.queryForm.wtIds = this.windList.map(o => o.id)
                } else {
                    this.queryForm.wtIds = []
                }
            }
        }
    }
</script>

<style lang="less">
    .seach {
        padding: 20px 0 0 20px;
    }
</style>