优化多个弹出框
fanluyan
6 months ago
parent
15b220d37d
commit
0cbf443c26
@ -1,198 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="icingBox">
|
|
||||||
<div class="icingContain">
|
|
||||||
<leftTree ref="sideTree"></leftTree>
|
|
||||||
<div class="rightTable">
|
|
||||||
<div class="dataBox">
|
|
||||||
<div class="childBox">
|
|
||||||
<div class="searchBox" ref="searchref">
|
|
||||||
<el-form
|
|
||||||
:inline="true"
|
|
||||||
:model="formdata"
|
|
||||||
class="demo-form-inline"
|
|
||||||
>
|
|
||||||
<el-form-item label="开始日期">
|
|
||||||
<el-date-picker
|
|
||||||
v-model="formdata.starttime"
|
|
||||||
type="date"
|
|
||||||
placeholder="开始日期"
|
|
||||||
>
|
|
||||||
</el-date-picker>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="结束日期">
|
|
||||||
<el-date-picker
|
|
||||||
@change="changedate"
|
|
||||||
v-model="formdata.endtime"
|
|
||||||
type="date"
|
|
||||||
placeholder="结束日期"
|
|
||||||
class="ml10"
|
|
||||||
>
|
|
||||||
</el-date-picker>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="exportExcl"
|
|
||||||
>导出数据</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button
|
|
||||||
v-if="!echartsShow"
|
|
||||||
type="primary"
|
|
||||||
@click="lookLineCharts"
|
|
||||||
>曲线图</el-button
|
|
||||||
>
|
|
||||||
<el-button
|
|
||||||
v-if="echartsShow"
|
|
||||||
type="primary"
|
|
||||||
@click="lookTableCharts"
|
|
||||||
>列表数据</el-button
|
|
||||||
>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import leftTree from "../components/leftTree.vue";
|
|
||||||
import {
|
|
||||||
LeadPullJoggle,
|
|
||||||
leadpullsListJoggle,
|
|
||||||
exportJoggle,
|
|
||||||
} from "@/utils/api/iceApi";
|
|
||||||
export default {
|
|
||||||
name: "icing",
|
|
||||||
components: {
|
|
||||||
leftTree,
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
echartsShow: false,
|
|
||||||
formdata: {},
|
|
||||||
paramsData: null,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
endtime(newVal) {
|
|
||||||
if (newVal) {
|
|
||||||
const date = new Date(newVal);
|
|
||||||
date.setHours(23);
|
|
||||||
date.setMinutes(59);
|
|
||||||
date.setSeconds(59);
|
|
||||||
this.formdata.endtime = date.getTime();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
var that = this;
|
|
||||||
document.onkeydown = function (e) {
|
|
||||||
var key = window.event.keyCode;
|
|
||||||
if (key === 13) {
|
|
||||||
that.onSubmit(); // 触发事件
|
|
||||||
}
|
|
||||||
};
|
|
||||||
this.$set(
|
|
||||||
this.formdata,
|
|
||||||
"starttime",
|
|
||||||
new Date(new Date().toLocaleDateString()).getTime()
|
|
||||||
);
|
|
||||||
const currentDate = new Date(); // 获取当前时间
|
|
||||||
currentDate.setHours(23); // 设置小时为23
|
|
||||||
currentDate.setMinutes(59); // 设置分钟为59
|
|
||||||
currentDate.setSeconds(59); // 设置秒数为59
|
|
||||||
this.$set(this.formdata, "endtime", currentDate.getTime());
|
|
||||||
},
|
|
||||||
mounted() {},
|
|
||||||
methods: {
|
|
||||||
//结束日期
|
|
||||||
changedate() {
|
|
||||||
console.log(new Date(this.formdata.endtime));
|
|
||||||
const currentDate = new Date(this.formdata.endtime); // 获取当前时间
|
|
||||||
currentDate.setHours(23); // 设置小时为23
|
|
||||||
currentDate.setMinutes(59); // 设置分钟为59
|
|
||||||
currentDate.setSeconds(59); // 设置秒数为59
|
|
||||||
this.formdata.endtime = currentDate;
|
|
||||||
console.log("结束时间", this.formdata.endtime);
|
|
||||||
},
|
|
||||||
//点击左侧tree 获取信息
|
|
||||||
getCurrentData(data) {
|
|
||||||
console.log("执行父组件", data);
|
|
||||||
this.paramsData = data;
|
|
||||||
let pullParams;
|
|
||||||
console.log(data);
|
|
||||||
const sTime = Math.floor(this.formdata.starttime / 1000);
|
|
||||||
const eTime = Math.floor(this.formdata.endtime / 1000);
|
|
||||||
if (data.dyValue) {
|
|
||||||
console.log("电压-公司");
|
|
||||||
pullParams = {
|
|
||||||
devType: "2",
|
|
||||||
dyId: data.id,
|
|
||||||
pageNum: 1,
|
|
||||||
pageSize: this.pageSize,
|
|
||||||
start: sTime,
|
|
||||||
end: eTime,
|
|
||||||
};
|
|
||||||
this.getIcingData(pullParams);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
//查询
|
|
||||||
onSubmit() {},
|
|
||||||
exportExcl() {
|
|
||||||
const sTime = Math.floor(this.formdata.starttime / 1000);
|
|
||||||
const eTime = Math.floor(this.formdata.endtime / 1000);
|
|
||||||
window.location.href =
|
|
||||||
"/api/xymanager/leadpulls/export?+" +
|
|
||||||
"lineId=" +
|
|
||||||
this.paramsData.lineid +
|
|
||||||
"&termId=" +
|
|
||||||
this.paramsData.id +
|
|
||||||
"&towerId=" +
|
|
||||||
this.paramsData.towerid +
|
|
||||||
"&start=" +
|
|
||||||
sTime +
|
|
||||||
"&end=" +
|
|
||||||
eTime;
|
|
||||||
},
|
|
||||||
//查看图表
|
|
||||||
lookTableCharts() {},
|
|
||||||
//查看折线图
|
|
||||||
lookLineCharts() {},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style lang="less">
|
|
||||||
.icingBox {
|
|
||||||
width: calc(100% - 24px);
|
|
||||||
height: calc(100% - 24px);
|
|
||||||
padding: 12px 12px;
|
|
||||||
background: #fff;
|
|
||||||
.icingContain {
|
|
||||||
display: flex;
|
|
||||||
height: 100%;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: #fff;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
.rightTable {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
flex: 1;
|
|
||||||
overflow: hidden;
|
|
||||||
border-left: 1px solid #ddd;
|
|
||||||
.dataBox {
|
|
||||||
width: calc(100% - 24px);
|
|
||||||
height: calc(100% - 24px);
|
|
||||||
padding: 12px 12px;
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in New Issue