소스 검색

添加空中云汇Hpp页面

soobin 2 년 전
부모
커밋
481e17dcfa
3개의 변경된 파일179개의 추가작업 그리고 2개의 파일을 삭제
  1. 2 1
      package.json
  2. 2 1
      src/router/index.js
  3. 175 0
      src/views/Hpp.vue

+ 2 - 1
package.json

@@ -10,6 +10,7 @@
     "lint": "vue-cli-service lint"
     "lint": "vue-cli-service lint"
   },
   },
   "dependencies": {
   "dependencies": {
+    "airwallex-payment-elements": "latest",
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@vant/touch-emulator": "^1.4.0",
     "@vant/touch-emulator": "^1.4.0",
     "axios": "^0.20.0",
     "axios": "^0.20.0",
@@ -57,7 +58,7 @@
     },
     },
     "rules": {
     "rules": {
       "no-irregular-whitespace": "off",
       "no-irregular-whitespace": "off",
-	  "no-mixed-spaces-and-tabs":0
+      "no-mixed-spaces-and-tabs": 0
     }
     }
   },
   },
   "browserslist": [
   "browserslist": [

+ 2 - 1
src/router/index.js

@@ -111,7 +111,8 @@ const router = createRouter({
     { path: '/viewPosition', name: 'viewPosition', component: () => import('@/views/device/viewPosition/index'), meta: { index: 1 } },  
     { path: '/viewPosition', name: 'viewPosition', component: () => import('@/views/device/viewPosition/index'), meta: { index: 1 } },  
     // 设备编辑-编辑规则
     // 设备编辑-编辑规则
     { path: '/editAdRule', name: 'editAdRule', component: () => import('@/views/device/editAdRule/index'), meta: { index: 1 } },
     { path: '/editAdRule', name: 'editAdRule', component: () => import('@/views/device/editAdRule/index'), meta: { index: 1 } },
-    
+    // 跳转空中云汇
+	{ path: '/hpp', name: 'Hpp', component: () => import('@/views/Hpp.vue'), meta: { index: 1, noLogin: true } },
   ]
   ]
 });
 });
 // 路由守卫处理
 // 路由守卫处理

+ 175 - 0
src/views/Hpp.vue

@@ -0,0 +1,175 @@
+<template>
+  <div>
+    <h2>申泽智能</h2>
+    <button @click="redirectHpp()">Redirect to HPP</button>
+  </div>
+</template>
+
+<script>
+import { redirectToCheckout, loadAirwallex } from 'airwallex-payment-elements';
+import { useRoute } from "vue-router";
+
+export default {
+  name: 'Hpp',
+  
+  setup() {
+	const mode = 'payment';
+	const route = useRoute();
+	// const router = useRouter();
+	console.log(route.query.intent_id)
+  	const redirectHppForCheckout = () => {
+  	  redirectToCheckout({
+  	    env: 'demo',
+  	    mode,
+  	    currency: route.query.currency,
+  	    intent_id: route.query.intent_id,
+  	    client_secret: route.query.client_secret,
+  		//主题
+  	    theme: {
+  	      fonts: [
+  	        {
+  	          src: 'https://checkout.airwallex.com/fonts/CircularXXWeb/CircularXXWeb-Regular.woff2',
+  	          family: 'AxLLCircular',
+  	          weight: 400,
+  	        },
+  	      ],
+  	    },
+  	    // successUrl: 'https://www.baidu.com', // 支付成功跳转页面
+  	    // failUrl: 'https://www.baidu.com', // 支付失败跳转页面
+  		logoUrl: '', //支付页面展示商户LOGO
+  	  });
+  	};
+  	const redirectHppForRecurring = () => {
+  	  redirectToCheckout({
+  	    env: 'demo',
+  	    // mode,
+  	    // currency,
+  	    // client_secret,
+  	    recurringOptions: {
+  	      card: {
+  	        next_triggered_by: 'customer',
+  	        merchant_trigger_reason: 'scheduled',
+  	        // currency,
+  	      },
+  	    },
+  	    theme: {
+  	      fonts: [
+  	        {
+  	          src: 'https://checkout.airwallex.com/fonts/CircularXXWeb/CircularXXWeb-Regular.woff2',
+  	          family: 'AxLLCircular',
+  	          weight: 400,
+  	        },
+  	      ],
+  	    },
+  	    // successUrl: 'https://www.google.com',
+  	    // failUrl: 'https://www.google.com',
+  	  });
+  	};
+  	loadAirwallex({
+  	  env: 'demo', // Can choose other production environments, 'staging | 'demo' | 'prod'
+  	});
+  	const redirectHpp = async () => {
+  	  try {
+  	    await loadAirwallex({
+  	      env: 'demo', 
+  	    });
+  	    if (mode === 'payment') {
+  	      redirectHppForCheckout();
+  	    } else if (mode === 'recurring') {
+  	      redirectHppForRecurring();
+  	    }
+  	  } catch (error) {
+  	    window.alert('There was an error with HPP redirection', error);
+  	  }
+  	};
+	return {
+	  redirectHpp,
+	  redirectHppForCheckout,
+	  redirectHppForRecurring
+	};
+  }
+};
+
+/* const intent_id = this.$route.query.intent_id;
+const client_secret = 'replace-with-your-client-secret';
+const currency = 'replace-with-your-currency';
+const mode = 'payment';
+// console.log(this.intent_id);
+const redirectHppForCheckout = () => {
+  redirectToCheckout({
+    env: 'demo',
+    mode,
+    currency,
+    intent_id,
+    client_secret,
+	//主题
+    theme: {
+      fonts: [
+        {
+          src: 'https://checkout.airwallex.com/fonts/CircularXXWeb/CircularXXWeb-Regular.woff2',
+          family: 'AxLLCircular',
+          weight: 400,
+        },
+      ],
+    },
+    successUrl: 'https://www.baidu.com', // 支付成功跳转页面
+    failUrl: 'https://www.baidu.com', // 支付失败跳转页面
+	logoUrl: '', //支付页面展示商户LOGO
+  });
+};
+const redirectHppForRecurring = () => {
+  redirectToCheckout({
+    env: 'demo',
+    mode,
+    currency,
+    client_secret,
+    recurringOptions: {
+      card: {
+        next_triggered_by: 'customer',
+        merchant_trigger_reason: 'scheduled',
+        currency,
+      },
+    },
+    theme: {
+      fonts: [
+        {
+          src: 'https://checkout.airwallex.com/fonts/CircularXXWeb/CircularXXWeb-Regular.woff2',
+          family: 'AxLLCircular',
+          weight: 400,
+        },
+      ],
+    },
+    successUrl: 'https://www.google.com',
+    failUrl: 'https://www.google.com',
+  });
+};
+loadAirwallex({
+  env: 'demo', // Can choose other production environments, 'staging | 'demo' | 'prod'
+});
+const redirectHpp = async () => {
+  try {
+    await loadAirwallex({
+      env: 'demo', 
+    });
+    if (mode === 'payment') {
+      redirectHppForCheckout();
+    } else if (mode === 'recurring') {
+      redirectHppForRecurring();
+    }
+  } catch (error) {
+    window.alert('There was an error with HPP redirection', error);
+  }
+};
+export default {
+  name: 'Hpp',
+  data() {
+    return {
+      redirectHpp,
+	  msg: this.$route.query.intent_id,
+	  intent_id: this.$route.query.intent_id,
+	  client_secret: this.$route.query.client_secret,
+	  currency: this.$route.query.currency
+    };
+  },
+}; */
+</script>