create-order.vue 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847
  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>共{{allCount}}件商品</text>
  61. </view>
  62. <view class="footer-price">
  63. <view class="sum" :class="totalDiscountAmount == 0 ? 'none' : ''">
  64. 总价:<text class="price">¥{{payAllPrice | 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. </view>
  109. </template>
  110. <script>
  111. import choiceAddress from '@/components/cm-module/creatOrder/choiceAddress'
  112. import goodsList from '@/components/cm-module/creatOrder/goodsList'
  113. import invoiceTent from '@/components/cm-module/creatOrder/invoiceTent'
  114. import coupon from '@/components/cm-module/creatOrder/coupon'
  115. import exchangeCoupon from '@/components/cm-module/creatOrder/exchangeCoupon'
  116. import freight from '@/components/cm-module/creatOrder/freight'
  117. import freightAlert from '@/components/cm-module/modelAlert/freightAlert'
  118. export default {
  119. components:{
  120. choiceAddress,
  121. goodsList,
  122. invoiceTent,
  123. coupon,
  124. exchangeCoupon,
  125. freight,
  126. freightAlert
  127. },
  128. data() {
  129. return {
  130. isIphoneX:this.$store.state.isIphoneX,
  131. isSubLoading:false,
  132. orderID:0,
  133. productIds:'', // 获取上一级页面商品信息
  134. productCount:'', // 获取上一级页面商品数量
  135. classifyIDS:'', // 获取上一级页面商品分类
  136. userID:'', // 用户ID
  137. cartType:'', // 购买类型(1购物车提交,2直接购买提交)
  138. submitState:'', // 提交状态
  139. balanceDeductionFlag:2, // 勾选余额的状态(1使用,2不使用)
  140. allCount:1, // 订单提交总数量
  141. reducedPrice:0, // 满减金额
  142. couponAmount:0, // 优惠券金额
  143. totalDiscountAmount:0, // 共减金额
  144. payAllPrice:0.00, // 订单提交总金额
  145. allPrice:0.00, // 订单总金额
  146. surplusMoney:0.00, // 显示勾选后的剩余抵扣
  147. userMoney:0.00, // 显示可使用余额
  148. deductMoney:0.00, // 显示已使用的余额
  149. addressID:'', // 地址ID
  150. townID:'', // 区ID
  151. isRequest:false, // 是否加载完成渲染子组件
  152. isFreight:false, // 是否加载完成渲染子组件
  153. isAddress:false, // 是否加载完成地址
  154. isExchangePopup:false, // 控制兑换优惠券弹窗
  155. isfreightTip:false, // 控制邮费弹窗
  156. ischecked:false, // 是否勾选余额
  157. hanldFreePostFlag:'', // 邮费状态
  158. hanldFreight:'', // 邮费
  159. addressData:{}, // 初始化地址信息
  160. goodsData:[], // 初始化商品信息
  161. couponList:[], // 初始化优惠券信息
  162. invoiceData:{type:0}, // 初始化发票信息
  163. freightData:{}, // 邮费数据
  164. orderInfo:[], // 提交的商品信息
  165. payInfo:{}, // 订单信息
  166. clubCouponId:0, // 用户关联优惠Id
  167. rechargeGoods:null, // 判断订单里有定金商品或者充值商品时,余额抵扣部分不显示
  168. freightBeansMoney:0, // 存储采美豆抵扣金额
  169. hanldUserBeans:0, // 抵扣的采美豆数
  170. isCouponShow:false, // 是否显示可选优惠券
  171. isCheckedBeans:false, // 是否抵扣采美豆
  172. isCouponModel:false, // 兑换优惠券成功提示
  173. ExchangeCouponData:{} // 兑换优惠券信息
  174. }
  175. },
  176. onLoad(option){//商品数据
  177. let data = JSON.parse(option.data);
  178. if(option.type =='prodcut'){
  179. this.cartType = 2
  180. this.productCount = data.data.productCount
  181. this.productIds = data.data.productID
  182. }else{
  183. this.cartType = 1
  184. this.productCount = data.data.productCount
  185. this.productIds = data.data.productID
  186. }
  187. this.$api.getStorage().then((resolve) =>{
  188. this.userID = resolve.userId ? resolve.userId : 0
  189. this.getInitCrearOrder();
  190. })
  191. },
  192. filters:{
  193. NumFormat(value) {//处理金额
  194. return Number(value).toFixed(2);
  195. },
  196. },
  197. methods: {
  198. getInitCrearOrder(){//获取订单商品信息
  199. this.OrderService.CreateOrderInfo({
  200. userId:this.userID,
  201. count:this.productCount,
  202. productIds:this.productIds,
  203. unionId:uni.getStorageSync('unionId')
  204. })
  205. .then(response =>{
  206. let data = response.data
  207. this.isRequest = true
  208. this.goodsData = data.list
  209. this.couponList = data.couponList
  210. this.userMoney = data.userMoney
  211. this.reducedPrice = data.reducedPrice
  212. this.allPrice = data.totalPrice
  213. this.rechargeGoods = data.rechargeGoods
  214. if(this.couponList.length>0){
  215. this.isCouponShow = true
  216. this.couponAmount = data.couponList[0].couponAmount
  217. this.clubCouponId = data.couponList[0].clubCouponId
  218. this.payAllPrice = this.allPrice - this.couponAmount
  219. }
  220. this.totalDiscountAmount = this.reducedPrice + this.couponAmount
  221. })
  222. .catch(error =>{
  223. this.$util.msg(error.msg,2000)
  224. })
  225. },
  226. getFreightData(){//获取邮费信息
  227. this.isFreight = false
  228. let params ={
  229. userId:this.userID,
  230. productIds:this.productIds,
  231. totalPrice:this.allPrice,
  232. townId:this.addressData.townID
  233. }
  234. this.OrderService.GetOrderPostage(params).then(response =>{
  235. this.isFreight = true
  236. this.isCheckedBeans = false
  237. this.freightData = response.data
  238. this.hanldFreePostFlag = response.data.freePostFlag
  239. this.hanldFreight = response.data.freight
  240. if(this.hanldFreePostFlag == 1){
  241. if( this.freightData.userBeans > 0 ){
  242. this.freightBeansMoney = this.hanldFreight
  243. }else{
  244. this.freightBeansMoney = 0
  245. }
  246. this.payAllPrice = this.allPrice + response.data.freight
  247. this.attributePallPrice()
  248. this.hanldFreightBeans(this.isCheckedBeans)
  249. }else{
  250. if( this.freightData.userBeans > 0 ){
  251. this.freightBeansMoney = 30
  252. }else{
  253. this.freightBeansMoney = 0
  254. }
  255. this.payAllPrice = this.allPrice
  256. this.attributePallPrice()
  257. this.hanldFreightBeans(this.isCheckedBeans)
  258. }
  259. })
  260. },
  261. getAddressData(){//获取地址信息
  262. this.$api.getStorage().then((resolve) => {
  263. this.UserService.QueryAddressList({pageNum:1,pageSize:1,userID:resolve.userId}).then(response =>{
  264. this.isAddress = true
  265. this.addressData = {}
  266. if(response.data.results != ''){
  267. this.addressID = response.data.results[0].addressID;
  268. this.townID = response.data.results[0].townID;
  269. this.addressData = response.data.results[0];
  270. this.getFreightData()
  271. }else{
  272. this.addressData = this.addressData;
  273. }
  274. })
  275. })
  276. },
  277. handChangeInputGoodsList(data){//对应供应商的留言信息
  278. this.goodsData = data;
  279. },
  280. handleChoiceaInvoiceData(data){//获取发票信息
  281. this.invoiceData = data
  282. },
  283. hanldFreightFn(data){//显示邮费弹窗
  284. console.log(data)
  285. switch(data.freePostFlag){
  286. case 1:
  287. this.hanldFreight = this.freightData.freight
  288. this.hanldFreePostFlag = data.freePostFlag
  289. this.freightBeansMoney = data.freightBeansMoney
  290. this.payAllPrice =this.allPrice + this.hanldFreight
  291. this.attributePallPrice()
  292. this.hanldFreightBeans(this.isCheckedBeans)
  293. break
  294. case -1:
  295. this.hanldFreight = 0
  296. this.hanldFreePostFlag = data.freePostFlag
  297. this.freightBeansMoney = data.freightBeansMoney
  298. this.payAllPrice = this.allPrice
  299. this.attributePallPrice()
  300. this.hanldFreightBeans(this.isCheckedBeans)
  301. break
  302. }
  303. },
  304. hanldFreightBeans(data){//是否勾选采美豆抵扣
  305. this.isCheckedBeans = data;
  306. if(this.isCheckedBeans){
  307. // 判断如果采美豆大于等于运费*100
  308. if( this.freightData.userBeans > 0 ){
  309. this.hanldUserBeans = this.freightBeansMoney*100
  310. }else{
  311. this.hanldUserBeans = 0
  312. }
  313. // 计算抵扣后的总价
  314. if(this.hanldFreePostFlag == 1){
  315. // 如果使用了余额 最终价格
  316. if(this.ischecked){
  317. let totalAmount = this.allPrice - this.couponAmount
  318. if(this.userMoney >= totalAmount){
  319. this.payAllPrice = 0.00
  320. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  321. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额-当前使用金额
  322. }else{
  323. this.payAllPrice = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于订单金额-账户余额
  324. this.deductMoney = this.userMoney // 当前使用金额等于总余额
  325. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  326. }
  327. }else{
  328. this.payAllPrice = this.allPrice + this.hanldFreight - this.freightBeansMoney - this.couponAmount
  329. }
  330. console.log('抵扣',this.payAllPrice)
  331. }
  332. }else{// 采美豆不抵扣运费
  333. this.hanldUserBeans = 0
  334. // 不抵扣时计算总价
  335. if(this.hanldFreePostFlag == 1){
  336. this.attributeHashfreight(this.hanldFreight)
  337. }
  338. }
  339. },
  340. handleChoiceaCouponData(data){// 勾选使用优惠券
  341. console.log('优惠券信息',data)
  342. this.couponAmount = data.couponAmount
  343. this.totalDiscountAmount = this.reducedPrice + this.couponAmount;
  344. this.clubCouponId = data.clubCouponId
  345. this.attributePallPrice()
  346. this.hanldFreightBeans(this.isCheckedBeans)
  347. },
  348. checkedBalabce(){//勾选使用余额
  349. if(this.userMoney > 0){
  350. this.ischecked = !this.ischecked
  351. if(this.ischecked){
  352. this.balanceDeductionFlag =1
  353. this.attributePallPrice()
  354. }else{
  355. if(this.hanldFreePostFlag == 1 || this.hanldFreePostFlag == '1'){ //如果是有运费时
  356. if(this.isCheckedBeans){
  357. this.payAllPrice = this.allPrice - this.couponAmount
  358. }else{
  359. this.payAllPrice = this.allPrice+parseInt(this.freightData.freight) - this.couponAmount
  360. }
  361. }else{
  362. this.payAllPrice = this.allPrice - this.couponAmount
  363. }
  364. this.balanceDeductionFlag = 2
  365. }
  366. console.log('最终订单支付金额',this.payAllPrice)
  367. console.log('优惠券金额',this.couponAmount)
  368. }else{
  369. return
  370. }
  371. },
  372. attributePallPrice(){// 计算价格
  373. if(this.hanldFreePostFlag == 1 || this.hanldFreePostFlag == '1'){
  374. this.attributeHashfreight(this.freightData.freight)
  375. }else{
  376. this.attributeNofreight()
  377. }
  378. },
  379. attributeNofreight(){// 计算没有邮费的支付价格
  380. if(this.ischecked){
  381. let totalAmount = this.allPrice - this.couponAmount
  382. if(this.userMoney >= totalAmount){
  383. this.payAllPrice = 0.00
  384. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  385. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额-当前使用金额
  386. }else{
  387. this.payAllPrice = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于订单金额-账户余额
  388. this.deductMoney = this.userMoney // 当前使用金额等于总余额
  389. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  390. }
  391. }else{
  392. this.payAllPrice = this.allPrice - this.couponAmount;
  393. this.deductMoney = 0.00; // 当前使用
  394. this.surplusMoney = this.userMoney; // 剩余余额
  395. }
  396. console.log('最终订单支付金额',this.payAllPrice)
  397. console.log('优惠券金额',this.couponAmount)
  398. },
  399. attributeHashfreight(freight){// 计算需要邮费的支付价格
  400. let totalAmount = this.allPrice + parseInt(freight) - this.couponAmount//计算不包邮的价格 总价等于商品价格+邮费
  401. if(this.ischecked){
  402. if(this.userMoney >= totalAmount){// 全部抵扣
  403. this.payAllPrice =0.00
  404. if(this.isCheckedBeans){// 抵扣运费了
  405. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  406. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额减去当前使用金额
  407. }else{
  408. this.deductMoney = this.allPrice + parseInt(freight)- this.couponAmount // 当前使用金额等于订单金额+运费金额
  409. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  410. }
  411. }else{// 部分抵扣
  412. if(this.isCheckedBeans){// 抵扣运费了
  413. this.payAllPrice = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于总订单金额-账户余额-优惠券金额
  414. this.deductMoney = this.userMoney // 当前使用金额等于账户余额
  415. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于账户余额-当前使用金额
  416. }else{
  417. this.payAllPrice = this.allPrice + parseInt(freight) - this.userMoney - this.couponAmount//订单支付金额等于订单金额+运费-账户余额-优惠券
  418. this.deductMoney = this.userMoney // 当前使用金额等于账户余额
  419. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于账户余额-当前使用金额
  420. }
  421. }
  422. }else{
  423. this.payAllPrice = this.allPrice + parseInt(freight) - this.couponAmount
  424. this.deductMoney = 0.00 // 当前使用金额
  425. this.surplusMoney = this.userMoney // 剩余余额
  426. }
  427. console.log('最终订单支付金额',this.payAllPrice)
  428. console.log('优惠券金额',this.couponAmount)
  429. },
  430. orderSubmitMit(){// 提交订单
  431. if(this.isSubLoading){ return; }
  432. if(this.addressID == ''){
  433. this.$util.msg('请先添加收货地址~',2000)
  434. return
  435. }
  436. this.orderInfo = this.goodsData.map(el => {
  437. let productInfo = [];
  438. el.cartList.forEach(item => {
  439. productInfo.push({
  440. productId:item.productId,
  441. productNum:item.number,
  442. presentNum:0,
  443. productType:item.productType
  444. })
  445. })
  446. return {shopId:el.id,note:el.note?el.note:'',productInfo:productInfo}
  447. })
  448. //订单信息
  449. this.payInfo = {
  450. clauseId:0,//条款(暂时保留)
  451. orderShouldPayFee:this.payAllPrice.toFixed(2),//提交的总价
  452. balancePayFlag:this.balanceDeductionFlag,//余额抵扣的状态
  453. freight:parseInt(this.hanldFreight).toFixed(2),//邮费
  454. freePostFlag:parseInt(this.hanldFreePostFlag),//运费形式
  455. userBeans:this.hanldUserBeans
  456. }
  457. let param = {
  458. clubCouponId:this.clubCouponId,
  459. orderSource:6,
  460. clubUserId:this.userID,
  461. cartType:this.cartType,
  462. addressId:this.addressID,
  463. orderInfo:this.orderInfo,
  464. payInfo:this.payInfo, //订单信息
  465. orderInvoice:this.invoiceData
  466. }
  467. console.log(param)
  468. this.isSubLoading = true;
  469. this.OrderService.CreatedOrderSubmit({'params':JSON.stringify(param)}).then(response =>{
  470. const data = response.data;
  471. // 友盟埋点收集机构自主提交订单
  472. if(process.env.NODE_ENV != 'development'){
  473. this.$uma.trackEvent('Um_Event_ConfirmOrder', {
  474. Um_Key_PageName: '机构提交订单',
  475. Um_Key_SourcePage: '确认订单',
  476. Um_Key_OrderID:`${data.orderID}`
  477. })
  478. }
  479. if(data.code === '1'){
  480. this.submitState ='success'
  481. setTimeout(()=>{
  482. this.isSubLoading = false;
  483. },2000)
  484. let data = {orderID:response.data.orderID}
  485. this.$api.navigateTo(`/pages/user/order/success?data=${JSON.stringify({data:data})}`)
  486. }else{
  487. this.submitState ='confirm'
  488. this.$util.msg('订单提交成功',3000,true,'success')
  489. setTimeout(()=>{
  490. this.isSubLoading = false;
  491. },2000)
  492. setTimeout(()=>{
  493. this.$api.redirectTo(`/pages/user/order/order-payment?type=${this.submitState}&orderID=${response.data.orderID}`)
  494. },3000)
  495. }
  496. }).catch(error =>{
  497. this.$util.msg(error.msg,3000);
  498. })
  499. },
  500. handFreightAlertShow(){//显示邮费弹窗
  501. this.isfreightTip = true;
  502. },
  503. handleClickCancel(){// 关闭优惠券弹窗
  504. this.isCouponModel = false;
  505. this.getInitCrearOrder();
  506. },
  507. hideFreight(){//关闭邮费弹窗
  508. this.isfreightTip = false;
  509. },
  510. },
  511. onShow() {
  512. // this.addressID = ''
  513. let pages = getCurrentPages();
  514. let currPage = pages[pages.length-1];
  515. if(currPage.data.select =='select'){
  516. this.isAddress = true
  517. let SelectData = uni.getStorageSync('selectAddress');
  518. this.addressID = SelectData.addressID;
  519. this.addressData = SelectData
  520. this.getFreightData()
  521. }else{
  522. this.getAddressData()
  523. }
  524. }
  525. }
  526. </script>
  527. <style lang="scss">
  528. page {
  529. height: auto;
  530. background:#F7F7F7;
  531. }
  532. .btn-hover{
  533. background: #FFFFFF;
  534. }
  535. .animation{
  536. /* transition: transform 0.3s ease;*/
  537. transition-property: transform;
  538. transition-duration: 0.3s;
  539. transition-timing-function: ease;
  540. }
  541. .order{
  542. padding-bottom: 134rpx;
  543. }
  544. .invoice-freight{
  545. width: 702rpx;
  546. padding: 0 24rpx;
  547. height: auto;
  548. font-size: $font-size-28;
  549. color: $text-color;
  550. background: #FFFFFF;
  551. float: left;
  552. font-weight: bold;
  553. }
  554. .invoice-balance{
  555. width: 702rpx;
  556. height: auto;
  557. padding:0 24rpx;
  558. background: #FFFFFF;
  559. float: left;
  560. margin-top: 24rpx;
  561. margin-bottom: 24rpx;
  562. .balabce-t{
  563. width: 100%;
  564. height: 86rpx;
  565. line-height: 86rpx;
  566. font-size: $font-size-28;
  567. color: $text-color;
  568. float: left;
  569. .balabce-t-le{
  570. float: left;
  571. font-weight: bold;
  572. }
  573. .balabce-t-ri{
  574. float: right;
  575. display: flex;
  576. align-items: center;
  577. .money{
  578. display: flex;
  579. float: left;
  580. }
  581. .checkbox-box{
  582. display: flex;
  583. width: 60rpx;
  584. float: left;
  585. height: 100%;
  586. font-size: $font-size-24;
  587. .checkbox{
  588. width: 40rpx;
  589. text-align: right;
  590. box-sizing: border-box;
  591. text-align: center;
  592. text-decoration: none;
  593. border-radius: 0;
  594. -webkit-tap-highlight-color: transparent;
  595. overflow: hidden;
  596. color: $color-system;
  597. }
  598. }
  599. }
  600. }
  601. .balabce-b{
  602. width: 100%;
  603. float: left;
  604. overflow: hidden;
  605. .balabce-b-text{
  606. width: 100%;
  607. line-height: 58rpx;
  608. font-size: $font-size-24;
  609. color: #FF2A2A;
  610. text-align: right;
  611. float: right;
  612. }
  613. &.balabce-b--hide {
  614. padding: 0 0;
  615. height: 0px;
  616. line-height: 0px;
  617. }
  618. }
  619. }
  620. .footer{
  621. position: fixed;
  622. left: 0;
  623. bottom: 0;
  624. display: flex;
  625. align-items: center;
  626. width: 100%;
  627. height: 110rpx;
  628. line-height: 110rpx;
  629. justify-content: space-between;
  630. font-size: $font-size-28;
  631. background-color: #FFFFFF;
  632. z-index: 990;
  633. color: $text-color;
  634. .footer-le{
  635. width:570rpx;
  636. height:100%;
  637. float: left;
  638. }
  639. .footer-count{
  640. float: left;
  641. padding-left: 24rpx;
  642. width:180rpx;
  643. box-sizing: border-box;
  644. }
  645. .footer-price{
  646. width:370rpx;
  647. float: right;
  648. text-align: right;
  649. color: $text-color;
  650. padding: 10rpx 20rpx 10rpx 0;
  651. box-sizing: border-box;
  652. .sum-none{
  653. width: 100%;
  654. height: 45rpx;
  655. line-height: 45rpx;
  656. color: $text-color;
  657. float: left;
  658. text-align: right;
  659. .money{
  660. font-size: $font-size-26;
  661. color: #999999;
  662. text-decoration: line-through;
  663. }
  664. .money-sign{
  665. font-size: $font-size-26;
  666. color: #999999;
  667. text-decoration: line-through;
  668. }
  669. .money-reduced{
  670. margin-left: 10rpx;
  671. font-size: $font-size-26;
  672. color:#FF2A2A;
  673. }
  674. }
  675. .sum{
  676. width: 100%;
  677. height: 45rpx;
  678. line-height: 45rpx;
  679. float: left;
  680. &.none{
  681. height: 90rpx;
  682. line-height: 90rpx;
  683. }
  684. .price{
  685. font-size: $font-size-32;
  686. color: #FF2A2A;
  687. }
  688. }
  689. }
  690. .footer-submit{
  691. display:flex;
  692. align-items:center;
  693. justify-content: center;
  694. width: 180rpx;
  695. height: 100%;
  696. box-sizing: border-box;
  697. padding: 15rpx 5rpx;
  698. .btn{
  699. width: 100%;
  700. height: 100%;
  701. color: #FFFFFF;
  702. background:linear-gradient(135deg,rgba(242,143,49,1) 0%,rgba(225,86,22,1) 100%);
  703. font-size: $font-size-26;
  704. text-align: center;
  705. line-height: 80rpx;
  706. border-radius: 40rpx;
  707. &.disabled{
  708. background: #e4e8eb;
  709. color: #999999;
  710. }
  711. }
  712. }
  713. }
  714. .coupon-content-model{
  715. width: 100%;
  716. height: 100%;
  717. background: rgba(0,0,0,.5);
  718. position: fixed;
  719. top: 0;
  720. left: 0;
  721. z-index: 8888;
  722. transition: all 0.4s;
  723. .coupon-alert-content{
  724. width: 600rpx;
  725. height: 612rpx;
  726. position: absolute;
  727. top: 0;
  728. left: 0;
  729. bottom: 0;
  730. right: 0;
  731. margin: auto;
  732. box-sizing: border-box;
  733. padding-top: 92rpx;
  734. .coupon{
  735. width: 600rpx;
  736. height: 522rpx;
  737. background: url(https://static.caimei365.com/app/img/icon/icon-coupon-alertbg@2x.png);
  738. background-size: cover;
  739. box-sizing: border-box;
  740. padding: 230rpx 40rpx 0 40rpx;
  741. .coupon-list{
  742. width: 100%;
  743. height: 147rpx;
  744. margin-bottom: 32rpx;
  745. box-sizing: border-box;
  746. background: url(https://static.caimei365.com/app/img/icon/icon-coupon-bg@2x.png);
  747. background-size: cover;
  748. position: relative;
  749. .list-cell-tags{
  750. display: inline-block;
  751. padding: 0 10rpx;
  752. height: 32rpx;
  753. line-height: 32rpx;
  754. background-color: #f94b4b;
  755. color: #FFFFFF;
  756. font-size: 18rpx;
  757. border-radius: 16rpx 0 16rpx 0;
  758. text-align: center;
  759. position: absolute;
  760. top: 0;
  761. left: 0;
  762. }
  763. .list-cell-le{
  764. width: 154rpx;
  765. height: 100%;
  766. box-sizing: border-box;
  767. padding: 30rpx 0;
  768. float: left;
  769. .coupon-maxMoney{
  770. width: 100%;
  771. height: 54rpx;
  772. line-height: 54rpx;
  773. font-size: 42rpx;
  774. color: #f94b4b;
  775. text-align: center;
  776. margin-top: 10rpx;
  777. .small{
  778. font-size: $font-size-20;
  779. }
  780. }
  781. .coupon-minMoney{
  782. width: 100%;
  783. height: 28rpx;
  784. float: left;
  785. box-sizing: border-box;
  786. padding-left: 24rpx;
  787. .txt{
  788. display: block;
  789. height: 28rpx;
  790. line-height: 28rpx;
  791. font-size: 16rpx;
  792. color: #f94b4b;
  793. text-align: center;
  794. padding: 0 5rpx;
  795. background-color: #fff1eb;
  796. border-radius: 4rpx;
  797. float: left;
  798. }
  799. }
  800. }
  801. .list-cell-ri{
  802. width: 366rpx;
  803. height: 100%;
  804. box-sizing: border-box;
  805. padding:30rpx 20rpx;
  806. float: left;
  807. .list-cell-top{
  808. width: 100%;
  809. height: 64rpx;
  810. line-height: 64rpx;
  811. font-size: $font-size-26;
  812. color: #333333;
  813. float: left;
  814. text-overflow:ellipsis;
  815. display: -webkit-box;
  816. word-break: break-all;
  817. -webkit-box-orient: vertical;
  818. -webkit-line-clamp: 1;
  819. overflow: hidden;
  820. }
  821. .list-cell-time{
  822. width: 100%;
  823. height: 28rpx;
  824. line-height: 28rpx;
  825. text-align: left;
  826. font-size: $font-size-20;
  827. color: #999999;
  828. }
  829. }
  830. }
  831. .coupon-btn{
  832. width: 100%;
  833. height: 78rpx;
  834. background: url(https://static.caimei365.com/app/img/icon/icon-coupon-alertbtnbg@2x.png);
  835. background-size: cover;
  836. line-height: 78rpx;
  837. text-align: center;
  838. color: #FFFFFF;
  839. font-size: $font-size-36;
  840. }
  841. }
  842. }
  843. }
  844. </style>