diff --git a/src/views/QualityManager/HomePage.vue b/src/views/QualityManager/HomePage.vue
index baee30f..36a858e 100644
--- a/src/views/QualityManager/HomePage.vue
+++ b/src/views/QualityManager/HomePage.vue
@@ -41,39 +41,35 @@
               <div class="grow-8 flex gap-16">
                 <div class="grow">
                   <techy-box class="" style="padding: calc(16px * var(--beilv));">
-                    <techy-analysis-header>缺陷分类分析</techy-analysis-header>
-                    <new-bar
-                      :xlabel-font-size="10"
-                      :xlabel-rotate="30"
-                      :name-list="[
-                        '擦划伤1',
-                        '擦划伤2',
-                        '擦划伤3',
-                        '擦划伤4',
-                        '擦划伤5',
-                        '擦划伤6',
-                        '擦划伤7',
-                        '擦划伤8',
-                        '擦划伤9',
-                        '擦划伤0',
-                        '擦划伤11',
-                        '擦划伤12'
-                      ]"
-                      chart-name="fault-category"
-                      :data-list="[
-                        {
-                          topColor: 'rgba(59, 76, 118, 0.2)',
-                          bottomColor: '#31A2FF',
-                          name: '库存',
-                          data: [32, 65, 65, 54, 40, 60, 64, 91, 55, 65, 37, 77]
-                        }
-                      ]"
-                    />
+                    <techy-analysis-header>产线缺陷日对比</techy-analysis-header>
+                    <div
+                      class="absolute top-0 left-0"
+                      style="position: absolute; width: 100%; height: 100%; top: 0; left: 0;"
+                    >
+                      <new-bar
+                        chart-name="realtime-cost-production"
+                        :name-list="['A', 'B', 'C', 'D', 'E', 'F']"
+                        :data-list="[
+                          {
+                            topColor: 'rgba(59, 76, 118, 0.2)',
+                            bottomColor: '#49FBD6',
+                            name: '产线A',
+                            data: [64, 91, 55, 65, 37, 79]
+                          },
+                          {
+                            topColor: 'rgba(59, 76, 118, 0.2)',
+                            bottomColor: '#31A2FF',
+                            name: '产线B',
+                            data: [66, 79, 65, 54, 37, 77]
+                          }
+                        ]"
+                      />
+                    </div>
                   </techy-box>
                 </div>
                 <div class="grow">
                   <techy-box class="" style="padding: calc(16px * var(--beilv));">
-                    <techy-analysis-header>工序缺陷分析</techy-analysis-header>
+                    <techy-analysis-header>产线缺陷月对比</techy-analysis-header>
                     <new-bar
                       chart-name="process-fault"
                       :name-list="['A', 'B', 'C', 'D', 'E', 'F']"
diff --git a/src/views/QualityManager/components/charts/newBar.vue b/src/views/QualityManager/components/charts/newBar.vue
index b860b4f..cd37fc5 100644
--- a/src/views/QualityManager/components/charts/newBar.vue
+++ b/src/views/QualityManager/components/charts/newBar.vue
@@ -3,7 +3,7 @@
     ref="chartContainer"
     class="chartContainer"
     :class="bindClass"
-    style="position: relative; width: 100%; height: calc(100% - 36px)"
+    style="position: relative; width: 100%; height:100%"
   />
 </template>
 
@@ -46,19 +46,19 @@ export default {
     bindClass() {
       return {
         'fault-category-chart': this.chartName === 'fault-category',
-        'process-fault-chart': this.chartName === 'process-fault'
+        'process-fault-chart': this.chartName === 'process-fault',
+        'realtime-production-cost-chart': this.chartName === 'realtime-cost-production'
       }
     }
   },
   mounted() {
     if (this.dataList.length > 1) {
-      const barWidth = 400 / 2 / this.dataList[0].data.length
       this.series = [
         {
           // 柱体
           name: this.dataList[0].name,
           type: 'bar',
-          barWidth,
+          barWidth: 20,
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
               { offset: 0, color: this.dataList[0].topColor },
@@ -71,23 +71,40 @@ export default {
           // 柱顶
           name: this.dataList[0].name,
           type: 'pictorialBar',
-          barWidth,
-          symbol: 'diamond',
+          barWidth: 20,
+          symbol: 'circle',
           symbolPosition: 'end',
-          symbolOffset: [0, '-50%'],
-          symbolSize: [30, 12],
+          symbolOffset: ['-70%', '-50%'],
+          symbolSize: [20, 6],
           zlevel: 2,
-          itemStyle: { color: this.dataList[0].topColor },
-          data: this.dataList[0].data
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              { offset: 0, color: 'rgba(59, 76, 118, 0)' },
+              { offset: 1, color: '#2c6e7d' }
+            ])
+          },
+          data: this.dataList[0].data,
+          label: {
+            color:
+              this.chartName === 'process-fault'
+                ? 'rgba(119, 255, 242, 1)'
+                : this.chartName === 'fault-category'
+                ? '#31a2ff'
+                : '#fff9',
+            show: true,
+            offset: [-12, 10],
+            position: 'top',
+            vertialAlign: 'bottom'
+          }
         },
         {
           // 柱底
           name: this.dataList[0].name,
           type: 'pictorialBar',
-          barWidth,
-          symbol: 'diamond',
-          symbolOffset: [0, '50%'],
-          symbolSize: [30, 15],
+          barWidth: 20,
+          symbol: 'circle',
+          symbolOffset: ['-62%', '50%'],
+          symbolSize: [20, 6],
           itemStyle: { color: this.dataList[0].bottomColor },
           data: this.dataList[0].data
         },
@@ -95,7 +112,7 @@ export default {
           // 柱体
           name: this.dataList[1].name,
           type: 'bar',
-          barWidth,
+          barWidth: 20,
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
               { offset: 0, color: this.dataList[1].topColor },
@@ -108,35 +125,51 @@ export default {
           // 柱顶
           name: this.dataList[1].name,
           type: 'pictorialBar',
-          barWidth,
-          symbol: 'diamond',
+          barWidth: 20,
+          symbol: 'circle',
           symbolPosition: 'end',
-          symbolOffset: [0, '-50%'],
-          symbolSize: [30, 12],
+          symbolOffset: ['66%', '-50%'],
+          symbolSize: [20, 6],
           zlevel: 2,
-          itemStyle: { color: this.dataList[1].topColor },
-          data: this.dataList[1].data
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              { offset: 0, color: this.dataList[1].topColor },
+              { offset: 1, color: this.dataList[1].bottomColor }
+            ])
+          },
+          data: this.dataList[1].data,
+          label: {
+            color:
+              this.chartName === 'process-fault'
+                ? 'rgba(119, 255, 242, 1)'
+                : this.chartName === 'fault-category'
+                ? '#31a2ff'
+                : '#fff9',
+            show: true,
+            offset: [12, 10],
+            position: 'top',
+            vertialAlign: 'bottom'
+          }
         },
         {
           // 柱底
           name: this.dataList[1].name,
           type: 'pictorialBar',
-          barWidth,
-          symbol: 'diamond',
-          symbolOffset: [0, '50%'],
-          symbolSize: [30, 15],
-          itemStyle: { color: this.dataList[1].topColor },
+          barWidth: 20,
+          symbol: 'circle',
+          symbolOffset: ['66%', '50%'],
+          symbolSize: [20, 6],
+          itemStyle: { color: this.dataList[1].bottomColor },
           data: this.dataList[1].data
         }
       ]
     } else {
-      const barWidth = 320 / 2 / this.dataList[0].data.length
+      const barWidth = 400 / 2 / this.dataList[0].data.length
       this.series = [
         {
           // 柱体
           name: this.dataList[0].name,
           type: 'bar',
-          // barWidth: 26,
           barWidth: barWidth,
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -157,7 +190,6 @@ export default {
           // 柱顶
           name: this.dataList[0].name,
           type: 'pictorialBar',
-          // barWidth: 26,
           barWidth: barWidth,
           symbol: 'circle',
           symbolPosition: 'end',
@@ -167,11 +199,16 @@ export default {
           itemStyle: {
             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
               { offset: 0, color: 'rgba(59, 76, 118, 0)' },
-              { offset: 1, color: this.dataList[0].bottomColor }
+              { offset: 1, color: '#2c6e7d' }
             ])
           },
           label: {
-            color: this.chartName === 'process-fault' ? 'rgba(119, 255, 242, 1)' : '#31a2ff',
+            color:
+              this.chartName === 'process-fault'
+                ? 'rgba(119, 255, 242, 1)'
+                : this.chartName === 'fault-category'
+                ? '#31a2ff'
+                : '#fff9',
             show: true,
             offset: [0, 10],
             position: 'top',
@@ -183,12 +220,11 @@ export default {
           // 柱底
           name: this.dataList[0].name,
           type: 'pictorialBar',
-          // barWidth: 26,
           barWidth: barWidth,
           symbol: 'circle',
           symbolOffset: [0, '50%'],
           symbolSize: [barWidth, 6],
-          itemStyle: { color: this.dataList[0].bottomColor + '9f' },
+          itemStyle: { color: '#2c6e7d' },
           data: this.dataList[0].data
         }
       ]
@@ -210,12 +246,22 @@ export default {
       this.chart = echarts.init(this.$refs.chartContainer)
       this.chart.setOption({
         grid: {
-          top: 10,
-          left: '2%',
-          right: '2%',
-          bottom: '3%',
+          top: '24%',
+          left: '8%',
+          right: '5%',
+          bottom: '5%',
           containLabel: true
         },
+        legend: {
+          itemWidth: 8,
+          itemHeight: 8,
+          top: '7%',
+          right: '2%',
+          textStyle: {
+            color: '#fff9',
+            fontSize: 10
+          }
+        },
         xAxis: {
           type: 'category',
           axisLine: {
@@ -225,40 +271,77 @@ export default {
             show: false
           },
           axisLabel: {
+            margin: 16,
             textStyle: {
               fontSize: this.xlabelFontSize,
               color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
             },
-            margin: 20,
             rotate: this.xlabelRotate
           },
           data: this.nameList
         },
-        yAxis: {
-          axisLine: {
-            lineStyle: {
-              type: 'solid',
-              color: this.dataList[0].bottomColor,
-              // color: 'rgba(119, 255, 242, 0.6)', // 左边线的颜色
-              width: '1' // 坐标线的宽度
-            }
-          },
-          axisTick: {
-            show: false
-          },
-          axisLabel: {
-            textStyle: {
-              color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
-            }
-          },
-          splitLine: {
-            lineStyle: {
-              type: 'dotted',
-              color: 'rgba(119, 255, 242, 0.2)'
-            }
-          },
-          type: 'value'
-        },
+        yAxis: [
+          {
+            name: '单位:片',
+            nameTextStyle: { align: 'right', fontSize: 9, color: '#fff9' },
+            type: 'value',
+            splitNumber: 3,
+            axisTick: { show: false },
+            onZero: true,
+            position: 'left',
+            offset: 10,
+            axisLine: {
+              lineStyle: {
+                type: 'solid',
+                color: this.dataList[0].bottomColor,
+                // color: 'rgba(119, 255, 242, 0.6)', // 左边线的颜色
+                width: '1' // 坐标线的宽度
+              }
+            },
+            axisLabel: {
+              textStyle: {
+                color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
+              }
+            },
+            splitLine: {
+              lineStyle: {
+                type: 'dotted',
+                color: 'rgba(119, 255, 242, 0.2)'
+              }
+            },
+            type: 'value'
+          }
+          // {
+          //   name: '能耗kw/h',
+          //   nameTextStyle: { align: 'right', fontSize: 9, color: '#fff9' },
+          //   type: 'value',
+          //   splitNumber: 3,
+          //   axisTick: { show: false },
+          //   onZero: true,
+          //   position: 'left',
+          //   offset: 48,
+          //   axisLine: {
+          //     lineStyle: {
+          //       type: 'solid',
+          //       color: this.dataList[1].bottomColor,
+          //       width: '1' // 坐标线的宽度
+          //     }
+          //   },
+          //   axisLabel: {
+          //     textStyle: {
+          //       color: 'rgba(255,255,255,0.5)' // 坐标值得具体的颜色
+          //     }
+          //   },
+          //   splitLine: {
+          //     show: false
+          //     // lineStyle: {
+          //     //   type: 'dotted',
+          //     //   color: 'rgba(119, 255, 242, 0.2)'
+          //     // }
+          //   },
+          //   type: 'value'
+          // }
+        ],
         series: this.series
       })
     }
@@ -276,27 +359,40 @@ export default {
   /* .fault-category-chart::before { */
   content: '';
   position: absolute;
-  bottom: calc(36px * var(--beilv));
-  /* top: 63%; */
+  /* bottom: calc(100vh/1920 * 80);
+  left: calc(100vw/1920 * 48); */
+  /* bottom: calc(10% + 100vh/1920 * 28); */
+  bottom: 25px;
   left: 9%;
-  height: calc(32px * var(--beilv));
+  height: 52px;
   width: 90%;
   background: linear-gradient(to top, #31a2ff6d, transparent);
-  transform: skew(-35deg);
+  transform: skew(-45deg);
   z-index: 0;
 }
 .process-fault-chart >>> div::before {
   /* .process-fault-chart::before { */
   content: '';
   position: absolute;
-  top: 65%;
-  left: 8%;
-  height: calc(32px * var(--beilv));
-  /* bottom: calc(20px * var(--beilv));
-  left: calc(36px * var(--beilv));
-  height: calc(32px * var(--beilv)); */
+  bottom: 26px;
+  left: 10%;
+  height: 48px;
   width: 90%;
   background: linear-gradient(to top, #49fbd789, transparent);
+  transform: skew(-45deg);
+  z-index: 0;
+}
+.realtime-production-cost-chart >>> div::before {
+  /* .fault-category-chart::before { */
+  content: '';
+  position: absolute;
+  bottom: 12%;
+  left: 6%;
+  height: 30px;
+  width: 90%;
+  border-radius: 3px;
+  /* border: 1px solid #49fbd7; */
+  background: linear-gradient(to top, #49fbd789 5%, transparent);
   transform: skew(-35deg);
   z-index: 0;
 }
diff --git a/src/views/QualityManager/components/charts/newLineStack.vue b/src/views/QualityManager/components/charts/newLineStack.vue
index aecb704..6bc8865 100644
--- a/src/views/QualityManager/components/charts/newLineStack.vue
+++ b/src/views/QualityManager/components/charts/newLineStack.vue
@@ -31,7 +31,7 @@ export default {
           }
         },
         grid: {
-          top: '15%',
+          top: '18%',
           left: '2%',
           right: '2%',
           bottom: '2%',