代码提交_1_31
This commit is contained in:
parent
c230afe1e5
commit
8f7aaf109b
|
|
@ -278,7 +278,7 @@
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<div v-if="time=='年'">
|
<div v-show="time=='年'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" :picker-options="pickerOptionsYearStart"
|
<el-date-picker v-model="addForm.date_range_start" :picker-options="pickerOptionsYearStart"
|
||||||
value-format="yyyy" type="year" placeholder="请选择时间" ref="datePicker" key="year">
|
value-format="yyyy" type="year" placeholder="请选择时间" ref="datePicker" key="year">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
@ -287,7 +287,7 @@
|
||||||
key="year">
|
key="year">
|
||||||
</el-date-picker> -->
|
</el-date-picker> -->
|
||||||
</div>
|
</div>
|
||||||
<div v-if="time=='月'">
|
<div v-show="time=='月'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" type="month" placeholder="请选择时间"
|
<el-date-picker v-model="addForm.date_range_start" type="month" placeholder="请选择时间"
|
||||||
:picker-options="pickerOptionsMonthStart" key="month">
|
:picker-options="pickerOptionsMonthStart" key="month">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
@ -295,7 +295,7 @@
|
||||||
:picker-options="pickerOptionsMonthEnd" key="month">
|
:picker-options="pickerOptionsMonthEnd" key="month">
|
||||||
</el-date-picker> -->
|
</el-date-picker> -->
|
||||||
</div>
|
</div>
|
||||||
<div v-if="time=='周'">
|
<div v-show="time=='周'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" type="week" placeholder="请选择时间" key="week"
|
<el-date-picker v-model="addForm.date_range_start" type="week" placeholder="请选择时间" key="week"
|
||||||
:format="'yyyy 第 WW 周'" @change="changeWeek">
|
:format="'yyyy 第 WW 周'" @change="changeWeek">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
@ -303,7 +303,7 @@
|
||||||
:picker-options="pickerOptionsWeekEnd" key="week" :format="'yyyy 第 WW 周'">
|
:picker-options="pickerOptionsWeekEnd" key="week" :format="'yyyy 第 WW 周'">
|
||||||
</el-date-picker> -->
|
</el-date-picker> -->
|
||||||
</div>
|
</div>
|
||||||
<div v-if="time=='日'">
|
<div v-show="time=='日'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" type="date" placeholder="请选择时间" key="day">
|
<el-date-picker v-model="addForm.date_range_start" type="date" placeholder="请选择时间" key="day">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
<!-- <el-date-picker v-model="addForm.date_range_end" type="date" placeholder="结束日期"
|
<!-- <el-date-picker v-model="addForm.date_range_end" type="date" placeholder="结束日期"
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,458 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
|
|
||||||
|
<script type="text/javascript" src="./libs/vue.minV2.5.17.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/axios.minV0.18.0.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/element-uiV2.15.1.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/iview.minV2.0.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/crypto-jsv4.0.0.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/jquery.minV3.5.1.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/moment.minV2.24.0.js"></script>
|
||||||
|
<link rel="stylesheet" type="text/css" href="./styles/iviewV2.0.css" />
|
||||||
|
<link rel="stylesheet" href="./styles/element-uiV2.15.1.css" />
|
||||||
|
<title id="titname">demo</title>
|
||||||
|
<style type="text/css" media="screen">
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
font: 14px Microsoft YaHei;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
/* background: url(./assets/images/login.png) no-repeat; */
|
||||||
|
/* background: url(./assets/login/bg.jpg) no-repeat; */
|
||||||
|
background-size: 100% 100%;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: 95%;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 1%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.content .list-table {
|
||||||
|
height: calc(100% - 60px);
|
||||||
|
margin-top: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.preDealtail .label {
|
||||||
|
margin: 40px 0;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__body-wrapper {
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right {
|
||||||
|
right: 5px !important;
|
||||||
|
/* 竖向滚动条宽度 */
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table td,
|
||||||
|
.el-table th {
|
||||||
|
padding: 12px 0
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right {
|
||||||
|
right: 0px !important;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right .el-table__fixed-body-wrapper {
|
||||||
|
height: auto !important;
|
||||||
|
/* bottom: 4px !important; */
|
||||||
|
max-height: 100% !important
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right-patch {
|
||||||
|
width: 5px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed {
|
||||||
|
height: auto !important;
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed .el-table__fixed-body-wrapper {
|
||||||
|
/* height: 503px !important; */
|
||||||
|
bottom: 0px !important;
|
||||||
|
max-height: 100% !important
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__fixed {
|
||||||
|
height: auto !important;
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__fixed-right {
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-y .el-table__fixed-right {
|
||||||
|
right: 5px !important;
|
||||||
|
height: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar {
|
||||||
|
height: 7px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--fluid-height .el-table__fixed {
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-button {
|
||||||
|
border-radius: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__body-wrapper::-webkit-scrollbar {
|
||||||
|
width: 0px;
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* //注意:hover */
|
||||||
|
.el-table__body-wrapper:hover::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* // 滚动条的滑块 */
|
||||||
|
.el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #ddd;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__body-wrapper {
|
||||||
|
height: 510px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-scrollbar__wrap::-webkit-scrollbar {
|
||||||
|
width: 6PX !important;
|
||||||
|
height: 6PX !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.el-table__fixed,
|
||||||
|
.el-table__fixed-right {
|
||||||
|
/* height: calc(100% - 6PX) !important; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__body-wrapper.is-scrolling-none~.el-table__fixed-right {
|
||||||
|
height: 100% !important;
|
||||||
|
bottom: 0 !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-y .el-table__fixed-right {
|
||||||
|
right: 6PX !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x:not(.el-table--scrollable-y) .el-table__fixed-right {
|
||||||
|
right: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__footer-wrapper tbody td,
|
||||||
|
.el-table__header-wrapper tbody td {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
.el-table__footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
} */
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="content" id="app">
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<el-form :inline="true" :model="form" class="demo-form-inline">
|
||||||
|
<el-form-item label="能量表名称：">
|
||||||
|
<el-input v-model="form.name"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间：">
|
||||||
|
<el-radio-group v-model="form.resource" @change="handleChange">
|
||||||
|
<el-radio label="月">月</el-radio>
|
||||||
|
<el-radio label="日">日</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-date-picker v-model="form.month" v-show="form.resource=='月'" type="month" placeholder="选择月"
|
||||||
|
value-format="yyyy-MM">
|
||||||
|
</el-date-picker>
|
||||||
|
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"
|
||||||
|
v-show="form.resource=='日'" value-format="yyyy-MM-dd"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="onSubmit(form)">查询</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="list-table">
|
||||||
|
<el-table :data="tableData" ref="table" :key="onlyKey" show-summary border
|
||||||
|
:header-cell-style="{'text-align':'center'}" :cell-style="{'text-align':'center'}"
|
||||||
|
style=" margin-top: 20px" height="600">
|
||||||
|
<el-table-column type="index" label="序号" width="120">
|
||||||
|
<template slot-scope="{ $index, row }">
|
||||||
|
{{$index+1}}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="name" label="能量表名称">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="total_energy_code" label="总热量起止码">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="total_energy" label="总热量">
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
let init = function () {
|
||||||
|
|
||||||
|
}
|
||||||
|
function add0(m) {
|
||||||
|
return m < 10 ? "0" + m : m;
|
||||||
|
}
|
||||||
|
//年月日级格式_/
|
||||||
|
function formattime(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
var m = time.getMonth() + 1;
|
||||||
|
var d = time.getDate();
|
||||||
|
var h = time.getHours();
|
||||||
|
var mm = time.getMinutes();
|
||||||
|
var s = time.getSeconds();
|
||||||
|
return y + "-" + add0(m) + "-" + add0(d);
|
||||||
|
}
|
||||||
|
function formattimeMoth(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
var m = time.getMonth() + 1;
|
||||||
|
return y + "-" + add0(m)
|
||||||
|
}
|
||||||
|
function formattimeYear(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
|
||||||
|
return y
|
||||||
|
}
|
||||||
|
var app = new Vue({
|
||||||
|
el: "#app",
|
||||||
|
data: {
|
||||||
|
form: {
|
||||||
|
name: '',
|
||||||
|
date1: formattime(new Date().getTime()),
|
||||||
|
year: '',
|
||||||
|
month: '',
|
||||||
|
week: '',
|
||||||
|
start: '',
|
||||||
|
end: '',
|
||||||
|
type: "",
|
||||||
|
resource: '日',
|
||||||
|
},
|
||||||
|
tableData: [],
|
||||||
|
position: 0,
|
||||||
|
rowSpanArr: [],
|
||||||
|
onlyKey: '',
|
||||||
|
targetSum: 0,
|
||||||
|
indexData: [],
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
var newTime = formattime(new Date().getTime())
|
||||||
|
this.getTableData(this.form.resource, newTime, '', this.form.name)
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getRealIndex(index, row) {
|
||||||
|
// 在这里可以自定义序号的生成逻辑
|
||||||
|
// 考虑合并单元格的情况
|
||||||
|
// 返回实际的序号值
|
||||||
|
// 假设有一个字段 mergedRows 记录需要合并的行的索引
|
||||||
|
// 你的实际合并行索引数组
|
||||||
|
// 如果当前行的索引在合并行的索引数组中，则返回一个空字符串
|
||||||
|
if (app.indexData.includes(index)) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
//计算实际的序号值
|
||||||
|
return index - app.indexData.filter((mergedRow) => mergedRow < index).length + 1;
|
||||||
|
},
|
||||||
|
|
||||||
|
getSummaries(param) {
|
||||||
|
const { columns, data } = param;
|
||||||
|
const sums = [];
|
||||||
|
columns.forEach((column, index) => {
|
||||||
|
if (index === 0) {
|
||||||
|
sums[index] = '合计';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const values = data.map(item => Number(item[column.property]));
|
||||||
|
if (!values.every(value => isNaN(value))) {
|
||||||
|
sums[index] = values.reduce((prev, curr) => {
|
||||||
|
const value = Number(curr);
|
||||||
|
if (!isNaN(value)) {
|
||||||
|
return prev + curr;
|
||||||
|
} else {
|
||||||
|
return prev;
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
|
sums[index];
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
let formattedData = sums.map(item => {
|
||||||
|
if (typeof item === 'number') {
|
||||||
|
return item.toFixed(2);
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
return formattedData;
|
||||||
|
},
|
||||||
|
handleChange(val) {
|
||||||
|
this.form.date1 = ''
|
||||||
|
this.form.year = ''
|
||||||
|
this.form.month = ''
|
||||||
|
this.form.week = ''
|
||||||
|
this.form.start = ''
|
||||||
|
this.form.end = ''
|
||||||
|
if (val == '月') {
|
||||||
|
this.form.month = formattime(new Date().getTime())
|
||||||
|
} else if (val == '日') {
|
||||||
|
this.form.date1 = formattime(new Date())
|
||||||
|
}
|
||||||
|
},
|
||||||
|
cc() {
|
||||||
|
let weekOfday = moment(this.form.week).format("E");
|
||||||
|
let Monday = moment(this.form.week).subtract(weekOfday, "days").format("YYYY-MM-DD"); //周一日期
|
||||||
|
let Sunday = moment(this.form.week)
|
||||||
|
.add(6 - weekOfday, "days")
|
||||||
|
.format("YYYY-MM-DD"); //周日日期
|
||||||
|
this.form.start = Monday
|
||||||
|
this.form.end = Sunday
|
||||||
|
},
|
||||||
|
// changeWeek(val) {
|
||||||
|
// let weekOfday = moment(val).format("E");
|
||||||
|
// let Monday = moment(val).subtract(weekOfday, "days").format("YYYY-MM-DD"); //周一日期
|
||||||
|
// let Sunday = moment(val)
|
||||||
|
// .add(7 - weekOfday, "days")
|
||||||
|
// .format("YYYY-MM-DD"); //周日日期
|
||||||
|
// console.log(Monday, Sunday);
|
||||||
|
// this.form.start= Monday
|
||||||
|
// this.form.end = Sunday
|
||||||
|
// },
|
||||||
|
getTableData(type, startdate, enddate, name) {
|
||||||
|
//var electricity_data = [];
|
||||||
|
if (type == '日') {
|
||||||
|
var data = {
|
||||||
|
type: type,
|
||||||
|
start_date: startdate,
|
||||||
|
name: name,
|
||||||
|
month: '',
|
||||||
|
}
|
||||||
|
|
||||||
|
} else if (type == '月') {
|
||||||
|
var data = {
|
||||||
|
type: type,
|
||||||
|
start_date: "",
|
||||||
|
name: name,
|
||||||
|
month: startdate,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
axios({
|
||||||
|
method: "POST",
|
||||||
|
url: "http://172.16.1.253:8084/Vue/RealTimeEnergy.aspx/getElectricityList",
|
||||||
|
data: JSON.stringify(data),
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json; charset=utf-8",
|
||||||
|
},
|
||||||
|
}).then(function (res) {
|
||||||
|
app.tableData = res.data.d
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
onSubmit(form) {
|
||||||
|
if (form.resource == '月') {
|
||||||
|
if (form.month != '') {
|
||||||
|
var newTime = formattimeMoth(form.month)
|
||||||
|
this.getTableData(form.resource, newTime, "", form.name)
|
||||||
|
} else {
|
||||||
|
var newTime = formattimeMoth(new Date().getTime())
|
||||||
|
this.getTableData(form.resource, newTime, "", form.name)
|
||||||
|
}
|
||||||
|
} else if (form.resource == '日') {
|
||||||
|
if (form.date1 != '') {
|
||||||
|
var newTime = formattime(form.date1)
|
||||||
|
this.getTableData(form.resource, newTime, '', form.name)
|
||||||
|
} else {
|
||||||
|
var newTime = formattime(new Date().getTime())
|
||||||
|
this.getTableData(this.form.resource, newTime, '', this.form.name)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
if (rowIndex % 2 === 0) {
|
||||||
|
return {
|
||||||
|
rowspan: 2,
|
||||||
|
colspan: 1
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
rowspan: 0,
|
||||||
|
colspan: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (columnIndex === 1) {
|
||||||
|
// const _row = this.spanArr[rowIndex]; //合并行的行数，1代表独占一行，比1大代表合并若干行，0代表不显示
|
||||||
|
// const _col = _row>0 ? 1 : 0; //行如果存在那么列就存在，行不存在那么列也就不存在
|
||||||
|
// return {
|
||||||
|
// rowspan: _row,
|
||||||
|
// colspan: _col
|
||||||
|
// }
|
||||||
|
if (rowIndex % 2 === 0) {
|
||||||
|
return {
|
||||||
|
rowspan: 2,
|
||||||
|
colspan: 1
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
rowspan: 0,
|
||||||
|
colspan: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|
@ -205,10 +205,10 @@
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-date-picker v-model="formInfo.year" v-if="formInfo.time=='年'" type="year" placeholder="选择年"
|
<el-date-picker v-model="formInfo.year" v-show="formInfo.time=='年'" type="year" placeholder="选择年"
|
||||||
value-format="yyyy" key="year">
|
value-format="yyyy" key="year">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
<el-date-picker v-model="formInfo.month" v-if="formInfo.time=='月'" type="month" placeholder="选择月"
|
<el-date-picker v-model="formInfo.month" v-show="formInfo.time=='月'" type="month" placeholder="选择月"
|
||||||
value-format="yyyy-MM" key="month">
|
value-format="yyyy-MM" key="month">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
|
||||||
30
table.html
30
table.html
|
|
@ -62,6 +62,11 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.el-table td,
|
||||||
|
.el-table th {
|
||||||
|
padding: 12px 0
|
||||||
|
}
|
||||||
|
|
||||||
.el-table__fixed-right {
|
.el-table__fixed-right {
|
||||||
right: 0px !important;
|
right: 0px !important;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
@ -83,7 +88,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-table__fixed .el-table__fixed-body-wrapper {
|
.el-table__fixed .el-table__fixed-body-wrapper {
|
||||||
height: 503px !important;
|
/* height: 503px !important; */
|
||||||
bottom: 0px !important;
|
bottom: 0px !important;
|
||||||
max-height: 100% !important
|
max-height: 100% !important
|
||||||
}
|
}
|
||||||
|
|
@ -133,7 +138,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-table__body-wrapper {
|
.el-table__body-wrapper {
|
||||||
height: 510px !important;
|
/* height: 510px !important; */
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-scrollbar__wrap::-webkit-scrollbar {
|
.el-scrollbar__wrap::-webkit-scrollbar {
|
||||||
|
|
@ -182,17 +187,17 @@
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-date-picker v-model="form.year" v-if="form.resource=='年'" type="year" placeholder="选择年"
|
<el-date-picker v-model="form.year" v-show="form.resource=='年'" type="year" placeholder="选择年"
|
||||||
value-format="yyyy">
|
value-format="yyyy">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
<el-date-picker v-model="form.month" v-if="form.resource=='月'" type="month" placeholder="选择月"
|
<el-date-picker v-model="form.month" v-show="form.resource=='月'" type="month" placeholder="选择月"
|
||||||
value-format="yyyy-MM">
|
value-format="yyyy-MM">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
<el-date-picker v-model="form.week" v-if="form.resource=='周'" type="week" format="yyyy 第 WW 周"
|
<el-date-picker v-model="form.week" v-show="form.resource=='周'" type="week" format="yyyy 第 WW 周"
|
||||||
placeholder="选择周" @input="cc">
|
placeholder="选择周" @input="cc">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"
|
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"
|
||||||
v-if="form.resource=='日'" value-format="yyyy-MM-dd"></el-date-picker>
|
v-show="form.resource=='日'" value-format="yyyy-MM-dd"></el-date-picker>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="primary" @click="onSubmit(form)">查询</el-button>
|
<el-button type="primary" @click="onSubmit(form)">查询</el-button>
|
||||||
|
|
@ -202,8 +207,7 @@
|
||||||
|
|
||||||
<div class="list-table">
|
<div class="list-table">
|
||||||
<el-table :data="tableData" ref="table" :key="onlyKey" :span-method="objectSpanMethod"
|
<el-table :data="tableData" ref="table" :key="onlyKey" :span-method="objectSpanMethod"
|
||||||
:summary-method="getSummaries" show-summary border style="width: 100%; margin-top: 20px"
|
:summary-method="getSummaries" show-summary border style="width: 100%; margin-top: 20px" height="600">
|
||||||
max-height="700" min-height="500" height="600">
|
|
||||||
<!-- <el-table-column fixed width="50" label="序号" prop="newIndex">
|
<!-- <el-table-column fixed width="50" label="序号" prop="newIndex">
|
||||||
</el-table-column> -->
|
</el-table-column> -->
|
||||||
<el-table-column type="index" label="序号" width="50" fixed>
|
<el-table-column type="index" label="序号" width="50" fixed>
|
||||||
|
|
@ -394,8 +398,13 @@
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
let formattedData = sums.map(item => {
|
||||||
return sums;
|
if (typeof item === 'number') {
|
||||||
|
return item.toFixed(2);
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
return formattedData;
|
||||||
},
|
},
|
||||||
handleChange(val) {
|
handleChange(val) {
|
||||||
this.form.date1 = ''
|
this.form.date1 = ''
|
||||||
|
|
@ -422,7 +431,6 @@
|
||||||
let Sunday = moment(this.form.week)
|
let Sunday = moment(this.form.week)
|
||||||
.add(6 - weekOfday, "days")
|
.add(6 - weekOfday, "days")
|
||||||
.format("YYYY-MM-DD"); //周日日期
|
.format("YYYY-MM-DD"); //周日日期
|
||||||
console.log(Monday, Sunday);
|
|
||||||
this.form.start = Monday
|
this.form.start = Monday
|
||||||
this.form.end = Sunday
|
this.form.end = Sunday
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -187,7 +187,7 @@
|
||||||
type="year"
|
type="year"
|
||||||
placeholder="选择年" value-format="yyyy">
|
placeholder="选择年" value-format="yyyy">
|
||||||
</el-date-picker> -->
|
</el-date-picker> -->
|
||||||
<div v-if="form.resource=='年'">
|
<div v-show="form.resource=='年'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" :picker-options="pickerOptionsYearStart"
|
<el-date-picker v-model="addForm.date_range_start" :picker-options="pickerOptionsYearStart"
|
||||||
value-format="yyyy" type="year" placeholder="开始时间" ref="datePicker" key="year">
|
value-format="yyyy" type="year" placeholder="开始时间" ref="datePicker" key="year">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
@ -201,7 +201,7 @@
|
||||||
<!-- <el-date-picker v-model="form.month" type="monthrange" range-separator="~" start-placeholder="开始月份"
|
<!-- <el-date-picker v-model="form.month" type="monthrange" range-separator="~" start-placeholder="开始月份"
|
||||||
v-if="form.resource=='月'" end-placeholder="结束月份">
|
v-if="form.resource=='月'" end-placeholder="结束月份">
|
||||||
</el-date-picker> -->
|
</el-date-picker> -->
|
||||||
<div v-if="form.resource=='月'">
|
<div v-show="form.resource=='月'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" type="month" placeholder="开始日期"
|
<el-date-picker v-model="addForm.date_range_start" type="month" placeholder="开始日期"
|
||||||
:picker-options="pickerOptionsMonthStart" key="month">
|
:picker-options="pickerOptionsMonthStart" key="month">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
@ -212,7 +212,7 @@
|
||||||
<!-- <el-date-picker v-model="form.week" v-if="form.resource=='周'" type="week" format="yyyy 第 WW 周"
|
<!-- <el-date-picker v-model="form.week" v-if="form.resource=='周'" type="week" format="yyyy 第 WW 周"
|
||||||
placeholder="选择周" @input="cc">
|
placeholder="选择周" @input="cc">
|
||||||
</el-date-picker> -->
|
</el-date-picker> -->
|
||||||
<div v-if="form.resource=='周'">
|
<div v-show="form.resource=='周'">
|
||||||
<el-date-picker v-model="form.week" type="week" placeholder="开始日期"
|
<el-date-picker v-model="form.week" type="week" placeholder="开始日期"
|
||||||
:picker-options="pickerOptions0" key="week" :format="'yyyy 第 WW 周'">
|
:picker-options="pickerOptions0" key="week" :format="'yyyy 第 WW 周'">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
@ -220,7 +220,7 @@
|
||||||
:picker-options="pickerOptions1" key="week" :format="'yyyy 第 WW 周'">
|
:picker-options="pickerOptions1" key="week" :format="'yyyy 第 WW 周'">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="form.resource=='日'">
|
<div v-show="form.resource=='日'">
|
||||||
<el-date-picker v-model="addForm.date_range_start" type="date" placeholder="开始日期"
|
<el-date-picker v-model="addForm.date_range_start" type="date" placeholder="开始日期"
|
||||||
:picker-options="pickerOptions0" key="day">
|
:picker-options="pickerOptions0" key="day">
|
||||||
</el-date-picker>
|
</el-date-picker>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,458 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
|
|
||||||
|
<script type="text/javascript" src="./libs/vue.minV2.5.17.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/axios.minV0.18.0.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/element-uiV2.15.1.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/iview.minV2.0.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/crypto-jsv4.0.0.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/jquery.minV3.5.1.js"></script>
|
||||||
|
<script type="text/javascript" src="./libs/moment.minV2.24.0.js"></script>
|
||||||
|
<link rel="stylesheet" type="text/css" href="./styles/iviewV2.0.css" />
|
||||||
|
<link rel="stylesheet" href="./styles/element-uiV2.15.1.css" />
|
||||||
|
<title id="titname">demo</title>
|
||||||
|
<style type="text/css" media="screen">
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
font: 14px Microsoft YaHei;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
/* background: url(./assets/images/login.png) no-repeat; */
|
||||||
|
/* background: url(./assets/login/bg.jpg) no-repeat; */
|
||||||
|
background-size: 100% 100%;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: 95%;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 1%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.content .list-table {
|
||||||
|
height: calc(100% - 60px);
|
||||||
|
margin-top: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.preDealtail .label {
|
||||||
|
margin: 40px 0;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__body-wrapper {
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right {
|
||||||
|
right: 5px !important;
|
||||||
|
/* 竖向滚动条宽度 */
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table td,
|
||||||
|
.el-table th {
|
||||||
|
padding: 12px 0
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right {
|
||||||
|
right: 0px !important;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right .el-table__fixed-body-wrapper {
|
||||||
|
height: auto !important;
|
||||||
|
/* bottom: 4px !important; */
|
||||||
|
max-height: 100% !important
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed-right-patch {
|
||||||
|
width: 5px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed {
|
||||||
|
height: auto !important;
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__fixed .el-table__fixed-body-wrapper {
|
||||||
|
/* height: 503px !important; */
|
||||||
|
bottom: 0px !important;
|
||||||
|
max-height: 100% !important
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__fixed {
|
||||||
|
height: auto !important;
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__fixed-right {
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-y .el-table__fixed-right {
|
||||||
|
right: 5px !important;
|
||||||
|
height: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar {
|
||||||
|
height: 7px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--fluid-height .el-table__fixed {
|
||||||
|
bottom: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-button {
|
||||||
|
border-radius: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__body-wrapper::-webkit-scrollbar {
|
||||||
|
width: 0px;
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* //注意:hover */
|
||||||
|
.el-table__body-wrapper:hover::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* // 滚动条的滑块 */
|
||||||
|
.el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #ddd;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__body-wrapper {
|
||||||
|
height: 510px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-scrollbar__wrap::-webkit-scrollbar {
|
||||||
|
width: 6PX !important;
|
||||||
|
height: 6PX !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.el-table__fixed,
|
||||||
|
.el-table__fixed-right {
|
||||||
|
/* height: calc(100% - 6PX) !important; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__body-wrapper.is-scrolling-none~.el-table__fixed-right {
|
||||||
|
height: 100% !important;
|
||||||
|
bottom: 0 !important;
|
||||||
|
box-shadow: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-y .el-table__fixed-right {
|
||||||
|
right: 6PX !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table--scrollable-x:not(.el-table--scrollable-y) .el-table__fixed-right {
|
||||||
|
right: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-table__footer-wrapper tbody td,
|
||||||
|
.el-table__header-wrapper tbody td {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
.el-table__footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
} */
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="content" id="app">
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<el-form :inline="true" :model="form" class="demo-form-inline">
|
||||||
|
<el-form-item label="水表名称：">
|
||||||
|
<el-input v-model="form.name"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间：">
|
||||||
|
<el-radio-group v-model="form.resource" @change="handleChange">
|
||||||
|
<el-radio label="月">月</el-radio>
|
||||||
|
<el-radio label="日">日</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-date-picker v-model="form.month" v-show="form.resource=='月'" type="month" placeholder="选择月"
|
||||||
|
value-format="yyyy-MM">
|
||||||
|
</el-date-picker>
|
||||||
|
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"
|
||||||
|
v-show="form.resource=='日'" value-format="yyyy-MM-dd"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="onSubmit(form)">查询</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="list-table">
|
||||||
|
<el-table :data="tableData" ref="table" :key="onlyKey" show-summary border
|
||||||
|
:header-cell-style="{'text-align':'center'}" :cell-style="{'text-align':'center'}"
|
||||||
|
style=" margin-top: 20px" height="600">
|
||||||
|
<el-table-column type="index" label="序号" width="120">
|
||||||
|
<template slot-scope="{ $index, row }">
|
||||||
|
{{$index + 1}}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="name" label="水表名称">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="total_water_code" label="总水量起止码">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="total_water" label="总用水量">
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<script type="text/javascript">
|
||||||
|
let init = function () {
|
||||||
|
|
||||||
|
}
|
||||||
|
function add0(m) {
|
||||||
|
return m < 10 ? "0" + m : m;
|
||||||
|
}
|
||||||
|
//年月日级格式_/
|
||||||
|
function formattime(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
var m = time.getMonth() + 1;
|
||||||
|
var d = time.getDate();
|
||||||
|
var h = time.getHours();
|
||||||
|
var mm = time.getMinutes();
|
||||||
|
var s = time.getSeconds();
|
||||||
|
return y + "-" + add0(m) + "-" + add0(d);
|
||||||
|
}
|
||||||
|
function formattimeMoth(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
var m = time.getMonth() + 1;
|
||||||
|
return y + "-" + add0(m)
|
||||||
|
}
|
||||||
|
function formattimeYear(shijianchuo) {
|
||||||
|
//shijianchuo是整数，否则要parseInt转换
|
||||||
|
var time = new Date(shijianchuo);
|
||||||
|
var y = time.getFullYear();
|
||||||
|
|
||||||
|
return y
|
||||||
|
}
|
||||||
|
var app = new Vue({
|
||||||
|
el: "#app",
|
||||||
|
data: {
|
||||||
|
form: {
|
||||||
|
name: '',
|
||||||
|
date1: formattime(new Date().getTime()),
|
||||||
|
year: '',
|
||||||
|
month: '',
|
||||||
|
week: '',
|
||||||
|
start: '',
|
||||||
|
end: '',
|
||||||
|
type: "",
|
||||||
|
resource: '日',
|
||||||
|
},
|
||||||
|
tableData: [],
|
||||||
|
position: 0,
|
||||||
|
rowSpanArr: [],
|
||||||
|
onlyKey: '',
|
||||||
|
targetSum: 0,
|
||||||
|
indexData: [],
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
var newTime = formattime(new Date().getTime())
|
||||||
|
this.getTableData(this.form.resource, newTime, '', this.form.name)
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getRealIndex(index, row) {
|
||||||
|
// 在这里可以自定义序号的生成逻辑
|
||||||
|
// 考虑合并单元格的情况
|
||||||
|
// 返回实际的序号值
|
||||||
|
// 假设有一个字段 mergedRows 记录需要合并的行的索引
|
||||||
|
// 你的实际合并行索引数组
|
||||||
|
// 如果当前行的索引在合并行的索引数组中，则返回一个空字符串
|
||||||
|
if (app.indexData.includes(index)) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
//计算实际的序号值
|
||||||
|
return index - app.indexData.filter((mergedRow) => mergedRow < index).length + 1;
|
||||||
|
},
|
||||||
|
|
||||||
|
getSummaries(param) {
|
||||||
|
const { columns, data } = param;
|
||||||
|
const sums = [];
|
||||||
|
columns.forEach((column, index) => {
|
||||||
|
if (index === 0) {
|
||||||
|
sums[index] = '合计';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const values = data.map(item => Number(item[column.property]));
|
||||||
|
if (!values.every(value => isNaN(value))) {
|
||||||
|
sums[index] = values.reduce((prev, curr) => {
|
||||||
|
const value = Number(curr);
|
||||||
|
if (!isNaN(value)) {
|
||||||
|
return prev + curr;
|
||||||
|
} else {
|
||||||
|
return prev;
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
|
sums[index];
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
let formattedData = sums.map(item => {
|
||||||
|
if (typeof item === 'number') {
|
||||||
|
return item.toFixed(2);
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
return formattedData;
|
||||||
|
},
|
||||||
|
handleChange(val) {
|
||||||
|
this.form.date1 = ''
|
||||||
|
this.form.year = ''
|
||||||
|
this.form.month = ''
|
||||||
|
this.form.week = ''
|
||||||
|
this.form.start = ''
|
||||||
|
this.form.end = ''
|
||||||
|
if (val == '月') {
|
||||||
|
this.form.month = formattime(new Date().getTime())
|
||||||
|
} else if (val == '日') {
|
||||||
|
this.form.date1 = formattime(new Date())
|
||||||
|
}
|
||||||
|
},
|
||||||
|
cc() {
|
||||||
|
let weekOfday = moment(this.form.week).format("E");
|
||||||
|
let Monday = moment(this.form.week).subtract(weekOfday, "days").format("YYYY-MM-DD"); //周一日期
|
||||||
|
let Sunday = moment(this.form.week)
|
||||||
|
.add(6 - weekOfday, "days")
|
||||||
|
.format("YYYY-MM-DD"); //周日日期
|
||||||
|
this.form.start = Monday
|
||||||
|
this.form.end = Sunday
|
||||||
|
},
|
||||||
|
// changeWeek(val) {
|
||||||
|
// let weekOfday = moment(val).format("E");
|
||||||
|
// let Monday = moment(val).subtract(weekOfday, "days").format("YYYY-MM-DD"); //周一日期
|
||||||
|
// let Sunday = moment(val)
|
||||||
|
// .add(7 - weekOfday, "days")
|
||||||
|
// .format("YYYY-MM-DD"); //周日日期
|
||||||
|
// console.log(Monday, Sunday);
|
||||||
|
// this.form.start= Monday
|
||||||
|
// this.form.end = Sunday
|
||||||
|
// },
|
||||||
|
getTableData(type, startdate, enddate, name) {
|
||||||
|
//var electricity_data = [];
|
||||||
|
if (type == '日') {
|
||||||
|
var data = {
|
||||||
|
type: type,
|
||||||
|
start_date: startdate,
|
||||||
|
name: name,
|
||||||
|
month: '',
|
||||||
|
}
|
||||||
|
|
||||||
|
} else if (type == '月') {
|
||||||
|
var data = {
|
||||||
|
type: type,
|
||||||
|
start_date: "",
|
||||||
|
name: name,
|
||||||
|
month: startdate,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
axios({
|
||||||
|
method: "POST",
|
||||||
|
url: "http://172.16.1.253:8084/Vue/Water.aspx/getElectricityList",
|
||||||
|
data: JSON.stringify(data),
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json; charset=utf-8",
|
||||||
|
},
|
||||||
|
}).then(function (res) {
|
||||||
|
app.tableData = res.data.d
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
onSubmit(form) {
|
||||||
|
if (form.resource == '月') {
|
||||||
|
if (form.month != '') {
|
||||||
|
var newTime = formattimeMoth(form.month)
|
||||||
|
this.getTableData(form.resource, newTime, "", form.name)
|
||||||
|
} else {
|
||||||
|
var newTime = formattimeMoth(new Date().getTime())
|
||||||
|
this.getTableData(form.resource, newTime, "", form.name)
|
||||||
|
}
|
||||||
|
} else if (form.resource == '日') {
|
||||||
|
if (form.date1 != '') {
|
||||||
|
var newTime = formattime(form.date1)
|
||||||
|
this.getTableData(form.resource, newTime, '', form.name)
|
||||||
|
} else {
|
||||||
|
var newTime = formattime(new Date().getTime())
|
||||||
|
this.getTableData(this.form.resource, newTime, '', this.form.name)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
if (rowIndex % 2 === 0) {
|
||||||
|
return {
|
||||||
|
rowspan: 2,
|
||||||
|
colspan: 1
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
rowspan: 0,
|
||||||
|
colspan: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (columnIndex === 1) {
|
||||||
|
// const _row = this.spanArr[rowIndex]; //合并行的行数，1代表独占一行，比1大代表合并若干行，0代表不显示
|
||||||
|
// const _col = _row>0 ? 1 : 0; //行如果存在那么列就存在，行不存在那么列也就不存在
|
||||||
|
// return {
|
||||||
|
// rowspan: _row,
|
||||||
|
// colspan: _col
|
||||||
|
// }
|
||||||
|
if (rowIndex % 2 === 0) {
|
||||||
|
return {
|
||||||
|
rowspan: 2,
|
||||||
|
colspan: 1
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
rowspan: 0,
|
||||||
|
colspan: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue