index.jsx 1.3 KB

123456789101112131415161718192021222324252627282930313233343536
  1. import BasicNumber from '../../basic/number'
  2. import { useFormInput } from '@cip/components/hooks/form-input'
  3. import { formInputProps, fromInputEmits } from '../../form-input-props'
  4. import { useRange } from './use-range'
  5. import './index.less'
  6. export default {
  7. props: formInputProps,
  8. emits: [...fromInputEmits],
  9. setup (props, context) {
  10. const { width, securityConfig, proxyValue, proxyOtherValue } = useFormInput(props, context, { maxOtherKey: 1 })
  11. const { min, max, joint } = useRange(props)
  12. // range组件下放values会导致otherValue被modelValue覆盖掉
  13. const { modelValue, otherValue, values, ...otherProps } = props
  14. return () => <div class={'extension-number-range'} style={{ width: width.value }}>
  15. <BasicNumber
  16. {...otherProps}
  17. v-model={proxyValue.value}
  18. config={{
  19. ...securityConfig.value,
  20. max: max.value,
  21. placeholder: securityConfig.value.startPlaceholder
  22. }}
  23. />
  24. <span class={'extension-number-range__joint'}>{joint.value}</span>
  25. <BasicNumber
  26. {...otherProps}
  27. v-model={proxyOtherValue[0].value}
  28. config={{
  29. ...securityConfig.value,
  30. min: min.value,
  31. placeholder: securityConfig.value.endPlaceholder
  32. }}
  33. />
  34. </div>
  35. }
  36. }