index.vue 45 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639
  1. <template>
  2. <view :data-theme="theme">
  3. <!-- #ifndef APP-PLUS -->
  4. <view class='cart_nav'>
  5. <nav-bar :navTitle='navTitle' iconColor='#fff' :isBackgroundColor="true" ref="navBarRef"></nav-bar>
  6. </view>
  7. <!-- #endif -->
  8. <view class='order-submission' @touchstart="touchStart">
  9. <!-- 拼团切换样式 -->
  10. <view class="allAddress" v-if="Number(orderInfoVo.secondType)<5 && Number(orderInfoVo.secondType)!==2&&Number(orderInfoVo.type)==2">
  11. <view class="h-96 relative" v-if="orderInfoVo.merchantInfoList[0].deliveryMethodMer.split(',').length==2">
  12. <view class="w-full abs-lb rd-t-24rpx flex bg--w111-fff">
  13. <view class="flex-center w-50p h-76 fs-28 rd-lt-24rpx z-2" :class="shippingType == 1 ? 'bg--w111-fff font_color' : 'bg-primary-light'"
  14. @tap="addressType(1)">商家配送</view>
  15. <view class="flex-center w-50p h-76 fs-28 rd-rt-24rpx z-2" :class="shippingType == 2 ? 'bg--w111-fff font_color' : 'bg-primary-light'"
  16. @tap="addressType(2)">到店自提</view>
  17. </view>
  18. <view class="w-50p rd-t-24rpx bg--w111-fff h-96" :class="shippingType == 1 ? 'abs-lt' : 'abs-rt'">
  19. <view class="w-full h-full relative active-card"></view>
  20. </view>
  21. </view>
  22. <view class='address group acea-row row-between-wrapper' :class="orderInfoVo.merchantInfoList[0].deliveryMethodMer.split(',').length == 1?'bd-r-14':'' "
  23. @tap='onAddress' v-if='shippingType == 1'>
  24. <view class='addressCon' v-if="addressInfo.realName">
  25. <view class='name acea-row'>
  26. <view class="line1 select-name">{{addressInfo.realName}}</view>
  27. <view class='phone'>{{addressInfo.phone}}</view>
  28. </view>
  29. <view class="acea-row">
  30. <view class="line1"><text class='default font_color' v-if="addressInfo.isDefault">[默认]</text>{{addressInfo.province}}{{addressInfo.city}}{{addressInfo.district}}{{ addressInfo.street}}{{addressInfo.detail}}</view>
  31. </view>
  32. </view>
  33. <view class='addressCon' v-else>
  34. <view class='setaddress'>设置收货地址</view>
  35. </view>
  36. <view class='iconfont icon-jiantou mt30'></view>
  37. </view>
  38. <view class='address group acea-row row-between-wrapper' v-if='shippingType == 2' :class="orderInfoVo.merchantInfoList[0].deliveryMethodMer.split(',').length == 1?'bd-r-14':'' ">
  39. <view class='addressCon' v-for="(item, index) in merchantOrderVoList" :key="index" @click="goMap(item)">
  40. <view class='name acea-row'>
  41. <view class="line1 select-name">{{item.merName}}</view>
  42. <view class='phone'>{{item.phone}}</view>
  43. </view>
  44. <view class="acea-row">
  45. <view class="line1">{{item.addressDetail}}</view>
  46. </view>
  47. </view>
  48. <view class='iconfont icon-jiantou mt30'></view>
  49. </view>
  50. <view class='line'>
  51. <image src='../static/images/line.png'></image>
  52. </view>
  53. </view>
  54. <view v-if="Number(orderInfoVo.secondType)<5 && Number(orderInfoVo.secondType)!==2&&Number(orderInfoVo.type)!=2"
  55. class="allAddress">
  56. <view class='address acea-row row-between-wrapper' @tap='onAddress'>
  57. <view class='addressCon' v-if="addressInfo.realName">
  58. <view class='name'>{{addressInfo.realName}}
  59. <text class='phone'>{{addressInfo.phone}}</text>
  60. </view>
  61. <view class="acea-row line2">
  62. <text class='default font_color' v-if="addressInfo.isDefault">[默认]</text>
  63. <text>{{addressInfo.province}}{{addressInfo.city}}{{addressInfo.district}}{{ addressInfo.street}}{{addressInfo.detail}}</text>
  64. </view>
  65. </view>
  66. <view class='addressCon' v-else>
  67. <view class='setaddress'>设置收货地址</view>
  68. </view>
  69. <view class='iconfont icon-jiantou'></view>
  70. </view>
  71. <view class='line'>
  72. <image src='../static/images/line.png'></image>
  73. </view>
  74. </view>
  75. <!-- <view class="item-go" @tap="goIndex = true" :class="goIndex ? 'item-go-avt' : ''">
  76. <view v-if="goIndex">
  77. <view class="sjx"></view>
  78. <text class="dg-icon"></text>
  79. </view>
  80. <text style="font-weight: 600;font-size: 27rpx;">立即配送</text>
  81. <text style="font-weight: 500;font-size: 23rpx;margin-left: 76rpx">预计10:12送达</text>
  82. </view>
  83. <view style="margin-top: 10rpx;" class="item-go" :class="!goIndex ? 'item-go-avt' : ''" @tap="onTime">
  84. <view v-if="!goIndex">
  85. <view class="sjx"></view>
  86. <text class="dg-icon"></text>
  87. </view>
  88. <text style="font-weight: 600;font-size: 27rpx;">预约配送</text>
  89. <text style="font-weight: 500;font-size: 23rpx;margin-left: 76rpx">{{timeStr || '选择时间 》'}}</text>
  90. </view>
  91. -->
  92. <view class="borderPad">
  93. <view v-for="(item, index) in merchantOrderVoList" :key="index" class='wrapper borRadius14'>
  94. <orderGoods :cartInfo="item.orderInfoList" :orderInfo="item" :secondType="secondType" :orderProNum="orderProNum"
  95. :isShowBtn="false">
  96. </orderGoods>
  97. <view v-show="Number(orderInfoVo.secondType)===0&&orderInfoVo.type!=2" class="boxs">
  98. <view class='item acea-row row-between-wrapper'>
  99. <view>配送方式</view>
  100. <view v-if="item.deliveryMethodMer.length===3 && item.takeTheirSwitch" class='discount acea-row row-middle'>
  101. <text @tap="openShowBox(item,index)">{{item.shippingType === 1 ? '商家配送' : item.shippingType === 2 ? '到店自提' : '骑手配送'}}</text>
  102. <text @tap="openShowBox(item,index)" class='iconfont icon-jiantou'></text>
  103. </view>
  104. <view v-else class='discount'>
  105. {{item.shippingType === 1 ? '商家配送' : item.shippingType === 2 ? '到店自提' : '骑手配送'}}
  106. </view>
  107. </view>
  108. <view v-if="item.shippingType == 2 && item.takeTheirSwitch" class="store-address acea-row">
  109. <view>
  110. <view class="name phone">{{item.phone}}</view>
  111. <view class="name w-480px">{{item.addressDetail}}</view>
  112. </view>
  113. <view class="map" @click="goMap(item)">
  114. <text class="iconfont icon-chakanditu"></text>
  115. <view class="map_text">查看地图</view>
  116. </view>
  117. </view>
  118. </view>
  119. <view v-show="item.shippingType === 1 || item.shippingType === 3" class='item acea-row row-between-wrapper'>
  120. <view>打包费</view>
  121. <view v-if='!item.freightFee || item.freightFee == 0' class="noCoupon">免打包费</view>
  122. <view v-else class='money'>¥{{item.packingFee}}</view>
  123. </view>
  124. <view v-show="item.shippingType === 3" class='item acea-row row-between-wrapper'>
  125. <view>配送费</view>
  126. <view v-if='!item.freightFee || item.freightFee == 0' class="noCoupon">免运费</view>
  127. <view v-else class='money'>¥{{item.freightFee}}</view>
  128. </view>
  129. <view v-show="item.shippingType === 1 && Number(orderInfoVo.secondType)===0" class='item acea-row row-between-wrapper'>
  130. <view>快递费用</view>
  131. <view v-if='!item.freightFee || item.freightFee == 0' class="noCoupon">免运费</view>
  132. <view v-else class='money'>¥{{item.freightFee}}</view>
  133. </view>
  134. <view v-show="item.svipDiscountPrice != 0&&orderInfoVo.type!=2" class='item acea-row row-between-wrapper'>
  135. <view>会员优惠</view>
  136. <view class='money'>-¥{{item.svipDiscountPrice}}</view>
  137. </view>
  138. <view v-if="isProductType" class='item acea-row row-between-wrapper'>
  139. <view>店铺优惠</view>
  140. <view v-if="item.merCouponUserList && item.merCouponUserList.length" @tap='couponTap(item.merCouponUserList,item.merId, index)'>
  141. <view class='discount acea-row row-between-wrapper'>
  142. <text class="couponTitle line1">{{item.couponFee==0?`有${item.merCouponUserList.length}张优惠券可选`:`-¥${item.couponFee}`}}</text>
  143. <text class='iconfont icon-jiantou'></text>
  144. </view>
  145. </view>
  146. <view v-else class="noCoupon">暂无优惠券</view>
  147. </view>
  148. <view class='item acea-row row-between-wrapper' v-if="textareaStatus" style="height: auto;">
  149. <view>买家留言</view>
  150. <input placeholder-class='placeholder' value="" name="mark" placeholder='选填买家留言' v-model="item.remark" @input='bindHideKeyboard(item.remark,index)'
  151. style="width: 484rpx;text-align: right;"></input>
  152. </view>
  153. </view>
  154. <!--商品关联系统表单-->
  155. <view v-if="orderInfoVo.systemFormValue && orderInfoVo.systemFormValue.length" class='wrapper borRadius14'>
  156. <systemFrom v-model="orderInfoVo.systemFormValue"></systemFrom>
  157. <!-- <systemFrom :orderForm="orderInfoVo.systemFormValue" ></systemFrom>-->
  158. </view>
  159. <view class='moneyList borRadius14'>
  160. <view v-show="secondType !== ProductTypeEnum.Integral" class='item acea-row row-between-wrapper'>
  161. <view>商品总价</view>
  162. <view class='money'>¥{{orderInfoVo.proTotalFee || 0}}</view>
  163. </view>
  164. <view class='item acea-row row-between-wrapper' v-if="parseInt(orderInfoVo.freightFee) > 0">
  165. <view>运费:</view>
  166. <view class='money'>+¥{{orderInfoVo.freightFee}}</view>
  167. </view>
  168. <view v-show="orderInfoVo.svipDiscountPrice != 0 &&orderInfoVo.type!=2" class='item acea-row row-between-wrapper'>
  169. <view>会员优惠</view>
  170. <view class='money'>-¥{{orderInfoVo.svipDiscountPrice}}</view>
  171. </view>
  172. <view class='item acea-row row-between-wrapper' v-if="parseInt(merCouponFee) > 0 && isProductType">
  173. <view>店铺优惠</view>
  174. <view class='money'>-¥{{merCouponFee}}</view>
  175. </view>
  176. <view v-if="isProductType" class='item acea-row row-between-wrapper'>
  177. <view>平台优惠</view>
  178. <view v-if="orderInfoVo.platCouponUserList && orderInfoVo.platCouponUserList.length" class='discount acea-row row-between-wrapper'
  179. @tap='couponTap(orderInfoVo.platCouponUserList,0)'>
  180. <text class="couponTitle line1">{{platCouponFee==0?`有${orderInfoVo.platCouponUserList.length}张优惠券可选`:`-¥${platCouponFee}`}}</text>
  181. <text class='iconfont icon-jiantou'></text>
  182. </view>
  183. <view v-else class="noCoupon">暂无优惠券</view>
  184. </view>
  185. <view class='item acea-row row-between-wrapper' v-if="orderInfoVo.integralDeductionSwitch && isProductType">
  186. <view>积分抵扣</view>
  187. <view class='discount acea-row row-middle'>
  188. <view class="mr14"> {{isUseIntegral ? "使用积分":"当前积分"}}
  189. <text class='num font_color'>{{ isUseIntegral ? orderInfoVo.surplusIntegral : orderInfoVo.userIntegral}}</text>
  190. </view>
  191. <checkbox-group @change="ChangeIntegral">
  192. <checkbox :checked='isUseIntegral ? true : false' :disabled="orderInfoVo.userIntegral==0 && !isUseIntegral" />
  193. </checkbox-group>
  194. </view>
  195. </view>
  196. <view class='item acea-row row-between-wrapper' v-if="Number(orderInfoVo.deductionPrice) > 0">
  197. <view>抵扣金额</view>
  198. <view class='money'>-¥{{orderInfoVo.deductionPrice}}</view>
  199. </view>
  200. </view>
  201. <view style='height:120rpx;'></view>
  202. </view>
  203. <view class='footer acea-row row-between-wrapper'>
  204. <view class="acea-row row-middle">合计:
  205. <!-- 积分价格 -->
  206. <PointsPrice v-if="orderInfoVo.secondType === ProductTypeEnum.Integral" :pointsPrice="orderInfoVo"
  207. :pointsGoodsStyle="hotPointsStyle"></PointsPrice>
  208. <!-- 其他价格 -->
  209. <text v-else class='price_color'>¥{{orderInfoVo.payFee || 0}}</text>
  210. </view>
  211. <view class='settlement' style='z-index:100' @tap="SubOrder">
  212. {{secondType === ProductTypeEnum.Integral?"确认兑换":"立即下单"}}
  213. </view>
  214. </view>
  215. </view>
  216. <couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone" :openType='openType' @ChangCoupons="ChangCoupons"
  217. :orderShow="orderShow" :surplusFee="surplusFee"></couponListWindow>
  218. <view v-if="isShowBox">
  219. <checkDelivery :isShowBox="isShowBox" :activeObj="activeObj" @close="boxClose" @confirmBtn="getShippingType">
  220. </checkDelivery>
  221. </view>
  222. <!-- 满员提示 -->
  223. <uni-popup ref="sh_popup" background-color="#fff" borderRadius="10px">
  224. <view class="sh_popup-content">
  225. <view class="sh_popup_title">
  226. 提示
  227. </view>
  228. <view class="sh_popup_text">
  229. 该团已拼成,是否自行开团?
  230. </view>
  231. <view class="sh_popup_btn">
  232. <view class="no_btn btn font_color" @click="popupClose">返回首页</view>
  233. <view class="yes_btn btn" @click="toAudit">去开团</view>
  234. </view>
  235. </view>
  236. </uni-popup>
  237. <!-- 选择时间 -->
  238. <view class="time-box" v-if="isTime">
  239. <view class="box-time">
  240. <view class="close" @click="isTime = false">
  241. <text style="font-size: 27rpx;font-weight: 600;padding: 20rpx 0;">选择配送时间</text>
  242. <text style="position: absolute;right: 0; padding: 10rpx 20rpx;font-size: 30rpx;">x</text>
  243. </view>
  244. <view class="scr-box">
  245. <scroll-view class="menus" scroll-with-animation scroll-y>
  246. <view class="wrapper">
  247. <view class="left-name" :id="`menu-${item.id}`" :class="{'current': item.id === timeIndex}" v-for="(item, index) in timeData"
  248. :key="index" @tap="handleMenuTap(item.id)">
  249. <text>{{ item.name }}</text>
  250. </view>
  251. </view>
  252. </scroll-view>
  253. <!-- goods list begin -->
  254. <scroll-view class="times" scroll-with-animation scroll-y :scroll-top="cateScrollTop" @scroll="handleGoodsScroll"
  255. :scroll-into-view="menuScrollIntoView">
  256. <view class="wrapper" style="padding-bottom: 200rpx;">
  257. <view class="category" v-for="(item, index) in timeData" :key="index" :id="`cate-${item.id}`">
  258. <view class="items">
  259. <view class="right-times" v-for="(good, key) in item.list" :key="key">
  260. {{good.name}}
  261. </view>
  262. </view>
  263. </view>
  264. </view>
  265. </scroll-view>
  266. </view>
  267. </view>
  268. </view>
  269. </view>
  270. </template>
  271. <script>
  272. // +----------------------------------------------------------------------
  273. // | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
  274. // +----------------------------------------------------------------------
  275. // | Copyright (c) 2016~2025 https://www.crmeb.com All rights reserved.
  276. // +----------------------------------------------------------------------
  277. // | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
  278. // +----------------------------------------------------------------------
  279. // | Author: CRMEB Team <admin@crmeb.com>
  280. // +----------------------------------------------------------------------
  281. import {
  282. getCouponsOrderPrice,
  283. orderCreate,
  284. postOrderComputed,
  285. loadPreOrderApi
  286. } from '@/api/order.js';
  287. import {
  288. getAddressDetail,
  289. getAddressDefault
  290. } from '@/api/user.js';
  291. // import {
  292. // openPaySubscribe
  293. // } from '@/utils/SubscribeMessage.js';
  294. import {
  295. takeTheirApi
  296. } from '@/api/merchant.js';
  297. import {
  298. CACHE_LONGITUDE,
  299. CACHE_LATITUDE
  300. } from '@/config/cache.js';
  301. import dayjs from "@/plugin/dayjs/dayjs.min.js";
  302. import couponListWindow from '../components/couponListWindow';
  303. import orderGoods from '../components/orderGoods'
  304. import navBar from '@/components/navBar';
  305. import checkDelivery from '../components/checkDelivery/index.vue';
  306. import systemFrom from '../components/systemFrom/index.vue';
  307. import PointsPrice from '@/components/PointsPrice.vue';
  308. import {
  309. toLogin
  310. } from '@/libs/login.js';
  311. import {
  312. mapGetters
  313. } from "vuex";
  314. import {
  315. Debounce
  316. } from '@/utils/validate.js'
  317. import {
  318. ProductTypeEnum,
  319. ProductMarketingTypeEnum
  320. } from "../../../enums/productEnums";
  321. import orderPay from "@/mixins/OrderPay.js";
  322. let app = getApp();
  323. /**
  324. * 积分商品推荐样式
  325. */
  326. const hotPointsStyle = {
  327. iconStyle: {
  328. width: '28rpx',
  329. height: '28rpx'
  330. },
  331. priceStyle: {
  332. fontSize: '28rpx',
  333. },
  334. unitStyle: {
  335. fontSize: '26rpx',
  336. },
  337. }
  338. export default {
  339. mixins: [orderPay],
  340. components: {
  341. navBar,
  342. couponListWindow,
  343. orderGoods,
  344. checkDelivery,
  345. systemFrom,
  346. PointsPrice
  347. },
  348. computed: {
  349. // 是否可以使用优惠券、积分抵扣。 基础订单/云盘订单,卡密,虚拟,可以使用优惠券、积分抵扣
  350. isProductType() {
  351. return this.type === ProductMarketingTypeEnum.Normal && this.secondType !== this.ProductTypeEnum
  352. .Integral && this.secondType !== this.ProductTypeEnum.Video
  353. },
  354. ...mapGetters(['productType', 'isLogin'])
  355. },
  356. data() {
  357. return {
  358. timeData: [{
  359. id: 1,
  360. name: 1,
  361. list: [{
  362. id: 11,
  363. name: 11
  364. }, {
  365. id: 111,
  366. name: 111
  367. }, {
  368. id: 1111,
  369. name: 1111
  370. }]
  371. }, {
  372. id: 2,
  373. name: 2,
  374. list: [{
  375. id: 22,
  376. name: 22
  377. }, {
  378. id: 222,
  379. name: 222
  380. }, {
  381. id: 2222,
  382. name: 2222
  383. }]
  384. }, {
  385. id: 3,
  386. name: 3,
  387. list: [{
  388. id: 33,
  389. name: 33
  390. }, {
  391. id: 333,
  392. name: 333
  393. }, {
  394. id: 3333,
  395. name: 3333
  396. }]
  397. }],
  398. menuScrollIntoView: '',
  399. sizeCalcState: false,
  400. cateScrollTop: 0,
  401. timeIndex: 1,
  402. timeStr: '',
  403. isTime: false,
  404. time: '12:01',
  405. goIndex: true,
  406. hotPointsStyle: hotPointsStyle,
  407. ProductMarketingTypeEnum: ProductMarketingTypeEnum,
  408. ProductTypeEnum: ProductTypeEnum,
  409. navTitle: '提交订单',
  410. homeTop: 20,
  411. orderShow: 'orderShow', //下单页面使用优惠券组件不展示tab切换页
  412. textareaStatus: true,
  413. openType: 1, //优惠券打开方式 1=使用
  414. couponShow: false,
  415. coupon: {
  416. coupon: false,
  417. list: [], //商户优惠券
  418. statusTile: '立即使用',
  419. couponMoney: 0
  420. }, //优惠券组件
  421. addressInfo: {}, //地址信息
  422. addressId: 0, //地址id
  423. orderMerchantRequestList: [], //商户属性集合
  424. cartId: '', //购物车id
  425. userInfo: {}, //用户信息
  426. mark: '', //买家留言
  427. couponFee: '请选择', //优惠券
  428. coupon_price: 0, //优惠券抵扣金额
  429. isUseIntegral: false, //是否使用积分
  430. integral_price: 0, //积分抵扣金额
  431. integral: 0,
  432. ChangePrice: 0, //使用积分抵扣变动后的金额
  433. formIds: [], //收集formid
  434. status: 0,
  435. is_address: false,
  436. toPay: false, //修复进入支付时页面隐藏从新刷新页面
  437. shippingType: 1,
  438. storePostage: 0,
  439. contacts: '',
  440. contactsTel: '',
  441. mydata: {},
  442. merchantOrderVoList: [],
  443. priceGroup: {},
  444. animated: false,
  445. totalPrice: 0,
  446. integralRatio: "0",
  447. orderKey: "",
  448. // usableCoupon: {},
  449. offlinePostage: "",
  450. news: true,
  451. again: false,
  452. addAgain: false,
  453. bargain: false, //是否是砍价
  454. combination: false, //是否是拼团
  455. secKill: false, //是否是秒杀
  456. orderInfoVo: {},
  457. addressList: [], //地址列表数据
  458. orderProNum: 0,
  459. orderNo: '', //预下单订单号
  460. theme: app.globalData.theme,
  461. addressChangeId: 0,
  462. isShowBox: false,
  463. activeObj: {},
  464. activeIndex: 0, // 选中店铺索引
  465. type: 0, // 0-基础订单,1-秒杀订单,2-拼团订单
  466. secondType: 0, //订单二级类型:0-普通订单,1-积分订单,2-虚拟订单,4-视频号订单,5-云盘订单,6-卡密订单
  467. merId: 0, //商户id,用于判断商户优惠券还是平台优惠券,平台优惠券商户id为0
  468. platUserCouponObj: {}, //平台优惠券对象,用于缓存数据使用
  469. platUserCouponId: 0, //平台优惠券id
  470. platCouponFee: '', //平台优惠券金额
  471. merCouponFee: '', //店铺优惠券总金额
  472. surplusFee: 0, //商品总金额-商户优惠券金额=平台端可使用优惠券的门槛
  473. merUserCouponId: 0, //店铺使用优惠券的id
  474. tempCouponObj: {}, //临时优惠券数据
  475. merchangtInfo: {}, //商户信息
  476. orderForm: [], //系统表单配置的数据
  477. orderExtend: {}, //提交接口表单的数据
  478. productId: '',
  479. groupActivityId: ''
  480. };
  481. },
  482. watch: {
  483. isLogin: {
  484. handler: function(newV, oldV) {
  485. if (newV) {
  486. this.getloadPreOrder();
  487. }
  488. },
  489. deep: true
  490. },
  491. },
  492. onLoad(options) {
  493. this.orderNo = options.orderNo || 0;
  494. this.addressChangeId = parseInt(options.addressId) || 0;
  495. this.is_address = options.is_address ? true : false;
  496. if (this.isLogin) {
  497. this.getloadPreOrder();
  498. } else {
  499. toLogin();
  500. }
  501. },
  502. /**
  503. * 生命周期函数--监听页面显示
  504. */
  505. onShow: function() {
  506. let _this = this
  507. this.textareaStatus = true;
  508. },
  509. methods: {
  510. onTime() {
  511. this.isTime = true
  512. this.goIndex = false
  513. },
  514. handleMenuTap(id) { //点击菜单项事件
  515. // this.menuScrollIntoView = `cate-${id}`
  516. if (!this.sizeCalcState) {
  517. this.calcSize()
  518. }
  519. this.timeIndex = id
  520. this.$nextTick(() => this.cateScrollTop = this.timeData.find(item => item.id == id).top)
  521. },
  522. handleGoodsScroll({
  523. detail
  524. }) { //商品列表滚动事件
  525. if (!this.sizeCalcState) {
  526. this.calcSize()
  527. }
  528. const {
  529. scrollTop
  530. } = detail
  531. let tabs = this.timeData.filter(item => item.top <= scrollTop).reverse()
  532. if (tabs.length > 0) {
  533. this.timeIndex = tabs[0].id
  534. }
  535. },
  536. calcSize() {
  537. let h = 10
  538. this.timeData.forEach(item => {
  539. let view = uni.createSelectorQuery().select(`#cate-${item.id}`)
  540. view.fields({
  541. size: true
  542. }, data => {
  543. // if (data.goodsList) {
  544. item.top = h
  545. h += data.height
  546. item.bottom = h
  547. // }
  548. }).exec()
  549. })
  550. this.sizeCalcState = true
  551. },
  552. bindTimeChange: function(e) {
  553. console.log(e)
  554. this.time = e.detail.value
  555. this.goIndex = false
  556. },
  557. //滚动
  558. touchStart() {
  559. this.$refs.navBarRef.currentPage = false;
  560. },
  561. popupClose() {
  562. this.$refs.sh_popup.close()
  563. uni.switchTab({
  564. url: '/pages/index/index'
  565. });
  566. },
  567. //去开团
  568. toAudit() {
  569. this.$refs.sh_popup.close()
  570. uni.navigateTo({
  571. url: `/pages/goods/goods_details/index?id=${this.productId}&mt=2&gd=${this.groupActivityId}`
  572. })
  573. },
  574. addressType(type) {
  575. this.merchantOrderVoList[0].shippingType = type
  576. this.getShippingType(this.merchantOrderVoList[0])
  577. if (type == 2) {
  578. setTimeout(() => {
  579. this.shippingType = type
  580. }, 300)
  581. } else {
  582. this.shippingType = type
  583. }
  584. },
  585. //选择配送方式回调
  586. getShippingType(item) {
  587. this.orderMerchantRequestList[this.activeIndex].shippingType = item.shippingType;
  588. this.$set(this.merchantOrderVoList[this.activeIndex], 'shippingType', item.shippingType);
  589. if (item.shippingType === 2) this.getTakeTheir(item.merId);
  590. this.computedPrice();
  591. this.isShowBox = false;
  592. },
  593. getTakeTheir(id) {
  594. takeTheirApi(id).then(res => {
  595. this.merchangtInfo = res.data; //商户信息
  596. this.$set(this.merchantOrderVoList[this.activeIndex], 'addressDetail', res.data.addressDetail);
  597. this.$set(this.merchantOrderVoList[this.activeIndex], 'phone', res.data.phone);
  598. this.$set(this.merchantOrderVoList[this.activeIndex], 'latitude', res.data.latitude);
  599. this.$set(this.merchantOrderVoList[this.activeIndex], 'longitude', res.data.longitude);
  600. }).catch(err => {
  601. return this.$util.Tips({
  602. title: err
  603. });
  604. })
  605. },
  606. //查看内置地图
  607. goMap(item) {
  608. let that = this;
  609. //#ifdef H5
  610. if (that.$wechat.isWeixin() === true) {
  611. that.$wechat.seeLocation({
  612. latitude: parseFloat(this.merchantOrderVoList[this.activeIndex].latitude),
  613. longitude: parseFloat(this.merchantOrderVoList[this.activeIndex].longitude),
  614. name: item.merName,
  615. address: item.addressDetail ? item.addressDetail : '',
  616. }).then(res => {
  617. console.log('success');
  618. })
  619. } else {
  620. //#endif
  621. uni.openLocation({
  622. latitude: parseFloat(this.merchantOrderVoList[this.activeIndex].latitude),
  623. longitude: parseFloat(this.merchantOrderVoList[this.activeIndex].longitude),
  624. scale: 8,
  625. name: item.merName,
  626. address: item.addressDetail ? item.addressDetail : '',
  627. success: function(res) {
  628. that.go_map = true
  629. },
  630. });
  631. // #ifdef H5
  632. }
  633. //#endif
  634. },
  635. // 打开配送方式弹窗
  636. openShowBox(item, index) {
  637. this.activeObj = item
  638. this.activeIndex = index
  639. this.isShowBox = true
  640. },
  641. boxClose() {
  642. this.isShowBox = false
  643. },
  644. // 订单详情
  645. getloadPreOrder: function() {
  646. loadPreOrderApi(this.orderNo).then(res => {
  647. let orderInfoVo = res.data;
  648. if (orderInfoVo.merchantInfoList[0].orderInfoList[0].groupBuyActivityId) {
  649. this.groupActivityId = orderInfoVo.merchantInfoList[0].orderInfoList[0].groupBuyActivityId
  650. this.productId = orderInfoVo.merchantInfoList[0].orderInfoList[0].productId
  651. }
  652. if (orderInfoVo.merchantInfoList[0].deliveryMethodMer.split(',').length == 1) {
  653. this.shippingType = orderInfoVo.merchantInfoList[0].deliveryMethodMer
  654. }
  655. this.orderInfoVo = {
  656. ...orderInfoVo,
  657. systemFormValue: orderInfoVo.systemFormValue ? this.$util.objToArr(JSON.parse(
  658. orderInfoVo.systemFormValue)) : []
  659. };
  660. console.log(this.orderInfoVo, '0000000000000000000000000000000')
  661. this.merchantOrderVoList = orderInfoVo.merchantInfoList; //商户端数据
  662. this.platCouponFee = orderInfoVo.platCouponFee; //平台优惠券总金额
  663. this.platUserCouponId = orderInfoVo.platUserCouponId;
  664. this.merCouponFee = orderInfoVo.merCouponFee; //店铺优惠券总金额
  665. orderInfoVo.merchantInfoList.map(item => {
  666. this.orderMerchantRequestList.push({
  667. shippingType: item.shippingType,
  668. merId: item.merId,
  669. remark: '',
  670. userCouponId: item.userCouponId
  671. })
  672. if (item.shippingType === 2) this.getTakeTheir(item.merId)
  673. item.addressDetail = this.merchangtInfo.addressDetail;
  674. item.phone = this.merchangtInfo.phone;
  675. item.latitude = this.merchangtInfo.latitude;
  676. item.longitude = this.merchangtInfo.longitude;
  677. });
  678. this.type = orderInfoVo.type; //订单类型
  679. this.secondType = orderInfoVo
  680. .secondType; //订单二级类型:0-普通订单,1-积分订单,2-虚拟订单,4-视频号订单,5-云盘订单,6-卡密订单
  681. this.orderProNum = orderInfoVo.orderProNum;
  682. if (orderInfoVo.addressId && this.addressChangeId === 0) {
  683. this.addressId = orderInfoVo.addressId;
  684. } else {
  685. this.addressId = this.addressChangeId;
  686. if (orderInfoVo.addressId != this.addressChangeId && this.addressChangeId > 0)
  687. this.computedPrice();
  688. }
  689. this.getaddressInfo();
  690. }).catch(err => {
  691. uni.navigateTo({
  692. url: '/pages/goods/order_list/index'
  693. });
  694. })
  695. },
  696. // 计算订单价格
  697. computedPrice: function() {
  698. uni.showLoading({
  699. title: '加载中...'
  700. });
  701. let shippingType = this.shippingType;
  702. postOrderComputed({
  703. addressId: this.addressId,
  704. isUseIntegral: this.isUseIntegral,
  705. orderMerchantRequestList: this.orderMerchantRequestList,
  706. preOrderNo: this.orderNo,
  707. platUserCouponId: this.platUserCouponId
  708. }).then(res => {
  709. let data = res.data;
  710. //usedIntegral 使用的积分,surplusIntegral 剩余积分
  711. data.merOrderResponseList.map((item, i) => {
  712. this.merchantOrderVoList[i].freightFee = item.freightFee
  713. this.merchantOrderVoList[i].couponFee = item.couponFee
  714. });
  715. this.orderInfoVo.platCouponUserList = data.platCouponUserList; //平台优惠券数据
  716. this.merCouponFee = data.merCouponFee; //店铺优惠券总金额
  717. this.orderInfoVo.couponFee = data.couponFee; //优惠券优惠金额
  718. this.orderInfoVo.userIntegral = data.surplusIntegral; //使用的积分
  719. this.orderInfoVo.deductionPrice = data.deductionPrice;
  720. this.orderInfoVo.freightFee = data.freightFee;
  721. this.orderInfoVo.payFee = data.payFee;
  722. this.orderInfoVo.proTotalFee = data.proTotalFee;
  723. this.orderInfoVo.surplusIntegral = data.usedIntegral; //剩余积分
  724. this.platCouponFee = data.platCouponFee; //平台优惠金额
  725. this.orderInfoVo.integralDeductionSwitch = data.integralDeductionSwitch //积分抵扣开关
  726. //选中商户优惠券的值
  727. this.merchantOrderVoList[this.activeIndex].merCouponUserList = data.merOrderResponseList[
  728. this.activeIndex].merCouponUserList; //商户数据
  729. this.merUserCouponId = data.merOrderResponseList[this.activeIndex]
  730. .userCouponId //店铺使用优惠券的id
  731. console.log(this.orderInfoVo, '222222222222222222222222222222222')
  732. uni.hideLoading();
  733. }).catch(err => {
  734. uni.hideLoading();
  735. return this.$util.Tips({
  736. title: err
  737. });
  738. });
  739. },
  740. bindPickerChange: function(e) {
  741. let value = e.detail.value;
  742. this.shippingType = value;
  743. this.computedPrice();
  744. },
  745. /**
  746. * 使用积分抵扣
  747. */
  748. ChangeIntegral: function() {
  749. this.isUseIntegral = !this.isUseIntegral;
  750. this.computedPrice();
  751. },
  752. bindHideKeyboard: function(e, i) {
  753. this.orderMerchantRequestList[i].remark = e;
  754. },
  755. /*
  756. * 获取默认收货地址或者获取某条地址信息
  757. */
  758. getaddressInfo: function() {
  759. if (this.addressId) {
  760. getAddressDetail(this.addressId).then(res => {
  761. if (res.data) {
  762. res.data.isDefault = res.data.isDefault;
  763. this.addressInfo = res.data || {};
  764. }
  765. })
  766. }
  767. },
  768. //关闭优惠券弹窗
  769. ChangCouponsClone: function(coupon) {
  770. this.coupon.list = [];
  771. this.coupon.coupon = false;
  772. },
  773. //点击优惠券弹窗确定后
  774. ChangCoupons: function(item) {
  775. this.coupon.list = [];
  776. if (item.merId === 0) {
  777. this.platUserCouponId = item.isChecked ? item.id : 0;
  778. } else {
  779. this.$set(this.orderMerchantRequestList[this.activeIndex], 'userCouponId', item.isChecked ? item
  780. .id : 0);
  781. }
  782. this.coupon.coupon = false;
  783. this.computedPrice();
  784. },
  785. /**
  786. * 选择优惠券
  787. * @param {Object} item优惠券对象
  788. * @param {Number} merId商户id
  789. * @param {Number} index索引
  790. */
  791. couponTap: function(item, merId, index) {
  792. this.$set(this.coupon, 'list', item);
  793. this.$set(this.coupon, 'couponMoney', item);
  794. this.coupon.coupon = true;
  795. this.merId = merId; //商户id
  796. if (merId !== 0) this.activeIndex = index;
  797. this.coupon.loading = false;
  798. },
  799. /**
  800. * 获取当前金额可用优惠券
  801. *
  802. */
  803. getCouponList: function(item, merId) {
  804. this.$set(this.coupon, 'list', item);
  805. this.openType = 1;
  806. uni.hideLoading();
  807. },
  808. onAddress: function() {
  809. uni.navigateTo({
  810. url: '/pages/address/user_address_list/index?orderNo=' + this.orderNo
  811. });
  812. },
  813. realName: function(e) {
  814. this.contacts = e.detail.value;
  815. },
  816. phone: function(e) {
  817. this.contactsTel = e.detail.value;
  818. },
  819. payment: function(data) {
  820. let that = this;
  821. // #ifdef MP
  822. uni.checkBeforeAddOrder({
  823. success(res) {
  824. console.log("下单前置检查 成功:", JSON.stringify(res));
  825. const traceId = res.data.traceId;
  826. data.traceId = traceId;
  827. that.onCreate(data);
  828. },
  829. fail(res) {
  830. console.log("下单前置检查 失败:", JSON.stringify(res));
  831. }
  832. });
  833. // #endif
  834. // #ifndef MP
  835. that.onCreate(data);
  836. // #endif
  837. },
  838. onCreate(data) {
  839. orderCreate(data).then(res => {
  840. if (res.data.groupBuyIsFull == 1) {
  841. uni.hideLoading();
  842. return this.$refs.sh_popup.open('center')
  843. }
  844. if (this.secondType === this.ProductTypeEnum.Integral && this.orderInfoVo.payFee == 0) {
  845. // 积分商品并且支付金额为0时,直接默认走余额支付的逻辑,订单支付成功跳转到支付结果页
  846. this.changeOrderPay(res.data.orderNo, 'yue', 'yue', 'integral', 'integral', '0')
  847. } else {
  848. // 其他商品走正常流程,去支付收银台页面
  849. this.getToPayment(this.secondType, res.data)
  850. }
  851. uni.hideLoading();
  852. }).catch(err => {
  853. uni.hideLoading();
  854. return this.$util.Tips({
  855. title: err
  856. });
  857. });
  858. },
  859. //立即下单
  860. SubOrder: Debounce(function(e) {
  861. let that = this,
  862. data = {};
  863. let flag = false;
  864. that.orderMerchantRequestList.map(function(v) {
  865. if (v.shippingType === 1 && !that.addressId && that.orderInfoVo.secondType !== 2) {
  866. flag = true;
  867. }
  868. });
  869. if (flag) {
  870. that.$util.Tips({
  871. title: '请选择收货地址'
  872. });
  873. return;
  874. }
  875. let systemFormValue = Array.from(this.orderInfoVo.systemFormValue)
  876. let systemFormData = []
  877. for (var i = 0; i < systemFormValue.length; i++) {
  878. let curdata = systemFormValue[i]
  879. if (['radios'].indexOf(curdata.name) == -1 && (curdata.titleShow.val || (['uploadPicture',
  880. 'dateranges'
  881. ].indexOf(curdata.name) == -1 && curdata.value && curdata.value.trim()))) {
  882. if ((curdata.name === 'texts' && curdata.valConfig.tabVal == 0) || ['dates', 'times',
  883. 'selects', 'citys', 'checkboxs'
  884. ].indexOf(curdata.name) != -1) {
  885. if (!curdata.value || (curdata.value && !curdata.value.trim())) {
  886. return that.$util.Tips({
  887. title: `请填写${curdata.titleConfig.val}`
  888. });
  889. }
  890. }
  891. if (curdata.name === 'timeranges') {
  892. if (!curdata.value) {
  893. return that.$util.Tips({
  894. title: `请选择${curdata.titleConfig.val}`
  895. });
  896. }
  897. }
  898. if (curdata.name === 'dateranges') {
  899. if (!curdata.value.length) {
  900. return that.$util.Tips({
  901. title: `请选择${curdata.titleConfig.val}`
  902. });
  903. }
  904. }
  905. if (curdata.name === 'texts' && curdata.valConfig.tabVal == 4) {
  906. if (curdata.value <= 0) {
  907. return that.$util.Tips({
  908. title: `请填写大于0的${curdata.titleConfig.val}`
  909. });
  910. }
  911. }
  912. if (curdata.name === 'texts' && curdata.valConfig.tabVal == 3) {
  913. if (!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(curdata.value)) {
  914. return that.$util.Tips({
  915. title: `请填写正确的${curdata.titleConfig.val}`
  916. });
  917. }
  918. }
  919. if (curdata.name === 'texts' && curdata.valConfig.tabVal == 1) {
  920. if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(curdata.value)) {
  921. return that.$util.Tips({
  922. title: `请填写正确的${curdata.titleConfig.val}`
  923. });
  924. }
  925. }
  926. if (curdata.name === 'texts' && curdata.valConfig.tabVal == 2) {
  927. if (!
  928. /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/i
  929. .test(curdata.value)) {
  930. return that.$util.Tips({
  931. title: `请填写正确的${curdata.titleConfig.val}`
  932. });
  933. }
  934. }
  935. if (curdata.name === 'uploadPicture') {
  936. if (!curdata.value.length) {
  937. return that.$util.Tips({
  938. title: `请上传${curdata.titleConfig.val}`
  939. });
  940. }
  941. }
  942. }
  943. this.orderExtend[curdata.key] = curdata.value
  944. systemFormData.push({
  945. title: curdata.titleConfig.val,
  946. value: curdata.value,
  947. })
  948. }
  949. data = {
  950. addressId: that.addressId,
  951. orderMerchantRequestList: that.orderMerchantRequestList,
  952. isUseIntegral: that.isUseIntegral,
  953. preOrderNo: that.orderNo,
  954. platUserCouponId: this.platUserCouponId,
  955. systemFormId: this.orderInfoVo.systemFormId,
  956. orderExtend: JSON.stringify(systemFormData)
  957. };
  958. uni.showLoading({
  959. title: '订单提交中'
  960. });
  961. that.payment(data);
  962. //// #ifdef MP
  963. // openPaySubscribe().then(() => {
  964. // that.payment(data);
  965. // });
  966. // // #endif
  967. // // #ifndef MP
  968. // that.payment(data);
  969. // // #endif
  970. })
  971. }
  972. }
  973. </script>
  974. <style lang="scss" scoped>
  975. .time-box {
  976. width: 100%;
  977. height: 100%;
  978. box-sizing: border-box;
  979. position: fixed;
  980. bottom: 0;
  981. left: 0;
  982. z-index: 99999;
  983. background: rgba(33, 33, 33, 0.8);
  984. .box-time {
  985. width: 100%;
  986. height: 500rpx;
  987. background-color: #fff;
  988. padding: 0 30rpx;
  989. padding-bottom: 100rpx;
  990. font-size: 28rpx;
  991. color: #333;
  992. box-sizing: border-box;
  993. position: fixed;
  994. bottom: 0;
  995. left: 0;
  996. z-index: 99999;
  997. display: flex;
  998. flex-direction: column;
  999. .close {
  1000. position: relative;
  1001. display: flex;
  1002. align-items: center;
  1003. justify-content: center;
  1004. }
  1005. .scr-box {
  1006. flex: 1;
  1007. display: flex;
  1008. align-items: center;
  1009. overflow: hidden;
  1010. .menus {
  1011. width: 140rpx;
  1012. height: 100%;
  1013. background: #F7F8F9;
  1014. .current {
  1015. color: #141414;
  1016. background: #fff;
  1017. }
  1018. .left-name {
  1019. display: flex;
  1020. align-items: center;
  1021. justify-content: center;
  1022. padding: 25rpx 0;
  1023. font-weight: 500;
  1024. font-size: 27rpx;
  1025. color: #999999;
  1026. }
  1027. }
  1028. .times {
  1029. flex: 1;
  1030. height: 100%;
  1031. padding: 0 20rpx;
  1032. .right-times {
  1033. display: flex;
  1034. align-items: center;
  1035. padding: 25rpx 0;
  1036. font-weight: 500;
  1037. font-size: 27rpx;
  1038. color: #141414;
  1039. border-bottom: 2rpx solid #D6D7DC;
  1040. }
  1041. }
  1042. }
  1043. }
  1044. }
  1045. .w-480px {
  1046. width: 480rpx;
  1047. }
  1048. .noCoupon {
  1049. color: #999999;
  1050. }
  1051. .icon-jiantou {
  1052. font-size: 26rpx;
  1053. color: #515151;
  1054. margin-left: 14rpx;
  1055. }
  1056. .mr14 {
  1057. margin-right: 14rpx;
  1058. }
  1059. .couponTitle {
  1060. width: 430rpx;
  1061. display: inline-block;
  1062. text-align: right;
  1063. @include main_color(theme);
  1064. }
  1065. .store-address {
  1066. padding: 20rpx;
  1067. margin: 0 24rpx;
  1068. background: #F6F6F6;
  1069. border-radius: 8rpx;
  1070. font-size: 24rpx;
  1071. /*垂直居中*/
  1072. -webkit-box-align: center;
  1073. /*旧版本*/
  1074. -moz-box-align: center;
  1075. /*旧版本*/
  1076. -ms-flex-align: center;
  1077. /*混合版本*/
  1078. -webkit-align-items: center;
  1079. /*新版本*/
  1080. align-items: center;
  1081. /*新版本*/
  1082. .phone {
  1083. margin-bottom: 10rpx;
  1084. color: #282828;
  1085. font-weight: bold;
  1086. }
  1087. .name {
  1088. padding-right: 20rpx;
  1089. }
  1090. .info {
  1091. flex: 1;
  1092. }
  1093. .line2 {
  1094. width: 456rpx !important;
  1095. }
  1096. .map {
  1097. text-align: center;
  1098. padding-left: 36rpx;
  1099. position: relative;
  1100. @include main_color(theme);
  1101. &::before {
  1102. content: '';
  1103. display: inline-block;
  1104. width: 2rpx;
  1105. height: 42rpx;
  1106. background-color: #DDDDDD;
  1107. position: absolute;
  1108. left: 0;
  1109. top: 18rpx;
  1110. }
  1111. .iconfont {
  1112. color: var(--view-theme);
  1113. }
  1114. .map_text {
  1115. color: var(--view-theme);
  1116. }
  1117. }
  1118. }
  1119. .font_color {
  1120. @include main_color(theme);
  1121. }
  1122. .price_color {
  1123. @include price_color(theme);
  1124. }
  1125. .line2 {
  1126. width: 624rpx;
  1127. }
  1128. .textR {
  1129. text-align: right;
  1130. }
  1131. .order-submission .line {
  1132. width: 100%;
  1133. height: 3rpx;
  1134. }
  1135. .order-submission .line image {
  1136. width: 100%;
  1137. height: 100%;
  1138. display: block;
  1139. }
  1140. .order-submission .address {
  1141. padding: 40rpx 24rpx;
  1142. background-color: #fff;
  1143. box-sizing: border-box;
  1144. }
  1145. .order-submission .address .addressCon {
  1146. width: 596rpx;
  1147. font-size: 26rpx;
  1148. color: #666;
  1149. }
  1150. .order-submission .address .addressCon .name {
  1151. font-size: 30rpx;
  1152. color: #282828;
  1153. font-weight: bold;
  1154. // margin-bottom: 10rpx;
  1155. }
  1156. .order-submission .address .addressCon .name .phone {
  1157. margin-left: 50rpx;
  1158. }
  1159. .order-submission .address .addressCon .default {
  1160. margin-right: 12rpx;
  1161. }
  1162. .order-submission .address .addressCon .setaddress {
  1163. color: #333;
  1164. font-size: 28rpx;
  1165. }
  1166. .order-submission .address .iconfont {
  1167. color: #707070;
  1168. }
  1169. .order-submission .allAddress {
  1170. width: 100%;
  1171. @include index-gradient(theme);
  1172. padding: 30rpx 24rpx 0 24rpx;
  1173. }
  1174. .order-submission .allAddress .address.group {
  1175. border-radius: 0;
  1176. }
  1177. .order-submission .allAddress .address {
  1178. max-height: 180rpx;
  1179. margin: -2rpx auto 0 auto;
  1180. border-radius: 14rpx 14rpx 0 0;
  1181. }
  1182. .order-submission .allAddress .line {
  1183. width: 100%;
  1184. margin: 0 auto;
  1185. }
  1186. .order-submission .wrapper .item .discount .placeholder {
  1187. color: #ccc;
  1188. }
  1189. .order-submission .wrapper {
  1190. background-color: #fff;
  1191. margin-top: 24rpx;
  1192. }
  1193. .order-submission .wrapper .item {
  1194. padding: 28rpx 24rpx;
  1195. font-size: 30rpx;
  1196. color: #333333;
  1197. }
  1198. .order-submission .wrapper .item .discount {
  1199. font-size: 30rpx;
  1200. color: #333;
  1201. }
  1202. .order-submission .wrapper .item .discount .iconfont {
  1203. color: #515151;
  1204. }
  1205. .order-submission .wrapper .item .discount .num {
  1206. font-size: 32rpx;
  1207. margin-right: 20rpx;
  1208. }
  1209. .order-submission .wrapper .item .shipping {
  1210. font-size: 30rpx;
  1211. color: #999;
  1212. position: relative;
  1213. padding-right: 58rpx;
  1214. }
  1215. .order-submission .wrapper .item .shipping .iconfont {
  1216. font-size: 35rpx;
  1217. color: #707070;
  1218. position: absolute;
  1219. right: 0;
  1220. top: 50%;
  1221. transform: translateY(-50%);
  1222. margin-left: 30rpx;
  1223. }
  1224. .order-submission .wrapper .item textarea {
  1225. background-color: #f9f9f9;
  1226. width: auto !important;
  1227. height: 140rpx;
  1228. border-radius: 14rpx;
  1229. margin-top: 30rpx;
  1230. padding: 15rpx;
  1231. box-sizing: border-box;
  1232. font-weight: 400;
  1233. }
  1234. .order-submission .wrapper .item .placeholder {
  1235. color: #ccc;
  1236. }
  1237. .order-submission .wrapper .item .list {
  1238. margin-top: 35rpx;
  1239. }
  1240. .order-submission .wrapper .item .list .payItem {
  1241. border: 1px solid #eee;
  1242. border-radius: 14rpx;
  1243. height: 86rpx;
  1244. width: 100%;
  1245. box-sizing: border-box;
  1246. margin-top: 20rpx;
  1247. font-size: 28rpx;
  1248. color: #282828;
  1249. }
  1250. .order-submission .wrapper .item .list .payItem.on {
  1251. // border-color: #fc5445;
  1252. @include coupons_border_color(theme);
  1253. color: $theme-color;
  1254. }
  1255. .order-submission .wrapper .item .list .payItem .name {
  1256. width: 50%;
  1257. text-align: center;
  1258. border-right: 1px solid #eee;
  1259. }
  1260. .order-submission .wrapper .item .list .payItem .name .iconfont {
  1261. width: 44rpx;
  1262. height: 44rpx;
  1263. border-radius: 50%;
  1264. text-align: center;
  1265. line-height: 44rpx;
  1266. background-color: #fe960f;
  1267. color: #fff;
  1268. font-size: 30rpx;
  1269. margin-right: 15rpx;
  1270. }
  1271. .order-submission .wrapper .item .list .payItem .name .iconfont.icon-weixin2 {
  1272. background-color: #41b035;
  1273. }
  1274. .order-submission .wrapper .item .list .payItem .name .iconfont.icon-zhifubao {
  1275. background-color: #00AAEA;
  1276. }
  1277. .order-submission .wrapper .item .list .payItem .tip {
  1278. width: 49%;
  1279. text-align: center;
  1280. font-size: 26rpx;
  1281. color: #aaa;
  1282. }
  1283. .order-submission .moneyList {
  1284. margin-top: 15rpx;
  1285. background-color: #fff;
  1286. padding: 0 30rpx;
  1287. margin-bottom: calc(constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
  1288. margin-bottom: calc(env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
  1289. }
  1290. .order-submission .moneyList .item {
  1291. font-size: 30rpx;
  1292. color: #282828;
  1293. height: 96rpx;
  1294. }
  1295. .order-submission .moneyList .item~.item {
  1296. // margin-top: 20rpx;
  1297. }
  1298. .order-submission .moneyList .item .money {
  1299. color: #666666;
  1300. }
  1301. .order-submission .footer {
  1302. width: 100%;
  1303. height: 100rpx;
  1304. background-color: #fff;
  1305. padding: 0 30rpx;
  1306. font-size: 28rpx;
  1307. color: #333;
  1308. box-sizing: border-box;
  1309. position: fixed;
  1310. bottom: 0;
  1311. left: 0;
  1312. height: calc(100rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
  1313. height: calc(100rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
  1314. z-index: 999;
  1315. }
  1316. .order-submission .footer .settlement {
  1317. background-color: #fff;
  1318. font-size: 30rpx;
  1319. color: #fff;
  1320. width: 240rpx;
  1321. height: 70rpx;
  1322. @include main_bg_color(theme);
  1323. border-radius: 50rpx;
  1324. text-align: center;
  1325. line-height: 70rpx;
  1326. }
  1327. .footer .transparent {
  1328. opacity: 0
  1329. }
  1330. /deep/ checkbox .uni-checkbox-input.uni-checkbox-input-checked {
  1331. @include main_bg_color(theme);
  1332. border: none !important;
  1333. color: #fff !important
  1334. }
  1335. /deep/ checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  1336. @include main_bg_color(theme);
  1337. border: none !important;
  1338. color: #fff !important;
  1339. margin-right: 0 !important;
  1340. }
  1341. // 切换
  1342. /deep/.uni-date-x--border {
  1343. border: 0;
  1344. }
  1345. /deep/.uni-icons {
  1346. font-size: 0 !important;
  1347. }
  1348. /deep/.uni-date-x {
  1349. color: #999;
  1350. font-size: 15px;
  1351. }
  1352. /deep/.uni-date__x-input {
  1353. font-size: 15px;
  1354. }
  1355. /deep/uni-checkbox[disabled] .uni-checkbox-input {
  1356. background-color: #eee;
  1357. }
  1358. .abs-lt .active-card {
  1359. &:after {
  1360. right: -67rpx;
  1361. }
  1362. }
  1363. .abs-rt .active-card {
  1364. &:after {
  1365. left: -67rpx;
  1366. -moz-transform: scaleX(-1);
  1367. -webkit-transform: scaleX(-1);
  1368. -o-transform: scaleX(-1);
  1369. transform: scaleX(-1);
  1370. }
  1371. }
  1372. .active-card {
  1373. &:after {
  1374. content: "";
  1375. width: 67rpx;
  1376. height: 76rpx;
  1377. background-image: url('../static/images/nav_circle_left.png');
  1378. background-size: contain;
  1379. background-repeat: no-repeat;
  1380. position: absolute;
  1381. bottom: 0;
  1382. z-index: 4;
  1383. }
  1384. }
  1385. .line {
  1386. width: 680rpx;
  1387. margin: auto;
  1388. height: 3rpx;
  1389. }
  1390. .line image {
  1391. width: 100%;
  1392. height: 100%;
  1393. display: block;
  1394. }
  1395. .address {
  1396. background-color: #fff;
  1397. box-sizing: border-box;
  1398. }
  1399. .footer .transparent {
  1400. opacity: 0
  1401. }
  1402. .w-322 {
  1403. width: 322rpx;
  1404. }
  1405. .w-450 {
  1406. width: 450rpx;
  1407. }
  1408. .w-50p {
  1409. width: 50%;
  1410. }
  1411. .h-auto {
  1412. height: auto;
  1413. }
  1414. .bd-r-14 {
  1415. border-radius: 14rpx 14rpx 0 0 !important;
  1416. }
  1417. .mt30 {
  1418. margin-top: 30rpx;
  1419. }
  1420. .bg-primary-light {
  1421. @include main_rgba_color(theme);
  1422. }
  1423. .rd-lt-24rpx {
  1424. border-radius: 24rpx 0 0 0;
  1425. }
  1426. .rd-rt-24rpx {
  1427. border-radius: 0 24rpx 0 0;
  1428. }
  1429. .z-2 {
  1430. z-index: 2;
  1431. }
  1432. .gold {
  1433. color: #DCA658;
  1434. }
  1435. .select-name {
  1436. max-width: 300rpx;
  1437. }
  1438. .font-color {
  1439. font-weight: 500 !important;
  1440. }
  1441. /deep/ .uni-popup__wrapper {
  1442. background: #FFFFFF;
  1443. border-radius: 32rpx;
  1444. }
  1445. .sh_popup-content {
  1446. padding: 40rpx;
  1447. .sh_popup_title {
  1448. font-weight: 500;
  1449. font-size: 32rpx;
  1450. color: #333333;
  1451. text-align: center;
  1452. }
  1453. .sh_popup_text {
  1454. font-weight: 400;
  1455. font-size: 30rpx;
  1456. color: #666666;
  1457. text-align: center;
  1458. margin-top: 36rpx;
  1459. }
  1460. .sh_popup_btn {
  1461. display: flex;
  1462. margin-top: 60rpx;
  1463. justify-content: space-between;
  1464. .btn {
  1465. width: 244rpx;
  1466. height: 72rpx;
  1467. border-radius: 50rpx;
  1468. text-align: center;
  1469. line-height: 72rpx;
  1470. }
  1471. .no_btn {
  1472. @include coupons_border_color(theme);
  1473. color: $theme-color;
  1474. margin-right: 32rpx;
  1475. }
  1476. .yes_btn {
  1477. @include main_bg_color(theme);
  1478. color: #FFFFFF;
  1479. }
  1480. }
  1481. }
  1482. .item-go {
  1483. display: flex;
  1484. position: relative;
  1485. width: 100%;
  1486. padding: 20rpx 0;
  1487. padding-left: 39rpx;
  1488. background: #FFFFFF;
  1489. border-radius: 15rpx;
  1490. border: 2rpx solid #D6D7DC;
  1491. .sjx {
  1492. position: absolute;
  1493. width: 0;
  1494. height: 0;
  1495. top: 0;
  1496. right: 0;
  1497. border-top: 60rpx solid $bg-color-primary;
  1498. border-left: 60rpx solid transparent;
  1499. }
  1500. .dg-icon {
  1501. position: absolute;
  1502. top: -5rpx;
  1503. right: 5rpx;
  1504. transform: rotate(14deg);
  1505. ::before {
  1506. content: '\2713';
  1507. color: #fff;
  1508. }
  1509. }
  1510. }
  1511. .item-go-avt {
  1512. position: relative;
  1513. color: #FF6702;
  1514. background: #FFECE0;
  1515. border-radius: 15rpx;
  1516. border: 2rpx solid #FF6702;
  1517. }
  1518. </style>