| | |
| | | /** |
| | | * CNumberValve |
| | | * 数值滑块组件,用于在表单中通过滑块选择数值 |
| | | * 提供了滑动条和增减按钮两种方式来调整数值 |
| | | * 支持设置数值范围、步长和单位显示 |
| | | * @author Tevin |
| | | */ |
| | | |
| | |
| | | @touchstart="evt => handleTouchStart()" |
| | | @touchmove="evt => handleTouchMove(evt)" |
| | | ></view> |
| | | <view class="current"><text class="text">{{current}}</text></view> |
| | | <view class="current"> |
| | | <text |
| | | class="text m-text-ignore" |
| | | v-if="current===''" |
| | | >(请拖动)</text> |
| | | <text |
| | | class="text" |
| | | v-else |
| | | >{{current}}</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="btn"> |
| | |
| | | return { |
| | | opened: false, |
| | | rect: { width: 0, left: 0 }, |
| | | current: 0, |
| | | current: '', |
| | | sliderLeft: 0, |
| | | }; |
| | | }, |
| | | computed: { |
| | | valueStr() { |
| | | if (this.itemRes.formData[this.itemRes.name]) { |
| | | if ( |
| | | this.itemRes.formData[this.itemRes.name] || |
| | | this.itemRes.formData[this.itemRes.name] === 0 |
| | | ) { |
| | | return this.itemRes.formData[this.itemRes.name] + ' ' + this.unit; |
| | | } else { |
| | | return ''; |
| | |
| | | currentNext = Math.min(currentNext, this.range[1]); |
| | | // 设置 |
| | | const sliderLeft = Math.round( |
| | | ((currentNext - this.range[0]) / (this.range[1] - this.range[0])) * 100 |
| | | ((currentNext - this.range[0]) / (this.range[1] - this.range[0])) * 100, |
| | | ); |
| | | this.sliderLeft = sliderLeft; |
| | | this.current = currentNext; |