main.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <template>
  2. <view class="step-model"
  3. :class="[small?'step-model-small':'',disabled&&disablesStyle?'step-disabled':'','step-modal-'+type]"
  4. >
  5. <view class="step-control center"
  6. :style="{color: color}"
  7. :class="[small?'step-control-small':'',(disabled||showValue<=minValue)&&disablesStyle?'step-disabled':'']"
  8. @click="reduce"
  9. >
  10. <text class="iconfont iconfont-sign"></text>
  11. </view>
  12. <input
  13. type="number"
  14. class="step-input"
  15. :class="[small?'step-input-small':'',disabled&&disablesStyle?'step-disabled-input':'']"
  16. :value="showValue"
  17. @blur="blur"
  18. :disabled="disabled || showValue>=maxValue && showValue<=minValue"
  19. :style="{color: textColor || color}"
  20. />
  21. <view class="step-control center"
  22. :style="{color: color}"
  23. :class="[small?'step-control-small':'',(disabled||showValue>=maxValue)&&disablesStyle?'step-disabled':'']"
  24. @click="add">
  25. <text class="iconfont iconfont-puls"></text>
  26. </view>
  27. </view>
  28. </template>
  29. <script>
  30. import mixins from './mixins';
  31. import props from "./props";
  32. export default {
  33. name: "v-step",
  34. mixins,
  35. props
  36. }
  37. </script>
  38. <style scoped lang="scss" src="./style.scss"></style>