移动端开发

src/config/router.config.js

@@ -63,7 +63,7 @@ export const asyncRouterMap = [{
             {
             {
                 path: 'packageUpgrade',
                 path: 'packageUpgrade',
                 name: 'packageUpgrade',
                 name: 'packageUpgrade',
-                component: () => import('@views/hhr-view/bandwidth/packageUpgrade.vue')
+                component: () => import('@views/hhr-view/packageUpgrade/packageUpgrade.vue')
             }
             }
         ]
         ]
     }
     }

src/views/hhr-view/hhrCustomer.vue

@@ -12,7 +12,7 @@
             <div @click="newcartouch" style="background-image: url('./picture/hhr/03.png'); width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;">
             <div @click="newcartouch" style="background-image: url('./picture/hhr/03.png'); width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;">
             </div>
             </div>
             <div style="text-align: center;color: white;font-size: 14px;margin-top: -20px">（新开卡优惠+0息分期购机）</div>
             <div style="text-align: center;color: white;font-size: 14px;margin-top: -20px">（新开卡优惠+0息分期购机）</div>
-            <div style="background-image: url('./picture/hhr/04.png'); width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;"></div>
+            <div @click="packageUpgrade" style="background-image: url('./picture/hhr/04.png'); width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;"></div>
             <div @click="newcartouchB" style="background-image: url('./picture/hhr/05.png'); width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;"></div>
             <div @click="newcartouchB" style="background-image: url('./picture/hhr/05.png'); width: 256px; height: 64px;margin: 20px auto; background-repeat: no-repeat;background-size: 100%;"></div>
             <fieldset class="layui-elem-field"
             <fieldset class="layui-elem-field"
                       style="width: 85%;margin: 0 auto;border-radius: 10px;margin-bottom: 10px;background-color: rgba(255,255,255, 0.8);">
                       style="width: 85%;margin: 0 auto;border-radius: 10px;margin-bottom: 10px;background-color: rgba(255,255,255, 0.8);">
@@ -83,6 +83,9 @@
             },
             },
             rongHe(){
             rongHe(){
                 this.$router.push({path: 'rongHe'})
                 this.$router.push({path: 'rongHe'})
+            },
+            packageUpgrade(){
+            this.$router.push({path: 'packageUpgrade'})
         }
         }
         }
         }
     }
     }

src/views/hhr-view/packageUpgrade/packageUpgrade.vue

 <template>
 <template>
+    <div style=" background-image: url('./picture/hhr/yrym-ruanyan-adv-bg.jpg');
+    background-repeat: no-repeat;
+    background-size: 100%;
+    width: 100%;
+    height: 150%; position:relative">
+        <div style="height:500px"></div>
         <div>
         <div>
-        <img src="/picture/hhr/adv_img.jpg" style="width: 100%">
-        <van-button type="info" :round="true" size="large">我要领卡</van-button>
+            <van-button round block type="info" native-type="submit">优惠查询</van-button>
         </div>
         </div>
+    </div>
+
 </template>
 </template>
 
 
 <script>
 <script>