confirmOrder.vue 31 KB

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