修改数字滚动

package-lock.json

@@ -79,11 +79,6 @@
         "fastq": "^1.6.0"
       }
     },
-    "@popperjs/core": {
-      "version": "npm:@sxzz/popperjs-es@2.11.7",
-      "resolved": "https://registry.npmmirror.com/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz",
-      "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ=="
-    },
     "@rollup/pluginutils": {
       "version": "5.0.2",
       "resolved": "https://registry.npmmirror.com/@rollup/pluginutils/-/pluginutils-5.0.2.tgz",
@@ -349,6 +344,11 @@
         "delayed-stream": "~1.0.0"
       }
     },
+    "core-js": {
+      "version": "3.33.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.33.0.tgz",
+      "integrity": "sha512-HoZr92+ZjFEKar5HS6MC776gYslNOKHt75mEBKWKnPeFDpZ6nH5OeF3S6HFT1mUAUZKrzkez05VboaX8myjSuw=="
+    },
     "csstype": {
       "version": "2.6.20",
       "resolved": "https://registry.npmmirror.com/csstype/-/csstype-2.6.20.tgz",
@@ -402,6 +402,13 @@
         "lodash-unified": "^1.0.2",
         "memoize-one": "^6.0.0",
         "normalize-wheel-es": "^1.2.0"
+      },
+      "dependencies": {
+        "@popperjs/core": {
+          "version": "npm:@sxzz/popperjs-es@2.11.7",
+          "resolved": "https://registry.npmjs.org/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz",
+          "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ=="
+        }
       }
     },
     "emojis-list": {
@@ -1192,11 +1199,25 @@
         "@vue/shared": "3.2.37"
       }
     },
+    "vue-count-to": {
+      "version": "1.0.13",
+      "resolved": "https://registry.npmjs.org/vue-count-to/-/vue-count-to-1.0.13.tgz",
+      "integrity": "sha512-6R4OVBVNtQTlcbXu6SJ8ENR35M2/CdWt3Jmv57jOUM+1ojiFmjVGvZPH8DfHpMDSA+ITs+EW5V6qthADxeyYOQ=="
+    },
     "vue-demi": {
       "version": "0.14.5",
       "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.5.tgz",
       "integrity": "sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA=="
     },
+    "vue3-count-to": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vue3-count-to/-/vue3-count-to-1.1.2.tgz",
+      "integrity": "sha512-C5AvlcGfyM4XvFqPDkni94rqGd5K/+RB+B4xv/1NQx3RrdC+GvXPFzeXW5hWL/jh8ehWLm4LITyK0eMKf4iJbg==",
+      "requires": {
+        "core-js": "^3.8.1",
+        "vue-count-to": "^1.0.13"
+      }
+    },
     "vue3-video-play": {
       "version": "1.3.1-beta.6",
       "resolved": "https://registry.npmmirror.com/vue3-video-play/-/vue3-video-play-1.3.1-beta.6.tgz",

package.json

@@ -15,6 +15,7 @@
     "leader-line": "^1.0.7",
     "postcss-pxtorem": "^6.0.0",
     "vue": "^3.2.25",
+    "vue3-count-to": "^1.1.2",
     "vue3-video-play": "^1.3.1-beta.6"
   },
   "devDependencies": {

src/components/CircleProgress.vue

@@ -2,7 +2,8 @@
     <div>
         <div class="number" v-if="textPosition == 'top'">
             <ul class="flex">
-                <ScrollNum v-for="(num, idx) of numArr" :key="idx" as="li" :i="num" :delay="idx + 1" />
+                <!-- <ScrollNum v-for="(num, idx) of numArr" :key="idx" as="li" :i="num" :delay="idx + 1" /> -->
+                <count-to :useEasing="false" style="font-size: 0.08rem;"  :startVal='1' :endVal='targetValue' :duration='2000'></count-to>
                 <span>个</span>
             </ul>
         </div>
@@ -21,7 +22,8 @@
 
     <div class="bottomNumber" v-if="textPosition == 'bottom'">
         <ul class="flex">
-            <ScrollNum v-for="(num, idx) of numArr" :key="idx" as="li" :i="num" :delay="idx + 1" />
+            <!-- <ScrollNum v-for="(num, idx) of numArr" :key="idx" as="li" :i="num" :delay="idx + 1" /> -->
+            <count-to :useEasing="false" style="font-size: 0.08rem;"  :startVal='1' :endVal='targetValue' :duration='2000'></count-to>
             <span> (人)</span>
         </ul>
 
@@ -29,7 +31,8 @@
 </template>
 <script setup lang="ts">
 import { ref, computed, toRefs, watch, onMounted } from 'vue';
-import ScrollNum from './roll.vue'
+import ScrollNum from './roll.vue';
+import { CountTo } from 'vue3-count-to';
 
 const props = defineProps({
     targetValue: {

src/components/home.vue

@@ -183,7 +183,9 @@ export default ({
             }
             clickData.value = json;
             if (json.deviceCode) {
-                getClassDetail(json.deviceCode).then(res => {
+                console.log('sadasd',json.deviceCode);
+                let replacedStr = json.deviceCode.replace("/", "A");
+                getClassDetail(replacedStr).then(res => {
                     classDeviceInfo.value = res.data;
                     classDeviceInfo.value.map(i => {
                         if (i.value == "在线") {