create-order.vue 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884
  1. <template>
  2. <view class="container order clearfix" :style="{ paddingBottom: isIphoneX ? '250rpx' : '214rpx' }">
  3. <!-- 地址选择 -->
  4. <cm-address-temp ref="choiceAddress" v-if="isRequest" :addressData="addressData" />
  5. <!-- 商品 -->
  6. <cm-goods-temp
  7. ref="goods"
  8. v-if="isRequest"
  9. :goodsData.sync="goodsData"
  10. @handleGoodList="handChangeInputGoodsList"
  11. @changeChina="handleChangeChina"
  12. @changePostage="handleChangePostage"
  13. />
  14. <!-- 发票信息 -->
  15. <cm-invice-popup ref="invoice" v-if="isRequest" :invoiceDatas="invoiceData" @handleChoiceaInvoice="handleChoiceaInvoiceData" />
  16. <!-- 优惠券选择弹窗 -->
  17. <cm-coupon-popup ref="coupon" v-if="isCouponShow" :couponList="couponList" @handleChoiceaCoupon="handleChoiceaCouponData" />
  18. <!-- 兑换优惠券弹窗 -->
  19. <cm-coupon-chang v-if="isExchangePopup" />
  20. <!-- 优惠券 -->
  21. <cm-coupon-tips ref="coupon-tips" :coupon="ExchangeCouponData" v-if="isCouponModel" />
  22. <!-- 余额抵扣 -->
  23. <view class="invoice-balance" v-show="!rechargeGoods">
  24. <view class="balabce-t">
  25. <view class="balabce-t-le">余额抵扣</view>
  26. <view class="balabce-t-ri">
  27. <view class="money">
  28. <text>可用余额:</text> <text>¥{{ userMoney | NumFormat }}</text>
  29. </view>
  30. <view class="checkbox-box">
  31. <button
  32. class="checkbox iconfont"
  33. hover-class="btn-hover"
  34. v-if="userMoney != 0"
  35. @click.stop="checkedBalabce"
  36. :class="[ischecked ? 'icon-yixuanze' : 'icon-weixuanze']"
  37. ></button>
  38. </view>
  39. </view>
  40. </view>
  41. <view class="balabce-b" :class="{ 'balabce-b--hide': !ischecked }">
  42. <view
  43. class="balabce-b-text animation"
  44. :style="{
  45. transform: ischecked ? 'translateY(0)' : 'translateY(-50%)',
  46. '-webkit-transform': ischecked ? 'translateY(0)' : 'translateY(-50%)'
  47. }"
  48. >
  49. <text>当前使用:¥{{ deductMoney | NumFormat }},剩余:¥{{ surplusMoney | NumFormat }}</text>
  50. </view>
  51. </view>
  52. </view>
  53. <!-- 底部 -->
  54. <view class="footer-wrapper" :style="{ paddingBottom: isIphoneX ? '68rpx' : '0rpx' }">
  55. <cm-return-popup
  56. v-if="returnGoodsStutas"
  57. :content="helpContent"
  58. @change="onAgreementChange"
  59. />
  60. <view class="footer">
  61. <view class="footer-le">
  62. <view class="footer-count">
  63. <text>共{{ totalCount }}件商品</text>
  64. </view>
  65. <view class="footer-price">
  66. <view class="sum" :class="totalDiscountAmount == 0 ? 'none' : ''">
  67. 总价:<text class="price">¥{{ orderShouldPayFee | NumFormat }}</text>
  68. </view>
  69. <view class="sum-none" v-if="totalDiscountAmount > 0">
  70. <text class="money-reduced"
  71. >共减<text>¥{{ totalDiscountAmount | NumFormat }}</text></text
  72. >
  73. </view>
  74. </view>
  75. </view>
  76. <view class="footer-submit" @click.stop="orderSubmitMit">
  77. <view class="btn" :class="isSubLoading ? 'disabled' : ''">提交订单</view>
  78. </view>
  79. </view>
  80. </view>
  81. <!-- 提示弹窗 -->
  82. <tui-modal
  83. :show="showModal"
  84. @click="handleClick"
  85. @cancel="hideMobel"
  86. :content="contentModalText"
  87. :button="modalButton"
  88. color="#333"
  89. :size="28"
  90. shape="circle"
  91. :maskClosable="false"
  92. />
  93. <tui-modal
  94. :show="agreementModel"
  95. title="提示"
  96. content="请先阅读《特殊商品退货须知》并勾选后再提交订单~"
  97. shape="circle"
  98. color="#333"
  99. :size="28"
  100. :button="agreementModelButtons"
  101. @click="agreementModel = false"
  102. />
  103. </view>
  104. </template>
  105. <script>
  106. import { mapState, mapMutations } from 'vuex'
  107. import cmAddressTemp from './components/cm-address-temp'
  108. import cmGoodsTemp from './components/cm-goods-temp'
  109. import cmInvicePopup from './components/cm-invice-popup'
  110. import cmCouponPopup from './components/cm-coupon-popup'
  111. import cmCouponChang from './components/cm-coupon-chang'
  112. import cmReturnPopup from './components/cm-return-popup'
  113. import cmCouponTips from './components/cm-coupon-tips'
  114. import conMixins from './mixins/conMixins.js'
  115. export default {
  116. mixins: [conMixins],
  117. components: {
  118. cmAddressTemp,
  119. cmGoodsTemp,
  120. cmInvicePopup,
  121. cmCouponPopup,
  122. cmCouponChang,
  123. cmReturnPopup,
  124. cmCouponTips
  125. },
  126. data() {
  127. return {
  128. isIphoneX: this.$store.state.isIphoneX,
  129. isSubLoading: false,
  130. confirmType: 1,
  131. confirmParam: {
  132. cartType: 1, // 购买类型:(1自主下单, 3协销下单)
  133. orderMiniType: 0, // 订单提交状态 0初始提交 1 继续提交
  134. orderSource: 6, // 订单来源 1WWW 6小程序[采美,星范]
  135. addressId: 0, // 收货地址Id
  136. clubCouponId: 0, // 关联优惠券Id
  137. clubId: 0, // 机构Id
  138. orderInfo: [], // 订单商品数据
  139. orderInvoice: { type: 0 }, // 订单发票信息
  140. payInfo: {// 订单金额数据
  141. orderShouldPayFee: 0, // 订单最终支付金额
  142. balancePayFlag: 0, // 勾选余额的状态(1使用,0不使用)
  143. clauseId: 0, // 条款Id
  144. postage: '0.00', // 运费金额
  145. postageFlag: 0, // 运费类型
  146. userBeans: 0, // 抵扣采美豆数量
  147. rebateFlag: 0 // 是否返佣订单
  148. },
  149. unionId: uni.getStorageSync('unionId') // 用户unionId
  150. }, // 提交订单参数
  151. productIds: '', // 获取上一级页面商品信息
  152. submitState: '', // 提交状态
  153. isRequest: false, // 是否加载完成渲染子组件
  154. isFreight: false, // 是否加载完成渲染子组件
  155. isExchangePopup: false, // 控制兑换优惠券弹窗
  156. ischecked: false, // 是否勾选余额
  157. addressData: {}, // 初始化地址信息
  158. goodsData: [], // 初始化商品信息
  159. couponList: [], // 初始化优惠券信息
  160. invoiceData: { type: 0 }, // 初始化发票信息
  161. freightData: {}, // 邮费数据
  162. orderInfo: [], // 提交的商品信息
  163. rechargeGoods: null, // 判断订单里有定金商品或者充值商品时,余额抵扣部分不显示
  164. freightBeansMoney: 0, // 存储采美豆抵扣金额
  165. isCouponShow: false, // 是否显示可选优惠券
  166. isCheckedBeans: false, // 是否抵扣采美豆
  167. isCouponModel: false, // 兑换优惠券成功提示
  168. ExchangeCouponData: {}, // 兑换优惠券信息
  169. contentModalText: '采购金额过小,将扣除500采美豆,建议您前往采美旗下“颜选美学”小程序购买小额商品。', //操作文字提示语句
  170. modalButton: [
  171. {
  172. text: '前往颜选美学',
  173. type: 'gray',
  174. plain: true //是否空心
  175. },
  176. {
  177. text: '继续提交',
  178. customStyle: {
  179. color: '#fff',
  180. bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)'
  181. },
  182. plain: false
  183. }
  184. ],
  185. showModal: false,
  186. showModalstauts: 0,
  187. returnGoodsStutas: false,
  188. helpContent: '',
  189. agreementActive: false,
  190. agreementModel: false,
  191. agreementModelButtons: [
  192. {
  193. text: '确定',
  194. customStyle: {
  195. color: '#fff',
  196. bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)'
  197. },
  198. plain: false
  199. }
  200. ]
  201. }
  202. },
  203. onLoad(option) {
  204. //商品数据
  205. this.initStorage(option)
  206. },
  207. filters: {
  208. NumFormat(value) {
  209. //处理金额
  210. return Number(value).toFixed(2)
  211. }
  212. },
  213. methods: {
  214. onAgreementChange(val) {
  215. this.agreementActive = val
  216. },
  217. async initStorage(option) {
  218. const data = JSON.parse(option.data)
  219. const userInfo = await this.$api.getStorage()
  220. this.handleComType = option.type*1
  221. this.productParam.userId = this.cartParam.userId = userInfo.userId
  222. this.supportParm.userId = userInfo.userId
  223. this.confirmParam.clubId = userInfo.clubId
  224. switch (option.type) {
  225. case '1': // 商品详情立即购买
  226. this.confirmParam.cartType = 2
  227. this.productParam.productCount = data.data.productCount
  228. this.productParam.productId = data.data.productIds
  229. this.productParam.skuId = data.data.skuId
  230. this.productIds = data.data.productIds
  231. this.getAddressData(userInfo.userId,1)
  232. break
  233. case '2': // 购物车结算
  234. this.confirmParam.cartType = 1
  235. this.confirmType = 2
  236. this.cartParam.skuIds = data.data.skuIds
  237. this.getAddressData(userInfo.userId,2)
  238. break
  239. case '3': // 组合商品立即购买
  240. this.confirmParam.cartType = 2
  241. this.confirmType = 2
  242. this.supportParm.productInfo = JSON.stringify(data.data)
  243. this.getAddressData(userInfo.userId,3)
  244. }
  245. },
  246. async getAddressData(userId,type) {
  247. //获取地址信息
  248. try{
  249. const params = {pageNum: 1,pageSize: 1,userId: userId }
  250. const res = await this.UserService.QueryAddressList(params)
  251. const data = res.data
  252. if (data.list && data.list.length > 0) {
  253. this.addressData = data.list[0]
  254. this.confirmParam.addressId = this.addressData.addressId
  255. this.cartParam.townId = this.addressData.townId
  256. this.productParam.townId = this.addressData.townId
  257. this.supportParm.townId = this.addressData.townId
  258. if(type === 1) {//立即都买提交
  259. this.GetProductCreateOrderInfo()
  260. }
  261. if(type === 2) {//购物车提交
  262. this.CartCreateOrderInfo()
  263. }
  264. if(type === 3) {//组合商品提交
  265. this.GetOrderClubProductSupporting()
  266. }
  267. }
  268. }catch(error){
  269. console.log('获取订单地址异常')
  270. }
  271. },
  272. // 商品立即购买确认订单数据初始化
  273. async GetProductCreateOrderInfo() {
  274. try{
  275. const res = await this.OrderService.ProductCreateOrderInfo(this.productParam)
  276. this.setCreatDataInfo(res.data)
  277. }catch(error){
  278. this.$util.msg(error.msg, 2000)
  279. }
  280. },
  281. // 组合商品立即购买确认订单数据初始化
  282. async GetOrderClubProductSupporting() {
  283. try{
  284. const res = await this.OrderService.OrderClubProductSupporting(this.supportParm)
  285. this.setCreatDataInfo(res.data)
  286. }catch(error){
  287. this.$util.msg(error.msg, 2000)
  288. }
  289. },
  290. // 购物车去结算确认订单数据初始化
  291. async CartCreateOrderInfo() {
  292. try{
  293. const res = await this.OrderService.CartCreateOrderInfo(this.cartParam)
  294. this.setCreatDataInfo(res.data)
  295. }catch(error){
  296. this.$util.msg(error.msg, 2000)
  297. }
  298. },
  299. // 公共初始化数据
  300. setCreatDataInfo(data) {
  301. this.isRequest = true
  302. this.goodsData = data.list.map((el)=>{
  303. el.handlePostageFlag = el.postageFlag
  304. return el
  305. });
  306. this.couponList = data.couponList
  307. this.userMoney = data.userMoney
  308. this.reducedPrice = data.reducedPrice
  309. this.totalCount = data.totalCount
  310. this.allPrice = data.totalPrice
  311. this.rechargeGoods = data.rechargeGoods
  312. if (this.couponList.length > 0) {
  313. this.isCouponShow = true
  314. this.couponAmount = data.couponList[0].couponAmount
  315. this.confirmParam.clubCouponId = data.couponList[0].clubCouponId
  316. }
  317. this.orderShouldPayFee = this.allPrice - this.couponAmount
  318. // 特殊商品退货须知
  319. this.returnGoodsStutas = data.returnGoodsStutas && data.returnGoodsStutas === 2 // 1:可以 2:不可以
  320. this.helpContent = data.helpContent
  321. },
  322. async getFreightData() {
  323. // 获取邮费信息
  324. try{
  325. this.isFreight = false
  326. const res = await this.OrderService.GetOrderPostage(this.postageParam)
  327. const data = res.data
  328. this.isFreight = true
  329. this.isCheckedBeans = false
  330. this.freightData = data
  331. this.hanldFreePostFlag = data.postageFlag
  332. this.hanldFreight = data.postage
  333. if (this.hanldFreePostFlag == 1) {
  334. if (this.freightData.userBeans > 0) {
  335. this.freightBeansMoney = this.hanldFreight
  336. } else {
  337. this.freightBeansMoney = 0
  338. }
  339. this.orderShouldPayFee = this.allPrice + data.postage
  340. this.attributePallPrice()
  341. this.hanldFreightBeans(this.isCheckedBeans)
  342. } else {
  343. if (this.freightData.userBeans > 0) {
  344. this.freightBeansMoney = 30
  345. } else {
  346. this.freightBeansMoney = 0
  347. }
  348. this.orderShouldPayFee = this.allPrice
  349. this.attributePallPrice()
  350. this.hanldFreightBeans(this.isCheckedBeans)
  351. }
  352. }catch(error){
  353. console.log('获取订单运费异常')
  354. }
  355. },
  356. handChangeInputGoodsList(data) {
  357. //对应供应商的留言信息
  358. this.goodsData = data
  359. },
  360. handleChoiceaInvoiceData(data) {
  361. //获取发票信息
  362. this.confirmParam.orderInvoice = data
  363. },
  364. hanldFreightBeans(data) {
  365. //是否勾选采美豆抵扣
  366. this.isCheckedBeans = data
  367. console.log(this.confirmParam.payInfo)
  368. if (this.isCheckedBeans) {
  369. // 判断如果采美豆大于等于运费*100
  370. if (this.freightData.userBeans > 0) {
  371. this.confirmParam.payInfo.userBeans = this.freightBeansMoney * 100
  372. } else {
  373. this.confirmParam.payInfo.userBeans = 0
  374. }
  375. // 计算抵扣后的总价
  376. if (this.hanldFreePostFlag == 1) {
  377. // 如果使用了余额 最终价格
  378. if (this.ischecked) {
  379. let totalAmount = this.allPrice - this.couponAmount
  380. if (this.userMoney >= totalAmount) {
  381. this.orderShouldPayFee = 0.0
  382. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  383. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额-当前使用金额
  384. } else {
  385. this.orderShouldPayFee = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于订单金额-账户余额
  386. this.deductMoney = this.userMoney // 当前使用金额等于总余额
  387. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  388. }
  389. } else {
  390. this.orderShouldPayFee =
  391. this.allPrice + this.hanldFreight - this.freightBeansMoney - this.couponAmount
  392. }
  393. console.log('抵扣', this.orderShouldPayFee)
  394. }
  395. } else {
  396. // 采美豆不抵扣运费
  397. this.confirmParam.payInfo.userBeans = 0
  398. // 不抵扣时计算总价
  399. if (this.hanldFreePostFlag == 1) {
  400. this.attributeHashfreight(this.hanldFreight)
  401. }
  402. }
  403. },
  404. handleChoiceaCouponData(data) {
  405. // 勾选使用优惠券
  406. console.log('优惠券信息', data)
  407. this.couponAmount = data.couponAmount
  408. this.confirmParam.clubCouponId = data.clubCouponId
  409. this.attributePallPrice()
  410. // this.hanldFreightBeans(this.isCheckedBeans)
  411. },
  412. attributeHashfreight() {
  413. // 计算需要邮费的支付价格
  414. let totalAmount = this.allPrice - this.couponAmount //计算不包邮的价格 总价等于商品价格+邮费
  415. if (this.ischecked) {
  416. if (this.userMoney >= totalAmount) {
  417. // 全部抵扣
  418. this.orderShouldPayFee = 0.0
  419. if (this.isCheckedBeans) {
  420. // 抵扣运费了
  421. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  422. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额减去当前使用金额
  423. } else {
  424. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额+运费金额
  425. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  426. }
  427. } else {
  428. // 部分抵扣
  429. if (this.isCheckedBeans) {
  430. // 抵扣运费了
  431. this.orderShouldPayFee = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于总订单金额-账户余额-优惠券金额
  432. this.deductMoney = this.userMoney // 当前使用金额等于账户余额
  433. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于账户余额-当前使用金额
  434. } else {
  435. this.orderShouldPayFee = this.allPrice - this.userMoney - this.couponAmount //订单支付金额等于订单金额+运费-账户余额-优惠券
  436. this.deductMoney = this.userMoney // 当前使用金额等于账户余额
  437. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于账户余额-当前使用金额
  438. }
  439. }
  440. } else {
  441. this.orderShouldPayFee = this.allPrice - this.couponAmount
  442. this.deductMoney = 0.0 // 当前使用金额
  443. this.surplusMoney = this.userMoney // 剩余余额
  444. }
  445. console.log('最终订单支付金额', this.orderShouldPayFee)
  446. console.log('优惠券金额', this.couponAmount)
  447. },
  448. orderSubmitMit() {
  449. // 提交订单按钮点击事件
  450. if (this.returnGoodsStutas && !this.agreementActive) {
  451. this.agreementModel = true
  452. } else {
  453. this.handleClickOrderSubmitMit()
  454. }
  455. },
  456. handleClickOrderSubmitMit() {
  457. // 提交订单
  458. if (this.isSubLoading) {
  459. return
  460. }
  461. if (this.confirmParam.addressId == '') {
  462. this.$util.msg('请先添加收货地址~', 2000)
  463. return
  464. }
  465. this.confirmParam.orderInfo = this.goodsData.map(el => {
  466. let productInfo = []
  467. el.cartList.forEach(pros => {
  468. productInfo.push({
  469. skuId: pros.skuId,
  470. productNum: pros.number,
  471. presentNum: 0,
  472. productType: pros.giftType
  473. })
  474. })
  475. return {
  476. splitCode: el.splitCode,
  477. shopId: el.shopId,
  478. note: el.note ? el.note : '',
  479. postage: parseInt(el.postage).toFixed(2),
  480. postageFlag: parseInt(el.handlePostageFlag),
  481. isColdChina: el.isColdChina ? 1 : 0,
  482. productInfo: productInfo
  483. }
  484. })
  485. this.confirmParam.payInfo.orderShouldPayFee = this.orderShouldPayFee.toFixed(2)
  486. this.confirmParam.payInfo = JSON.stringify(this.confirmParam.payInfo)
  487. this.confirmParam.orderInfo = JSON.stringify(this.confirmParam.orderInfo)
  488. this.confirmParam.orderInvoice = JSON.stringify(this.confirmParam.orderInvoice)
  489. console.log(this.confirmParam)
  490. this.isSubLoading = true
  491. this.hanldeOrderSubmit(this.confirmParam)
  492. },
  493. // 提交订单
  494. async hanldeOrderSubmit(params) {
  495. try{
  496. // 友盟埋点收集机构自主提交订单
  497. if (process.env.NODE_ENV != 'development') {
  498. this.$uma.trackEvent('Um_Event_ConfirmOrder', {
  499. Um_Key_PageName: '机构提交订单',
  500. Um_Key_SourcePage: '确认订单',
  501. Um_Key_OrderID: `${data.orderId}`
  502. })
  503. }
  504. const res = await this.OrderService.CreatedOrderSubmit(params)
  505. const data = res.data
  506. if (data.code === 1) {
  507. this.submitState = 'success'
  508. setTimeout(() => {
  509. this.isSubLoading = false
  510. }, 2000)
  511. this.$api.redirectTo(
  512. `/pages/user/order/success?data=${JSON.stringify({ data: { orderId: data.orderId } })}`
  513. )
  514. } else {
  515. this.submitState = 'confirm'
  516. this.$util.msg('订单提交成功', 2000, true, 'success')
  517. setTimeout(() => {
  518. this.isSubLoading = false
  519. this.$api.redirectTo(`/pages/user/order/order-pay-list?orderId=${data.orderId}`)
  520. }, 2000)
  521. }
  522. }catch(error){
  523. this.isSubLoading = false
  524. this.handleError(error)
  525. }
  526. },
  527. handleError(data) {
  528. // 提交订单异常处理
  529. const buttonMap = {
  530. 1: {
  531. contentModalText:
  532. '您已有2个采购金额过小的订单,本次不能再进行采购。建议您前往采美旗下“颜选美学”小程序购买小额商品。',
  533. modalButton: [
  534. { text: '了解', type: 'gray', plain: true },
  535. {
  536. text: '前往颜选美学',
  537. customStyle: { color: '#fff', bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)' },
  538. plain: false
  539. }
  540. ]
  541. },
  542. 2: {
  543. contentModalText: '采美豆不足,不能提交订单。建议您前往采美旗下“颜选美学”小程序购买小额商品。',
  544. modalButton: [
  545. { text: '了解', type: 'gray', plain: true },
  546. {
  547. text: '前往颜选美学',
  548. customStyle: { color: '#fff', bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)' },
  549. plain: false
  550. }
  551. ]
  552. },
  553. 3: {
  554. contentModalText: '采购金额过小,将扣除500采美豆,建议您前往采美旗下“颜选美学”小程序购买小额商品。',
  555. modalButton: [
  556. { text: '前往颜选美学', type: 'gray', plain: true },
  557. {
  558. text: '继续提交',
  559. customStyle: { color: '#fff', bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)' },
  560. plain: false
  561. }
  562. ]
  563. },
  564. 4: {
  565. contentModalText:
  566. '订单内存在械字号三类商品,需要拥有医疗执业许可证的医美机构才能购买。建议升级医美机构后再下单,否则会导致订单退款或影响发货。',
  567. modalButton: [
  568. { text: '继续提交', type: 'gray', plain: true },
  569. {
  570. text: '去升级',
  571. customStyle: { color: '#fff', bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)' },
  572. plain: false
  573. }
  574. ]
  575. }
  576. }
  577. if (data.code === -3) {
  578. // 已提交2个小于1000元的订单提示
  579. this.showModal = true
  580. this.showModalstauts = 3
  581. this.contentModalText = buttonMap[1].contentModalText
  582. this.modalButton = buttonMap[1].modalButton
  583. this.formatConfirmParam()
  584. } else if (data.code === -4) {
  585. // 采美豆为负数
  586. this.showModal = true
  587. this.showModalstauts = 3
  588. this.contentModalText = buttonMap[2].contentModalText
  589. this.modalButton = buttonMap[2].modalButton
  590. this.formatConfirmParam()
  591. } else if (data.code === -5) {
  592. // 订单总金额低于500
  593. this.showModal = true
  594. this.showModalstauts = 1
  595. this.contentModalText = buttonMap[3].contentModalText
  596. this.modalButton = buttonMap[3].modalButton
  597. this.formatConfirmParam()
  598. } else if (data.code === -6) {
  599. // 非医美机构下三类商品订单
  600. this.showModal = true
  601. this.showModalstauts = 2
  602. this.contentModalText = buttonMap[4].contentModalText
  603. this.modalButton = buttonMap[4].modalButton
  604. this.formatConfirmParam()
  605. } else {
  606. this.$util.msg(data.msg, 3000)
  607. }
  608. },
  609. formatConfirmParam() {
  610. // 还原提交订单参数格式
  611. this.confirmParam.payInfo = JSON.parse(this.confirmParam.payInfo)
  612. this.confirmParam.orderInfo = JSON.parse(this.confirmParam.orderInfo)
  613. this.confirmParam.orderInvoice = JSON.parse(this.confirmParam.orderInvoice)
  614. },
  615. handleClickCancel() {
  616. // 关闭优惠券弹窗
  617. this.isCouponModel = false
  618. if (this.confirmType == 1) {
  619. this.GetProductCreateOrderInfo()
  620. } else {
  621. this.CartCreateOrderInfo()
  622. }
  623. },
  624. handleClick(e) {
  625. // 采购量过小提示弹窗
  626. if (e.index === 1) {
  627. if (this.showModalstauts === 1) {
  628. this.showModal = false
  629. this.confirmParam.orderMiniType = 1
  630. this.handleClickOrderSubmitMit()
  631. } else if (this.showModalstauts === 2) {
  632. this.showModal = false
  633. this.isSubLoading = false
  634. this.$api.navigateTo('/pages/login/apply')
  635. } else {
  636. this.showModal = false
  637. this.handleClickHeHeMiniApplet()
  638. }
  639. } else {
  640. if (this.showModalstauts == 1) {
  641. this.showModal = false
  642. this.handleClickHeHeMiniApplet()
  643. } else if (this.showModalstauts === 2) {
  644. this.showModal = false
  645. this.confirmParam.orderMiniType = 2
  646. this.handleClickOrderSubmitMit()
  647. } else {
  648. this.showModal = false
  649. }
  650. }
  651. },
  652. handleClickHeHeMiniApplet() {
  653. // 跳转颜选美学小程序
  654. uni.navigateToMiniProgram({
  655. appId: 'wx2c3b0a7f343235b1',
  656. path: '/pages/tabBar/index/index',
  657. extraData: {
  658. data1: 'test'
  659. },
  660. envVersion: 'develop',
  661. success(res) {
  662. // 打开成功
  663. console.log(res)
  664. }
  665. })
  666. }
  667. },
  668. onShow() {
  669. let pages = getCurrentPages()
  670. let currPage = pages[pages.length - 1]
  671. if (currPage.data.select == 'select') {
  672. let selectData = uni.getStorageSync('selectAddress')
  673. this.confirmParam.addressId = selectData.addressId
  674. this.cartParam.townId = selectData.townId
  675. this.productParam.townId = selectData.townId
  676. this.supportParm.townId = selectData.townId
  677. this.addressData = selectData
  678. if(this.handleComType === 1) {//立即都买提交
  679. this.GetProductCreateOrderInfo()
  680. }
  681. if(this.handleComType === 2) {//购物车提交
  682. this.CartCreateOrderInfo()
  683. }
  684. if(this.handleComType === 3) {//组合商品提交
  685. this.GetOrderClubProductSupporting()
  686. }
  687. }
  688. }
  689. }
  690. </script>
  691. <style lang="scss">
  692. page {
  693. height: auto;
  694. background: #f7f7f7;
  695. }
  696. .btn-hover {
  697. background: #ffffff;
  698. }
  699. .animation {
  700. /* transition: transform 0.3s ease;*/
  701. transition-property: transform;
  702. transition-duration: 0.3s;
  703. transition-timing-function: ease;
  704. }
  705. .order {
  706. padding-bottom: 134rpx;
  707. }
  708. .invoice-freight {
  709. width: 702rpx;
  710. padding: 0 24rpx;
  711. height: auto;
  712. font-size: $font-size-28;
  713. color: $text-color;
  714. background: #ffffff;
  715. float: left;
  716. font-weight: bold;
  717. }
  718. .invoice-balance {
  719. width: 702rpx;
  720. height: auto;
  721. padding: 0 24rpx;
  722. background: #ffffff;
  723. float: left;
  724. margin-top: 24rpx;
  725. margin-bottom: 24rpx;
  726. .balabce-t {
  727. width: 100%;
  728. height: 86rpx;
  729. line-height: 86rpx;
  730. font-size: $font-size-28;
  731. color: $text-color;
  732. float: left;
  733. .balabce-t-le {
  734. float: left;
  735. font-weight: bold;
  736. }
  737. .balabce-t-ri {
  738. float: right;
  739. display: flex;
  740. align-items: center;
  741. .money {
  742. display: flex;
  743. float: left;
  744. }
  745. .checkbox-box {
  746. display: flex;
  747. width: 60rpx;
  748. float: left;
  749. height: 100%;
  750. font-size: $font-size-24;
  751. .checkbox {
  752. width: 40rpx;
  753. text-align: right;
  754. box-sizing: border-box;
  755. text-align: center;
  756. text-decoration: none;
  757. border-radius: 0;
  758. -webkit-tap-highlight-color: transparent;
  759. overflow: hidden;
  760. color: $color-system;
  761. }
  762. }
  763. }
  764. }
  765. .balabce-b {
  766. width: 100%;
  767. float: left;
  768. overflow: hidden;
  769. .balabce-b-text {
  770. width: 100%;
  771. line-height: 58rpx;
  772. font-size: $font-size-24;
  773. color: #ff2a2a;
  774. text-align: right;
  775. float: right;
  776. }
  777. &.balabce-b--hide {
  778. padding: 0 0;
  779. height: 0px;
  780. line-height: 0px;
  781. }
  782. }
  783. }
  784. .footer-wrapper {
  785. position: fixed;
  786. left: 0;
  787. bottom: 0;
  788. background-color: #ffffff;
  789. z-index: 990;
  790. .footer {
  791. display: flex;
  792. align-items: center;
  793. width: 100%;
  794. height: 110rpx;
  795. line-height: 110rpx;
  796. justify-content: space-between;
  797. font-size: $font-size-28;
  798. color: $text-color;
  799. }
  800. .footer-le {
  801. width: 570rpx;
  802. height: 100%;
  803. float: left;
  804. }
  805. .footer-count {
  806. float: left;
  807. padding-left: 24rpx;
  808. width: 180rpx;
  809. box-sizing: border-box;
  810. }
  811. .footer-price {
  812. width: 370rpx;
  813. float: right;
  814. text-align: right;
  815. color: $text-color;
  816. padding: 10rpx 20rpx 10rpx 0;
  817. box-sizing: border-box;
  818. .sum-none {
  819. width: 100%;
  820. height: 45rpx;
  821. line-height: 45rpx;
  822. color: $text-color;
  823. float: left;
  824. text-align: right;
  825. .money {
  826. font-size: $font-size-26;
  827. color: #999999;
  828. text-decoration: line-through;
  829. }
  830. .money-sign {
  831. font-size: $font-size-26;
  832. color: #999999;
  833. text-decoration: line-through;
  834. }
  835. .money-reduced {
  836. margin-left: 10rpx;
  837. font-size: $font-size-26;
  838. color: #ff2a2a;
  839. }
  840. }
  841. .sum {
  842. width: 100%;
  843. height: 45rpx;
  844. line-height: 45rpx;
  845. float: left;
  846. &.none {
  847. height: 90rpx;
  848. line-height: 90rpx;
  849. }
  850. .price {
  851. font-size: $font-size-32;
  852. color: #ff2a2a;
  853. }
  854. }
  855. }
  856. .footer-submit {
  857. display: flex;
  858. align-items: center;
  859. justify-content: center;
  860. width: 180rpx;
  861. height: 100%;
  862. box-sizing: border-box;
  863. padding: 15rpx 5rpx;
  864. .btn {
  865. width: 100%;
  866. height: 100%;
  867. color: #ffffff;
  868. background: linear-gradient(135deg, rgba(242, 143, 49, 1) 0%, rgba(225, 86, 22, 1) 100%);
  869. font-size: $font-size-26;
  870. text-align: center;
  871. line-height: 80rpx;
  872. border-radius: 40rpx;
  873. &.disabled {
  874. background: #e4e8eb;
  875. color: #999999;
  876. }
  877. }
  878. }
  879. }
  880. </style>