@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-05-20 13:32:59 | |||
* @LastEditTime: 2024-06-17 16:42:12 | |||
* @LastEditTime: 2024-07-09 08:58:47 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -312,7 +312,7 @@ function calculateItems(period, valueTuple, than) { | |||
} | |||
.double-ring-chart__legend { | |||
padding: 12px; | |||
/* padding: 12px; */ | |||
color: #fff; | |||
display: flex; | |||
justify-content: center; | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-05-30 16:00:50 | |||
* @LastEditTime: 2024-06-03 16:26:03 | |||
* @LastEditTime: 2024-07-09 09:09:07 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -64,7 +64,7 @@ export default { | |||
<style scoped lang="scss"> | |||
.double-ring-wrapper { | |||
height: 100%; | |||
padding: 12px 24px; | |||
padding: 0px 24px; | |||
display: flex; | |||
gap: 12px; | |||
flex-direction: column; | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-05-24 15:15:00 | |||
* @LastEditTime: 2024-05-31 16:16:16 | |||
* @LastEditTime: 2024-07-09 09:27:12 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -74,7 +74,7 @@ export default { | |||
<style scoped lang="scss"> | |||
.double-ring-wrapper { | |||
height: 100%; | |||
padding: 12px 24px; | |||
padding: 0px 24px; | |||
display: flex; | |||
gap: 12px; | |||
flex-direction: column; | |||
@@ -23,11 +23,11 @@ export default ({ | |||
title: { | |||
text: titleValue, | |||
left: "48.5%", | |||
top: "37%", | |||
top: "35%", | |||
textAlign: "center", | |||
textStyle: { | |||
fontWeight: 600, | |||
fontSize: 26, | |||
fontWeight: 400, | |||
fontSize: 32, | |||
color: "#fffd", | |||
}, | |||
subtext: `\u2002${subtitle}\u2002`, | |||
@@ -43,8 +43,8 @@ export default ({ | |||
{ | |||
type: "pie", | |||
name: "当前目标", | |||
radius: ["80%", "90%"], | |||
center: ["50%", "52%"], | |||
radius: ["80%", "95%"], | |||
center: ["50%", "48%"], | |||
emptyCircleStyle: { | |||
color: "#042c5f33", | |||
}, | |||
@@ -52,8 +52,8 @@ export default ({ | |||
// 数据 series | |||
{ | |||
type: "pie", | |||
radius: ["80%", "90%"], | |||
center: ["50%", "52%"], | |||
radius: ["80%", "95%"], | |||
center: ["50%", "48%"], | |||
avoidLabelOvervlap: false, | |||
label: { | |||
show: false, | |||
@@ -103,8 +103,8 @@ export default ({ | |||
// 数据 series2 - 2023累计 | |||
{ | |||
type: "pie", | |||
radius: ["70%", "80%"], | |||
center: ["50%", "52%"], | |||
radius: ["65%", "80%"], | |||
center: ["50%", "48%"], | |||
avoidLabelOvervlap: false, | |||
label: { | |||
show: false, | |||
@@ -1,13 +1,13 @@ | |||
<template> | |||
<div class="dayRepExpBox"> | |||
<!-- <el-row> | |||
<el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">产品良率</div> | |||
<div class="box2"> | |||
<productYield ref="productYield" :beProcessObj="beProcessObj" /> | |||
<productYield ref="productYield" :pieList="pieList" /> | |||
</div> | |||
</el-col> | |||
</el-row> --> | |||
</el-row> | |||
<el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">待制品分布</div> | |||
@@ -16,11 +16,11 @@ | |||
</div> | |||
</el-col> | |||
</el-row> | |||
<!-- <el-row> | |||
<el-row> | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">生产明细</div> | |||
<div class="box2"> | |||
<produceDetail ref="produceDetail" :beProcessObj="beProcessObj" /> | |||
<produceDetail ref="produceDetail" :produceData="produceData" /> | |||
</div> | |||
</el-col> | |||
</el-row> | |||
@@ -28,10 +28,10 @@ | |||
<el-col :span="24"> | |||
<div class="chartTitle" style="text-align: center;">历史趋势</div> | |||
<div class="box2"> | |||
<hisChart ref="hisChart" :beProcessObj="beProcessObj" /> | |||
<hisChart ref="hisChart" :hisObj="hisObj" /> | |||
</div> | |||
</el-col> | |||
</el-row> --> | |||
</el-row> | |||
</div> | |||
</template> | |||
<script> | |||
@@ -43,17 +43,17 @@ export default { | |||
name: 'ExportDayReport', | |||
components: { hisChart, produceDetail, productYield, beProcessed }, | |||
props: { | |||
productionOverviewVo: { | |||
type: Object, | |||
default: () => { } | |||
produceData: { | |||
type: Array, | |||
default: () => [] | |||
}, | |||
equipmentUtilizationVo: { | |||
hisObj: { | |||
type: Object, | |||
default: () => { } | |||
}, | |||
chipPowerTrendVo: { | |||
type: Object, | |||
default: () => { } | |||
pieList: { | |||
type: Array, | |||
default: () => [] | |||
}, | |||
beProcessObj: { | |||
type: Object, | |||
@@ -62,8 +62,6 @@ export default { | |||
}, | |||
data() { | |||
return { | |||
tableData1: [], | |||
tableData2: [] | |||
} | |||
}, | |||
watch: { | |||
@@ -78,8 +76,8 @@ export default { | |||
}, | |||
methods: { | |||
getData() { | |||
console.log(this.beProcessObj); | |||
this.$refs.beProcess.canvasReset() | |||
// console.log('beProcessObj', this.beProcessObj); | |||
// this.$refs.beProcess.canvasReset() | |||
// this.$refs.productYield.canvasReset() | |||
// this.$refs.produceDetail.canvasReset() | |||
// this.$refs.hisChart.canvasReset() | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:50:34 | |||
* @LastEditTime: 2024-07-09 09:34:38 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -28,10 +28,11 @@ export default { | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
handler(newValue, oldValue) { | |||
console.log(newValue); | |||
handler(val) { | |||
console.log(val); | |||
this.canvasReset() | |||
} | |||
}, | |||
deep: true //对象内部属性的监听,关键。 | |||
} | |||
}, | |||
mounted() { | |||
@@ -51,13 +52,11 @@ export default { | |||
) { | |||
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) | |||
let xAxisList = this.beProcessObj.xAxisList | |||
let yAxisList = this.beProcessObj.yAxisList | |||
// const values = Object.values(this.chipPowerDistributionVo) | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
@@ -72,7 +71,7 @@ export default { | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
left: 0, | |||
right: 0, | |||
bottom: 0, | |||
containLabel: true | |||
@@ -81,7 +80,7 @@ export default { | |||
type: 'category', | |||
data: xAxisList, | |||
axisLabel: { | |||
rotate: 25 | |||
rotate: 45 | |||
// width: '10%' | |||
} | |||
}, | |||
@@ -96,7 +95,7 @@ export default { | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
barWidth: 10, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:40:58 | |||
* @LastEditTime: 2024-07-09 09:55:27 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -16,7 +16,7 @@ export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
hisObj: { | |||
type: Object, | |||
default: () => { } | |||
} | |||
@@ -27,10 +27,11 @@ export default { | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
hisObj: { | |||
handler(newValue, oldValue) { | |||
this.canvasReset() | |||
} | |||
}, | |||
deep:true, | |||
} | |||
}, | |||
mounted() { | |||
@@ -50,13 +51,11 @@ export default { | |||
) { | |||
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) | |||
let xAxisList = this.beProcessObj.xAxisList | |||
let yAxisList = this.beProcessObj.yAxisList | |||
// const values = Object.values(this.chipPowerDistributionVo) | |||
let dateList = this.hisObj.dateList | |||
let seriesList = this.hisObj.seriesList | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
@@ -71,16 +70,16 @@ export default { | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
left: 0, | |||
right: 0, | |||
bottom: 0, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
data: dateList, | |||
axisLabel: { | |||
rotate: 25 | |||
rotate: 45 | |||
// width: '10%' | |||
} | |||
}, | |||
@@ -93,9 +92,8 @@ export default { | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
data: seriesList, | |||
type: 'line', | |||
label: { | |||
show: true, | |||
position: 'top' | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:41:11 | |||
* @LastEditTime: 2024-07-09 09:56:13 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -16,9 +16,9 @@ export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
type: Object, | |||
default: () => { } | |||
produceData: { | |||
type: Array, | |||
default: () => [] | |||
} | |||
}, | |||
data() { | |||
@@ -27,10 +27,11 @@ export default { | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
produceData: { | |||
handler(newValue, oldValue) { | |||
this.canvasReset() | |||
} | |||
}, | |||
deep:true, | |||
} | |||
}, | |||
mounted() { | |||
@@ -50,16 +51,13 @@ export default { | |||
) { | |||
this.chart.dispose() | |||
} | |||
console.log(this.beProcessObj); | |||
this.chart = echarts.init(document.getElementById('produceDetail'), 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) | |||
var option = { | |||
// title: { | |||
// text: '待制品分布', | |||
// text: '生产明细', | |||
// left: 'center' | |||
// // subtext: 'Fake Data' | |||
// }, | |||
@@ -71,17 +69,16 @@ export default { | |||
calculable: true, | |||
grid: { | |||
top: '15%', | |||
left: 10, | |||
right: 0, | |||
left: 0, | |||
right: '10%', | |||
bottom: 0, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
data: ['目标产量', '计划投入量', '实际投入', '实际产出', '废品数量', '待再加工数量'], | |||
axisLabel: { | |||
rotate: 25 | |||
// width: '10%' | |||
rotate: 45 | |||
} | |||
}, | |||
yAxis: { | |||
@@ -93,7 +90,7 @@ export default { | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
data: this.produceData, | |||
type: 'bar', | |||
barWidth: 16, | |||
label: { | |||
@@ -1,7 +1,7 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-07-08 14:51:47 | |||
* @LastEditTime: 2024-07-08 16:41:20 | |||
* @LastEditTime: 2024-07-09 09:58:43 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -16,9 +16,9 @@ export default { | |||
name: 'ChipPowerExp', | |||
// mixins: [resize], | |||
props: { | |||
beProcessObj: { | |||
type: Object, | |||
default: () => { } | |||
pieList: { | |||
type: Array, | |||
default: () => [] | |||
} | |||
}, | |||
data() { | |||
@@ -27,10 +27,11 @@ export default { | |||
} | |||
}, | |||
watch: { | |||
beProcessObj: { | |||
pieList: { | |||
handler(newValue, oldValue) { | |||
this.canvasReset() | |||
} | |||
}, | |||
deep:true | |||
} | |||
}, | |||
mounted() { | |||
@@ -52,53 +53,49 @@ export default { | |||
} | |||
console.log(this.beProcessObj); | |||
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) | |||
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: { | |||
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, | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xAxisList, | |||
axisLabel: { | |||
rotate: 25 | |||
// width: '10%' | |||
} | |||
}, | |||
yAxis: { | |||
type: 'value', | |||
name: '单位/片', | |||
axisLine: { | |||
show: true | |||
} | |||
left: 'center' | |||
}, | |||
series: [ | |||
{ | |||
data: yAxisList, | |||
type: 'bar', | |||
barWidth: 16, | |||
// name: 'Access From', | |||
type: 'pie', | |||
radius: ['50%', '70%'], | |||
avoidLabelOverlap: false, | |||
data: this.pieList, | |||
label: { | |||
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 | |||
* @Date: 2024-04-15 10:49:13 | |||
* @LastEditTime: 2024-07-08 16:54:13 | |||
* @LastEditTime: 2024-07-09 10:17:41 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
@@ -61,7 +61,7 @@ | |||
<add-or-update v-if="detailOrUpdateVisible" ref="detailOrUpdate" :date="listQuery.date" | |||
@refreshDataList="successSubmit" @destroy="detailOrUpdateVisible = false" /> | |||
<div id="dayRepDom" style="position: absolute;top:0;display: none;"> | |||
<ExportDayReport :beProcessObj="beProcessObj" /> | |||
<ExportDayReport :beProcessObj="beProcessObj" :produceData="produceData" :hisObj="hisObj" :pieList="pieList" /> | |||
</div> | |||
</div> | |||
</template> | |||
@@ -94,6 +94,12 @@ export default { | |||
inputNum: 0, | |||
heightNum: 180, | |||
factoryList, | |||
produceData: [], | |||
pieList:[], | |||
hisObj: { | |||
seriesList: [], | |||
dateList:[], | |||
}, | |||
beProcessObj: { | |||
xAxisList: [], | |||
yAxisList:[] | |||
@@ -293,24 +299,27 @@ export default { | |||
}, | |||
methods: { | |||
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().then(res => { | |||
@@ -341,30 +350,30 @@ export default { | |||
const res = await getWorkOrderDetail(val.data.id) | |||
if (res.code === 0) { | |||
// 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 yAxisList = Object.values(res.data.inProcessDis) | |||
this.beProcessObj.xAxisList = xAxisList | |||
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() { | |||