index.vue 45 KB

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