|
| xqd
@@ -1,1156 +1,1269 @@
|
|
|
-<template>
|
|
|
- <view class="app-attr">
|
|
|
- <view @click="alert">
|
|
|
- <slot name="button"></slot>
|
|
|
- </view>
|
|
|
- <view class="modal" v-if="display === 'block'" @click="close" >
|
|
|
- <view class="safe-area-inset-bottom u-attr-fixed" >
|
|
|
- <view class="content" @tap.native.stop="preventD">
|
|
|
- <image src="../../../static/image/icon/close.png" class="close" @click="close"></image>
|
|
|
- <view class="first dir-left-nowrap" :class="sign =='wholesale' ? 'no-border' : ''">
|
|
|
- <view class="box-grow-0 img" @click="clickImg(attrPic)">
|
|
|
- <app-image :img-src="attrPic" width="100%" height="100%"></app-image>
|
|
|
- </view>
|
|
|
- <view class="info">
|
|
|
- <view class="dir-left-nowrap cross-center" :class="priceColor">
|
|
|
- <view class="dir-left-nowrap cross-center">
|
|
|
- <view class="dir-left-nowrap cross-center" :class="theme+'-m-text ' + theme" v-if="selectAttr.extra || goods.extra">
|
|
|
- <view>{{selectAttr.extra ? selectAttr.extra.value + selectAttr.extra.name :
|
|
|
- goods.extra.value + goods.extra.name}}
|
|
|
- </view>
|
|
|
- <view v-if="!(goods.sign === 'integral_mall' && attrPrice == 0)">+</view>
|
|
|
- </view>
|
|
|
- <app-price :theme="theme" v-if="!(goods.sign === 'integral_mall' && attrPrice == 0) && sign != 'wholesale'" type="text-price-all" :price="attrPrice"
|
|
|
- :default-price="goods.price"></app-price>
|
|
|
- <app-price :theme="theme" v-if="sign == 'wholesale'" type="text-price-all" :price="attrPrice" :max="goods.level_show == 1 ? goods.price_member_max : goods.price_max" :min="goods.level_show == 1 ? goods.price_member_min : goods.price_min"></app-price>
|
|
|
- </view>
|
|
|
- <view v-if="goods.level_show === 1 && (selectAttr || sign == 'wholesale')">
|
|
|
- <app-member-mark :theme="themeObject"></app-member-mark>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="stock">库存：{{attrNum}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="second" :class="sign =='wholesale' ? 'no-padding' : ''">
|
|
|
- <slot name="extra"></slot>
|
|
|
- <view class="wholesale" v-if="sign =='wholesale'">
|
|
|
- <view class="wholesale-attr-list dir-left-nowrap cross-center" v-if="index != goods.attr_groups.length -1" v-for="(item, index) in goods.attr_groups" :key="index">
|
|
|
- <view class="wholesale-attr-group t-omit-two">{{item.attr_group_name}}</view>
|
|
|
- <scroll-view @scroll="scrollGet($event,index)" :scroll-left="item.scrollLeft" class="wholesale-attr-item" scroll-x="true">
|
|
|
- <view class="attr-name" v-for="(attr, key) in item.attr_list" :key="key" :class="attr.active ? theme + '-m-back ' + theme : 'attr-background'" @click="chooseAttr(index,attr)">{{attr.attr_name}}
|
|
|
- <view class="attr-number" :style="{'right':`${attr.length + 'rpx'}`}" :class="theme + '-m-back ' + theme" v-if="index == 0 && attr.number > 0">{{attr.number}}</view>
|
|
|
- </view>
|
|
|
- <view class="attr-name attr-background" style="visibility: hidden">占位
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- <view @click.stop="toBottom(index)" class="right-icon">
|
|
|
- <view></view>
|
|
|
- <image src="/static/image/icon/right.png"></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="wholesale-attr-group-list">
|
|
|
- <view class="wholesale-attr-group" v-for="(item, index) in goodsAttr" :key="index">
|
|
|
- <view class="dir-left-nowrap">
|
|
|
- <view class="wholesale-attr-item main-between">
|
|
|
- <view class="dir-top-nowrap main-center attr-name t-omit">
|
|
|
- <view class="t-omit">{{item.attr_list[item.attr_list.length - 1].attr_name}}</view>
|
|
|
- <view class="attr-price">￥{{goods.level_show === 1 ? item.price_member : item.price}}</view>
|
|
|
- </view>
|
|
|
- <view class="dir-left-nowrap wholesale-number-box cross-center">
|
|
|
- <image :src="item.number <= 0 ? '/static/image/plugins/un-low.png' : '/static/image/plugins/low.png'" class="block box-grow-0 cross-center main-center" @click="wholesaleNumberSub(index)">
|
|
|
- </image>
|
|
|
- <view class="wholesale-number-input box-grow-0 cross-center main-center">
|
|
|
- <app-input height="60" type="number" v-model="item.number" paddingLeft="0" :center="true" placeholder=" " @blur="wholesaleNumberBlur(index)" :focus="false" width="88"></app-input>
|
|
|
- </view>
|
|
|
- <image :src="item.number >= item.stock? '/static/image/plugins/un-add.png' : '/static/image/plugins/add.png'" class="block box-grow-0 cross-center main-center" @click="wholesaleNumberAdd(index)"></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="attr-group" v-if="goods.type === 'goods' && sign !='wholesale'" v-for="(item, index) in newAttrGroupList" :key="index">
|
|
|
- <view class="attr-group-name">{{item.attr_group_name}}</view>
|
|
|
- <view class="dir-left-wrap">
|
|
|
- <view v-for="(attr, key) in item.attr_list" :key="key" class="attr-item"
|
|
|
- :class="attr.checked && sign !== 'gift' ? theme + '-m-back active ' + theme : attr.checked && sign === 'gift' ? theme + '-background active' : 'attr-item-default' + (attr.attr_num_0 ? ' attr_num_0' : '')"
|
|
|
- @click="storeAttrClick(attr.attr_id, item.attr_group_id)">{{attr.attr_name}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-if="chooseNumber" class="dir-left-nowrap number-box cross-center">
|
|
|
- <view class="box-grow-1">数量</view>
|
|
|
- <image :src="number <= 1 ? '/static/image/icon/can-be-reduced.png' : '/static/image/cart/can-be-reduced.png'" class="block box-grow-0 cross-center main-center" @click="numberSub">
|
|
|
- </image>
|
|
|
- <view class="number-input box-grow-0 cross-center main-center">
|
|
|
- <app-input type="number" v-model="number" paddingLeft="0" :center="true" placeholder=" " @blur="numberBlur"
|
|
|
- :focus="false" width="88"></app-input>
|
|
|
- </view>
|
|
|
- <image src="/static/image/cart/can-be-added.png" class="block box-grow-0 cross-center main-center" @click="numberAdd"></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-if="sign =='wholesale'" class="total">已选<text>{{totalNumber}}</text>件 总计<text>￥{{totalPrice > 0? totalPrice : '0.00'}}</text></view>
|
|
|
- <view class="three dir-left-nowrap">
|
|
|
- <view class="box-grow-1 main-center cross-center" v-if="cartShow"
|
|
|
- :class="sign === 'pick' ? theme + '-m-back ' + 'buy ' + theme : theme === 'b' || theme === 'f' || theme === 'a' ? theme + '-s-back ' + 'buy ' + theme : theme + '-s-back ' + theme+ '-m-text ' + theme" @click="cart">{{addText}}
|
|
|
- </view>
|
|
|
- <view v-if="is_show_buy" class="box-grow-1 main-center cross-center buy" :class="sign !== 'gift' ? theme + '-m-back '+ theme : theme + '-background'" @click="buy">
|
|
|
- {{buyText}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import { mapState, mapGetters } from "vuex";
|
|
|
- import appPrice from "../../page-component/goods/app-price.vue";
|
|
|
- import appImage from "../../basic-component/app-image/app-image.vue";
|
|
|
- import appMemberMark from '../../page-component/app-member-mark/app-member-mark.vue';
|
|
|
- export default {
|
|
|
- name: "app-attr",
|
|
|
- components: {
|
|
|
- appPrice,
|
|
|
- 'app-image': appImage,
|
|
|
- appMemberMark
|
|
|
- },
|
|
|
- props: {
|
|
|
- goods: Object,
|
|
|
- attrGroupList: Array,
|
|
|
- attrCart: {
|
|
|
- type: Array,
|
|
|
- default() {
|
|
|
- return [];
|
|
|
- }
|
|
|
- },
|
|
|
- cartShow: {
|
|
|
- type: Boolean,
|
|
|
- default() {
|
|
|
- return true
|
|
|
- }
|
|
|
- },
|
|
|
- previewUrl: String,
|
|
|
- submitUrl: String,
|
|
|
- goodsId: {
|
|
|
- type:Number,
|
|
|
- default() {
|
|
|
- return 0
|
|
|
- }
|
|
|
- },
|
|
|
- show: Number,
|
|
|
- buyText: {
|
|
|
- type: String,
|
|
|
- default() {
|
|
|
- return '立即购买';
|
|
|
- }
|
|
|
- },
|
|
|
- plugin: {
|
|
|
- default: '',
|
|
|
- },
|
|
|
- theme: {
|
|
|
- type: String,
|
|
|
- default: 'a',
|
|
|
- },
|
|
|
- chooseNumber: {
|
|
|
- type: Boolean,
|
|
|
- default: true,
|
|
|
- },
|
|
|
- noPay: {
|
|
|
- type: Boolean,
|
|
|
- default: false,
|
|
|
- },
|
|
|
- buyClick: {
|
|
|
- type: Boolean,
|
|
|
- default: false,
|
|
|
- },
|
|
|
- addText: {
|
|
|
- type: String,
|
|
|
- default: '加入购物车',
|
|
|
- },
|
|
|
- is_show_buy: {
|
|
|
- type: Boolean,
|
|
|
- default: true,
|
|
|
- },
|
|
|
- sign: {
|
|
|
- type: String
|
|
|
- },
|
|
|
- totalPrice: {
|
|
|
- type: String,
|
|
|
- default: '0.00',
|
|
|
- },
|
|
|
- totalNumber: {
|
|
|
- type: Number,
|
|
|
- default: 0,
|
|
|
- },
|
|
|
- discount: {
|
|
|
- type: Number,
|
|
|
- default: 0,
|
|
|
- },
|
|
|
- wholesaleType: {
|
|
|
- type: Number,
|
|
|
- default: 0,
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- display: 'none',
|
|
|
- number: 1,
|
|
|
- selectAttr: null,
|
|
|
- newAttrGroupList: null,
|
|
|
- pic_url: null,
|
|
|
- // 商品批发
|
|
|
- activeAttr: [],
|
|
|
- goodsAttr: []
|
|
|
- };
|
|
|
- },
|
|
|
- watch: {
|
|
|
- show() {
|
|
|
- if (this.display === 'block') {
|
|
|
- this.selectAttr = null;
|
|
|
- this.close();
|
|
|
- } else if (this.display === 'none') {
|
|
|
- this.alert();
|
|
|
+<template>
|
|
|
+ <view class="app-attr">
|
|
|
+ <view @click="alert">
|
|
|
+ <slot name="button"></slot>
|
|
|
+ </view>
|
|
|
+ <view class="modal" v-if="display === 'block'" @click="close">
|
|
|
+ <view class="safe-area-inset-bottom u-attr-fixed">
|
|
|
+ <view class="content" @tap.native.stop="preventD">
|
|
|
+ <image src="../../../static/image/icon/close.png" class="close" @click="close"></image>
|
|
|
+ <view class="first dir-left-nowrap" :class="sign =='wholesale' ? 'no-border' : ''">
|
|
|
+ <view class="box-grow-0 img" @click="clickImg(attrPic)">
|
|
|
+ <app-image :img-src="attrPic" width="100%" height="100%"></app-image>
|
|
|
+ </view>
|
|
|
+ <view class="info">
|
|
|
+ <view class="dir-left-nowrap cross-center" :class="priceColor">
|
|
|
+ <view class="dir-left-nowrap cross-center">
|
|
|
+ <view class="dir-left-nowrap cross-center" :class="theme+'-m-text ' + theme"
|
|
|
+ v-if="selectAttr.extra || goods.extra">
|
|
|
+ <view>{{selectAttr.extra ? selectAttr.extra.value + selectAttr.extra.name :
|
|
|
+ goods.extra.value + goods.extra.name}}
|
|
|
+ </view>
|
|
|
+ <view v-if="!(goods.sign === 'integral_mall' && attrPrice == 0)">+</view>
|
|
|
+ </view>
|
|
|
+ <app-price :theme="theme"
|
|
|
+ v-if="!(goods.sign === 'integral_mall' && attrPrice == 0) && sign != 'wholesale'"
|
|
|
+ type="text-price-all" :price="attrPrice" :default-price="goods.price">
|
|
|
+ </app-price>
|
|
|
+ <app-price :theme="theme" v-if="sign == 'wholesale'" type="text-price-all"
|
|
|
+ :price="attrPrice"
|
|
|
+ :max="goods.level_show == 1 ? goods.price_member_max : goods.price_max"
|
|
|
+ :min="goods.level_show == 1 ? goods.price_member_min : goods.price_min">
|
|
|
+ </app-price>
|
|
|
+ </view>
|
|
|
+ <view v-if="goods.level_show === 1 && (selectAttr || sign == 'wholesale')">
|
|
|
+ <app-member-mark :theme="themeObject"></app-member-mark>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="stock">库存：{{attrNum}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="second" :class="sign =='wholesale' ? 'no-padding' : ''">
|
|
|
+ <slot name="extra"></slot>
|
|
|
+ <view class="wholesale" v-if="sign =='wholesale'">
|
|
|
+ <view class="wholesale-attr-list dir-left-nowrap cross-center"
|
|
|
+ v-if="index != goods.attr_groups.length -1" v-for="(item, index) in goods.attr_groups"
|
|
|
+ :key="index">
|
|
|
+ <view class="wholesale-attr-group t-omit-two">{{item.attr_group_name}}</view>
|
|
|
+ <scroll-view @scroll="scrollGet($event,index)" :scroll-left="item.scrollLeft"
|
|
|
+ class="wholesale-attr-item" scroll-x="true">
|
|
|
+ <view class="attr-name" v-for="(attr, key) in item.attr_list" :key="key"
|
|
|
+ :class="attr.active ? theme + '-m-back ' + theme : 'attr-background'"
|
|
|
+ @click="chooseAttr(index,attr)">{{attr.attr_name}}
|
|
|
+ <view class="attr-number" :style="{'right':`${attr.length + 'rpx'}`}"
|
|
|
+ :class="theme + '-m-back ' + theme" v-if="index == 0 && attr.number > 0">
|
|
|
+ {{attr.number}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="attr-name attr-background" style="visibility: hidden">占位
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ <view @click.stop="toBottom(index)" class="right-icon">
|
|
|
+ <view></view>
|
|
|
+ <image src="/static/image/icon/right.png"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="wholesale-attr-group-list">
|
|
|
+ <view class="wholesale-attr-group" v-for="(item, index) in goodsAttr" :key="index">
|
|
|
+ <view class="dir-left-nowrap">
|
|
|
+ <view class="wholesale-attr-item main-between">
|
|
|
+ <view class="dir-top-nowrap main-center attr-name t-omit">
|
|
|
+ <view class="t-omit">
|
|
|
+ {{item.attr_list[item.attr_list.length - 1].attr_name}}</view>
|
|
|
+ <view class="attr-price">
|
|
|
+ ￥{{goods.level_show === 1 ? item.price_member : item.price}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="dir-left-nowrap wholesale-number-box cross-center">
|
|
|
+ <image
|
|
|
+ :src="item.number <= 0 ? '/static/image/plugins/un-low.png' : '/static/image/plugins/low.png'"
|
|
|
+ class="block box-grow-0 cross-center main-center"
|
|
|
+ @click="wholesaleNumberSub(index)">
|
|
|
+ </image>
|
|
|
+ <view
|
|
|
+ class="wholesale-number-input box-grow-0 cross-center main-center">
|
|
|
+ <app-input height="60" type="number" v-model="item.number"
|
|
|
+ paddingLeft="0" :center="true" placeholder=" "
|
|
|
+ @blur="wholesaleNumberBlur(index)" :focus="false" width="88">
|
|
|
+ </app-input>
|
|
|
+ </view>
|
|
|
+ <image
|
|
|
+ :src="item.number >= item.stock? '/static/image/plugins/un-add.png' : '/static/image/plugins/add.png'"
|
|
|
+ class="block box-grow-0 cross-center main-center"
|
|
|
+ @click="wholesaleNumberAdd(index)"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="attr-group" v-if="goods.type === 'goods' && sign !='wholesale'"
|
|
|
+ v-for="(item, index) in newAttrGroupList" :key="index">
|
|
|
+ <view class="attr-group-name">{{item.attr_group_name}}</view>
|
|
|
+ <view class="dir-left-wrap">
|
|
|
+ <view v-for="(attr, key) in item.attr_list" :key="key" class="attr-item"
|
|
|
+ :class="attr.checked && sign !== 'gift' ? theme + '-m-back active ' + theme : attr.checked && sign === 'gift' ? theme + '-background active' : 'attr-item-default' + (attr.attr_num_0 ? ' attr_num_0' : '')"
|
|
|
+ @click="storeAttrClick(attr.attr_id, item.attr_group_id)">{{attr.attr_name}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="chooseNumber" class="dir-left-nowrap number-box cross-center">
|
|
|
+ <view class="box-grow-1">数量</view>
|
|
|
+ <image
|
|
|
+ :src="number <= 1 ? '/static/image/icon/can-be-reduced.png' : '/static/image/cart/can-be-reduced.png'"
|
|
|
+ class="block box-grow-0 cross-center main-center" @click="numberSub">
|
|
|
+ </image>
|
|
|
+ <view class="number-input box-grow-0 cross-center main-center">
|
|
|
+ <app-input type="number" v-model="number" paddingLeft="0" :center="true" placeholder=" "
|
|
|
+ @blur="numberBlur" :focus="false" width="88"></app-input>
|
|
|
+ </view>
|
|
|
+ <image src="/static/image/cart/can-be-added.png"
|
|
|
+ class="block box-grow-0 cross-center main-center" @click="numberAdd"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="sign =='wholesale'" class="total">已选<text>{{totalNumber}}</text>件
|
|
|
+ 总计<text>￥{{totalPrice > 0? totalPrice : '0.00'}}</text></view>
|
|
|
+ <view class="three dir-left-nowrap">
|
|
|
+ <view class="box-grow-1 main-center cross-center" v-if="cartShow"
|
|
|
+ :class="sign === 'pick' ? theme + '-m-back ' + 'buy ' + theme : theme === 'b' || theme === 'f' || theme === 'a' ? theme + '-s-back ' + 'buy ' + theme : theme + '-s-back ' + theme+ '-m-text ' + theme"
|
|
|
+ @click="cart">{{addText}}
|
|
|
+ </view>
|
|
|
+ <view v-if="is_show_buy" class="box-grow-1 main-center cross-center buy"
|
|
|
+ :class="sign !== 'gift' ? theme + '-m-back '+ theme : theme + '-background'" @click="buy">
|
|
|
+ {{buyText}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapState,
|
|
|
+ mapGetters
|
|
|
+ } from "vuex";
|
|
|
+ import appPrice from "../../page-component/goods/app-price.vue";
|
|
|
+ import appImage from "../../basic-component/app-image/app-image.vue";
|
|
|
+ import appMemberMark from '../../page-component/app-member-mark/app-member-mark.vue';
|
|
|
+ export default {
|
|
|
+ name: "app-attr",
|
|
|
+ components: {
|
|
|
+ appPrice,
|
|
|
+ 'app-image': appImage,
|
|
|
+ appMemberMark
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ goods: Object,
|
|
|
+ attrGroupList: Array,
|
|
|
+ attrCart: {
|
|
|
+ type: Array,
|
|
|
+ default () {
|
|
|
+ return [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ cartShow: {
|
|
|
+ type: Boolean,
|
|
|
+ default () {
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ previewUrl: String,
|
|
|
+ submitUrl: String,
|
|
|
+ goodsId: {
|
|
|
+ type: Number,
|
|
|
+ default () {
|
|
|
+ return 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ show: Number,
|
|
|
+ buyText: {
|
|
|
+ type: String,
|
|
|
+ default () {
|
|
|
+ return '立即购买';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ plugin: {
|
|
|
+ default: '',
|
|
|
+ },
|
|
|
+ theme: {
|
|
|
+ type: String,
|
|
|
+ default: 'a',
|
|
|
+ },
|
|
|
+ chooseNumber: {
|
|
|
+ type: Boolean,
|
|
|
+ default: true,
|
|
|
+ },
|
|
|
+ noPay: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ buyClick: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ addText: {
|
|
|
+ type: String,
|
|
|
+ default: '加入购物车',
|
|
|
+ },
|
|
|
+ is_show_buy: {
|
|
|
+ type: Boolean,
|
|
|
+ default: true,
|
|
|
+ },
|
|
|
+ sign: {
|
|
|
+ type: String
|
|
|
+ },
|
|
|
+ totalPrice: {
|
|
|
+ type: String,
|
|
|
+ default: '0.00',
|
|
|
+ },
|
|
|
+ totalNumber: {
|
|
|
+ type: Number,
|
|
|
+ default: 0,
|
|
|
+ },
|
|
|
+ discount: {
|
|
|
+ type: Number,
|
|
|
+ default: 0,
|
|
|
+ },
|
|
|
+ wholesaleType: {
|
|
|
+ type: Number,
|
|
|
+ default: 0,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ display: 'none',
|
|
|
+ number: 1,
|
|
|
+ selectAttr: null,
|
|
|
+ newAttrGroupList: null,
|
|
|
+ pic_url: null,
|
|
|
+ // 商品批发
|
|
|
+ activeAttr: [],
|
|
|
+ goodsAttr: [],
|
|
|
+ service_screen:null
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ show() {
|
|
|
+ if (this.display === 'block') {
|
|
|
+ this.selectAttr = null;
|
|
|
+ this.close();
|
|
|
+ } else if (this.display === 'none') {
|
|
|
+ this.alert();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ newData: {
|
|
|
+ handler() {
|
|
|
+ this.$emit('attr', this.newData)
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ },
|
|
|
+ attrGroupList: {
|
|
|
+ handler() {
|
|
|
+ this.newAttrGroupList = this.attrGroupList;
|
|
|
+ if (this.display == 'block') {
|
|
|
+ this.alert();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ immediate: true
|
|
|
+ },
|
|
|
+ goods: {
|
|
|
+ handler() {
|
|
|
+ if (this.display == 'block') {
|
|
|
+ this.alert();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ immediate: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ if (this.sign == 'wholesale') {
|
|
|
+ this.pic_url = this.goods.attr_groups[0].attr_list[0].pic_url
|
|
|
+ if (this.goods.attr_groups.length == 1) {
|
|
|
+ this.goodsAttr = this.goods.attr;
|
|
|
+ } else {
|
|
|
+ for (let item of this.goods.attr_groups) {
|
|
|
+ let para = {
|
|
|
+ attr_group_name: '',
|
|
|
+ attr_group_id: '',
|
|
|
+ attr_id: '',
|
|
|
+ attr_name: ''
|
|
|
+ };
|
|
|
+ para.attr_group_name = item.attr_group_name
|
|
|
+ para.attr_group_id = item.attr_group_id
|
|
|
+ para.attr_id = item.attr_list[0].attr_id
|
|
|
+ para.attr_name = item.attr_list[0].attr_name
|
|
|
+ this.activeAttr.push(para)
|
|
|
+ }
|
|
|
+ for (let item of this.goods.attr) {
|
|
|
+ let same = true;
|
|
|
+ for (let i = 0; i < item.attr_list.length - 1; i++) {
|
|
|
+ let first = {
|
|
|
+ attr_group_name: item.attr_list[i].attr_group_name,
|
|
|
+ attr_group_id: item.attr_list[i].attr_group_id,
|
|
|
+ attr_id: item.attr_list[i].attr_id,
|
|
|
+ attr_name: item.attr_list[i].attr_name
|
|
|
+ }
|
|
|
+ if (JSON.stringify(first) != JSON.stringify(this.activeAttr[i])) {
|
|
|
+ same = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (same) {
|
|
|
+ this.goodsAttr.push(item)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ alert() {
|
|
|
+
|
|
|
+ if (this.attrGroupList.length === 0) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (this.sign != 'wholesale') {
|
|
|
+ let attr_group_list = this.attrGroupList;
|
|
|
+ let attrs = this.goods.attr;
|
|
|
+ let select_attr = null;
|
|
|
+ this.number = 1;
|
|
|
+ if (attr_group_list.length === 1) {
|
|
|
+ for (let i in attrs) {
|
|
|
+ for (let j in attr_group_list[0].attr_list) {
|
|
|
+ if (attr_group_list[0].attr_list[j].attr_id == attrs[i].attr_list[0].attr_id) {
|
|
|
+ if (attrs[i].stock > 0) {
|
|
|
+ if (attrs.length === 1) {
|
|
|
+ attr_group_list[0].attr_list[j].checked = true;
|
|
|
+ }
|
|
|
+ attr_group_list[0].attr_list[j].attr_num_0 = false;
|
|
|
+ this.pic_url = attr_group_list[0].attr_list[j].pic_url;
|
|
|
+ } else {
|
|
|
+ this.number = 0;
|
|
|
+ attr_group_list[0].attr_list[j].checked = false;
|
|
|
+ attr_group_list[0].attr_list[j].attr_num_0 = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (attrs.length === 1) {
|
|
|
+ select_attr = attrs[0];
|
|
|
+ this.$emit('attrtap', select_attr);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.newAttrGroupList = attr_group_list;
|
|
|
+ if (this.goods.selectAttr) {
|
|
|
+ this.selectAttr = this.goods.selectAttr
|
|
|
+ } else {
|
|
|
+ this.selectAttr = select_attr;
|
|
|
+ }
|
|
|
}
|
|
|
- },
|
|
|
- newData: {
|
|
|
- handler() {
|
|
|
- this.$emit('attr', this.newData)
|
|
|
- },
|
|
|
- immediate: true,
|
|
|
- },
|
|
|
- attrGroupList: {
|
|
|
- handler() {
|
|
|
- this.newAttrGroupList = this.attrGroupList;
|
|
|
- if (this.display == 'block') {
|
|
|
- this.alert();
|
|
|
- }
|
|
|
- },
|
|
|
- immediate: true
|
|
|
- },
|
|
|
- goods: {
|
|
|
- handler() {
|
|
|
- if (this.display == 'block') {
|
|
|
- this.alert();
|
|
|
- }
|
|
|
- },
|
|
|
- immediate: true
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- if(this.sign == 'wholesale') {
|
|
|
- this.pic_url = this.goods.attr_groups[0].attr_list[0].pic_url
|
|
|
- if(this.goods.attr_groups.length == 1) {
|
|
|
- this.goodsAttr = this.goods.attr;
|
|
|
- }else {
|
|
|
- for(let item of this.goods.attr_groups) {
|
|
|
- let para = {
|
|
|
- attr_group_name: '',
|
|
|
- attr_group_id: '',
|
|
|
- attr_id: '',
|
|
|
- attr_name: ''
|
|
|
- };
|
|
|
- para.attr_group_name = item.attr_group_name
|
|
|
- para.attr_group_id = item.attr_group_id
|
|
|
- para.attr_id = item.attr_list[0].attr_id
|
|
|
- para.attr_name = item.attr_list[0].attr_name
|
|
|
- this.activeAttr.push(para)
|
|
|
- }
|
|
|
- for(let item of this.goods.attr) {
|
|
|
- let same = true;
|
|
|
- for(let i = 0;i < item.attr_list.length -1;i++) {
|
|
|
- let first = {
|
|
|
- attr_group_name: item.attr_list[i].attr_group_name,
|
|
|
- attr_group_id: item.attr_list[i].attr_group_id,
|
|
|
- attr_id: item.attr_list[i].attr_id,
|
|
|
- attr_name: item.attr_list[i].attr_name
|
|
|
- }
|
|
|
- if(JSON.stringify(first) != JSON.stringify(this.activeAttr[i])) {
|
|
|
- same = false;
|
|
|
- }
|
|
|
- }
|
|
|
- if(same) {
|
|
|
- this.goodsAttr.push(item)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- alert() {
|
|
|
- if (this.attrGroupList.length === 0) {
|
|
|
- return;
|
|
|
- }
|
|
|
- if(this.sign != 'wholesale') {
|
|
|
- let attr_group_list = this.attrGroupList;
|
|
|
- let attrs = this.goods.attr;
|
|
|
- let select_attr = null;
|
|
|
- this.number = 1;
|
|
|
- if (attr_group_list.length === 1) {
|
|
|
- for (let i in attrs) {
|
|
|
- for (let j in attr_group_list[0].attr_list) {
|
|
|
- if (attr_group_list[0].attr_list[j].attr_id == attrs[i].attr_list[0].attr_id) {
|
|
|
- if (attrs[i].stock > 0) {
|
|
|
- if (attrs.length === 1) {
|
|
|
- attr_group_list[0].attr_list[j].checked = true;
|
|
|
- }
|
|
|
- attr_group_list[0].attr_list[j].attr_num_0 = false;
|
|
|
- this.pic_url = attr_group_list[0].attr_list[j].pic_url;
|
|
|
- } else {
|
|
|
- this.number = 0;
|
|
|
- attr_group_list[0].attr_list[j].checked = false;
|
|
|
- attr_group_list[0].attr_list[j].attr_num_0 = true;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- if (attrs.length === 1) {
|
|
|
- select_attr = attrs[0];
|
|
|
- this.$emit('attrtap', select_attr);
|
|
|
- }
|
|
|
- }
|
|
|
- this.newAttrGroupList = attr_group_list;
|
|
|
- if(this.goods.selectAttr) {
|
|
|
- this.selectAttr = this.goods.selectAttr
|
|
|
- }else {
|
|
|
- this.selectAttr = select_attr;
|
|
|
- }
|
|
|
- }
|
|
|
- this.display = 'block';
|
|
|
- },
|
|
|
- scrollGet(e,index) {
|
|
|
- this.goods.attr_groups[index].scrollLeft = e.detail.scrollLeft;
|
|
|
- this.$forceUpdate();
|
|
|
- },
|
|
|
- toBottom(index) {
|
|
|
- this.$nextTick().then(() => {
|
|
|
- this.goods.attr_groups[index].scrollLeft = 99999;
|
|
|
- this.$forceUpdate();
|
|
|
- })
|
|
|
- },
|
|
|
- chooseAttr(index,attrItem) {
|
|
|
- let that = this;
|
|
|
- for(let attr of that.goods.attr_groups[index].attr_list) {
|
|
|
- attr.active = false;
|
|
|
- if(attr.attr_id == attrItem.attr_id && attr.attr_name == attrItem.attr_name) {
|
|
|
- attr.active = true;
|
|
|
- }
|
|
|
- }
|
|
|
- if(index == 0) {
|
|
|
- that.pic_url = attrItem.pic_url;
|
|
|
- }
|
|
|
- that.activeAttr[index].attr_id = attrItem.attr_id
|
|
|
- that.activeAttr[index].attr_name = attrItem.attr_name
|
|
|
- that.goodsAttr = [];
|
|
|
- for(let item of that.goods.attr) {
|
|
|
- let same = true;
|
|
|
- for(let i = 0;i < item.attr_list.length -1;i++) {
|
|
|
- let first = {
|
|
|
- attr_group_name: item.attr_list[i].attr_group_name,
|
|
|
- attr_group_id: item.attr_list[i].attr_group_id,
|
|
|
- attr_id: item.attr_list[i].attr_id,
|
|
|
- attr_name: item.attr_list[i].attr_name
|
|
|
- }
|
|
|
- if(JSON.stringify(first) != JSON.stringify(this.activeAttr[i])) {
|
|
|
- same = false;
|
|
|
- }
|
|
|
- }
|
|
|
- if(same) {
|
|
|
- that.goodsAttr.push(item)
|
|
|
- }
|
|
|
- }
|
|
|
- that.$forceUpdate();
|
|
|
- that.count();
|
|
|
- },
|
|
|
- wholesaleNumberSub(index) {
|
|
|
- if(this.goodsAttr[index].number == 0) {
|
|
|
- return false;
|
|
|
- }
|
|
|
- this.goodsAttr[index].number--;
|
|
|
- if(this.goods.attr_groups.length == 1) {
|
|
|
- this.pic_url = this.goodsAttr[index].pic_url;
|
|
|
- }
|
|
|
- this.count(index);
|
|
|
- },
|
|
|
- wholesaleNumberAdd(index) {
|
|
|
- if(this.goodsAttr[index].number > this.goodsAttr[index].stock || this.goodsAttr[index].number == this.goodsAttr[index].stock) {
|
|
|
- return false
|
|
|
- }
|
|
|
- this.goodsAttr[index].number++;
|
|
|
- if(this.goods.attr_groups.length == 1) {
|
|
|
- this.pic_url = this.goodsAttr[index].pic_url;
|
|
|
- }
|
|
|
- this.count(index);
|
|
|
- },
|
|
|
- wholesaleNumberBlur(index) {
|
|
|
- if(+this.goodsAttr[index].number > +this.goodsAttr[index].stock) {
|
|
|
- this.goodsAttr[index].number = this.goodsAttr[index].stock
|
|
|
- }
|
|
|
- if(this.goods.attr_groups.length == 1) {
|
|
|
- this.pic_url = this.goodsAttr[index].pic_url;
|
|
|
- }
|
|
|
- this.count(index);
|
|
|
- },
|
|
|
- count(index) {
|
|
|
- let that =this;
|
|
|
- this.$emit('attrtap', that.goods, that.goodsAttr);
|
|
|
- setTimeout(()=>{
|
|
|
- that.selectAttr = that.goodsAttr[index]
|
|
|
- })
|
|
|
- },
|
|
|
- close() {
|
|
|
- this.display = 'none';
|
|
|
- this.$emit('close', false)
|
|
|
- },
|
|
|
- preventD() {
|
|
|
- },
|
|
|
- storeAttrClick(attr_id, attr_group_id) {
|
|
|
- let attr_group_list = JSON.parse(JSON.stringify(this.newAttrGroupList));
|
|
|
- let attrs = this.goods.attr;
|
|
|
- let checkedAttr = [];
|
|
|
- let attr_cart = this.attrCart;
|
|
|
- for (let i in attr_group_list) {
|
|
|
- for (let j in attr_group_list[i].attr_list) {
|
|
|
- let temp = attr_group_list[i].attr_list[j];
|
|
|
- if (parseInt(attr_group_list[i].attr_group_id) == parseInt(attr_group_id)) {
|
|
|
- if (parseInt(temp.attr_id) === parseInt(attr_id)) {
|
|
|
- if (temp.checked) {
|
|
|
- temp.checked = false;
|
|
|
- } else {
|
|
|
- temp.checked = true;
|
|
|
- }
|
|
|
- if (temp.attr_num_0) {
|
|
|
- return;
|
|
|
- }
|
|
|
- } else {
|
|
|
- temp.checked = false;
|
|
|
- }
|
|
|
- }
|
|
|
- if (temp.checked) {
|
|
|
- if (i == 0) {
|
|
|
- this.pic_url = attr_group_list[0].attr_list[j].pic_url;
|
|
|
- }
|
|
|
- checkedAttr.push(attr_group_list[i].attr_group_id + '-' + temp.attr_id);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- function inArray(val, arr) {
|
|
|
- return arr.some(function (v) {
|
|
|
- return val == v;
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- let attrNum_0 = [];
|
|
|
- let select_attr = null;
|
|
|
- let number = 1;
|
|
|
- for (let i in attrs) {
|
|
|
- let arr = [];
|
|
|
- let sign = 0;
|
|
|
- for (let j in attrs[i].attr_list) {
|
|
|
- let param = attrs[i].attr_list[j].attr_group_id + '-' + attrs[i].attr_list[j].attr_id;
|
|
|
- if (!inArray(param, checkedAttr)) {
|
|
|
- sign += 1;
|
|
|
- arr.push(param);
|
|
|
- }
|
|
|
- }
|
|
|
- if (attrs[i].stock == 0 && sign <= 1) {
|
|
|
- attrNum_0 = attrNum_0.concat(arr);
|
|
|
- }
|
|
|
- if (sign == 0) {
|
|
|
- if (!select_attr) {
|
|
|
- select_attr = {};
|
|
|
- }
|
|
|
- select_attr = attrs[i];
|
|
|
- attr_cart.forEach(item => {
|
|
|
-
|
|
|
- if (item.attr_id == select_attr.id) {
|
|
|
- number = item.num;
|
|
|
- }
|
|
|
- });
|
|
|
- if (select_attr.stock <= 0) {
|
|
|
- uni.showToast({
|
|
|
- title: '库存不足',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
- if (select_attr.stock <= number) {
|
|
|
- number = select_attr.stock;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- if (checkedAttr.length == 0) {
|
|
|
- select_attr = null;
|
|
|
- }
|
|
|
-
|
|
|
- //库存为0的规格添加标识
|
|
|
- for (let i in attr_group_list) {
|
|
|
- for (let j in attr_group_list[i].attr_list) {
|
|
|
- let cAttr = attr_group_list[i].attr_list[j];
|
|
|
- let cParam = attr_group_list[i].attr_group_id + '-' + cAttr.attr_id;
|
|
|
- if (inArray(cParam, attrNum_0) && !inArray(cParam, checkedAttr)) {
|
|
|
- cAttr.attr_num_0 = true;
|
|
|
- } else {
|
|
|
- cAttr.attr_num_0 = false;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- this.newAttrGroupList = attr_group_list;
|
|
|
- this.selectAttr = select_attr;
|
|
|
- this.number = number;
|
|
|
- this.$emit('attrtap', this.selectAttr);
|
|
|
- },
|
|
|
- numberBlur(number) {
|
|
|
- number = parseInt(number.value);
|
|
|
- if (number > this.attrNum) {
|
|
|
- uni.showToast({
|
|
|
- title: '库存不足',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- number = this.attrNum;
|
|
|
- }
|
|
|
- this.$emit('attrtap', this.selectAttr);
|
|
|
- return this.number = number;
|
|
|
- },
|
|
|
- numberSub() {
|
|
|
- let number = this.number;
|
|
|
- if (number <= 1) {
|
|
|
- return true;
|
|
|
- }
|
|
|
- number--;
|
|
|
- this.number = number;
|
|
|
- this.$emit('attrtap', this.selectAttr);
|
|
|
- },
|
|
|
- numberAdd() {
|
|
|
- let number = this.number;
|
|
|
- number++;
|
|
|
- if (number > this.attrNum) {
|
|
|
- uni.showToast({
|
|
|
- title: '库存不足',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- this.number = this.attrNum;
|
|
|
- return;
|
|
|
- }
|
|
|
- this.number = number;
|
|
|
- this.$emit('attrtap', this.selectAttr);
|
|
|
- },
|
|
|
- cart() {
|
|
|
- if (!this.submit()) {
|
|
|
- return false;
|
|
|
- }
|
|
|
- let select_attr = this.selectAttr;
|
|
|
- if (this.goods.sign === 'pick' || this.goods.sign === 'community') {
|
|
|
- this.$emit('add', select_attr, this.number);
|
|
|
- return;
|
|
|
- }
|
|
|
- // 普通商品
|
|
|
- if (this.goods.type === 'goods') {
|
|
|
- if (this.goods.sign === 'miaosha') {
|
|
|
- this.$request({
|
|
|
- url: this.$api.miaosha.add_cart,
|
|
|
- data: {
|
|
|
- miaosha_goods_id: select_attr.goods_id,
|
|
|
- attr_id: select_attr.id,
|
|
|
- num: this.number
|
|
|
- },
|
|
|
- method: 'post'
|
|
|
- }).then(e => {
|
|
|
- uni.showToast({
|
|
|
- title: e.msg,
|
|
|
- type: 'success'
|
|
|
- });
|
|
|
- this.display = 'none';
|
|
|
- this.selectAttr.number = this.number;
|
|
|
- this.$emit('selectNumber', this.selectAttr);
|
|
|
- }).catch(() => {
|
|
|
- this.display = 'none';
|
|
|
- });
|
|
|
- } else if (this.goods.sign === 'flash_sale') {
|
|
|
- this.$request({
|
|
|
- url: this.$api.flash_sale.add_cart,
|
|
|
- data: {
|
|
|
- flash_goods_id: select_attr.goods_id,
|
|
|
- attr_id: select_attr.id,
|
|
|
- num: this.number
|
|
|
- },
|
|
|
- method: 'post'
|
|
|
- }).then(e => {
|
|
|
- uni.showToast({
|
|
|
- title: e.msg,
|
|
|
- type: 'success'
|
|
|
- });
|
|
|
- this.display = 'none';
|
|
|
- this.selectAttr.number = this.number;
|
|
|
- this.$emit('selectNumber', this.selectAttr);
|
|
|
- }).catch(() => {
|
|
|
- this.display = 'none';
|
|
|
- });
|
|
|
- }else if(this.goods.sign == 'wholesale') {
|
|
|
- if(this.totalNumber < this.goods.wholesaleGoods.rise_num) {
|
|
|
- uni.showToast({
|
|
|
- title: '至少采购' + this.goods.wholesaleGoods.rise_num + this.goods.unit,
|
|
|
- image: '/static/image/plugins/tip.png',
|
|
|
- duration: 1000
|
|
|
- });
|
|
|
- return false
|
|
|
- }
|
|
|
- let para = [];
|
|
|
- for(let item of this.goods.attr) {
|
|
|
- if(item.number > 0) {
|
|
|
- para.push(item)
|
|
|
- }
|
|
|
- }
|
|
|
- this.$request({
|
|
|
- url: this.$api.wholesale.cart,
|
|
|
- data: {
|
|
|
- attr: JSON.stringify(para)
|
|
|
- },
|
|
|
- method:'post'
|
|
|
- }).then(response => {
|
|
|
- this.display = 'none';
|
|
|
- if (response.code === 0) {
|
|
|
- for(let item of this.goods.attr) {
|
|
|
- item.number = '0'
|
|
|
- }
|
|
|
- for(let item of this.goodsAttr) {
|
|
|
- item.number = '0'
|
|
|
- }
|
|
|
- this.count();
|
|
|
- uni.hideLoading();
|
|
|
- uni.showToast({
|
|
|
- title: '添加成功',
|
|
|
- duration: 1000
|
|
|
- });
|
|
|
- }
|
|
|
- }).catch(response => {
|
|
|
- this.display = 'none';
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.$request({
|
|
|
- url: this.$api.cart.add,
|
|
|
- data: {
|
|
|
- goods_id: select_attr.goods_id,
|
|
|
- attr: select_attr.id,
|
|
|
- num: this.number
|
|
|
- },
|
|
|
- method: 'post'
|
|
|
- }).then(e => {
|
|
|
- if (e.code === 0) {
|
|
|
- uni.showToast({
|
|
|
- title: e.msg,
|
|
|
- type: 'success'
|
|
|
- });
|
|
|
- this.display = 'none';
|
|
|
- this.selectAttr.number = this.number;
|
|
|
- this.$emit('selectNumber', this.selectAttr);
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: e.msg,
|
|
|
- icon: "none",
|
|
|
- duration: 2500
|
|
|
- });
|
|
|
- this.display = 'none';
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- this.display = 'none';
|
|
|
- });
|
|
|
- }
|
|
|
- // 虚拟商品
|
|
|
- } else if (this.goods.type === 'ecard') {
|
|
|
- uni.showToast({
|
|
|
- title: '虚拟商品不允许加入购物车',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- buy() {
|
|
|
- if (this.$user.isLogin() && this.$store.state.user.info) {
|
|
|
- let member_level =this.$store.state.user.info.identity.member_level;
|
|
|
- if(member_level<this.goods.member_level){
|
|
|
- uni.showModal({
|
|
|
- title:"提示",
|
|
|
- content:"需达到"+this.goods.member_name+"会员才可购买",
|
|
|
- showCancel:true,
|
|
|
- buttonText: '升级',
|
|
|
- success:(res)=>{
|
|
|
- if (res.confirm) {
|
|
|
- uni.navigateTo({
|
|
|
- // url:"/pages/member/index/index",
|
|
|
- url: '/pages/member/upgrade/upgrade?level=' + member_level + '&other=' + this.goods.member_level
|
|
|
- })
|
|
|
- } else if (res.cancel) {
|
|
|
- console.log('用户点击取消');
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- })
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
- if (!this.submit()) return false;
|
|
|
- if (this.noPay) {
|
|
|
- this.$emit('pay', this.number);
|
|
|
- return;
|
|
|
- }
|
|
|
- if (this.buyClick) {
|
|
|
- this.display = 'none';
|
|
|
- this.selectAttr.number = this.number;
|
|
|
- this.$emit('buyClick', this.selectAttr);
|
|
|
- return false;
|
|
|
- }
|
|
|
- if(this.goods.sign == 'wholesale') {
|
|
|
- if(this.totalNumber < this.goods.wholesaleGoods.rise_num) {
|
|
|
- uni.showToast({
|
|
|
- title: '至少采购' + this.goods.wholesaleGoods.rise_num + this.goods.unit,
|
|
|
- image: '/static/image/plugins/tip.png',
|
|
|
- duration: 1000
|
|
|
- });
|
|
|
- return false
|
|
|
- }
|
|
|
- let para = {};
|
|
|
- let mch_list = [{
|
|
|
- mch_id: 0,
|
|
|
- goods_list: []
|
|
|
- }];
|
|
|
- for(let item of this.goods.attr) {
|
|
|
- if(item.number > 0) {
|
|
|
- para = {
|
|
|
- id: item.goods_id,
|
|
|
- attr: [],
|
|
|
- num: item.number,
|
|
|
- cat_id: 0,
|
|
|
- goods_attr_id: item.id
|
|
|
- }
|
|
|
- for(let attr of item.attr_list) {
|
|
|
- let attrList = {
|
|
|
- attr_id: attr.attr_id,
|
|
|
- attr_group_id: attr.attr_group_id
|
|
|
- }
|
|
|
- para.attr.push(attrList)
|
|
|
-
|
|
|
- }
|
|
|
- mch_list[0].goods_list.push(para)
|
|
|
- }
|
|
|
- }
|
|
|
- let url = `/pages/order-submit/order-submit?mch_list=${JSON.stringify(mch_list)}`;
|
|
|
- if (this.submitUrl && this.previewUrl) {
|
|
|
- url += `&preview_url=${encodeURIComponent(this.previewUrl)}&submit_url=${encodeURIComponent(this.submitUrl)}&plugin=${this.plugin}`;
|
|
|
- }
|
|
|
- uni.navigateTo({
|
|
|
- url: url
|
|
|
- })
|
|
|
- }else {
|
|
|
- let goods = this.goods;
|
|
|
- let number = this.number;
|
|
|
- let select_attr = this.selectAttr;
|
|
|
- let goods_attr_id = select_attr.id;
|
|
|
- let attr = [];
|
|
|
- for (let i in select_attr.attr_list) {
|
|
|
- attr.push({
|
|
|
- attr_id: select_attr.attr_list[i].attr_id,
|
|
|
- attr_group_id: select_attr.attr_list[i].attr_group_id
|
|
|
- });
|
|
|
- }
|
|
|
- let mch_list = [{
|
|
|
- mch_id: goods.mch_id ? goods.mch_id : 0,
|
|
|
- goods_list: [{
|
|
|
- id: this.goodsId ? this.goodsId: goods.id,
|
|
|
- attr: attr,
|
|
|
- num: number,
|
|
|
- cat_id: 0,
|
|
|
- goods_attr_id: goods_attr_id
|
|
|
- }]
|
|
|
- }];
|
|
|
- let url = `/pages/order-submit/order-submit?mch_list=${JSON.stringify(mch_list)}`;
|
|
|
- if (this.submitUrl && this.previewUrl) {
|
|
|
- url += `&preview_url=${encodeURIComponent(this.previewUrl)}&submit_url=${encodeURIComponent(this.submitUrl)}&plugin=${this.plugin}`;
|
|
|
- }
|
|
|
- uni.navigateTo({
|
|
|
- url: url
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- submit() {
|
|
|
- let select_attr = this.selectAttr;
|
|
|
- if(this.goods.sign === 'wholesale') {
|
|
|
- return true;
|
|
|
- }
|
|
|
- if (!select_attr) {
|
|
|
- uni.showToast({
|
|
|
- title: '请先选规格',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- return false;
|
|
|
- }
|
|
|
- if (select_attr.stock <= 0) {
|
|
|
- uni.showToast({
|
|
|
- title: '库存不足',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- return false;
|
|
|
- }
|
|
|
- if (this.number <= 0) {
|
|
|
- uni.showToast({
|
|
|
- title: '数量不能为0',
|
|
|
- icon: 'none'
|
|
|
- });
|
|
|
- return false;
|
|
|
- }
|
|
|
- if (!this.goods) {
|
|
|
- return false;
|
|
|
- }
|
|
|
-
|
|
|
- return true;
|
|
|
- },
|
|
|
- clickImg(src) {
|
|
|
- uni.previewImage({
|
|
|
- current: 0,
|
|
|
- urls: [src]
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapState({
|
|
|
- gConfig: state => state.gConfig,
|
|
|
- }),
|
|
|
- attrPic() {
|
|
|
- if (this.pic_url) {
|
|
|
- return this.pic_url;
|
|
|
- } else if (this.goods) {
|
|
|
- return this.goods.cover_pic;
|
|
|
- } else {
|
|
|
- return ``;
|
|
|
- }
|
|
|
- },
|
|
|
- priceColor() {
|
|
|
- if (this.goods && this.goods.level_show === 1) {
|
|
|
- return `member`;
|
|
|
- } else {
|
|
|
- return this.theme + '-color';
|
|
|
- }
|
|
|
- },
|
|
|
- attrNum() {
|
|
|
- if (this.selectAttr) {
|
|
|
- return this.selectAttr.stock;
|
|
|
- } else if (this.goods) {
|
|
|
- return this.goods.goods_num;
|
|
|
- } else {
|
|
|
- return 0;
|
|
|
- }
|
|
|
- },
|
|
|
- attrPrice() {
|
|
|
- if (this.selectAttr) {
|
|
|
- let price;
|
|
|
- if (this.goods.level_show === 1) {
|
|
|
- price = this.selectAttr.price_member
|
|
|
- } else {
|
|
|
- price = this.selectAttr.price;
|
|
|
- }
|
|
|
- if(this.sign == 'wholesale') {
|
|
|
- if(this.selectAttr.number == 0) {
|
|
|
- return 'undefined'
|
|
|
- }
|
|
|
- if(this.wholesaleType == 0) {
|
|
|
- price = (price*(this.discount/10)).toFixed(2);
|
|
|
- return price
|
|
|
- }else {
|
|
|
- price = (price - this.discount).toFixed(2);
|
|
|
- return price
|
|
|
- }
|
|
|
- }else {
|
|
|
- return price
|
|
|
- }
|
|
|
- } else if(this.sign == 'wholesale') {
|
|
|
- return 'undefined';
|
|
|
- } else if (this.goods) {
|
|
|
- if (this.goods.hasOwnProperty('price_min')) {
|
|
|
- return this.goods.price_min;
|
|
|
- } else {
|
|
|
- return this.goods.price;
|
|
|
- }
|
|
|
- } else {
|
|
|
- return 0;
|
|
|
- }
|
|
|
- },
|
|
|
- newData() {
|
|
|
- const { number, display, selectAttr } = this;
|
|
|
- return {
|
|
|
- number,
|
|
|
- display,
|
|
|
- selectAttr
|
|
|
- }
|
|
|
- },
|
|
|
- themeObject:function() {
|
|
|
- return {
|
|
|
- back: this.theme + '-m-back ' + this.theme,
|
|
|
- theme: this.theme,
|
|
|
- color: this.theme + '-m-text ' + this.theme,
|
|
|
- sBack: this.theme + '-s-back ' + this.theme
|
|
|
- }
|
|
|
- },
|
|
|
- ...mapGetters('iPhoneX', {
|
|
|
- boolEmpty: 'getBoolEmpty'
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped lang="scss">
|
|
|
- .app-attr {
|
|
|
- background-color: #ffffff;
|
|
|
- .modal {
|
|
|
- background-color: rgba(0, 0, 0, 0.5);
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- z-index: 1603;
|
|
|
- }
|
|
|
- .content {
|
|
|
- width: 100%;
|
|
|
- background-color: #ffffff;
|
|
|
- border-radius: #{16rpx} #{16rpx} 0 0;
|
|
|
- .close {
|
|
|
- width: #{30rpx};
|
|
|
- height: #{30rpx};
|
|
|
- position: absolute;
|
|
|
- right: #{24rpx};
|
|
|
- top: #{24rpx};
|
|
|
- background-color: #ffffff;
|
|
|
- }
|
|
|
- .first {
|
|
|
- margin: 0 #{24rpx};
|
|
|
- border-bottom: #{1rpx} solid #e2e2e2;
|
|
|
- &.no-border {
|
|
|
- border-bottom: 0;
|
|
|
- }
|
|
|
- .img {
|
|
|
- width: #{200rpx};
|
|
|
- height: #{200rpx};
|
|
|
- border: #{4rpx} solid #ffffff;
|
|
|
- border-radius: #{8rpx};
|
|
|
- margin-top: #{-64rpx};
|
|
|
- display: block;
|
|
|
- }
|
|
|
- .info {
|
|
|
- margin: #{36rpx} 0 #{26rpx} #{24rpx};
|
|
|
- font-size: $uni-font-size-import-two;
|
|
|
- line-height: 1;
|
|
|
- .stock {
|
|
|
- font-size: $uni-font-size-weak-one;
|
|
|
- color: $uni-general-color-two;
|
|
|
- margin-top: #{18rpx};
|
|
|
- }
|
|
|
- view {
|
|
|
- &:first-child {
|
|
|
- margin-right: #{12rpx};
|
|
|
- }
|
|
|
- }
|
|
|
- .member {
|
|
|
- color: #f39800;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .second {
|
|
|
- max-height: #{650rpx};
|
|
|
- overflow-y: auto;
|
|
|
- overflow-x: hidden;
|
|
|
- padding: #{4rpx} #{24rpx};
|
|
|
- font-size: $uni-font-size-general-two;
|
|
|
- &.no-padding {
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
- .attr-group {
|
|
|
- padding: #{32rpx} 0;
|
|
|
- border-bottom: #{1rpx} solid #e2e2e2;
|
|
|
- .attr-group-name {
|
|
|
- color: $uni-general-color-one;
|
|
|
- margin-bottom: #{20rpx};
|
|
|
- }
|
|
|
- .attr-item {
|
|
|
- margin-right: #{20rpx};
|
|
|
- padding: #{15rpx 24rpx};
|
|
|
- border-radius: #{8rpx};
|
|
|
- margin-bottom: #{20rpx};
|
|
|
- &.attr-item-default {
|
|
|
- background-color: #f2f2f2;
|
|
|
- color: $uni-important-color-black;
|
|
|
- }
|
|
|
- &.active {
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- &.attr_num_0 {
|
|
|
- color: #cdcdcd;
|
|
|
- background-color: #f7f7f7;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .number-box {
|
|
|
- color: $uni-general-color-one;
|
|
|
- height: #{124rpx};
|
|
|
- .block {
|
|
|
- width: #{60rpx};
|
|
|
- height: #{60rpx};
|
|
|
- margin: 0 #{4rpx};
|
|
|
- &.disabled {
|
|
|
- background-color: #fbfbfb;
|
|
|
- color: $uni-general-color-two;
|
|
|
- }
|
|
|
- }
|
|
|
- .number-input {
|
|
|
- width: #{88rpx};
|
|
|
- height: #{60rpx};
|
|
|
- color: $uni-important-color-black;
|
|
|
- font-size: $uni-font-size-general-one;
|
|
|
- background-color: $uni-weak-color-two;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .three {
|
|
|
- height: #{110rpx};
|
|
|
- width: 100%;
|
|
|
- font-size: $uni-font-size-general-one;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .buy {
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .wholesale {
|
|
|
- .wholesale-attr-list {
|
|
|
- height: 88rpx;
|
|
|
- margin: 0 24rpx;
|
|
|
- border-bottom: 1rpx solid #e2e2e2;
|
|
|
- position: relative;
|
|
|
- &:first-of-type {
|
|
|
- border-top: 1rpx solid #e2e2e2;
|
|
|
- }
|
|
|
- .wholesale-attr-group {
|
|
|
- max-width: 200rpx;
|
|
|
- flex-shrink: 0;
|
|
|
- margin-right: 4rpx;
|
|
|
- font-size: 20rpx;
|
|
|
- color: #666666;
|
|
|
- }
|
|
|
- .right-icon {
|
|
|
- position: absolute;
|
|
|
- right: -24rpx;
|
|
|
- top: 0;
|
|
|
- height: 84rpx;
|
|
|
- padding-left: 10rpx;
|
|
|
- width: 50rpx;
|
|
|
- z-index: 10000;
|
|
|
- background-color: #fff;
|
|
|
- view {
|
|
|
- height: 40rpx;
|
|
|
- width: 3rpx;
|
|
|
- background-color: #e2e2e2;
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- top: 24rpx;
|
|
|
- }
|
|
|
- image {
|
|
|
- margin-top: 33rpx;
|
|
|
- height: 22rpx;
|
|
|
- width: 16rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .wholesale-attr-item {
|
|
|
- height: 100%;
|
|
|
- white-space : nowrap;
|
|
|
- .attr-name {
|
|
|
- margin-top: 16rpx;
|
|
|
- color: #fff;
|
|
|
- padding: 0 22rpx;
|
|
|
- height: 56rpx;
|
|
|
- line-height: 56rpx;
|
|
|
- border-radius: 8rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- margin-left: 20rpx;
|
|
|
- display: inline-block;
|
|
|
- position: relative;
|
|
|
- .attr-number {
|
|
|
- color: #fff;
|
|
|
- position: absolute;
|
|
|
- top: -15rpx;
|
|
|
- height: 30rpx;
|
|
|
- line-height: 26rpx;
|
|
|
- border: 2rpx solid #fff;
|
|
|
- padding: 0 10rpx;
|
|
|
- border-radius: 15rpx;
|
|
|
- font-size: 20rpx;
|
|
|
- z-index: 100;
|
|
|
- }
|
|
|
- &.attr-background {
|
|
|
- background-color: #f2f2f2;
|
|
|
- color: #353535;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .wholesale-attr-group-list {
|
|
|
- margin-top: 20rpx;
|
|
|
- .wholesale-attr-group {
|
|
|
- margin-bottom: 20rpx;
|
|
|
- .wholesale-attr-item {
|
|
|
- padding: 20rpx;
|
|
|
- background-color: #f7f7f7;
|
|
|
- width: 100%;
|
|
|
- .attr-name {
|
|
|
- width: 60%;
|
|
|
- .attr-price {
|
|
|
- color: #999999;
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .wholesale-number-box {
|
|
|
- color: $uni-general-color-one;
|
|
|
- .block {
|
|
|
- width: #{60rpx};
|
|
|
- height: #{60rpx};
|
|
|
- margin: 0 #{4rpx};
|
|
|
- &.disabled {
|
|
|
- background-color: #fbfbfb;
|
|
|
- color: $uni-general-color-two;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .wholesale-number-input {
|
|
|
- width: #{88rpx};
|
|
|
- height: #{60rpx};
|
|
|
- color: $uni-important-color-black;
|
|
|
- font-size: $uni-font-size-general-one;
|
|
|
- background-color: #fff;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .total {
|
|
|
- width: 100%;
|
|
|
- height: 80rpx;
|
|
|
- line-height: 80rpx;
|
|
|
- text-align: right;
|
|
|
- padding: 0 24rpx;
|
|
|
- color: #353535;
|
|
|
- font-size: 28rpx;
|
|
|
- border-top: 1rpx solid #e2e2e2;
|
|
|
- text {
|
|
|
- color: #ff4544;
|
|
|
- }
|
|
|
- }
|
|
|
- .u-attr-fixed {
|
|
|
- position: fixed;
|
|
|
- bottom: 0;
|
|
|
- left: 0;
|
|
|
- width: 100%;
|
|
|
- background-color: #ffffff;
|
|
|
- }
|
|
|
+ // this.getservice()
|
|
|
+ this.display = 'block';
|
|
|
+ },
|
|
|
+ getservice(select_val) {
|
|
|
+ console.log(select_val)
|
|
|
+ this.goods.attr.forEach((item, index) => {
|
|
|
+ let select_item_list = []
|
|
|
+ let select_item_value = ''
|
|
|
+ let attrList = item.attr_list || [];
|
|
|
+ attrList.forEach((value, key) => {
|
|
|
+ select_item_value = value.attr_group_id + '-' + value.attr_id
|
|
|
+ select_item_list.push(select_item_value)
|
|
|
+ })
|
|
|
+ if (JSON.stringify(select_val) == JSON.stringify(select_item_list)) {
|
|
|
+ console.log("进来了")
|
|
|
+ this.service_screen = item
|
|
|
+ }
|
|
|
+ console.log(this.service_screen, "oooooooooooooooo")
|
|
|
+ })
|
|
|
+ },
|
|
|
+ scrollGet(e, index) {
|
|
|
+ this.goods.attr_groups[index].scrollLeft = e.detail.scrollLeft;
|
|
|
+ this.$forceUpdate();
|
|
|
+ },
|
|
|
+ toBottom(index) {
|
|
|
+ this.$nextTick().then(() => {
|
|
|
+ this.goods.attr_groups[index].scrollLeft = 99999;
|
|
|
+ this.$forceUpdate();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ chooseAttr(index, attrItem) {
|
|
|
+ let that = this;
|
|
|
+ for (let attr of that.goods.attr_groups[index].attr_list) {
|
|
|
+ attr.active = false;
|
|
|
+ if (attr.attr_id == attrItem.attr_id && attr.attr_name == attrItem.attr_name) {
|
|
|
+ attr.active = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (index == 0) {
|
|
|
+ that.pic_url = attrItem.pic_url;
|
|
|
+ }
|
|
|
+ that.activeAttr[index].attr_id = attrItem.attr_id
|
|
|
+ that.activeAttr[index].attr_name = attrItem.attr_name
|
|
|
+ that.goodsAttr = [];
|
|
|
+ for (let item of that.goods.attr) {
|
|
|
+ let same = true;
|
|
|
+ for (let i = 0; i < item.attr_list.length - 1; i++) {
|
|
|
+ let first = {
|
|
|
+ attr_group_name: item.attr_list[i].attr_group_name,
|
|
|
+ attr_group_id: item.attr_list[i].attr_group_id,
|
|
|
+ attr_id: item.attr_list[i].attr_id,
|
|
|
+ attr_name: item.attr_list[i].attr_name
|
|
|
+ }
|
|
|
+ if (JSON.stringify(first) != JSON.stringify(this.activeAttr[i])) {
|
|
|
+ same = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (same) {
|
|
|
+ that.goodsAttr.push(item)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ that.$forceUpdate();
|
|
|
+ that.count();
|
|
|
+ },
|
|
|
+ wholesaleNumberSub(index) {
|
|
|
+ if (this.goodsAttr[index].number == 0) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ this.goodsAttr[index].number--;
|
|
|
+ if (this.goods.attr_groups.length == 1) {
|
|
|
+ this.pic_url = this.goodsAttr[index].pic_url;
|
|
|
+ }
|
|
|
+ this.count(index);
|
|
|
+ },
|
|
|
+ wholesaleNumberAdd(index) {
|
|
|
+ if (this.goodsAttr[index].number > this.goodsAttr[index].stock || this.goodsAttr[index].number == this
|
|
|
+ .goodsAttr[index].stock) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.goodsAttr[index].number++;
|
|
|
+ if (this.goods.attr_groups.length == 1) {
|
|
|
+ this.pic_url = this.goodsAttr[index].pic_url;
|
|
|
+ }
|
|
|
+ this.count(index);
|
|
|
+ },
|
|
|
+ wholesaleNumberBlur(index) {
|
|
|
+ if (+this.goodsAttr[index].number > +this.goodsAttr[index].stock) {
|
|
|
+ this.goodsAttr[index].number = this.goodsAttr[index].stock
|
|
|
+ }
|
|
|
+ if (this.goods.attr_groups.length == 1) {
|
|
|
+ this.pic_url = this.goodsAttr[index].pic_url;
|
|
|
+ }
|
|
|
+ this.count(index);
|
|
|
+ },
|
|
|
+ count(index) {
|
|
|
+ let that = this;
|
|
|
+ this.$emit('attrtap', that.goods, that.goodsAttr);
|
|
|
+ setTimeout(() => {
|
|
|
+ that.selectAttr = that.goodsAttr[index]
|
|
|
+ })
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.display = 'none';
|
|
|
+ this.$emit('close', false)
|
|
|
+ },
|
|
|
+ preventD() {},
|
|
|
+ storeAttrClick(attr_id, attr_group_id) {
|
|
|
+ let select_num = []
|
|
|
+ let attr_group_list = JSON.parse(JSON.stringify(this.newAttrGroupList));
|
|
|
+ let attrs = this.goods.attr;
|
|
|
+ let checkedAttr = [];
|
|
|
+ let attr_cart = this.attrCart;
|
|
|
+ for (let i in attr_group_list) {
|
|
|
+ for (let j in attr_group_list[i].attr_list) {
|
|
|
+ let temp = attr_group_list[i].attr_list[j];
|
|
|
+ if (parseInt(attr_group_list[i].attr_group_id) == parseInt(attr_group_id)) {
|
|
|
+ if (parseInt(temp.attr_id) === parseInt(attr_id)) {
|
|
|
+
|
|
|
+ if (temp.checked) {
|
|
|
+ temp.checked = false;
|
|
|
+ } else {
|
|
|
+ temp.checked = true;
|
|
|
+ select_num.push(
|
|
|
+ `${attr_group_list[i].attr_group_id}-${temp.attr_id}`
|
|
|
+ )
|
|
|
+ this.getservice(select_num)
|
|
|
+ }
|
|
|
+ if (temp.attr_num_0) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ temp.checked = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (temp.checked) {
|
|
|
+ if (i == 0) {
|
|
|
+ this.pic_url = attr_group_list[0].attr_list[j].pic_url;
|
|
|
+ }
|
|
|
+ checkedAttr.push(attr_group_list[i].attr_group_id + '-' + temp.attr_id);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function inArray(val, arr) {
|
|
|
+ return arr.some(function(v) {
|
|
|
+ return val == v;
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ let attrNum_0 = [];
|
|
|
+ let select_attr = null;
|
|
|
+ let number = 1;
|
|
|
+ for (let i in attrs) {
|
|
|
+ let arr = [];
|
|
|
+ let sign = 0;
|
|
|
+ for (let j in attrs[i].attr_list) {
|
|
|
+ let param = attrs[i].attr_list[j].attr_group_id + '-' + attrs[i].attr_list[j].attr_id;
|
|
|
+ if (!inArray(param, checkedAttr)) {
|
|
|
+ sign += 1;
|
|
|
+ arr.push(param);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (attrs[i].stock == 0 && sign <= 1) {
|
|
|
+ attrNum_0 = attrNum_0.concat(arr);
|
|
|
+ }
|
|
|
+ if (sign == 0) {
|
|
|
+ if (!select_attr) {
|
|
|
+ select_attr = {};
|
|
|
+ }
|
|
|
+ select_attr = attrs[i];
|
|
|
+ attr_cart.forEach(item => {
|
|
|
+
|
|
|
+ if (item.attr_id == select_attr.id) {
|
|
|
+ number = item.num;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (select_attr.stock <= 0) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '库存不足',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (select_attr.stock <= number) {
|
|
|
+ number = select_attr.stock;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (checkedAttr.length == 0) {
|
|
|
+ select_attr = null;
|
|
|
+ }
|
|
|
+
|
|
|
+ //库存为0的规格添加标识
|
|
|
+ for (let i in attr_group_list) {
|
|
|
+ for (let j in attr_group_list[i].attr_list) {
|
|
|
+ let cAttr = attr_group_list[i].attr_list[j];
|
|
|
+ let cParam = attr_group_list[i].attr_group_id + '-' + cAttr.attr_id;
|
|
|
+ if (inArray(cParam, attrNum_0) && !inArray(cParam, checkedAttr)) {
|
|
|
+ cAttr.attr_num_0 = true;
|
|
|
+ } else {
|
|
|
+ cAttr.attr_num_0 = false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.newAttrGroupList = attr_group_list;
|
|
|
+ this.selectAttr = select_attr;
|
|
|
+ this.number = number;
|
|
|
+ this.$emit('attrtap', this.selectAttr);
|
|
|
+ },
|
|
|
+ numberBlur(number) {
|
|
|
+ number = parseInt(number.value);
|
|
|
+ if (number > this.attrNum) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '库存不足',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ number = this.attrNum;
|
|
|
+ }
|
|
|
+ this.$emit('attrtap', this.selectAttr);
|
|
|
+ return this.number = number;
|
|
|
+ },
|
|
|
+ numberSub() {
|
|
|
+ let number = this.number;
|
|
|
+ if (number <= 1) {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ number--;
|
|
|
+ this.number = number;
|
|
|
+ this.$emit('attrtap', this.selectAttr);
|
|
|
+ },
|
|
|
+ numberAdd() {
|
|
|
+ let number = this.number;
|
|
|
+ number++;
|
|
|
+ if (number > this.attrNum) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '库存不足',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ this.number = this.attrNum;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.number = number;
|
|
|
+ this.$emit('attrtap', this.selectAttr);
|
|
|
+ },
|
|
|
+ cart() {
|
|
|
+ if (!this.submit()) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ let select_attr = this.selectAttr;
|
|
|
+ if (this.goods.sign === 'pick' || this.goods.sign === 'community') {
|
|
|
+ this.$emit('add', select_attr, this.number);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 普通商品
|
|
|
+ if (this.goods.type === 'goods') {
|
|
|
+ if (this.goods.sign === 'miaosha') {
|
|
|
+ this.$request({
|
|
|
+ url: this.$api.miaosha.add_cart,
|
|
|
+ data: {
|
|
|
+ miaosha_goods_id: select_attr.goods_id,
|
|
|
+ attr_id: select_attr.id,
|
|
|
+ num: this.number
|
|
|
+ },
|
|
|
+ method: 'post'
|
|
|
+ }).then(e => {
|
|
|
+ uni.showToast({
|
|
|
+ title: e.msg,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.display = 'none';
|
|
|
+ this.selectAttr.number = this.number;
|
|
|
+ this.$emit('selectNumber', this.selectAttr);
|
|
|
+ }).catch(() => {
|
|
|
+ this.display = 'none';
|
|
|
+ });
|
|
|
+ } else if (this.goods.sign === 'flash_sale') {
|
|
|
+ this.$request({
|
|
|
+ url: this.$api.flash_sale.add_cart,
|
|
|
+ data: {
|
|
|
+ flash_goods_id: select_attr.goods_id,
|
|
|
+ attr_id: select_attr.id,
|
|
|
+ num: this.number
|
|
|
+ },
|
|
|
+ method: 'post'
|
|
|
+ }).then(e => {
|
|
|
+ uni.showToast({
|
|
|
+ title: e.msg,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.display = 'none';
|
|
|
+ this.selectAttr.number = this.number;
|
|
|
+ this.$emit('selectNumber', this.selectAttr);
|
|
|
+ }).catch(() => {
|
|
|
+ this.display = 'none';
|
|
|
+ });
|
|
|
+ } else if (this.goods.sign == 'wholesale') {
|
|
|
+ if (this.totalNumber < this.goods.wholesaleGoods.rise_num) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '至少采购' + this.goods.wholesaleGoods.rise_num + this.goods.unit,
|
|
|
+ image: '/static/image/plugins/tip.png',
|
|
|
+ duration: 1000
|
|
|
+ });
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let para = [];
|
|
|
+ for (let item of this.goods.attr) {
|
|
|
+ if (item.number > 0) {
|
|
|
+ para.push(item)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$request({
|
|
|
+ url: this.$api.wholesale.cart,
|
|
|
+ data: {
|
|
|
+ attr: JSON.stringify(para)
|
|
|
+ },
|
|
|
+ method: 'post'
|
|
|
+ }).then(response => {
|
|
|
+ this.display = 'none';
|
|
|
+ if (response.code === 0) {
|
|
|
+ for (let item of this.goods.attr) {
|
|
|
+ item.number = '0'
|
|
|
+ }
|
|
|
+ for (let item of this.goodsAttr) {
|
|
|
+ item.number = '0'
|
|
|
+ }
|
|
|
+ this.count();
|
|
|
+ uni.hideLoading();
|
|
|
+ uni.showToast({
|
|
|
+ title: '添加成功',
|
|
|
+ duration: 1000
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }).catch(response => {
|
|
|
+ this.display = 'none';
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$request({
|
|
|
+ url: this.$api.cart.add,
|
|
|
+ data: {
|
|
|
+ goods_id: select_attr.goods_id,
|
|
|
+ attr: select_attr.id,
|
|
|
+ num: this.number
|
|
|
+ },
|
|
|
+ method: 'post'
|
|
|
+ }).then(e => {
|
|
|
+ if (e.code === 0) {
|
|
|
+ uni.showToast({
|
|
|
+ title: e.msg,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.display = 'none';
|
|
|
+ this.selectAttr.number = this.number;
|
|
|
+ this.$emit('selectNumber', this.selectAttr);
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: e.msg,
|
|
|
+ icon: "none",
|
|
|
+ duration: 2500
|
|
|
+ });
|
|
|
+ this.display = 'none';
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ this.display = 'none';
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 虚拟商品
|
|
|
+ } else if (this.goods.type === 'ecard') {
|
|
|
+ uni.showToast({
|
|
|
+ title: '虚拟商品不允许加入购物车',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ buy() {
|
|
|
+ if (this.$user.isLogin() && this.$store.state.user.info) {
|
|
|
+ let member_level = this.$store.state.user.info.identity.member_level;
|
|
|
+ if (member_level < this.goods.member_level) {
|
|
|
+ uni.showModal({
|
|
|
+ title: "提示",
|
|
|
+ content: "需达到" + this.goods.member_name + "会员才可购买",
|
|
|
+ showCancel: true,
|
|
|
+ buttonText: '升级',
|
|
|
+ success: (res) => {
|
|
|
+ if (res.confirm) {
|
|
|
+ uni.navigateTo({
|
|
|
+ // url:"/pages/member/index/index",
|
|
|
+ url: '/pages/member/upgrade/upgrade?level=' + member_level +
|
|
|
+ '&other=' + this.goods.member_level
|
|
|
+ })
|
|
|
+ } else if (res.cancel) {
|
|
|
+ console.log('用户点击取消');
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ if (!this.submit()) return false;
|
|
|
+ if (this.noPay) {
|
|
|
+ this.$emit('pay', this.number);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (this.buyClick) {
|
|
|
+ this.display = 'none';
|
|
|
+ this.selectAttr.number = this.number;
|
|
|
+ this.$emit('buyClick', this.selectAttr);
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (this.goods.sign == 'wholesale') {
|
|
|
+ if (this.totalNumber < this.goods.wholesaleGoods.rise_num) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '至少采购' + this.goods.wholesaleGoods.rise_num + this.goods.unit,
|
|
|
+ image: '/static/image/plugins/tip.png',
|
|
|
+ duration: 1000
|
|
|
+ });
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let para = {};
|
|
|
+ let mch_list = [{
|
|
|
+ mch_id: 0,
|
|
|
+ goods_list: []
|
|
|
+ }];
|
|
|
+ for (let item of this.goods.attr) {
|
|
|
+ if (item.number > 0) {
|
|
|
+ para = {
|
|
|
+ id: item.goods_id,
|
|
|
+ attr: [],
|
|
|
+ num: item.number,
|
|
|
+ cat_id: 0,
|
|
|
+ goods_attr_id: item.id
|
|
|
+ }
|
|
|
+ for (let attr of item.attr_list) {
|
|
|
+ let attrList = {
|
|
|
+ attr_id: attr.attr_id,
|
|
|
+ attr_group_id: attr.attr_group_id
|
|
|
+ }
|
|
|
+ para.attr.push(attrList)
|
|
|
+
|
|
|
+ }
|
|
|
+ mch_list[0].goods_list.push(para)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let url = `/pages/order-submit/order-submit?mch_list=${JSON.stringify(mch_list)}`;
|
|
|
+ if (this.submitUrl && this.previewUrl) {
|
|
|
+ url +=
|
|
|
+ `&preview_url=${encodeURIComponent(this.previewUrl)}&submit_url=${encodeURIComponent(this.submitUrl)}&plugin=${this.plugin}`;
|
|
|
+ }
|
|
|
+ uni.navigateTo({
|
|
|
+ url: url
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ let goods = this.goods;
|
|
|
+ let number = this.number;
|
|
|
+ let select_attr = this.selectAttr;
|
|
|
+ let goods_attr_id = select_attr.id;
|
|
|
+ let attr = [];
|
|
|
+ for (let i in select_attr.attr_list) {
|
|
|
+ attr.push({
|
|
|
+ attr_id: select_attr.attr_list[i].attr_id,
|
|
|
+ attr_group_id: select_attr.attr_list[i].attr_group_id
|
|
|
+ });
|
|
|
+ }
|
|
|
+ let mch_list = [{
|
|
|
+ mch_id: goods.mch_id ? goods.mch_id : 0,
|
|
|
+ goods_list: [{
|
|
|
+ id: this.goodsId ? this.goodsId : goods.id,
|
|
|
+ attr: attr,
|
|
|
+ num: number,
|
|
|
+ cat_id: 0,
|
|
|
+ goods_attr_id: goods_attr_id
|
|
|
+ }]
|
|
|
+ }];
|
|
|
+ let url = `/pages/order-submit/order-submit?mch_list=${JSON.stringify(mch_list)}`;
|
|
|
+ if (this.submitUrl && this.previewUrl) {
|
|
|
+ url +=
|
|
|
+ `&preview_url=${encodeURIComponent(this.previewUrl)}&submit_url=${encodeURIComponent(this.submitUrl)}&plugin=${this.plugin}`;
|
|
|
+ }
|
|
|
+ uni.navigateTo({
|
|
|
+ url: url
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ let select_attr = this.selectAttr;
|
|
|
+ if (this.goods.sign === 'wholesale') {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ if (!select_attr) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '请先选规格',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (select_attr.stock <= 0) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '库存不足',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (this.number <= 0) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '数量不能为0',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (!this.goods) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ clickImg(src) {
|
|
|
+ uni.previewImage({
|
|
|
+ current: 0,
|
|
|
+ urls: [src]
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState({
|
|
|
+ gConfig: state => state.gConfig,
|
|
|
+ }),
|
|
|
+ attrPic() {
|
|
|
+ if (this.pic_url) {
|
|
|
+ return this.pic_url;
|
|
|
+ } else if (this.goods) {
|
|
|
+ return this.goods.cover_pic;
|
|
|
+ } else {
|
|
|
+ return ``;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ priceColor() {
|
|
|
+ if (this.goods && this.goods.level_show === 1) {
|
|
|
+ return `member`;
|
|
|
+ } else {
|
|
|
+ return this.theme + '-color';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ attrNum() {
|
|
|
+ if (this.selectAttr) {
|
|
|
+ return this.selectAttr.stock;
|
|
|
+ } else if (this.goods) {
|
|
|
+ return this.goods.goods_num;
|
|
|
+ } else {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ attrPrice() {
|
|
|
+ if (this.selectAttr) {
|
|
|
+ let price;
|
|
|
+ if (this.goods.level_show === 1) {
|
|
|
+ price = this.selectAttr.price_member
|
|
|
+ } else {
|
|
|
+ price = this.selectAttr.price;
|
|
|
+ }
|
|
|
+ if (this.sign == 'wholesale') {
|
|
|
+ if (this.selectAttr.number == 0) {
|
|
|
+ return 'undefined'
|
|
|
+ }
|
|
|
+ if (this.wholesaleType == 0) {
|
|
|
+ price = (price * (this.discount / 10)).toFixed(2);
|
|
|
+ return price
|
|
|
+ } else {
|
|
|
+ price = (price - this.discount).toFixed(2);
|
|
|
+ return price
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return price
|
|
|
+ }
|
|
|
+ } else if (this.sign == 'wholesale') {
|
|
|
+ return 'undefined';
|
|
|
+ } else if (this.goods) {
|
|
|
+ if (this.goods.hasOwnProperty('price_min')) {
|
|
|
+ return this.goods.price_min;
|
|
|
+ } else {
|
|
|
+ return this.goods.price;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ newData() {
|
|
|
+ const {
|
|
|
+ number,
|
|
|
+ display,
|
|
|
+ selectAttr
|
|
|
+ } = this;
|
|
|
+ return {
|
|
|
+ number,
|
|
|
+ display,
|
|
|
+ selectAttr
|
|
|
+ }
|
|
|
+ },
|
|
|
+ themeObject: function() {
|
|
|
+ return {
|
|
|
+ back: this.theme + '-m-back ' + this.theme,
|
|
|
+ theme: this.theme,
|
|
|
+ color: this.theme + '-m-text ' + this.theme,
|
|
|
+ sBack: this.theme + '-s-back ' + this.theme
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ...mapGetters('iPhoneX', {
|
|
|
+ boolEmpty: 'getBoolEmpty'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .app-attr {
|
|
|
+ background-color: #ffffff;
|
|
|
+
|
|
|
+ .modal {
|
|
|
+ background-color: rgba(0, 0, 0, 0.5);
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ z-index: 1603;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: #{16rpx} #{16rpx} 0 0;
|
|
|
+
|
|
|
+ .close {
|
|
|
+ width: #{30rpx};
|
|
|
+ height: #{30rpx};
|
|
|
+ position: absolute;
|
|
|
+ right: #{24rpx};
|
|
|
+ top: #{24rpx};
|
|
|
+ background-color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .first {
|
|
|
+ margin: 0 #{24rpx};
|
|
|
+ border-bottom: #{1rpx} solid #e2e2e2;
|
|
|
+
|
|
|
+ &.no-border {
|
|
|
+ border-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: #{200rpx};
|
|
|
+ height: #{200rpx};
|
|
|
+ border: #{4rpx} solid #ffffff;
|
|
|
+ border-radius: #{8rpx};
|
|
|
+ margin-top: #{-64rpx};
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info {
|
|
|
+ margin: #{36rpx} 0 #{26rpx} #{24rpx};
|
|
|
+ font-size: $uni-font-size-import-two;
|
|
|
+ line-height: 1;
|
|
|
+
|
|
|
+ .stock {
|
|
|
+ font-size: $uni-font-size-weak-one;
|
|
|
+ color: $uni-general-color-two;
|
|
|
+ margin-top: #{18rpx};
|
|
|
+ }
|
|
|
+
|
|
|
+ view {
|
|
|
+ &:first-child {
|
|
|
+ margin-right: #{12rpx};
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .member {
|
|
|
+ color: #f39800;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .second {
|
|
|
+ max-height: #{650rpx};
|
|
|
+ overflow-y: auto;
|
|
|
+ overflow-x: hidden;
|
|
|
+ padding: #{4rpx} #{24rpx};
|
|
|
+ font-size: $uni-font-size-general-two;
|
|
|
+
|
|
|
+ &.no-padding {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .attr-group {
|
|
|
+ padding: #{32rpx} 0;
|
|
|
+ border-bottom: #{1rpx} solid #e2e2e2;
|
|
|
+
|
|
|
+ .attr-group-name {
|
|
|
+ color: $uni-general-color-one;
|
|
|
+ margin-bottom: #{20rpx};
|
|
|
+ }
|
|
|
+
|
|
|
+ .attr-item {
|
|
|
+ margin-right: #{20rpx};
|
|
|
+ padding: #{15rpx 24rpx};
|
|
|
+ border-radius: #{8rpx};
|
|
|
+ margin-bottom: #{20rpx};
|
|
|
+
|
|
|
+ &.attr-item-default {
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ color: $uni-important-color-black;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.attr_num_0 {
|
|
|
+ color: #cdcdcd;
|
|
|
+ background-color: #f7f7f7;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .number-box {
|
|
|
+ color: $uni-general-color-one;
|
|
|
+ height: #{124rpx};
|
|
|
+
|
|
|
+ .block {
|
|
|
+ width: #{60rpx};
|
|
|
+ height: #{60rpx};
|
|
|
+ margin: 0 #{4rpx};
|
|
|
+
|
|
|
+ &.disabled {
|
|
|
+ background-color: #fbfbfb;
|
|
|
+ color: $uni-general-color-two;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .number-input {
|
|
|
+ width: #{88rpx};
|
|
|
+ height: #{60rpx};
|
|
|
+ color: $uni-important-color-black;
|
|
|
+ font-size: $uni-font-size-general-one;
|
|
|
+ background-color: $uni-weak-color-two;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .three {
|
|
|
+ height: #{110rpx};
|
|
|
+ width: 100%;
|
|
|
+ font-size: $uni-font-size-general-one;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .buy {
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wholesale {
|
|
|
+ .wholesale-attr-list {
|
|
|
+ height: 88rpx;
|
|
|
+ margin: 0 24rpx;
|
|
|
+ border-bottom: 1rpx solid #e2e2e2;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &:first-of-type {
|
|
|
+ border-top: 1rpx solid #e2e2e2;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wholesale-attr-group {
|
|
|
+ max-width: 200rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ margin-right: 4rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-icon {
|
|
|
+ position: absolute;
|
|
|
+ right: -24rpx;
|
|
|
+ top: 0;
|
|
|
+ height: 84rpx;
|
|
|
+ padding-left: 10rpx;
|
|
|
+ width: 50rpx;
|
|
|
+ z-index: 10000;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ view {
|
|
|
+ height: 40rpx;
|
|
|
+ width: 3rpx;
|
|
|
+ background-color: #e2e2e2;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ image {
|
|
|
+ margin-top: 33rpx;
|
|
|
+ height: 22rpx;
|
|
|
+ width: 16rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .wholesale-attr-item {
|
|
|
+ height: 100%;
|
|
|
+ white-space: nowrap;
|
|
|
+
|
|
|
+ .attr-name {
|
|
|
+ margin-top: 16rpx;
|
|
|
+ color: #fff;
|
|
|
+ padding: 0 22rpx;
|
|
|
+ height: 56rpx;
|
|
|
+ line-height: 56rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ margin-left: 20rpx;
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .attr-number {
|
|
|
+ color: #fff;
|
|
|
+ position: absolute;
|
|
|
+ top: -15rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ line-height: 26rpx;
|
|
|
+ border: 2rpx solid #fff;
|
|
|
+ padding: 0 10rpx;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
+ z-index: 100;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.attr-background {
|
|
|
+ background-color: #f2f2f2;
|
|
|
+ color: #353535;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .wholesale-attr-group-list {
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .wholesale-attr-group {
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ .wholesale-attr-item {
|
|
|
+ padding: 20rpx;
|
|
|
+ background-color: #f7f7f7;
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ .attr-name {
|
|
|
+ width: 60%;
|
|
|
+
|
|
|
+ .attr-price {
|
|
|
+ color: #999999;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .wholesale-number-box {
|
|
|
+ color: $uni-general-color-one;
|
|
|
+
|
|
|
+ .block {
|
|
|
+ width: #{60rpx};
|
|
|
+ height: #{60rpx};
|
|
|
+ margin: 0 #{4rpx};
|
|
|
+
|
|
|
+ &.disabled {
|
|
|
+ background-color: #fbfbfb;
|
|
|
+ color: $uni-general-color-two;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .wholesale-number-input {
|
|
|
+ width: #{88rpx};
|
|
|
+ height: #{60rpx};
|
|
|
+ color: $uni-important-color-black;
|
|
|
+ font-size: $uni-font-size-general-one;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .total {
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ text-align: right;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ color: #353535;
|
|
|
+ font-size: 28rpx;
|
|
|
+ border-top: 1rpx solid #e2e2e2;
|
|
|
+
|
|
|
+ text {
|
|
|
+ color: #ff4544;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .u-attr-fixed {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #ffffff;
|
|
|
+ }
|
|
|
</style>
|
宇宙无敌M1处理器的MacBook Pro
