fix: bug修复

src/views/questionnaire-statistics-new/detail.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, onMounted, reactive, ref, nextTick } from 'vue';
+import { defineComponent, onMounted, reactive, ref, nextTick, onUnmounted } from 'vue';
 import styles from './index.module.less';
 import { List, Popup, DatePicker, Popover, Picker } from 'vant';
 import request from '@/helpers/request';
@@ -51,6 +51,7 @@ export default defineComponent({
       currentClass: "",
       gradeOptionIndex: [] as any,
       gradeContent: null as any,
+      intervalOne: null as any, // 动画定时器
     });
 
     // 获取学校信息
@@ -155,16 +156,24 @@ export default defineComponent({
       queryList()
       nextTick(() => {
         let percentage = 0;
-        const interval = setInterval(() => {
+        state.intervalOne = setInterval(() => {
           if (percentage <= state.schoolInfo.supportStudentRate) {
+            // console.log(percentage,state.schoolInfo.supportStudentRate)
             drawCircle('circle1', 1, percentage)
           }
           if (percentage <= state.schoolInfo.participationStudentRate) {
             drawCircle('circle2', 2, percentage)
           }
-          percentage += 2; // 每次增加1%
+          if (percentage === Math.floor(Number(state.schoolInfo.supportStudentRate))) {
+            drawCircle('circle1', 1, state.schoolInfo.supportStudentRate)
+          }
+          if (percentage === Math.floor(Number(state.schoolInfo.participationStudentRate))) {
+            drawCircle('circle2', 2, state.schoolInfo.participationStudentRate)
+          }
+          percentage += 1; // 每次增加1%
           if (percentage > Math.max(state.schoolInfo.supportStudentRate, state.schoolInfo.participationStudentRate)) {
-            clearInterval(interval); // 停止定时器
+            clearInterval(state.intervalOne); // 停止定时器
+            state.intervalOne = null;
           }
         }, 25); // 每25ms更新一次
       });
@@ -172,6 +181,10 @@ export default defineComponent({
     onMounted(async () => {
       initData()
     });
+    onUnmounted(() => {
+      clearInterval(state.intervalOne); // 停止定时器
+      state.intervalOne = null;
+    });
 
     return () => (
       <OFullRefresh

src/views/questionnaire-statistics-new/drawGraph.ts

@@ -20,13 +20,15 @@ export const drawCircle = (domId: string, type: number, rateNum: number) => {
     // 圆环的设置
     const radius = 35; // 圆环半径
     const lineWidth = 8; // 圆环的宽度
-
+    canvas.width = 85
+    canvas.height = 85
+    // console.log('画布尺寸',canvas.width,canvas.height)
     // 圆心坐标
     const centerX = canvas.width / 2;
     const centerY = canvas.height / 2;
 
         // 获取设备像素比
-        const dpr = 1 || window.devicePixelRatio;
+        const dpr = window.devicePixelRatio || 1;
 
         // 设置 canvas 的物理尺寸
         const width = canvas.width;

src/views/questionnaire-statistics-new/index.module.less

@@ -201,7 +201,8 @@
     font-size: 12px;
     color: #333333;
     padding: 0 8px;
-    margin-right: 10px;
+    margin-right: 6px;
+    box-sizing: content-box;
     >span {
       word-break: keep-all;
     }
@@ -505,7 +506,7 @@
       content: "";
       position: absolute;
       right: 0;
-      top: 0;
+      top: 6px;
       width: 1px;
       height: 43px;
       background: url('./images/ns_line.png') no-repeat center;
@@ -559,6 +560,11 @@
         text-align: center;
         font-size: 12px;
         word-break: keep-all;
+        color: #777777;
+      }
+      canvas {
+        width: 75px;
+        height: 75px;
       }
     }
   }

src/views/questionnaire-statistics-new/index.tsx

@@ -1,4 +1,4 @@
-import { defineComponent, onMounted, reactive, ref, nextTick } from 'vue';
+import { defineComponent, onMounted, reactive, ref, nextTick, onUnmounted } from 'vue';
 import styles from './index.module.less';
 import { List, Popup, DatePicker, Popover, Field, Picker, } from 'vant';
 import request from '@/helpers/request';
@@ -103,16 +103,24 @@ export default defineComponent({
         forms.totalInfo = res.data|| {}
         nextTick(() => {
           let percentage = 0;
-          const interval = setInterval(() => {
+          state.intervalOne = setInterval(() => {
             if (percentage <= forms.totalInfo.supportRate) {
+              // console.log(percentage,forms.totalInfo.supportRate)
               drawCircle('circle1', 1, percentage)
             }
             if (percentage <= forms.totalInfo.participationRate) {
               drawCircle('circle2', 2, percentage)
             }
-            percentage += 2; // 每次增加1%
+            if (percentage === Math.floor(Number(forms.totalInfo.supportRate))) {
+              drawCircle('circle1', 1, forms.totalInfo.supportRate)
+            }
+            if (percentage === Math.floor(Number(forms.totalInfo.participationRate))) {
+              drawCircle('circle2', 2, forms.totalInfo.participationRate)
+            }
+            percentage += 1; // 每次增加1%
             if (percentage > Math.max(forms.totalInfo.supportRate, forms.totalInfo.participationRate)) {
-              clearInterval(interval); // 停止定时器
+              clearInterval(state.intervalOne); // 停止定时器
+              state.intervalOne = null;
             }
           }, 25); // 每25ms更新一次
         });
@@ -151,11 +159,12 @@ export default defineComponent({
     const state = reactive({
       saveLoading: false,
       image: null as any,
-      shareLoading: false
+      shareLoading: false,
+      intervalOne: null as any,
     });
 
     const skipDetail = (id: any) => {
-      sessionStorage.setItem('areaIdx', forms.areaIdx)
+      // sessionStorage.setItem('areaIdx', forms.areaIdx)
       sessionStorage.setItem('qsFilterParams', JSON.stringify({
         schoolName: forms.schoolName,
         sortType: forms.sortType,
@@ -204,6 +213,7 @@ export default defineComponent({
 
     const onRefresh = async () => {
       console.log('刷新111')
+      forms.areaColumns = []
       finished.value = false;
       // 重新加载数据
       // 将 loading 设置为 true，表示处于加载状态
@@ -226,6 +236,11 @@ export default defineComponent({
       });
     });
 
+    onUnmounted(() => {
+      clearInterval(state.intervalOne); // 停止定时器
+      state.intervalOne = null;
+    });
+
     return () => (
       <OFullRefresh
       v-model:modelValue={refreshing.value}
@@ -344,7 +359,7 @@ export default defineComponent({
                 <ul class={styles.itemContent}>
                   <li>
                     <div class={styles.icTop}>
-                      <span class={styles.sRed}>{formatNumberWithComma(item.supportNum || 0)}</span><i>人</i>
+                      <span class={styles.sBlue}>{formatNumberWithComma(item.supportNum || 0)}</span><i>人</i>
                     </div>
                     <p>支持开展</p>
                   </li>
@@ -404,6 +419,7 @@ export default defineComponent({
                 forms.areaStatus = false;
                 forms.schoolName = '';
                 forms.currentAreaInfo = forms.areaList[val.selectedOptions[0].value]
+                sessionStorage.setItem('areaIdx', forms.areaIdx)
                 queryInfo()
                 getList()
                 console.log('选择1111',val,forms.areaOptionIndex)

src/views/questionnaire-statistics/index.tsx

@@ -140,7 +140,7 @@ export default defineComponent({
     });
 
     const skipDetail = (id: any) => {
-      sessionStorage.setItem('areaIdx', forms.areaIdx)
+      // sessionStorage.setItem('areaIdx', forms.areaIdx)
       sessionStorage.setItem('yqsFilterParams', JSON.stringify({
         schoolName: forms.schoolName,
         sortType: forms.sortType,
@@ -189,6 +189,7 @@ export default defineComponent({
 
     const onRefresh = async () => {
       console.log('刷新111')
+      forms.areaColumns = []
       finished.value = false;
       // 重新加载数据
       // 将 loading 设置为 true，表示处于加载状态
@@ -374,6 +375,7 @@ export default defineComponent({
                 forms.areaStatus = false;
                 forms.schoolName = '';
                 forms.currentAreaInfo = forms.areaList[val.selectedOptions[0].value]
+                sessionStorage.setItem('areaIdx', forms.areaIdx)
                 queryInfo()
                 getList()
                 console.log('选择1111',val,forms.areaOptionIndex)