ach.vue 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. <template>
  2. <div class="ach">
  3. <div class="loading">
  4. <img src="../../static/img/icon_refresh.svg" />
  5. </div>
  6. <form ref="formDom" :action="formData.actionUrl" method="post" id="submitForm">
  7. <input type="hidden" name="callbackUrl" :value="formData.callbackUrl">
  8. <input type="hidden" name="currency" :value="formData.currency">
  9. <input type="hidden" name="merType" :value="formData.merType">
  10. <input type="hidden" name="merchantNo" :value="formData.merchantNo">
  11. <input type="hidden" name="merchantOrderNo" :value="formData.merchantOrderNo">
  12. <input type="hidden" name="noticeUrl" :value="formData.noticeUrl">
  13. <input type="hidden" name="orderAmount" :value="formData.orderAmount">
  14. <input type="hidden" name="productDetail" :value="formData.productDetail">
  15. <input type="hidden" name="sign" :value="formData.sign">
  16. <input type="hidden" name="timeStamp" :value="formData.timeStamp">
  17. <input type="hidden" name="version" :value="formData.version">
  18. </form>
  19. </div>
  20. </template>
  21. <script>
  22. import { postRequest } from '../../http/index';
  23. import Api from '../../http/api';
  24. export default {
  25. name: 'ach',
  26. data() {
  27. return {
  28. formData: {}
  29. }
  30. },
  31. mounted() {
  32. this.getPayInfo()
  33. },
  34. methods: {
  35. getPayInfo() {
  36. let amountValue = this.$route.params.amount;
  37. if (amountValue) {
  38. postRequest(Api.usdRechargeRequestByAchpay, {
  39. params: {
  40. amountValue: amountValue
  41. }
  42. }).then(res => {
  43. if(res.code == 0) {
  44. this.formData = res.data;
  45. this.$nextTick(() => {
  46. this.$refs.formDom.submit();
  47. })
  48. }
  49. })
  50. }
  51. }
  52. }
  53. }
  54. </script>
  55. <style lang="scss">
  56. html,
  57. body,
  58. #__nuxt,
  59. #__layout {
  60. width: 100%;
  61. height: 100%;
  62. padding: 0;
  63. margin: 0;
  64. overflow: hidden;
  65. }
  66. .ach {
  67. display: flex;
  68. align-items: center;
  69. justify-content: center;
  70. width: 100%;
  71. height: 100%;
  72. }
  73. .loading {
  74. width: 50px;
  75. height: 50px;
  76. img {
  77. width: 100%;
  78. height: 100%;
  79. animation: rotate 1s infinite linear;
  80. }
  81. }
  82. @keyframes rotate {
  83. 0% {
  84. transform: rotate(0);
  85. }
  86. 100% {
  87. transform: rotate(360deg);
  88. }
  89. }
  90. </style>