index.vue 35 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308
  1. <template>
  2. <view>
  3. <view class='order-submission'>
  4. <view class="allAddress" :style="store_self_mention ? '':'padding-top:10rpx;'">
  5. <view class="nav acea-row">
  6. <view class="item font-color" :class="shippingType == 0 ? 'on' : 'on2'" @tap="addressType(0)"
  7. v-if='store_self_mention'></view>
  8. <view class="item font-color" :class="shippingType == 1 ? 'on' : 'on2'" @tap="addressType(1)"
  9. v-if='store_self_mention'></view>
  10. </view>
  11. <view class='address acea-row row-between-wrapper' @tap='onAddress' v-if='shippingType == 0'
  12. :style="store_self_mention ? '':'border-top-left-radius: 14rpx;border-top-right-radius: 14rpx;'">
  13. <view class='addressCon' v-if="addressInfo.realName">
  14. <view class='name'>{{addressInfo.realName}}
  15. <text class='phone'>{{addressInfo.phone}}</text>
  16. </view>
  17. <view class="acea-row">
  18. <text class='default font-color' v-if="addressInfo.isDefault">[默认]</text>
  19. <text
  20. class="line2">{{addressInfo.province}}{{addressInfo.city}}{{addressInfo.district}}{{addressInfo.detail}}</text>
  21. </view>
  22. </view>
  23. <view class='addressCon' v-else>
  24. <view class='setaddress'>设置收货地址</view>
  25. </view>
  26. <view class='iconfont icon-jiantou'></view>
  27. </view>
  28. <view class='address acea-row row-between-wrapper' v-else @tap="showStoreList">
  29. <block v-if="storeList.length>0">
  30. <view class='addressCon'>
  31. <view class='name'>{{system_store.name}}
  32. <text class='phone'>{{system_store.phone}}</text>
  33. </view>
  34. <view class="line1"> {{system_store.address}}{{", " + system_store.detailedAddress}}
  35. </view>
  36. </view>
  37. <view class='iconfont icon-jiantou'></view>
  38. </block>
  39. <block v-else>
  40. <view>暂无门店信息</view>
  41. </block>
  42. </view>
  43. <view class='line'>
  44. <image src='/static/images/line.jpg'></image>
  45. </view>
  46. </view>
  47. <view class="pad30">
  48. <orderGoods :cartInfo="cartInfo" :orderProNum="orderProNum"></orderGoods>
  49. <view class='wrapper borRadius14'>
  50. <view class='item acea-row row-between-wrapper' @tap='couponTap'
  51. v-if="!orderInfoVo.bargainId && !orderInfoVo.combinationId && !orderInfoVo.seckillId && productType==='normal'">
  52. <view>优惠券</view>
  53. <view class='discount'>{{couponTitle}}
  54. <text class='iconfont icon-jiantou'></text>
  55. </view>
  56. </view>
  57. <view class='item acea-row row-between-wrapper'
  58. v-if="!orderInfoVo.bargainId && !orderInfoVo.combinationId && !orderInfoVo.seckillId && productType==='normal'">
  59. <view>积分抵扣</view>
  60. <!-- -->
  61. <view class='discount acea-row row-middle'>
  62. <view> {{useIntegral ? "剩余积分":"当前积分"}}
  63. <text
  64. class='num font-color'>{{useIntegral ? orderInfoVo.surplusIntegral : orderInfoVo.userIntegral || 0}}</text>
  65. </view>
  66. <checkbox-group @change="ChangeIntegral">
  67. <checkbox :checked='useIntegral ? true : false'
  68. :disabled="orderInfoVo.userIntegral==0 && !useIntegral" />
  69. </checkbox-group>
  70. </view>
  71. </view>
  72. <!-- <view class='item acea-row row-between-wrapper'
  73. v-if="priceGroup.vipPrice > 0 && userInfo.vip && !pinkId && !BargainId && !combinationId && !seckillId">
  74. <view>会员优惠</view>
  75. <view class='discount'>-¥{{priceGroup.vipPrice}}</view>
  76. </view> -->
  77. <view class='item acea-row row-between-wrapper' v-if='shippingType==0'>
  78. <view>快递费用</view>
  79. <view class='discount' v-if='parseFloat(orderInfoVo.freightFee) > 0'>
  80. +¥{{orderInfoVo.freightFee}}
  81. </view>
  82. <view class='discount' v-else>免运费</view>
  83. </view>
  84. <view v-else>
  85. <view class="item acea-row row-between-wrapper">
  86. <view>联系人</view>
  87. <view class="discount textR">
  88. <input type="text" placeholder="请填写您的联系姓名" placeholder-style="color:#ccc;"
  89. placeholder-class="placeholder" @blur='realName'></input>
  90. </view>
  91. </view>
  92. <view class="item acea-row row-between-wrapper">
  93. <view>联系电话</view>
  94. <view class="discount textR">
  95. <input type="text" placeholder="请填写您的联系电话" placeholder-style="color:#ccc;"
  96. placeholder-class="placeholder" @blur='phone'></input>
  97. </view>
  98. </view>
  99. </view>
  100. <view class='item acea-row row-between-wrapper'>
  101. <view>需要发票</view>
  102. <view class='discount acea-row row-middle'>
  103. <view>
  104. {{useReceipt ? "需要":"不需要"}}
  105. </view>
  106. <checkbox-group @change="ChangeReceipt">
  107. <checkbox :checked='useReceipt ? true : false' />
  108. </checkbox-group>
  109. </view>
  110. </view>
  111. <!-- <view class='item acea-row row-between-wrapper' wx:else>
  112. <view>自提门店</view>
  113. <view class='discount'>{{system_store.name}}</view>
  114. </view> -->
  115. <view class='item' v-if="textareaStatus">
  116. <view>备注信息</view>
  117. <textarea v-if="coupon.coupon===false" placeholder-class='placeholder' @input='bindHideKeyboard'
  118. value="" name="mark" placeholder='请添加备注(150字以内)'></textarea>
  119. </view>
  120. </view>
  121. <view class='wrapper borRadius14'>
  122. <view class='item'>
  123. <view>支付方式</view>
  124. <view class='list'>
  125. <view class='payItem acea-row row-middle' :class='active==index ?"on":""'
  126. @tap='payItem(index)' v-for="(item,index) in cartArr" :key='index'
  127. v-if="item.payStatus==1">
  128. <view class='name acea-row row-center-wrapper'>
  129. <view class='iconfont animated'
  130. :class='(item.icon) + " " + (animated==true&&active==index ?"bounceIn":"")'>
  131. </view>
  132. {{item.name}}
  133. </view>
  134. <view class='tip'>{{item.title}}</view>
  135. </view>
  136. </view>
  137. </view>
  138. </view>
  139. <view class='moneyList borRadius14'>
  140. <view class='item acea-row row-between-wrapper'>
  141. <view>商品总价:</view>
  142. <view class='money'>¥{{orderInfoVo.proTotalFee || 0}}</view>
  143. </view>
  144. <view class='item acea-row row-between-wrapper' v-if="orderInfoVo.couponFee > 0">
  145. <view>优惠券抵扣:</view>
  146. <view class='money'>-¥{{orderInfoVo.couponFee}}</view>
  147. </view>
  148. <view class='item acea-row row-between-wrapper' v-if="orderInfoVo.deductionPrice > 0">
  149. <view>积分抵扣:</view>
  150. <view class='money'>-¥{{orderInfoVo.deductionPrice}}</view>
  151. </view>
  152. <view class='item acea-row row-between-wrapper' v-if="orderInfoVo.freightFee > 0">
  153. <view>运费:</view>
  154. <view class='money'>+¥{{orderInfoVo.freightFee}}</view>
  155. </view>
  156. </view>
  157. <view style='height:120rpx;'></view>
  158. </view>
  159. <view class='footer acea-row row-between-wrapper'>
  160. <view>合计:
  161. <text class='font-color'>¥{{orderInfoVo.payFee || 0}}</text>
  162. </view>
  163. <view class='settlement' style='z-index:100' @tap="SubOrder">立即结算</view>
  164. </view>
  165. </view>
  166. <couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone" :openType='openType'
  167. @ChangCoupons="ChangCoupons" :orderShow="orderShow"></couponListWindow>
  168. <addressWindow ref="addressWindow" @changeTextareaStatus="changeTextareaStatus" :address='address'
  169. :pagesUrl="pagesUrl" @OnDefaultAddress="OnDefaultAddress" @OnChangeAddress="OnChangeAddress"
  170. @changeClose="changeClose"></addressWindow>
  171. <!-- #ifdef MP -->
  172. <!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
  173. <!-- #endif -->
  174. <home></home>
  175. </view>
  176. </template>
  177. <script>
  178. import {
  179. //orderConfirm,
  180. getCouponsOrderPrice,
  181. orderCreate,
  182. postOrderComputed,
  183. wechatOrderPay,
  184. wechatQueryPayResult,
  185. loadPreOrderApi
  186. } from '@/api/order.js';
  187. import {
  188. getAddressList,
  189. getAddressDetail
  190. } from '@/api/user.js';
  191. import {
  192. openPaySubscribe
  193. } from '@/utils/SubscribeMessage.js';
  194. import {
  195. storeListApi
  196. } from '@/api/store.js';
  197. import {
  198. CACHE_LONGITUDE,
  199. CACHE_LATITUDE
  200. } from '@/config/cache.js';
  201. import couponListWindow from '@/components/couponListWindow';
  202. import addressWindow from '@/components/addressWindow';
  203. import orderGoods from '@/components/orderGoods';
  204. import home from '@/components/home';
  205. import {
  206. toLogin
  207. } from '@/libs/login.js';
  208. import {
  209. mapGetters
  210. } from "vuex";
  211. // #ifdef MP
  212. import authorize from '@/components/Authorize';
  213. // #endif
  214. export default {
  215. components: {
  216. couponListWindow,
  217. addressWindow,
  218. orderGoods,
  219. home,
  220. // #ifdef MP
  221. authorize
  222. // #endif
  223. },
  224. data() {
  225. return {
  226. orderShow: 'orderShow', //下单页面使用优惠券组件不展示tab切换页
  227. textareaStatus: true,
  228. //支付方式
  229. cartArr: [{
  230. "name": "微信支付",
  231. "icon": "icon-weixin2",
  232. value: 'weixin',
  233. title: '微信快捷支付',
  234. payStatus: 1,
  235. },
  236. {
  237. "name": "余额支付",
  238. "icon": "icon-icon-test",
  239. value: 'yue',
  240. title: '可用余额:',
  241. payStatus: 1,
  242. }
  243. // {
  244. // "name": "线下支付", //offlinePayStatu:1开启线下支付;2关闭;offlinePostage:true有邮费
  245. // "icon": "icon-yinhangqia",
  246. // value: 'offline',
  247. // title: '线下支付',
  248. // payStatus: 1,
  249. // },
  250. ],
  251. payType: 'weixin', //支付方式
  252. openType: 1, //优惠券打开方式 1=使用
  253. active: 0, //支付方式切换
  254. coupon: {
  255. coupon: false,
  256. list: [],
  257. statusTile: '立即使用'
  258. }, //优惠券组件
  259. address: {
  260. address: false,
  261. addressId: 0
  262. }, //地址组件
  263. addressInfo: {}, //地址信息
  264. addressId: 0, //地址id
  265. couponId: 0, //优惠券id
  266. cartId: '', //购物车id
  267. userInfo: {}, //用户信息
  268. mark: '', //备注信息
  269. couponTitle: '请选择', //优惠券
  270. coupon_price: 0, //优惠券抵扣金额
  271. useIntegral: false, //是否使用积分
  272. useReceipt: false,
  273. integral_price: 0, //积分抵扣金额
  274. integral: 0,
  275. ChangePrice: 0, //使用积分抵扣变动后的金额
  276. formIds: [], //收集formid
  277. status: 0,
  278. is_address: false,
  279. toPay: false, //修复进入支付时页面隐藏从新刷新页面
  280. shippingType: 0,
  281. system_store: {},
  282. storePostage: 0,
  283. contacts: '',
  284. contactsTel: '',
  285. mydata: {},
  286. storeList: [],
  287. store_self_mention: 0,
  288. cartInfo: [],
  289. priceGroup: {},
  290. animated: false,
  291. totalPrice: 0,
  292. integralRatio: "0",
  293. pagesUrl: "",
  294. orderKey: "",
  295. // usableCoupon: {},
  296. offlinePostage: "",
  297. isAuto: false, //没有授权的不会自动授权
  298. isShowAuth: false, //是否隐藏授权
  299. payChannel: '',
  300. news: true,
  301. again: false,
  302. addAgain: false,
  303. bargain: false, //是否是砍价
  304. combination: false, //是否是拼团
  305. secKill: false, //是否是秒杀
  306. orderInfoVo: {},
  307. addressList: [], //地址列表数据
  308. orderProNum: 0,
  309. preOrderNo: '', //预下单订单号
  310. isPaying: false
  311. };
  312. },
  313. computed: mapGetters(['isLogin', 'systemPlatform', 'productType']),
  314. watch: {
  315. isLogin: {
  316. handler: function(newV, oldV) {
  317. if (newV) {
  318. this.getloadPreOrder();
  319. //this.getaddressInfo();
  320. }
  321. },
  322. deep: true
  323. }
  324. },
  325. onLoad(options) {
  326. // #ifdef H5
  327. this.payChannel = this.$wechat.isWeixin() ? 'public' : 'weixinh5';
  328. // #endif
  329. // #ifdef MP
  330. this.payChannel = 'routine';
  331. // #endif
  332. // if (!options.cartId) return this.$util.Tips({
  333. // title: '请选择要购买的商品'
  334. // }, {
  335. // tab: 3,
  336. // url: 1
  337. // });
  338. this.preOrderNo = options.preOrderNo || 0;
  339. this.addressId = options.addressId || 0;
  340. this.is_address = options.is_address ? true : false;
  341. this.isPaying = false;
  342. if (this.isLogin) {
  343. //this.getaddressInfo();
  344. this.getloadPreOrder();
  345. } else {
  346. toLogin();
  347. }
  348. },
  349. /**
  350. * 生命周期函数--监听页面显示
  351. */
  352. onShow: function() {
  353. let _this = this
  354. // wx.getLaunchOptionsSync
  355. this.textareaStatus = true;
  356. if (this.isLogin && this.toPay == false) {
  357. //this.getaddressInfo();
  358. }
  359. uni.$on("handClick", res => {
  360. if (res) {
  361. _this.system_store = res.address
  362. }
  363. // 清除监听
  364. uni.$off('handClick');
  365. })
  366. // let pages = getCurrentPages();
  367. // let currPage = pages[pages.length - 1]; //当前页面
  368. // if (currPage.data.storeItem) {
  369. // let json = currPage.data.storeItem;
  370. // this.$set(this, 'system_store', json);
  371. // }
  372. },
  373. /**
  374. * 生命周期函数--监听页面隐藏
  375. */
  376. // onHide: function() {
  377. // this.isClose = true
  378. // },
  379. methods: {
  380. // 订单详情
  381. getloadPreOrder: function() {
  382. loadPreOrderApi(this.preOrderNo).then(res => {
  383. let orderInfoVo = res.data.orderInfoVo
  384. this.orderInfoVo = orderInfoVo;
  385. this.cartInfo = orderInfoVo.orderDetailList;
  386. this.orderProNum = orderInfoVo.orderProNum;
  387. this.address.addressId = this.addressId ? this.addressId : orderInfoVo.addressId;
  388. this.cartArr[1].title = '可用余额:' + orderInfoVo.userBalance;
  389. this.cartArr[1].payStatus = parseInt(res.data.yuePayStatus) === 1 ? 1 : 2;
  390. this.cartArr[0].payStatus = parseInt(res.data.payWeixinOpen) === 1 ? 1 : 0;
  391. this.store_self_mention = res.data.storeSelfMention == 'true' && this.productType ===
  392. 'normal' ? true : false;
  393. //调用子页面方法授权后执行获取地址列表
  394. this.$nextTick(function() {
  395. this.$refs.addressWindow.getAddressList();
  396. })
  397. }).catch(err => {
  398. return this.$util.Tips({
  399. title: err
  400. });
  401. })
  402. },
  403. /**
  404. * 授权回调事件
  405. *
  406. */
  407. onLoadFun: function() {
  408. //this.getaddressInfo();
  409. //调用子页面方法授权后执行获取地址列表
  410. // this.$scope.selectComponent('#address-window').getAddressList();
  411. },
  412. /**
  413. * 获取门店列表数据
  414. */
  415. getList: function() {
  416. let longitude = uni.getStorageSync("user_longitude"); //经度
  417. let latitude = uni.getStorageSync("user_latitude"); //纬度
  418. let data = {
  419. latitude: latitude, //纬度
  420. longitude: longitude, //经度
  421. page: 1,
  422. limit: 10
  423. }
  424. storeListApi(data).then(res => {
  425. let list = res.data.list || [];
  426. this.$set(this, 'storeList', list);
  427. this.$set(this, 'system_store', list[0]);
  428. }).catch(err => {
  429. return this.$util.Tips({
  430. title: err
  431. });
  432. })
  433. },
  434. // 关闭地址弹窗;
  435. changeClose: function() {
  436. this.$set(this.address, 'address', false);
  437. },
  438. /*
  439. * 跳转门店列表
  440. */
  441. showStoreList: function() {
  442. let _this = this
  443. if (this.storeList.length > 0) {
  444. uni.navigateTo({
  445. url: '/pages/users/goods_details_store/index'
  446. })
  447. }
  448. },
  449. // 计算订单价格
  450. computedPrice: function() {
  451. let shippingType = this.shippingType;
  452. postOrderComputed({
  453. addressId: this.address.addressId,
  454. useIntegral: this.useIntegral ? true : false,
  455. couponId: this.couponId,
  456. shippingType: parseInt(shippingType) + 1,
  457. preOrderNo: this.preOrderNo
  458. }).then(res => {
  459. let data = res.data;
  460. this.orderInfoVo.couponFee = data.couponFee;
  461. //赋值操作,userIntegral 当前积分,surplusIntegral 剩余积分
  462. this.orderInfoVo.userIntegral = data.surplusIntegral;
  463. this.orderInfoVo.deductionPrice = data.deductionPrice;
  464. this.orderInfoVo.freightFee = data.freightFee;
  465. this.orderInfoVo.payFee = data.payFee;
  466. this.orderInfoVo.proTotalFee = data.proTotalFee;
  467. this.orderInfoVo.useIntegral = data.useIntegral;
  468. this.orderInfoVo.usedIntegral = data.usedIntegral;
  469. this.orderInfoVo.surplusIntegral = data.surplusIntegral;
  470. //this.orderInfoVo.userIntegral = data.userIntegral;
  471. }).catch(err => {
  472. return this.$util.Tips({
  473. title: err
  474. });
  475. });
  476. },
  477. addressType: function(e) {
  478. let index = e;
  479. this.shippingType = parseInt(index);
  480. this.computedPrice();
  481. if (index == 1) this.getList();
  482. },
  483. bindPickerChange: function(e) {
  484. let value = e.detail.value;
  485. this.shippingType = value;
  486. this.computedPrice();
  487. },
  488. ChangCouponsClone: function() {
  489. this.$set(this.coupon, 'coupon', false);
  490. },
  491. changeTextareaStatus: function() {
  492. for (let i = 0, len = this.coupon.list.length; i < len; i++) {
  493. this.coupon.list[i].use_title = '';
  494. this.coupon.list[i].is_use = 0;
  495. }
  496. this.textareaStatus = true;
  497. this.status = 0;
  498. this.$set(this.coupon, 'list', this.coupon.list);
  499. },
  500. /**
  501. * 处理点击优惠券后的事件
  502. *
  503. */
  504. ChangCoupons: function(e) {
  505. // this.usableCoupon = e
  506. // this.coupon.coupon = false
  507. let index = e,
  508. list = this.coupon.list,
  509. couponTitle = '请选择',
  510. couponId = 0;
  511. for (let i = 0, len = list.length; i < len; i++) {
  512. if (i != index) {
  513. list[i].use_title = '';
  514. list[i].isUse = 0;
  515. }
  516. }
  517. if (list[index].isUse) {
  518. //不使用优惠券
  519. list[index].use_title = '';
  520. list[index].isUse = 0;
  521. } else {
  522. //使用优惠券
  523. list[index].use_title = '不使用';
  524. list[index].isUse = 1;
  525. couponTitle = list[index].name;
  526. couponId = list[index].id;
  527. }
  528. this.couponTitle = couponTitle;
  529. this.couponId = couponId;
  530. this.$set(this.coupon, 'coupon', false);
  531. this.$set(this.coupon, 'list', list);
  532. this.computedPrice();
  533. },
  534. /**
  535. * 使用积分抵扣
  536. */
  537. ChangeIntegral: function() {
  538. this.useIntegral = !this.useIntegral;
  539. this.computedPrice();
  540. },
  541. ChangeReceipt: function() {
  542. this.useReceipt = !this.useReceipt;
  543. },
  544. /**
  545. * 首次进页面展示默认地址
  546. */
  547. OnDefaultAddress: function(e) {
  548. this.addressInfo = e;
  549. this.address.addressId = e.id;
  550. },
  551. /**
  552. * 选择地址后改变事件
  553. * @param object e
  554. */
  555. OnChangeAddress: function(e) {
  556. this.addressInfo = e;
  557. this.address.addressId = e.id;
  558. this.textareaStatus = true;
  559. //this.orderInfoVo.addressId = e;
  560. this.address.address = false;
  561. //this.getaddressInfo();
  562. this.computedPrice();
  563. },
  564. bindHideKeyboard: function(e) {
  565. this.mark = e.detail.value;
  566. },
  567. /**
  568. * 获取当前金额可用优惠券
  569. *
  570. */
  571. getCouponList: function() {
  572. getCouponsOrderPrice(this.preOrderNo).then(res => {
  573. this.$set(this.coupon, 'list', res.data);
  574. this.openType = 1;
  575. });
  576. },
  577. /*
  578. * 获取默认收货地址或者获取某条地址信息
  579. */
  580. getaddressInfo: function() {
  581. let that = this;
  582. if (that.addressId) {
  583. getAddressDetail(that.addressId).then(res => {
  584. if (res.data) {
  585. res.data.isDefault = parseInt(res.data.isDefault);
  586. that.addressInfo = res.data || {};
  587. that.addressId = res.data.id || 0;
  588. that.address.addressId = res.data.id || 0;
  589. }
  590. })
  591. } else {
  592. getAddressDefault().then(res => {
  593. if (res.data) {
  594. res.data.isDefault = parseInt(res.data.isDefault);
  595. that.addressInfo = res.data || {};
  596. that.addressId = res.data.id || 0;
  597. that.address.addressId = res.data.id || 0;
  598. }
  599. })
  600. }
  601. },
  602. payItem: function(e) {
  603. let that = this;
  604. let active = e;
  605. that.active = active;
  606. that.animated = true;
  607. that.payType = that.cartArr[active].value;
  608. that.computedPrice();
  609. setTimeout(function() {
  610. that.car();
  611. }, 500);
  612. },
  613. couponTap: function() {
  614. this.coupon.coupon = true;
  615. if (!this.coupon.list.length) this.getCouponList();
  616. },
  617. car: function() {
  618. let that = this;
  619. that.animated = false;
  620. },
  621. onAddress: function() {
  622. let that = this;
  623. that.textareaStatus = false;
  624. that.address.address = true;
  625. that.pagesUrl = '/pages/users/user_address_list/index?preOrderNo=' + this.preOrderNo;
  626. },
  627. realName: function(e) {
  628. this.contacts = e.detail.value;
  629. },
  630. phone: function(e) {
  631. this.contactsTel = e.detail.value;
  632. },
  633. payment: function(data) {
  634. let that = this;
  635. orderCreate(data).then(res => {
  636. that.getOrderPay(res.data.orderNo, '支付成功');
  637. }).catch(err => {
  638. uni.hideLoading();
  639. return that.$util.Tips({
  640. title: err
  641. });
  642. });
  643. },
  644. getOrderPay: function(orderNo, message) {
  645. let that = this;
  646. let goPages = '/pages/order_pay_status/index?order_id=' + orderNo + '&msg=' + message;
  647. wechatOrderPay({
  648. orderNo: orderNo,
  649. payChannel: that.payChannel,
  650. payType: that.payType,
  651. scene: that.productType === 'normal' ? 0 : 1177 //下单时小程序的场景值
  652. }).then(res => {
  653. let jsConfig = res.data.jsConfig;
  654. switch (res.data.payType) {
  655. case 'weixin':
  656. // #ifdef MP
  657. uni.requestPayment({
  658. timeStamp: jsConfig.timeStamp,
  659. nonceStr: jsConfig.nonceStr,
  660. package: jsConfig.packages,
  661. signType: jsConfig.signType,
  662. paySign: jsConfig.paySign,
  663. ticket: that.productType === 'normal' ? null : jsConfig.ticket,
  664. success: function(ress) {
  665. uni.hideLoading();
  666. wechatQueryPayResult(orderNo).then(res => {
  667. uni.hideLoading();
  668. if (that.orderInfoVo.bargainId || that.orderInfoVo
  669. .combinationId || that.pinkId || that
  670. .orderInfoVo.seckillId)
  671. return that.$util.Tips({
  672. title: '支付成功',
  673. icon: 'success'
  674. }, {
  675. tab: 4,
  676. url: goPages
  677. });
  678. return that.$util.Tips({
  679. title: '支付成功',
  680. icon: 'success'
  681. }, {
  682. tab: 5,
  683. url: goPages
  684. });
  685. }).cache(err => {
  686. uni.hideLoading();
  687. return that.$util.Tips({
  688. title: err
  689. });
  690. })
  691. },
  692. fail: function(e) {
  693. uni.hideLoading();
  694. return that.$util.Tips({
  695. title: '取消支付'
  696. }, {
  697. tab: 5,
  698. url: goPages + '&status=2'
  699. });
  700. },
  701. complete: function(e) {
  702. uni.hideLoading();
  703. //关闭当前页面跳转至订单状态
  704. if (e.errMsg == 'requestPayment:cancel') return that.$util
  705. .Tips({
  706. title: '取消支付'
  707. }, {
  708. tab: 5,
  709. url: goPages + '&status=2'
  710. });
  711. },
  712. })
  713. // #endif
  714. // #ifdef H5
  715. let data = {
  716. timestamp: jsConfig.timeStamp,
  717. nonceStr: jsConfig.nonceStr,
  718. package: jsConfig.packages,
  719. signType: jsConfig.signType,
  720. paySign: jsConfig.paySign
  721. };
  722. that.$wechat.pay(data).then(res => {
  723. if (res.errMsg == 'chooseWXPay:cancel') {
  724. uni.hideLoading();
  725. return that.$util.Tips({
  726. title: '取消支付'
  727. }, {
  728. tab: 5,
  729. url: goPages + '&status=2'
  730. });
  731. } else {
  732. wechatQueryPayResult(orderNo).then(res => {
  733. uni.hideLoading();
  734. return that.$util.Tips({
  735. title: '支付成功',
  736. icon: 'success'
  737. }, {
  738. tab: 5,
  739. url: goPages
  740. });
  741. }).cache(err => {
  742. uni.hideLoading();
  743. return that.$util.Tips({
  744. title: err
  745. });
  746. })
  747. }
  748. }).cache(res => {
  749. uni.hideLoading();
  750. return that.$util.Tips({
  751. title: '取消支付'
  752. }, {
  753. tab: 5,
  754. url: goPages + '&status=0'
  755. });
  756. });
  757. // #endif
  758. break;
  759. case 'yue':
  760. uni.hideLoading();
  761. return that.$util.Tips({
  762. title: message
  763. }, {
  764. tab: 5,
  765. url: goPages + '&status=1'
  766. });
  767. break;
  768. case 'weixinh5':
  769. uni.hideLoading();
  770. that.$util.Tips({
  771. title: '订单创建成功'
  772. }, {
  773. tab: 5,
  774. url: goPages + '&status=0'
  775. });
  776. setTimeout(() => {
  777. location.href = jsConfig.mwebUrl + '&redirect_url=' + window.location
  778. .protocol + '//' + window.location.host +
  779. goPages + '&status=1';
  780. }, 100)
  781. break;
  782. }
  783. }).catch(err => {
  784. uni.hideLoading();
  785. return that.$util.Tips({
  786. title: err
  787. });
  788. });
  789. },
  790. getPayType: function(status, orderId, message, jsConfig) {
  791. let that = this;
  792. let goPages = '/pages/order_pay_status/index?order_id=' + orderId + '&msg=' + message;
  793. switch (status) {
  794. case 'ORDER_EXIST':
  795. case 'EXTEND_ORDER':
  796. case 'PAY_ERROR':
  797. uni.hideLoading();
  798. return that.$util.Tips({
  799. title: message
  800. }, {
  801. tab: 5,
  802. url: goPages
  803. });
  804. break;
  805. case 'SUCCESS':
  806. uni.hideLoading();
  807. if (that.orderInfoVo.bargainId || that.orderInfoVo.combinationId || that.pinkId || that
  808. .orderInfoVo.seckillId)
  809. return that.$util.Tips({
  810. title: message,
  811. icon: 'success'
  812. }, {
  813. tab: 4,
  814. url: goPages
  815. });
  816. return that.$util.Tips({
  817. title: message,
  818. icon: 'success'
  819. }, {
  820. tab: 5,
  821. url: goPages
  822. });
  823. break;
  824. case 'WECHAT_PAY':
  825. // #ifdef MP
  826. that.toPay = true;
  827. let packagess = 'prepay_id=' + jsConfig.prepayId;
  828. uni.requestPayment({
  829. timeStamp: jsConfig.timeStamp.toString(),
  830. nonceStr: jsConfig.nonceStr,
  831. package: packagess,
  832. signType: jsConfig.signType,
  833. paySign: jsConfig.paySign,
  834. success: function(res) {
  835. uni.hideLoading();
  836. if (that.orderInfoVo.bargainId || that.orderInfoVo.combinationId || that
  837. .pinkId || that.orderInfoVo.seckillId)
  838. return that.$util.Tips({
  839. title: '支付成功',
  840. icon: 'success'
  841. }, {
  842. tab: 4,
  843. url: goPages
  844. });
  845. return that.$util.Tips({
  846. title: '支付成功',
  847. icon: 'success'
  848. }, {
  849. tab: 5,
  850. url: goPages
  851. });
  852. },
  853. fail: function(e) {
  854. uni.hideLoading();
  855. return that.$util.Tips({
  856. title: '取消支付'
  857. }, {
  858. tab: 5,
  859. url: goPages + '&status=0'
  860. });
  861. },
  862. complete: function(e) {
  863. uni.hideLoading();
  864. //关闭当前页面跳转至订单状态
  865. if (res.errMsg == 'requestPayment:cancel') return that.$util.Tips({
  866. title: '取消支付'
  867. }, {
  868. tab: 5,
  869. url: goPages + '&status=0'
  870. });
  871. },
  872. })
  873. // #endif
  874. // #ifdef H5
  875. let jsConfigAgain = jsConfig;
  876. let packages = 'prepay_id=' + jsConfigAgain.prepayId;
  877. let data = {
  878. timestamp: jsConfigAgain.timeStamp,
  879. nonceStr: jsConfigAgain.nonceStr,
  880. package: packages,
  881. signType: jsConfigAgain.signType,
  882. paySign: jsConfigAgain.paySign,
  883. h5PayUrl: jsConfigAgain.h5PayUrl
  884. };
  885. this.$wechat.pay(data).then(res => {
  886. return that.$util.Tips({
  887. title: '支付成功',
  888. icon: 'success'
  889. }, {
  890. tab: 5,
  891. url: goPages
  892. });
  893. }).cache(res => {
  894. if (res.errMsg == 'requestPayment:cancel') return that.$util.Tips({
  895. title: '取消支付'
  896. }, {
  897. tab: 5,
  898. url: goPages + '&status=0'
  899. });
  900. })
  901. // #endif
  902. break;
  903. case 'PAY_DEFICIENCY':
  904. uni.hideLoading();
  905. return that.$util.Tips({
  906. title: message
  907. }, {
  908. tab: 5,
  909. url: goPages + '&status=1'
  910. });
  911. break;
  912. case "WECHAT_H5_PAY": //网页版公众号支付
  913. setTimeout(() => {
  914. let domain = encodeURIComponent(location.href);
  915. let urls = jsConfigAgain.h5PayUrl + '&redirect_url=' + domain;
  916. location.href = urls;
  917. return that.$util.Tips({
  918. title: '支付成功',
  919. icon: 'success'
  920. }, {
  921. tab: 5,
  922. url: goPages
  923. });
  924. }, 100);
  925. break;
  926. }
  927. },
  928. SubOrder: function(e) {
  929. let that = this,
  930. data = {};
  931. if (!that.payType) return that.$util.Tips({
  932. title: '请选择支付方式'
  933. });
  934. if (!that.address.addressId && !that.shippingType) return that.$util.Tips({
  935. title: '请选择收货地址'
  936. });
  937. if (that.shippingType == 1) {
  938. if (that.contacts == "" || that.contactsTel == "") {
  939. return that.$util.Tips({
  940. title: '请填写联系人或联系人电话'
  941. });
  942. }
  943. if (!/^1(3|4|5|7|8|9|6)\d{9}$/.test(that.contactsTel)) {
  944. return that.$util.Tips({
  945. title: '请填写正确的手机号'
  946. });
  947. }
  948. if (!/^[\u4e00-\u9fa5\w]{2,16}$/.test(that.contacts)) {
  949. return that.$util.Tips({
  950. title: '请填写您的真实姓名'
  951. });
  952. }
  953. if (that.storeList.length == 0) return that.$util.Tips({
  954. title: '暂无门店,请选择其他方式'
  955. });
  956. }
  957. data = {
  958. realName: that.contacts,
  959. phone: that.contactsTel,
  960. addressId: that.address.addressId,
  961. couponId: that.couponId,
  962. payType: that.payType,
  963. useIntegral: that.useIntegral,
  964. receipt: that.useReceipt,
  965. preOrderNo: that.preOrderNo,
  966. mark: that.mark,
  967. storeId: that.system_store.id || 0,
  968. shippingType: that.$util.$h.Add(that.shippingType, 1),
  969. payChannel: that.payChannel || 'weixinh5'
  970. };
  971. if (this.isPaying) {
  972. return;
  973. }
  974. this.isPayin = true;
  975. if (data.payType == 'yue' && parseFloat(that.userInfo.nowMoney) < parseFloat(that.totalPrice))
  976. return that.$util
  977. .Tips({
  978. title: '余额不足!'
  979. });
  980. uni.showLoading({
  981. title: '订单支付中',
  982. mask: true
  983. });
  984. // #ifdef MP
  985. openPaySubscribe().then(() => {
  986. that.payment(data);
  987. });
  988. // #endif
  989. // #ifndef MP
  990. that.payment(data);
  991. // #endif
  992. }
  993. }
  994. }
  995. </script>
  996. <style lang="scss" scoped>
  997. .line2 {
  998. width: 504rpx;
  999. }
  1000. .textR {
  1001. text-align: right;
  1002. }
  1003. .order-submission .line {
  1004. width: 100%;
  1005. height: 3rpx;
  1006. }
  1007. .order-submission .line image {
  1008. width: 100%;
  1009. height: 100%;
  1010. display: block;
  1011. }
  1012. .order-submission .address {
  1013. padding: 28rpx;
  1014. background-color: #fff;
  1015. box-sizing: border-box;
  1016. }
  1017. .order-submission .address .addressCon {
  1018. width: 596rpx;
  1019. font-size: 26rpx;
  1020. color: #666;
  1021. }
  1022. .order-submission .address .addressCon .name {
  1023. font-size: 30rpx;
  1024. color: #282828;
  1025. font-weight: bold;
  1026. margin-bottom: 10rpx;
  1027. }
  1028. .order-submission .address .addressCon .name .phone {
  1029. margin-left: 50rpx;
  1030. }
  1031. .order-submission .address .addressCon .default {
  1032. margin-right: 12rpx;
  1033. }
  1034. .order-submission .address .addressCon .setaddress {
  1035. color: #333;
  1036. font-size: 28rpx;
  1037. }
  1038. .order-submission .address .iconfont {
  1039. font-size: 35rpx;
  1040. color: #707070;
  1041. }
  1042. .order-submission .allAddress {
  1043. width: 100%;
  1044. background: linear-gradient(to bottom, #e93323 0%, #f5f5f5 100%);
  1045. // background-image: linear-gradient(to bottom, #e93323 0%, #f5f5f5 100%);
  1046. // background-image: -webkit-linear-gradient(to bottom, #e93323 0%, #f5f5f5 100%);
  1047. // background-image: -moz-linear-gradient(to bottom, #e93323 0%, #f5f5f5 100%);
  1048. padding: 100rpx 30rpx 0 30rpx;
  1049. }
  1050. .order-submission .allAddress .nav {
  1051. width: 690rpx;
  1052. margin: 0 auto;
  1053. }
  1054. .order-submission .allAddress .nav .item {
  1055. width: 334rpx;
  1056. }
  1057. .order-submission .allAddress .nav .item.on {
  1058. position: relative;
  1059. width: 230rpx;
  1060. }
  1061. .order-submission .allAddress .nav .item.on::before {
  1062. position: absolute;
  1063. bottom: 0;
  1064. content: "快递配送";
  1065. font-size: 28rpx;
  1066. display: block;
  1067. height: 0;
  1068. width: 336rpx;
  1069. border-width: 0 20rpx 80rpx 0;
  1070. border-style: none solid solid;
  1071. border-color: transparent transparent #fff;
  1072. z-index: 2;
  1073. border-radius: 14rpx 36rpx 0 0;
  1074. text-align: center;
  1075. line-height: 80rpx;
  1076. }
  1077. .order-submission .allAddress .nav .item:nth-of-type(2).on::before {
  1078. content: "到店自提";
  1079. border-width: 0 0 80rpx 20rpx;
  1080. border-radius: 36rpx 14rpx 0 0;
  1081. }
  1082. .order-submission .allAddress .nav .item.on2 {
  1083. position: relative;
  1084. }
  1085. .order-submission .allAddress .nav .item.on2::before {
  1086. position: absolute;
  1087. bottom: 0;
  1088. content: "到店自提";
  1089. font-size: 28rpx;
  1090. display: block;
  1091. height: 0;
  1092. width: 401rpx;
  1093. border-width: 0 0 60rpx 60rpx;
  1094. border-style: none solid solid;
  1095. border-color: transparent transparent #f7c1bd;
  1096. border-radius: 36rpx 14rpx 0 0;
  1097. text-align: center;
  1098. line-height: 60rpx;
  1099. }
  1100. .order-submission .allAddress .nav .item:nth-of-type(1).on2::before {
  1101. content: "快递配送";
  1102. border-width: 0 60rpx 60rpx 0;
  1103. border-radius: 14rpx 36rpx 0 0;
  1104. }
  1105. .order-submission .allAddress .address {
  1106. width: 690rpx;
  1107. max-height: 180rpx;
  1108. margin: 0 auto;
  1109. }
  1110. .order-submission .allAddress .line {
  1111. width: 100%;
  1112. margin: 0 auto;
  1113. }
  1114. .order-submission .wrapper .item .discount .placeholder {
  1115. color: #ccc;
  1116. }
  1117. .order-submission .wrapper {
  1118. background-color: #fff;
  1119. margin-top: 15rpx;
  1120. }
  1121. .order-submission .wrapper .item {
  1122. padding: 27rpx 24rpx;
  1123. font-size: 30rpx;
  1124. color: #333333;
  1125. border-bottom: 1px solid #F5F5F5;
  1126. }
  1127. .order-submission .wrapper .item .discount {
  1128. font-size: 30rpx;
  1129. color: #333;
  1130. }
  1131. .order-submission .wrapper .item .discount .iconfont {
  1132. color: #515151;
  1133. font-size: 30rpx;
  1134. margin-left: 15rpx;
  1135. }
  1136. .order-submission .wrapper .item .discount .num {
  1137. font-size: 32rpx;
  1138. margin-right: 20rpx;
  1139. }
  1140. .order-submission .wrapper .item .shipping {
  1141. font-size: 30rpx;
  1142. color: #999;
  1143. position: relative;
  1144. padding-right: 58rpx;
  1145. }
  1146. .order-submission .wrapper .item .shipping .iconfont {
  1147. font-size: 35rpx;
  1148. color: #707070;
  1149. position: absolute;
  1150. right: 0;
  1151. top: 50%;
  1152. transform: translateY(-50%);
  1153. margin-left: 30rpx;
  1154. }
  1155. .order-submission .wrapper .item textarea {
  1156. background-color: #f9f9f9;
  1157. width: auto !important;
  1158. height: 140rpx;
  1159. border-radius: 14rpx;
  1160. margin-top: 30rpx;
  1161. padding: 15rpx;
  1162. box-sizing: border-box;
  1163. font-weight: 400;
  1164. }
  1165. .order-submission .wrapper .item .placeholder {
  1166. color: #ccc;
  1167. }
  1168. .order-submission .wrapper .item .list {
  1169. margin-top: 35rpx;
  1170. }
  1171. .order-submission .wrapper .item .list .payItem {
  1172. border: 1px solid #eee;
  1173. border-radius: 14rpx;
  1174. height: 86rpx;
  1175. width: 100%;
  1176. box-sizing: border-box;
  1177. margin-top: 20rpx;
  1178. font-size: 28rpx;
  1179. color: #282828;
  1180. }
  1181. .order-submission .wrapper .item .list .payItem.on {
  1182. border-color: #fc5445;
  1183. color: $theme-color;
  1184. }
  1185. .order-submission .wrapper .item .list .payItem .name {
  1186. width: 50%;
  1187. text-align: center;
  1188. border-right: 1px solid #eee;
  1189. }
  1190. .order-submission .wrapper .item .list .payItem .name .iconfont {
  1191. width: 44rpx;
  1192. height: 44rpx;
  1193. border-radius: 50%;
  1194. text-align: center;
  1195. line-height: 44rpx;
  1196. background-color: #fe960f;
  1197. color: #fff;
  1198. font-size: 30rpx;
  1199. margin-right: 15rpx;
  1200. }
  1201. .order-submission .wrapper .item .list .payItem .name .iconfont.icon-weixin2 {
  1202. background-color: #41b035;
  1203. }
  1204. .order-submission .wrapper .item .list .payItem .tip {
  1205. width: 49%;
  1206. text-align: center;
  1207. font-size: 26rpx;
  1208. color: #aaa;
  1209. }
  1210. .order-submission .moneyList {
  1211. margin-top: 15rpx;
  1212. background-color: #fff;
  1213. padding: 30rpx;
  1214. }
  1215. .order-submission .moneyList .item {
  1216. font-size: 28rpx;
  1217. color: #282828;
  1218. }
  1219. .order-submission .moneyList .item~.item {
  1220. margin-top: 20rpx;
  1221. }
  1222. .order-submission .moneyList .item .money {
  1223. color: #666666;
  1224. }
  1225. .order-submission .footer {
  1226. width: 100%;
  1227. height: 100rpx;
  1228. background-color: #fff;
  1229. padding: 0 30rpx;
  1230. font-size: 28rpx;
  1231. color: #333;
  1232. box-sizing: border-box;
  1233. position: fixed;
  1234. bottom: 0;
  1235. left: 0;
  1236. }
  1237. .order-submission .footer .settlement {
  1238. font-size: 30rpx;
  1239. color: #fff;
  1240. width: 240rpx;
  1241. height: 70rpx;
  1242. background-color: $theme-color;
  1243. border-radius: 50rpx;
  1244. text-align: center;
  1245. line-height: 70rpx;
  1246. }
  1247. .footer .transparent {
  1248. opacity: 0
  1249. }
  1250. </style>