diff --git a/package.json b/package.json index 2f431a5b5..be69ba726 100644 --- a/package.json +++ b/package.json @@ -50,7 +50,7 @@ "vue": ">= 2.5.0" }, "devDependencies": { - "autoprefixer": "^7.2.4", + "autoprefixer": "^7.2.5", "avoriaz": "2.0.0", "babel-cli": "^6.26.0", "babel-core": "^6.26.0", @@ -63,10 +63,10 @@ "chai": "^4.1.2", "codecov": "^3.0.0", "cross-env": "^5.1.3", - "css-loader": "^0.28.8", + "css-loader": "^0.28.9", "dependency-tree": "^5.12.0", "eslint": "^4.15.0", - "eslint-plugin-vue": "^4.1.0", + "eslint-plugin-vue": "^4.2.0", "extract-text-webpack-plugin": "3.0.2", "fast-vue-md-loader": "^1.0.3", "friendly-errors-webpack-plugin": "^1.6.1", @@ -89,7 +89,7 @@ "precss": "2.0.0", "progress-bar-webpack-plugin": "^1.10.0", "rimraf": "^2.5.4", - "shelljs": "^0.7.8", + "shelljs": "^0.8.0", "sinon": "^2.4.1", "sinon-chai": "^2.12.0", "style-loader": "^0.19.1", @@ -97,15 +97,15 @@ "url-loader": "^0.6.2", "vant-doc": "1.0.1", "vue": "^2.5.13", - "vue-loader": "^13.6.2", + "vue-loader": "^13.7.0", "vue-router": "^3.0.1", - "vue-sfc-compiler": "^0.0.7", + "vue-sfc-compiler": "^0.0.8", "vue-style-loader": "^3.0.0", "vue-template-compiler": "^2.5.13", "vue-template-es2015-compiler": "^1.6.0", "webpack": "^3.10.0", - "webpack-bundle-analyzer": "^2.9.1", - "webpack-dev-server": "2.9.7", + "webpack-bundle-analyzer": "^2.9.2", + "webpack-dev-server": "2.11.0", "webpack-merge": "^4.1.1" } } diff --git a/packages/sku/containers/SkuContainer.vue b/packages/sku/Sku.vue similarity index 87% rename from packages/sku/containers/SkuContainer.vue rename to packages/sku/Sku.vue index a5c595d79..dbacacd97 100644 --- a/packages/sku/containers/SkuContainer.vue +++ b/packages/sku/Sku.vue @@ -2,7 +2,12 @@
- +
- +
- - + +
- + /* eslint-disable camelcase */ import Vue from 'vue'; -import Popup from '../../popup'; -import Toast from '../../toast'; -import SkuHeader from '../components/SkuHeader'; -import SkuRow from '../components/SkuRow'; -import SkuRowItem from '../components/SkuRowItem'; -import SkuStepper from '../components/SkuStepper'; -import SkuMessages from '../components/SkuMessages'; -import SkuActions from '../components/SkuActions'; +import Popup from '../popup'; +import Toast from '../toast'; +import SkuHeader from './components/SkuHeader'; +import SkuRow from './components/SkuRow'; +import SkuRowItem from './components/SkuRowItem'; +import SkuStepper from './components/SkuStepper'; +import SkuMessages from './components/SkuMessages'; +import SkuActions from './components/SkuActions'; import { isAllSelected, getSkuComb, getSelectedSkuValues -} from '../utils/skuHelper'; -import { LIMIT_TYPE } from '../constants'; -import { create } from '../../utils'; +} from './utils/skuHelper'; +import { LIMIT_TYPE } from './constants'; +import { create } from '../utils'; const { QUOTA_LIMIT } = LIMIT_TYPE; @@ -107,13 +118,19 @@ export default create({ }, props: { + sku: Object, goods: Object, + value: Boolean, + buyText: String, goodsId: [Number, String], + stepperTitle: String, + hideStock: Boolean, + resetStepperOnHide: Boolean, + disableStepperInput: Boolean, initialSku: { type: Object, default: () => ({}) }, - sku: Object, quota: { type: Number, default: 0 @@ -122,24 +139,18 @@ export default create({ type: Number, default: 0 }, - hideStock: Boolean, showAddCartBtn: { type: Boolean, default: true }, - buyText: String, - stepperTitle: String, bodyOffsetTop: { type: Number, default: 200 }, - resetStepperOnHide: Boolean, - disableStepperInput: Boolean, messagePlaceholderMap: { type: Object, default: () => ({}) - }, - value: Boolean + } }, data() { @@ -192,19 +203,19 @@ export default create({ maxHeight: maxHeight + 'px' }; }, + isSkuCombSelected() { return isAllSelected(this.sku.tree, this.selectedSku); }, - // sku数据不存在时不渲染模板 + isSkuEmpty() { - for (var key in this.sku) { - if (Object.prototype.hasOwnProperty.call(this.sku, key)) return false; - } - return true; + return Object.keys(this.sku).length === 0; }, + hasSku() { return !this.sku.none_sku; }, + selectedSkuComb() { if (!this.hasSku) { return { @@ -217,13 +228,14 @@ export default create({ } return null; }, + skuTree() { return this.sku.tree || []; } }, created() { - var skuEventBus = new Vue(); + const skuEventBus = new Vue(); this.skuEventBus = skuEventBus; skuEventBus.$on('sku:close', this.handleCloseClicked); @@ -250,19 +262,23 @@ export default create({ } }); }, + getSkuMessages() { return this.$refs.skuMessages ? this.$refs.skuMessages.getMessages() : {}; }, + getSkuCartMessages() { return this.$refs.skuMessages ? this.$refs.skuMessages.getCartMessages() : {}; }, + validateSkuMessages() { return this.$refs.skuMessages ? this.$refs.skuMessages.validateMessages() : ''; }, + validateSku() { if (this.selectedNum === 0) { return this.$t('unavailable'); @@ -276,9 +292,11 @@ export default create({ return this.$t('spec'); } }, + handleCloseClicked() { this.show = false; }, + handleSkuSelected(skuValue) { // 点击已选中的sku时则取消选中 this.selectedSku = @@ -292,9 +310,11 @@ export default create({ selectedSkuComb: this.selectedSkuComb }); }, + handleNumChange(num) { this.selectedNum = num; }, + handleOverLimit({ action, limitType, quota, quotaUsed }) { if (action === 'minus') { Toast(this.$t('least')); @@ -308,12 +328,15 @@ export default create({ } } }, + handleAddCartClicked() { this.handleBuyOrAddCart('add-cart'); }, + handleBuyClicked() { this.handleBuyOrAddCart('buy-clicked'); }, + handleBuyOrAddCart(type) { const error = this.validateSku(); if (error) { diff --git a/packages/sku/components/SkuActions.vue b/packages/sku/components/SkuActions.vue index 199128944..1654c7b29 100644 --- a/packages/sku/components/SkuActions.vue +++ b/packages/sku/components/SkuActions.vue @@ -1,7 +1,17 @@ @@ -20,15 +30,6 @@ export default create({ buyText: String, skuEventBus: Object, showAddCartBtn: Boolean - }, - - methods: { - onAddCartClicked() { - this.skuEventBus.$emit('sku:addCart'); - }, - onBuyClicked() { - this.skuEventBus.$emit('sku:buy'); - } } }); diff --git a/packages/sku/components/SkuHeader.vue b/packages/sku/components/SkuHeader.vue index cbe82c8c6..b8469abd9 100644 --- a/packages/sku/components/SkuHeader.vue +++ b/packages/sku/components/SkuHeader.vue @@ -1,12 +1,12 @@ @@ -26,9 +26,6 @@ export default create({ }, computed: { - skuTree() { - return this.sku.tree; - }, goodsImg() { const s1Id = this.selectedSku.s1; const skuImg = this.getSkuImg(s1Id); @@ -45,14 +42,11 @@ export default create({ }, methods: { - onCloseClicked() { - this.skuEventBus.$emit('sku:close'); - }, getSkuImg(id) { if (!id) return; // 目前skuImg都挂载在skuTree中s1那类sku上 - const treeItem = this.skuTree.filter(treeItem => treeItem.k_s === 's1')[0] || {}; + const treeItem = this.sku.tree.filter(treeItem => treeItem.k_s === 's1')[0] || {}; if (!treeItem.v) { return; diff --git a/packages/sku/components/SkuMessages.vue b/packages/sku/components/SkuMessages.vue index e72796c25..a1839030c 100644 --- a/packages/sku/components/SkuMessages.vue +++ b/packages/sku/components/SkuMessages.vue @@ -1,26 +1,14 @@