|
|
@@ -0,0 +1,438 @@
|
|
|
+<template>
|
|
|
+ <div class="ExportExcel">
|
|
|
+ <el-row style="margin-bottom: 15px;padding-bottom: 15px;border-bottom: 2px solid #EEE8D5;">
|
|
|
+ <el-col :span="12">
|
|
|
+ <button class="btn" :class="templateId == 1?'green':''" @click="typeClick(1)">单机数据模板</button>
|
|
|
+ <button class="btn" :class="templateId == 2?'green':''" @click="typeClick(2)">上网电量及功率、测风塔数据模板</button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-row justify="end">
|
|
|
+ <button class="btn green" @click="allExport()">一键导出</button>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <table class="com-table">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th>
|
|
|
+ 场站
|
|
|
+ </th>
|
|
|
+ <th>
|
|
|
+ <input class='t2' type='checkbox' @click="rqCheck" checked='checked'/>
|
|
|
+ 日期
|
|
|
+ </th>
|
|
|
+ <th>
|
|
|
+ <input class='t2' type='checkbox' @click="sjCheck" checked='checked'/>
|
|
|
+ 时间间隔(s)
|
|
|
+ </th>
|
|
|
+ <th width="120px">
|
|
|
+ 操作
|
|
|
+ </th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <el-scrollbar>
|
|
|
+ <tbody>
|
|
|
+ <tr v-for="(row, index) of tableData" :key="index">
|
|
|
+ <td>
|
|
|
+ {{row.fdc}}
|
|
|
+ </td>
|
|
|
+ <td class="excelPickerTd">
|
|
|
+ <el-date-picker v-model="value1[index]" type="daterange" @change='value1Change(index)' range-separator="至"
|
|
|
+ start-placeholder="开始日期" end-placeholder="结束日期" class="mr15">
|
|
|
+ </el-date-picker>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <el-input placeholder="请输入时间间隔" type='number' v-model="inputVal[index]" @change='inputValChange(index)'></el-input>
|
|
|
+ </td>
|
|
|
+ <td width="120px">
|
|
|
+ <el-button type='text' style='cursor: pointer;' @click="thisExport(index)">导出
|
|
|
+ </el-button>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </el-scrollbar>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import JsZip from 'jszip';
|
|
|
+ import {
|
|
|
+ export_blob,
|
|
|
+ export_more_blob
|
|
|
+ } from "@tools/excel/Export2Excel.js";
|
|
|
+ import BASE from "@tools/basicTool.js";
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ JsZip
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ const that = this;
|
|
|
+ return {
|
|
|
+ single:false,
|
|
|
+ rqChecked:true,
|
|
|
+ sjChecked:true,
|
|
|
+ checkList: [],
|
|
|
+ tableIdArr: [], //放checkbox的id数组
|
|
|
+ tableData: [],
|
|
|
+ value1: [],
|
|
|
+ inputVal: [],
|
|
|
+ inputInterval: 1800,
|
|
|
+ options: [],
|
|
|
+ value2: [],
|
|
|
+ startTs: [],
|
|
|
+ endTs: [],
|
|
|
+ muBan: {
|
|
|
+ type1: ['数据时间', 'scada风速（m/s）', 'scada功率（kW）', '是否故障（故障=1，不故障=0）', '是否限电（限电=1，不限电=0）'],
|
|
|
+ type2: [
|
|
|
+ ['数据时间', '日报上网电量（mWh）'],
|
|
|
+ ['数据时间', '上网功率（kW）'],
|
|
|
+ ['数据时间', '轮毂高度平均风速（m/s）', '轮毂高度平均风向（°）', '温度（℃）', '压强（hPa）', '湿度（%）']
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ templateId: 1,
|
|
|
+ stations: [],
|
|
|
+ paths: [],
|
|
|
+ pathName: [],
|
|
|
+ zipNames: [],
|
|
|
+ tempArrayS: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.tableVal();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ value1Change(index){
|
|
|
+ if(this.rqChecked){
|
|
|
+ var date = this.value1[index];
|
|
|
+ this.value1 = [];
|
|
|
+ this.tableData.forEach((ele, index) => {
|
|
|
+ this.value1.push(date);
|
|
|
+ this.time(index, date);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ inputValChange(index){
|
|
|
+ if(this.sjChecked){
|
|
|
+ var sj = this.inputVal[index];
|
|
|
+ this.inputVal = [];
|
|
|
+ this.tableData.forEach((ele, index) => {
|
|
|
+ this.inputVal.push(sj);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ rqCheck(){
|
|
|
+ this.rqChecked=event.target.checked
|
|
|
+ },
|
|
|
+ sjCheck(){
|
|
|
+ this.sjChecked=event.target.checked
|
|
|
+ },
|
|
|
+ typeClick(a){
|
|
|
+ this.templateId = a;
|
|
|
+ },
|
|
|
+ thisExport(index) {
|
|
|
+ let that = this;
|
|
|
+ that.single = true;
|
|
|
+ that.time(index, that.value1[index]);
|
|
|
+ that.stations[index] = that.tableData[index].value;
|
|
|
+ that.allExportF(0, index);
|
|
|
+ },
|
|
|
+ tableVal() {
|
|
|
+ let that = this;
|
|
|
+ that.API.requestData({
|
|
|
+ method: "GET",
|
|
|
+ subUrl: "export/databases",
|
|
|
+ success(res) {
|
|
|
+ if (res.code === 200) {
|
|
|
+ const arr = [];
|
|
|
+ const arr2 = [];
|
|
|
+ const arr3 = [];
|
|
|
+ const arr4 = [];
|
|
|
+ var data = []; //项目列表
|
|
|
+ res.data.forEach((item,index) => {
|
|
|
+ const value = Object.keys(item)[0];
|
|
|
+ arr.push({
|
|
|
+ value: value,
|
|
|
+ label: item[value]
|
|
|
+ })
|
|
|
+ arr2.push(value + '/' + item[value]);
|
|
|
+ arr3.push(value);
|
|
|
+ arr4.push(item[value]);
|
|
|
+
|
|
|
+ data.push({
|
|
|
+ fdc: item[value],
|
|
|
+ value: value,
|
|
|
+ });
|
|
|
+ that.inputVal.push(1800);
|
|
|
+ that.checkList.push(index);
|
|
|
+ })
|
|
|
+ that.options = arr;
|
|
|
+ that.value2 = arr2;
|
|
|
+ that.stations = arr3;
|
|
|
+ that.zipNames = arr4;
|
|
|
+ that.tableData = data;
|
|
|
+ that.defaultValue1();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ defaultValue1() { //默认时间区间
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
|
|
+ /////////////
|
|
|
+ var nowDate = new Date();
|
|
|
+ var year = nowDate.getFullYear();
|
|
|
+ var month = nowDate.getMonth();
|
|
|
+ var day = nowDate.getDate();
|
|
|
+
|
|
|
+ this.tableData.forEach((ele, index) => {
|
|
|
+ this.value1.push([start, end]);
|
|
|
+ this.time(index, [start, end]);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleCommand(command) {
|
|
|
+ this.templateId = command;
|
|
|
+ },
|
|
|
+ formatJson(filterVal, jsonData) {
|
|
|
+ return jsonData.map(v => filterVal.map(j => v[j]));
|
|
|
+ },
|
|
|
+ allExport() {
|
|
|
+ this.allExportF(0);
|
|
|
+ },
|
|
|
+ allExportF(_index, thisIndex) {
|
|
|
+ BASE.showLoading({text:'正在导出，请耐心等待...'});
|
|
|
+ const that = this;
|
|
|
+ if (that.stations[_index]) {
|
|
|
+ that.API.requestData({
|
|
|
+ method: "GET",
|
|
|
+ subUrl: "export/history/all",
|
|
|
+ data: {
|
|
|
+ templateId: that.templateId,
|
|
|
+ startTs: thisIndex!=undefined ? that.startTs[thisIndex] : that.startTs[_index],
|
|
|
+ endTs: thisIndex!=undefined ? that.endTs[thisIndex] + 86400000 : that.endTs[_index] + 86400000,
|
|
|
+ interval: thisIndex!=undefined ? that.inputVal[thisIndex] : that.inputVal[_index],
|
|
|
+ station: thisIndex!=undefined ? that.stations[thisIndex] : that.stations[_index]
|
|
|
+ },
|
|
|
+ success(res) {
|
|
|
+ if (res.code == 200) {
|
|
|
+ if (thisIndex!=undefined) {
|
|
|
+ if (that.templateId == 1) {
|
|
|
+ that.export(res.data, 0, that.zipNames[thisIndex]);
|
|
|
+ } else if (that.templateId == 2) {
|
|
|
+ that.exportMuban2(res.data, 0, that.zipNames[thisIndex]);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (that.templateId == 1) {
|
|
|
+ that.export(res.data, 0, that.zipNames[_index], ++_index);
|
|
|
+ } else if (that.templateId == 2) {
|
|
|
+ that.exportMuban2(res.data, 0, that.zipNames[_index], ++_index);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ export (data, _index, zipName, deepIndex) {
|
|
|
+ const that = this;
|
|
|
+ let tHeader = that.muBan['type' + that.templateId];
|
|
|
+ var dataKey = Object.keys(data);
|
|
|
+ var key = dataKey[_index];
|
|
|
+ if (key) {
|
|
|
+ let tempObject = {};
|
|
|
+ let tempArray = [];
|
|
|
+ const dataLength = data[key].length;
|
|
|
+
|
|
|
+ let filterVal = [];
|
|
|
+ data[key][0].forEach((pEle, pIndex) => {
|
|
|
+ for (let i = 0; i < dataLength; i++) {
|
|
|
+ tempObject[String(i)] = data[key][i][pIndex];
|
|
|
+ }
|
|
|
+ tempArray.push(tempObject)
|
|
|
+ tempObject = {};
|
|
|
+ })
|
|
|
+
|
|
|
+ // 上面的index、nickName、name是tableData里对象的属性key值
|
|
|
+ data[key][0].forEach((ele, index) => {
|
|
|
+ filterVal.push(index);
|
|
|
+ });
|
|
|
+ that.paths.push(export_blob(tHeader, that.formatJson(filterVal, tempArray))); //传blob
|
|
|
+ var str = key.split('_');
|
|
|
+ that.pathName.push(str[0].substring(0,2)+str[1]); //excel的名字
|
|
|
+ _index++;
|
|
|
+
|
|
|
+ if (deepIndex!=undefined) {
|
|
|
+ setTimeout(() => {
|
|
|
+ that.export(data, _index, zipName, deepIndex);
|
|
|
+ }, 500);
|
|
|
+ if (dataKey.length == _index) { //当长度一致时，向zip塞值
|
|
|
+ var thisPath = that.paths,
|
|
|
+ thisPathName = that.pathName;
|
|
|
+ that.paths = [];
|
|
|
+ that.pathName = [];
|
|
|
+ that.zipOut(thisPath, thisPathName, zipName, deepIndex)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ setTimeout(() => {
|
|
|
+ that.export(data, _index, zipName);
|
|
|
+ }, 500);
|
|
|
+ if (dataKey.length == _index) { //当长度一致时，向zip塞值
|
|
|
+ var thisPath = that.paths,
|
|
|
+ thisPathName = that.pathName;
|
|
|
+ that.paths = [];
|
|
|
+ that.pathName = [];
|
|
|
+ that.zipOut(thisPath, thisPathName, zipName)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ exportMuban2(data, _index, excelName, deepIndex) {
|
|
|
+ const that = this;
|
|
|
+ var dataKey = Object.keys(data);
|
|
|
+ let tHeader = that.muBan['type' + that.templateId];
|
|
|
+ var key = dataKey[_index];
|
|
|
+ if (key) {
|
|
|
+ let tempObject = {};
|
|
|
+ let tempArray = [];
|
|
|
+ const dataLength = data[key].length;
|
|
|
+ data[key][0].forEach((pEle, pIndex) => {
|
|
|
+ for (let i = 0; i < dataLength; i++) {
|
|
|
+ tempObject[String(i)] = data[key][i][pIndex];
|
|
|
+ }
|
|
|
+ tempArray.push(tempObject)
|
|
|
+ tempObject = {};
|
|
|
+ })
|
|
|
+
|
|
|
+ // 上面的index、nickName、name是tableData里对象的属性key值
|
|
|
+ that.tempArrayS.push(tempArray);
|
|
|
+ _index++;
|
|
|
+ if (dataKey.length == that.tempArrayS.length) {
|
|
|
+ let obj = [];
|
|
|
+ that.tempArrayS.forEach((ele, index) => {
|
|
|
+ obj[index] = [];
|
|
|
+ ele.forEach((ele2, index2) => {
|
|
|
+ var key = Object.keys(ele2)
|
|
|
+ var arr = [];
|
|
|
+ key.forEach((ele3, index3) => {
|
|
|
+ arr.push(ele2[ele3])
|
|
|
+ })
|
|
|
+ obj[index][index2] = arr;
|
|
|
+ arr = [];
|
|
|
+ })
|
|
|
+ })
|
|
|
+ if (deepIndex!=undefined) {
|
|
|
+ that.paths.push(export_more_blob(tHeader, obj)); //传blob
|
|
|
+ that.pathName.push(excelName); //excel的名字
|
|
|
+ that.tempArrayS = [];
|
|
|
+ that.allExportF(deepIndex);
|
|
|
+ } else {
|
|
|
+ that.paths.push(export_more_blob(tHeader, obj, excelName)); //只渲染一个excel
|
|
|
+ BASE.closeLoading();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (deepIndex!=undefined) {
|
|
|
+ that.exportMuban2(data, _index, excelName, deepIndex);
|
|
|
+ if (that.stations.length == deepIndex && _index == 1) { //当长度一致时，向zip塞值，_index只让执行第一次
|
|
|
+ var thisPath = that.paths,
|
|
|
+ thisPathName = that.pathName;
|
|
|
+ that.tempArrayS = [];
|
|
|
+ that.paths = [];
|
|
|
+ that.pathName = [];
|
|
|
+ that.zipOut(thisPath, thisPathName, '风电场_上网电量&功率&测风塔数据')
|
|
|
+ BASE.closeLoading();
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ that.exportMuban2(data, _index, excelName);
|
|
|
+ if (that.stations.length == deepIndex && _index == 1) { //当长度一致时，向zip塞值，_index只让执行第一次
|
|
|
+ var thisPath = that.paths,
|
|
|
+ thisPathName = that.pathName;
|
|
|
+ that.tempArrayS = [];
|
|
|
+ that.paths = [];
|
|
|
+ that.pathName = [];
|
|
|
+ BASE.closeLoading();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ zipOut(paths, pathName, zipName, deepIndex) {
|
|
|
+ // paths 所有blob
|
|
|
+ // pathName 所有excel文件名
|
|
|
+ // zipName zip的包名
|
|
|
+ // deepIndex 执行ajax下标，当zipOut方法执行完后，再执行allExportF
|
|
|
+ const that = this;
|
|
|
+ var zip = new JsZip();
|
|
|
+ paths.forEach((item, index) => {
|
|
|
+ const arr_name = item // 下载文件, 并存成ArrayBuffer对象
|
|
|
+ const file_name = pathName[index] + '.xlsx' // 获取文件名
|
|
|
+ zip.file(file_name, arr_name, {
|
|
|
+ binary: true
|
|
|
+ }) // 逐个添加文件
|
|
|
+ })
|
|
|
+ zip.generateAsync({
|
|
|
+ type: 'blob',
|
|
|
+ })
|
|
|
+ .then(function(content) {
|
|
|
+ // 下载的文件名
|
|
|
+ var filename = zipName + '.zip'
|
|
|
+ // 创建隐藏的可下载链接
|
|
|
+ var eleLink = document.createElement('a')
|
|
|
+ eleLink.download = filename
|
|
|
+ eleLink.style.display = 'none'
|
|
|
+ // 下载内容转变成blob地址
|
|
|
+ eleLink.href = URL.createObjectURL(content)
|
|
|
+ // 触发点击
|
|
|
+ document.body.appendChild(eleLink)
|
|
|
+ eleLink.click()
|
|
|
+ // 然后移除
|
|
|
+ document.body.removeChild(eleLink)
|
|
|
+ if (deepIndex) {
|
|
|
+ that.allExportF(deepIndex); //递归，去执行ajax
|
|
|
+ if(that.stations.length == deepIndex){
|
|
|
+ BASE.closeLoading();
|
|
|
+ }
|
|
|
+ }else if(that.single){
|
|
|
+ BASE.closeLoading();
|
|
|
+ that.single = false;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ time(index, val) {
|
|
|
+ this.startTs[index] = Date.parse(new Date(val[0]));
|
|
|
+ this.endTs[index] = Date.parse(new Date(val[1]) + 86400000);
|
|
|
+ },
|
|
|
+ changeSelect(val) {
|
|
|
+ this.stations = [];
|
|
|
+ this.zipNames = [];
|
|
|
+ val.forEach(ele => {
|
|
|
+ var key = ele.split('/');
|
|
|
+ this.stations.push(key[0]);
|
|
|
+ this.zipNames.push(key[1]);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+ .excelPickerTd input {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ .el-date-editor--daterange.mr15{
|
|
|
+ border: 1px solid rgba(96, 103, 105, 0.2);
|
|
|
+ height: 33px;
|
|
|
+ padding: 0 8px;
|
|
|
+ width: 369px;
|
|
|
+ input{
|
|
|
+ background-color: transparent;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+ .el-range-separator{
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .com-table td{
|
|
|
+ color: white !important;
|
|
|
+ }
|
|
|
+ .t2{top: 2px;position: relative !important;}
|
|
|
+</style>
|
Koishi