cps：邀请好友-分享提示

htmldev/cps/src/views/recommend/index.vue

@@ -6,23 +6,45 @@
     <div class="footer">
       <van-button
         class="save"
-        type="default">保存到手机
+        type="default"
+        @click="handleSave">保存到手机
       </van-button>
       <van-button
         class="share"
-        type="default">邀请微信好友
+        type="default"
+        @click="booShareTip = true">邀请微信好友
       </van-button>
     </div>
+    <!--弹窗：分享提示-->
+    <van-popup
+      class="fbt-van-popup-share"
+      position="top"
+      v-model="booShareTip">
+      <img
+        src="./image/icon_01@2x.png"
+        alt="">
+    </van-popup>
   </div>
 </template>
 
 <script>
-import { Button } from 'vant'
+import { Button, Popup, Notify } from 'vant'
 
 export default {
   name: 'index',
   components: {
-    'van-button': Button
+    'van-button': Button,
+    'van-popup': Popup
+  },
+  data () {
+    return {
+      booShareTip: false
+    }
+  },
+  methods: {
+    handleSave () {
+      Notify({ type: 'success', message: '长按图片保存到手机' })
+    }
   }
 }
 </script>
@@ -94,4 +116,14 @@ export default {
     line-height: 20px;
   }
 }
+
+.fbt-van-popup-share {
+  background: transparent;
+
+  img {
+    display: block;
+    width: 100%;
+    height: 286px;
+  }
+}
 </style>