购买页面修改

src/pages/pay/index.vue

 <template>
   <div class="pay-bg2">
     <div class="top-view">
-      <img src="../../assets/images/pay/top-bj.png" alt="" class="bj">
-      <img src="../../assets/images/pay/top-btn.png" alt="" class="btn" @click="goPay">
+      <img src="../../assets/images/pay/top-bj.png" alt="" class="bj" v-if="!isSystem">
+      <img src="../../assets/images/pay/top-bj-ios.png" alt="" class="bj" v-if="isSystem">
+      <img src="../../assets/images/pay/top-btn.png" alt="" class="btn" @click="goPay" v-if="!isSystem">
+      <img src="../../assets/images/pay/top-btn-ios.png" alt="" class="btn" @click="goPayIos" v-if="isSystem">
       <img src="../../assets/images/pay/c1.png" alt="" class="content">
     </div>
     <div class="main-cen">
@@ -11,7 +13,7 @@
       <img src="../../assets/images/pay/c4.png" alt="" class="c4">
       <img src="../../assets/images/pay/c5.png" alt="" class="c5">
     </div>
-    <div class="btn-box">
+    <div class="btn-box" v-if="!isSystem">
       <div class="text">
         <div class="fle">
           <div class="l">特惠价</div>
@@ -26,6 +28,7 @@
       <div class="btn" v-if="orderStatus === -1" @click="goMyOrder">待支付</div>
       <div class="btn" @click="goPay" v-if="orderStatus === 0">续费</div>
     </div>
+    <img @click="goPayIos" src="../../assets/images/pay/bottom-btn-ios.png" alt="" class="b-b-i" v-if="isSystem">
     <!-- <img src="../../assets/images/pay1.png" alt />
     <img src="../../assets/images/pay2.png" alt />
     <div class="img-con">
@@ -72,6 +75,7 @@ export default {
         ? '6684359515615264768'
         : '6682927830365372416'
     return {
+      isSystem: 1,
       isPopShow: false,
       expireDay: 0,
       userId: '',
@@ -86,6 +90,9 @@ export default {
       orderStatus: 100
     }
   },
+  created() {
+    this.appSource()
+  },
   mounted() {
     api.getOrderStatus().then(res => {
       this.expireDay = res.expire_day
@@ -93,6 +100,18 @@ export default {
     })
   },
   methods: {
+    goPayIos() {},
+    appSource() {
+      const u = navigator.userAgent
+      const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
+      if (isiOS) {
+        // this.$utils.msgshow('ios')
+        this.isSystem = 1
+      } else {
+        // this.$utils.msgshow('安卓')
+        this.isSystem = 0
+      }
+    },
     imagePreview() {
       ImagePreview(['https://zws-imgs-pub.ezijing.com/static/public/dcef7bc62237a077b10d7e49c44a1e51.jpg'])
     },
@@ -304,4 +323,10 @@ export default {
     }
   }
 }
+.b-b-i{
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+}
 </style>

src/pages/pay/payPage.vue

 <template>
   <div class="pay-bg2">
     <div class="top-view">
-      <img src="../../assets/images/pay/top-bj.png" alt="" class="bj">
-      <img src="../../assets/images/pay/top-btn.png" alt="" class="btn" @click="goPay">
+      <img src="../../assets/images/pay/top-bj.png" alt="" class="bj" v-if="!isSystem">
+      <img src="../../assets/images/pay/top-bj-ios.png" alt="" class="bj" v-if="isSystem">
+      <img src="../../assets/images/pay/top-btn.png" alt="" class="btn" @click="goPay" v-if="!isSystem">
+      <img src="../../assets/images/pay/top-btn-ios.png" alt="" class="btn" @click="goPayIos" v-if="isSystem">
       <img src="../../assets/images/pay/c1.png" alt="" class="content">
     </div>
     <div class="main-cen">
@@ -11,7 +13,7 @@
       <img src="../../assets/images/pay/c4.png" alt="" class="c4">
       <img src="../../assets/images/pay/c5.png" alt="" class="c5">
     </div>
-    <div class="btn-box">
+    <div class="btn-box" v-if="!isSystem">
       <div class="text">
         <div class="fle">
           <div class="l">特惠价</div>
@@ -26,6 +28,7 @@
       <div class="btn" v-if="orderStatus === -1" @click="goMyOrder">待支付</div>
       <div class="btn" @click="goPay" v-if="orderStatus === 0">续费</div>
     </div>
+    <img @click="goPayIos" src="../../assets/images/pay/bottom-btn-ios.png" alt="" class="b-b-i" v-if="isSystem">
     <!-- <img src="../../assets/images/pay1.png" alt />
     <img src="../../assets/images/pay2.png" alt />
     <div class="img-con">
@@ -72,6 +75,7 @@ export default {
         ? '6684359515615264768'
         : '6682927830365372416'
     return {
+      isSystem: 1,
       isPopShow: false,
       expireDay: 0,
       userId: '',
@@ -86,6 +90,9 @@ export default {
       orderStatus: 100
     }
   },
+  created() {
+    this.appSource()
+  },
   mounted() {
     api.getOrderStatus().then(res => {
       this.expireDay = res.expire_day
@@ -93,6 +100,18 @@ export default {
     })
   },
   methods: {
+    goPayIos() {},
+    appSource() {
+      const u = navigator.userAgent
+      const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
+      if (isiOS) {
+        // this.$utils.msgshow('ios')
+        this.isSystem = 1
+      } else {
+        // this.$utils.msgshow('安卓')
+        this.isSystem = 0
+      }
+    },
     imagePreview() {
       ImagePreview(['https://zws-imgs-pub.ezijing.com/static/public/dcef7bc62237a077b10d7e49c44a1e51.jpg'])
     },
@@ -304,4 +323,10 @@ export default {
     }
   }
 }
+.b-b-i{
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+}
 </style>