123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112 |
- <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="" 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" :value-format="'YYYY-MM-DD'" type="date" placeholder="选择日期"></el-date-picker>
- <span> 到 </span>
- <el-date-picker v-model="endDate" type="date" :value-format="'YYYY-MM-DD'" placeholder="选择日期"></el-date-picker>
- <span> 时间 </span>
- <el-select style="width: 100px;" v-model="startH"><el-option v-for="item in startHourList" :key="item.code" :label="item.name" :value="item.code"></el-option> </el-select>
- <span> 到 </span>
- <el-select style="width: 100px;" v-model="endH"><el-option v-for="item in endHourList" :key="item.code" :label="item.name" :value="item.code"></el-option> </el-select>
- <el-button style="margin: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;
- }
- .el-select__wrapper{
- background-color: #1f4774;
- }
- .el-select__selected-item{
- color: #fff !important;
- }
- </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(700)
- let startDate=ref('');
- let endDate = ref('');
- let startH = ref(7);
- let endH = ref(19);
- let startHourList = ref([]);
- let endHourList = ref([]);
- function impquery(){
- }
- function impdata(){
- if(startDate.value=='' || endDate.value=='' || startDate.value==null || endDate.value==null){
- ElMessage({
- message: "未选择正确的日期",
- type: "error"
- })
- return;
- }
- window.open(ApiServer + "/api/export/stops/type/6?start="+startDate.value+"&end="+endDate.value+"&st="+startH.value+"&et="+endH.value)
- }
- onMounted(()=>{
- var day = new Date();
- if(day.getHours()<7){
- day=day.setDate(day.getDate()-2);
- }else{
- day=day.setDate(day.getDate()-1);
- }
- var day1 = new Date().setDate(new Date(day).getDate() - 7);
- startDate.value = new Date(day1).Format("yyyy-MM-dd");
- endDate.value =new Date(day).Format("yyyy-MM-dd");
- var hour1Opts = [];
- var hour2Opts = [];
- //var nowHour = new Date().Format("h");
- for (var i = 0; i < 24; i++) {
- hour1Opts.push({"name":i+'时',"code":i});
- hour2Opts.push({"name":i+'时',"code":i});
- }
- startHourList.value = hour1Opts;
- endHourList.value = hour2Opts;
- })
- return{
- width,
- startDate,
- endDate,
- startH,
- endH,
- startHourList,
- endHourList,
- impdata,
- impquery,
- }
- }
- }
- </script>
|