svg渲染问题

commandCenter/src/views/financialAnalysis/smallModuleIndex/circle.vue

@@ -86,7 +86,7 @@ export default {
                 'stroke-dasharray': `${this.len}px ${this.len}px`,
                 // eslint-disable-next-line prettier/prettier
                 'stroke-dashoffset': `${((100 - this.percent) / 100) * this.len}px`, // 动画占圆周长百分比
-                transition: 'stroke-dashoffset 1s ease' // 2s代表动画时间
+                transition: 'stroke-dashoffset 1s ease-in-out' // 2s代表动画时间
             };
         }
     }

commandCenter/src/views/financialAnalysis/smallModuleIndex/collectionRate.vue

@@ -24,7 +24,7 @@
                 :strokeWidth="strokeWidth"
                 :trailWidth="trailWidth"
                 :trailColor="trailColor"
-                :percent="dataObj.receivedAmount"
+                :percent="dataObj.receivableAmount == 0 ? 0 : 100 / (dataObj.receivableAmount / dataObj.receivedAmount)"
             >
                 <span class="ashText" style="font-size: 14px">收款率</span>
                 <span> {{ dataObj.collectionRate }}</span>

operationSupport/src/views/newWorkBench/components/circle.vue

@@ -58,7 +58,7 @@ export default {
             // 圆大小半径
             type: Number,
             default: 60
-        }
+        },
     },
     computed: {
         svgStyle() {
@@ -82,11 +82,12 @@ export default {
             return Math.PI * 2 * this.radius;
         },
         pathStyle() {
+            debugger;
             return {
                 'stroke-dasharray': `${this.len}px ${this.len}px`,
                 // eslint-disable-next-line prettier/prettier
                 'stroke-dashoffset': `${((100 - this.percent) / 100) * this.len}px`, // 动画占圆周长百分比
-                transition: 'stroke-dashoffset 1s ease' // 2s代表动画时间
+                transition: 'stroke-dashoffset 1s ease-in-out' // 2s代表动画时间
             };
         }
     }

operationSupport/src/views/newWorkBench/components/collectionRate.vue

@@ -32,7 +32,7 @@
                     :strokeColor="strokeColor"
                     :trailWidth="trailWidth"
                     :trailColor="trailColor"
-                    :percent="dataObj.receivedAmount"
+                    :percent="dataObj.receivableAmount == 0 ? 0 : 100 / (dataObj.receivableAmount / dataObj.receivedAmount)"
                 >
                     <span class="ashText" style="font-size: 14px">收款率</span>
                     <span> {{ dataObj.collectionRate }}</span>