index.vue 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. <template>
  2. <view class="container">
  3. <!-- #ifdef H5 -->
  4. <view style="color: #fff;">
  5. <tn-nav-bar @back="handleBack" backgroundColor="#26B3A0" :bottomShadow="false"
  6. @rightClick="jumpScoreRed">支付状态
  7. <!-- <template slot="right">
  8. 课程购买记录
  9. </template> -->
  10. </tn-nav-bar>
  11. <view :style="{ height: tobheight + 'px' }"></view>
  12. </view>
  13. <!-- #endif -->
  14. <!-- <view class="content" v-if="orderDetail.status"> -->
  15. <view class="content">
  16. <view class="topIcon">
  17. <!-- <image src="../../../static/posImg.png" mode=""></image> -->
  18. <icon type="success" size="54" color="#26B3A0" />
  19. <view class="txt">
  20. 支付成功
  21. </view>
  22. </view>
  23. <view class="btn" @click="handleShowRes">
  24. {{resShow?'收起学习资料':'查看学习资料'}}
  25. </view>
  26. <view class="res" v-if="resShow&&this.detail.content">
  27. <view class="inner" v-for="(i,index) in this.detail.content" @click="downLoad(i)">
  28. <text style="text-decoration: underline;">
  29. {{'学习资料'+(index+1)}}</text><text>{{i.slice(i.lastIndexOf('.'))}}</text>
  30. </view>
  31. </view>
  32. </view>
  33. <!-- <view class="content" v-else>
  34. <view class="topIcon">
  35. <icon type="info" size="54" color="red" />
  36. <view class="txt" style="color: red;">
  37. 支付失败
  38. </view>
  39. </view>
  40. </view> -->
  41. </view>
  42. </template>
  43. <script>
  44. import {
  45. courseDetail
  46. } from '@/api/score/index.js'
  47. import {
  48. downLoad2
  49. } from '@/utils/download2.js'
  50. import {
  51. myScoreOrderDetail
  52. } from '@/api/my/index.js'
  53. export default {
  54. components: {},
  55. data() {
  56. return {
  57. detail: {},
  58. tobheight: 45,
  59. resShow: false,
  60. orderDetail: {
  61. status: 0
  62. }
  63. };
  64. },
  65. computed: {
  66. },
  67. watch: {
  68. },
  69. async onLoad(o) {
  70. let res = await courseDetail({
  71. course_id: o.id
  72. })
  73. if (res.code == 0) {
  74. this.detail = res.data
  75. }
  76. // let res1 = await myScoreOrderDetail({
  77. // course_order_id: o.orderId
  78. // })
  79. // if (res1.code == 0) {
  80. // this.orderDetail = res1.data
  81. // // this.orderDetail.status = 1
  82. // }
  83. // console.log('支付状态页-订单状态返回值:', res1);
  84. console.log('支付成功--课程详情返回值', res);
  85. },
  86. onReady() {
  87. },
  88. onShow() {
  89. if (uni.getStorageSync('clickStudyBtn')) {
  90. uni.removeStorageSync('clickStudyBtn')
  91. }
  92. if (uni.getStorageSync('myScoreId')) {
  93. uni.removeStorageSync('myScoreId')
  94. }
  95. },
  96. onUnload() {
  97. },
  98. methods: {
  99. handleBack() {
  100. uni.setStorageSync('from', 'index')
  101. },
  102. handleShowRes() {
  103. this.resShow = !this.resShow
  104. },
  105. downLoad(fileName) {
  106. let _this = this
  107. //判断是否在微信
  108. var ua = navigator.userAgent.toLowerCase();
  109. var isWeixin = ua.indexOf('micromessenger') != -1;
  110. const detectDeviceType = () => /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
  111. navigator.userAgent) ? false : true;
  112. if (isWeixin) {
  113. if (fileName.endsWith('.pdf')) {
  114. uni.navigateTo({
  115. url: '/pages/user/score/prePdf/index?url=' + fileName
  116. })
  117. } else if (fileName.endsWith('.mp4')) {
  118. uni.navigateTo({
  119. url: '/pages/user/score/preMp4/index?url=' + fileName
  120. })
  121. } else if (fileName.endsWith('.jpg') || fileName.endsWith('.png') || fileName.endsWith('.jpeg')) {
  122. uni.navigateTo({
  123. url: '/pages/user/score/preImg/index?url=' + fileName
  124. })
  125. } else if (fileName.endsWith('.zip') || fileName.endsWith('.rar')) {
  126. let _that = this
  127. uni.showModal({
  128. title: '温馨提示',
  129. content: '微信浏览器不支持直接打开zip或rar类型的文件,请复制链接至手机浏览器打开哦~',
  130. confirmText: '复制',
  131. confirmColor: '#26B3A0',
  132. success: function(res) {
  133. if (res.confirm) {
  134. console.log('用户点击确定');
  135. uni.setClipboardData({
  136. data: fileName,
  137. success: function() {
  138. console.log('success');
  139. uni.showToast({
  140. title: "复制成功",
  141. icon: 'success',
  142. })
  143. }
  144. });
  145. } else if (res.cancel) {
  146. console.log('用户点击取消');
  147. }
  148. }
  149. })
  150. }
  151. } else if (detectDeviceType()) {
  152. // pc端
  153. uni.downloadFile({
  154. url: fileName, //文件链接
  155. success: (res) => {
  156. if (res.statusCode === 200) {
  157. var oA = document.createElement("a");
  158. oA.download = _this.detail.course.name + '-学习资料'; // 设置下载的文件名,默认是'下载'
  159. oA.href = res.tempFilePath; //临时路径再保存到本地
  160. document.body.appendChild(oA);
  161. oA.click();
  162. oA.remove(); // 下载之后把创建的元素删除
  163. }
  164. },
  165. fail: (err) => {
  166. uni.showToast({
  167. icon: 'none',
  168. mask: true,
  169. title: '失败请重新下载',
  170. });
  171. },
  172. })
  173. } else {
  174. // 其他手机浏览器
  175. if (fileName.endsWith('.pdf')) {
  176. uni.navigateTo({
  177. url: '/pages/user/score/prePdf/index?url=' + fileName
  178. })
  179. } else if (fileName.endsWith('.mp4')) {
  180. uni.navigateTo({
  181. url: '/pages/user/score/preMp4/index?url=' + fileName
  182. })
  183. } else if (fileName.endsWith('.jpg') || fileName.endsWith('.png') || fileName.endsWith('.jpeg')) {
  184. uni.navigateTo({
  185. url: '/pages/user/score/preImg/index?url=' + fileName
  186. })
  187. } else if (fileName.endsWith('.zip') || fileName.endsWith('.rar')) {
  188. downLoad2(fileName, this.detail.course.name + '-学习资料', 'application/zip')
  189. // window.open(
  190. // fileName
  191. // )
  192. }
  193. }
  194. },
  195. goPay() {
  196. uni.navigateTo({
  197. url: '/pages/index/scorePaySuc/index'
  198. })
  199. }
  200. }
  201. };
  202. </script>
  203. <style lang="scss" scoped>
  204. @import './index.scss';
  205. </style>