index_20220609123847.vue 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277
  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" @click="fanhui" 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. fanhui(){
  87. },
  88. launchAppError(e) {
  89. Toast(e.detail.errMsg)
  90. },
  91. // 关闭小程序
  92. launchAppSuccess(){
  93. wx.exitMiniProgram({success: (res) => {}})
  94. },
  95. pay(){
  96. let _this = this
  97. if(_this.data.openid && _this.data.openid != 'null' ){
  98. if(_this.data.userId){//app用户充值
  99. //console.log("app用户充值")
  100. requestGet("dxtop/staff/one",
  101. {
  102. "id":_this.data.userId,
  103. },
  104. ).then(res =>{
  105. if(res[1].data.data){
  106. requestPost("dxtop/order/callUnifiedPay",
  107. {
  108. "money": Number(_this.data.money).toFixed(2),
  109. "topPayType": "W06",
  110. "payType": "2",
  111. "channelId":_this.data.channelId,
  112. "userId":res[1].data.data.sid,
  113. "scene":_this.data.scene,
  114. "openId":_this.data.openid,
  115. }
  116. ).then(res2 => {
  117. if(res2[1].data?.status == "ERROR"){
  118. if(res2[1].data?.code == 500){
  119. if(res2[1].data.msg == "acct参数错误"){
  120. Toast("华为、Android10系统,需要开启微信的“浮窗”和“允许在其他上层应用上打开”这两个权限")
  121. }else{
  122. Toast(res2[1].data.msg)
  123. }
  124. }else{
  125. Toast(res2[1].data.msg)
  126. }
  127. }else{
  128. if(res2[1].data){
  129. let data = JSON.parse(res2[1].data.data)
  130. uni.requestPayment({
  131. timeStamp: data.timeStamp,
  132. nonceStr: data.nonceStr,
  133. package: data.package,
  134. signType: data.signType,
  135. paySign: data.paySign,
  136. success: function (res3) {
  137. //console.log('success:' + JSON.stringify(res));
  138. uni.redirectTo({
  139. url: `../over/index`
  140. });
  141. },
  142. fail: function (err) {
  143. //console.log('fail:' + JSON.stringify(err));
  144. }
  145. });
  146. }
  147. }
  148. }).catch(err =>{
  149. })
  150. }else{
  151. Toast("该用户未暂未录入充值系统...")
  152. }
  153. })
  154. }else{
  155. Toast("请使用'中国东信'APP途径进行充值")
  156. }
  157. }else{
  158. //console.log("去授权页",JSON.stringify(_this.data))
  159. uni.redirectTo({
  160. url: `../login/index?params=${JSON.stringify(this.data)}`
  161. });
  162. }
  163. }
  164. },
  165. onShow(options){
  166. }
  167. }
  168. </script>
  169. <style lang="scss" scoped>
  170. .mianBox{
  171. height: 100%;
  172. width: 100%;
  173. color: #000;
  174. box-sizing: border-box;
  175. background-color: #F2F6FC;
  176. position: fixed;
  177. .contentBox{
  178. width: 100%;
  179. height: auto;
  180. padding: 15px 20px;
  181. box-sizing: border-box;
  182. overflow: hidden;
  183. .logo{
  184. /deep/ .van-image{
  185. margin:0 auto;
  186. display: block;
  187. }
  188. }
  189. .introduce{
  190. text-align: center;
  191. color: #000;
  192. display: block;
  193. /deep/ .van-col{
  194. font-size: 20;
  195. margin-top:20px;
  196. letter-spacing: 2px;
  197. }
  198. }
  199. .money{
  200. text-align: center;
  201. color: #000;
  202. /deep/ .van-col{
  203. font-size: 30px;
  204. margin-top: 10px;
  205. font-weight: 700;
  206. }
  207. }
  208. .order_money{
  209. text-align: center;
  210. color: #ccc;
  211. display: block;
  212. /deep/ .van-col{
  213. font-size: 20;
  214. margin-top:10px;
  215. letter-spacing: 2px;
  216. }
  217. }
  218. /deep/ .van-button{
  219. border-radius: 6px;
  220. width: 100% !important;
  221. margin-top:25px;
  222. letter-spacing: 2px;
  223. font-size: 18px;
  224. height: 50px;
  225. }
  226. .order_wrap{
  227. width:95%;
  228. padding:10px 20px 20px 20px;
  229. box-sizing: border-box;
  230. width:95%;
  231. margin:20px 2.5%;
  232. background-color: #fff;
  233. border-radius: 6px;
  234. box-shadow: 0 2px 12px 0 #ccc;
  235. display: block;
  236. /deep/ .van-col{
  237. font-size: 16px;
  238. color:#ccc;
  239. margin-top:10px;
  240. display: block;
  241. }
  242. /deep/ .left{
  243. text-align: left;
  244. }
  245. /deep/ .right{
  246. text-align: right;
  247. }
  248. }
  249. .pay_wrap{
  250. width:95%;
  251. margin:70px 2.5% 0;
  252. .pay{
  253. height: 50px;
  254. font-size: 18px;
  255. border-radius: 10px;
  256. margin-top:40px;
  257. }
  258. }
  259. }
  260. }
  261. .pay{
  262. background:#F22E3C;
  263. color:#fff;
  264. }
  265. </style>