fix:tkx生产报告、单位产品电耗echarts选择显示

This commit is contained in:
shijing 2024-06-24 11:14:42 +08:00
parent 160dd3cfdc
commit fc119e3f2a
11 changed files with 727 additions and 30 deletions

View File

@ -74,7 +74,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -82,7 +123,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -90,7 +131,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -177,6 +218,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
chartShow: false,
myOption: null,
optionHour: {},
@ -445,6 +488,24 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getHourData() {
let that = this;
@ -587,4 +648,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -82,7 +82,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -90,7 +131,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -98,7 +139,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -211,6 +252,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
chartShow: false,
myOption: null,
optionHour: {},
@ -591,6 +634,24 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getHourData() {
let that = this;
@ -728,4 +789,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -74,7 +74,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -82,7 +123,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -90,7 +131,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -186,6 +227,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
exportLoading: false,
chartShow: false,
myOption: null,
@ -559,6 +602,25 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
this.searchDate;
},
//
getHourData() {
let that = this;
@ -785,4 +847,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -92,7 +92,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -100,7 +141,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -108,7 +149,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -371,6 +412,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
exportLoading: false,
chartShow: false,
myOption: null,
@ -855,6 +898,24 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getHourData() {
let that = this;
@ -1010,4 +1071,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -74,7 +74,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -82,7 +123,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -90,7 +131,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -184,6 +225,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
exportLoading: false,
chartShow: false,
myOption: null,
@ -519,6 +562,25 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
this.searchDate;
},
//
getHourData() {
let that = this;
@ -721,4 +783,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -84,7 +84,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -92,7 +133,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -100,7 +141,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -340,6 +381,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
exportLoading: false,
chartShow: false,
myOption: null,
@ -766,6 +809,25 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
this.searchDate;
},
//
getHourData() {
let that = this;
@ -913,4 +975,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -66,7 +66,38 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -74,7 +105,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -275,6 +306,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "month",
exportLoading: false,
chartShow: false,
timeStamp: null,
@ -517,6 +550,20 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
this.searchDate;
},
//
getDayData() {
let that = this;
@ -597,4 +644,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -74,7 +74,48 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -82,7 +123,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -90,7 +131,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -175,6 +216,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
chartShow: false,
exportLoading: false,
myOption: null,
@ -494,6 +537,24 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getHourData() {
let that = this;
@ -671,4 +732,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -85,8 +85,49 @@
</tr>
</tbody>
</table>
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="day">本日</el-radio-button>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="date"
value-format="YYYY-MM-DD"
formatter="YYYY-MM-DD"
placeholder="选择日期"
v-if="typeRadio == 'day'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<!-- <div id="main" style="width:1200px;height:600px;"></div> -->
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'day'">
<div class="chartTitle">小时生产参数统计图</div>
<scEcharts
height="400px"
@ -94,7 +135,7 @@
:option="optionHour"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -102,7 +143,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -344,6 +385,8 @@ export default {
},
data() {
return {
searchDate: "",
typeRadio: "day",
chartShow: false,
exportLoading: false,
myOption: null,
@ -963,6 +1006,24 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "day") {
let year = val.split("-")[0];
let month = val.split("-")[1];
let days = val.split("-")[2];
this.getHourData(year, month, days);
} else if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getHourData() {
let that = this;
@ -1101,4 +1162,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -66,7 +66,38 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -74,7 +105,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -153,6 +184,8 @@ export default {
},
data() {
return {
typeRadio: "month",
searchDate: "",
exportLoading: false,
chartShow: false,
myOption: null,
@ -339,6 +372,19 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getDayData() {
let that = this;
@ -425,4 +471,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>

View File

@ -66,7 +66,39 @@
</tr>
</tbody>
</table>
<div class="chartWrap">
<div class="radioWrap">
<el-radio-group
v-model="typeRadio"
@change="typeRadioChange"
>
<el-radio-button label="month"
>本月</el-radio-button
>
<el-radio-button label="year">本年</el-radio-button>
</el-radio-group>
<div style="position: absolute; right: 20px">
<el-date-picker
v-model="searchDate"
type="month"
value-format="YYYY-MM"
formatter="YYYY-MM"
placeholder="选择月"
v-if="typeRadio == 'month'"
@change="dateChange"
></el-date-picker>
<el-date-picker
v-if="typeRadio == 'year'"
v-model="searchDate"
type="year"
value-format="YYYY"
formatter="YYYY"
placeholder="选择年"
@change="dateChange"
></el-date-picker>
</div>
</div>
<div class="chartWrap" v-show="typeRadio == 'month'">
<div class="chartTitle">本月生产参数统计图</div>
<scEcharts
height="400px"
@ -74,7 +106,7 @@
:option="optionDay"
></scEcharts>
</div>
<div class="chartWrap">
<div class="chartWrap" v-show="typeRadio == 'year'">
<div class="chartTitle">本年生产参数统计图</div>
<scEcharts
height="400px"
@ -290,6 +322,8 @@ export default {
},
data() {
return {
typeRadio: "month",
searchDate: "",
timeStamp: null,
exportLoading: false,
chartShow: false,
@ -534,6 +568,19 @@ export default {
});
},
methods: {
typeRadioChange() {
this.searchDate = "";
},
dateChange(val) {
console.log(val);
if (this.typeRadio == "month") {
let year = val.split("-")[0];
let month = val.split("-")[1];
this.getDayData(year, month);
} else {
this.getMonthData(val);
}
},
//
getDayData() {
let that = this;
@ -628,4 +675,10 @@ export default {
.printContainer {
padding-left: 20px;
}
.radioWrap {
display: flex;
justify-content: center;
padding-top: 10px;
position: relative;
}
</style>