@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-20 13:32:59 | * @Date: 2024-05-20 13:32:59 | ||||
* @LastEditTime: 2024-06-17 16:42:12 | |||||
* @LastEditTime: 2024-07-09 08:58:47 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -312,7 +312,7 @@ function calculateItems(period, valueTuple, than) { | |||||
} | } | ||||
.double-ring-chart__legend { | .double-ring-chart__legend { | ||||
padding: 12px; | |||||
/* padding: 12px; */ | |||||
color: #fff; | color: #fff; | ||||
display: flex; | display: flex; | ||||
justify-content: center; | justify-content: center; | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-30 16:00:50 | * @Date: 2024-05-30 16:00:50 | ||||
* @LastEditTime: 2024-06-03 16:26:03 | |||||
* @LastEditTime: 2024-07-09 09:09:07 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -64,7 +64,7 @@ export default { | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.double-ring-wrapper { | .double-ring-wrapper { | ||||
height: 100%; | height: 100%; | ||||
padding: 12px 24px; | |||||
padding: 0px 24px; | |||||
display: flex; | display: flex; | ||||
gap: 12px; | gap: 12px; | ||||
flex-direction: column; | flex-direction: column; | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-05-24 15:15:00 | * @Date: 2024-05-24 15:15:00 | ||||
* @LastEditTime: 2024-05-31 16:16:16 | |||||
* @LastEditTime: 2024-07-09 09:27:12 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -74,7 +74,7 @@ export default { | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.double-ring-wrapper { | .double-ring-wrapper { | ||||
height: 100%; | height: 100%; | ||||
padding: 12px 24px; | |||||
padding: 0px 24px; | |||||
display: flex; | display: flex; | ||||
gap: 12px; | gap: 12px; | ||||
flex-direction: column; | flex-direction: column; | ||||
@@ -23,11 +23,11 @@ export default ({ | |||||
title: { | title: { | ||||
text: titleValue, | text: titleValue, | ||||
left: "48.5%", | left: "48.5%", | ||||
top: "37%", | |||||
top: "35%", | |||||
textAlign: "center", | textAlign: "center", | ||||
textStyle: { | textStyle: { | ||||
fontWeight: 600, | |||||
fontSize: 26, | |||||
fontWeight: 400, | |||||
fontSize: 32, | |||||
color: "#fffd", | color: "#fffd", | ||||
}, | }, | ||||
subtext: `\u2002${subtitle}\u2002`, | subtext: `\u2002${subtitle}\u2002`, | ||||
@@ -43,8 +43,8 @@ export default ({ | |||||
{ | { | ||||
type: "pie", | type: "pie", | ||||
name: "当前目标", | name: "当前目标", | ||||
radius: ["80%", "90%"], | |||||
center: ["50%", "52%"], | |||||
radius: ["80%", "95%"], | |||||
center: ["50%", "48%"], | |||||
emptyCircleStyle: { | emptyCircleStyle: { | ||||
color: "#042c5f33", | color: "#042c5f33", | ||||
}, | }, | ||||
@@ -52,8 +52,8 @@ export default ({ | |||||
// 数据 series | // 数据 series | ||||
{ | { | ||||
type: "pie", | type: "pie", | ||||
radius: ["80%", "90%"], | |||||
center: ["50%", "52%"], | |||||
radius: ["80%", "95%"], | |||||
center: ["50%", "48%"], | |||||
avoidLabelOvervlap: false, | avoidLabelOvervlap: false, | ||||
label: { | label: { | ||||
show: false, | show: false, | ||||
@@ -103,8 +103,8 @@ export default ({ | |||||
// 数据 series2 - 2023累计 | // 数据 series2 - 2023累计 | ||||
{ | { | ||||
type: "pie", | type: "pie", | ||||
radius: ["70%", "80%"], | |||||
center: ["50%", "52%"], | |||||
radius: ["65%", "80%"], | |||||
center: ["50%", "48%"], | |||||
avoidLabelOvervlap: false, | avoidLabelOvervlap: false, | ||||
label: { | label: { | ||||
show: false, | show: false, | ||||
@@ -1,13 +1,13 @@ | |||||
<template> | <template> | ||||
<div class="dayRepExpBox"> | <div class="dayRepExpBox"> | ||||
<!-- <el-row> | |||||
<el-row> | |||||
<el-col :span="24"> | <el-col :span="24"> | ||||
<div class="chartTitle" style="text-align: center;">产品良率</div> | <div class="chartTitle" style="text-align: center;">产品良率</div> | ||||
<div class="box2"> | <div class="box2"> | ||||
<productYield ref="productYield" :beProcessObj="beProcessObj" /> | |||||
<productYield ref="productYield" :pieList="pieList" /> | |||||
</div> | </div> | ||||
</el-col> | </el-col> | ||||
</el-row> --> | |||||
</el-row> | |||||
<el-row> | <el-row> | ||||
<el-col :span="24"> | <el-col :span="24"> | ||||
<div class="chartTitle" style="text-align: center;">待制品分布</div> | <div class="chartTitle" style="text-align: center;">待制品分布</div> | ||||
@@ -16,11 +16,11 @@ | |||||
</div> | </div> | ||||
</el-col> | </el-col> | ||||
</el-row> | </el-row> | ||||
<!-- <el-row> | |||||
<el-row> | |||||
<el-col :span="24"> | <el-col :span="24"> | ||||
<div class="chartTitle" style="text-align: center;">生产明细</div> | <div class="chartTitle" style="text-align: center;">生产明细</div> | ||||
<div class="box2"> | <div class="box2"> | ||||
<produceDetail ref="produceDetail" :beProcessObj="beProcessObj" /> | |||||
<produceDetail ref="produceDetail" :produceData="produceData" /> | |||||
</div> | </div> | ||||
</el-col> | </el-col> | ||||
</el-row> | </el-row> | ||||
@@ -28,10 +28,10 @@ | |||||
<el-col :span="24"> | <el-col :span="24"> | ||||
<div class="chartTitle" style="text-align: center;">历史趋势</div> | <div class="chartTitle" style="text-align: center;">历史趋势</div> | ||||
<div class="box2"> | <div class="box2"> | ||||
<hisChart ref="hisChart" :beProcessObj="beProcessObj" /> | |||||
<hisChart ref="hisChart" :hisObj="hisObj" /> | |||||
</div> | </div> | ||||
</el-col> | </el-col> | ||||
</el-row> --> | |||||
</el-row> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
@@ -43,17 +43,17 @@ export default { | |||||
name: 'ExportDayReport', | name: 'ExportDayReport', | ||||
components: { hisChart, produceDetail, productYield, beProcessed }, | components: { hisChart, produceDetail, productYield, beProcessed }, | ||||
props: { | props: { | ||||
productionOverviewVo: { | |||||
type: Object, | |||||
default: () => { } | |||||
produceData: { | |||||
type: Array, | |||||
default: () => [] | |||||
}, | }, | ||||
equipmentUtilizationVo: { | |||||
hisObj: { | |||||
type: Object, | type: Object, | ||||
default: () => { } | default: () => { } | ||||
}, | }, | ||||
chipPowerTrendVo: { | |||||
type: Object, | |||||
default: () => { } | |||||
pieList: { | |||||
type: Array, | |||||
default: () => [] | |||||
}, | }, | ||||
beProcessObj: { | beProcessObj: { | ||||
type: Object, | type: Object, | ||||
@@ -62,8 +62,6 @@ export default { | |||||
}, | }, | ||||
data() { | data() { | ||||
return { | return { | ||||
tableData1: [], | |||||
tableData2: [] | |||||
} | } | ||||
}, | }, | ||||
watch: { | watch: { | ||||
@@ -78,8 +76,8 @@ export default { | |||||
}, | }, | ||||
methods: { | methods: { | ||||
getData() { | getData() { | ||||
console.log(this.beProcessObj); | |||||
this.$refs.beProcess.canvasReset() | |||||
// console.log('beProcessObj', this.beProcessObj); | |||||
// this.$refs.beProcess.canvasReset() | |||||
// this.$refs.productYield.canvasReset() | // this.$refs.productYield.canvasReset() | ||||
// this.$refs.produceDetail.canvasReset() | // this.$refs.produceDetail.canvasReset() | ||||
// this.$refs.hisChart.canvasReset() | // this.$refs.hisChart.canvasReset() | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-07-08 14:51:47 | * @Date: 2024-07-08 14:51:47 | ||||
* @LastEditTime: 2024-07-08 16:50:34 | |||||
* @LastEditTime: 2024-07-09 09:34:38 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -28,10 +28,11 @@ export default { | |||||
}, | }, | ||||
watch: { | watch: { | ||||
beProcessObj: { | beProcessObj: { | ||||
handler(newValue, oldValue) { | |||||
console.log(newValue); | |||||
handler(val) { | |||||
console.log(val); | |||||
this.canvasReset() | this.canvasReset() | ||||
} | |||||
}, | |||||
deep: true //对象内部属性的监听,关键。 | |||||
} | } | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -51,13 +52,11 @@ export default { | |||||
) { | ) { | ||||
this.chart.dispose() | this.chart.dispose() | ||||
} | } | ||||
// console.log(this.beProcessObj); | |||||
this.chart = echarts.init(document.getElementById('chipPowerExpChart'), null, { devicePixelRatio: 2 }) | |||||
console.log(this.beProcessObj); | |||||
this.chart = echarts.init(document.getElementById('chipPowerExpChart')) | |||||
// const legendName = Object.keys(this.chipPowerDistributionVo) | // const legendName = Object.keys(this.chipPowerDistributionVo) | ||||
let xAxisList = this.beProcessObj.xAxisList | let xAxisList = this.beProcessObj.xAxisList | ||||
let yAxisList = this.beProcessObj.yAxisList | let yAxisList = this.beProcessObj.yAxisList | ||||
// const values = Object.values(this.chipPowerDistributionVo) | |||||
var option = { | var option = { | ||||
// title: { | // title: { | ||||
// text: '待制品分布', | // text: '待制品分布', | ||||
@@ -72,7 +71,7 @@ export default { | |||||
calculable: true, | calculable: true, | ||||
grid: { | grid: { | ||||
top: '15%', | top: '15%', | ||||
left: 10, | |||||
left: 0, | |||||
right: 0, | right: 0, | ||||
bottom: 0, | bottom: 0, | ||||
containLabel: true | containLabel: true | ||||
@@ -81,7 +80,7 @@ export default { | |||||
type: 'category', | type: 'category', | ||||
data: xAxisList, | data: xAxisList, | ||||
axisLabel: { | axisLabel: { | ||||
rotate: 25 | |||||
rotate: 45 | |||||
// width: '10%' | // width: '10%' | ||||
} | } | ||||
}, | }, | ||||
@@ -96,7 +95,7 @@ export default { | |||||
{ | { | ||||
data: yAxisList, | data: yAxisList, | ||||
type: 'bar', | type: 'bar', | ||||
barWidth: 16, | |||||
barWidth: 10, | |||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: 'top' | position: 'top' | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-07-08 14:51:47 | * @Date: 2024-07-08 14:51:47 | ||||
* @LastEditTime: 2024-07-08 16:40:58 | |||||
* @LastEditTime: 2024-07-09 09:55:27 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -16,7 +16,7 @@ export default { | |||||
name: 'ChipPowerExp', | name: 'ChipPowerExp', | ||||
// mixins: [resize], | // mixins: [resize], | ||||
props: { | props: { | ||||
beProcessObj: { | |||||
hisObj: { | |||||
type: Object, | type: Object, | ||||
default: () => { } | default: () => { } | ||||
} | } | ||||
@@ -27,10 +27,11 @@ export default { | |||||
} | } | ||||
}, | }, | ||||
watch: { | watch: { | ||||
beProcessObj: { | |||||
hisObj: { | |||||
handler(newValue, oldValue) { | handler(newValue, oldValue) { | ||||
this.canvasReset() | this.canvasReset() | ||||
} | |||||
}, | |||||
deep:true, | |||||
} | } | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -50,13 +51,11 @@ export default { | |||||
) { | ) { | ||||
this.chart.dispose() | this.chart.dispose() | ||||
} | } | ||||
console.log(this.beProcessObj); | |||||
this.chart = echarts.init(document.getElementById('hisChart'), null, { devicePixelRatio: 2 }) | |||||
this.chart = echarts.init(document.getElementById('hisChart')) | |||||
// const legendName = Object.keys(this.chipPowerDistributionVo) | // const legendName = Object.keys(this.chipPowerDistributionVo) | ||||
let xAxisList = this.beProcessObj.xAxisList | |||||
let yAxisList = this.beProcessObj.yAxisList | |||||
// const values = Object.values(this.chipPowerDistributionVo) | // const values = Object.values(this.chipPowerDistributionVo) | ||||
let dateList = this.hisObj.dateList | |||||
let seriesList = this.hisObj.seriesList | |||||
var option = { | var option = { | ||||
// title: { | // title: { | ||||
// text: '待制品分布', | // text: '待制品分布', | ||||
@@ -71,16 +70,16 @@ export default { | |||||
calculable: true, | calculable: true, | ||||
grid: { | grid: { | ||||
top: '15%', | top: '15%', | ||||
left: 10, | |||||
left: 0, | |||||
right: 0, | right: 0, | ||||
bottom: 0, | bottom: 0, | ||||
containLabel: true | containLabel: true | ||||
}, | }, | ||||
xAxis: { | xAxis: { | ||||
type: 'category', | type: 'category', | ||||
data: xAxisList, | |||||
data: dateList, | |||||
axisLabel: { | axisLabel: { | ||||
rotate: 25 | |||||
rotate: 45 | |||||
// width: '10%' | // width: '10%' | ||||
} | } | ||||
}, | }, | ||||
@@ -93,9 +92,8 @@ export default { | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
data: yAxisList, | |||||
type: 'bar', | |||||
barWidth: 16, | |||||
data: seriesList, | |||||
type: 'line', | |||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: 'top' | position: 'top' | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-07-08 14:51:47 | * @Date: 2024-07-08 14:51:47 | ||||
* @LastEditTime: 2024-07-08 16:41:11 | |||||
* @LastEditTime: 2024-07-09 09:56:13 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -16,9 +16,9 @@ export default { | |||||
name: 'ChipPowerExp', | name: 'ChipPowerExp', | ||||
// mixins: [resize], | // mixins: [resize], | ||||
props: { | props: { | ||||
beProcessObj: { | |||||
type: Object, | |||||
default: () => { } | |||||
produceData: { | |||||
type: Array, | |||||
default: () => [] | |||||
} | } | ||||
}, | }, | ||||
data() { | data() { | ||||
@@ -27,10 +27,11 @@ export default { | |||||
} | } | ||||
}, | }, | ||||
watch: { | watch: { | ||||
beProcessObj: { | |||||
produceData: { | |||||
handler(newValue, oldValue) { | handler(newValue, oldValue) { | ||||
this.canvasReset() | this.canvasReset() | ||||
} | |||||
}, | |||||
deep:true, | |||||
} | } | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -50,16 +51,13 @@ export default { | |||||
) { | ) { | ||||
this.chart.dispose() | this.chart.dispose() | ||||
} | } | ||||
console.log(this.beProcessObj); | |||||
this.chart = echarts.init(document.getElementById('produceDetail'), null, { devicePixelRatio: 2 }) | this.chart = echarts.init(document.getElementById('produceDetail'), null, { devicePixelRatio: 2 }) | ||||
// const legendName = Object.keys(this.chipPowerDistributionVo) | // const legendName = Object.keys(this.chipPowerDistributionVo) | ||||
let xAxisList = this.beProcessObj.xAxisList | |||||
let yAxisList = this.beProcessObj.yAxisList | |||||
// const values = Object.values(this.chipPowerDistributionVo) | // const values = Object.values(this.chipPowerDistributionVo) | ||||
var option = { | var option = { | ||||
// title: { | // title: { | ||||
// text: '待制品分布', | |||||
// text: '生产明细', | |||||
// left: 'center' | // left: 'center' | ||||
// // subtext: 'Fake Data' | // // subtext: 'Fake Data' | ||||
// }, | // }, | ||||
@@ -71,17 +69,16 @@ export default { | |||||
calculable: true, | calculable: true, | ||||
grid: { | grid: { | ||||
top: '15%', | top: '15%', | ||||
left: 10, | |||||
right: 0, | |||||
left: 0, | |||||
right: '10%', | |||||
bottom: 0, | bottom: 0, | ||||
containLabel: true | containLabel: true | ||||
}, | }, | ||||
xAxis: { | xAxis: { | ||||
type: 'category', | type: 'category', | ||||
data: xAxisList, | |||||
data: ['目标产量', '计划投入量', '实际投入', '实际产出', '废品数量', '待再加工数量'], | |||||
axisLabel: { | axisLabel: { | ||||
rotate: 25 | |||||
// width: '10%' | |||||
rotate: 45 | |||||
} | } | ||||
}, | }, | ||||
yAxis: { | yAxis: { | ||||
@@ -93,7 +90,7 @@ export default { | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
data: yAxisList, | |||||
data: this.produceData, | |||||
type: 'bar', | type: 'bar', | ||||
barWidth: 16, | barWidth: 16, | ||||
label: { | label: { | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-07-08 14:51:47 | * @Date: 2024-07-08 14:51:47 | ||||
* @LastEditTime: 2024-07-08 16:41:20 | |||||
* @LastEditTime: 2024-07-09 09:58:43 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -16,9 +16,9 @@ export default { | |||||
name: 'ChipPowerExp', | name: 'ChipPowerExp', | ||||
// mixins: [resize], | // mixins: [resize], | ||||
props: { | props: { | ||||
beProcessObj: { | |||||
type: Object, | |||||
default: () => { } | |||||
pieList: { | |||||
type: Array, | |||||
default: () => [] | |||||
} | } | ||||
}, | }, | ||||
data() { | data() { | ||||
@@ -27,10 +27,11 @@ export default { | |||||
} | } | ||||
}, | }, | ||||
watch: { | watch: { | ||||
beProcessObj: { | |||||
pieList: { | |||||
handler(newValue, oldValue) { | handler(newValue, oldValue) { | ||||
this.canvasReset() | this.canvasReset() | ||||
} | |||||
}, | |||||
deep:true | |||||
} | } | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -52,53 +53,49 @@ export default { | |||||
} | } | ||||
console.log(this.beProcessObj); | console.log(this.beProcessObj); | ||||
this.chart = echarts.init(document.getElementById('productYield'), null, { devicePixelRatio: 2 }) | this.chart = echarts.init(document.getElementById('productYield'), null, { devicePixelRatio: 2 }) | ||||
// const legendName = Object.keys(this.chipPowerDistributionVo) | |||||
let xAxisList = this.beProcessObj.xAxisList | |||||
let yAxisList = this.beProcessObj.yAxisList | |||||
// const values = Object.values(this.chipPowerDistributionVo) | // const values = Object.values(this.chipPowerDistributionVo) | ||||
var option = { | var option = { | ||||
// title: { | |||||
// text: '待制品分布', | |||||
// left: 'center' | |||||
// // subtext: 'Fake Data' | |||||
// }, | |||||
color: ['#3E8EF7'], | |||||
color: ['#3E8EF7', '#69E6D8', '#F7C739'], | |||||
title: { | |||||
// text: !isNaN((pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100) ? ( '产品良率 ' + (pieData[0].value / (pieData[0].value + pieData[1].value)).toFixed(4) * 100 + '%') : '产品良率 -', | |||||
left: 'center' | |||||
// subtext: 'Fake Data' | |||||
}, | |||||
tooltip: { | tooltip: { | ||||
trigger: 'axis' | |||||
trigger: 'item' | |||||
}, | }, | ||||
// grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true }, | |||||
calculable: true, | |||||
grid: { | |||||
top: '15%', | |||||
left: 10, | |||||
right: 0, | |||||
legend: { | |||||
bottom: 0, | bottom: 0, | ||||
containLabel: true | |||||
}, | |||||
xAxis: { | |||||
type: 'category', | |||||
data: xAxisList, | |||||
axisLabel: { | |||||
rotate: 25 | |||||
// width: '10%' | |||||
} | |||||
}, | |||||
yAxis: { | |||||
type: 'value', | |||||
name: '单位/片', | |||||
axisLine: { | |||||
show: true | |||||
} | |||||
left: 'center' | |||||
}, | }, | ||||
series: [ | series: [ | ||||
{ | { | ||||
data: yAxisList, | |||||
type: 'bar', | |||||
barWidth: 16, | |||||
// name: 'Access From', | |||||
type: 'pie', | |||||
radius: ['50%', '70%'], | |||||
avoidLabelOverlap: false, | |||||
data: this.pieList, | |||||
label: { | label: { | ||||
show: true, | show: true, | ||||
position: 'top' | |||||
position: 'outside', | |||||
formatter: (params) => { | |||||
console.log(params) | |||||
let res = '' | |||||
// for (let i in params) { | |||||
res += `${params.percent ? params.percent : 0}% \n ${params.name}` | |||||
// } | |||||
return res | |||||
}, | |||||
rich: { | |||||
d: { | |||||
color: 'inherit', // 系列色 | |||||
verticalAlign: 'top' | |||||
}, | |||||
b: { | |||||
color: '#8C8C8C', | |||||
verticalAlign: 'top' | |||||
} | |||||
} | |||||
} | } | ||||
} | } | ||||
] | ] | ||||
@@ -1,7 +1,7 @@ | |||||
<!-- | <!-- | ||||
* @Author: zhp | * @Author: zhp | ||||
* @Date: 2024-04-15 10:49:13 | * @Date: 2024-04-15 10:49:13 | ||||
* @LastEditTime: 2024-07-08 16:54:13 | |||||
* @LastEditTime: 2024-07-09 10:17:41 | |||||
* @LastEditors: zhp | * @LastEditors: zhp | ||||
* @Description: | * @Description: | ||||
--> | --> | ||||
@@ -61,7 +61,7 @@ | |||||
<add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" | <add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" | ||||
@refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> | @refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> | ||||
<div id="dayRepDom" style="position: absolute;top:0;display: none;"> | <div id="dayRepDom" style="position: absolute;top:0;display: none;"> | ||||
<ExportDayReport :beProcessObj="beProcessObj" /> | |||||
<ExportDayReport :beProcessObj="beProcessObj" :produceData="produceData" :hisObj="hisObj" :pieList="pieList" /> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -94,6 +94,12 @@ export default { | |||||
inputNum: 0, | inputNum: 0, | ||||
heightNum: 180, | heightNum: 180, | ||||
factoryList, | factoryList, | ||||
produceData: [], | |||||
pieList:[], | |||||
hisObj: { | |||||
seriesList: [], | |||||
dateList:[], | |||||
}, | |||||
beProcessObj: { | beProcessObj: { | ||||
xAxisList: [], | xAxisList: [], | ||||
yAxisList:[] | yAxisList:[] | ||||
@@ -293,24 +299,27 @@ export default { | |||||
}, | }, | ||||
methods: { | methods: { | ||||
exportPDF() { | exportPDF() { | ||||
this.$message.success('正在导出,请稍等!') | |||||
const element = document.getElementById('dayRepDom') | |||||
element.style.display = 'block' | |||||
const fileName = '瑞昌碲化镉生产日报' + moment().format('yyMMDD') + '.pdf' | |||||
html2canvas(element, { | |||||
dpi: 300, // Set to 300 DPI | |||||
scale: 3 // Adjusts your resolution | |||||
}).then(function (canvas) { | |||||
const imgWidth = 595.28 | |||||
const imgHeight = 841.89 | |||||
const pageData = canvas.toDataURL('image/jpeg', 1.0) | |||||
const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight]) | |||||
PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight) | |||||
setTimeout(() => { | |||||
PDF.save(fileName) // 导出文件名 | |||||
}, 1000) | |||||
}) | |||||
element.style.display = 'none' | |||||
setTimeout(() => { | |||||
this.$message.success('正在导出,请稍等!') | |||||
const element = document.getElementById('dayRepDom') | |||||
element.style.display = 'block' | |||||
const fileName = '工单数据' + moment().format('yyMMDD') + '.pdf' | |||||
html2canvas(element, { | |||||
dpi: 300, // Set to 300 DPI | |||||
scale: 3 // Adjusts your resolution | |||||
}).then(function (canvas) { | |||||
const imgWidth = 595.28 | |||||
const imgHeight = 841.89 | |||||
const pageData = canvas.toDataURL('image/jpeg', 1.0) | |||||
const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight]) | |||||
PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight) | |||||
setTimeout(() => { | |||||
PDF.save(fileName) // 导出文件名 | |||||
}, 1000) | |||||
}) | |||||
element.style.display = 'none' | |||||
}, 3000) | |||||
}, | }, | ||||
getOverView() { | getOverView() { | ||||
getOverView().then(res => { | getOverView().then(res => { | ||||
@@ -341,30 +350,30 @@ export default { | |||||
const res = await getWorkOrderDetail(val.data.id) | const res = await getWorkOrderDetail(val.data.id) | ||||
if (res.code === 0) { | if (res.code === 0) { | ||||
// this.loading = false | // this.loading = false | ||||
// this.dataForm = res.data.prodWorkOrderDO | |||||
// this.buildChart(this.dataForm) | |||||
// 在制品 | |||||
;const data = res.data.prodWorkOrderDO | |||||
const barList = [data.targetProduction, data.plannedInvestment, data.actualInvestment, data.actualProduction, data.wasteNum, data.reworkNum] | |||||
const seriesList = [] | |||||
const dateList = [] | |||||
res.data.his.forEach(element => { | |||||
seriesList.push(element.actualProduction) | |||||
dateList.push(element.recordTime[0] + '-' + element.recordTime[1] + '-' + element.recordTime[2]) | |||||
}) | |||||
this.hisObj.seriesList = seriesList | |||||
this.hisObj.dateList = dateList | |||||
const xAxisList = Object.keys(res.data.inProcessDis) | const xAxisList = Object.keys(res.data.inProcessDis) | ||||
const yAxisList = Object.values(res.data.inProcessDis) | const yAxisList = Object.values(res.data.inProcessDis) | ||||
this.beProcessObj.xAxisList = xAxisList | this.beProcessObj.xAxisList = xAxisList | ||||
this.beProcessObj.yAxisList = yAxisList | this.beProcessObj.yAxisList = yAxisList | ||||
console.log(this.beProcessObj); | |||||
// this.initEqLineChart(xAxisList, yAxisList) | |||||
// 趋势图 | |||||
const seriesList = [] | |||||
const dateList = [] | |||||
// res.data.his.forEach(element => { | |||||
// seriesList.push(element.actualProduction) | |||||
// dateList.push(element.recordTime[0] + '-' + element.recordTime[1] + '-' + element.recordTime[2]) | |||||
// }) | |||||
// this.initLineChart(dateList, seriesList) | |||||
this.$nextTick(() => { | |||||
this.exportPDF() | |||||
}) | |||||
this.produceData = barList | |||||
this.pieList = [ | |||||
{ value: data.actualProduction ? data.actualProduction : 0, name: '实际产出' }, | |||||
{ value: data.wasteNum ? data.wasteNum : 0, name: '废品数量' }, | |||||
{ value: data.reworkNum ? data.reworkNum : 0, name: '待再加工数量' } | |||||
] | |||||
} | } | ||||
// if (this.dataForm.orderStatus === 1) { | |||||
// this.trend() | |||||
// } | |||||
this.$nextTick(() => { | |||||
this.exportPDF() | |||||
}) | |||||
} | } | ||||
}, | }, | ||||
async getDataList() { | async getDataList() { | ||||