new

src/components/goods/goods.vue

@@ -37,14 +37,13 @@
         </li>
       </ul>
     </div>
-    <shopCart :delivery-price="seller.deliveryPrice" :min-price="seller.minPrice"></shopCart>
+    <shopCart :select-foods="selectFoods" :delivery-price="seller.deliveryPrice" :min-price="seller.minPrice"></shopCart>
   </div>
 </template>
 <script type="text/ecmascript-6">
   import BScroll from 'better-scroll';
   import shopCart from '../shopcart/shopCart.vue';
   import cartControl from '../cartControl/cartControl.vue';
-
   const ERR_OK = 0;
   export default {
     props: {
@@ -92,16 +91,16 @@
         let foods = [];
         this.goods.forEach((good) => {
           good.foods.forEach((food) => {
-
-          })
-        })
+            if (food.count) {
+              foods.push(food);
+            }
+          });
+        });
+        return foods;
       }
-
     },
     methods: {
       _initScroll() {
-//        console.log(this.$refs);
-//        console.log((this.$refs.menuWrapper));
         this.menuScroll = new BScroll(this.$refs.menuWrapper, {
           click: true
         });
@@ -129,6 +128,9 @@
         let foodList = this.$refs.foodWrapper.getElementsByClassName('food-list-hook');
         let el = foodList[index];
         this.foodScroll.scrollToElement(el, 300);
+      },
+      cartAdd: function (target) {
+        console.log(target);
       }
     },
     components: {

src/components/shopcart/shopCart.styl

@@ -87,3 +87,25 @@
         &.enough
           background #00b43c
           color #ffffff
+  .ball-container
+    .ball
+      position fixed
+      left 32px
+      bottom 22px
+      z-index 200
+      &.fade-enter-active, &.fade-leave-active {
+        transition: all 0.4s linear
+      }
+      &.fade-enter, &.fade-leave-active {
+        opacity: 0
+        transform translate3d(24px, 0, 0)
+      }
+      .inner
+        width 16px
+        height 16px
+        border-radius 50%
+        background rgb(0,160,220)
+        transition: all 0.4s
+
+
+

src/components/shopcart/shopcart.vue

@@ -13,11 +13,21 @@
       </div>
       <div class="content-right ">
         <div class="pay" :class="payClass">
-         {{payDesc}}
+          {{payDesc}}
         </div>
       </div>
     </div>
+    <div class="ball-container">
+      <trabsition name="fade">
+        <div v-for="ball in balls" v-show="ball.show">
+          <trabsition>
+            <div class="inner">
 
+            </div>
+          </trabsition>
+        </div>
+      </trabsition>
+    </div>
   </div>
 </template>
 
@@ -39,6 +49,11 @@
         default: 0
       }
     },
+    data () {
+      return {
+        balls: [{show: false}, {show: false}, {show: false}, {show: false}, {show: false}]
+      };
+    },
     computed: {
       totalPrice() {
         let total = 0;