综合管理大屏每日工位布局。

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

@@ -8,7 +8,7 @@
 <script lang="ts" setup>
 import ScreenComHeader from "@/views/screens/configs/screenComHeader.vue";
 import * as echarts from "echarts";
-import {dailyProduction, stationProduction} from "@/api/screens";
+import { dailyProduction, stationProduction } from "@/api/screens";
 import { allChartColors } from "@/views/screens/configs/chartsConfig";
 const bigScreenData: any = inject("bigScreenData");
 const chartRef = ref(null);
@@ -16,12 +16,13 @@ const chartRef = ref(null);
 onMounted(async () => {
   const chart = echarts.init(chartRef.value, "dark");
   let res: any = await stationProduction();
+
   const option = {
     grid: {
-      left: "10%",
-      right: "10%",
-      top: "10%",
-      bottom: "15%",
+      left: "5%",
+      right: "5%",
+      top: "5%",
+      bottom: "5%",
     },
     color: allChartColors,
     backgroundColor: "transparent",
@@ -29,7 +30,7 @@ onMounted(async () => {
       type: "category",
       data: res?.data?.map((item: any) => item.stationName),
       axisLabel: {
-        fontSize: bigScreenData.value.fontSize * 2,
+        fontSize: bigScreenData.value.fontSize * 1.5,
       },
     },
     yAxis: {
@@ -56,4 +57,10 @@ const props = defineProps({
 });
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.charts-container {
+  width: 100%;
+  height: calc(100% - 32px);
+  border: 1px solid red;
+}
+</style>