1 #362
@ -7,24 +7,47 @@
|
|||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div class="weekly">
|
<div class="weekly">
|
||||||
<el-form :inline="true" :model="listQuery" class="blueTip">
|
<el-form
|
||||||
<el-form-item label="月" prop="reportTime">
|
:inline="true"
|
||||||
<el-date-picker v-model="listQuery.time" value-format="yyyy-MM-dd HH:mm:ss" type="month" size="small" placeholder="选择月">
|
:model="listQuery"
|
||||||
</el-date-picker>
|
class="blueTip">
|
||||||
|
<el-form-item
|
||||||
|
label="月"
|
||||||
|
prop="reportTime">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="listQuery.time"
|
||||||
|
value-format="yyyy-MM-dd HH:mm:ss"
|
||||||
|
type="month"
|
||||||
|
size="small"
|
||||||
|
placeholder="选择月"></el-date-picker>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-button v-if="this.$auth.hasPermi('base:report-auto-production:query')" type="primary" size="small" @click="getList">
|
<el-button
|
||||||
|
v-if="this.$auth.hasPermi('base:report-auto-production:query')"
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
@click="getList">
|
||||||
查询
|
查询
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button v-if="this.$auth.hasPermiAnd(['base:report-auto-original-glass:export', 'base:report-auto-production:export'])" type="primary" size="small" plain
|
<el-button
|
||||||
@click="handleExport">导出</el-button>
|
v-if="
|
||||||
|
this.$auth.hasPermiAnd([
|
||||||
|
'base:report-auto-original-glass:export',
|
||||||
|
'base:report-auto-production:export',
|
||||||
|
])
|
||||||
|
"
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
plain
|
||||||
|
@click="handleExport">
|
||||||
|
导出
|
||||||
|
</el-button>
|
||||||
</el-form>
|
</el-form>
|
||||||
<base-table
|
<base-table
|
||||||
:table-props="tableProps"
|
:table-props="tableProps"
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
:span-method="mergeColumnHandler"
|
:span-method="objectSpanMethod1"
|
||||||
@emitFun="handleEmitFun"
|
@emitFun="handleEmitFun"
|
||||||
:max-height="tableH"
|
:max-height="tableH" />
|
||||||
/>
|
|
||||||
<!-- <monthWeek v-if="glassWeekShow" ref="monthWeek" :product="false" :params="listQuery" />
|
<!-- <monthWeek v-if="glassWeekShow" ref="monthWeek" :product="false" :params="listQuery" />
|
||||||
<proMonth v-if="proWeekShow" ref="proMonth" :product="false" :params="listQuery" /> -->
|
<proMonth v-if="proWeekShow" ref="proMonth" :product="false" :params="listQuery" /> -->
|
||||||
</div>
|
</div>
|
||||||
@ -34,9 +57,9 @@
|
|||||||
// import monthWeek from '../glass/month.vue'
|
// import monthWeek from '../glass/month.vue'
|
||||||
// import proMonth from '../productionMonthReport/index.vue'
|
// import proMonth from '../productionMonthReport/index.vue'
|
||||||
import { productionMonthY } from '@/api/report/glass';
|
import { productionMonthY } from '@/api/report/glass';
|
||||||
import { parseTime } from '../../core/mixins/code-filter'
|
import { parseTime } from '../../core/mixins/code-filter';
|
||||||
import FileSaver from 'file-saver'
|
import FileSaver from 'file-saver';
|
||||||
import * as XLSX from 'xlsx/xlsx.mjs'
|
import * as XLSX from 'xlsx/xlsx.mjs';
|
||||||
import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
|
import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@ -46,7 +69,7 @@ export default {
|
|||||||
return {
|
return {
|
||||||
heightNum: 240,
|
heightNum: 240,
|
||||||
listQuery: {
|
listQuery: {
|
||||||
time: parseTime(new Date())
|
time: parseTime(new Date()),
|
||||||
},
|
},
|
||||||
// startTimeStamp: '',
|
// startTimeStamp: '',
|
||||||
// endTimeStamp: '',
|
// endTimeStamp: '',
|
||||||
@ -57,15 +80,16 @@ export default {
|
|||||||
tableProps: [
|
tableProps: [
|
||||||
{
|
{
|
||||||
prop: 'lineName',
|
prop: 'lineName',
|
||||||
label: ''
|
label: '',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'paramsName',
|
prop: 'paramsName',
|
||||||
label: ''
|
label: '',
|
||||||
}
|
},
|
||||||
],
|
],
|
||||||
resData: []
|
resData: [],
|
||||||
}
|
span1: [], //表格1的合并规则
|
||||||
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
// this.getCurrentMonthFirst()
|
// this.getCurrentMonthFirst()
|
||||||
@ -73,93 +97,111 @@ export default {
|
|||||||
// this.proWeekShow = true
|
// this.proWeekShow = true
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
/** 合并table列的规则 */
|
|
||||||
mergeColumnHandler({ row, column, rowIndex, columnIndex }) {
|
|
||||||
// if (columnIndex == 0 || columnIndex == 1) {
|
|
||||||
// if (this.spanInfo[rowIndex]) {
|
|
||||||
// return [
|
|
||||||
// this.spanInfo[rowIndex], // row span
|
|
||||||
// 1, // col span
|
|
||||||
// ];
|
|
||||||
// } else {
|
|
||||||
// return [0, 0];
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
},
|
|
||||||
async getList() {
|
async getList() {
|
||||||
this.tableData = []
|
this.tableData = [];
|
||||||
this.tableProps = [
|
this.tableProps = [
|
||||||
{
|
{
|
||||||
prop: 'lineName',
|
prop: 'lineName',
|
||||||
label: ''
|
label: '',
|
||||||
|
fixed: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'paramsName',
|
prop: 'paramsName',
|
||||||
label: ''
|
label: '',
|
||||||
}
|
fixed: true,
|
||||||
]
|
},
|
||||||
await productionMonthY(this.listQuery).then(res => {
|
];
|
||||||
this.resData = res.data
|
await productionMonthY(this.listQuery).then((res) => {
|
||||||
|
this.resData = res.data;
|
||||||
// 设置表头
|
// 设置表头
|
||||||
Object.keys(this.resData).forEach(item => {
|
Object.keys(this.resData).forEach((item) => {
|
||||||
this.tableProps.push({
|
this.tableProps.push({
|
||||||
prop: item,
|
prop: item,
|
||||||
label: item,
|
label: item,
|
||||||
'show-overflow-tooltip': true
|
'show-overflow-tooltip': true,
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
this.buildTableData()
|
this.buildTableData(this.resData);
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
// 设置表格数据
|
// 设置表格数据
|
||||||
buildTableData() {
|
buildTableData(data) {
|
||||||
const temp = Object.values(this.resData)
|
let keys = Object.keys(data);
|
||||||
console.log('temp', temp)
|
let tempData = [];
|
||||||
const dataArray = []
|
let subKeys = Object.keys(data[keys[0]]);
|
||||||
// Object.entries(this.resData).forEach(en => {
|
let sub2Keys = Object.keys(data[keys[0]][subKeys[0]]);
|
||||||
// console.log('你好', en)
|
for (let i = 0; i < keys.length; i++) {
|
||||||
// const date = en[0]
|
if (i === 0) {
|
||||||
// let valueArray = []
|
for (let j = 0; j < subKeys.length; j++) {
|
||||||
// Object.entries(en[1]).forEach((values, sequence) => {
|
for (let k = 0; k < sub2Keys.length; k++) {
|
||||||
// let yValue = {}
|
let obj = {};
|
||||||
// yValue['line'] = values[0]
|
obj.lineName = subKeys[j];
|
||||||
// Object.entries(values[1]).forEach((lastV, index) => {
|
obj.paramsName = sub2Keys[k];
|
||||||
// console.log(lastV)
|
obj[keys[0]] = data[keys[0]][subKeys[j]][sub2Keys[k]];
|
||||||
// const tempValue = {}
|
tempData.push(obj);
|
||||||
// if (values[0] === yValue['line']) {
|
}
|
||||||
// tempValue[values[0]] = lastV[1]
|
}
|
||||||
// }
|
} else {
|
||||||
// valueArray.push(tempValue)
|
for (let j = 0; j < subKeys.length; j++) {
|
||||||
// })
|
for (let k = 0; k < sub2Keys.length; k++) {
|
||||||
// yValue[date+'-'+sequence] = valueArray
|
for (let v = 0; v < tempData.length; v++) {
|
||||||
// dataArray.push(yValue)
|
if (
|
||||||
// })
|
tempData[v].lineName === subKeys[j] &&
|
||||||
// })
|
tempData[v].paramsName === sub2Keys[k]
|
||||||
// for (let key in temp) {
|
) {
|
||||||
// console.log('你好', temp[key])
|
tempData[v][keys[i]] = data[keys[i]][subKeys[j]][sub2Keys[k]];
|
||||||
// }
|
}
|
||||||
// 产线
|
}
|
||||||
Object.keys(temp[0]).forEach(item => {
|
}
|
||||||
// 规格循环
|
}
|
||||||
Object.keys(Object.values(temp[0])[0]).forEach(it => {
|
}
|
||||||
const row = {
|
}
|
||||||
lineName: item,
|
this.tableData = tempData;
|
||||||
paramsName: it
|
this.getSpanArr(this.tableData);
|
||||||
|
},
|
||||||
|
// 获取合并行
|
||||||
|
getSpanArr(data) {
|
||||||
|
this.span1 = [];
|
||||||
|
for (var i = 0; i < data.length; i++) {
|
||||||
|
if (i === 0) {
|
||||||
|
this.span1.push(1);
|
||||||
|
this.index = 0;
|
||||||
|
} else {
|
||||||
|
if (data[i].lineName === data[i - 1].lineName) {
|
||||||
|
this.span1[this.index] += 1;
|
||||||
|
this.span1.push(0);
|
||||||
|
} else {
|
||||||
|
this.span1.push(1);
|
||||||
|
this.index = i;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
objectSpanMethod1({ rowIndex, columnIndex }) {
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
const _row = this.span1[rowIndex];
|
||||||
|
return {
|
||||||
|
rowspan: _row,
|
||||||
|
colspan: 1,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
this.tableData.push(row)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
handleExport() {
|
handleExport() {
|
||||||
const xlsxParam = { raw: true }
|
const xlsxParam = { raw: true };
|
||||||
let workbook = XLSX.utils.book_new()
|
let workbook = XLSX.utils.book_new();
|
||||||
var ws = XLSX.utils.table_to_sheet( document.querySelector('#exportTable'), xlsxParam)
|
var ws = XLSX.utils.table_to_sheet(
|
||||||
XLSX.utils.book_append_sheet(workbook, ws, '许昌安彩月原片生产汇总')
|
document.querySelector('#exportTable'),
|
||||||
var prows = XLSX.utils.table_to_sheet( document.querySelector('#exportproductionTable'), xlsxParam)
|
xlsxParam
|
||||||
XLSX.utils.book_append_sheet(workbook, prows, '许昌安彩月成品生产汇总')
|
);
|
||||||
|
XLSX.utils.book_append_sheet(workbook, ws, '许昌安彩月原片生产汇总');
|
||||||
|
var prows = XLSX.utils.table_to_sheet(
|
||||||
|
document.querySelector('#exportproductionTable'),
|
||||||
|
xlsxParam
|
||||||
|
);
|
||||||
|
XLSX.utils.book_append_sheet(workbook, prows, '许昌安彩月成品生产汇总');
|
||||||
let fileName = '生产数据汇总表-月报.xlsx';
|
let fileName = '生产数据汇总表-月报.xlsx';
|
||||||
var wbout = XLSX.write(workbook, {
|
var wbout = XLSX.write(workbook, {
|
||||||
bookType: 'xlsx',
|
bookType: 'xlsx',
|
||||||
@ -179,23 +221,23 @@ export default {
|
|||||||
},
|
},
|
||||||
handleEmitFun(payload) {
|
handleEmitFun(payload) {
|
||||||
console.log('payload', payload);
|
console.log('payload', payload);
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.weekly {
|
.weekly {
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
}
|
}
|
||||||
.blueTip::before{
|
.blueTip::before {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
content: '';
|
content: '';
|
||||||
width: 4px;
|
width: 4px;
|
||||||
height: 18px;
|
height: 18px;
|
||||||
background: #0B58FF;
|
background: #0b58ff;
|
||||||
border-radius: 1px;
|
border-radius: 1px;
|
||||||
margin-right: 8PX;
|
margin-right: 8px;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
margin-left: 16px;
|
margin-left: 16px;
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user