@gizwits/vantui/lib/number-item/index.js

机智云组件库

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.NumberItem = NumberItem;
exports.default = void 0;
var _components = require("@tarojs/components");
var _styles = require("../utils/styles");
var _icon = require("../icon");
var _slider = require("../slider");
var _jsxRuntime = require("react/jsx-runtime");
var defaultIcon = 'https://goms-1251025085.cos.ap-guangzhou.myqcloud.com/%E8%B6%85%E8%B5%9B%E6%A8%A1%E7%89%88%E7%BC%96%E8%BE%91%E5%99%A8/setting.png';
function NumberItem(props) {
  var icon = props.icon,
    title = props.title,
    value = props.value,
    _onChange = props.onChange,
    min = props.min,
    max = props.max,
    step = props.step,
    unit = props.unit;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.View, {
    style: styles.container,
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.View, {
      style: styles.l1,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.Icon, {
        name: icon !== null && icon !== void 0 ? icon : defaultIcon,
        size: 48
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Text, {
        style: {
          marginLeft: 8
        },
        children: title
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Text, {
        style: {
          color: '#418AF3',
          marginLeft: 8
        },
        children: value
      }), unit && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Text, {
        style: {
          marginLeft: 8
        },
        children: unit
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.View, {
      style: styles.sliderWapper,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_slider.Slider, {
        barHeight: '10px',
        activeColor: '#418AF3',
        value: value,
        min: min,
        max: max,
        step: step !== null && step !== void 0 ? step : 1,
        onChange: function onChange(e) {
          _onChange(e.detail);
        }
      })
    })]
  });
}
var _default = NumberItem;
exports.default = _default;
var styles = (0, _styles.createStyles)({
  container: {
    height: 80,
    width: '100%',
    display: 'flex',
    backgroundColor: '#fff',
    borderRadius: 4,
    flexDirection: 'column',
    justifyContent: 'space-evenly'
  },
  l1: {
    width: '100%',
    height: 20,
    display: 'flex',
    flexDirection: 'row',
    alignItems: 'center',
    marginLeft: 8,
    marginTop: 4
  },
  sliderWapper: {
    width: '92%',
    marginLeft: '4%'
  }
});