v1.0

uni_modules/uv-slider/changelog.md

@@ -0,0 +1,9 @@
+## 1.0.3（2023-07-25）
+1. 将inactiveColor修正为backgroundColor 参数，避免不生效
+## 1.0.2（2023-07-13）
+1.  修复 uv-slider设置value属性不生效的BUG 
+## 1.0.1（2023-05-16）
+1. 优化组件依赖，修改后无需全局引入，组件导入即可使用
+2. 优化部分功能
+## 1.0.0（2023-05-10）
+uv-slider 滑动选择器

uni_modules/uv-slider/components/uv-slider/props.js

@@ -0,0 +1,58 @@
+export default {
+	props: {
+		value: {
+			type: [Number, String],
+			default: 0
+		},
+		modelValue: {
+			type: [Number, String],
+			default: 0
+		},
+		// 最小可选值
+		min: {
+			type: [Number, String],
+			default: 0
+		},
+		// 最大可选值
+		max: {
+			type: [Number, String],
+			default: 100
+		},
+		// 步长，取值必须大于 0，并且可被(max - min)整除
+		step: {
+			type: [Number, String],
+			default: 1
+		},
+		// 滑块右侧已选择部分的背景色
+		activeColor: {
+			type: String,
+			default: '#2979ff'
+		},
+		// 滑块左侧未选择部分的背景色
+		backgroundColor: {
+			type: String,
+			default: '#c0c4cc'
+		},
+		// 滑块的大小，取值范围为 12 - 28
+		blockSize: {
+			type: [Number, String],
+			default: 18
+		},
+		// 滑块的颜色
+		blockColor: {
+			type: String,
+			default: '#ffffff'
+		},
+		// 禁用状态
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		// 是否显示当前的选择值
+		showValue: {
+			type: Boolean,
+			default: false
+		},
+		...uni.$uv?.props?.slider
+	}
+}

uni_modules/uv-slider/components/uv-slider/uv-slider.vue

@@ -0,0 +1,58 @@
+<template>
+	<view
+		class="uv-slider"
+		:style="[$uv.addStyle(customStyle)]"
+	>
+		<slider
+			:min="min"
+			:max="max"
+			:step="step"
+			:value="sliderValue"
+			:activeColor="activeColor"
+			:backgroundColor="backgroundColor"
+			:blockSize="$uv.getPx(blockSize)"
+			:blockColor="blockColor"
+			:showValue="showValue"
+			:disabled="disabled"
+			@changing="changingHandler"
+			@change="changeHandler"
+		></slider>
+	</view>
+</template>
+<script>
+	import mpMixin from '@/uni_modules/uv-ui-tools/libs/mixin/mpMixin.js'
+	import mixin from '@/uni_modules/uv-ui-tools/libs/mixin/mixin.js'
+	import props from './props.js'
+	export default {
+		name: 'uv-slider',
+		mixins: [mpMixin, mixin, props],
+		computed: {
+			sliderValue(){
+				return this.value || this.modelValue;
+			}
+		},
+		methods: {
+			// 拖动过程中触发
+			changingHandler(e) {
+				const { value } = e.detail
+				// 更新v-model的值
+				this.$emit('input', value)
+				this.$emit('update:modelValue',value)
+				// 触发事件
+				this.$emit('changing', value)
+			},
+			// 滑动结束时触发
+			changeHandler(e) {
+				const {
+					value
+				} = e.detail
+				// 更新v-model的值
+				this.$emit('input', value)
+				this.$emit('update:modelValue',value)
+				// 触发事件
+				this.$emit('change', value)
+			}
+		}
+	}
+</script>
+

uni_modules/uv-slider/package.json

@@ -0,0 +1,87 @@
+{
+  "id": "uv-slider",
+  "displayName": "uv-slider 滑动选择器 全面兼容vue3+2、app、h5、小程序等多端",
+  "version": "1.0.3",
+  "description": "滑动选择器组件一般用于表单中，手动选择一个区间范围的场景。",
+  "keywords": [
+    "uv-slider",
+    "uvui",
+    "uv-ui",
+    "slider",
+    "滑动选择器"
+],
+  "repository": "",
+  "engines": {
+    "HBuilderX": "^3.1.0"
+  },
+  "dcloudext": {
+    "type": "component-vue",
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+    	"ads": "无",
+    	"data": "插件不采集任何数据",
+    	"permissions": "无"
+    },
+    "npmurl": ""
+  },
+  "uni_modules": {
+    "dependencies": [
+			"uv-ui-tools"
+		],
+    "encrypt": [],
+    "platforms": {
+			"cloud": {
+				"tcb": "y",
+				"aliyun": "y"
+			},
+			"client": {
+				"Vue": {
+					"vue2": "y",
+					"vue3": "y"
+				},
+				"App": {
+					"app-vue": "y",
+					"app-nvue": "y"
+				},
+				"H5-mobile": {
+					"Safari": "y",
+					"Android Browser": "y",
+					"微信浏览器(Android)": "y",
+					"QQ浏览器(Android)": "y"
+				},
+				"H5-pc": {
+					"Chrome": "y",
+					"IE": "y",
+					"Edge": "y",
+					"Firefox": "y",
+					"Safari": "y"
+				},
+				"小程序": {
+					"微信": "y",
+					"阿里": "y",
+					"百度": "y",
+					"字节跳动": "y",
+					"QQ": "y",
+					"钉钉": "u",
+					"快手": "u",
+					"飞书": "u",
+					"京东": "u"
+				},
+				"快应用": {
+					"华为": "u",
+					"联盟": "u"
+				}
+			}
+		}
+  }
+}

uni_modules/uv-slider/readme.md

@@ -0,0 +1,15 @@
+## Slider 滑动选择器
+
+> **组件名：uv-slider**
+
+该组件一般用于表单中，手动选择一个区间范围的场景。
+
+# <a href="https://www.uvui.cn/components/slider.html" target="_blank">查看文档</a>
+
+## [下载完整示例项目](https://ext.dcloud.net.cn/plugin?name=uv-ui)
+
+### [更多插件，请关注uv-ui组件库](https://ext.dcloud.net.cn/plugin?name=uv-ui)
+
+![image](https://mp-a667b617-c5f1-4a2d-9a54-683a67cff588.cdn.bspapp.com/uv-ui/banner.png)
+
+#### 如使用过程中有任何问题反馈，或者您对uv-ui有一些好的建议，欢迎加入uv-ui官方交流群：<a href="https://www.uvui.cn/components/addQQGroup.html" target="_blank">官方QQ群</a>