index_20220609123800.vue 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274
  1. <template>
  2. <div class="mianBox">
  3. <van-row class="contentBox" v-if="loading">
  4. <van-row>
  5. <van-col span="24" class="logo"><van-image width="75" height="75" :src="require('../img/logo.png')" /></van-col>
  6. <van-col span="24" class="introduce">中国东信智慧园区平台</van-col>
  7. <van-col span="24" class="money">{{data.money}}</van-col>
  8. <van-col span="24" class="order_money">订单金额(元)</van-col>
  9. </van-row>
  10. <div class="pay_wrap">
  11. <van-button class="pay" color="#F22E3C" @tap="pay">支付</van-button>
  12. <button class="pay" open-type="launchApp" app-parameter="appData" bindlaunchapp="launchAppSuccess" binderror="launchAppError" v-if="data.userId">返回APP</button>
  13. <button class="pay" open-type="launchApp" app-parameter="appData" bindlaunchapp="launchAppSuccess" binderror="launchAppError" v-if="!data.userId">返回首页</button>
  14. <!-- <button class="pay" open-type="launchApp" app-parameter="appData" @error="launchAppError" >返回APP<navigator open-type="exit" target="miniProgram" style="margin:30px 0;display: block;">退出程序</navigator></button> -->
  15. </div>
  16. <van-toast id="van-toast" />
  17. <!-- <van-overlay :show="show" @click="show = false" /> -->
  18. </van-row>
  19. </div>
  20. </template>
  21. <script>
  22. import Toast from '../../wxcomponents/vant/weapp/dist/toast/toast';
  23. import { requestPost, requestGet } from '@/utils/user.js';
  24. export default {
  25. data() {
  26. return {
  27. loading:false,
  28. data:{
  29. money:undefined,
  30. openid:null,
  31. app:false,
  32. },
  33. appData:{
  34. errCode:0,
  35. errStr:null,
  36. extMsg:"未支付",
  37. extraData:"未支付",
  38. openId:null,
  39. transaction:null,
  40. type:"WXLaunchMiniProgramReq.Resp"
  41. }
  42. }
  43. },
  44. onLoad(options) {
  45. //console.log(options)
  46. let _this = this
  47. const data = JSON.parse(options.params)
  48. _this.data = data
  49. uni.getStorage({
  50. key: 'openid',
  51. success: function (res) {
  52. _this.appData.openId = _this.data.openid
  53. if(data.scene){
  54. if(data.scene == "3"){
  55. //console.log("app进入 -->支付页")
  56. _this.data={
  57. money:Number(data.money).toFixed(2),
  58. channelId:data.channelId,
  59. userId:data.userId,
  60. scene:data.scene,
  61. openid:res.data,
  62. app:false,
  63. }
  64. }
  65. }else{
  66. //console.log("微信小程序历史记录进入 -->支付页")
  67. _this.data={
  68. money:data.money,
  69. scene:'2',
  70. channelId:'',
  71. userId:null,
  72. openid:data.openid,
  73. app:false,
  74. }
  75. }
  76. _this.loading = true
  77. _this.data.app = false
  78. _this.pay()
  79. },
  80. fail: function (res) {
  81. _this.loading = true
  82. },
  83. });
  84. },
  85. methods: {
  86. launchAppError(e) {
  87. Toast(e.detail.errMsg)
  88. },
  89. // 关闭小程序
  90. launchAppSuccess(){
  91. wx.exitMiniProgram({success: (res) => {}})
  92. },
  93. pay(){
  94. let _this = this
  95. if(_this.data.openid && _this.data.openid != 'null' ){
  96. if(_this.data.userId){//app用户充值
  97. //console.log("app用户充值")
  98. requestGet("dxtop/staff/one",
  99. {
  100. "id":_this.data.userId,
  101. },
  102. ).then(res =>{
  103. if(res[1].data.data){
  104. requestPost("dxtop/order/callUnifiedPay",
  105. {
  106. "money": Number(_this.data.money).toFixed(2),
  107. "topPayType": "W06",
  108. "payType": "2",
  109. "channelId":_this.data.channelId,
  110. "userId":res[1].data.data.sid,
  111. "scene":_this.data.scene,
  112. "openId":_this.data.openid,
  113. }
  114. ).then(res2 => {
  115. if(res2[1].data?.status == "ERROR"){
  116. if(res2[1].data?.code == 500){
  117. if(res2[1].data.msg == "acct参数错误"){
  118. Toast("华为、Android10系统,需要开启微信的“浮窗”和“允许在其他上层应用上打开”这两个权限")
  119. }else{
  120. Toast(res2[1].data.msg)
  121. }
  122. }else{
  123. Toast(res2[1].data.msg)
  124. }
  125. }else{
  126. if(res2[1].data){
  127. let data = JSON.parse(res2[1].data.data)
  128. uni.requestPayment({
  129. timeStamp: data.timeStamp,
  130. nonceStr: data.nonceStr,
  131. package: data.package,
  132. signType: data.signType,
  133. paySign: data.paySign,
  134. success: function (res3) {
  135. //console.log('success:' + JSON.stringify(res));
  136. uni.redirectTo({
  137. url: `../over/index`
  138. });
  139. },
  140. fail: function (err) {
  141. //console.log('fail:' + JSON.stringify(err));
  142. }
  143. });
  144. }
  145. }
  146. }).catch(err =>{
  147. })
  148. }else{
  149. Toast("该用户未暂未录入充值系统...")
  150. }
  151. })
  152. }else{
  153. Toast("请使用'中国东信'APP途径进行充值")
  154. }
  155. }else{
  156. //console.log("去授权页",JSON.stringify(_this.data))
  157. uni.redirectTo({
  158. url: `../login/index?params=${JSON.stringify(this.data)}`
  159. });
  160. }
  161. }
  162. },
  163. onShow(options){
  164. }
  165. }
  166. </script>
  167. <style lang="scss" scoped>
  168. .mianBox{
  169. height: 100%;
  170. width: 100%;
  171. color: #000;
  172. box-sizing: border-box;
  173. background-color: #F2F6FC;
  174. position: fixed;
  175. .contentBox{
  176. width: 100%;
  177. height: auto;
  178. padding: 15px 20px;
  179. box-sizing: border-box;
  180. overflow: hidden;
  181. .logo{
  182. /deep/ .van-image{
  183. margin:0 auto;
  184. display: block;
  185. }
  186. }
  187. .introduce{
  188. text-align: center;
  189. color: #000;
  190. display: block;
  191. /deep/ .van-col{
  192. font-size: 20;
  193. margin-top:20px;
  194. letter-spacing: 2px;
  195. }
  196. }
  197. .money{
  198. text-align: center;
  199. color: #000;
  200. /deep/ .van-col{
  201. font-size: 30px;
  202. margin-top: 10px;
  203. font-weight: 700;
  204. }
  205. }
  206. .order_money{
  207. text-align: center;
  208. color: #ccc;
  209. display: block;
  210. /deep/ .van-col{
  211. font-size: 20;
  212. margin-top:10px;
  213. letter-spacing: 2px;
  214. }
  215. }
  216. /deep/ .van-button{
  217. border-radius: 6px;
  218. width: 100% !important;
  219. margin-top:25px;
  220. letter-spacing: 2px;
  221. font-size: 18px;
  222. height: 50px;
  223. }
  224. .order_wrap{
  225. width:95%;
  226. padding:10px 20px 20px 20px;
  227. box-sizing: border-box;
  228. width:95%;
  229. margin:20px 2.5%;
  230. background-color: #fff;
  231. border-radius: 6px;
  232. box-shadow: 0 2px 12px 0 #ccc;
  233. display: block;
  234. /deep/ .van-col{
  235. font-size: 16px;
  236. color:#ccc;
  237. margin-top:10px;
  238. display: block;
  239. }
  240. /deep/ .left{
  241. text-align: left;
  242. }
  243. /deep/ .right{
  244. text-align: right;
  245. }
  246. }
  247. .pay_wrap{
  248. width:95%;
  249. margin:70px 2.5% 0;
  250. .pay{
  251. height: 50px;
  252. font-size: 18px;
  253. border-radius: 10px;
  254. margin-top:40px;
  255. }
  256. }
  257. }
  258. }
  259. .pay{
  260. background:#F22E3C;
  261. color:#fff;
  262. }
  263. </style>