@antmjs/vantui
Version:
一套适用于Taro3及React的vantui组件库
132 lines • 7.31 kB
JavaScript
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
import { useEffect, useState, useCallback } from 'react';
import { View } from '@tarojs/components';
import classnames from 'classnames';
import { get } from '../default-props';
import { everyItemEqual } from './utils';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var preCls = "van-sku";
export default function Sku(props) {
var _useState = useState(get().Sku),
_useState2 = _slicedToArray(_useState, 1),
d = _useState2[0];
var _d$props = _objectSpread(_objectSpread({}, d), props),
_d$props$sku = _d$props.sku,
sku = _d$props$sku === void 0 ? [] : _d$props$sku,
_d$props$className = _d$props.className,
className = _d$props$className === void 0 ? '' : _d$props$className,
_d$props$goodsList = _d$props.goodsList,
goodsList = _d$props$goodsList === void 0 ? [] : _d$props$goodsList,
goodsId = _d$props.goodsId,
onChange = _d$props.onChange,
clickAttrDisable = _d$props.clickAttrDisable,
itemRender = _d$props.itemRender,
_d$props$disabledClas = _d$props.disabledClassName,
disabledClassName = _d$props$disabledClas === void 0 ? '' : _d$props$disabledClas,
_d$props$activeClassN = _d$props.activeClassName,
activeClassName = _d$props$activeClassN === void 0 ? '' : _d$props$activeClassN,
itemDisable = _d$props.itemDisable,
_d$props$autoChoice = _d$props.autoChoice,
autoChoice = _d$props$autoChoice === void 0 ? true : _d$props$autoChoice;
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
currentSkuIds = _useState4[0],
setCurrentSkuIds = _useState4[1];
useEffect(function () {
if (!goodsId && goodsList && autoChoice) {
for (var i = 0; i < goodsList.length; i++) {
var goodsItem = goodsList[i];
if ((goodsItem === null || goodsItem === void 0 ? void 0 : goodsItem.disabled) !== true) {
if (goodsItem !== null && goodsItem !== void 0 && goodsItem.skuIds) setCurrentSkuIds(goodsItem.skuIds);
if (onChange) onChange(goodsItem);
break;
}
}
}
if (goodsId && goodsList) {
for (var _i = 0; _i < goodsList.length; _i++) {
var _goodsItem = goodsList[_i];
if ((_goodsItem === null || _goodsItem === void 0 ? void 0 : _goodsItem.id) === goodsId) {
if (_goodsItem !== null && _goodsItem !== void 0 && _goodsItem.skuIds) setCurrentSkuIds(_goodsItem.skuIds);
break;
}
}
}
},
// eslint-disable-next-line react-hooks/exhaustive-deps
[goodsId, goodsList]);
var currentAttrCanBuy = useCallback(function (attrId, attrs) {
var skuIds = _toConsumableArray(currentSkuIds || []);
attrs.map(function (it) {
if (skuIds.includes(it)) skuIds.splice(skuIds.indexOf(it), 1);
});
skuIds = skuIds.concat(attrId);
var canBuy = false;
for (var i = 0; i < goodsList.length; i++) {
var _goodsList$i, _goodsList$i2, _goodsList$i3;
if ((_goodsList$i = goodsList[i]) !== null && _goodsList$i !== void 0 && _goodsList$i.skuIds && everyItemEqual(((_goodsList$i2 = goodsList[i]) === null || _goodsList$i2 === void 0 ? void 0 : _goodsList$i2.skuIds) || [], skuIds) && !((_goodsList$i3 = goodsList[i]) !== null && _goodsList$i3 !== void 0 && _goodsList$i3.disabled) && ((itemDisable === null || itemDisable === void 0 ? void 0 : itemDisable(goodsList[i])) === false || !itemDisable)) {
canBuy = true;
break;
}
}
return canBuy;
}, [currentSkuIds, goodsList, itemDisable]);
var attrClick = useCallback(function (attrId, attrs, canBuy) {
if (canBuy) {
var skuIds = _toConsumableArray(currentSkuIds || []);
attrs.map(function (it) {
if (skuIds.includes(it)) skuIds.splice(skuIds.indexOf(it), 1);
});
skuIds = skuIds.concat(attrId);
var choiceGoods;
for (var i = 0; i < goodsList.length; i++) {
var _goodsList$i4, _goodsList$i5;
if (!((_goodsList$i4 = goodsList[i]) !== null && _goodsList$i4 !== void 0 && _goodsList$i4.skuIds && !goodsList[i] || ((_goodsList$i5 = goodsList[i]) === null || _goodsList$i5 === void 0 ? void 0 : _goodsList$i5.disabled) === true || itemDisable && itemDisable(goodsList[i]))) {
var _goodsList$i6;
if (everyItemEqual(skuIds, ((_goodsList$i6 = goodsList[i]) === null || _goodsList$i6 === void 0 ? void 0 : _goodsList$i6.skuIds) || [])) {
choiceGoods = goodsList[i];
}
}
}
setCurrentSkuIds(skuIds);
if (choiceGoods) {
onChange === null || onChange === void 0 ? void 0 : onChange(choiceGoods);
}
} else {
if (clickAttrDisable) clickAttrDisable();
}
}, [clickAttrDisable, currentSkuIds, goodsList, itemDisable, onChange]);
return /*#__PURE__*/_jsx(View, {
className: "".concat(preCls, " ").concat(className),
children: sku.map(function (item, index) {
return /*#__PURE__*/_jsxs(View, {
className: "".concat(preCls, "-item"),
children: [/*#__PURE__*/_jsx(View, {
className: "".concat(preCls, "-name"),
children: item.name
}), /*#__PURE__*/_jsx(View, {
className: "".concat(preCls, "-attrs"),
children: item.items.map(function (it, index) {
var _classnames;
var othersId = item.items.map(function (it) {
return it.id;
});
var canBuy = currentAttrCanBuy(it.id, othersId);
return /*#__PURE__*/_jsx(View, {
onClick: function onClick() {
return attrClick(it.id, othersId, canBuy);
},
className: classnames((_classnames = {}, _defineProperty(_classnames, "".concat(preCls, "-attr"), true), _defineProperty(_classnames, "".concat(preCls, "-attr-active ").concat(activeClassName), currentSkuIds === null || currentSkuIds === void 0 ? void 0 : currentSkuIds.includes(it.id)), _defineProperty(_classnames, "".concat(preCls, "-attr-disable ").concat(disabledClassName), !canBuy), _classnames)),
children: itemRender ? itemRender(it) : it.name
}, "attr#".concat(index, "@").concat(it.id));
})
})]
}, "sku#".concat(index, "@").concat(item.id));
})
});
}