大屏调整

2025-10-21 19:41:21 +08:00
parent 26878528b9
commit 4ba4878f8a
16 changed files with 251 additions and 58 deletions
--- a/src/views/recruitment/card/CollegeTalentsOne.vue
+++ b/src/views/recruitment/card/CollegeTalentsOne.vue
@ -4,7 +4,7 @@
    <div class="carcTitle">促就业学历占比</div>
    <div class="pieMain">
      <div class="pieBox" ref="pieRef"></div>
-      <div class="pieTitle">学历占比</div>
+      <!-- <div class="pieTitle">学历占比</div> -->
    </div>
    <ul class="pieLsit">
      <li>
@ -54,8 +54,12 @@ const option = {
        borderRadius: 1
      },
      label: {
-        show: false,
-        position: "center"
+        show: true,
+        position: "center",
+        fontSize: 24,
+        color: "#fff",
+        fontWeight: "bold",
+        formatter: "学历占比" // 固定显示"学历占比"文字
      },

      labelLine: {
--- a/src/views/recruitment/card/CollegeTalentsTwo.vue
+++ b/src/views/recruitment/card/CollegeTalentsTwo.vue
@ -69,6 +69,7 @@ ul.schoolLsit {
    }
    .name {
      color: #cbf2fa;
+      font-size: 0.7vw;
    }
    .numb {
      color: #30dcff;
--- a/src/views/recruitment/card/EnterpriseEmploymentOne.vue
+++ b/src/views/recruitment/card/EnterpriseEmploymentOne.vue
@ -88,16 +88,16 @@ onMounted(() => {

    .custom-slide-content {
      color: #cbf2fa;
-      font-size: 0.625vw;
+      font-size: 0.7vw;
      height: 4.323vw;
-      padding: 0.417vw 1.25vw 0 5.677vw;
+      padding: 0.317vw 1.25vw 0 5.677vw;

      .title {
        margin-bottom: 0.26vw;
      }

      .col {
-        margin-top: 0.78125vw;
+        margin-top: 0.48125vw;
      }
    }

--- a/src/views/recruitment/card/EnterpriseEmploymentThree.vue
+++ b/src/views/recruitment/card/EnterpriseEmploymentThree.vue
@ -14,7 +14,7 @@ const option = {
    top: "17%",
    left: "15%",
    right: "5%",
-    bottom: "20%"
+    bottom: "15%"
  },
  // 设置图例
  legend: {
@ -34,7 +34,7 @@ const option = {
      }
    },
    axisLabel: {
-      fontSize: 14, // 设置 x 轴文字大小
+      fontSize: 22, // 设置 x 轴文字大小
      color: "#CBF2FA", // 可以同时设置文字颜色
      rotate: 20, // 文字倾斜45度
      margin: 20 // 增加文字与轴线的距离
@ -56,6 +56,10 @@ const option = {
        color: "#CBF2FA" // 文字颜色
      }
    },
+    axisLabel: {
+      fontSize: 20, // 设置 x 轴文字大小
+      color: "#CBF2FA" // 可以同时设置文字颜色
+    },
    type: "value"
  },
  series: [
@ -63,14 +67,14 @@ const option = {
      name: "岗位种类数",
      type: "line",
      showBackground: true,
-      barWidth: 8,
+      barWidth: 16,
      data: [42, 7, 15],
      // 设置柱状图的数值
      label: {
        show: true,
        position: "top",
        color: "#30DCFF",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
@ -91,14 +95,14 @@ const option = {
      name: "岗位人员数",
      type: "line",
      showBackground: true,
-      barWidth: 8,
+      barWidth: 16,
      data: [10230, 4509, 3201],
      // 设置柱状图的数值
      label: {
        show: true,
        position: "top",
        color: "#CBF2FA",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
--- a/src/views/recruitment/card/EnterpriseEmploymentTwo.vue
+++ b/src/views/recruitment/card/EnterpriseEmploymentTwo.vue
@ -14,7 +14,7 @@ const option = {
    top: "15%",
    left: "15%",
    right: "5%",
-    bottom: "20%"
+    bottom: "15%"
  },
  // 设置图例
  legend: {
@ -34,7 +34,7 @@ const option = {
      }
    },
    axisLabel: {
-      fontSize: 14, // 设置 x 轴文字大小
+      fontSize: 22, // 设置 x 轴文字大小
      color: "#CBF2FA", // 可以同时设置文字颜色
      rotate: 20, // 文字倾斜45度
      margin: 20 // 增加文字与轴线的距离
@ -56,6 +56,10 @@ const option = {
        color: "#CBF2FA" // 文字颜色
      }
    },
+    axisLabel: {
+      fontSize: 20, // 设置 x 轴文字大小
+      color: "#CBF2FA" // 可以同时设置文字颜色
+    },
    type: "value"
  },
  series: [
@ -70,7 +74,7 @@ const option = {
        show: true,
        position: "top",
        color: "#30DCFF",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
@ -98,7 +102,7 @@ const option = {
        show: true,
        position: "top",
        color: "#CBF2FA",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
--- a/src/views/recruitment/card/LaborSystemFour.vue
+++ b/src/views/recruitment/card/LaborSystemFour.vue
@ -29,7 +29,7 @@ const option = {
      }
    },
    axisLabel: {
-      fontSize: 14, // 设置 x 轴文字大小
+      fontSize: 22, // 设置 x 轴文字大小
      color: "#CBF2FA", // 可以同时设置文字颜色
      rotate: 30, // 文字倾斜45度
      margin: 20 // 增加文字与轴线的距离
@ -64,6 +64,10 @@ const option = {
        color: "#CBF2FA" // 文字颜色
      }
    },
+    axisLabel: {
+      fontSize: 20, // 设置 x 轴文字大小
+      color: "#CBF2FA" // 可以同时设置文字颜色
+    },
    type: "value"
  },
  series: [
@ -78,7 +82,7 @@ const option = {
        show: true,
        position: "top",
        color: "#30DCFF",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
--- a/src/views/recruitment/card/LaborSystemOne.vue
+++ b/src/views/recruitment/card/LaborSystemOne.vue
@ -34,7 +34,7 @@ const option = {
      textStyle: {
        color: "#CBF2FA"
      },
-      fontSize: 14, // 设置 x 轴文字大小
+      fontSize: 22, // 设置 x 轴文字大小
      color: "#CBF2FA" // 可以同时设置文字颜色
    }
  },
@ -51,6 +51,13 @@ const option = {
      lineStyle: {
        color: "#CBF2FA" // 文字颜色
      }
+    },
+    axisLabel: {
+      textStyle: {
+        color: "#CBF2FA"
+      },
+      fontSize: 22, // 设置 x 轴文字大小
+      color: "#CBF2FA" // 可以同时设置文字颜色
    }
  },
  // color: ["#fff"],
@ -65,7 +72,7 @@ const option = {
        show: true,
        position: "top",
        color: "#30DCFF",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
--- a/src/views/recruitment/card/LaborSystemThree.vue
+++ b/src/views/recruitment/card/LaborSystemThree.vue
@ -29,7 +29,7 @@ const option = {
      }
    },
    axisLabel: {
-      fontSize: 14, // 设置 x 轴文字大小
+      fontSize: 22, // 设置 x 轴文字大小
      color: "#CBF2FA", // 可以同时设置文字颜色
      rotate: 30, // 文字倾斜45度
      margin: 20 // 增加文字与轴线的距离
@ -64,6 +64,10 @@ const option = {
        color: "#CBF2FA" // 文字颜色
      }
    },
+    axisLabel: {
+      fontSize: 20, // 设置 x 轴文字大小
+      color: "#CBF2FA" // 可以同时设置文字颜色
+    },
    type: "value"
  },
  series: [
@ -78,7 +82,7 @@ const option = {
        show: true,
        position: "top",
        color: "#30DCFF",
-        fontSize: 16
+        fontSize: 22
      },
      itemStyle: {
        //渐变色
--- a/src/views/recruitment/card/LaborSystemTwo.vue
+++ b/src/views/recruitment/card/LaborSystemTwo.vue
@ -71,13 +71,13 @@ let option = {
      itemStyle: {
        normal: {
          color: "#121516",
-          borderColor: "#3a6c80", // 地图区域描边颜色
-          borderWidth: 1 // 地图区域描边宽度
+          borderColor: "#30DCFF", // 地图区域描边颜色
+          borderWidth: 2 // 地图区域描边宽度
        },
        emphasis: {
          color: "#2d5565", // 鼠标悬停时的地图填充颜色
          borderColor: "#30DCFF", // 地图区域描边颜色
-          borderWidth: 1 // 地图区域描边宽度
+          borderWidth: 2 // 地图区域描边宽度
        }
      }
    }
@ -91,7 +91,7 @@ let option = {
      symbolSize: function (val) {
        // 根据数值大小动态调整点的大小
        // return val[2] / 6;
-        return 30;
+        return 50;
      },
      label: {
        show: false, // 改为 true 显示标签
--- a/src/views/recruitment/card/NetworkMap.vue
+++ b/src/views/recruitment/card/NetworkMap.vue
@ -52,25 +52,25 @@ let option = {
      label: {
        show: true,
        color: "#fff",
-        fontSize: 12,
+        fontSize: 20,
        fontWeight: "bold",
        emphasis: {
          show: true, // 确保悬停时标签显示
          color: "#ffff00", // 鼠标悬停时的文字颜色
-          fontSize: 14, // 鼠标悬停时的文字大小
+          fontSize: 20, // 鼠标悬停时的文字大小
          fontWeight: "bold" // 鼠标悬停时的文字粗细
        }
      },
      itemStyle: {
        normal: {
          color: "#121516",
-          borderColor: "#3a6c80", // 地图区域描边颜色
-          borderWidth: 1 // 地图区域描边宽度
+          borderColor: "#30DCFF", // 地图区域描边颜色
+          borderWidth: 2 // 地图区域描边宽度
        },
        emphasis: {
          color: "#2d5565", // 鼠标悬停时的地图填充颜色
          borderColor: "#30DCFF", // 地图区域描边颜色
-          borderWidth: 1 // 地图区域描边宽度
+          borderWidth: 2 // 地图区域描边宽度
        }
      }
    }
@ -83,7 +83,8 @@ let option = {
      data: initialPoints,
      symbolSize: function (val) {
        // 根据数值大小动态调整点的大小
-        return val[2] / 6;
+        // return val[2] / 6;
+        return 50;
      },
      label: {
        show: false,