create-order.vue 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845
  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. if(this.userMoney>=this.payAllPrice){
  318. this.payAllPrice = 0.00
  319. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  320. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额-当前使用金额
  321. }else{
  322. this.payAllPrice = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于订单金额-账户余额
  323. this.deductMoney = this.userMoney // 当前使用金额等于总余额
  324. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  325. }
  326. }else{
  327. this.payAllPrice = this.allPrice + this.hanldFreight - this.freightBeansMoney - this.couponAmount
  328. }
  329. console.log('抵扣',this.payAllPrice)
  330. }
  331. }else{// 采美豆不抵扣运费
  332. this.hanldUserBeans = 0
  333. // 不抵扣时计算总价
  334. if(this.hanldFreePostFlag == 1){
  335. this.attributeHashfreight(this.hanldFreight)
  336. }
  337. }
  338. },
  339. handleChoiceaCouponData(data){// 勾选使用优惠券
  340. console.log('优惠券信息',data)
  341. this.couponAmount = data.couponAmount
  342. this.totalDiscountAmount = this.reducedPrice + this.couponAmount;
  343. this.clubCouponId = data.clubCouponId
  344. this.attributePallPrice()
  345. this.hanldFreightBeans(this.isCheckedBeans)
  346. },
  347. checkedBalabce(){//勾选使用余额
  348. if(this.userMoney > 0){
  349. this.ischecked = !this.ischecked
  350. if(this.ischecked){
  351. this.balanceDeductionFlag =1
  352. this.attributePallPrice()
  353. }else{
  354. if(this.hanldFreePostFlag == 1 || this.hanldFreePostFlag == '1'){ //如果是有运费时
  355. if(this.isCheckedBeans){
  356. this.payAllPrice = this.allPrice - this.couponAmount
  357. }else{
  358. this.payAllPrice = this.allPrice+parseInt(this.freightData.freight) - this.couponAmount
  359. }
  360. }else{
  361. this.payAllPrice = this.allPrice - this.couponAmount
  362. }
  363. this.balanceDeductionFlag = 2
  364. }
  365. console.log('最终订单支付金额',this.payAllPrice)
  366. console.log('优惠券金额',this.couponAmount)
  367. }else{
  368. return
  369. }
  370. },
  371. attributePallPrice(){// 计算价格
  372. if(this.hanldFreePostFlag == 1 || this.hanldFreePostFlag == '1'){
  373. this.attributeHashfreight(this.freightData.freight)
  374. }else{
  375. this.attributeNofreight()
  376. }
  377. },
  378. attributeNofreight(){// 计算没有邮费的支付价格
  379. if(this.ischecked){
  380. if(this.userMoney>=this.payAllPrice){
  381. this.payAllPrice = 0.00
  382. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  383. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额-当前使用金额
  384. }else{
  385. this.payAllPrice = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于订单金额-账户余额
  386. this.deductMoney = this.userMoney // 当前使用金额等于总余额
  387. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  388. }
  389. }else{
  390. this.payAllPrice = this.allPrice - this.couponAmount;
  391. this.deductMoney = 0.00; // 当前使用
  392. this.surplusMoney = this.userMoney; // 剩余余额
  393. }
  394. console.log('最终订单支付金额',this.payAllPrice)
  395. console.log('优惠券金额',this.couponAmount)
  396. },
  397. attributeHashfreight(freight){// 计算需要邮费的支付价格
  398. this.payAllPrice = this.allPrice + parseInt(freight) - this.couponAmount // 计算不包邮的价格 总价等于商品价格+邮费
  399. if(this.ischecked){
  400. if(this.userMoney>=this.payAllPrice){// 全部抵扣
  401. this.payAllPrice =0.00
  402. if(this.isCheckedBeans){// 抵扣运费了
  403. this.deductMoney = this.allPrice - this.couponAmount // 当前使用金额等于订单金额
  404. this.surplusMoney = this.userMoney - this.deductMoney // 剩余金额等于余额减去当前使用金额
  405. }else{
  406. this.deductMoney = this.allPrice + parseInt(freight)- this.couponAmount // 当前使用金额等于订单金额+运费金额
  407. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于总余额-当前使用金额
  408. }
  409. }else{// 部分抵扣
  410. if(this.isCheckedBeans){// 抵扣运费了
  411. this.payAllPrice = this.allPrice - this.userMoney - this.couponAmount // 订单最终支付金额等于总订单金额-账户余额-优惠券金额
  412. this.deductMoney = this.userMoney // 当前使用金额等于账户余额
  413. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于账户余额-当前使用金额
  414. }else{
  415. this.payAllPrice = this.allPrice + parseInt(freight) - this.userMoney - this.couponAmount//订单支付金额等于订单金额+运费-账户余额-优惠券
  416. this.deductMoney = this.userMoney // 当前使用金额等于账户余额
  417. this.surplusMoney = this.userMoney - this.deductMoney // 剩余余额等于账户余额-当前使用金额
  418. }
  419. }
  420. }else{
  421. this.payAllPrice = this.allPrice + parseInt(freight) - this.couponAmount
  422. this.deductMoney = 0.00 // 当前使用金额
  423. this.surplusMoney = this.userMoney // 剩余余额
  424. }
  425. console.log('最终订单支付金额',this.payAllPrice)
  426. console.log('优惠券金额',this.couponAmount)
  427. },
  428. orderSubmitMit(){// 提交订单
  429. if(this.isSubLoading){ return; }
  430. if(this.addressID == ''){
  431. this.$util.msg('请先添加收货地址~',2000)
  432. return
  433. }
  434. this.orderInfo = this.goodsData.map(el => {
  435. let productInfo = [];
  436. el.cartList.forEach(item => {
  437. productInfo.push({
  438. productId:item.productId,
  439. productNum:item.number,
  440. presentNum:0,
  441. productType:item.productType
  442. })
  443. })
  444. return {shopId:el.id,note:el.note?el.note:'',productInfo:productInfo}
  445. })
  446. //订单信息
  447. this.payInfo = {
  448. clauseId:0,//条款(暂时保留)
  449. orderShouldPayFee:this.payAllPrice.toFixed(2),//提交的总价
  450. balancePayFlag:this.balanceDeductionFlag,//余额抵扣的状态
  451. freight:parseInt(this.hanldFreight).toFixed(2),//邮费
  452. freePostFlag:parseInt(this.hanldFreePostFlag),//运费形式
  453. userBeans:this.hanldUserBeans
  454. }
  455. let param = {
  456. clubCouponId:this.clubCouponId,
  457. orderSource:6,
  458. clubUserId:this.userID,
  459. cartType:this.cartType,
  460. addressId:this.addressID,
  461. orderInfo:this.orderInfo,
  462. payInfo:this.payInfo, //订单信息
  463. orderInvoice:this.invoiceData
  464. }
  465. console.log(param)
  466. this.isSubLoading = true;
  467. this.OrderService.CreatedOrderSubmit({'params':JSON.stringify(param)}).then(response =>{
  468. const data = response.data;
  469. // 友盟埋点收集机构自主提交订单
  470. if(process.env.NODE_ENV != 'development'){
  471. this.$uma.trackEvent('Um_Event_ConfirmOrder', {
  472. Um_Key_PageName: '机构提交订单',
  473. Um_Key_SourcePage: '确认订单',
  474. Um_Key_OrderID:`${data.orderID}`
  475. })
  476. }
  477. if(data.code === '1'){
  478. this.submitState ='success'
  479. setTimeout(()=>{
  480. this.isSubLoading = false;
  481. },2000)
  482. let data = {orderID:response.data.orderID}
  483. this.$api.navigateTo(`/pages/user/order/success?data=${JSON.stringify({data:data})}`)
  484. }else{
  485. this.submitState ='confirm'
  486. this.$util.msg('订单提交成功',3000,true,'success')
  487. setTimeout(()=>{
  488. this.isSubLoading = false;
  489. },2000)
  490. setTimeout(()=>{
  491. this.$api.redirectTo(`/pages/user/order/order-payment?type=${this.submitState}&orderID=${response.data.orderID}`)
  492. },3000)
  493. }
  494. }).catch(error =>{
  495. this.$util.msg(error.msg,3000);
  496. })
  497. },
  498. handFreightAlertShow(){//显示邮费弹窗
  499. this.isfreightTip = true;
  500. },
  501. handleClickCancel(){// 关闭优惠券弹窗
  502. this.isCouponModel = false;
  503. this.getInitCrearOrder();
  504. },
  505. hideFreight(){//关闭邮费弹窗
  506. this.isfreightTip = false;
  507. },
  508. },
  509. onShow() {
  510. // this.addressID = ''
  511. let pages = getCurrentPages();
  512. let currPage = pages[pages.length-1];
  513. if(currPage.data.select =='select'){
  514. this.isAddress = true
  515. let SelectData = uni.getStorageSync('selectAddress');
  516. this.addressID = SelectData.addressID;
  517. this.addressData = SelectData
  518. this.getFreightData()
  519. }else{
  520. this.getAddressData()
  521. }
  522. }
  523. }
  524. </script>
  525. <style lang="scss">
  526. page {
  527. height: auto;
  528. background:#F7F7F7;
  529. }
  530. .btn-hover{
  531. background: #FFFFFF;
  532. }
  533. .animation{
  534. /* transition: transform 0.3s ease;*/
  535. transition-property: transform;
  536. transition-duration: 0.3s;
  537. transition-timing-function: ease;
  538. }
  539. .order{
  540. padding-bottom: 134rpx;
  541. }
  542. .invoice-freight{
  543. width: 702rpx;
  544. padding: 0 24rpx;
  545. height: auto;
  546. font-size: $font-size-28;
  547. color: $text-color;
  548. background: #FFFFFF;
  549. float: left;
  550. font-weight: bold;
  551. }
  552. .invoice-balance{
  553. width: 702rpx;
  554. height: auto;
  555. padding:0 24rpx;
  556. background: #FFFFFF;
  557. float: left;
  558. margin-top: 24rpx;
  559. margin-bottom: 24rpx;
  560. .balabce-t{
  561. width: 100%;
  562. height: 86rpx;
  563. line-height: 86rpx;
  564. font-size: $font-size-28;
  565. color: $text-color;
  566. float: left;
  567. .balabce-t-le{
  568. float: left;
  569. font-weight: bold;
  570. }
  571. .balabce-t-ri{
  572. float: right;
  573. display: flex;
  574. align-items: center;
  575. .money{
  576. display: flex;
  577. float: left;
  578. }
  579. .checkbox-box{
  580. display: flex;
  581. width: 60rpx;
  582. float: left;
  583. height: 100%;
  584. font-size: $font-size-24;
  585. .checkbox{
  586. width: 40rpx;
  587. text-align: right;
  588. box-sizing: border-box;
  589. text-align: center;
  590. text-decoration: none;
  591. border-radius: 0;
  592. -webkit-tap-highlight-color: transparent;
  593. overflow: hidden;
  594. color: $color-system;
  595. }
  596. }
  597. }
  598. }
  599. .balabce-b{
  600. width: 100%;
  601. float: left;
  602. overflow: hidden;
  603. .balabce-b-text{
  604. width: 100%;
  605. line-height: 58rpx;
  606. font-size: $font-size-24;
  607. color: #FF2A2A;
  608. text-align: right;
  609. float: right;
  610. }
  611. &.balabce-b--hide {
  612. padding: 0 0;
  613. height: 0px;
  614. line-height: 0px;
  615. }
  616. }
  617. }
  618. .footer{
  619. position: fixed;
  620. left: 0;
  621. bottom: 0;
  622. display: flex;
  623. align-items: center;
  624. width: 100%;
  625. height: 110rpx;
  626. line-height: 110rpx;
  627. justify-content: space-between;
  628. font-size: $font-size-28;
  629. background-color: #FFFFFF;
  630. z-index: 990;
  631. color: $text-color;
  632. .footer-le{
  633. width:570rpx;
  634. height:100%;
  635. float: left;
  636. }
  637. .footer-count{
  638. float: left;
  639. padding-left: 24rpx;
  640. width:180rpx;
  641. box-sizing: border-box;
  642. }
  643. .footer-price{
  644. width:370rpx;
  645. float: right;
  646. text-align: right;
  647. color: $text-color;
  648. padding: 10rpx 20rpx 10rpx 0;
  649. box-sizing: border-box;
  650. .sum-none{
  651. width: 100%;
  652. height: 45rpx;
  653. line-height: 45rpx;
  654. color: $text-color;
  655. float: left;
  656. text-align: right;
  657. .money{
  658. font-size: $font-size-26;
  659. color: #999999;
  660. text-decoration: line-through;
  661. }
  662. .money-sign{
  663. font-size: $font-size-26;
  664. color: #999999;
  665. text-decoration: line-through;
  666. }
  667. .money-reduced{
  668. margin-left: 10rpx;
  669. font-size: $font-size-26;
  670. color:#FF2A2A;
  671. }
  672. }
  673. .sum{
  674. width: 100%;
  675. height: 45rpx;
  676. line-height: 45rpx;
  677. float: left;
  678. &.none{
  679. height: 90rpx;
  680. line-height: 90rpx;
  681. }
  682. .price{
  683. font-size: $font-size-32;
  684. color: #FF2A2A;
  685. }
  686. }
  687. }
  688. .footer-submit{
  689. display:flex;
  690. align-items:center;
  691. justify-content: center;
  692. width: 180rpx;
  693. height: 100%;
  694. box-sizing: border-box;
  695. padding: 15rpx 5rpx;
  696. .btn{
  697. width: 100%;
  698. height: 100%;
  699. color: #FFFFFF;
  700. background:linear-gradient(135deg,rgba(242,143,49,1) 0%,rgba(225,86,22,1) 100%);
  701. font-size: $font-size-26;
  702. text-align: center;
  703. line-height: 80rpx;
  704. border-radius: 40rpx;
  705. &.disabled{
  706. background: #e4e8eb;
  707. color: #999999;
  708. }
  709. }
  710. }
  711. }
  712. .coupon-content-model{
  713. width: 100%;
  714. height: 100%;
  715. background: rgba(0,0,0,.5);
  716. position: fixed;
  717. top: 0;
  718. left: 0;
  719. z-index: 8888;
  720. transition: all 0.4s;
  721. .coupon-alert-content{
  722. width: 600rpx;
  723. height: 612rpx;
  724. position: absolute;
  725. top: 0;
  726. left: 0;
  727. bottom: 0;
  728. right: 0;
  729. margin: auto;
  730. box-sizing: border-box;
  731. padding-top: 92rpx;
  732. .coupon{
  733. width: 600rpx;
  734. height: 522rpx;
  735. background: url(https://static.caimei365.com/app/img/icon/icon-coupon-alertbg@2x.png);
  736. background-size: cover;
  737. box-sizing: border-box;
  738. padding: 230rpx 40rpx 0 40rpx;
  739. .coupon-list{
  740. width: 100%;
  741. height: 147rpx;
  742. margin-bottom: 32rpx;
  743. box-sizing: border-box;
  744. background: url(https://static.caimei365.com/app/img/icon/icon-coupon-bg@2x.png);
  745. background-size: cover;
  746. position: relative;
  747. .list-cell-tags{
  748. display: inline-block;
  749. padding: 0 10rpx;
  750. height: 32rpx;
  751. line-height: 32rpx;
  752. background-color: #f94b4b;
  753. color: #FFFFFF;
  754. font-size: 18rpx;
  755. border-radius: 16rpx 0 16rpx 0;
  756. text-align: center;
  757. position: absolute;
  758. top: 0;
  759. left: 0;
  760. }
  761. .list-cell-le{
  762. width: 154rpx;
  763. height: 100%;
  764. box-sizing: border-box;
  765. padding: 30rpx 0;
  766. float: left;
  767. .coupon-maxMoney{
  768. width: 100%;
  769. height: 54rpx;
  770. line-height: 54rpx;
  771. font-size: 42rpx;
  772. color: #f94b4b;
  773. text-align: center;
  774. margin-top: 10rpx;
  775. .small{
  776. font-size: $font-size-20;
  777. }
  778. }
  779. .coupon-minMoney{
  780. width: 100%;
  781. height: 28rpx;
  782. float: left;
  783. box-sizing: border-box;
  784. padding-left: 24rpx;
  785. .txt{
  786. display: block;
  787. height: 28rpx;
  788. line-height: 28rpx;
  789. font-size: 16rpx;
  790. color: #f94b4b;
  791. text-align: center;
  792. padding: 0 5rpx;
  793. background-color: #fff1eb;
  794. border-radius: 4rpx;
  795. float: left;
  796. }
  797. }
  798. }
  799. .list-cell-ri{
  800. width: 366rpx;
  801. height: 100%;
  802. box-sizing: border-box;
  803. padding:30rpx 20rpx;
  804. float: left;
  805. .list-cell-top{
  806. width: 100%;
  807. height: 64rpx;
  808. line-height: 64rpx;
  809. font-size: $font-size-26;
  810. color: #333333;
  811. float: left;
  812. text-overflow:ellipsis;
  813. display: -webkit-box;
  814. word-break: break-all;
  815. -webkit-box-orient: vertical;
  816. -webkit-line-clamp: 1;
  817. overflow: hidden;
  818. }
  819. .list-cell-time{
  820. width: 100%;
  821. height: 28rpx;
  822. line-height: 28rpx;
  823. text-align: left;
  824. font-size: $font-size-20;
  825. color: #999999;
  826. }
  827. }
  828. }
  829. .coupon-btn{
  830. width: 100%;
  831. height: 78rpx;
  832. background: url(https://static.caimei365.com/app/img/icon/icon-coupon-alertbtnbg@2x.png);
  833. background-size: cover;
  834. line-height: 78rpx;
  835. text-align: center;
  836. color: #FFFFFF;
  837. font-size: $font-size-36;
  838. }
  839. }
  840. }
  841. }
  842. </style>