payOrder.vue 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128
  1. <template>
  2. <view class="pages">
  3. <!-- 地址 -->
  4. <view class="text-center text-red" v-if="isTrue && orderType == 2">超出配送距离</view>
  5. <view class="food">
  6. <view class="flex bg justify-between padding-lr-xl">
  7. <view @click="switchTab(2)" :class="orderType == 2 ? 'select' : ''" class="tabBtn"
  8. v-if="XCXIsSelect == '是'">
  9. <view class="title">外卖配送</view>
  10. <view :class="orderType == 2 ? 'active' : ''"></view>
  11. </view>
  12. <view @click="switchTab(1)" :class="orderType == 1 ? 'select' : ''" class="tabBtn">
  13. <view class="title">到店自取</view>
  14. <view :class="orderType == 1 ? 'active' : ''"></view>
  15. </view>
  16. </view>
  17. <view v-if="orderType == 1">
  18. <view class="flex margin-top">
  19. <u-icon name="map" size="50"></u-icon>
  20. <!-- <text>商家信息</text> -->
  21. <view class="flex-sub padding-tb-sm margin-left-sm">
  22. <view class="text-lg text-bold text-black">
  23. <text>{{ dataList.shopName }}</text>
  24. <text class="margin-left-sm" @click="call"><u-icon name="phone" size="40"></u-icon></text>
  25. </view>
  26. <view class="text-df margin-top-xs" style="color: #999999;" @click="goMap">
  27. {{ dataList.detailedAddress }}
  28. </view>
  29. </view>
  30. </view>
  31. </view>
  32. <view class="" v-if="orderType == 2">
  33. <view class="goods_address" v-if="JSON.stringify(address) == '{}'" @click="goAddress">
  34. <view class="address_box">
  35. <view class="address_name">请选择收货地址</view>
  36. <view class="address_image margin-left">
  37. <image src="../../../static/images/index/right.png"></image>
  38. </view>
  39. </view>
  40. </view>
  41. <view class="flex margin-top" style="" v-else @click="goAddress">
  42. <u-icon name="map" size="50"></u-icon>
  43. <view class="flex-sub padding-tb-sm margin-left-sm">
  44. <view class="text-lg text-bold text-black">
  45. <text>{{ address.userName }}</text>
  46. <text class="margin-left-sm">{{ address.userPhone }}</text>
  47. </view>
  48. <view class="text-df margin-top-xs" style="color: #999999;">
  49. {{ address.province }}{{ address.city }}{{ address.district }}{{ address.addressDetail }}
  50. </view>
  51. </view>
  52. <view class="address_image margin-left">
  53. <image src="../../../static/images/index/right.png"></image>
  54. </view>
  55. </view>
  56. </view>
  57. </view>
  58. <!-- 商品 -->
  59. <view class="food">
  60. <view class="tosend_header_food" v-for="(item, index) in dataList.orderGoodsList" :key="index">
  61. <view class="tosend_header_food_le">
  62. <image :src="item.goodsPicture[0]" style="border-radius: 10rpx;" mode=""></image>
  63. </view>
  64. <view class="flex-sub margin-left-sm">
  65. <view class="flex justify-between align-center">
  66. <view class="text-lg text-bold text-black">{{ item.goodsName }}</view>
  67. <view class="text-lg text-bold text-black">
  68. <text class="text-sm">¥</text>
  69. {{ item.goodsPrice }}
  70. </view>
  71. </view>
  72. <view class="flex justify-between align-center text-gray">
  73. <view v-if="item.skuMessage">{{ item.skuMessage }}</view>
  74. <view>x{{ item.goodsNum }}</view>
  75. </view>
  76. <view class="flex justify-between align-center text-gray margin-tb-sm" v-if="item.goodsPack">
  77. <view>打包费</view>
  78. <view class="">¥{{ item.goodsPack }} / 份</view>
  79. </view>
  80. </view>
  81. </view>
  82. <!-- <view class="tosend_header_do do_top" v-if="item.goodsPack>0" >
  83. <view>打包费</view>
  84. <view class="tosend_header_do_ri">¥{{item.goodsPack}}</view>
  85. </view> -->
  86. <view class="tosend_header_do justify-between" v-if="paotuiMoney > 0 && orderType == 2">
  87. <view>跑腿费</view>
  88. <view class="tosend_header_do_ri">¥{{ paotuiMoney }}</view>
  89. </view>
  90. <view class="tosend_header_do justify-between do_bot" @click="getCouponList">
  91. <view>优惠券</view>
  92. <view class="tosend_header_do_ri" v-if="coupon">- ¥{{ coupon.money }}</view>
  93. <view v-else>
  94. <image src="../../../static/images/order/right1.png" style="width: 14rpx;height: 24rpx;" mode="">
  95. </image>
  96. </view>
  97. </view>
  98. <view class="tosend_header_do justify-between">
  99. <view class="tosend_header_do_le2">合计</view>
  100. <view class="tosend_header_do_ri2">
  101. <text>¥</text>
  102. {{ totalPrice1 }}
  103. </view>
  104. </view>
  105. </view>
  106. <!-- 订单备注 -->
  107. <view class="food">
  108. <view class="padding-tb-sm text-lg text-bold text-bold text-black">订单备注</view>
  109. <view class="flex align-center justify-between padding-tb-sm padding-lr"
  110. style="background: #f5f5f5;width: 100%;">
  111. <u-input v-model="remark" type="textarea" placeholder="请输入订单备注" height="180" maxlength="200"
  112. style="width: 100%;"></u-input>
  113. </view>
  114. </view>
  115. <!-- 支付方式 -->
  116. <view class="margin-top padding-lr radius bg-white" style="width: 94%;margin: 0 auto;border-radius: 18rpx;">
  117. <view class="padding-tb-sm text-lg text-bold text-bold text-black">支付方式</view>
  118. <view style="height: 100upx;" v-for="(item, index) in openLists" :key="index">
  119. <view class="flex align-center justify-between padding-tb" v-if="item.text != '零钱'">
  120. <image :src="item.image" style="width: 55rpx;height: 55rpx;border-radius: 50upx;"></image>
  121. <view class="flex-sub text-xl margin-left">{{ item.text }}</view>
  122. <radio-group name="openWay" style="margin-left: 20upx;" @change="selectWay(item)">
  123. <label class="tui-radio">
  124. <radio class="red" :checked="openWay === item.id ? true : false" />
  125. </label>
  126. </radio-group>
  127. </view>
  128. <view class="flex align-center justify-between padding-tb" v-if="item.text === '零钱'">
  129. <image :src="item.image" style="width: 55rpx;height: 55rpx;border-radius: 50upx;"></image>
  130. <view class="flex-sub text-xl margin-left">{{ item.text }} <text
  131. style="font-size: 30rpx;margin-left: 10rpx;"
  132. v-if="userMoney && userMoney > 0">(余额:{{userMoney}})</text>
  133. <text v-else
  134. style="font-size: 30rpx;margin-left: 10rpx;text-decoration:underline;color: #ea0000;"
  135. @tap="goCash()">去充值</text>
  136. </view>
  137. <radio-group name="openWay" style="margin-left: 20upx;" @change="selectWay(item)">
  138. <label class="tui-radio">
  139. <radio class="red" :checked="openWay === item.id ? true : false" />
  140. </label>
  141. </radio-group>
  142. </view>
  143. </view>
  144. </view>
  145. <view style="height: 120rpx;"></view>
  146. <!-- 结算 -->
  147. <view class="goorder">
  148. <view class="goorder_but" :class="isTrue && orderType == 2 ? 'goorder_but_' : ''" @click="toSettlement">立即结算
  149. </view>
  150. </view>
  151. <u-popup v-model="show" mode="center" :closeable="true" close-icon-pos="top-right" close-icon="close-circle"
  152. close-icon-size="50" border-radius="20" width="80%" @close="close">
  153. <view class="padding bg-gray">
  154. <view class="text-center text-lg text-bold margin-bottom-sm">可用优惠券</view>
  155. <scroll-view scroll-y="true" style="height: 600rpx;" v-if="couponList.length > 0">
  156. <view class="flex justify-between align-center radius margin-tb-sm padding-sm bg-white"
  157. v-for="(item, index) in couponList" :key="index" @click="selCoupon(item)">
  158. <view>
  159. <view>{{ item.couponName }}</view>
  160. <view>有效期至{{ item.expirationTime }}</view>
  161. </view>
  162. <view class="text-sm text-bold">
  163. ¥
  164. <text class="text-lg">{{ item.money }}</text>
  165. </view>
  166. </view>
  167. </scroll-view>
  168. <view v-if="couponList.length == 0"
  169. style="height: 100rpx;line-height: 100rpx;text-align: center;font-weight: 700;">暂无可用优惠券</view>
  170. </view>
  171. </u-popup>
  172. <view class="hintPopul" v-if="shopDet && shopDet.putawayFlag == 1">
  173. <view class="content_">
  174. <image src="../../../static/images/index/shop.png" style="width: 200rpx;height: 180rpx;"></image>
  175. <view class="text-xl text-bold">店铺打烊啦</view>
  176. <view class="hintText margin-top-sm text-gray">现在店铺已经打烊了,营业时间</view>
  177. <view class="margin-top-xs text-gray margin-bottom">{{ shopDet.businessHours }}-{{ shopDet.lockHours }}
  178. </view>
  179. <view class="Btns" @click="goBack()">知道了</view>
  180. </view>
  181. </view>
  182. </view>
  183. </template>
  184. <script>
  185. export default {
  186. data() {
  187. return {
  188. userMoney: 0,
  189. storeCommodityId: 0,
  190. openLists: [],
  191. openWay: 2,
  192. hintShow: true,
  193. page: 1,
  194. limit: 100,
  195. dataList: {},
  196. packMoney: 0, //打包费
  197. totalPrice: 0,
  198. totalPrice1: 0,
  199. address: {}, //地址
  200. addressId: '',
  201. parentId: '',
  202. orderId: '',
  203. show: false,
  204. coupon: '',
  205. shopDet: '',
  206. couponList: [],
  207. orderType: 2, //1表示到店自取 2表示外卖配送
  208. paotuiMoney: 0,
  209. dabaoMoney: 0,
  210. goodsMoney: 0,
  211. distance: 0,
  212. isTrue: false,
  213. XCXIsSelect: '是',
  214. remark: '',
  215. GoodsorderId: '',
  216. isThrottle: true,
  217. };
  218. },
  219. onLoad(option) {
  220. // #ifdef APP
  221. this.openLists = [{
  222. image: '../../../static/images/my/weixin.png',
  223. text: '微信',
  224. id: 2
  225. },
  226. {
  227. image: '../../../static/images/my/zhifubao.png',
  228. text: '支付宝',
  229. id: 3
  230. },
  231. {
  232. image: '../../../static/images/my/jinbi.png',
  233. text: '零钱',
  234. id: 1
  235. }
  236. ];
  237. // #endif
  238. // #ifdef MP-WEIXIN
  239. this.XCXIsSelect = this.$queue.getData('XCXIsSelect') ? this.$queue.getData('XCXIsSelect') : '是';
  240. this.openLists = [{
  241. image: '../../../static/images/my/weixin.png',
  242. text: '微信',
  243. id: 2
  244. },
  245. {
  246. image: '../../../static/images/my/jinbi.png',
  247. text: '零钱',
  248. id: 1
  249. }
  250. ];
  251. // #endif
  252. // #ifdef H5
  253. this.openLists = [{
  254. image: '../../../static/images/my/weixin.png',
  255. text: '微信',
  256. id: 2
  257. },
  258. {
  259. image: '../../../static/images/my/zhifubao.png',
  260. text: '支付宝',
  261. id: 3
  262. },
  263. {
  264. image: '../../../static/images/my/jinbi.png',
  265. text: '零钱',
  266. id: 1
  267. }
  268. ];
  269. // #endif
  270. this.orderId = option.orderId;
  271. this.orderType = option.orderType;
  272. uni.showLoading({
  273. title: '加载中...'
  274. });
  275. this.getOrderList();
  276. this.getAddressList();
  277. let that = this;
  278. //获取店铺信息
  279. uni.getLocation({
  280. type: 'gcj02', //返回可以用于uni.openLocation的经纬度
  281. success: function(res) {
  282. console.log(res, '经纬度');
  283. that.lat = res.latitude;
  284. that.lng = res.longitude;
  285. }
  286. });
  287. },
  288. onShow() {
  289. this.getMsgData();
  290. this.addressId = this.addressId ? this.addressId : uni.getStorageSync('addressId');
  291. if (this.addressId) {
  292. this.getAddressDet(this.addressId);
  293. }
  294. },
  295. methods: {
  296. goCash() {
  297. uni.navigateTo({
  298. url: '/my/wallet/index'
  299. });
  300. },
  301. getMsgData() {
  302. this.$Request.get("/app/userintegral/findUserMessage").then(res => {
  303. if (res.code == 0 && res.data) {
  304. this.userMoney = res.data.userMoney ? res.data.userMoney : 0;
  305. }
  306. });
  307. },
  308. //获取店铺详情
  309. getShopDet(shopId) {
  310. let data = {
  311. shopId,
  312. lng: this.lng,
  313. lat: this.lat
  314. };
  315. this.$Request.get('/app/goods/selectGoodsList', data).then(res => {
  316. if (res.code == 0 && res.data) {
  317. this.shopDet = res.data.goodsShop;
  318. }
  319. });
  320. },
  321. goBack() {
  322. uni.navigateBack({});
  323. },
  324. getDistance() {
  325. if (this.address.lng && this.dataList.shopLng) {
  326. let data = {
  327. ol: this.address.lng,
  328. od: this.address.lat,
  329. dl: this.dataList.shopLng,
  330. dd: this.dataList.shopLat
  331. };
  332. this.$Request.post('/app/tbindent/distance', data).then(res => {
  333. if (res.code == 0) {
  334. this.distance = res.data;
  335. if (this.distance > Number(this.dataList.distributionDistance)) {
  336. this.isTrue = true;
  337. } else {
  338. this.isTrue = false;
  339. }
  340. }
  341. });
  342. }
  343. },
  344. close() {
  345. this.show = false;
  346. },
  347. switchTab(e) {
  348. // this.page = 1
  349. // this.status = ''
  350. this.coupon = ''
  351. this.orderType = e;
  352. // this.current = 0;
  353. console.log(e);
  354. if (JSON.stringify(this.address) != '{}') {
  355. this.getDistance();
  356. }
  357. // if (this.orderType == 2) {
  358. // this.totalPrice1 = this.totalPrice + this.paotuiMoney + this.dabaoMoney
  359. // } else {
  360. // this.totalPrice1 = this.totalPrice + this.dabaoMoney
  361. // }
  362. if (this.orderType == 2) {
  363. this.totalPrice1 = parseFloat(this.totalPrice + this.paotuiMoney + this.dabaoMoney).toFixed(2);
  364. } else {
  365. this.totalPrice1 = parseFloat(this.totalPrice + this.dabaoMoney).toFixed(2);
  366. }
  367. if (this.coupon) {
  368. let totalMoney = parseFloat(this.totalPrice1 - (this.coupon.money ? this.coupon.money : 0)).toFixed(2);
  369. if (totalMoney <= 0) {
  370. this.totalPrice1 = 0.01;
  371. } else {
  372. this.totalPrice1 = totalMoney;
  373. }
  374. }
  375. },
  376. // 删除优惠券
  377. detCoupon() {
  378. let data = {
  379. orderId: this.dataList.orderId
  380. };
  381. this.$Request.post('/app/order/deleteCouponByOrderId', data).then(res => {
  382. if (res.code == 0) {}
  383. });
  384. },
  385. // 选择优惠券
  386. selCoupon(item) {
  387. this.coupon = item;
  388. if (this.orderType == 2) {
  389. this.totalPrice1 = parseFloat(this.totalPrice + this.paotuiMoney + this.dabaoMoney).toFixed(2);
  390. } else {
  391. this.totalPrice1 = parseFloat(this.totalPrice + this.dabaoMoney).toFixed(2);
  392. }
  393. let totalMoney = parseFloat(this.totalPrice1 - (this.coupon.money ? this.coupon.money : 0)).toFixed(2);
  394. if (totalMoney <= 0) {
  395. this.totalPrice1 = 0.01;
  396. } else {
  397. this.totalPrice1 = totalMoney;
  398. }
  399. let data = {
  400. parentId: this.dataList.parentId,
  401. couponId: this.coupon ? this.coupon.id : ''
  402. };
  403. this.$Request.post('/app/order/employCoupon', data).then(res => {
  404. if (res.code == 0) {
  405. this.show = false;
  406. } else {
  407. this.$queue.showToast(res.msg);
  408. }
  409. });
  410. },
  411. // 获取优惠券列表
  412. getCouponList() {
  413. console.log(this.totalPrice);
  414. console.log(this.dataList.packMoney);
  415. let data = {
  416. shopId: this.dataList.shopId,
  417. page: 1,
  418. limit: 20,
  419. minMoney: this.orderType == 2 ? parseFloat(this.totalPrice * 1).toFixed(2) * 1 + this.paotuiMoney *
  420. 1 + this.dabaoMoney * 1 : parseFloat(this.totalPrice * 1).toFixed(2)
  421. };
  422. this.$Request.get('/app/coupon/selectUserCouponList', data).then(res => {
  423. if (res.code == 0) {
  424. this.couponList = res.data.list;
  425. }
  426. this.show = true;
  427. });
  428. },
  429. // 获取订单信息
  430. getOrderList() {
  431. let data = {
  432. orderId: this.orderId
  433. };
  434. this.$Request.get('/app/order/selectBuyGoods', data).then(res => {
  435. uni.hideLoading();
  436. if (res.code == 0) {
  437. this.dataList = res.data;
  438. this.GoodsorderId = res.data.orderId;
  439. this.getShopDet(res.data.shopId);
  440. // this.dataList.orderGoodsList[0].goodsPicture = this.dataList.orderGoodsList[0].goodsPicture.split(',')
  441. console.log(this.dataList.orderGoodsList);
  442. if (this.dataList) {
  443. this.dataList.orderGoodsList.forEach(res => {
  444. res.goodsPicture = res.goodsPicture.split(',');
  445. this.dabaoMoney += res.goodsPack * res.goodsNum;
  446. this.goodsMoney += res.goodsPrice * res.goodsNum;
  447. this.goodsMoney = parseFloat(this.goodsMoney + this.dabaoMoney);
  448. });
  449. }
  450. console.log(Number(this.dataList.orderGoodsList[0].goodsPrice));
  451. console.log(Number(this.dataList.exemptMinMoney));
  452. // 判断商品金额是否大于最低减免配送费金额
  453. if (Number(this.goodsMoney) >= Number(this.dataList.exemptMinMoney)) {
  454. console.log('跑腿费');
  455. this.paotuiMoney = 0;
  456. } else {
  457. this.paotuiMoney = this.dataList.errandMoney;
  458. }
  459. this.totalPrice = res.data.payMoney * 1;
  460. console.log(this.dabaoMoney, '打包');
  461. console.log(this.paotuiMoney, '跑腿');
  462. if (this.orderType == 2) {
  463. this.totalPrice1 = this.totalPrice + this.paotuiMoney + this.dabaoMoney;
  464. } else {
  465. this.totalPrice1 = this.totalPrice + this.dabaoMoney;
  466. }
  467. console.log(this.dataList);
  468. this.detCoupon();
  469. this.getDistance();
  470. }
  471. });
  472. },
  473. selectWay: function(item) {
  474. this.openWay = item.id;
  475. },
  476. takeReark() {
  477. let datas = {
  478. orderId: this.GoodsorderId,
  479. remark: this.remark
  480. };
  481. this.$Request.post('/app/order/updateOrdersRemark', datas).then(res => {
  482. // uni.hideLoading();
  483. if (res.code == 0) {} else {
  484. uni.showToast({
  485. title: res.msg,
  486. icon: 'none'
  487. });
  488. }
  489. });
  490. },
  491. // 立即结算
  492. toSettlement() {
  493. if (this.isThrottle == false) {
  494. return
  495. }
  496. let that = this
  497. if (this.isTrue && this.orderType == 2) {
  498. uni.showToast({
  499. title: '超出配送范围',
  500. icon: 'none'
  501. });
  502. reutrn;
  503. }
  504. if (this.orderType == 2 && !this.address.addressId) {
  505. uni.showToast({
  506. title: '请选择收货地址',
  507. icon: 'none'
  508. });
  509. return;
  510. }
  511. if (this.remark) {
  512. this.takeReark();
  513. }
  514. uni.showLoading({
  515. title: '支付中...'
  516. });
  517. this.isThrottle = false
  518. if (this.openWay == 1) {
  519. let data = {
  520. parentId: this.dataList.parentId,
  521. couponId: this.coupon ? this.coupon.id : '',
  522. addressId: this.address.addressId ? this.address.addressId : '',
  523. orderType: this.orderType
  524. };
  525. this.$Request.post('/app/wxPay/balanceOrder', data).then(res => {
  526. if (res.code == 0) {
  527. uni.hideLoading();
  528. that.$queue.showToast('支付成功');
  529. setTimeout(function() {
  530. that.isThrottle = true
  531. uni.switchTab({
  532. url: '/pages/order/index'
  533. });
  534. }, 1000);
  535. } else {
  536. that.isThrottle = true
  537. that.$queue.showToast(res.msg, );
  538. }
  539. });
  540. } else if (this.openWay == 2) {
  541. // #ifdef H5
  542. let data = {
  543. parentId: this.dataList.parentId,
  544. couponId: this.coupon ? this.coupon.id : '',
  545. addressId: this.address.addressId ? this.address.addressId : '',
  546. orderType: this.orderType,
  547. type: 2
  548. };
  549. this.$Request.post('/app/wxPay/wxPayJsApiOrder', data).then(res => {
  550. if (res.code == 0) {
  551. this.callPay(res.data);
  552. } else {
  553. that.isThrottle = true
  554. uni.showToast({
  555. title: res.msg,
  556. icon: 'none'
  557. });
  558. }
  559. });
  560. // #endif
  561. // #ifdef MP-WEIXIN
  562. let data = {
  563. parentId: this.dataList.parentId,
  564. couponId: this.coupon ? this.coupon.id : '',
  565. addressId: this.address.addressId ? this.address.addressId : '',
  566. orderType: this.orderType,
  567. type: 3
  568. };
  569. this.$Request.post('/app/wxPay/wxPayJsApiOrder', data).then(res => {
  570. if (res.code == 0) {
  571. uni.requestPayment({
  572. provider: 'wxpay',
  573. timeStamp: res.data.timestamp,
  574. nonceStr: res.data.noncestr,
  575. package: res.data.package,
  576. signType: res.data.signType,
  577. paySign: res.data.sign,
  578. success: function(suc) {
  579. uni.hideLoading();
  580. that.$queue.showToast('支付成功');
  581. setTimeout(function() {
  582. that.isThrottle = true
  583. uni.switchTab({
  584. url: '/pages/order/index'
  585. });
  586. }, 1000);
  587. },
  588. fail: function(err) {
  589. console.log('fail:' + JSON.stringify(err));
  590. that.isThrottle = true
  591. uni.showToast({
  592. title: '支付失败',
  593. icon: 'none'
  594. });
  595. }
  596. });
  597. } else {
  598. uni.showToast({
  599. title: res.msg,
  600. icon: 'none'
  601. });
  602. that.isThrottle = true
  603. }
  604. });
  605. // #endif
  606. // #ifdef APP
  607. let data = {
  608. type: 1,
  609. parentId: this.dataList.parentId,
  610. couponId: this.coupon ? this.coupon.id : '',
  611. addressId: this.address.addressId ? this.address.addressId : '',
  612. orderType: this.orderType
  613. };
  614. this.$Request.post('/app/wxPay/wxPayJsApiOrder', data).then(res => {
  615. console.log(res);
  616. this.showpay = false;
  617. if (res.code == 0) {
  618. this.isCheckPay(res.code, 'wxpay', JSON.stringify(res.data));
  619. } else {
  620. that.isThrottle = true
  621. }
  622. });
  623. // #endif
  624. } else if (this.openWay == 3) {
  625. // #ifdef H5
  626. let data = {
  627. type: 5,
  628. parentId: this.dataList.parentId,
  629. couponId: this.coupon ? this.coupon.id : '',
  630. addressId: this.address.addressId ? this.address.addressId : '',
  631. orderType: this.orderType
  632. };
  633. this.$Request.post('/app/wxPay/wxPayJsApiOrder', data).then(res => {
  634. this.showpay = false;
  635. that.isThrottle = true
  636. const div = document.createElement('div');
  637. div.innerHTML = res.data; //此处form就是后台返回接收到的数据
  638. document.body.appendChild(div);
  639. document.forms[0].submit();
  640. });
  641. // #endif
  642. // #ifdef APP-PLUS
  643. let data = {
  644. type: 4,
  645. parentId: this.dataList.parentId,
  646. couponId: this.coupon ? this.coupon.id : '',
  647. addressId: this.address.addressId ? this.address.addressId : '',
  648. orderType: this.orderType
  649. };
  650. this.$Request.post('/app/wxPay/wxPayJsApiOrder', data).then(res => {
  651. this.showpay = false;
  652. this.setPayment('alipay', res.data);
  653. });
  654. // #endif
  655. }
  656. },
  657. callPay: function(response) {
  658. if (typeof WeixinJSBridge === 'undefined') {
  659. if (document.addEventListener) {
  660. document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(response), false);
  661. } else if (document.attachEvent) {
  662. document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(response));
  663. document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(response));
  664. }
  665. } else {
  666. this.onBridgeReady(response);
  667. }
  668. },
  669. onBridgeReady: function(response) {
  670. let that = this;
  671. if (!response.package) {
  672. return;
  673. }
  674. WeixinJSBridge.invoke(
  675. 'getBrandWCPayRequest', {
  676. appId: response.appid, //公众号名称,由商户传入
  677. timeStamp: response.timestamp, //时间戳,自1970年以来的秒数
  678. nonceStr: response.noncestr, //随机串
  679. package: response.package,
  680. signType: response.signType, //微信签名方式:
  681. paySign: response.sign //微信签名
  682. },
  683. function(res) {
  684. if (res.err_msg === 'get_brand_wcpay_request:ok') {
  685. // 使用以上方式判断前端返回,微信团队郑重提示:
  686. //res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
  687. uni.hideLoading();
  688. uni.showToast({
  689. title: '支付成功',
  690. icon: 'success'
  691. });
  692. setTimeout(function() {
  693. that.isThrottle = true
  694. uni.switchTab({
  695. url: '/pages/order/index'
  696. });
  697. }, 1000);
  698. } else {
  699. that.isThrottle = true
  700. uni.hideLoading();
  701. }
  702. WeixinJSBridge.log(response.err_msg);
  703. }
  704. );
  705. },
  706. isCheckPay(code, name, order) {
  707. let that = this
  708. if (code == 0) {
  709. console.log('999999999999');
  710. this.setPayment(name, order);
  711. } else {
  712. uni.hideLoading();
  713. uni.showToast({
  714. title: '支付信息有误'
  715. });
  716. that.isThrottle = true
  717. }
  718. },
  719. setPayment(name, order) {
  720. console.log(777777777, name, order);
  721. let that = this
  722. uni.requestPayment({
  723. provider: name,
  724. orderInfo: order, //微信、支付宝订单数据
  725. success: function(res) {
  726. uni.hideLoading();
  727. uni.showLoading({
  728. title: '支付成功',
  729. icon: 'none'
  730. });
  731. setTimeout(function() {
  732. that.isThrottle = true
  733. uni.navigateBack();
  734. }, 1000);
  735. },
  736. fail: function(err) {
  737. that.isThrottle = true
  738. uni.hideLoading();
  739. },
  740. complete() {
  741. that.isThrottle = true
  742. uni.hideLoading();
  743. }
  744. });
  745. },
  746. // 获取选择的地址
  747. getAddressDet(e) {
  748. this.$Request.get('/app/address/selectAddressById?addressId=' + e).then(res => {
  749. if (res.code == 0) {
  750. this.address = res.data;
  751. if (JSON.stringify(this.address) != '{}') {
  752. this.getDistance();
  753. }
  754. uni.removeStorageSync('addressId');
  755. }
  756. });
  757. },
  758. // 获取地址列表
  759. getAddressList() {
  760. let that = this;
  761. let data = {
  762. page: 1,
  763. limit: 100
  764. };
  765. that.$Request.get('/app/address/selectAddressList', data).then(res => {
  766. if (res.code == 0) {
  767. that.address = res.data.list[0] ? res.data.list[0] : {};
  768. res.data.list.forEach(ret => {
  769. if (ret.addressDefault == 1) {
  770. that.address = ret;
  771. }
  772. });
  773. console.log(that.address, '我的地址列表460');
  774. if (JSON.stringify(this.address) != '{}') {
  775. this.getDistance();
  776. }
  777. }
  778. });
  779. },
  780. goAddress() {
  781. uni.navigateTo({
  782. url: '/my/address/index?add=1'
  783. });
  784. },
  785. // 点击调起地图查看位置
  786. goMap() {
  787. let that = this;
  788. let lati = parseFloat(that.dataList.shopLat);
  789. let longi = parseFloat(that.dataList.shopLng);
  790. uni.authorize({
  791. scope: 'scope.userLocation',
  792. success(res) {
  793. uni.openLocation({
  794. name: that.dataList.shopName,
  795. latitude: lati,
  796. longitude: longi,
  797. success: function() {}
  798. });
  799. },
  800. fail(err) {}
  801. });
  802. },
  803. // 打电话
  804. call() {
  805. uni.makePhoneCall({
  806. phoneNumber: this.dataList.shopPhone
  807. });
  808. }
  809. }
  810. };
  811. </script>
  812. <style scoped>
  813. .hintPopul {
  814. width: 100%;
  815. height: 100vh;
  816. position: fixed;
  817. top: 0;
  818. background: rgba(0, 0, 0, 0.4);
  819. z-index: 999;
  820. }
  821. .content_ {
  822. position: absolute;
  823. left: 0;
  824. right: 0;
  825. top: 0;
  826. bottom: 0;
  827. margin: auto;
  828. text-align: center;
  829. width: 500rpx;
  830. height: 400rpx;
  831. border-radius: 20rpx;
  832. background-color: #fff;
  833. padding-top: 120rpx;
  834. }
  835. .content_ image {
  836. position: absolute;
  837. top: -50rpx;
  838. left: 0;
  839. right: 0;
  840. margin: auto;
  841. }
  842. .hintText {
  843. font-size: 30rpx;
  844. }
  845. .Btns {
  846. width: 460rpx;
  847. height: 60rpx;
  848. line-height: 60rpx;
  849. text-align: center;
  850. background: #fcd202;
  851. font-size: 28rpx;
  852. border: 2rpx solid #fcd202;
  853. color: #333333;
  854. border-radius: 50rpx;
  855. font-weight: 700;
  856. margin: auto;
  857. }
  858. .goods_address {
  859. width: 94%;
  860. background: #ffffff;
  861. height: 120rpx;
  862. margin: 20rpx auto 0;
  863. border-radius: 18rpx;
  864. }
  865. .address_box {
  866. width: 90%;
  867. margin: 0 auto;
  868. height: 120rpx;
  869. display: flex;
  870. line-height: 120rpx;
  871. }
  872. .address_name {
  873. flex: 1;
  874. font-size: 30rpx;
  875. }
  876. .address_image {
  877. /* flex: 1; */
  878. display: flex;
  879. justify-content: flex-end;
  880. align-items: center;
  881. }
  882. .address_image image {
  883. width: 15rpx;
  884. height: 30rpx;
  885. }
  886. /* 地址 */
  887. .address {
  888. width: 88%;
  889. margin: 3% auto;
  890. padding: 3%;
  891. display: flex;
  892. background-color: #ffffff;
  893. border-radius: 18rpx;
  894. }
  895. .adderss_le {
  896. width: 90%;
  897. line-height: 1.5;
  898. }
  899. .adderss_le_text {
  900. font-size: 30rpx;
  901. font-weight: bold;
  902. color: #333333;
  903. }
  904. .adderss_le_text2 {
  905. font-size: 24rpx;
  906. font-weight: 500;
  907. color: #999999;
  908. display: flex;
  909. }
  910. .adderss_le_text2 view {
  911. margin-left: 2%;
  912. }
  913. .adderss_le_text2 view:first-child {
  914. margin-left: 0;
  915. }
  916. .adderss_ri {
  917. width: 10%;
  918. text-align: right;
  919. line-height: 3;
  920. }
  921. .adderss_ri image {
  922. width: 18rpx;
  923. height: 30rpx;
  924. }
  925. /* 商品 */
  926. .food {
  927. width: 94%;
  928. margin: 3% auto;
  929. padding: 3%;
  930. background-color: #ffffff;
  931. border-radius: 18rpx;
  932. }
  933. .tosend_header_food {
  934. width: 100%;
  935. display: flex;
  936. margin-top: 3%;
  937. }
  938. .tosend_header_food_le {
  939. width: 15%;
  940. }
  941. .tosend_header_food_le image {
  942. width: 110rpx;
  943. height: 110rpx;
  944. }
  945. .tosend_header_food_ce {
  946. margin: 0 0 0 4%;
  947. width: 57%;
  948. }
  949. .tosend_header_food_ri {
  950. text-align: right;
  951. width: 25%;
  952. }
  953. .tosend_header_food_text {
  954. font-size: 34rpx;
  955. font-weight: 500;
  956. color: #333333;
  957. line-height: 1.8;
  958. }
  959. .tosend_header_food_text text {
  960. font-size: 25rpx;
  961. }
  962. .tosend_header_food_text2 {
  963. font-size: 30rpx;
  964. font-weight: 500;
  965. color: #999999;
  966. }
  967. .do_top {
  968. padding-top: 3%;
  969. }
  970. .do_bot {
  971. padding-bottom: 3%;
  972. border-bottom: 2rpx solid #e6e6e6;
  973. }
  974. .tosend_header_do {
  975. width: 100%;
  976. color: #333333;
  977. font-size: 30rpx;
  978. display: flex;
  979. margin-top: 20rpx;
  980. line-height: 1.5;
  981. }
  982. .tosend_header_do view {
  983. /* flex: 1; */
  984. }
  985. .tosend_header_do_ri {
  986. text-align: right;
  987. }
  988. .tosend_header_do_le2 {
  989. font-family: PingFang SC;
  990. font-weight: 500;
  991. color: #999999;
  992. padding-top: 1.5%;
  993. }
  994. .tosend_header_do_ri2 {
  995. text-align: right;
  996. color: #ea0000;
  997. font-size: 40rpx;
  998. }
  999. .tosend_header_do_ri2 text {
  1000. font-size: 30rpx;
  1001. }
  1002. /* 支付 */
  1003. /* .payment_all{
  1004. width: 88%;margin: 3% auto;padding: 3%;background-color: #FFFFFF;
  1005. border-radius: 18rpx;
  1006. }
  1007. .payment{
  1008. width: 100%;display: flex;margin-top: 3%;
  1009. }
  1010. .payment_le{
  1011. width: 13%;
  1012. }
  1013. .payment_le image{
  1014. width: 60rpx;height: 60rpx;
  1015. }
  1016. .payment_ce{
  1017. width: 52%;
  1018. font-size: 30rpx;
  1019. font-weight: bold;
  1020. color: #333333;line-height: 60rpx;
  1021. }
  1022. .payment_ri{
  1023. width: 35%;text-align: right;line-height: 60rpx;
  1024. } */
  1025. /* 结算 */
  1026. .goorder {
  1027. width: 100%;
  1028. padding: 2% 3%;
  1029. position: fixed;
  1030. bottom: 0;
  1031. background-color: #ffffff;
  1032. }
  1033. .goorder_but {
  1034. width: 100%;
  1035. line-height: 3.5;
  1036. text-align: center;
  1037. background: #fcd202;
  1038. border-radius: 36rpx;
  1039. font-weight: 700;
  1040. }
  1041. .goorder_but_ {
  1042. opacity: 0.5;
  1043. }
  1044. .bg {
  1045. background-color: #ffffff;
  1046. }
  1047. .tabBtn {
  1048. /* background-color: #f6f6fa; */
  1049. height: 60rpx;
  1050. line-height: 60rpx;
  1051. color: #999999;
  1052. font-size: 38rpx;
  1053. }
  1054. .active {
  1055. /* width: 82rpx; */
  1056. height: 6rpx;
  1057. background: #fcd202;
  1058. /* position: relative;
  1059. top: -20rpx; */
  1060. z-index: 9;
  1061. }
  1062. </style>