质量综合大屏今日检验任务，缺陷分布图。

src/views/screens/qualityScreen.vue

@@ -66,7 +66,7 @@ const qualityBottom02 = computed(() => {
 
   .top-container-box {
     height: 100%;
-    border: 1px solid yellow;
+    //border: 1px solid yellow;
     padding: 25px;
   }
 
@@ -97,7 +97,7 @@ const qualityBottom02 = computed(() => {
 
   .bottom-container-box {
     height: 100%;
-    border: 1px solid yellow;
+    //border: 1px solid yellow;
   }
 
   .bottom-left {

src/views/screens/screen-components/DefectDistributionDiagram.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="screen-common-component">
-    <ScreenComHeader :module-id="moduleId" title="每日产量统计" />
+    <ScreenComHeader :module-id="moduleId" title="缺陷分布图" />
     <div ref="chartRef" class="charts-container"></div>
   </div>
 </template>
@@ -8,32 +8,92 @@
 <script lang="ts" setup>
 import ScreenComHeader from "@/views/screens/configs/screenComHeader.vue";
 import * as echarts from "echarts";
-import { chartLegend } from "@/views/screens/configs/chartsConfig";
 
 const chartRef = ref(null);
 
 const option = {
   backgroundColor: "transparent",
-  legend: chartLegend,
-  tooltip: {},
-  dataset: {
-    dimensions: ["product", "2015", "2016", "2017"],
-    source: [
-      { product: "Matcha Latte", 2015: 43.3, 2016: 85.8, 2017: 93.7 },
-      { product: "Milk Tea", 2015: 83.1, 2016: 73.4, 2017: 55.1 },
-      { product: "Cheese Cocoa", 2015: 86.4, 2016: 65.2, 2017: 82.5 },
-      { product: "Walnut Brownie", 2015: 72.4, 2016: 53.9, 2017: 39.1 },
-    ],
+  tooltip: {
+    trigger: "axis",
+    axisPointer: {
+      type: "cross",
+      crossStyle: {
+        color: "#999",
+      },
+    },
   },
-  xAxis: { type: "category" },
-  yAxis: {
-    // axisLine: { show: false },
-    // axisTick: { show: false },
-    splitLine: { show: false },
+
+  legend: {
+    data: ["Evaporation", "Temperature"],
   },
-  // Declare several bar series, each will be mapped
-  // to a column of dataset.source by default.
-  series: [{ type: "bar" }, { type: "bar" }, { type: "bar" }],
+  xAxis: [
+    {
+      type: "category",
+      data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+  ],
+  yAxis: [
+    {
+      type: "value",
+      name: "Precipitation",
+      min: 0,
+      max: 250,
+      interval: 50,
+      axisLabel: {
+        formatter: "{value} ml",
+      },
+    },
+    {
+      type: "value",
+      name: "Temperature",
+      min: 0,
+      max: 25,
+      interval: 5,
+      axisLabel: {
+        formatter: "{value} °C",
+      },
+    },
+  ],
+  series: [
+    {
+      name: "Evaporation",
+      type: "bar",
+      tooltip: {
+        valueFormatter: function (value) {
+          return value + " ml";
+        },
+      },
+      data: [
+        2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3,
+      ],
+    },
+    // {
+    //   name: "Precipitation",
+    //   type: "bar",
+    //   tooltip: {
+    //     valueFormatter: function (value) {
+    //       return value + " ml";
+    //     },
+    //   },
+    //   data: [
+    //     2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3,
+    //   ],
+    // },
+    {
+      name: "Temperature",
+      type: "line",
+      yAxisIndex: 1,
+      tooltip: {
+        valueFormatter: function (value) {
+          return value + " °C";
+        },
+      },
+      data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2],
+    },
+  ],
 };
 
 onMounted(() => {

src/views/screens/screen-components/InspectionTaskOfToday.vue

@@ -1,7 +1,47 @@
 <template>
-  <div>src/views/screens/screen-components /InspectionTaskOfToday</div>
+  <div class="screen-common-component">
+    <ScreenComHeader :module-id="moduleId" title="今日检验任务" />
+    <dv-scroll-board
+      :config="config"
+      style="width: 100%; height: calc(100% - 32px)"
+    />
+  </div>
 </template>
 
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+import ScreenComHeader from "@/views/screens/configs/screenComHeader.vue";
 
-<style lang="scss" scoped></style>
+const config = ref({});
+
+const props = defineProps({
+  moduleId: {
+    type: String,
+    required: true,
+  },
+});
+
+onMounted(() => {
+  config.value = {
+    header: ["检验单号", "产品型号", "送检数量", "送检单位", "检验状态"],
+    data: [
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+      ["行9列1", "行9列2", "行9列3", "行9列1", "行9列2"],
+    ],
+    index: true,
+    indexHeader: "序号",
+    // columnWidth: [50],
+    align: ["center"],
+    carousel: "page",
+  };
+});
+</script>