<template>
    <div  class="impDiv" @click.stop="void(0)" :style="{width:width+'px',top:xy.top+'px',left:xy.left-width+'px'}">
        <div class="triangle"></div>
        <div class="abs" style="text-align: center;margin-top:0%;width: 100%;letter-spacing: 5px;color: #cdd2fb;font-size: 18px;">
            <span style="position: relative;">日期<el-date-picker v-model="startDate" format="YYYY-MM-DD" type="date" placeholder="选择日期" style="z-index:100000"></el-date-picker>
                <el-button style="margin-left:10px" @click="impdata">导出</el-button>
            </span>                
        </div>
        <div>

        </div>
    </div>
</template>
<style>
    @import '../../styles/main.css';
    .el-date-editor.el-input, .el-date-editor.el-input__wrapper{
        width:150px;

    }
    .el-input__wrapper{
        background-color:#1f4774;
        box-shadow: 0 0 0 1px #7f9bdd inset !important;
    }
    .el-input__wrapper input{
        border:0px !important;
        color:#fff;
    }
</style>
<script>
    import { ref,onMounted,watch } from 'vue';
    import api from "@/api/system";
    import { ElDatePicker,ElMessage } from 'element-plus';
    import 'element-plus/dist/index.css'; // 确保导入样式文件
    import * as echarts from 'echarts';
    export default {
        props:{
            xy:{
                type:Object
            }

        },
        setup(props,{emit}){
            const width=ref(300)
            let startDate=ref('');
            let endDate = ref('');

            function impquery(){

            }

            function impdata(){
                if(startDate.value=='' || startDate.value==null ){
                    ElMessage({
                        message: "未选择正确的日期",
                        type: "error"
                    })
                    return;
                }
                window.open(ApiServer + "/api/export/energy-day?date="+startDate.value);
            }

            onMounted(()=>{
                var day = new Date();
                if(day.getHours()<7){
                    day=day.setDate(day.getDate()-2);
                }else{
                    day=day.setDate(day.getDate()-1);
                }
                startDate.value = new Date(day).Format("yyyy-MM-dd");
            })

            return{
                width,
                startDate,
                endDate,
                impdata,
                impquery,
            }
        }
    }
</script>