commit

 <template>
   <div class="article-item-slide">
-    <Slide :data="data.slides" :threshold="0.2" :auto-play="false" :loop="false" :options="scrollOption">
+    <Slide :data="data.slides" :threshold="0.2" :auto-play="false" :loop="false" :options="scrollOption" @change="onChange">
       <SlideItem v-for="(item, inx) in data.slides" :key="inx">
         <ImageFormat :lazy="data.index > 0" class="image-slide-item" :src="item.src"></ImageFormat>
       </SlideItem>
@@ -12,6 +12,9 @@
         </span>
       </template>
     </Slide>
+    <div class="pages">
+      {{currentIndex}}<span class="small">/{{data.slides.length}}</span>
+    </div>
   </div>
 </template>
 
@@ -33,9 +36,13 @@ export default {
       scrollOption: {
         eventPassthrough: 'vertical'
       },
+      currentIndex: 1,
     };
   },
   methods: {
+    onChange(inx) {
+      this.currentIndex = inx + 1;
+    },
     dotClass(current, inx) {
       const offset = 1;
       const len = this.data.slides.length;
@@ -75,6 +82,8 @@ export default {
 
 <style lang="scss" scoped>
 .article-item-slide {
+  position: relative;
+
   & /deep/ .cube-slide-dots {
     position: absolute;
     left: 0;
@@ -108,4 +117,24 @@ export default {
   height: 750px;
 }
 
+.pages {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 88px;
+  height: 54px;
+  background: rgba($color: #000, $alpha: 0.5);
+  border-radius: 0 0 0 30px;
+  color: #fff;
+  font-size: 28px;
+  display: flex;
+  line-height: 24px;
+  justify-content: center;
+  align-items: center;
+
+  .small {
+    transform: scale(0.7);
+    padding-top: 3PX;
+  }
+}
 </style>

@@ -39,7 +39,7 @@ exports.devServer = (app, cb) => {
   };
 
   clientConfig.entry.app = ['./build/client-hot.js', clientConfig.entry.app];
-  clientConfig.output.publicPath = 'http://172.16.12.62:6005/';
+  clientConfig.output.publicPath = 'http://m.yohobuy.com:6005/';
   clientConfig.output.filename = '[name].js';
   clientConfig.plugins.push(
     new webpack.HotModuleReplacementPlugin(),

@@ -49,16 +49,16 @@
     "serve-favicon": "^2.5.0",
     "source-map": "^0.7.3",
     "uuid": "^3.3.2",
-    "vue": "^2.5.20",
+    "vue": "^2.6.6",
     "vue-awesome-swiper": "^3.1.3",
     "vue-infinite-scroll": "^2.0.2",
     "vue-lazyload": "^1.2.6",
-    "vue-loader": "^15.4.2",
+    "vue-loader": "^15.6.2",
     "vue-navigation": "^1.1.4",
     "vue-router": "^3.0.2",
-    "vue-server-renderer": "^2.5.20",
+    "vue-server-renderer": "^2.6.6",
     "vue-style-loader": "^4.1.2",
-    "vue-template-compiler": "^2.5.20",
+    "vue-template-compiler": "^2.6.6",
     "vue-touch": "^1.1.0",
     "vue-virtual-scroll-list": "^1.2.8",
     "vuex": "^3.0.1",