sh-view 2.7.6 → 2.7.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sh-view",
-  "version": "2.7.6",
+  "version": "2.7.7",
   "description": "基于vxe-table二次封装",
   "main": "packages/index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "babel-polyfill": "^6.26.0",
     "codemirror": "^6.0.1",
     "core-js": "^3.32.2",
-    "countup.js": "^1.9.3",
+    "countup.js": "^2.8.0",
     "cron-parser": "^4.8.1",
     "docx-preview": "^0.1.18",
     "exceljs": "^4.3.0",

package/packages/components/global-components/sh-count-to/index.vue

@@ -7,8 +7,8 @@
 </template>
 
 <script>
-import { defineComponent, ref, watch, onMounted, onUnmounted } from 'vue'
-import * as CountUpJs from 'countup.js'
+import { defineComponent, ref, watch, onMounted, onUnmounted, computed } from 'vue'
+import { CountUp } from 'countup.js'
 export default defineComponent({
 	name: 'ShCountTo',
 	props: {
@@ -19,10 +19,6 @@ export default defineComponent({
 		end: {
 			type: Number
 		},
-		decimals: {
-			type: Number,
-			default: 0
-		},
 		duration: {
 			type: Number,
 			default: 2
@@ -42,54 +38,74 @@ export default defineComponent({
 		}
 	},
 	setup(props, context) {
-		const countUp = ref(null)
+		let countUp = null
 		const countRef = ref()
 
+		const countOptions = computed(() => {
+			return Object.assign(
+				{
+					startVal: props.start, // 开始的数字  一般设置0开始
+					decimalPlaces: 0, // number类型 小数位，整数自动添.00
+					duration: props.duration, // number类型 动画延迟秒数，默认值是2
+					useGrouping: true, // boolean类型  是否开启逗号，默认true(1,000)false(1000)
+					useEasing: true, // booleanl类型 动画缓动效果(ease),默认true
+					smartEasingThreshold: 500, // numberl类型 大于这个数值的值开启平滑缓动
+					smartEasingAmount: 300, // numberl类型
+					separator: ',', // string 类型 分割用的符号
+					decimal: '.', // string 类型  小数分割符合
+					prefix: '', // sttring 类型  数字开头添加固定字符
+					suffix: '', // sttring类型 数字末尾添加固定字符
+					numerals: [] // Array类型 替换从0到9对应的字，也就是自定数字字符了,数组存储
+				},
+				props.options
+			)
+		})
+
 		watch(
 			() => props.end,
 			value => {
-				if (countUp.value && countUp.value.update) {
-					countUp.value.update(value)
+				if (countUp && countUp.update) {
+					countUp.update(value)
 				}
 			}
 		)
 
 		const init = () => {
-			if (!countUp.value) {
-				countUp.value = new CountUpJs(countRef.value, props.start, props.end, props.decimals, props.duration, props.options)
-				countUp.value.start(() => {
-					props.callback(countUp.value)
+			if (!countUp) {
+				countUp = new CountUp(countRef.value, props.end, countOptions.value)
+				countUp.start(() => {
+					props.callback(countUp)
 				})
 			}
 		}
 
 		const destroy = () => {
-			countUp.value = null
+			countUp = null
 		}
 
-		const start = callback => {
-			if (countUp.value && countUp.value.start) {
-				countUp.value.start(() => {
-					callback && callback(countUp.value)
+		const countStart = callback => {
+			if (countUp && countUp.start) {
+				countUp.start(() => {
+					callback && callback(countUp)
 				})
 			}
 		}
 
-		const pauseResume = () => {
-			if (countUp.value && countUp.value.pauseResume) {
-				countUp.value.pauseResume()
+		const countPause = () => {
+			if (countUp && countUp.pauseResume) {
+				countUp.pauseResume()
 			}
 		}
 
-		const reset = () => {
-			if (countUp.value && countUp.value.reset) {
-				countUp.value.reset()
+		const countReset = () => {
+			if (countUp && countUp.reset) {
+				countUp.reset()
 			}
 		}
 
-		const updated = newEndVal => {
-			if (countUp.value && countUp.value.update) {
-				countUp.value.update(newEndVal)
+		const countUpdate = newEndVal => {
+			if (countUp && countUp.update) {
+				countUp.update(newEndVal)
 			}
 		}
 
@@ -102,7 +118,11 @@ export default defineComponent({
 		})
 
 		return {
-			countRef
+			countRef,
+			countStart,
+			countPause,
+			countReset,
+			countUpdate
 		}
 	}
 })