index.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <template>
  2. <view class="content">
  3. <u-cell-group>
  4. <u-cell-item icon="integral" title="我的金币" :value="userInfo.money" :arrow="false"></u-cell-item>
  5. <u-cell-item icon="integral" hover-class="cell-hover-class" title="特惠100金币" :value-style="{'color':'#FFCC00'}" value="¥0.01" :arrow="false" @click="pay(0.01)"></u-cell-item>
  6. <u-cell-item icon="integral" hover-class="cell-hover-class" title="10金币" :value-style="{'color':'#FFCC00'}" value="¥10" :arrow="false" @click="pay(10)">></u-cell-item>
  7. <u-cell-item icon="integral" hover-class="cell-hover-class" title="100金币" :value-style="{'color':'#FFCC00'}" value="¥100" :arrow="false" @click="pay(100)"></u-cell-item>
  8. <u-cell-item icon="integral" hover-class="cell-hover-class" title="200金币" :value-style="{'color':'#FFCC00'}" value="¥200" :arrow="false" @click="pay(200)"></u-cell-item>
  9. <u-cell-item icon="integral" hover-class="cell-hover-class" title="500金币" :value-style="{'color':'#FFCC00'}" value="¥500" :arrow="false" @click="pay(500)"></u-cell-item>
  10. </u-cell-group>
  11. </view>
  12. </template>
  13. <script>
  14. import { mapGetters } from 'vuex';
  15. export default {
  16. data() {
  17. return {
  18. pdfh5: null
  19. }
  20. },
  21. onLoad(option) {
  22. this.$api.refreshUserInfo()
  23. },
  24. computed: {...mapGetters(['userInfo'])},
  25. onShow(){
  26. },
  27. methods: {
  28. pay(money){
  29. if(uni.getSystemInfoSync().platform== 'ios'){
  30. uni.showModal({
  31. title: '提示',
  32. content: 'IOS用户前往公众号充值',
  33. showCancel: false
  34. });
  35. return
  36. }
  37. let that = this;
  38. let list = []
  39. list.push({goodsPrice:money,num:1})
  40. let order = {goodsList:list};
  41. this.$api.orderSmallCoin(order).then(
  42. res => {
  43. let objarr = res.data.data
  44. wx.requestPayment({
  45. timeStamp: objarr.timeStamp,
  46. nonceStr: objarr.nonceStr,
  47. package: objarr.package,
  48. signType: objarr.signType,
  49. paySign: objarr.sign,
  50. success (result) {
  51. uni.showModal({
  52. title: '提示',
  53. content: '支付成功',
  54. showCancel: false,
  55. success: function (resst) {
  56. if(resst.confirm){
  57. that.$api.refreshUserInfo()
  58. }
  59. }
  60. });
  61. },
  62. fail (err){
  63. uni.showModal({
  64. title: '提示',
  65. content: '支付失败',
  66. showCancel: false,
  67. success: function (resst) {
  68. }
  69. });
  70. }
  71. })
  72. },
  73. err => {
  74. console.log(err);
  75. }
  76. );
  77. }
  78. }
  79. }
  80. </script>
  81. <style scope>
  82. .cell-hover-class {
  83. opacity: 0.5;
  84. }
  85. * {
  86. padding: 0;
  87. margin: 0;
  88. }
  89. html,
  90. body,
  91. #app {
  92. width: 100%;
  93. height: 100%;
  94. }
  95. page{
  96. height: 100%;
  97. }
  98. </style>