create-order.vue 26 KB

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