Browse Source

报表

pull/347/head
juzi 5 months ago
parent
commit
bda065e4be
5 changed files with 823 additions and 2 deletions
  1. +1
    -0
      .env.dev
  2. +45
    -0
      src/api/report/customizedReports.js
  3. +2
    -2
      src/views/order/monitoring/orderCompletionMonitoring/index.vue
  4. +437
    -0
      src/views/report/Environmental/sectionProduction/index.vue
  5. +338
    -0
      src/views/report/qcReport/israLineReport/index.vue

+ 1
- 0
.env.dev View File

@@ -13,6 +13,7 @@ VUE_APP_TITLE = MES系统

# 芋道管理系统/开发环境
VUE_APP_BASE_API = 'http://192.168.0.33:48082'
# VUE_APP_BASE_API = 'http://192.168.1.20:48080'

# 积木报表指向地址
VUE_APP_JIMU_API = 'http://192.168.0.33:48082'


+ 45
- 0
src/api/report/customizedReports.js View File

@@ -0,0 +1,45 @@
import request from '@/utils/request'
// 原片工段数据
export function originalSection(data) {
return request({
url: '/extend/customized-reports/originalSection',
method: 'post',
data: data
})
}

// 原片产线数据
export function getOriginalLine(query) {
return request({
url: '/extend/customized-reports/getOriginalLine',
method: 'get',
params: query
})
}

// 深加工产线数据
export function getProcessingLine(query) {
return request({
url: '/extend/customized-reports/getProcessingLine',
method: 'get',
params: query
})
}

// 深加工工段数据
export function processing(data) {
return request({
url: '/extend/customized-reports/processing',
method: 'post',
data: data
})
}

// isra数据记录
export function israData(data) {
return request({
url: '/extend/customized-reports/isra',
method: 'post',
data: data
})
}

+ 2
- 2
src/views/order/monitoring/orderCompletionMonitoring/index.vue View File

@@ -376,7 +376,7 @@ export default {
},
};
</script>
<style lang='scss'>
<style lang="scss">
.orderMonitoring {
.el-tabs__nav::after {
content: '';
@@ -431,4 +431,4 @@ export default {
vertical-align: bottom;
}
}
</style>
</style>

+ 437
- 0
src/views/report/Environmental/sectionProduction/index.vue View File

@@ -0,0 +1,437 @@
<template>
<div class="app-container sectionProductionReport">
<!-- 搜索工作栏 -->
<search-bar
:formConfigs="formConfig"
ref="searchBarForm"
@headBtnClick="buttonClick" />
<base-table
class="sectionProductionTable1"
:table-props="tableProp"
:table-data="tableData"
:span-method="objectSpanMethod"
:max-height="tableH" />
<!-- 搜索工作栏 -->
<search-bar
style="margin-top: 10px"
:formConfigs="formConfig2"
ref="searchBarForm"
@headBtnClick="buttonClick2" />
<base-table
class="sectionProductionTable2"
:table-props="tableProp2"
:table-data="tableData2"
:span-method="objectSpanMethod2"
:max-height="tableH" />
</div>
</template>
<script>
const tableProp1 = [
{
prop: 'lineName',
label: '生产线',
width: 110,
fixed: true,
},
{
label: '时间',
fixed: true,
width: 110,
children: [
{
prop: 'procedure',
label: '工序',
width: 140,
},
],
},
];
import {
originalSection,
getOriginalLine,
getProcessingLine,
processing,
} from '@/api/report/customizedReports';
import FileSaver from 'file-saver';
import moment from 'moment';
export default {
name: 'SectionProduction',
data() {
return {
tableH: this.tableHeight(280) / 2,
formConfig: [
{
type: 'select',
label: '生产线',
selectOptions: [],
param: 'lineId',
},
{
type: 'select',
label: '时间',
selectOptions: [
{ id: '1', name: '当前班次' },
{ id: '2', name: '近24小时' },
{ id: '3', name: '日报' },
],
defaultSelect: '1',
param: 'timeType',
clearable: false,
},
{
type: 'button',
btnName: '查询',
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: 'button',
btnName: '导出',
name: 'export',
plain: true,
color: 'primary',
},
],
formConfig2: [
{
type: 'select',
label: '生产线',
selectOptions: [],
param: 'lineId',
},
{
type: 'select',
label: '时间',
defaultSelect: '1',
selectOptions: [
{ id: '1', name: '当前班次' },
{ id: '2', name: '近24小时' },
{ id: '3', name: '日报' },
],
param: 'timeType',
clearable: false,
},
{
type: 'button',
btnName: '查询',
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: 'button',
btnName: '导出',
name: 'export',
plain: true,
color: 'primary',
},
],
queryParams: {
startTime: '1706114700000',
endTime: '1706190300000',
lineId: '',
},
queryParams2: {
startTime: '1706114700000',
endTime: '1706190300000',
lineId: '',
},
tableProp1,
tableProp: [],
tableData: [],
tableProp2: [],
tableData2: [],
procedureName: [
{ name: '压延(拉引量t)', ename: 'calenderingCapacity' },
{ name: '优化切割(片)', ename: 'cuttingNum' },
{ name: '堆垛(片)', ename: 'unloadPieces' },
{ name: '堆垛(托)', ename: 'unloadCount' },
{ name: '良品率(%)', ename: 'rate' },
],
span: [], //表2第一列合并
};
},
created() {
window.addEventListener('resize', this._setTableHeight);
},
destroyed() {
window.removeEventListener('resize', this._setTableHeight);
},
mounted() {
this.getLine();
this.tableProp = this.tableProp1;
this.tableProp2 = this.tableProp1;
this.getList();
this.getList2();
},
methods: {
_setTableHeight() {
this.tableH = this.tableHeight(280) / 2;
},
getLine() {
getOriginalLine().then((res) => {
this.formConfig[0].selectOptions = res.data || [];
});
getProcessingLine().then((res) => {
this.formConfig2[0].selectOptions = res.data || [];
});
},
getList() {
// 获取数据
originalSection({ ...this.queryParams }).then((res) => {
let data = res.data;
let timeArr = this.uniqueTime(data, 'timeStr');
this.tableProp = [];
let arr = [];
timeArr.map((item) => {
let obj = {};
obj.prop = item.timeStr;
obj.label = item.timeStr;
obj.minWidth = 140;
arr.push(obj);
});
this.tableProp = this.tableProp1.concat(arr); //表头
this.transferData(data);
});
},
getTime(val) {
switch (val) {
case '1':
let nowTime = moment().valueOf();
let dTime = moment(
moment().format('YYYY-MM-DD') + ' 07:00:00'
).valueOf();
let nTime = moment(
moment().format('YYYY-MM-DD') + ' 19:00:00'
).valueOf();
let fTime =
moment(moment().valueOf() - 86400).format('YYYY-MM-DD') +
' 19:00:00';
console.log(fTime);
// if (nowTime >= dTime) {
// return [dTime, nowTime]
// }else if (){

// }
break;
case '2':
break;
default:
}
},
buttonClick(val) {
if (val.btnName === 'search') {
this.queryParams.lineId = val.lineId;
this.getTime(val.timeType);
this.getList();
} else {
//导出
this.exportTable('.sectionProductionTable1', '原片工段数据.xlsx', 0);
}
},
//导出表格
exportTable(className, fileName, num) {
// 处理查询参数
var fix = document.querySelectorAll('.el-table__fixed')[num];
var table = document.querySelector(className).childNodes[0];
var wb;
import('xlsx').then((excel) => {
if (fix) {
wb = excel.utils.table_to_book(table.removeChild(fix));
table.appendChild(fix);
} else {
wb = excel.utils.table_to_book(table);
}
/* 获取二进制字符串作为输出 */
var wbout = excel.write(wb, {
bookType: 'xlsx',
bookSST: true,
type: 'array',
});
try {
FileSaver.saveAs(
new Blob([wbout], { type: 'application/octet-stream' }),
//设置导出文件名称
fileName
);
} catch (e) {
if (typeof console !== 'undefined') console.log(e, wbout);
}
return wbout;
});
},
transferData(data) {
let tempData = [];
let lineNum = 0; //第一条产线
for (let i = 0; i < data.length; i++) {
if (i === 0) {
this.procedureName.map((item) => {
let obj = {};
obj.lineName = data[i].lineName;
obj.procedure = item.name;
obj[data[i].timeStr] = data[i][item.ename];
tempData.push(obj);
});
lineNum++;
} else {
if (data[i].lineName === data[i - 1].lineName) {
//相同产线,添加列
let startNum = 5 * (lineNum - 1);
let endNum = 5 * lineNum - 1;
for (let k = startNum; k <= endNum; k++) {
let str = this.procedureName[k % 5];
tempData[k][data[i].timeStr] = data[i][str.ename];
}
} else {
//不同产线,同时添加5行
this.procedureName.map((item) => {
let obj = {};
obj.lineName = data[i].lineName;
obj.procedure = item.name;
obj[data[i].timeStr] = data[i][item.ename];
tempData.push(obj);
});
lineNum++;
}
}
}
this.tableData = tempData;
},
// 时间去重
uniqueTime(arr, prop) {
return arr.filter((value, index, self) => {
return (
self.findIndex((t) => {
return t[prop] === value[prop];
}) === index
);
});
},
// 合并第一列
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
if (rowIndex % 5 === 0) {
return {
rowspan: 5,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
},
getList2() {
// 获取数据
processing({ ...this.queryParams2 }).then((res) => {
this.tableData2 = [];
let data = res.data;
for (let i = 0; i < data.length; i++) {
for (let j = 0; j < data[i].productDet.length; j++) {
let obj = {};
obj.lineName = data[i].lineName;
obj.procedure = data[i].productDet[j].name;
data[i].productDet[j].data.map((item) => {
obj[item.timeStr] = item.input || null;
});
obj.sum = data[i].productDet[j].allInput;
this.tableData2.push(obj);
}
}
let arr = [];
let propsArr = data[0].timeStr || [];
propsArr.map((t) => {
let obj = {};
obj.prop = t;
obj.label = t;
obj.minWidth = 140;
arr.push(obj);
});
arr.push({ prop: 'sum', label: '合计' });
this.tableProp2 = this.tableProp1.concat(arr); //表头
this.getSpanArr(this.tableData2);
});
},
// 表格2
buttonClick2(val) {
if (val.btnName === 'search') {
this.queryParams2.lineId = val.lineId;
this.getList2();
} else {
this.exportTable('.sectionProductionTable2', '深加工工段数据.xlsx', 1);
}
},
// 获取合并行
getSpanArr(data) {
this.span = [];
for (var i = 0; i < data.length; i++) {
if (i === 0) {
this.span.push(1);
this.index = 0;
} else {
if (data[i].lineName === data[i - 1].lineName) {
this.span[this.index] += 1;
this.span.push(0);
} else {
this.span.push(1);
this.index = i;
}
}
}
},
objectSpanMethod2({ rowIndex, columnIndex }) {
if (columnIndex === 0) {
const _row = this.span[rowIndex];
return {
rowspan: _row,
colspan: 1,
};
}
},
},
};
</script>
<style lang="scss">
.sectionProductionReport {
.el-table thead.is-group tr:first-of-type th:nth-child(2) {
border-bottom: none;
}
.el-table thead.is-group tr:first-of-type th:nth-child(2) div.cell {
padding-left: 82px;
}
.el-table th.el-table__cell {
height: 28px;
}
.el-table thead.is-group tr:first-of-type th:nth-child(2):before {
content: '';
position: absolute;
height: 80px;
top: 0;
left: 0;
background-color: #ebeef5;
transform: rotate(-70deg);
-webkit-transform-origin: top;
transform-origin: top;
width: 1px;
}
.el-table thead.is-group tr:last-of-type th:nth-child(1):before {
content: '';
position: absolute;
height: 67px;
top: 0;
left: 75px;
background-color: #ebeef5;
transform: rotate(-70deg);
-webkit-transform-origin: top;
transform-origin: top;
width: 1px;
}
}
</style>

+ 338
- 0
src/views/report/qcReport/israLineReport/index.vue View File

@@ -0,0 +1,338 @@
<template>
<div class="app-container isra-line-report">
<!-- 搜索工作栏 -->
<search-bar
:formConfigs="formConfig"
ref="searchBarForm"
@headBtnClick="buttonClick" />
<base-table
class="israLineReportTable1"
:table-props="tableProp"
:table-data="tableData"
:span-method="objectSpanMethod"
:max-height="tableH" />
</div>
</template>
<script>
const tableProp1 = [
{
prop: 'dataStr',
label: '日期',
width: 110,
fixed: true,
},
{
prop: 'lineName',
label: '生产线',
width: 110,
fixed: true,
},
{
label: '类型',
fixed: true,
width: 110,
children: [
{
prop: 'className',
label: '班次',
width: 140,
},
],
},
];
import { israData } from '@/api/report/customizedReports';
import moment from 'moment';
import tableHeightMixin from '@/mixins/lb/tableHeightMixin';
import { getOriginalLine } from '@/api/report/customizedReports';
import FileSaver from 'file-saver';
export default {
name: 'IsraLineReport',
mixins: [tableHeightMixin],
data() {
return {
heightNum: 215,
formConfig: [
{
type: 'datePicker',
label: '时间段',
dateType: 'daterange',
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd',
rangeSeparator: '-',
startPlaceholder: '开始时间',
endPlaceholder: '结束时间',
param: 'timeVal',
defaultSelect: [],
width: 250,
},
{
type: 'select',
label: '产线',
selectOptions: [],
param: 'lineId',
},
{
type: 'button',
btnName: '查询',
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: 'button',
btnName: '导出',
name: 'export',
plain: true,
color: 'primary',
},
],
queryParams: {
startTime: '',
endTime: '',
lineId: '',
},
tableProp1,
tableProp: [],
tableData: [],
span: [], //表第一列合并
};
},
created() {
this.getLine();
},
mounted() {
this.tableProp = this.tableProp1;
let start = moment().format('yyyy-MM-DD');
let end = moment().format('yyyy-MM-DD');
this.formConfig[0].defaultSelect = [start, end];
this.queryParams.startTime = moment(start + ' 00:00:00').valueOf();
this.queryParams.endTime = moment(end + ' 23:59:59').valueOf();
this.getList();
},
methods: {
getLine() {
getOriginalLine().then((res) => {
this.formConfig[1].selectOptions = res.data || [];
});
},
getList() {
israData({ ...this.queryParams }).then((res) => {
this.tableProp = [];
let data = res.data;
if (data.length > 0) {
let typeArr = data[0].allType;
let arr = [];
typeArr &&
typeArr.map((item) => {
let obj = {};
obj.prop = item.name;
obj.label = item.name;
obj.minWidth = 120;
arr.push(obj);
});
this.tableProp = this.tableProp1.concat(arr); //表头
this.transformData(data);
}
});
},
transformData(data) {
let part1Data = [];
let part2Data = [];
for (let i = 0; i < data.length; i++) {
let obj = {};
let arr = [];
arr = this.uniqueLine(data[i].allClass, 'lineName');
obj.dataStr = data[i].dataStr;
obj.dayClass = [];
obj.allClass = [];
obj.nightClass = [];
obj.num = arr.length;
arr.length > 0 &&
arr.map((item) => {
// 白班
let dobj = {};
dobj.className = '白班';
dobj.dataStr = data[i].dataStr;
for (let a = 0; a < data[i].dayClass.length; a++) {
dobj.lineName = item.lineName;
if (item.lineName === data[i].dayClass[a].lineName) {
dobj[data[i].dayClass[a].checkType] =
data[i].dayClass[a].checkNum;
}
}
obj.dayClass.push(dobj);
// 夜班
let nobj = {};
nobj.className = '夜班';
nobj.dataStr = data[i].dataStr;
for (let a = 0; a < data[i].nightClass.length; a++) {
nobj.lineName = item.lineName;
if (item.lineName === data[i].nightClass[a].lineName) {
nobj[data[i].nightClass[a].checkType] =
data[i].nightClass[a].checkNum;
}
}
obj.nightClass.push(nobj);
// 合计
let sobj = {};
sobj.className = '合计';
sobj.dataStr = data[i].dataStr;
for (let a = 0; a < data[i].allClass.length; a++) {
sobj.lineName = item.lineName;
if (item.lineName === data[i].allClass[a].lineName) {
sobj[data[i].allClass[a].checkType] =
data[i].allClass[a].checkNum;
}
}
obj.allClass.push(sobj);
});
part1Data.push(obj);
}
for (let j = 0; j < part1Data.length; j++) {
for (let k = 0; k < part1Data[j].num; k++) {
part2Data.push(part1Data[j].dayClass[k]);
part2Data.push(part1Data[j].nightClass[k]);
part2Data.push(part1Data[j].allClass[k]);
}
}
this.tableData = part2Data;
this.getSpanArr(this.tableData);
},
// 产线去重
uniqueLine(arr, prop) {
return arr.filter((value, index, self) => {
return (
self.findIndex((t) => {
return t[prop] === value[prop];
}) === index
);
});
},
// 获取合并行
getSpanArr(data) {
this.span = [];
for (var i = 0; i < data.length; i++) {
if (i === 0) {
this.span.push(1);
this.index = 0;
} else {
if (data[i].dataStr === data[i - 1].dataStr) {
this.span[this.index] += 1;
this.span.push(0);
} else {
this.span.push(1);
this.index = i;
}
}
}
},
buttonClick(val) {
if (val.btnName === 'search') {
if (val.timeVal && val.timeVal.length > 0) {
this.queryParams.startTime = moment(
val.timeVal[0] + ' 00:00:00'
).valueOf();
this.queryParams.endTime = moment(
val.timeVal[1] + ' 23:59:59'
).valueOf();
}
this.queryParams.lineId = val.lineId;
this.getList();
} else {
// 导出
this.exportTable();
}
},
exportTable() {
// 处理查询参数
var fix = document.querySelectorAll('.el-table__fixed')[0];
var table = document.querySelector('.israLineReportTable1').childNodes[0];
var wb;
import('xlsx').then((excel) => {
if (fix) {
wb = excel.utils.table_to_book(table.removeChild(fix));
table.appendChild(fix);
} else {
wb = excel.utils.table_to_book(table);
}
/* 获取二进制字符串作为输出 */
var wbout = excel.write(wb, {
bookType: 'xlsx',
bookSST: true,
type: 'array',
});
try {
FileSaver.saveAs(
new Blob([wbout], { type: 'application/octet-stream' }),
//设置导出文件名称
'原片各线isra数据.xlsx'
);
} catch (e) {
if (typeof console !== 'undefined') console.log(e, wbout);
}
return wbout;
});
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
const _row = this.span[rowIndex];
return {
rowspan: _row,
colspan: 1,
};
} else if (columnIndex === 1) {
if (rowIndex % 3 === 0) {
return {
rowspan: 3,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
},
},
};
</script>
<style lang="scss">
.isra-line-report {
.el-table thead.is-group tr:first-of-type th:nth-child(3) {
border-bottom: none;
}
.el-table thead.is-group tr:first-of-type th:nth-child(3) div.cell {
padding-left: 82px;
}
.el-table th.el-table__cell {
height: 28px;
}
.el-table thead.is-group tr:first-of-type th:nth-child(3):before {
content: '';
position: absolute;
height: 80px;
top: 0;
left: 0;
background-color: #ebeef5;
transform: rotate(-70deg);
-webkit-transform-origin: top;
transform-origin: top;
width: 1px;
}
.el-table thead.is-group tr:last-of-type th:nth-child(1):before {
content: '';
position: absolute;
height: 67px;
top: 0;
left: 75px;
background-color: #ebeef5;
transform: rotate(-70deg);
-webkit-transform-origin: top;
transform-origin: top;
width: 1px;
}
}
</style>

Loading…
Cancel
Save