detail.vue 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933
  1. <!-- 砍价详情 -->
  2. <template>
  3. <!-- TODO @科举:按照项目的代码风格,调整下这个界面 -->
  4. <!-- TODO @科举:挪到 bargain/detail.vue 里 -->
  5. <!-- TODO @科举:尽量都迁移完;依赖数据的部分,通过直接在 state 写死状态,不用后端返回,跑通整个界面;不追求 100% 对,但是至少自己观感是 ok 的 -->
  6. <s-layout title='砍价详情'>
  7. <view class='bargain'>
  8. <!-- :class="startBargainUid !== userInfo.uid ? 'on' : ''" -->
  9. <view class="header">
  10. <navigator url="/pages/activity/bargainingList" hover-class="none">
  11. <view class="back" style='width: 234rpx;
  12. height: 54rpx;
  13. background: linear-gradient(233deg,#ffd169,#fe960f);
  14. opacity: 1;
  15. border-radius: 0 26rpx 26rpx 0;
  16. line-height: 54rpx;
  17. text-align: center;
  18. color: #6e3f00;
  19. font-size: 25rpx;'>
  20. <text class="iconfont icon-xiangzuo"></text> 返回砍价列表
  21. </view>
  22. </navigator>
  23. </view>
  24. <view class="pad30" style="padding-bottom: 30rpx;">
  25. <view class='wrapper'>
  26. <view class='pictxt acea-row row-between' @tap="goProduct"
  27. style='display:flex;box-sizing: border-box;'>
  28. <view class='pictrue'>
  29. <image :src='state.bargainInfo.picUrl' />
  30. </view>
  31. <view class='text acea-row row-column-around' style='margin-left: 10rpx;'>
  32. <view class='line1'>{{ state.bargainInfo.name }}</view>
  33. <view class="surplus">最低价:¥{{ fen2yuan(state.bargainInfo.bargainMinPrice) }}</view>
  34. <view class="surplus">剩余:{{ state.bargainInfo.stock }} {{state.bargainInfo.unitName}}</view>
  35. <view class='money font-color-red' style='color:red'>
  36. 当前: ¥ <text class='num'>{{ fen2yuan(state.buyPrice) }}</text>
  37. </view>
  38. <view class="acea-row" style='display:flex'
  39. v-if="state.bargainInfo.endTime > new Date().getTime() && state.bargainInfo.stock > 0">
  40. <s-count-down :tipText="' '" :bgColor="state.bgColor" :dayText="':'" :hourText="':'"
  41. :minuteText="':'" :secondText="' '" :datatime="state.bargainInfo.endTime / 1000"
  42. :isDay="true" />
  43. <text style="font-size: 22rpx;margin-left: 4rpx;line-height: 36rpx;">后结束</text>
  44. </view>
  45. <view v-else-if="state.bargainInfo.endTime <= new Date().getTime()">
  46. <view style="font-size: 22rpx;" @tap='currentBargainUser'>已结束</view>
  47. </view>
  48. <view v-else-if="state.bargainInfo.stock <= 0">
  49. <view style="font-size: 22rpx;" @tap='currentBargainUser'>已售罄</view>
  50. </view>
  51. </view>
  52. <text class="iconfont icon-jiantou iconfonts"></text>
  53. </view>
  54. </view>
  55. <!-- 砍价记录 -->
  56. <view class='title font-color acea-row row-center-wrapper'>
  57. <view class='pictrue'>
  58. <image src='../static/zuo2.png'></image>
  59. </view>
  60. <view class="tits">
  61. <view class='titleCon'>砍价记录</view>
  62. <view class="line"></view>
  63. </view>
  64. <view class='pictrue on'>
  65. <image src='../static/you2.png'></image>
  66. </view>
  67. </view>
  68. <view class='bargainGang borRadius14'>
  69. <view class='list' v-if="state.bargainUserHelpList.length > 0">
  70. <block v-for="(item, index) in state.bargainUserHelpList" :key='index'
  71. v-if="index < 3 || !state.couponsHidden">
  72. <view class='item acea-row row-between-wrapper'>
  73. <view class='pictxt acea-row row-between-wrapper'>
  74. <view class='pictrue'>
  75. <image :src='item.avatar' />
  76. </view>
  77. <view class='text'>
  78. <view class='name line1'>{{item.nickname}}</view>
  79. <view class='line1'>{{ formatDate(item.createTime) }}</view>
  80. </view>
  81. </view>
  82. <view class='money'>
  83. 已砍 <text class="font-color-red">{{ fen2yuan(item.reducePrice) }}</text>元
  84. </view>
  85. </view>
  86. </block>
  87. <view class="open acea-row row-center-wrapper" @click="openTap"
  88. v-if="state.bargainUserHelpList.length > 3">
  89. {{state.couponsHidden?'展开更多':'关闭展开'}}
  90. <text class="iconfont" :class='state.couponsHidden ? "icon-xiangxia":"icon-xiangshang"' />
  91. </view>
  92. </view>
  93. <view v-if="state.bargainUserHelpList.length === 0" class="contentNo">
  94. <text class="iconfont icon-xiaolian mr8"></text>
  95. 暂无助力记录
  96. </view>
  97. </view>
  98. </view>
  99. </view>
  100. </s-layout>
  101. </template>
  102. <script setup>
  103. import {
  104. computed,
  105. reactive
  106. } from 'vue';
  107. import sheep from '@/sheep';
  108. import _ from 'lodash';
  109. import {
  110. onLoad,
  111. onReachBottom
  112. } from '@dcloudio/uni-app';
  113. import {
  114. useDurationTime
  115. } from '@/sheep/hooks/useGoods';
  116. import {
  117. showShareModal
  118. } from '@/sheep/hooks/useModal';
  119. import {
  120. isEmpty
  121. } from 'lodash';
  122. const state = reactive({
  123. id: '',
  124. buyPrice: '',
  125. bargainInfo: {},
  126. bgColor: {
  127. 'bgColor': '#333333',
  128. 'Color': '#fff',
  129. 'width': '44rpx',
  130. 'timeTxtwidth': '16rpx',
  131. 'isDay': true
  132. },
  133. bargainUserHelpList: [],
  134. couponsHidden: true,
  135. });
  136. async function getBargainDetails() {
  137. let {
  138. data,
  139. code
  140. } = await sheep.$api.activity.getBargainActivityDetail({
  141. id: state.id
  142. })
  143. if (code == 0) {
  144. state.bargainInfo = data;
  145. state.buyPrice = state.bargainInfo.bargainFirstPrice;
  146. }
  147. }
  148. onLoad(function(options) {
  149. if (options.hasOwnProperty('id')) {
  150. options.id ? state.id = options.id : state.id = ''
  151. }
  152. getBargainDetails()
  153. })
  154. // 工具函数
  155. function fen2yuan(price) {
  156. return (price / 100.0).toFixed(2)
  157. }
  158. </script>
  159. <style lang="scss">
  160. page {
  161. background-color: red !important;
  162. }
  163. </style>
  164. <style lang="scss" scoped>
  165. .userEvaluation {
  166. i {
  167. display: inline-block;
  168. }
  169. }
  170. .go {
  171. color: #E93323;
  172. text-align: center;
  173. font-size: 28rpx;
  174. margin-top: 26rpx;
  175. .iconfont {
  176. font-size: 11px
  177. }
  178. }
  179. .poster-pop {
  180. width: 594rpx;
  181. height: 850rpx;
  182. position: fixed;
  183. left: 50%;
  184. transform: translateX(-50%);
  185. z-index: 999;
  186. top: 50%;
  187. margin-top: -466rpx;
  188. image {
  189. width: 100%;
  190. height: 100%;
  191. display: block;
  192. border-radius: 10rpx;
  193. }
  194. .close {
  195. text-align: center;
  196. margin-top: 55rpx;
  197. color: #fff;
  198. font-size: 52rpx;
  199. }
  200. .save-poster {
  201. background-color: #df2d0a;
  202. font-size: :22rpx;
  203. color: #fff;
  204. text-align: center;
  205. height: 76rpx;
  206. line-height: 76rpx;
  207. width: 100%;
  208. }
  209. .keep {
  210. color: #fff;
  211. text-align: center;
  212. font-size: 25rpx;
  213. margin-top: 25rpx;
  214. }
  215. }
  216. .canvas {
  217. position: fixed;
  218. opacity: 0;
  219. }
  220. .font_hui {
  221. color: #CCCCCC !important;
  222. }
  223. .bg_qian {
  224. background-color: #F5F5F5 !important;
  225. }
  226. .font-color-red {
  227. font-weight: 800;
  228. }
  229. .huiBtn {
  230. font-size: 30rpx;
  231. font-weight: bold;
  232. color: #fff;
  233. width: 630rpx;
  234. height: 80rpx;
  235. text-align: center;
  236. line-height: 80rpx;
  237. margin: 0 auto;
  238. background-color: #CCCCCC;
  239. box-shadow: 0 7rpx 0 #AAAAAA;
  240. border-radius: 40rpx;
  241. }
  242. .huifont {
  243. color: #CCCCCC;
  244. }
  245. .buyBox {
  246. margin-top: 40rpx;
  247. .on {
  248. width: 300rpx;
  249. height: 80rpx;
  250. border-radius: 40rpx;
  251. font-size: 32rpx;
  252. color: #fff;
  253. text-align: center;
  254. line-height: 80rpx;
  255. }
  256. .buyNow {
  257. background: linear-gradient(180deg, #FF8831 0%, #F11B09 100%);
  258. box-shadow: 0 7rpx 0 #C11100;
  259. }
  260. .buyMore {
  261. background: linear-gradient(180deg, #FFCA52 0%, #FE960F 100%);
  262. box-shadow: 0 7rpx 0 #D87A00;
  263. }
  264. }
  265. .mr8 {
  266. margin-right: 8rpx;
  267. }
  268. .contentNo {
  269. width: 100%;
  270. padding: 50rpx 15rpx;
  271. text-align: center;
  272. font-size: 26rpx;
  273. color: #AAAAAA;
  274. }
  275. .generate-posters {
  276. width: 100%;
  277. height: 170rpx;
  278. background-color: #fff;
  279. position: fixed;
  280. left: 0;
  281. bottom: 0;
  282. z-index: 388;
  283. transform: translate3d(0, 100%, 0);
  284. transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
  285. border-top: 1rpx solid #eee;
  286. }
  287. .generate-posters.on {
  288. transform: translate3d(0, 0, 0);
  289. }
  290. .generate-posters .item {
  291. flex: 1;
  292. text-align: center;
  293. font-size: 30rpx;
  294. }
  295. .generate-posters .item .iconfont {
  296. font-size: 80rpx;
  297. color: #5eae72;
  298. }
  299. .generate-posters .item .iconfont.icon-haibao {
  300. color: #5391f1;
  301. }
  302. .bargain .bargainGang {
  303. background-color: #fff;
  304. .list {
  305. padding: 50rpx 30rpx 0 30rpx;
  306. }
  307. .open {
  308. font-size: 24rpx;
  309. color: #999;
  310. margin-top: 30rpx;
  311. }
  312. .helpNo {
  313. text-align: center;
  314. font-size: 26rpx;
  315. color: #AAAAAA;
  316. }
  317. }
  318. .bargain .bargainGang .open .iconfont {
  319. font-size: 25rpx;
  320. margin: 5rpx 0 0 10rpx;
  321. }
  322. .bargain .icon-xiangzuo {
  323. font-size: 24rpx;
  324. margin-right: 6px;
  325. }
  326. .bargain .header {
  327. /* TODO 芋艿:此处原来采用base64 但是过长编辑到小程序卡死 目前采用网络地址 需解决 */
  328. background-image: url('https://huizhizao-1314830814.cos.ap-shanghai.myqcloud.com/huizhizao-1314830814/7e9bea1e8bbcd8a7a865a7703d65a1d0b25ec33a4b8d443698ff2e6eccf1300f.png');
  329. background-repeat: no-repeat;
  330. background-size: 100% 100%;
  331. width: 100%;
  332. height: 340rpx;
  333. margin: 0 auto;
  334. padding-top: 20rpx;
  335. .back {
  336. width: 235rpx;
  337. height: 54rpx;
  338. background: linear-gradient(233deg, #FFD169 0%, #FE960F 100%);
  339. opacity: 1;
  340. border-radius: 0px 27rpx 27rpx 0px;
  341. line-height: 54rpx;
  342. text-align: center;
  343. color: #6E3F00;
  344. font-size: 28rpx;
  345. }
  346. }
  347. .bargain .header .pictxt {
  348. margin: 330rpx auto 0 auto;
  349. font-size: 26rpx;
  350. color: #fff;
  351. }
  352. .bargain .header .pictxt .pictrue {
  353. width: 56rpx;
  354. height: 56rpx;
  355. margin-right: 30rpx;
  356. }
  357. .bargain .header .pictxt .pictrue image {
  358. width: 100%;
  359. height: 100%;
  360. border-radius: 50%;
  361. border: 2rpx solid #fff;
  362. }
  363. .bargain .header .pictxt .text {
  364. margin-left: 20rpx;
  365. }
  366. .bargain .header .pictxt .text text {
  367. margin-left: 20rpx;
  368. }
  369. .bargain .header .time {
  370. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAbgAAACmCAMAAACfv2reAAAAk1BMVEUAAAD/nSL/oCj/oCj/nSH/nSH/oCj/mhr/mhr/oCj/oCj/oCj/nSH/niT/mhr/mhr/oCj/mhr/oCj/oCj/mhr/niP/oCj/oCj/mhr/////oCj/mhr/nyT/w3f/rkf/rEL/pjT/tlr/xXv/uF3//vz/vmv/wXP/vWr/79r/1aD/05r/wXL/nB//5MH/+/X/t1r/5MP28hXaAAAAGXRSTlMABvndiVtUVPjkOC8Dk+DarKyQC+QH86amYv5b+wAAA6JJREFUeNrs3Nlu4kAQheEyGOywBkImcR8Sh7Avycz7P920G8l3MYtccko63wXc969GXuiS20XJ6ygF1SQdvyaRiL5kDKrZOBFtgxjID7tVRjVZ7Q45EA9EV4z5ntVqttqfEIuqBKevjGr3dUIiiqIZ9hkp2GMWiZ4Ocv5Oqljl6IieCQ4ZqThgInpG2GWkYoeR6EnBX0olK6SiB8hICSAlhjOE4YxiOKMYziiGM4rhjGI4o5TCIWA4PQhqzzcPGE4PMA9q3m0fAcPpKdfYk3o47z1gOD3Ae+A8qUfuLby/C4bTA5zXOPekHktvu11v12uG0wOc13jpybWi7ku75X6yOR43bwHD6QHegmK13U/+tF+6kZS6bVfls8RweoDPkqvS7pZ/lXTVNpvNkTtOW7nj/Gq7avFACrG7YOlt196W4fQA5zVeeu6CWLyu81rT3lP1VWWBV5WKgEVQeVX51Bu2nNcViR7890Of93EKVO7j+iFYJJ1iv/XlEj450QZ8BHJJv9hzHXn0n1M+q2ze9c8qpz7Zo7T9Z4+vdZoHyJV6Pllbin0XMVzzrg/37JO1xHl8kfoLAHIt5zHcb8FwRjGcUQxnFMMZdU84HrNq3jdSxXBjHmzUssPo9nA8Sty8Aya3h+Ph/caFw/s3h+O4jMbtMXtWDCcJTv8yqqQ/oKYMx5FQDSpHQumGGww5hK1e32EI23BwTziOPWzYOBFRDydRZ8JBo/VJR5NOJHeGI1MYziiGM4rhjGI4oxjOKIYziuGMYjijGM4ohjOK4YxiOKMYziiGM4rhjGI4oxjOKIYziuH+s0cHJAAAAACC/r9uR6AXnBI3JW5K3JS4KXFT4qbETYmbEjclbkrclLgpcVPipsRNiZsSNyVuStyUuClxU+KmxE2JmxI3JW5K3JS4KXFT4qbETYmbEjclbkrclLgpcVPipsRNiZsSNyVuStyUuClxU+KmxE2JmxI3JW5K3JS4KXFT4qbETYmbEjclbkrclLgpcVPipsRNiZsSNyVuStyUuClxtUdHJwzDUAxFZTs2xInBxLQf2n/QvrTQGSLQ+ZAGuKIcTpTDiXI4UQ4nyuFEOZwohxPlcKIcTpTDiXI4UQ4nyuFEOZwohxPlcKIcThQD3jEJJmSRzCixHSakkyyYsRdMyCA5UWPzAZNxZJIVaY/bXU7G8Q32AhpDvvqCPd7qIzM0hI0mZsPtHDQp48RPKzQZpeEv1Vky7fFymTXh9gGY1gZJcqJI8QAAAABJRU5ErkJggg==');
  371. background-repeat: no-repeat;
  372. background-size: 100% 100%;
  373. width: 440rpx;
  374. height: 166rpx;
  375. margin: 0 auto;
  376. font-size: 22rpx;
  377. text-align: center;
  378. padding-top: 11rpx;
  379. box-sizing: border-box;
  380. }
  381. .bargain .header .time .red {
  382. color: #fc4141;
  383. }
  384. .bargain .header .people {
  385. text-align: center;
  386. color: #fff;
  387. font-size: 20rpx;
  388. position: absolute;
  389. width: 85%;
  390. /* #ifdef MP */
  391. height: 44px;
  392. line-height: 44px;
  393. top: 40rpx;
  394. /* #endif */
  395. /* #ifdef H5 */
  396. top: 58rpx;
  397. /* #endif */
  398. }
  399. .bargain .header .time text {
  400. color: #333;
  401. }
  402. .bargain {
  403. .wrapper {
  404. margin-top: -100rpx;
  405. .pictxt {
  406. width: 100%;
  407. height: 260rpx;
  408. background-color: #FFF5E6;
  409. padding: 20rpx;
  410. border-radius: 14rpx;
  411. }
  412. .surplus {
  413. color: #999999;
  414. font-size: 22rpx;
  415. }
  416. }
  417. .content {
  418. width: 100%;
  419. height: auto;
  420. background-image: url('../static/zhuangshi.png');
  421. background-size: 100% 100%;
  422. background-color: #fff;
  423. border-bottom-left-radius: 14rpx;
  424. border-bottom-right-radius: 14rpx;
  425. padding: 40rpx 0 70rpx 0;
  426. .money {
  427. color: #333333;
  428. font-size: 36rpx;
  429. .price {}
  430. }
  431. }
  432. }
  433. .bargain .wrapper,
  434. {
  435. // background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAArIAAAF8CAYAAAAzc1jZAAAco0lEQVR4Xu3dW4zc513H4feddWynQU1FY69zKvZuysENPqx7SFFRU4JEi+ACCVUUiQsuqYQ4VIWCchEuoAIFqRdI5QrlgkNLqQpSJA5VSWkKqKK7DkKuqIQ3RnUTe40CJRSSNDt/ZEeF1LGTmdnffuP1PLntzPf3n2fm4tMoTnrzFwECBAgQIECAAIEdKNB34DN7ZAIECBAgQIAAAQJNyPoRECBAgAABAgQI7EgBIbsjvzYPTYAAAQIECBAgIGT9BggQIECAAAECBHakgJDdkV+bhyZAgAABAgQIEBCyfgMECBAgQIAAAQI7TuD8iaX3C9kd97V5YAIECBAgQIDA/AoMrfWNlUO/2frog0J2fn8HPjkBAgQIECBAYEcJDHfdtWfj5vHvt9Z//OKDC9kd9fV5WAIECBAgQIDAfApsHN73bW3vax8eenvnNwWE7Hz+FnxqAgQIECBAgMCOETj73be/ftdr9vx57/0tL35oIbtjvkIPSoAAAQIECBCYP4GzR26/Y/euvX819PY9l396ITt/vwefmAABAgQIECCwIwS+evdtd+7ac+MjrbXlKz2wkN0RX6OHJECAAAECBAjMl8CTxw4eHC0sfKa1tnS1Ty5k5+s34dMSIECAAAECBK55gSdOLL1h1Prne2t3vtzDCtlr/qv0gAQIECBAgACB+RG4+Ae7dr9m76NX+mdiL1cQsvPzu/BJCRAgQIAAAQLXtMC5I4s39Rtu+uvW+lsneVAhO4mS1xAgQIAAAQIECGyrwNDaro2V5Ydbbz806SEhO6mU1xEgQIAAAQIECGybwMbK0u8Nvf/0NAeE7DRaXkuAAAECBAgQIFAusHFi6UND6x+edljITivm9QQIECBAgAABAmUCF1aWfmTc2p+13kfTjgrZacW8ngABAgQIECBAoERg49jSG4eF/sXW2mtnGRSys6h5DwECBAgQIECAwJYETh1uu/fduPz3Q2srsw4J2VnlvI8AAQIECBAgQGBmgfPHlx9so/aBmQdaa0J2K3reS4AAAQIECBAgMLXAuZWD9/Q++nxrfWHqN7/oDUJ2K3reS4AAAQIECBAgMJXA0FrfWFn+Yuuz/yMF3zwoZKei92ICBAgQIECAAIGtCFw4tvST44X+B1vZELIVejYIECBAgAABAgSmEji/svx3rbe3T/Wmq7zY35GtULRBgAABAgQIECAwscCFo0vfubkwvre30duH3t7cW7974je/6IVCdhY17yFAgAABAgQIECgTePL4gX297b2v99G9rbd7W+vfNcm4kJ1EyWsIECBAgAABAgRiAufvPrTYb2jfP4zakdZGR/owvHPo/XWXP4CQjX0lDhEgQIAAAQIECMwiMLQ2unD0O44Ou0b39WF039CHt7bWv13IzqLpPQQIECBAgAABAq+qwLkTB98mZF/Vr8BxAgQIECBAgACBWQX6V+6448Y7z579n1kHvI8AAQIECBAgQIDAqyHQz60sf3bh61/70X1f/renX40HcJMAAQIECBAgQIDALAL9/InloQ3DF/ozT//g/i9d+K9ZRryHAAECBAgQIECAQFrghZC9+NcwPNqfefqHxWz6K3CPAAECBAgQIEBgFoH/D9kXavbT+1fX39Nb25xlzHsIECBAgAABAgQIpAQuC9mLf2N2+MiBtfVfSD2AOwQIECBAgAABAgRmEXhJyF4cGY0337fv5JmPzTLoPQQIECBAgAABAgQSAlcM2TYMX1/4xvjNt/zTmX9OPIQbBAgQIECAAAECBKYVuHLIttb6MPzDqbX173tXa89PO+r1BAgQIECAAAECBLZb4Kohe/HwMLRfP7B2+v7tfgj7BAgQIECAAAECBKYVeNmQbW3Y3BwPP3Dbycc/N+2w1xMgQIAAAQIECBDYToFXCNlLf1/2y//5tfWjb/yX9ux2PohtAgQIECBAgAABAtMITBCyl/4ZgwcW19Z/bZphryVAgAABAgQIECCwnQKThWxr3xi15+/Zt/qva9v5MLYJECBAgAABAgQITCowache/INfq59bO/229/qvfk1q63UECBAgQIAAAQLbKDBxyF56hvHw/sWT6x/dxucxTYAAAQIECBAgQGAigelCdhj+/blnn7vrzlNnn5po3YsIECBAgAABAgQIbJPAdCH7wr9b9ncOrJ3+2W16HrMECBAgQIAAAQIEJhKYOmR7a8+P2ub33rLqP187kbAXESBAgAABAgQIbIvADCE7fGW82T504LH1P9yWJzJKgAABAgQIECBAYAKBiUK2D+2r42H8yfG4f+LWf1z/297aMMG2lxAgQIAAAQIECBDYNoGXCdnhfBvaJ/swfHzfyccfFa/b9h0YJkCAAAEC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');
  436. // babackground-repeat: no-repeat;
  437. // background-size: 100% 100%;
  438. width: 100%;
  439. background-color: #fff;
  440. padding: 0 24rpx 10rpx 24rpx;
  441. box-sizing: border-box;
  442. }
  443. .bargain .pictxt .pictrue {
  444. width: 220rpx;
  445. height: 220rpx;
  446. position: relative;
  447. }
  448. .bargain .pictxt .pictrue image {
  449. width: 100%;
  450. height: 100%;
  451. border-radius: 6rpx;
  452. }
  453. .bargain .pictxt .text {
  454. font-size: 30rpx;
  455. color: #333333;
  456. .line1 {
  457. width: 324rpx;
  458. }
  459. }
  460. .bargain .pictxt .text .money {
  461. font-weight: bold;
  462. font-size: 24rpx;
  463. }
  464. .bargain .pictxt .text .money .num {
  465. font-size: 36rpx;
  466. }
  467. .bargain .pictxt .text .successNum {
  468. font-size: 22rpx;
  469. color: #999;
  470. }
  471. .bargain .cu-progress {
  472. overflow: hidden;
  473. height: 12rpx;
  474. background-color: #FDEAE8;
  475. width: 560rpx;
  476. height: 20rpx;
  477. border-radius: 20rpx;
  478. margin: 20rpx auto;
  479. }
  480. .bargain .cu-progress .bg-red {
  481. width: 0;
  482. height: 100%;
  483. transition: width 0.6s ease;
  484. border-radius: 20rpx;
  485. background-image: linear-gradient(to right, #ffa363 0%, #e93323 100%);
  486. }
  487. .bargain .money {
  488. // font-size: 22rpx;
  489. // color: #999;
  490. // margin-top: 40rpx;
  491. }
  492. .bargain .bargainSuccess {
  493. font-size: 26rpx;
  494. color: #333333;
  495. text-align: center;
  496. display: flex;
  497. justify-content: center;
  498. align-items: center;
  499. margin-bottom: 40rpx;
  500. image {
  501. width: 48rpx;
  502. height: 62rpx;
  503. margin-right: 18rpx;
  504. }
  505. }
  506. .bargain .bargainSuccess .iconfont {
  507. font-size: 45rpx;
  508. color: #54c762;
  509. padding-right: 18rpx;
  510. vertical-align: -5rpx;
  511. }
  512. .bargain .bargainBnt {
  513. font-size: 30rpx;
  514. font-weight: bold;
  515. color: #fff;
  516. width: 630rpx;
  517. height: 80rpx;
  518. background-image: url('../static/btn.png');
  519. background-size: 100% 100%;
  520. // border-radius: 40rpx;
  521. // background: linear-gradient(180deg, #FF8831 0%, #F11B09 100%);
  522. text-align: center;
  523. line-height: 80rpx;
  524. margin: 0 auto;
  525. }
  526. .bargain .bargainBnt.on {
  527. border: 2rpx solid red;
  528. color: red;
  529. background-image: linear-gradient(to right, #fff 0%, #fff 100%);
  530. width: 596rpx;
  531. height: 76rpx;
  532. }
  533. .bargain .bargainBnt.grey {
  534. color: #fff;
  535. background-image: linear-gradient(to right, #bbbbbb 0%, #bbbbbb 100%);
  536. }
  537. .bargain .tip {
  538. font-size: 22rpx;
  539. color: #999;
  540. text-align: center;
  541. margin-top: 20rpx;
  542. margin-bottom: 50rpx;
  543. }
  544. .bargain .lock,
  545. .bargain .bargainGang .lock,
  546. .bargain .goodsDetails .lock {
  547. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiQAAABCCAYAAABnwc0eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo4YmQzMTQ1Ny01MGY2LWFmNDMtYmY4Yi1kNWRjZTMxZDg5MTUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6M0RCMkU3QUEzQzBCMTFFOUI2N0VEOEJBMDUwMTU2ODMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6M0RCMkU3QTkzQzBCMTFFOUI2N0VEOEJBMDUwMTU2ODMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NDRmMWQxNmItZTIxMC1lYzQwLWJmODYtYzE4OWRiYzNmOGYyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjhiZDMxNDU3LTUwZjYtYWY0My1iZjhiLWQ1ZGNlMzFkODkxNSIv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');
  548. background-repeat: no-repeat;
  549. background-size: 100% 100%;
  550. width: 548rpx;
  551. height: 66rpx;
  552. position: absolute;
  553. left: 50%;
  554. transform: translateX(-50%);
  555. bottom: -43rpx;
  556. z-index: 5;
  557. }
  558. .bargain .title {
  559. font-size: 40rpx;
  560. font-weight: 600;
  561. // height: 80rpx;
  562. // margin-top: 30rpx;
  563. }
  564. .bargain .title .pictrue {
  565. width: 60rpx;
  566. height: 60rpx;
  567. }
  568. .bargain .title .pictrue.on,
  569. .bargain .title .pictrue.on {
  570. transform: rotate(180deg);
  571. }
  572. .bargain .title .pictrue image,
  573. .bargain .title .pictrue image {
  574. width: 100%;
  575. height: 100%;
  576. display: block;
  577. }
  578. .bargain .title .tits {
  579. margin: 50rpx 15rpx 40rpx 15rpx;
  580. }
  581. .bargain .title .titleCon {
  582. margin: 0 10rpx -14rpx 10rpx;
  583. color: #fff;
  584. border: 16rpx solid linear-gradient(0deg, #FFD136 0%, rgba(255, 213, 72, 0.12) 100%);
  585. ;
  586. }
  587. .bargain .title .line {
  588. // width: 216rpx;
  589. height: 16rpx;
  590. background: linear-gradient(0deg, #FFD136 0%, rgba(255, 213, 72, 0.12) 100%);
  591. opacity: 0.6;
  592. }
  593. .bargain .bargainGang .list .item {
  594. padding-bottom: 50rpx;
  595. }
  596. .bargain .bargainGang .list .item .pictxt {
  597. // width: 310rpx;
  598. .num {
  599. width: 28rpx;
  600. height: 36rpx;
  601. // image{
  602. // width: 100%;
  603. // height: 100%;
  604. // }
  605. }
  606. .num1 {
  607. background-image: url(../static/n1.png);
  608. background-repeat: no-repeat;
  609. background-size: 100% 100%;
  610. }
  611. .num2 {
  612. background-image: url(../static/n2.png);
  613. background-repeat: no-repeat;
  614. background-size: 100% 100%;
  615. }
  616. .num3 {
  617. background-image: url(../static/n3.png);
  618. background-repeat: no-repeat;
  619. background-size: 100% 100%;
  620. }
  621. }
  622. .bargain .bargainGang .list .item .pictxt .pictrue {
  623. width: 70rpx;
  624. height: 70rpx;
  625. margin-right: 14rpx;
  626. }
  627. .bargain .bargainGang .list .item .pictxt .pictrue image {
  628. width: 100%;
  629. height: 100%;
  630. border-radius: 50%;
  631. }
  632. .bargain .bargainGang .list .item .pictxt .text {
  633. width: 225rpx;
  634. font-size: 20rpx;
  635. color: #999;
  636. }
  637. .bargain .bargainGang .list .item .pictxt .text .name {
  638. font-size: 25rpx;
  639. color: #333333;
  640. margin-bottom: 7rpx;
  641. }
  642. .bargain .bargainGang .list .item .money {
  643. font-size: 25rpx;
  644. color: #999999;
  645. }
  646. .bargain .bargainGang .list .item .money .iconfont {
  647. font-size: 35rpx;
  648. vertical-align: middle;
  649. margin-right: 10rpx;
  650. }
  651. .bargain .bargainGang .load {
  652. font-size: 24rpx;
  653. text-align: center;
  654. line-height: 80rpx;
  655. height: 80rpx;
  656. }
  657. .bargain .goodsDetails {
  658. width: 100%;
  659. background-color: #fff;
  660. //margin: 13rpx auto 0 auto;
  661. }
  662. .bargain .goodsDetails~.goodsDetails {
  663. margin-bottom: 50rpx;
  664. }
  665. .bargain .goodsDetails .conter {
  666. // margin-top: 20rpx;
  667. overflow: hidden;
  668. }
  669. .bargain .goodsDetails .conter image {
  670. width: 100% !important;
  671. display: block !important;
  672. }
  673. .bargain .bargainTip {
  674. position: fixed;
  675. top: 50%;
  676. left: 50%;
  677. width: 500rpx;
  678. height: 469rpx;
  679. margin-left: -246rpx;
  680. z-index: 111;
  681. border-radius: 14rpx;
  682. background-color: #fff;
  683. transition: all 0.3s ease-in-out 0s;
  684. opacity: 0;
  685. transform: scale(0);
  686. padding-bottom: 60rpx;
  687. margin-top: -330rpx;
  688. background: linear-gradient(180deg, #FFFFFF 0%, #FFEEEB 100%);
  689. .cu-progress {
  690. width: 410rpx;
  691. margin: 0 auto;
  692. }
  693. .t1 {
  694. text-align: center;
  695. color: #666666;
  696. font-size: 24rpx;
  697. margin: 20rpx 0 54rpx 0;
  698. }
  699. .bubbleBox {
  700. width: 410rpx;
  701. margin: 16rpx auto;
  702. .bubble {
  703. position: relative;
  704. display: inline-block;
  705. text {
  706. display: inline-block;
  707. font-size: 22rpx;
  708. padding: 2rpx 8rpx;
  709. border-radius: 30rpx;
  710. background-color: #E93323;
  711. color: #fff;
  712. }
  713. text::before {
  714. content: '';
  715. width: 0;
  716. height: 32rpx;
  717. border: 14rpx solid;
  718. position: absolute;
  719. bottom: -54rpx;
  720. left: 14rpx;
  721. border-color: #E93323 transparent transparent;
  722. }
  723. }
  724. }
  725. }
  726. .bargain .bargainTip.on {
  727. opacity: 1;
  728. transform: scale(1);
  729. }
  730. .bargain .bargainTip .pictrue {
  731. width: 500rpx;
  732. height: 200rpx;
  733. margin-top: -118rpx;
  734. }
  735. .bargain .bargainTip .pictrue image {
  736. width: 100%;
  737. height: 100%;
  738. }
  739. .bargain .bargainTip .cutOff {
  740. font-size: 32rpx;
  741. color: #333;
  742. text-align: center;
  743. margin: 12rpx 0 0rpx 0;
  744. font-weight: 600;
  745. text {
  746. font-weight: 600;
  747. font-size: 44rpx;
  748. }
  749. }
  750. .bargain .bargainTip .cutOff.on {
  751. margin-top: 26rpx;
  752. }
  753. .bargain .bargainTip .help {
  754. font-size: 32rpx;
  755. font-weight: bold;
  756. text-align: center;
  757. margin-top: 40rpx;
  758. }
  759. .bargain .bargainTip .tipBnt {
  760. font-size: 32rpx;
  761. color: #fff;
  762. width: 360rpx;
  763. height: 82rpx;
  764. border-radius: 41rpx;
  765. background-image: linear-gradient(to right, #f67a38 0%, #f11b09 100%);
  766. text-align: center;
  767. line-height: 82rpx;
  768. margin: 0 auto;
  769. }
  770. .bargain_view {
  771. width: 180rpx;
  772. height: 48rpx;
  773. background: rgba(0, 0, 0, 0.5);
  774. opacity: 1;
  775. border-radius: 0 0 6rpx 6rpx;
  776. position: absolute;
  777. bottom: 0;
  778. font-size: 22rpx;
  779. color: #fff;
  780. text-align: center;
  781. line-height: 48rpx;
  782. }
  783. .iconfonts {
  784. font-size: 22rpx !important;
  785. line-height: 220rpx;
  786. }
  787. .wxParse-div {
  788. width: auto !important;
  789. height: auto !important;
  790. }
  791. .bargain .mask {
  792. z-index: 100;
  793. }
  794. .share-box {
  795. z-index: 1000;
  796. position: fixed;
  797. left: 0;
  798. top: 0;
  799. width: 100%;
  800. height: 100%;
  801. image {
  802. width: 100%;
  803. height: 100%;
  804. }
  805. }
  806. </style>