create-order.vue 32 KB

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