src/views/copilot/yield/components/sub/ring/DoubleRingChart.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-20 13:32:59
- * @LastEditTime: 2024-07-09 08:58:47
+ * @LastEditTime: 2024-06-17 16:42:12
  * @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;

src/views/copilot/yield/components/sub/ring/DoubleRingWrapper.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-30 16:00:50
- * @LastEditTime: 2024-07-09 09:09:07
+ * @LastEditTime: 2024-06-03 16:26:03
  * @LastEditors: zhp
  * @Description:
 -->
@@ -64,7 +64,7 @@ export default {
 <style scoped lang="scss">
 .double-ring-wrapper {
   height: 100%;
-  padding: 0px 24px;
+  padding: 12px 24px;
   display: flex;
   gap: 12px;
   flex-direction: column;

src/views/copilot/yield/components/sub/ring/noDoubleRingWrapper.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-05-24 15:15:00
- * @LastEditTime: 2024-07-09 09:27:12
+ * @LastEditTime: 2024-05-31 16:16:16
  * @LastEditors: zhp
  * @Description:
 -->
@@ -74,7 +74,7 @@ export default {
 <style scoped lang="scss">
 .double-ring-wrapper {
   height: 100%;
-  padding: 0px 24px;
+  padding: 12px 24px;
   display: flex;
   gap: 12px;
   flex-direction: column;

src/views/copilot/yield/options/double-ring-chart-options.js

@@ -23,11 +23,11 @@ export default ({
   title: {
     text: titleValue,
     left: "48.5%",
-    top: "35%",
+    top: "37%",
     textAlign: "center",
     textStyle: {
-      fontWeight: 400,
+      fontWeight: 600,
-      fontSize: 32,
+      fontSize: 26,
       color: "#fffd",
     },
     subtext: `\u2002${subtitle}\u2002`,
@@ -43,8 +43,8 @@ export default ({
     {
       type: "pie",
       name: "当前目标",
-      radius: ["80%", "95%"],
+     radius: ["80%", "90%"],
-      center: ["50%", "48%"],
+      center: ["50%", "52%"],
       emptyCircleStyle: {
         color: "#042c5f33",
       },
@@ -52,8 +52,8 @@ export default ({
     // 数据 series
     {
       type: "pie",
-      radius: ["80%", "95%"],
+      radius: ["80%", "90%"],
-      center: ["50%", "48%"],
+      center: ["50%", "52%"],
       avoidLabelOvervlap: false,
       label: {
         show: false,
@@ -103,8 +103,8 @@ export default ({
     // 数据 series2 - 2023累计
     {
       type: "pie",
-      radius: ["65%", "80%"],
+      radius: ["70%", "80%"],
-      center: ["50%", "48%"],
+      center: ["50%", "52%"],
       avoidLabelOvervlap: false,
       label: {
         show: false,

src/views/produce/workOrder/dayReportComponents/ExportDayReport.vue

@@ -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" :pieList="pieList" />
+          <productYield ref="productYield" :beProcessObj="beProcessObj" />
         </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" :produceData="produceData" />
+          <produceDetail ref="produceDetail" :beProcessObj="beProcessObj" />
         </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" :hisObj="hisObj" />
+          <hisChart ref="hisChart" :beProcessObj="beProcessObj" />
         </div>
       </el-col>
-    </el-row>
+    </el-row> -->
   </div>
 </template>
 <script>
@@ -43,17 +43,17 @@ export default {
   name: 'ExportDayReport',
   components: { hisChart, produceDetail, productYield, beProcessed },
   props: {
-    produceData: {
+    productionOverviewVo: {
-      type: Array,
-      default: () => []
-    },
-    hisObj: {
       type: Object,
       default: () => { }
     },
-    pieList: {
+    equipmentUtilizationVo: {
-      type: Array,
+      type: Object,
-      default: () => []
+      default: () => { }
+    },
+    chipPowerTrendVo: {
+      type: Object,
+      default: () => { }
     },
     beProcessObj: {
       type: Object,
@@ -62,6 +62,8 @@ export default {
   },
   data() {
     return {
+      tableData1: [],
+      tableData2: []
     }
   },
   watch: {
@@ -76,8 +78,8 @@ export default {
   },
   methods: {
     getData() {
-      // console.log('beProcessObj', this.beProcessObj);
+      console.log(this.beProcessObj);
-      // this.$refs.beProcess.canvasReset()
+      this.$refs.beProcess.canvasReset()
       // this.$refs.productYield.canvasReset()
       // this.$refs.produceDetail.canvasReset()
       // this.$refs.hisChart.canvasReset()

src/views/produce/workOrder/dayReportComponents/dayReportExportChart/beProcessed.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-07-08 14:51:47
- * @LastEditTime: 2024-07-09 09:34:38
+ * @LastEditTime: 2024-07-08 16:50:34
  * @LastEditors: zhp
  * @Description:
 -->
@@ -28,11 +28,10 @@ export default {
   },
   watch: {
     beProcessObj: {
-      handler(val) {
+      handler(newValue, oldValue) {
-        console.log(val);
+        console.log(newValue);
         this.canvasReset()
-      },
+      }
-      deep: true //对象内部属性的监听，关键。
     }
   },
   mounted() {
@@ -52,11 +51,13 @@ export default {
       ) {
         this.chart.dispose()
       }
-      console.log(this.beProcessObj);
+      // console.log(this.beProcessObj);
-      this.chart = echarts.init(document.getElementById('chipPowerExpChart'))
+      this.chart = echarts.init(document.getElementById('chipPowerExpChart'), 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: '待制品分布',
@@ -71,7 +72,7 @@ export default {
         calculable: true,
         grid: {
           top: '15%',
-          left: 0,
+          left: 10,
           right: 0,
           bottom: 0,
           containLabel: true
@@ -80,7 +81,7 @@ export default {
           type: 'category',
           data: xAxisList,
           axisLabel: {
-            rotate: 45
+            rotate: 25
             // width: '10%'
           }
         },
@@ -95,7 +96,7 @@ export default {
           {
             data: yAxisList,
             type: 'bar',
-            barWidth: 10,
+            barWidth: 16,
             label: {
               show: true,
               position: 'top'

src/views/produce/workOrder/dayReportComponents/dayReportExportChart/hisChart.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-07-08 14:51:47
- * @LastEditTime: 2024-07-09 09:55:27
+ * @LastEditTime: 2024-07-08 16:40:58
  * @LastEditors: zhp
  * @Description:
 -->
@@ -16,7 +16,7 @@ export default {
   name: 'ChipPowerExp',
   // mixins: [resize],
   props: {
-    hisObj: {
+    beProcessObj: {
       type: Object,
       default: () => { }
     }
@@ -27,11 +27,10 @@ export default {
     }
   },
   watch: {
-    hisObj: {
+    beProcessObj: {
       handler(newValue, oldValue) {
         this.canvasReset()
-      },
+      }
-      deep:true,
     }
   },
   mounted() {
@@ -51,11 +50,13 @@ export default {
       ) {
         this.chart.dispose()
       }
-      this.chart = echarts.init(document.getElementById('hisChart'))
+      console.log(this.beProcessObj);
+      this.chart = echarts.init(document.getElementById('hisChart'), 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)
-      let dateList = this.hisObj.dateList
-      let seriesList = this.hisObj.seriesList
       var option = {
         // title: {
         //   text: '待制品分布',
@@ -70,16 +71,16 @@ export default {
         calculable: true,
         grid: {
           top: '15%',
-          left: 0,
+          left: 10,
           right: 0,
           bottom: 0,
           containLabel: true
         },
         xAxis: {
           type: 'category',
-          data: dateList,
+          data: xAxisList,
           axisLabel: {
-            rotate: 45
+            rotate: 25
             // width: '10%'
           }
         },
@@ -92,8 +93,9 @@ export default {
         },
         series: [
           {
-            data: seriesList,
+            data: yAxisList,
-            type: 'line',
+            type: 'bar',
+            barWidth: 16,
             label: {
               show: true,
               position: 'top'

src/views/produce/workOrder/dayReportComponents/dayReportExportChart/produceDetail.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-07-08 14:51:47
- * @LastEditTime: 2024-07-09 09:56:13
+ * @LastEditTime: 2024-07-08 16:41:11
  * @LastEditors: zhp
  * @Description:
 -->
@@ -16,9 +16,9 @@ export default {
   name: 'ChipPowerExp',
   // mixins: [resize],
   props: {
-    produceData: {
+    beProcessObj: {
-      type: Array,
+      type: Object,
-      default: () => []
+      default: () => { }
     }
   },
   data() {
@@ -27,11 +27,10 @@ export default {
     }
   },
   watch: {
-    produceData: {
+    beProcessObj: {
       handler(newValue, oldValue) {
         this.canvasReset()
-      },
+      }
-      deep:true,
     }
   },
   mounted() {
@@ -51,13 +50,16 @@ 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'
         // },
@@ -69,16 +71,17 @@ export default {
         calculable: true,
         grid: {
           top: '15%',
-          left: 0,
+          left: 10,
-          right: '10%',
+          right: 0,
           bottom: 0,
           containLabel: true
         },
         xAxis: {
           type: 'category',
-          data: ['目标产量', '计划投入量', '实际投入', '实际产出', '废品数量', '待再加工数量'],
+          data: xAxisList,
           axisLabel: {
-            rotate: 45
+            rotate: 25
+            // width: '10%'
           }
         },
         yAxis: {
@@ -90,7 +93,7 @@ export default {
         },
         series: [
           {
-            data: this.produceData,
+            data: yAxisList,
             type: 'bar',
             barWidth: 16,
             label: {

src/views/produce/workOrder/dayReportComponents/dayReportExportChart/productYield.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-07-08 14:51:47
- * @LastEditTime: 2024-07-09 09:58:43
+ * @LastEditTime: 2024-07-08 16:41:20
  * @LastEditors: zhp
  * @Description:
 -->
@@ -16,9 +16,9 @@ export default {
   name: 'ChipPowerExp',
   // mixins: [resize],
   props: {
-    pieList: {
+    beProcessObj: {
-      type: Array,
+      type: Object,
-      default: () => []
+      default: () => { }
     }
   },
   data() {
@@ -27,11 +27,10 @@ export default {
     }
   },
   watch: {
-    pieList: {
+    beProcessObj: {
       handler(newValue, oldValue) {
         this.canvasReset()
-      },
+      }
-      deep:true
     }
   },
   mounted() {
@@ -53,49 +52,53 @@ 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 = {
-        color: ['#3E8EF7', '#69E6D8', '#F7C739'],
+        // title: {
-        title: {
+        //   text: '待制品分布',
-          // 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'
-          left: 'center'
+        //   // subtext: 'Fake Data'
-          // subtext: 'Fake Data'
+        // },
-        },
+        color: ['#3E8EF7'],
         tooltip: {
-          trigger: 'item'
+          trigger: 'axis'
         },
-        legend: {
+        // grid: { top: 100, right: 90, bottom: 10, left: 10, containLabel: true },
+        calculable: true,
+        grid: {
+          top: '15%',
+          left: 10,
+          right: 0,
           bottom: 0,
-          left: 'center'
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          data: xAxisList,
+          axisLabel: {
+            rotate: 25
+            // width: '10%'
+          }
+        },
+        yAxis: {
+          type: 'value',
+          name: '单位/片',
+          axisLine: {
+            show: true
+          }
         },
         series: [
           {
-            // name: 'Access From',
+            data: yAxisList,
-            type: 'pie',
+            type: 'bar',
-            radius: ['50%', '70%'],
+            barWidth: 16,
-            avoidLabelOverlap: false,
-            data: this.pieList,
             label: {
               show: true,
-              position: 'outside',
+              position: 'top'
-              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'
-                }
-              }
             }
           }
         ]

src/views/produce/workOrder/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: zhp
  * @Date: 2024-04-15 10:49:13
- * @LastEditTime: 2024-07-09 10:17:41
+ * @LastEditTime: 2024-07-08 16:54:13
  * @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" :produceData="produceData" :hisObj="hisObj" :pieList="pieList" />
+      <ExportDayReport :beProcessObj="beProcessObj" />
     </div>
   </div>
 </template>
@@ -94,12 +94,6 @@ export default {
       inputNum: 0,
       heightNum: 180,
       factoryList,
-      produceData: [],
-      pieList:[],
-      hisObj: {
-        seriesList: [],
-        dateList:[],
-      },
       beProcessObj: {
         xAxisList: [],
         yAxisList:[]
@@ -299,27 +293,24 @@ export default {
   },
   methods: {
     exportPDF() {
-      setTimeout(() => {
+      this.$message.success('正在导出，请稍等！')
-        this.$message.success('正在导出，请稍等！')
+      const element = document.getElementById('dayRepDom')
-        const element = document.getElementById('dayRepDom')
+      element.style.display = 'block'
-        element.style.display = 'block'
+      const fileName = '瑞昌碲化镉生产日报' + moment().format('yyMMDD') + '.pdf'
-        const fileName = '工单数据' + moment().format('yyMMDD') + '.pdf'
+      html2canvas(element, {
-        html2canvas(element, {
+        dpi: 300, // Set to 300 DPI
-          dpi: 300, // Set to 300 DPI
+        scale: 3 // Adjusts your resolution
-          scale: 3 // Adjusts your resolution
+      }).then(function (canvas) {
-        }).then(function (canvas) {
+        const imgWidth = 595.28
-          const imgWidth = 595.28
+        const imgHeight = 841.89
-          const imgHeight = 841.89
+        const pageData = canvas.toDataURL('image/jpeg', 1.0)
-          const pageData = canvas.toDataURL('image/jpeg', 1.0)
+        const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight])
-          const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight])
+        PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
-          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
+        setTimeout(() => {
-          setTimeout(() => {
+          PDF.save(fileName) // 导出文件名
-            PDF.save(fileName) // 导出文件名
+        }, 1000)
-          }, 1000)
+      })
-        })
+      element.style.display = 'none'
-        element.style.display = 'none'
-      }, 3000)
-
     },
     getOverView() {
       getOverView().then(res => {
@@ -350,30 +341,30 @@ export default {
         const res = await getWorkOrderDetail(val.data.id)
         if (res.code === 0) {
           // this.loading = false
-          ;const data = res.data.prodWorkOrderDO
+          // this.dataForm = res.data.prodWorkOrderDO
-          const barList = [data.targetProduction, data.plannedInvestment, data.actualInvestment, data.actualProduction, data.wasteNum, data.reworkNum]
+          // this.buildChart(this.dataForm)
-          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
-          this.produceData = barList
+          console.log(this.beProcessObj);
-           this.pieList = [
+          // this.initEqLineChart(xAxisList, yAxisList)
-            { value: data.actualProduction ? data.actualProduction : 0, name: '实际产出' },
+          // 趋势图
-            { value: data.wasteNum ? data.wasteNum : 0, name: '废品数量' },
+          const seriesList = []
-            { value: data.reworkNum ? data.reworkNum : 0, name: '待再加工数量' }
+          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.$nextTick(() => {
+        // if (this.dataForm.orderStatus === 1) {
-          this.exportPDF()
+        //   this.trend()
-        })
+        // }
       }
     },
     async getDataList() {