mt-fe-group/yudao-dev
12
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge pull request 'dy' (#37) from dy into test

Browse Source 
Reviewed-on: #37
This commit is contained in:
hellody 2023-10-08 17:03:04 +08:00
commit 180fcf5ad8
10 changed files with 552 additions and 302 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/base/equipmentBindSection/dialogForm.vue
View File

@ -20,6 +20,7 @@
<el-select
v-model="dataForm.productionLineId"
placeholder="请选择产线"
filterable
@change="handleProductlineChange">
<el-option
v-for="opt in productionLineList"
@ -37,6 +38,7 @@
:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
<el-select
v-model="dataForm.workshopSectionId"
filterable
placeholder="请选择工段"
@change="$emit('update', dataForm)">
<el-option
@ -56,6 +58,7 @@
:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]">
<el-select
v-model="dataForm.equipmentId"
filterable
placeholder="请选择设备"
@change="$emit('update', dataForm)">
<el-option
@ -71,6 +74,7 @@
<el-form-item label="工段排序" prop="sort">
<el-input
v-model="dataForm.sort"
filterable
@change="$emit('update', dataForm)"
placeholder="请输入工段排序" />
</el-form-item>

9
src/views/core/analysis/LineChart.vue
View File

@ -1,8 +1,8 @@
<!--
* @Author: zhp
* @Date: 2023-09-13 09:02:25
* @LastEditTime: 2023-09-13 10:33:20
* @LastEditors: zhp
* @LastEditTime: 2023-10-08 15:39:38
* @LastEditors: DY
* @Description:
-->
<template>
@ -61,11 +61,12 @@ export default {
// },
methods: {
initChart(xData, yData,lineName) {
console.log(xData,yData);
console.log( '打印结果', xData,yData, lineName);
this.chart = echarts.init(this.$el, 'macarons')
this.setOptions(xData, yData, lineName)
},
setOptions(xData, yData, lineName) {
console.log('da', lineName)
let seriesData = []
lineName.forEach((item,index) => {
seriesData.push({
@ -86,7 +87,7 @@ export default {
type: 'value'
},
series: seriesData
})
}, true)
}
}
}

9
src/views/core/analysis/balanceAnalysis/index.vue
View File

@ -228,7 +228,14 @@ export default {
this.listQuery.lineId = val.lineIds
this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined;
this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined;
this.getData()
if (val.time) {
this.getData()
} else {
this.$message({
message: '请选择时间',
type: 'warning'
});
}
break;
case 'reset':
this.$refs.searchBarForm.resetForm();

42
src/views/core/analysis/balanceChart.vue
View File

@ -1,14 +1,14 @@
<!--
* @Author: zhp
* @Date: 2023-09-13 09:02:25
* @LastEditTime: 2023-09-20 09:29:40
* @LastEditTime: 2023-10-08 16:36:37
* @LastEditors: DY
* @Description:
-->
<template>
<div>
<div style="margin: 20px">
<el-button v-for="(item, index) in dataArray" :key="index" @click="changeChart(index)">{{ item.name }}</el-button>
<el-button v-for="(item, index) in buttonList" :key="index" :class="[item.actived ? 'activeButton': 'normalButton']" @click="changeChart(index)">{{ item.name }}</el-button>
</div>
<div ref="chartDiv" :class="className" :style="{height:height,width:width}" />
</div>
@ -43,7 +43,8 @@ export default {
return {
chart: null,
dataArray: [],
xDatas: []
xDatas: [],
buttonList: []
}
},
mounted() {
@ -51,12 +52,34 @@ export default {
methods: {
changeChart(index) {
this.setOptions(this.xDatas, this.dataArray[index])
this.buttonList.forEach((item, s) => {
if (index === s) {
// item.actived = true
this.$nextTick(() =>{
// item.actived = true
this.$set(item, 'actived', true)
})
} else {
// item.actived = false
this.$nextTick(() =>{
// item.actived = false
this.$set(item, 'actived', false)
})
// this.$set(item, 'actived', false)
}
})
console.log('看一下数22222据', this.dataArray)
},
initChart(xData, yData, lineName) {
this.dataArray = yData
this.buttonList = this.dataArray.map((item, index) => {
return {
'name': item.name,
'actived': index === 0 ? true : false
}
})
console.log('看一下数据', this.dataArray)
this.xDatas = xData
console.log(xData,yData);
console.log('zale', yData[0].eqData)
this.chart = echarts.init(this.$refs.chartDiv, 'macarons')
this.setOptions(xData, yData[0], lineName)
},
@ -100,3 +123,12 @@ export default {
}
}
</script>
<style scoped>
.activeButton {
background-color: rgb(93,159,255);
}
.normalButton {
background-color: none;
}
</style>

142
src/views/core/analysis/yieldAnalysis/index.vue
View File

@ -57,8 +57,7 @@ export default {
lineIds: [],
time: ''
},
xData: [],
yData:[],
dateLabelList: [],
optionArrUrl: [getProductionLinePage ],
formConfig: [
{
@ -113,75 +112,101 @@ export default {
let arr = [
{
prop: 'lineName',
label: '产线',
align: 'center',
label: '产线'
},
{
prop: 'sum',
label: '合计',
align: 'center',
label: '合计'
},
{
prop: res.data.nameData[0].name,
label: res.data.nameData[0].name,
prop: res.data ? res.data.nameData[0].name : undefined,
label: res.data ? res.data.nameData[0].name : undefined,
align: 'center',
children:[
]
}
]
console.log(res.data.nameData.slice(1))
res.data.nameData.slice(1).forEach(item => {
const props = {
'prop': item.name,
'label': item.name,
'align': 'center'
}
arr[2].children.push(props)
})
let tableDataArr =[]
res.data.data.forEach(item => {
let obj = {}
obj.lineName= item.lineName,
obj.sum= item.sum,
item.data.forEach((ele, index) => {
// console.log(ele)
ele.children.forEach((e) => {
console.log(e.dynamicName)
obj['' + e.dynamicName + ''] = e.dynamicValue
console.log(obj['' + e.dynamicName + '']);
})
})
tableDataArr.push(obj)
});
this.tableData = tableDataArr
console.log(this.tableData)
console.log(arr)
this.tableProps = arr
// console.log(res.data.nameData.slice(1))
let xData = []
res.data.nameData.slice(1).forEach(item => {
xData.push(item.name)
// arr[2].children.push(props)
})
let yAllData = []
let lineName = []
res.data.data.forEach(item => {
let yData = []
lineName.push(item.lineName)
// let obj = {}
// obj.lineName = item.lineName,
// obj.sum = item.sum,
item.data.forEach((ele, index) => {
if (res.data) {
let tempDateList = []
res.data.nameData.forEach(date => {
tempDateList.push(date.name)
})
this.dateLabelList = Array.from(new Set(tempDateList))
this.dateLabelList.forEach(item => {
if (item.indexOf('年') === -1) {
// 构造表头
const props = {
'prop': item,
'label': item
}
arr[2].children.push(props)
// 构造echarts横坐标
xData.push(item)
}
})
// res.data.nameData.slice(1).forEach(item => {
// const props = {
// 'prop': item.name,
// 'label': item.name,
// 'align': 'center'
// }
// arr[2].children.push(props)
// })
let tableDataArr =[]
res.data.data.forEach(item => {
let obj = {}
obj.lineName= item.lineName,
obj.sum= item.sum,
item.data.forEach((ele, index) => {
// console.log(ele)
ele.children.forEach((e) => {
// let yData = []
yData.push(e.dynamicValue)
ele.children.forEach((e) => {
console.log(e.dynamicName)
obj['' + e.dynamicName + ''] = e.dynamicValue
console.log(obj['' + e.dynamicName + '']);
})
})
yAllData.push(yData)
});
console.log(lineName)
tableDataArr.push(obj)
});
this.tableData = tableDataArr
this.tableProps = arr
// let tempList = []
// res.data.nameData.slice(1).forEach(item => {
// tempList.push(item.name)
// // arr[2].children.push(props)
// })
// xData = Array.from(new Set(tempList))
res.data.data.forEach(item => {
let yData = []
lineName.push(item.lineName)
// let obj = {}
// obj.lineName = item.lineName,
// obj.sum = item.sum,
item.data.forEach((ele, index) => {
// console.log(ele)
ele.children.forEach((e) => {
// let yData = []
yData.push(e.dynamicValue)
})
})
yAllData.push(yData)
});
console.log(lineName)
} else {
this.tableProps = arr
this.tableData = []
xData = []
yAllData = []
lineName = []
}
// res.data.data[0].data[0].children.forEach((item, index) => {
// // console.log(item)
// yData.push(item.dynamicValue)
@ -203,7 +228,14 @@ export default {
this.listQuery.time = val.time ? new Date(val.time).getTime() : undefined
// this.listQuery.pageNo = 1;
// this.listQuery.pageSize = 10;
this.getData()
if (val.time) {
this.getData()
} else {
this.$message({
message: '请选择时间',
type: 'warning'
});
}
break;
case 'reset':
this.$refs.searchBarForm.resetForm();

31
src/views/core/base/factory/index.vue
View File

@ -50,29 +50,24 @@ import {
const tableProps = [
{
prop: 'code',
label: '工厂编码',
align: 'center',
label: '工厂编码'
},
{
prop: 'name',
label: '工厂名称',
align: 'center',
label: '工厂名称'
},
{
prop: 'address',
label: '地址',
align: 'center',
label: '地址'
},
{
prop: 'remark',
label: '备注',
align: 'center',
label: '备注'
},
{
prop: 'createTime',
label: '创建时间',
align: 'center',
filter: parseTime,
filter: parseTime
},
];
@ -120,14 +115,14 @@ export default {
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: 'button',
btnName: '重置',
name: 'reset',
},
// {
// type: 'separate',
// },
// {
// type: 'button',
// btnName: '重置',
// name: 'reset',
// },
{
type: 'separate',
},

191
src/views/core/monitoring/auto/index.vue
View File

@ -1,7 +1,7 @@
<!--
* @Author: Do not edit
* @Date: 2023-08-29 14:59:29
* @LastEditTime: 2023-09-16 17:34:17
* @LastEditTime: 2023-09-27 16:19:56
* @LastEditors: DY
* @Description:
-->
@ -12,21 +12,15 @@
ref="searchBarForm"
@headBtnClick="buttonClick" />
<base-table
class="right-aside"
v-loading="dataListLoading"
:table-props="tableProps"
:page="listQuery.pageNo"
:limit="listQuery.pageSize"
:selectWidth="55"
:table-data="tableData"
:table-data="showData"
@selection-change="selectChange"
>
<method-btn
v-if="tableBtn.length"
slot="handleBtn"
:width="120"
label="操作"
:method-list="tableBtn"
@clickBtn="handleClick" />
</base-table>
<pagination
:limit.sync="listQuery.pageSize"
@ -43,19 +37,6 @@
:table-data="selectedList"
/>
</div> -->
<div ref="pdf" v-show="false">
<el-table :data="selectedList" stripe border style="width: 100%">
<el-table-column prop="reportType" label="报表类型" />
<el-table-column prop="reportStartTime" label="统计开始时间" />
<el-table-column prop="reportEndTime" label="统计结束时间" />
<el-table-column prop="proLineName" label="产线名称" />
<el-table-column prop="inputNum" label="投入数量/片" />
<el-table-column prop="outputNum" label="产出数量/片" />
<el-table-column prop="outputArea" label="产出面积/㎡" />
<el-table-column prop="lossArea" label="损耗面积/㎡" />
<el-table-column prop="lossRatio" label="损耗比例%" />
</el-table>
</div>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
@ -74,8 +55,8 @@
<script>
import { parseTime } from '../../mixins/code-filter';
import { getPdlAutoReport, getPdList } from '@/api/core/monitoring/auto'
// import jsPDF from 'jspdf'
// import html2canvas from 'html2canvas'
import jsPDF from 'jspdf'
import html2canvas from 'html2canvas'
// import codeFilter from '../../mixins/code-filter'
import * as XLSX from 'xlsx'
import FileSaver from 'file-saver'
@ -83,55 +64,45 @@ import FileSaver from 'file-saver'
const tableProps = [
{
prop: 'reportType',
label: '报表类型',
align: 'center'
label: '报表类型'
},
{
prop: 'reportStartTime',
label: '统计开始时间',
align: 'center',
filter: parseTime,
},
{
prop: 'reportEndTime',
label: '统计结束时间',
align: 'center',
filter: parseTime,
},
{
prop: 'proLineName',
label: '产线名称',
align: 'center',
label: '产线名称'
},
{
prop: 'inputNum',
label: '投入数量/片',
align: 'center',
label: '投入数量/片'
},
{
prop: 'outputNum',
label: '产出数量/片',
align: 'center',
label: '产出数量/片'
},
{
prop: 'outputArea',
label: '产出面积/㎡',
align: 'center',
label: '产出面积/㎡'
},
{
prop: 'lossNum',
label: '损耗数量/片',
align: 'center',
label: '损耗数量/片'
},
{
prop: 'lossArea',
label: '损耗面积/㎡',
align: 'center',
label: '损耗面积/㎡'
},
{
prop: 'lossRatio',
label: '损耗比例%',
align: 'center',
label: '损耗比例%'
}
];
@ -153,6 +124,7 @@ export default {
addOrUpdateVisible: false,
tableProps,
tableBtn: [],
showData: [],
selectedList: [],
// tableBtn: [
// this.$auth.hasPermi(`base:factory:update`)
@ -232,44 +204,60 @@ export default {
this.getPdLineList()
},
methods: {
test() {
var target = document.getElementsByClassName("right-aside")[0]
target.style.background = '#FFFFFF'
setTimeout(() => {
html2canvas(target).then(function(canvas) {
var contentWidth = canvas.width
var contentHeight = canvas.height
// 一页pdf显示html页面生成的canvas高度
var pageHeight = contentHeight / 592.28 * 841.89
// 未生成pdf的html页面高度
var leftHeight = contentHeight
// 页面偏移
var position = 0
// a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的高度
var imgWidth = 595.28
var imgHeight = 592.28 / contentWidth * contentHeight
var pageData = canvas.toDataURL('image/jpeg', 1.0)
console.log('nihc URL', leftHeight, pageHeight)
var pdf = new jsPDF('', 'pt', 'a4')
if (leftHeight < pageHeight) {
pdf.addImage(pageData, 'JPEG', 0, 20, imgWidth, imgHeight)
} else {
while(leftHeight > 0) {
pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight
position -= 841.89
// 避免空白页
if (leftHeight > 0) {
pdf.addPage()
}
}
}
pdf.save('产线统计自动报表.pdf')
})
}, 300)
},
exportPdf() {
this.pdf()
this.dialogVisible = false
this.test()
setTimeout(() =>{
this.dialogVisible = false
this.showData = this.tableData
}, 600)
},
exportXlsx() {
this.down()
this.exportECL()
this.dialogVisible = false
},
// imgDownload() {
// let that = this
// let img = this.$refs['pdf']
// // 图片高度
// var w = parseInt(window.getComputedStyle(img).width)
// // 图片宽度
// var h = parseInt(window.getComputedStyle(img).height)
// // 滚轮置顶，避免留白
// window.pageYOffset = 0
// html2canvas(img).then(function(canvas) {
// })
// },
pdf() {
// console.log('打印看看[df]')
// const pdf = new jsPDF()
// const content = this.$refs.pdf.innerHTML
// console.log('打印看看', content)
// pdf.text(content, 15, 15)
// // pdf.text('Hello world!', 10, 10)
// pdf.save('test.pdf')
// console.log('打印看看', pdf)
const printWindow = window.open('', '_blank')
const temp = this.$refs.pdf.innerHTML
console.log(temp)
printWindow.document.body.innerHTML = temp
printWindow.focus()
// printWindow.document.writeln(this.$refs.pdf.innerHTML)
printWindow.document.close()
printWindow.print()
this.showData = this.tableData
},
handleClose(done) {
this.$confirm('确认关闭？')
@ -278,23 +266,30 @@ export default {
})
.catch(_ => {});
},
down() {
//选中导出时可更改此处数组 选中的数组
//构建导出的表格数据
const exportData = [
{reportType: '报表类型', reportStartTime: '统计开始时间', reportEndTime: '统计结束时间', proLineName: '产线名称', inputNum: '投入数量/片', outputNum: '产出数量/片', outputArea: '产出面积/㎡', lossNum: '损耗数量/片', lossArea: '损耗面积/㎡', lossRatio: '损耗比例%' },
...this.selectedList
]
//注意表格上绑定id， 获取dom元素
const worksheet = XLSX.utils.json_to_sheet(exportData, { skipHeader: true })
const workbook = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1")
const workbookOutput = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
try {
FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), '产线统计自动报表.xlsx')
} catch (e) {
console.log(e)
exportECL() {
let tables = document.querySelector('.el-table').cloneNode(true)
const fix = tables.querySelector('.el-table__fixed')
const fixRight = tables.querySelector('.el-table__fixed-right')
if (fix) {
tables.removeChild(tables.querySelector('.el-table__fixed'))
}
if (fixRight) {
tables.removeChild(tables.querySelector('.el-table__fixed-right'))
}
let exportTable = XLSX.utils.table_to_book(tables)
var exportTableOut = XLSX.write(exportTable, {
bookType: 'xlsx', bookSST: true, type: 'array'
})
// sheetjs.xlsx为导出表格的标题名称
try {
FileSaver.saveAs(new Blob([exportTableOut], {
type: 'application/octet-stream'
}), '产线统计自动报表.xlsx')
} catch (e) {
if (typeof console !== 'undefined') console.log(e, exportTableOut)
}
return exportTableOut
},
selectChange(val) {
console.log(val)
@ -328,12 +323,13 @@ export default {
getDataList() {
this.dataListLoading = true;
this.urlOptions.getDataListURL(this.listQuery).then(response => {
this.tableData = response.data.list.map(item => {
this.tableData = response.data.list.map((item, index) => {
item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月'
return item
});
this.total = response.data.total;
this.dataListLoading = false;
this.showData = this.tableData
});
},
// 每页数
@ -348,15 +344,10 @@ export default {
this.getDataList();
},
handleExport() {
if (this.selectedList.length === 0) {
this.selectedList = this.tableData
if (this.selectedList.length > 0) {
this.showData = this.selectedList
}
this.dialogVisible = true
// this.$modal.confirm('是否确认导出所选数据项?').then(() => {
// this.exportLoading = true;
// // this.down()
// this.pdf()
// }).catch(() => { });
}
},
};

139
src/views/core/monitoring/data/index.vue
View File

@ -1,7 +1,7 @@
<!--
* @Author: Do not edit
* @Date: 2023-08-29 14:59:29
* @LastEditTime: 2023-09-20 10:55:23
* @LastEditTime: 2023-09-27 16:23:44
* @LastEditors: DY
* @Description:
-->
@ -12,12 +12,13 @@
ref="searchBarForm"
@headBtnClick="buttonClick" />
<base-table
class="right-aside"
v-loading="dataListLoading"
:table-props="tableProps"
:page="listQuery.pageNo"
:limit="listQuery.pageSize"
:selectWidth="55"
:table-data="tableData"
:table-data="showData"
@selection-change="selectChange"
>
<method-btn
@ -33,17 +34,6 @@
:page.sync="listQuery.pageNo"
:total="listQuery.total"
@pagination="getDataList" />
<div ref="pdf" v-show="false">
<el-table :data="selectedList" stripe border style="width: 100%">
<el-table-column prop="proLineName" label="产线名称" />
<el-table-column prop="inputNum" label="投入数量/片" />
<el-table-column prop="outputNum" label="产出数量/片" />
<el-table-column prop="outputArea" label="产出面积/㎡" />
<el-table-column prop="lossNum" label="损耗数量/片" />
<el-table-column prop="lossArea" label="损耗面积/㎡" />
<el-table-column prop="lossRatio" label="损耗比例%" />
</el-table>
</div>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
@ -63,6 +53,8 @@
import { getPdlDataSearch, getPdList } from '@/api/core/monitoring/data'
import * as XLSX from 'xlsx'
import FileSaver from 'file-saver'
import jsPDF from 'jspdf'
import html2canvas from 'html2canvas'
const tableProps = [
{
@ -115,6 +107,7 @@ export default {
addOrUpdateVisible: false,
tableProps,
tableBtn: [],
showData: [],
tableData: [],
selectedList: [],
formConfig: [
@ -166,40 +159,86 @@ export default {
this.getPdLineList()
},
methods: {
test() {
var target = document.getElementsByClassName("right-aside")[0]
target.style.background = '#FFFFFF'
setTimeout(() => {
html2canvas(target).then(function(canvas) {
var contentWidth = canvas.width
var contentHeight = canvas.height
// 一页pdf显示html页面生成的canvas高度
var pageHeight = contentHeight / 592.28 * 841.89
// 未生成pdf的html页面高度
var leftHeight = contentHeight
// 页面偏移
var position = 0
// a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的高度
var imgWidth = 595.28
var imgHeight = 592.28 / contentWidth * contentHeight
var pageData = canvas.toDataURL('image/jpeg', 1.0)
console.log('nihc URL', leftHeight, pageHeight)
var pdf = new jsPDF('', 'pt', 'a4')
if (leftHeight < pageHeight) {
pdf.addImage(pageData, 'JPEG', 0, 20, imgWidth, imgHeight)
} else {
while(leftHeight > 0) {
pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight
position -= 841.89
// 避免空白页
if (leftHeight > 0) {
pdf.addPage()
}
}
}
pdf.save('产线统计数据查询报表.pdf')
})
}, 300)
},
exportECL() {
let tables = document.querySelector('.el-table').cloneNode(true)
const fix = tables.querySelector('.el-table__fixed')
const fixRight = tables.querySelector('.el-table__fixed-right')
if (fix) {
tables.removeChild(tables.querySelector('.el-table__fixed'))
}
if (fixRight) {
tables.removeChild(tables.querySelector('.el-table__fixed-right'))
}
let exportTable = XLSX.utils.table_to_book(tables)
var exportTableOut = XLSX.write(exportTable, {
bookType: 'xlsx', bookSST: true, type: 'array'
})
// sheetjs.xlsx为导出表格的标题名称
try {
FileSaver.saveAs(new Blob([exportTableOut], {
type: 'application/octet-stream'
}), '产线统计数据查询报表.xlsx')
} catch (e) {
if (typeof console !== 'undefined') console.log(e, exportTableOut)
}
return exportTableOut
},
exportPdf() {
this.pdf()
this.dialogVisible = false
this.test()
setTimeout(() =>{
this.dialogVisible = false
this.showData = this.tableData
}, 600)
},
exportXlsx() {
this.down()
this.exportECL()
this.dialogVisible = false
this.showData = this.tableData
},
pdf() {
const printWindow = window.open('', '_blank')
const temp = this.$refs.pdf.innerHTML
console.log(temp)
printWindow.document.body.innerHTML = temp
printWindow.document.close()
printWindow.print()
},
down() {
//选中导出时可更改此处数组 选中的数组
//构建导出的表格数据
const exportData = [
{proLineName: '产线名称', inputNum: '投入数量/片', outputNum: '产出数量/片', outputArea: '产出面积/㎡', lossNum: '损耗数量/片', lossArea: '损耗面积/㎡', lossRatio: '损耗比例%' },
...this.selectedList
]
//注意表格上绑定id， 获取dom元素
const worksheet = XLSX.utils.json_to_sheet(exportData, { skipHeader: true })
const workbook = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1")
const workbookOutput = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
try {
FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), '产线统计数据查询.xlsx')
} catch (e) {
console.log(e)
}
},
handleClose(done) {
this.$confirm('确认关闭？')
.then(_ => {
@ -240,6 +279,7 @@ export default {
this.tableData = response.data;
this.total = response.data.total;
this.dataListLoading = false;
this.showData = this.tableData
});
},
// 每页数
@ -254,21 +294,10 @@ export default {
this.getDataList();
},
handleExport() {
if (this.selectedList.length === 0) {
this.selectedList = this.tableData
if (this.selectedList.length > 0) {
this.showData = this.selectedList
}
this.dialogVisible = true
// 处理查询参数
// let params = { ...this.queryParams };
// params.pageNo = undefined;
// params.pageSize = undefined;
// this.$modal.confirm('是否确认导出所有数据项?').then(() => {
// this.exportLoading = true;
// return this.urlOptions.exportURL(params);
// }).then(response => {
// this.$download.excel(response, '工厂.xls');
// this.exportLoading = false;
// }).catch(() => { });
}
},
};

143
src/views/core/monitoring/sectionStatistics/index.vue
View File

@ -1,7 +1,7 @@
<!--
* @Author: Do not edit
* @Date: 2023-08-29 14:59:29
* @LastEditTime: 2023-09-22 15:13:48
* @LastEditTime: 2023-10-08 10:51:49
* @LastEditors: DY
* @Description:
-->
@ -13,12 +13,13 @@
ref="searchBarForm"
@headBtnClick="buttonClick" />
<base-table
class="right-aside"
v-loading="dataListLoading"
:table-props="tableProps"
:page="listQuery.pageNo"
:limit="listQuery.pageSize"
:selectWidth="55"
:table-data="tableData"
:table-data="showData"
@selection-change="selectChange"
>
<method-btn
@ -34,21 +35,6 @@
:page.sync="listQuery.pageNo"
:total="listQuery.total"
@pagination="getDataList" />
<div ref="pdf" v-show="false">
<el-table :data="selectedList" stripe border style="width: 100%">
<el-table-column prop="reportType" label="报表类型" />
<el-table-column prop="reportStartTime" label="统计开始时间" />
<el-table-column prop="reportEndTime" label="统计结束时间" />
<el-table-column prop="proLineName" label="产线名称" />
<el-table-column prop="sectionName" label="工段名称" />
<el-table-column prop="inputNum" label="投入数量/片" />
<el-table-column prop="outputNum" label="产出数量/片" />
<el-table-column prop="outputArea" label="产出面积/㎡" />
<el-table-column prop="lossNum" label="损耗数量/片" />
<el-table-column prop="lossArea" label="损耗面积/㎡" />
<el-table-column prop="lossRatio" label="损耗比例%" />
</el-table>
</div>
<el-dialog
title="提示"
:visible.sync="dialogVisible"
@ -69,6 +55,8 @@ import { parseTime } from '../../mixins/code-filter';
import { getWorkshopSectionList, getPdList, getSectionAutoReport } from '@/api/core/monitoring/sectionStatistics'
import * as XLSX from 'xlsx'
import FileSaver from 'file-saver'
import jsPDF from 'jspdf'
import html2canvas from 'html2canvas'
const tableProps = [
{
@ -140,6 +128,7 @@ export default {
tableProps,
tableBtn: [],
tableData: [],
showData: [],
formConfig: [
{
type: 'select',
@ -208,40 +197,86 @@ export default {
this.getPdLineList()
},
methods: {
test() {
var target = document.getElementsByClassName("right-aside")[0]
target.style.background = '#FFFFFF'
setTimeout(() => {
html2canvas(target).then(function(canvas) {
var contentWidth = canvas.width
var contentHeight = canvas.height
// 一页pdf显示html页面生成的canvas高度
var pageHeight = contentHeight / 592.28 * 841.89
// 未生成pdf的html页面高度
var leftHeight = contentHeight
// 页面偏移
var position = 0
// a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的高度
var imgWidth = 595.28
var imgHeight = 592.28 / contentWidth * contentHeight
var pageData = canvas.toDataURL('image/jpeg', 1.0)
console.log('nihc URL', leftHeight, pageHeight)
var pdf = new jsPDF('', 'pt', 'a4')
if (leftHeight < pageHeight) {
pdf.addImage(pageData, 'JPEG', 0, 20, imgWidth, imgHeight)
} else {
while(leftHeight > 0) {
pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight
position -= 841.89
// 避免空白页
if (leftHeight > 0) {
pdf.addPage()
}
}
}
pdf.save('工段统计自动报表.pdf')
})
}, 300)
},
exportECL() {
let tables = document.querySelector('.el-table').cloneNode(true)
const fix = tables.querySelector('.el-table__fixed')
const fixRight = tables.querySelector('.el-table__fixed-right')
if (fix) {
tables.removeChild(tables.querySelector('.el-table__fixed'))
}
if (fixRight) {
tables.removeChild(tables.querySelector('.el-table__fixed-right'))
}
let exportTable = XLSX.utils.table_to_book(tables)
var exportTableOut = XLSX.write(exportTable, {
bookType: 'xlsx', bookSST: true, type: 'array'
})
// sheetjs.xlsx为导出表格的标题名称
try {
FileSaver.saveAs(new Blob([exportTableOut], {
type: 'application/octet-stream'
}), '工段统计自动报表.xlsx')
} catch (e) {
if (typeof console !== 'undefined') console.log(e, exportTableOut)
}
return exportTableOut
},
exportPdf() {
this.pdf()
this.dialogVisible = false
this.test()
setTimeout(() =>{
this.dialogVisible = false
this.showData = this.tableData
}, 600)
},
exportXlsx() {
this.down()
this.exportECL()
this.dialogVisible = false
this.showData = this.tableData
},
pdf() {
const printWindow = window.open('', '_blank')
const temp = this.$refs.pdf.innerHTML
console.log(temp)
printWindow.document.body.innerHTML = temp
printWindow.document.close()
printWindow.print()
},
down() {
//选中导出时可更改此处数组 选中的数组
//构建导出的表格数据
const exportData = [
{reportType: '产线类型', reportStartTime: '统计开始时间', reportEndTime: '统计结束时间', lineName: '产线名称', sectionName: '工段名称', inputNum: '投入数量/片', outputNum: '产出数量/片', outputArea: '产出面积/㎡', lossNum: '损耗数量/片', lossArea: '损耗面积/㎡', lossRatio: '损耗比例%' },
...this.selectedList
]
//注意表格上绑定id， 获取dom元素
const worksheet = XLSX.utils.json_to_sheet(exportData, { skipHeader: true })
const workbook = XLSX.utils.book_new()
XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1")
const workbookOutput = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
try {
FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), '工段统计自动报表.xlsx')
} catch (e) {
console.log(e)
}
},
handleClose(done) {
this.$confirm('确认关闭？')
.then(_ => {
@ -289,6 +324,7 @@ export default {
item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月'
return item
});
this.showData = this.tableData
this.total = response.data.total;
this.dataListLoading = false;
});
@ -305,21 +341,10 @@ export default {
this.getDataList();
},
handleExport() {
if (this.selectedList.length === 0) {
this.selectedList = this.tableData
if (this.selectedList.length > 0) {
this.showData = this.selectedList
}
this.dialogVisible = true
// 处理查询参数
// let params = { ...this.queryParams };
// params.pageNo = undefined;
// params.pageSize = undefined;
// this.$modal.confirm('是否确认导出所有数据项?').then(() => {
// this.exportLoading = true;
// return this.urlOptions.exportURL(params);
// }).then(response => {
// this.$download.excel(response, '工厂.xls');
// this.exportLoading = false;
// }).catch(() => { });
}
},
};

144
src/views/core/monitoring/sectionStatisticsSearch/index.vue
View File

@ -5,23 +5,42 @@
ref="searchBarForm"
@headBtnClick="buttonClick" />
<base-table
class="right-aside"
v-loading="dataListLoading"
:table-props="tableProps"
:table-data="tableData" />
<!-- <pagination
:table-data="showData"
:selectWidth="55"
@selection-change="selectChange"
/>
<pagination
:limit.sync="listQuery.pageSize"
:page.sync="listQuery.pageNo"
:total="listQuery.total"
@pagination="getDataList" /> -->
@pagination="getDataList" />
<el-dialog
title="提示"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose">
<el-button type="primary" @click="exportXlsx">xlsx</el-button>
<el-button type="success" @click="exportPdf">pdf</el-button>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
// import basicPage from '../../mixins/basic-page';
import { parseTime } from '../../mixins/code-filter';
import { getSectionDataSearch } from '@/api/core/monitoring';
import { getProductionLinePage } from '@/api/core/base/productionLine';
import { getWorkshopSectionPage } from '@/api/core/base/workshopSection';
import * as XLSX from 'xlsx'
import FileSaver from 'file-saver'
import jsPDF from 'jspdf'
import html2canvas from 'html2canvas'
const tableProps = [
{
@ -70,6 +89,8 @@ export default {
},
tableProps,
tableData: [],
showData: [],
selectedList: [],
listQuery: {
proLineId:undefined,
sectionId: undefined,
@ -77,6 +98,7 @@ export default {
endTime: undefined,
},
dataListLoading: false,
dialogVisible: false,
optionArrUrl: [getProductionLinePage, getWorkshopSectionPage],
formConfig: [
{
@ -127,6 +149,93 @@ export default {
this.getDataList()
},
methods: {
test() {
var target = document.getElementsByClassName("right-aside")[0]
target.style.background = '#FFFFFF'
setTimeout(() => {
html2canvas(target).then(function(canvas) {
var contentWidth = canvas.width
var contentHeight = canvas.height
// 一页pdf显示html页面生成的canvas高度
var pageHeight = contentHeight / 592.28 * 841.89
// 未生成pdf的html页面高度
var leftHeight = contentHeight
// 页面偏移
var position = 0
// a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的高度
var imgWidth = 595.28
var imgHeight = 592.28 / contentWidth * contentHeight
var pageData = canvas.toDataURL('image/jpeg', 1.0)
console.log('nihc URL', leftHeight, pageHeight)
var pdf = new jsPDF('', 'pt', 'a4')
if (leftHeight < pageHeight) {
pdf.addImage(pageData, 'JPEG', 0, 20, imgWidth, imgHeight)
} else {
while(leftHeight > 0) {
pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight
position -= 841.89
// 避免空白页
if (leftHeight > 0) {
pdf.addPage()
}
}
}
pdf.save('工段统计数据查询报表.pdf')
})
}, 300)
},
exportECL() {
let tables = document.querySelector('.el-table').cloneNode(true)
const fix = tables.querySelector('.el-table__fixed')
const fixRight = tables.querySelector('.el-table__fixed-right')
if (fix) {
tables.removeChild(tables.querySelector('.el-table__fixed'))
}
if (fixRight) {
tables.removeChild(tables.querySelector('.el-table__fixed-right'))
}
let exportTable = XLSX.utils.table_to_book(tables)
var exportTableOut = XLSX.write(exportTable, {
bookType: 'xlsx', bookSST: true, type: 'array'
})
// sheetjs.xlsx为导出表格的标题名称
try {
FileSaver.saveAs(new Blob([exportTableOut], {
type: 'application/octet-stream'
}), '工段统计数据查询报表.xlsx')
} catch (e) {
if (typeof console !== 'undefined') console.log(e, exportTableOut)
}
return exportTableOut
},
exportPdf() {
this.test()
setTimeout(() =>{
this.dialogVisible = false
this.showData = this.tableData
}, 600)
},
exportXlsx() {
this.exportECL()
this.dialogVisible = false
this.showData = this.tableData
},
handleClose(done) {
this.$confirm('确认关闭？')
.then(_ => {
done();
})
.catch(_ => {});
},
getArr() {
const params = {
page: 1,
@ -144,9 +253,31 @@ export default {
// this.listQuery.endTime = '1693564257000'
this.urlOptions.getDataListURL(this.listQuery).then(res => {
this.tableData = res.data
// this.total = response.data.total;
this.listQuery.total = this.tableData.length;
this.dataListLoading = false;
this.showData = this.tableData;
});
},
// 每页数
sizeChangeHandle(val) {
this.listQuery.pageSize = val;
this.listQuery.pageNo = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
this.listQuery.pageNo = val;
this.getDataList();
},
handleExport() {
if (this.selectedList.length > 0) {
this.showData = this.selectedList
}
this.dialogVisible = true
},
selectChange(val) {
console.log(val)
this.selectedList = val
},
buttonClick(val) {
console.log(val)
@ -171,6 +302,9 @@ export default {
};
this.getDataList();
break;
case 'export':
this.handleExport();
break;
default:
console.log(val);
}