Sku.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import Vue from 'vue';
  3. import Popup from '../popup';
  4. import Toast from '../toast';
  5. import ImagePreview from '../image-preview';
  6. import SkuHeader from './components/SkuHeader';
  7. import SkuHeaderItem from './components/SkuHeaderItem';
  8. import SkuRow from './components/SkuRow';
  9. import SkuRowItem from './components/SkuRowItem';
  10. import SkuRowPropItem from './components/SkuRowPropItem';
  11. import SkuStepper from './components/SkuStepper';
  12. import SkuMessages from './components/SkuMessages';
  13. import SkuActions from './components/SkuActions';
  14. import { createNamespace, isEmpty } from '../utils';
  15. import { isAllSelected, isSkuChoosable, getSkuComb, getSelectedSkuValues, getSelectedPropValues, getSelectedProperties } from './utils/sku-helper';
  16. import { LIMIT_TYPE, UNSELECTED_SKU_VALUE_ID } from './constants';
  17. var namespace = createNamespace('sku');
  18. var createComponent = namespace[0],
  19. bem = namespace[1],
  20. t = namespace[2];
  21. var QUOTA_LIMIT = LIMIT_TYPE.QUOTA_LIMIT;
  22. export default createComponent({
  23. props: {
  24. sku: Object,
  25. goods: Object,
  26. value: Boolean,
  27. buyText: String,
  28. goodsId: [Number, String],
  29. priceTag: String,
  30. lazyLoad: Boolean,
  31. hideStock: Boolean,
  32. properties: Array,
  33. addCartText: String,
  34. stepperTitle: String,
  35. getContainer: [String, Function],
  36. hideQuotaText: Boolean,
  37. hideSelectedText: Boolean,
  38. resetStepperOnHide: Boolean,
  39. customSkuValidator: Function,
  40. disableStepperInput: Boolean,
  41. resetSelectedSkuOnHide: Boolean,
  42. quota: {
  43. type: Number,
  44. default: 0
  45. },
  46. quotaUsed: {
  47. type: Number,
  48. default: 0
  49. },
  50. startSaleNum: {
  51. type: Number,
  52. default: 1
  53. },
  54. initialSku: {
  55. type: Object,
  56. default: function _default() {
  57. return {};
  58. }
  59. },
  60. stockThreshold: {
  61. type: Number,
  62. default: 50
  63. },
  64. showSoldoutSku: {
  65. type: Boolean,
  66. default: true
  67. },
  68. showAddCartBtn: {
  69. type: Boolean,
  70. default: true
  71. },
  72. disableSoldoutSku: {
  73. type: Boolean,
  74. default: true
  75. },
  76. customStepperConfig: {
  77. type: Object,
  78. default: function _default() {
  79. return {};
  80. }
  81. },
  82. showHeaderImage: {
  83. type: Boolean,
  84. default: true
  85. },
  86. previewOnClickImage: {
  87. type: Boolean,
  88. default: true
  89. },
  90. safeAreaInsetBottom: {
  91. type: Boolean,
  92. default: true
  93. },
  94. closeOnClickOverlay: {
  95. type: Boolean,
  96. default: true
  97. },
  98. bodyOffsetTop: {
  99. type: Number,
  100. default: 200
  101. },
  102. messageConfig: {
  103. type: Object,
  104. default: function _default() {
  105. return {
  106. initialMessages: {},
  107. placeholderMap: {},
  108. uploadImg: function uploadImg() {
  109. return Promise.resolve();
  110. },
  111. uploadMaxSize: 5
  112. };
  113. }
  114. }
  115. },
  116. data: function data() {
  117. return {
  118. selectedSku: {},
  119. selectedProp: {},
  120. selectedNum: 1,
  121. show: this.value
  122. };
  123. },
  124. watch: {
  125. show: function show(val) {
  126. this.$emit('input', val);
  127. if (!val) {
  128. this.$emit('sku-close', {
  129. selectedSkuValues: this.selectedSkuValues,
  130. selectedNum: this.selectedNum,
  131. selectedSkuComb: this.selectedSkuComb
  132. });
  133. if (this.resetStepperOnHide) {
  134. this.resetStepper();
  135. }
  136. if (this.resetSelectedSkuOnHide) {
  137. this.resetSelectedSku();
  138. }
  139. }
  140. },
  141. value: function value(val) {
  142. this.show = val;
  143. },
  144. skuTree: 'resetSelectedSku',
  145. initialSku: function initialSku() {
  146. this.resetStepper();
  147. this.resetSelectedSku();
  148. }
  149. },
  150. computed: {
  151. skuGroupClass: function skuGroupClass() {
  152. return ['van-sku-group-container', {
  153. 'van-sku-group-container--hide-soldout': !this.showSoldoutSku
  154. }];
  155. },
  156. bodyStyle: function bodyStyle() {
  157. if (this.$isServer) {
  158. return;
  159. }
  160. var maxHeight = window.innerHeight - this.bodyOffsetTop;
  161. return {
  162. maxHeight: maxHeight + 'px'
  163. };
  164. },
  165. isSkuCombSelected: function isSkuCombSelected() {
  166. var _this = this;
  167. // SKU 未选完
  168. if (this.hasSku && !isAllSelected(this.skuTree, this.selectedSku)) {
  169. return false;
  170. } // 属性未全选
  171. return !this.propList.filter(function (i) {
  172. return i.is_necessary !== false;
  173. }).some(function (i) {
  174. return (_this.selectedProp[i.k_id] || []).length === 0;
  175. });
  176. },
  177. isSkuEmpty: function isSkuEmpty() {
  178. return Object.keys(this.sku).length === 0;
  179. },
  180. hasSku: function hasSku() {
  181. return !this.sku.none_sku;
  182. },
  183. hasSkuOrAttr: function hasSkuOrAttr() {
  184. return this.hasSku || this.propList.length > 0;
  185. },
  186. selectedSkuComb: function selectedSkuComb() {
  187. var skuComb = null;
  188. if (this.isSkuCombSelected) {
  189. if (this.hasSku) {
  190. skuComb = getSkuComb(this.skuList, this.selectedSku);
  191. } else {
  192. skuComb = {
  193. id: this.sku.collection_id,
  194. price: Math.round(this.sku.price * 100),
  195. stock_num: this.sku.stock_num
  196. };
  197. }
  198. if (skuComb) {
  199. skuComb.properties = getSelectedProperties(this.propList, this.selectedProp);
  200. skuComb.property_price = this.selectedPropValues.reduce(function (acc, cur) {
  201. return acc + (cur.price || 0);
  202. }, 0);
  203. }
  204. }
  205. return skuComb;
  206. },
  207. selectedSkuValues: function selectedSkuValues() {
  208. return getSelectedSkuValues(this.skuTree, this.selectedSku);
  209. },
  210. selectedPropValues: function selectedPropValues() {
  211. return getSelectedPropValues(this.propList, this.selectedProp);
  212. },
  213. price: function price() {
  214. if (this.selectedSkuComb) {
  215. return ((this.selectedSkuComb.price + this.selectedSkuComb.property_price) / 100).toFixed(2);
  216. } // sku.price是一个格式化好的价格区间
  217. return this.sku.price;
  218. },
  219. originPrice: function originPrice() {
  220. if (this.selectedSkuComb && this.selectedSkuComb.origin_price) {
  221. return ((this.selectedSkuComb.origin_price + this.selectedSkuComb.property_price) / 100).toFixed(2);
  222. }
  223. return this.sku.origin_price;
  224. },
  225. skuTree: function skuTree() {
  226. return this.sku.tree || [];
  227. },
  228. skuList: function skuList() {
  229. return this.sku.list || [];
  230. },
  231. propList: function propList() {
  232. return this.properties || [];
  233. },
  234. imageList: function imageList() {
  235. var imageList = [this.goods.picture];
  236. if (this.skuTree.length > 0) {
  237. this.skuTree.forEach(function (treeItem) {
  238. if (!treeItem.v) {
  239. return;
  240. }
  241. treeItem.v.forEach(function (vItem) {
  242. var imgUrl = vItem.previewImgUrl || vItem.imgUrl || vItem.img_url;
  243. if (imgUrl && imageList.indexOf(imgUrl) === -1) {
  244. imageList.push(imgUrl);
  245. }
  246. });
  247. });
  248. }
  249. return imageList;
  250. },
  251. stock: function stock() {
  252. var stockNum = this.customStepperConfig.stockNum;
  253. if (stockNum !== undefined) {
  254. return stockNum;
  255. }
  256. if (this.selectedSkuComb) {
  257. return this.selectedSkuComb.stock_num;
  258. }
  259. return this.sku.stock_num;
  260. },
  261. stockText: function stockText() {
  262. var h = this.$createElement;
  263. var stockFormatter = this.customStepperConfig.stockFormatter;
  264. if (stockFormatter) {
  265. return stockFormatter(this.stock);
  266. }
  267. return [t('stock') + " ", h("span", {
  268. "class": bem('stock-num', {
  269. highlight: this.stock < this.stockThreshold
  270. })
  271. }, [this.stock]), " " + t('stockUnit')];
  272. },
  273. selectedText: function selectedText() {
  274. var _this2 = this;
  275. if (this.selectedSkuComb) {
  276. var values = this.selectedSkuValues.concat(this.selectedPropValues);
  277. return t('selected') + " " + values.map(function (item) {
  278. return item.name;
  279. }).join(' ');
  280. }
  281. var unselectedSku = this.skuTree.filter(function (item) {
  282. return _this2.selectedSku[item.k_s] === UNSELECTED_SKU_VALUE_ID;
  283. }).map(function (item) {
  284. return item.k;
  285. });
  286. var unselectedProp = this.propList.filter(function (item) {
  287. return (_this2.selectedProp[item.k_id] || []).length < 1;
  288. }).map(function (item) {
  289. return item.k;
  290. });
  291. return t('select') + " " + unselectedSku.concat(unselectedProp).join(' ');
  292. }
  293. },
  294. created: function created() {
  295. var skuEventBus = new Vue();
  296. this.skuEventBus = skuEventBus;
  297. skuEventBus.$on('sku:select', this.onSelect);
  298. skuEventBus.$on('sku:propSelect', this.onPropSelect);
  299. skuEventBus.$on('sku:numChange', this.onNumChange);
  300. skuEventBus.$on('sku:previewImage', this.onPreviewImage);
  301. skuEventBus.$on('sku:overLimit', this.onOverLimit);
  302. skuEventBus.$on('sku:stepperState', this.onStepperState);
  303. skuEventBus.$on('sku:addCart', this.onAddCart);
  304. skuEventBus.$on('sku:buy', this.onBuy);
  305. this.resetStepper();
  306. this.resetSelectedSku(); // 组件初始化后的钩子,抛出skuEventBus
  307. this.$emit('after-sku-create', skuEventBus);
  308. },
  309. methods: {
  310. resetStepper: function resetStepper() {
  311. var skuStepper = this.$refs.skuStepper;
  312. var selectedNum = this.initialSku.selectedNum;
  313. var num = selectedNum != null ? selectedNum : this.startSaleNum; // 用来缓存不合法的情况
  314. this.stepperError = null;
  315. if (skuStepper) {
  316. skuStepper.setCurrentNum(num);
  317. } else {
  318. // 当首次加载(skuStepper 为空)时,传入数量如果不合法,可能会存在问题
  319. this.selectedNum = num;
  320. }
  321. },
  322. // @exposed-api
  323. resetSelectedSku: function resetSelectedSku() {
  324. var _this3 = this;
  325. this.selectedSku = {}; // 重置 selectedSku
  326. this.skuTree.forEach(function (item) {
  327. _this3.selectedSku[item.k_s] = UNSELECTED_SKU_VALUE_ID;
  328. });
  329. this.skuTree.forEach(function (item) {
  330. var key = item.k_s; // 规格值只有1个时,优先判断
  331. var valueId = item.v.length === 1 ? item.v[0].id : _this3.initialSku[key];
  332. if (valueId && isSkuChoosable(_this3.skuList, _this3.selectedSku, {
  333. key: key,
  334. valueId: valueId
  335. })) {
  336. _this3.selectedSku[key] = valueId;
  337. }
  338. });
  339. var skuValues = this.selectedSkuValues;
  340. if (skuValues.length > 0) {
  341. this.$nextTick(function () {
  342. _this3.$emit('sku-selected', {
  343. skuValue: skuValues[skuValues.length - 1],
  344. selectedSku: _this3.selectedSku,
  345. selectedSkuComb: _this3.selectedSkuComb
  346. });
  347. });
  348. } // 重置商品属性
  349. this.selectedProp = {};
  350. var _this$initialSku$sele = this.initialSku.selectedProp,
  351. selectedProp = _this$initialSku$sele === void 0 ? {} : _this$initialSku$sele; // 选中外部传入信息
  352. this.propList.forEach(function (item) {
  353. if (selectedProp[item.k_id]) {
  354. _this3.selectedProp[item.k_id] = selectedProp[item.k_id];
  355. }
  356. });
  357. if (isEmpty(this.selectedProp)) {
  358. this.propList.forEach(function (item) {
  359. var _item$v;
  360. // 没有加价的属性,默认选中第一个
  361. if ((item == null ? void 0 : (_item$v = item.v) == null ? void 0 : _item$v.length) > 0) {
  362. var v = item.v,
  363. k_id = item.k_id;
  364. var isHasConfigPrice = v.some(function (i) {
  365. return +i.price !== 0;
  366. }); // 没有加价属性
  367. if (!isHasConfigPrice) {
  368. // 找到第一个不被禁用的属性
  369. // 历史如果没有 text_status 字段的,就相当于沿用直接原来的逻辑取第一个属性
  370. var firstEnableProp = v.find(function (prop) {
  371. return prop.text_status !== 0;
  372. });
  373. if (firstEnableProp) {
  374. _this3.selectedProp[k_id] = [firstEnableProp.id];
  375. }
  376. }
  377. }
  378. });
  379. }
  380. var propValues = this.selectedPropValues;
  381. if (propValues.length > 0) {
  382. this.$emit('sku-prop-selected', {
  383. propValue: propValues[propValues.length - 1],
  384. selectedProp: this.selectedProp,
  385. selectedSkuComb: this.selectedSkuComb
  386. });
  387. } // 抛出重置事件
  388. this.$emit('sku-reset', {
  389. selectedSku: this.selectedSku,
  390. selectedProp: this.selectedProp,
  391. selectedSkuComb: this.selectedSkuComb
  392. });
  393. this.centerInitialSku();
  394. },
  395. getSkuMessages: function getSkuMessages() {
  396. return this.$refs.skuMessages ? this.$refs.skuMessages.getMessages() : {};
  397. },
  398. getSkuCartMessages: function getSkuCartMessages() {
  399. return this.$refs.skuMessages ? this.$refs.skuMessages.getCartMessages() : {};
  400. },
  401. validateSkuMessages: function validateSkuMessages() {
  402. return this.$refs.skuMessages ? this.$refs.skuMessages.validateMessages() : '';
  403. },
  404. validateSku: function validateSku() {
  405. if (this.selectedNum === 0) {
  406. return t('unavailable');
  407. }
  408. if (this.isSkuCombSelected) {
  409. return this.validateSkuMessages();
  410. } // 自定义sku校验
  411. if (this.customSkuValidator) {
  412. var err = this.customSkuValidator(this);
  413. if (err) return err;
  414. }
  415. return t('selectSku');
  416. },
  417. onSelect: function onSelect(skuValue) {
  418. var _extends2, _extends3;
  419. // 点击已选中的sku时则取消选中
  420. this.selectedSku = this.selectedSku[skuValue.skuKeyStr] === skuValue.id ? _extends({}, this.selectedSku, (_extends2 = {}, _extends2[skuValue.skuKeyStr] = UNSELECTED_SKU_VALUE_ID, _extends2)) : _extends({}, this.selectedSku, (_extends3 = {}, _extends3[skuValue.skuKeyStr] = skuValue.id, _extends3));
  421. this.$emit('sku-selected', {
  422. skuValue: skuValue,
  423. selectedSku: this.selectedSku,
  424. selectedSkuComb: this.selectedSkuComb
  425. });
  426. },
  427. onPropSelect: function onPropSelect(propValue) {
  428. var _extends4;
  429. var arr = this.selectedProp[propValue.skuKeyStr] || [];
  430. var pos = arr.indexOf(propValue.id);
  431. if (pos > -1) {
  432. arr.splice(pos, 1);
  433. } else if (propValue.multiple) {
  434. arr.push(propValue.id);
  435. } else {
  436. arr.splice(0, 1, propValue.id);
  437. }
  438. this.selectedProp = _extends({}, this.selectedProp, (_extends4 = {}, _extends4[propValue.skuKeyStr] = arr, _extends4));
  439. this.$emit('sku-prop-selected', {
  440. propValue: propValue,
  441. selectedProp: this.selectedProp,
  442. selectedSkuComb: this.selectedSkuComb
  443. });
  444. },
  445. onNumChange: function onNumChange(num) {
  446. this.selectedNum = num;
  447. },
  448. onPreviewImage: function onPreviewImage(selectedValue) {
  449. var _this4 = this;
  450. var imageList = this.imageList;
  451. var index = 0;
  452. var indexImage = imageList[0];
  453. if (selectedValue && selectedValue.imgUrl) {
  454. this.imageList.some(function (image, pos) {
  455. if (image === selectedValue.imgUrl) {
  456. index = pos;
  457. return true;
  458. }
  459. return false;
  460. });
  461. indexImage = selectedValue.imgUrl;
  462. }
  463. var params = _extends({}, selectedValue, {
  464. index: index,
  465. imageList: this.imageList,
  466. indexImage: indexImage
  467. });
  468. this.$emit('open-preview', params);
  469. if (!this.previewOnClickImage) {
  470. return;
  471. }
  472. ImagePreview({
  473. images: this.imageList,
  474. startPosition: index,
  475. onClose: function onClose() {
  476. _this4.$emit('close-preview', params);
  477. }
  478. });
  479. },
  480. onOverLimit: function onOverLimit(data) {
  481. var action = data.action,
  482. limitType = data.limitType,
  483. quota = data.quota,
  484. quotaUsed = data.quotaUsed;
  485. var handleOverLimit = this.customStepperConfig.handleOverLimit;
  486. if (handleOverLimit) {
  487. handleOverLimit(data);
  488. return;
  489. }
  490. if (action === 'minus') {
  491. if (this.startSaleNum > 1) {
  492. Toast(t('minusStartTip', this.startSaleNum));
  493. } else {
  494. Toast(t('minusTip'));
  495. }
  496. } else if (action === 'plus') {
  497. if (limitType === QUOTA_LIMIT) {
  498. if (quotaUsed > 0) {
  499. Toast(t('quotaUsedTip', quota, quotaUsed));
  500. } else {
  501. Toast(t('quotaTip', quota));
  502. }
  503. } else {
  504. Toast(t('soldout'));
  505. }
  506. }
  507. },
  508. onStepperState: function onStepperState(data) {
  509. this.stepperError = data.valid ? null : _extends({}, data, {
  510. action: 'plus'
  511. });
  512. },
  513. onAddCart: function onAddCart() {
  514. this.onBuyOrAddCart('add-cart');
  515. },
  516. onBuy: function onBuy() {
  517. this.onBuyOrAddCart('buy-clicked');
  518. },
  519. onBuyOrAddCart: function onBuyOrAddCart(type) {
  520. // sku 不符合购买条件
  521. if (this.stepperError) {
  522. return this.onOverLimit(this.stepperError);
  523. }
  524. var error = this.validateSku();
  525. if (error) {
  526. Toast(error);
  527. } else {
  528. this.$emit(type, this.getSkuData());
  529. }
  530. },
  531. // @exposed-api
  532. getSkuData: function getSkuData() {
  533. return {
  534. goodsId: this.goodsId,
  535. messages: this.getSkuMessages(),
  536. selectedNum: this.selectedNum,
  537. cartMessages: this.getSkuCartMessages(),
  538. selectedSkuComb: this.selectedSkuComb
  539. };
  540. },
  541. // 当 popup 完全打开后执行
  542. onOpened: function onOpened() {
  543. this.centerInitialSku();
  544. },
  545. centerInitialSku: function centerInitialSku() {
  546. var _this5 = this;
  547. (this.$refs.skuRows || []).forEach(function (it) {
  548. var _ref = it.skuRow || {},
  549. k_s = _ref.k_s;
  550. it.centerItem(_this5.initialSku[k_s]);
  551. });
  552. }
  553. },
  554. render: function render() {
  555. var _this6 = this;
  556. var h = arguments[0];
  557. if (this.isSkuEmpty) {
  558. return;
  559. }
  560. var sku = this.sku,
  561. skuList = this.skuList,
  562. goods = this.goods,
  563. price = this.price,
  564. lazyLoad = this.lazyLoad,
  565. originPrice = this.originPrice,
  566. skuEventBus = this.skuEventBus,
  567. selectedSku = this.selectedSku,
  568. selectedProp = this.selectedProp,
  569. selectedNum = this.selectedNum,
  570. stepperTitle = this.stepperTitle,
  571. selectedSkuComb = this.selectedSkuComb,
  572. showHeaderImage = this.showHeaderImage,
  573. disableSoldoutSku = this.disableSoldoutSku;
  574. var slotsProps = {
  575. price: price,
  576. originPrice: originPrice,
  577. selectedNum: selectedNum,
  578. skuEventBus: skuEventBus,
  579. selectedSku: selectedSku,
  580. selectedSkuComb: selectedSkuComb
  581. };
  582. var slots = function slots(name) {
  583. return _this6.slots(name, slotsProps);
  584. };
  585. var Header = slots('sku-header') || h(SkuHeader, {
  586. "attrs": {
  587. "sku": sku,
  588. "goods": goods,
  589. "skuEventBus": skuEventBus,
  590. "selectedSku": selectedSku,
  591. "showHeaderImage": showHeaderImage
  592. }
  593. }, [h("template", {
  594. "slot": "sku-header-image-extra"
  595. }, [slots('sku-header-image-extra')]), slots('sku-header-price') || h("div", {
  596. "class": "van-sku__goods-price"
  597. }, [h("span", {
  598. "class": "van-sku__price-symbol"
  599. }, ["\uFFE5"]), h("span", {
  600. "class": "van-sku__price-num"
  601. }, [price]), this.priceTag && h("span", {
  602. "class": "van-sku__price-tag"
  603. }, [this.priceTag])]), slots('sku-header-origin-price') || originPrice && h(SkuHeaderItem, [t('originPrice'), " \uFFE5", originPrice]), !this.hideStock && h(SkuHeaderItem, [h("span", {
  604. "class": "van-sku__stock"
  605. }, [this.stockText])]), this.hasSkuOrAttr && !this.hideSelectedText && h(SkuHeaderItem, [this.selectedText]), slots('sku-header-extra')]);
  606. var Group = slots('sku-group') || this.hasSkuOrAttr && h("div", {
  607. "class": this.skuGroupClass
  608. }, [this.skuTree.map(function (skuTreeItem) {
  609. return h(SkuRow, {
  610. "attrs": {
  611. "skuRow": skuTreeItem
  612. },
  613. "ref": "skuRows",
  614. "refInFor": true
  615. }, [skuTreeItem.v.map(function (skuValue) {
  616. return h(SkuRowItem, {
  617. "attrs": {
  618. "skuList": skuList,
  619. "lazyLoad": lazyLoad,
  620. "skuValue": skuValue,
  621. "skuKeyStr": skuTreeItem.k_s,
  622. "selectedSku": selectedSku,
  623. "skuEventBus": skuEventBus,
  624. "disableSoldoutSku": disableSoldoutSku,
  625. "largeImageMode": skuTreeItem.largeImageMode
  626. }
  627. });
  628. })]);
  629. }), this.propList.map(function (skuTreeItem) {
  630. return h(SkuRow, {
  631. "attrs": {
  632. "skuRow": skuTreeItem
  633. }
  634. }, [skuTreeItem.v.map(function (skuValue) {
  635. return h(SkuRowPropItem, {
  636. "attrs": {
  637. "skuValue": skuValue,
  638. "skuKeyStr": skuTreeItem.k_id + '',
  639. "selectedProp": selectedProp,
  640. "skuEventBus": skuEventBus,
  641. "multiple": skuTreeItem.is_multiple,
  642. "disabled": skuValue.text_status === 0
  643. }
  644. });
  645. })]);
  646. })]);
  647. var Stepper = slots('sku-stepper') || h(SkuStepper, {
  648. "ref": "skuStepper",
  649. "attrs": {
  650. "stock": this.stock,
  651. "quota": this.quota,
  652. "quotaUsed": this.quotaUsed,
  653. "startSaleNum": this.startSaleNum,
  654. "skuEventBus": skuEventBus,
  655. "selectedNum": selectedNum,
  656. "stepperTitle": stepperTitle,
  657. "skuStockNum": sku.stock_num,
  658. "disableStepperInput": this.disableStepperInput,
  659. "customStepperConfig": this.customStepperConfig,
  660. "hideQuotaText": this.hideQuotaText
  661. },
  662. "on": {
  663. "change": function change(event) {
  664. _this6.$emit('stepper-change', event);
  665. }
  666. }
  667. });
  668. var Messages = slots('sku-messages') || h(SkuMessages, {
  669. "ref": "skuMessages",
  670. "attrs": {
  671. "goodsId": this.goodsId,
  672. "messageConfig": this.messageConfig,
  673. "messages": sku.messages
  674. }
  675. });
  676. var Actions = slots('sku-actions') || h(SkuActions, {
  677. "attrs": {
  678. "buyText": this.buyText,
  679. "skuEventBus": skuEventBus,
  680. "addCartText": this.addCartText,
  681. "showAddCartBtn": this.showAddCartBtn
  682. }
  683. });
  684. return h(Popup, {
  685. "attrs": {
  686. "round": true,
  687. "closeable": true,
  688. "position": "bottom",
  689. "getContainer": this.getContainer,
  690. "closeOnClickOverlay": this.closeOnClickOverlay,
  691. "safeAreaInsetBottom": this.safeAreaInsetBottom
  692. },
  693. "class": "van-sku-container",
  694. "on": {
  695. "opened": this.onOpened
  696. },
  697. "model": {
  698. value: _this6.show,
  699. callback: function callback($$v) {
  700. _this6.show = $$v;
  701. }
  702. }
  703. }, [Header, h("div", {
  704. "class": "van-sku-body",
  705. "style": this.bodyStyle
  706. }, [slots('sku-body-top'), Group, slots('extra-sku-group'), Stepper, slots('before-sku-messages'), Messages, slots('after-sku-messages')]), slots('sku-actions-top'), Actions]);
  707. }
  708. });