create-order.vue 25 KB

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