增加窗口监听

src/views/growth/growthRoadmap.vue

@@ -4,7 +4,7 @@
       style="width: 100%; height: 290px"
       src="@/assets/image/growth/bg.png"
     />
-    <div class="nav" >
+    <div class="nav"  :style="{transform:'scale('+ transformSize + ')'}">
       <div class="tabs">
         <div
           class="tabs-item"
@@ -282,7 +282,7 @@
   </div>
 </template>
 <script setup>
-import { computed, onMounted, ref, watch, reactive } from "vue";
+import { computed, onMounted,onUnmounted, ref, watch, reactive } from "vue";
 import { ElMessage } from "element-plus";
 import { request } from "@/api/request";
 import { growthRequest } from "@/api/growthRequest";
@@ -409,11 +409,11 @@ const stateData = computed(() => {
 
 // 储存屏幕宽
 const windowWidth = ref(0);
-const transformSize = ref(0.8);
+const transformSize = ref(1);
 
 const updateWindowWidth = () =>  {
     windowWidth.value = window.innerWidth;
-    transformSize.value = windowWidth.value / 1920
+    transformSize.value = windowWidth.value / 1920;
 }
 // 样式类型
 const templateClick = () => {
@@ -479,16 +479,17 @@ const select = (item) => {
 };
 onMounted(() => {
   updateWindowWidth(); // 初始化宽度
-  window.addEventListener('resize', updateWindowWidth());
+  window.addEventListener('resize', updateWindowWidth);
   dispatch("getGrowthInfo", { routerId });
   getList();
   growthRequest(PROFESSIONAL_STUDENT_LIST).then((res) => {
     growthList.value = res.data;
   });
 });
-// unMounted(() =>{ // Vue 3.x 使用 unmounted
-//   window.removeEventListener('resize', updateWindowWidth());
-// }),
+// 在组件卸载时移除事件监听器
+onUnmounted(() => {
+  window.removeEventListener('resize', updateWindowWidth);
+});
 watch(
   () => state.growthInfo,
   (val) => {
@@ -780,6 +781,7 @@ function toOffcoursePlanPage(id) {
     height: 80px;
     background: #ffffff;
     padding: 0 80px 0 62px;
+    transform-origin: top left;
   }
   .growth-name-type {
     display: flex;