index.vue 72 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125
  1. <template>
  2. <view class="product-con">
  3. <view class="head-wrapper" :style="'top:' + statusBarHeight">
  4. <view class="head-menu">
  5. <view class="iconfont icon-xiangzuo" @click="returns"></view>
  6. <view class="iconfont icon-shouye4" @click="goHome"></view>
  7. </view>
  8. </view>
  9. <view v-if="storeInfo && storeInfo.merchant">
  10. <scroll-view :scroll-top="scrollTop" scroll-y="true" scroll-with-animation="true" :style="'height:' + height + 'px;'" @scroll="scroll">
  11. <view id="past0">
  12. <productConSwiper :imgUrls="storeInfo.slider_image" :videoCoverImg="videoCoverImg" :videoline="storeInfo.video_link"></productConSwiper>
  13. <view class="wrapper">
  14. <view class="share acea-row row-between row-bottom">
  15. <!-- #ifndef MP-TOUTIAO -->
  16. <view class="money font-color">
  17. <text class="num">{{ storeInfo.price }}</text>
  18. <text class="vip-money" v-if="storeInfo.vip_price && storeInfo.vip_price > 0">¥{{ storeInfo.vip_price }}</text>
  19. <image v-if="storeInfo.vip_price && storeInfo.vip_price > 0" src="/static/images/vip.png"></image>
  20. </view>
  21. <!-- #endif -->
  22. <!-- #ifdef MP-TOUTIAO -->
  23. <view class="money font-color" v-if="power">
  24. <text class="num">{{ storeInfo.price }}</text>
  25. <text class="vip-money" v-if="storeInfo.vip_price && storeInfo.vip_price > 0">¥{{ storeInfo.vip_price }}</text>
  26. <image v-if="storeInfo.vip_price && storeInfo.vip_price > 0" src="/static/images/vip.png"></image>
  27. </view>
  28. <!-- #endif -->
  29. <view class="iconfont icon-fenxiang" @click="listenerActionSheet"></view>
  30. </view>
  31. <view class="introduce">
  32. <text v-if="storeInfo.merchant.is_trader" class="font-bg-red bg">自营</text>
  33. {{ storeInfo.store_name ? storeInfo.store_name : '' }}
  34. </view>
  35. <view class="label acea-row row-between-wrapper" :style="{ 'padding-bottom': coupon.list.length ? 0 : 10 + 'px' }">
  36. <!-- #ifndef MP-TOUTIAO -->
  37. <view>原价:¥{{ storeInfo.ot_price ? storeInfo.ot_price : '' }}</view>
  38. <!-- #endif -->
  39. <!-- #ifdef MP-TOUTIAO -->
  40. <view v-if="power">原价:¥{{ storeInfo.ot_price ? storeInfo.ot_price : '' }}</view>
  41. <!-- #endif -->
  42. <view>库存:{{ storeInfo.stock ? storeInfo.stock : 0 }}{{ storeInfo.unit_name ? storeInfo.unit_name : '' }}</view>
  43. <view>销量:{{ storeInfo.sales ? storeInfo.sales : 0 }}{{ storeInfo.unit_name ? storeInfo.unit_name : '' }}</view>
  44. </view>
  45. <!-- <view class='coupon acea-row row-between-wrapper' v-if="storeInfo.give_integral > 0">
  46. <view class='hide line1 acea-row'>
  47. 赠积分:
  48. <view class='activity'>赠送 {{storeInfo.give_integral}} 积分</view>
  49. </view>
  50. </view> -->
  51. <view class="coupon acea-row row-between-wrapper" @click="couponTap" style="margin-top: 20rpx;" v-if="coupon.list.length">
  52. <view class="hide line1 acea-row">
  53. 优惠券:
  54. <view class="activity" v-for="(item, index) in coupon.list" :key="index">满{{ item.use_min_price }}减{{ item.coupon_price }}</view>
  55. </view>
  56. <view class="iconfont icon-jiantou"></view>
  57. </view>
  58. <view class="coupon acea-row row-between-wrapper" v-if="activity.length">
  59. <view class="line1 acea-row">
  60. <text>活&nbsp;&nbsp;&nbsp;动:</text>
  61. <view v-for="(item, index) in activity" :key="index" @click="goActivity(item)">
  62. <view
  63. v-if="item.type === '1'"
  64. :class="index == 0 ? 'activity_pin' : '' || index == 1 ? 'activity_miao' : '' || index == 2 ? 'activity_kan' : ''"
  65. >
  66. <text class="iconfonts iconfont icon-pintuan"></text>
  67. <text class="activity_title">参与秒杀</text>
  68. </view>
  69. <view
  70. :class="index == 0 ? 'activity_pin' : '' || index == 1 ? 'activity_miao' : '' || index == 2 ? 'activity_kan' : ''"
  71. v-if="item.type === '2'"
  72. >
  73. <text class="iconfonts iconfont icon-shenhezhong"></text>
  74. <text class="activity_title">参与砍价</text>
  75. </view>
  76. <view
  77. :class="index == 0 ? 'activity_pin' : '' || index == 1 ? 'activity_miao' : '' || index == 2 ? 'activity_kan' : ''"
  78. v-if="item.type === '3'"
  79. >
  80. <text class="iconfonts iconfont icon-kanjia"></text>
  81. <text class="activity_title">参与拼团</text>
  82. </view>
  83. </view>
  84. </view>
  85. </view>
  86. </view>
  87. <!-- #ifndef MP-TOUTIAO -->
  88. <view class="attribute acea-row row-between-wrapper" @click="selecAttr">
  89. <view class="acea-row row-between-wrapper">
  90. {{ attrTxt }}:
  91. <text class="atterTxt">{{ attrValue }}</text>
  92. </view>
  93. <view class="iconfont icon-jiantou"></view>
  94. </view>
  95. <!-- #endif -->
  96. <!-- #ifdef MP-TOUTIAO -->
  97. <view class="attribute acea-row row-between-wrapper" @click="selecAttr" v-if="power">
  98. <view class="acea-row row-between-wrapper">
  99. {{ attrTxt }}:
  100. <text class="atterTxt">{{ attrValue }}</text>
  101. </view>
  102. <view class="iconfont icon-jiantou"></view>
  103. </view>
  104. <!-- #endif -->
  105. </view>
  106. <!-- #ifdef MP-TOUTIAO -->
  107. <view class="userEvaluation" id="past1" v-if="replyCount > 0 && power">
  108. <view class="title acea-row row-between-wrapper">
  109. <view>用户评价({{ replyCount }})</view>
  110. <navigator class="praise" hover-class="none" :url="'/pages/users/goods_comment_list/index?product_id=' + id">
  111. <text class="font-color">{{ replyChance }}</text>
  112. 好评率
  113. <text class="iconfont icon-jiantou"></text>
  114. </navigator>
  115. </view>
  116. <block v-if="replyCount > 0"><userEvaluation :reply="reply"></userEvaluation></block>
  117. </view>
  118. <!-- #endif -->
  119. <!-- #ifndef MP-TOUTIAO -->
  120. <view class="userEvaluation" id="past1" v-if="replyCount > 0">
  121. <view class="title acea-row row-between-wrapper">
  122. <view>用户评价({{ replyCount }})</view>
  123. <navigator class="praise" hover-class="none" :url="'/pages/users/goods_comment_list/index?product_id=' + id">
  124. <text class="font-color">{{ replyChance }}</text>
  125. 好评率
  126. <text class="iconfont icon-jiantou"></text>
  127. </navigator>
  128. </view>
  129. <block v-if="replyCount > 0"><userEvaluation :reply="reply"></userEvaluation></block>
  130. </view>
  131. <!-- #endif -->
  132. <!-- 商铺信息 -->
  133. <!-- #ifndef MP-TOUTIAO -->
  134. <view class="store-wrapper" v-if="storeInfo.merchant && hide_mer_status != 1">
  135. <view class="store-hd">
  136. <view class="store-info">
  137. <view class="logo"><image :src="storeInfo.merchant.mer_avatar" mode=""></image></view>
  138. <view class="info">
  139. <view class="name">
  140. {{ storeInfo.merchant.mer_name ? storeInfo.merchant.mer_name : '' }}
  141. <text v-if="storeInfo.merchant.is_trader" class="font-bg-red ml8">自营</text>
  142. </view>
  143. <view class="txt">{{ storeInfo.merchant.care_count ? storeInfo.merchant.care_count : 0 }}人关注</view>
  144. </view>
  145. <navigator v-if="hide_mer_status != 1" :url="'/pages/store/home/index?id=' + storeInfo.merchant.mer_id" class="link" hover-class="none">进店</navigator>
  146. </view>
  147. <view class="score-wrapper">
  148. <view class="item">
  149. 商品描述
  150. <text>{{ storeInfo.merchant.product_score }}</text>
  151. </view>
  152. <view class="item">
  153. 卖家服务
  154. <text>{{ storeInfo.merchant.service_score }}</text>
  155. </view>
  156. <view class="item">
  157. 物流服务
  158. <text>{{ storeInfo.merchant.postage_score }}</text>
  159. </view>
  160. </view>
  161. </view>
  162. <view v-if="storeInfo.merchant.recommend && storeInfo.merchant.recommend.length > 0" class="con-box">
  163. <view class="title">店铺推荐</view>
  164. <view class="img-box">
  165. <view class="img-item" v-for="(item, index) in storeInfo.merchant.recommend" :key="index" @click="goProDetail(item)">
  166. <image :src="item.image" mode=""></image>
  167. <view class="txt">
  168. <view class="title line1">{{ item.store_name }}</view>
  169. <view class="price">
  170. <text>¥</text>
  171. {{ item.price }}
  172. </view>
  173. </view>
  174. </view>
  175. </view>
  176. </view>
  177. </view>
  178. <!-- #endif -->
  179. <!-- #ifdef MP-TOUTIAO -->
  180. <view class="store-wrapper" v-if="storeInfo.merchant && hide_mer_status != 1 && power">
  181. <view class="store-hd">
  182. <view class="store-info">
  183. <view class="logo"><image :src="storeInfo.merchant.mer_avatar" mode=""></image></view>
  184. <view class="info">
  185. <view class="name">
  186. {{ storeInfo.merchant.mer_name ? storeInfo.merchant.mer_name : '' }}
  187. <text v-if="storeInfo.merchant.is_trader" class="font-bg-red ml8">自营</text>
  188. </view>
  189. <view class="txt">{{ storeInfo.merchant.care_count ? storeInfo.merchant.care_count : 0 }}人关注</view>
  190. </view>
  191. <navigator v-if="hide_mer_status != 1" :url="'/pages/store/home/index?id=' + storeInfo.merchant.mer_id" class="link" hover-class="none">进店</navigator>
  192. </view>
  193. <view class="score-wrapper">
  194. <view class="item">
  195. 商品描述
  196. <text>{{ storeInfo.merchant.product_score }}</text>
  197. </view>
  198. <view class="item">
  199. 卖家服务
  200. <text>{{ storeInfo.merchant.service_score }}</text>
  201. </view>
  202. <view class="item">
  203. 物流服务
  204. <text>{{ storeInfo.merchant.postage_score }}</text>
  205. </view>
  206. </view>
  207. </view>
  208. <view v-if="storeInfo.merchant.recommend && storeInfo.merchant.recommend.length > 0" class="con-box">
  209. <view class="title">店铺推荐</view>
  210. <view class="img-box">
  211. <view class="img-item" v-for="(item, index) in storeInfo.merchant.recommend" :key="index" @click="goProDetail(item)">
  212. <image :src="item.image" mode=""></image>
  213. <view class="txt">
  214. <view class="title line1">{{ item.store_name }}</view>
  215. <view class="price">
  216. <text>¥</text>
  217. {{ item.price }}
  218. </view>
  219. </view>
  220. </view>
  221. </view>
  222. </view>
  223. </view>
  224. <!-- #endif -->
  225. <view class="product-intro" id="past3">
  226. <view class="title">产品介绍</view>
  227. <view class="conter" v-if="description">
  228. <jyf-parser :domain="domain" :html="description.content.replace(/<br\/>/gi, '')" ref="article" :tag-style="tagStyle"></jyf-parser>
  229. </view>
  230. </view>
  231. <view style="height:120rpx;"></view>
  232. </scroll-view>
  233. </view>
  234. <view class="footer acea-row row-between-wrapper">
  235. <view class="item" @click="couponTap2">
  236. <view class="iconfont icon-kefu"></view>
  237. <view>客服</view>
  238. </view>
  239. <view @click="setCollect" class="item">
  240. <view class="iconfont icon-shoucang1" v-if="storeInfo.isRelation"></view>
  241. <view class="iconfont icon-shoucang" v-else></view>
  242. <view>收藏</view>
  243. </view>
  244. <!-- #ifndef MP-TOUTIAO -->
  245. <navigator open-type="switchTab" class="animated item" :class="animated == true ? 'bounceIn' : ''" url="/pages/order_addcart/order_addcart" hover-class="none">
  246. <view class="iconfont icon-gouwuche1">
  247. <text v-if="CartCount > 0" class="num bg-color">{{ CartCount || 0 }}</text>
  248. </view>
  249. <view>购物车</view>
  250. </navigator>
  251. <view v-if="attr.productSelect.stock != 0" class="bnt acea-row">
  252. <form @submit="joinCart" report-submit="true"><button class="joinCart bnts" form-type="submit">加入购物车</button></form>
  253. <form @submit="goBuy" report-submit="true" v-if="attr.productSelect">
  254. <button class="buy bnts" form-type="submit" :disabled="attr.productSelect.stock == 0">立即购买</button>
  255. </form>
  256. </view>
  257. <view v-else class="bnt acea-row">
  258. <form report-submit="true"><button class="buy bnts sold_out" form-type="submit" disabled>商品已售罄</button></form>
  259. </view>
  260. <!-- #endif -->
  261. <!-- #ifdef MP-TOUTIAO -->
  262. <template v-if="power">
  263. <navigator open-type="switchTab" class="animated item" :class="animated == true ? 'bounceIn' : ''" url="/pages/order_addcart/order_addcart" hover-class="none">
  264. <view class="iconfont icon-gouwuche1">
  265. <text v-if="CartCount > 0" class="num bg-color">{{ CartCount || 0 }}</text>
  266. </view>
  267. <view>购物车</view>
  268. </navigator>
  269. <view v-if="attr.productSelect.stock != 0" class="bnt acea-row">
  270. <form @submit="joinCart" report-submit="true"><button class="joinCart bnts" form-type="submit">加入购物车</button></form>
  271. <form @submit="goBuy" report-submit="true" v-if="attr.productSelect">
  272. <button class="buy bnts" form-type="submit" :disabled="attr.productSelect.stock == 0">立即购买</button>
  273. </form>
  274. </view>
  275. <view v-else class="bnt acea-row">
  276. <form report-submit="true"><button class="buy bnts sold_out" form-type="submit" disabled>商品已售罄</button></form>
  277. </view>
  278. </template>
  279. <!-- #endif -->
  280. </view>
  281. <block v-if="sharePacket.max && sharePacket.min">
  282. <shareRedPackets
  283. :sharePacket="sharePacket"
  284. @listenerActionSheet="listenerActionSheet"
  285. @closeChange="closeChange"
  286. :showAnimate="showAnimate"
  287. @boxStatus="boxStatus"
  288. ></shareRedPackets>
  289. </block>
  290. <!-- 组件 -->
  291. <productWindow
  292. :attr="attr"
  293. :isShow="1"
  294. :iSplus="1"
  295. @myevent="onMyEvent"
  296. @ChangeAttr="ChangeAttr"
  297. @ChangeCartNum="ChangeCartNum"
  298. @attrVal="attrVal"
  299. @iptCartNum="iptCartNum"
  300. id="product-window"
  301. ></productWindow>
  302. <block v-if="coupon.coupon">
  303. <couponListWindow :coupon="coupon" @ChangCouponsClone="ChangCouponsClone" @ChangCoupons="ChangCoupons" @ChangCouponsUseState="ChangCouponsUseState"></couponListWindow>
  304. </block>
  305. <!-- 分享按钮 -->
  306. <view class="generate-posters acea-row row-middle" :class="posters ? 'on' : ''">
  307. <!-- #ifndef MP -->
  308. <button class="item" hover-class="none" v-if="weixinStatus === true" @click="H5ShareBox = true">
  309. <view class="iconfont icon-weixin3"></view>
  310. <view class="">发送给朋友</view>
  311. </button>
  312. <!-- #endif -->
  313. <!-- #ifdef MP -->
  314. <button class="item" open-type="share" hover-class="none" @click="goFriend">
  315. <view class="iconfont icon-weixin3"></view>
  316. <view class="">发送给朋友</view>
  317. </button>
  318. <!-- #endif -->
  319. <button class="item" hover-class="none" @click="goPoster">
  320. <view class="iconfont icon-haibao"></view>
  321. <view class="">生成海报</view>
  322. </button>
  323. </view>
  324. <view class="mask" v-if="posters" @click="listenerActionClose"></view>
  325. <!-- #ifdef MP -->
  326. <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
  327. <!-- #endif -->
  328. <!-- 海报展示 -->
  329. <view class="poster-pop" v-if="posterImageStatus">
  330. <image src="../../static/images/poster-close.png" class="close" @click="posterImageClose"></image>
  331. <image :src="posterImage"></image>
  332. <!-- #ifndef H5 -->
  333. <view class="save-poster" @click="savePosterPath">保存到手机</view>
  334. <!-- #endif -->
  335. <!-- #ifdef H5 -->
  336. <view class="keep">长按图片可以保存到手机</view>
  337. <!-- #endif -->
  338. </view>
  339. <view class="mask" v-if="posterImageStatus"></view>
  340. <canvas class="canvas" canvas-id="myCanvas" v-if="canvasStatus"></canvas>
  341. <!-- 发送给朋友图片 -->
  342. <view class="share-box" v-if="H5ShareBox"><image src="/static/images/share-info.png" @click="H5ShareBox = false"></image></view>
  343. </view>
  344. </template>
  345. <script>
  346. var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
  347. import { getconfig } from '@/api/public.js';
  348. import { getProductDetail, getProductCode, collectAdd, collectDel, postCartAdd } from '@/api/store.js';
  349. import { getUserInfo, userShare, imgToBase } from '@/api/user.js';
  350. import { getCoupons, getShopCoupons, getPower } from '@/api/api.js';
  351. import { getCartCounts } from '@/api/order.js';
  352. import { toLogin } from '@/libs/login.js';
  353. import { mapGetters } from 'vuex';
  354. import { imageBase64 } from '@/api/public';
  355. import productConSwiper from '@/components/productConSwiper';
  356. import couponListWindow from '@/components/couponListWindow';
  357. import productWindow from '@/components/productWindow';
  358. import userEvaluation from '@/components/userEvaluation';
  359. import shareRedPackets from '@/components/shareRedPackets';
  360. import { HTTP_REQUEST_URL } from '@/config/app';
  361. import home from '@/components/home';
  362. import { silenceBindingSpread } from '@/utils';
  363. import parser from '@/components/jyf-parser/jyf-parser';
  364. // #ifdef MP
  365. import authorize from '@/components/Authorize';
  366. // #endif
  367. import history from '@/mixins/history';
  368. import shareScence from '@/libs/spread';
  369. let app = getApp();
  370. export default {
  371. components: {
  372. productConSwiper,
  373. couponListWindow,
  374. productWindow,
  375. userEvaluation,
  376. shareRedPackets,
  377. home,
  378. 'jyf-parser': parser,
  379. // #ifdef MP
  380. authorize
  381. // #endif
  382. },
  383. mixins: [history],
  384. data() {
  385. let that = this;
  386. return {
  387. statusBarHeight: statusBarHeight, //系统导航条高度
  388. //属性是否打开
  389. coupon: {
  390. coupon: false,
  391. list: []
  392. },
  393. attrTxt: '请选择', //属性页面提示
  394. attrValue: '', //已选属性
  395. animated: false, //购物车动画
  396. id: 0, //商品id
  397. replyCount: 0, //总评论数量
  398. reply: [], //评论列表
  399. storeInfo: {
  400. merchant: {}
  401. }, //商品详情
  402. productValue: [], //系统属性
  403. couponList: [], //优惠券
  404. cart_num: 1, //购买数量
  405. isAuto: false, //没有授权的不会自动授权
  406. isShowAuth: false, //是否隐藏授权
  407. isOpen: false, //是否打开属性组件
  408. actionSheetHidden: true,
  409. posterImageStatus: false,
  410. storeImage: '', //海报产品图
  411. PromotionCode: '', //二维码图片
  412. canvasStatus: false, //海报绘图标签
  413. posterImage: '', //海报路径
  414. posterbackgd: '/static/images/posterbackgd.png',
  415. source: '',
  416. sharePacket: {
  417. isState: true //默认不显示
  418. }, //分销商详细
  419. // uid: 0, //用户uid
  420. circular: false,
  421. autoplay: false,
  422. interval: 3000,
  423. duration: 500,
  424. clientHeight: '',
  425. systemStore: {}, //门店信息
  426. replyChance: 0,
  427. CartCount: 0,
  428. isDown: true,
  429. storeSelfMention: true,
  430. posters: false,
  431. weixinStatus: false,
  432. attr: {
  433. cartAttr: false,
  434. productAttr: [],
  435. productSelect: {}
  436. },
  437. description: '',
  438. navActive: 0,
  439. H5ShareBox: false, //公众号分享图片
  440. activity: [],
  441. retunTop: true, //顶部返回
  442. navH: '',
  443. navList: [],
  444. opacity: 0,
  445. scrollY: 0,
  446. topArr: [],
  447. toView: '',
  448. height: 0,
  449. heightArr: [],
  450. lock: false,
  451. scrollTop: 0,
  452. tagStyle: {
  453. img: 'width:100%;display:block;'
  454. },
  455. // 动画状态
  456. showAnimate: true,
  457. hide_mer_status: 1,
  458. domain: HTTP_REQUEST_URL,
  459. currSpid: '',
  460. codeImg: '',
  461. videoCoverImg: '',
  462. // #ifdef MP-TOUTIAO
  463. power: '' ,//获取抖音跳转wx地址
  464. ppower: '',
  465. // #endif
  466. };
  467. },
  468. computed: mapGetters(['isLogin', 'uid']),
  469. onLoad(options) {
  470. getPower({
  471. path: 'https://sos.liuniu946.com/index/#/pages/index/index'
  472. }).then(res => {
  473. console.log(res,'getPower------------')
  474. })
  475. let that = this;
  476. // #ifdef APP-PLUS
  477. // that.ppower = uni.getStorageSync('power')
  478. // #endif
  479. // #ifdef MP-TOUTIAO
  480. this.getppower()
  481. // #endif
  482. if (options.spid) {
  483. app.globalData.spid = options.spid;
  484. that.currSpid = options.spid;
  485. }
  486. console.log(that.currSpid);
  487. var pages = getCurrentPages();
  488. let curPage = pages[pages.length - 1];
  489. if (pages.length <= 1) {
  490. that.retunTop = false;
  491. }
  492. let curParam = curPage.options || curPage.$route.query;
  493. this.source = curParam.source;
  494. // #ifdef MP
  495. this.navH = app.globalData.navHeight;
  496. // #endif
  497. // #ifndef MP
  498. this.navH = 96;
  499. // #endif
  500. this.id = options.id;
  501. uni.getSystemInfo({
  502. success: function(res) {
  503. that.height = res.windowHeight;
  504. //res.windowHeight:获取整个窗口高度为px,*2为rpx;98为头部占据的高度;
  505. }
  506. });
  507. //扫码携带参数处理
  508. // #ifdef MP
  509. if (options.scene) {
  510. let value = this.$util.getUrlParams(decodeURIComponent(options.scene));
  511. if (value.id) options.id = value.id;
  512. //记录推广人uid
  513. if (value.spid) {
  514. app.globalData.spid = value.spid;
  515. that.currSpid = value.spid;
  516. }
  517. }
  518. if (!options.id) {
  519. return this.$util.Tips(
  520. {
  521. title: '缺少参数无法查看商品'
  522. },
  523. {
  524. tab: 3,
  525. url: 1
  526. }
  527. );
  528. } else {
  529. this.id = options.id;
  530. }
  531. //记录推广人uid
  532. if (options.spid) app.globalData.spid = options.spid;
  533. // #endif
  534. shareScence(that.currSpid, that.isLogin);
  535. this.getGoodsDetails();
  536. //#ifdef H5
  537. this.isLogin && silenceBindingSpread();
  538. //#endif
  539. if (this.isLogin) {
  540. this.getHistory();
  541. }
  542. },
  543. onReady() {},
  544. onShow() {
  545. this.getConfig();
  546. console.log(this.isLogin, 'this.isLogin');
  547. if (this.isLogin) {
  548. this.getUserInfo();
  549. }
  550. },
  551. /**
  552. * 用户点击右上角分享
  553. */
  554. // #ifdef MP
  555. onShareAppMessage: function() {
  556. let that = this;
  557. that.$set(that, 'actionSheetHidden', !that.actionSheetHidden);
  558. userShare();
  559. return {
  560. title: that.storeInfo.store_name || '',
  561. imageUrl: that.storeInfo.image || '',
  562. path: '/pages/goods_details/index?id=' + that.id + '&spid=' + that.uid
  563. };
  564. },
  565. onShareTimeline: function() {
  566. let that = this;
  567. that.$set(that, 'actionSheetHidden', !that.actionSheetHidden);
  568. userShare();
  569. return {
  570. title: that.storeInfo.store_name || '',
  571. query: {
  572. id: that.id,
  573. spid: that.uid
  574. },
  575. imageUrl: that.storeInfo.image || ''
  576. };
  577. },
  578. // #endif
  579. methods: {
  580. getConfig() {
  581. let self = this;
  582. // 获取配置
  583. getconfig()
  584. .then(res => {
  585. this.hide_mer_status = res.data.hide_mer_status;
  586. })
  587. .catch(err => {});
  588. },
  589. goProDetail(item) {
  590. uni.redirectTo({
  591. url: '/pages/goods_details/index?id=' + item.product_id
  592. });
  593. },
  594. boxStatus(data) {
  595. this.showAnimate = data;
  596. },
  597. closeChange: function() {
  598. this.$set(this.sharePacket, 'isState', true);
  599. },
  600. goActivity: function(e) {
  601. console.log(e);
  602. let item = e;
  603. if (item.type === '1') {
  604. uni.navigateTo({
  605. url: `/pages/activity/goods_seckill_details/index?id=${item.id}&time=${item.time}&status=1`
  606. });
  607. } else if (item.type === '2') {
  608. uni.navigateTo({
  609. url: `/pages/activity/goods_bargain_details/index?id=${item.id}&bargain=${this.uid}`
  610. });
  611. } else {
  612. uni.navigateTo({
  613. url: `/pages/activity/goods_combination_details/index?id=${item.id}`
  614. });
  615. }
  616. },
  617. /**
  618. * 购物车手动填写
  619. *
  620. */
  621. iptCartNum: function(e) {
  622. this.$set(this.attr.productSelect, 'cart_num', e);
  623. },
  624. // 后退
  625. returns: function() {
  626. uni.navigateBack();
  627. },
  628. // 首页
  629. goHome() {
  630. uni.switchTab({
  631. url: '/pages/index/index'
  632. });
  633. },
  634. tap: function(index) {
  635. var id = 'past' + index;
  636. var index = index;
  637. var that = this;
  638. // if (!this.data.good_list.length && id == "past2") {
  639. // id = "past3"
  640. // }
  641. this.$set(this, 'toView', id);
  642. this.$set(this, 'navActive', index);
  643. this.$set(this, 'lock', true);
  644. this.$set(this, 'scrollTop', index > 0 ? that.topArr[index] - app.globalData.navHeight / 2 : that.topArr[index]);
  645. },
  646. scroll: function(e) {
  647. var that = this,
  648. scrollY = e.detail.scrollTop;
  649. var opacity = scrollY / 200;
  650. opacity = opacity > 1 ? 1 : opacity;
  651. that.$set(that, 'showAnimate', false);
  652. that.$set(that, 'opacity', opacity);
  653. that.$set(that, 'scrollY', scrollY);
  654. if (that.lock) {
  655. that.$set(that, 'lock', false);
  656. return;
  657. }
  658. for (var i = 0; i < that.topArr.length; i++) {
  659. if (scrollY < that.topArr[i] - app.globalData.navHeight / 2 + that.heightArr[i]) {
  660. that.$set(that, 'navActive', i);
  661. break;
  662. }
  663. }
  664. },
  665. // 微信登录回调
  666. onLoadFun: function(e) {
  667. // this.getCouponList();
  668. this.getCartCount();
  669. // this.downloadFilePromotionCode();
  670. // this.getUserInfo();
  671. // this.get_product_collect();
  672. this.isShowAuth = false;
  673. // if(!e.phone) {
  674. // console.log("没有手机号")
  675. // }
  676. },
  677. ChangCouponsClone: function() {
  678. this.$set(this.coupon, 'coupon', false);
  679. },
  680. /*
  681. * 获取用户信息
  682. */
  683. getUserInfo: function() {
  684. let that = this;
  685. that.$set(that.sharePacket, 'isState', that.sharePacket.priceName != 0 ? false : true);
  686. getUserInfo().then(res => {
  687. let userInfo = res.data;
  688. if (!userInfo.phone) {
  689. uni.showModal({
  690. title: '请绑定手机号',
  691. content: '为了方便您的取货和我们的送货,并获取更多优惠活动,需要您的手机授权!',
  692. showCancel: false,
  693. complete() {
  694. uni.navigateTo({
  695. url: '/pages/users/user_phone/index'
  696. });
  697. }
  698. });
  699. }
  700. // that.$set(that, 'uid', res.data.uid);
  701. });
  702. },
  703. /**
  704. * 购物车数量加和数量减
  705. *
  706. */
  707. ChangeCartNum: function(changeValue) {
  708. //changeValue:是否 加|减
  709. //获取当前变动属性
  710. let productSelect = this.productValue[this.attrValue];
  711. //如果没有属性,赋值给商品默认库存
  712. if (productSelect === undefined && !this.attr.productAttr.length) productSelect = this.attr.productSelect;
  713. //无属性值即库存为0;不存在加减;
  714. if (productSelect === undefined) return;
  715. let stock = productSelect.stock || 0;
  716. let num = this.attr.productSelect;
  717. if (changeValue) {
  718. num.cart_num++;
  719. if (num.cart_num > stock) {
  720. this.$set(this.attr.productSelect, 'cart_num', stock);
  721. this.$set(this, 'cart_num', stock);
  722. }
  723. } else {
  724. num.cart_num--;
  725. if (num.cart_num < 1) {
  726. this.$set(this.attr.productSelect, 'cart_num', 1);
  727. this.$set(this, 'cart_num', 1);
  728. }
  729. }
  730. },
  731. attrVal(val) {
  732. this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw].attr_values[val.indexn]);
  733. },
  734. /**
  735. * 属性变动赋值
  736. *
  737. */
  738. ChangeAttr: function(res) {
  739. let productSelect = this.productValue[res];
  740. if (productSelect && productSelect.stock > 0) {
  741. this.$set(this.attr.productSelect, 'image', productSelect.image ? productSelect.image : this.storeInfo.image);
  742. this.$set(this.attr.productSelect, 'price', productSelect.price);
  743. this.$set(this.attr.productSelect, 'stock', productSelect.stock);
  744. this.$set(this.attr.productSelect, 'unique', productSelect.unique);
  745. this.$set(this.attr.productSelect, 'cart_num', 1);
  746. this.$set(this, 'attrValue', res);
  747. this.$set(this, 'attrTxt', '已选择');
  748. } else {
  749. this.$set(this.attr.productSelect, 'image', productSelect.image);
  750. this.$set(this.attr.productSelect, 'price', productSelect.price);
  751. this.$set(this.attr.productSelect, 'stock', 0);
  752. this.$set(this.attr.productSelect, 'unique', '');
  753. this.$set(this.attr.productSelect, 'cart_num', 0);
  754. this.$set(this, 'attrValue', '');
  755. this.$set(this, 'attrTxt', '请选择');
  756. }
  757. },
  758. /**
  759. * 领取完毕移除当前页面领取过的优惠券展示
  760. */
  761. ChangCoupons: function(e) {
  762. let coupon = e;
  763. console.log(e);
  764. let couponList = this.$util.ArrayRemove(this.couponList, 'id', coupon.id);
  765. this.$set(this, 'couponList', couponList);
  766. this.getCouponList();
  767. },
  768. setClientHeight: function() {
  769. let that = this;
  770. let view = uni
  771. .createSelectorQuery()
  772. .in(this)
  773. .select('#list0');
  774. view.fields(
  775. {
  776. size: true
  777. },
  778. data => {
  779. that.$set(that, 'clientHeight', data.height + 20);
  780. }
  781. ).exec();
  782. },
  783. /**
  784. * 获取产品详情
  785. *
  786. */
  787. getGoodsDetails: function() {
  788. uni.showLoading({
  789. title: '加载中',
  790. mask: true
  791. });
  792. let that = this;
  793. getProductDetail(that.id)
  794. .then(res => {
  795. uni.hideLoading();
  796. let storeInfo = res.data;
  797. if (storeInfo.video_link && storeInfo.slider_image.length > 1) {
  798. this.videoCoverImg = storeInfo.slider_image[0];
  799. storeInfo.slider_image.splice(0, 1);
  800. } else if (storeInfo.video_link && storeInfo.slider_image.length === 1) {
  801. this.videoCoverImg = storeInfo.slider_image[0];
  802. }
  803. that.$set(that, 'storeInfo', storeInfo);
  804. that.$set(that, 'description', storeInfo.content);
  805. console.log(storeInfo.content,'storeInfo.content+++++++++++')
  806. that.$set(that, 'reply', res.data.topReply ? [res.data.topReply] : []);
  807. that.$set(that, 'replyCount', res.data.replayData.count);
  808. that.$set(that, 'replyChance', res.data.replayData.rate);
  809. that.$set(that.attr, 'productAttr', res.data.attr);
  810. that.$set(that, 'productValue', res.data.sku);
  811. that.$set(that.sharePacket, 'priceName', res.data.priceName);
  812. that.$set(that.sharePacket, 'max', res.data.max_extension);
  813. that.$set(that.sharePacket, 'min', res.data.min_extension);
  814. that.$set(that, 'systemStore', res.data.system_store);
  815. that.$set(that, 'storeSelfMention', res.data.store_self_mention);
  816. that.$set(that, 'PromotionCode', storeInfo.code_base);
  817. that.$set(that, 'activity', res.data.activity ? res.data.activity : []);
  818. uni.setNavigationBarTitle({
  819. title: storeInfo.store_name.substring(0, 7) + '...'
  820. });
  821. that.$set(that, 'storeImage', that.storeInfo.image);
  822. // #ifdef H5
  823. if (that.isLogin) {
  824. that.getCartCount();
  825. that.ShareInfo();
  826. }
  827. // #endif
  828. // if (that.isLogin) {
  829. // that.getUserInfo();
  830. // };
  831. setTimeout(function() {
  832. that.infoScroll();
  833. }, 500);
  834. that.DefaultSelect();
  835. that.$nextTick(function() {
  836. that.getCouponList();
  837. });
  838. this.downloadFilePromotionCode();
  839. })
  840. .catch(err => {
  841. //状态异常返回上级页面
  842. return that.$util.Tips(
  843. {
  844. title: err
  845. },
  846. {
  847. tab: 3,
  848. url: 1
  849. }
  850. );
  851. });
  852. },
  853. infoScroll: function() {
  854. var that = this,
  855. topArr = [],
  856. heightArr = [];
  857. for (var i = 0; i < that.navList.length; i++) {
  858. //productList
  859. //获取元素所在位置
  860. var query = uni.createSelectorQuery().in(this);
  861. var idView = '#past' + i;
  862. // if (!that.data.good_list.length && i == 2) {
  863. // var idView = "#past" + 3;
  864. // }
  865. query.select(idView).boundingClientRect();
  866. query.exec(function(res) {
  867. var top = res[0].top;
  868. var height = res[0].height;
  869. topArr.push(top);
  870. heightArr.push(height);
  871. that.$set(that, 'topArr', topArr);
  872. that.$set(that, 'heightArr', heightArr);
  873. });
  874. }
  875. },
  876. /**
  877. * 拨打电话
  878. */
  879. makePhone: function() {
  880. uni.makePhoneCall({
  881. phoneNumber: this.systemStore.phone
  882. });
  883. },
  884. /**
  885. * 打开地图
  886. *
  887. */
  888. showMaoLocation: function() {
  889. if (!this.systemStore.latitude || !this.systemStore.longitude)
  890. return this.$util.Tips({
  891. title: '缺少经纬度信息无法查看地图!'
  892. });
  893. uni.openLocation({
  894. latitude: parseFloat(this.systemStore.latitude),
  895. longitude: parseFloat(this.systemStore.longitude),
  896. scale: 8,
  897. name: this.systemStore.name,
  898. address: this.systemStore.address + this.systemStore.detailed_address,
  899. success: function() {}
  900. });
  901. },
  902. /**
  903. * 默认选中属性
  904. *
  905. */
  906. DefaultSelect: function() {
  907. let productAttr = this.attr.productAttr;
  908. let value = [];
  909. let arr = [];
  910. let unSortArr = [];
  911. // this.attr.productAttr.forEach((item,index)=>{
  912. // arr.push(item.attr_values[0])
  913. // })
  914. // // 默认选中未排序 改变unSortArr数组原始对象指向
  915. // unSortArr = unSortArr.concat(arr)
  916. // // 默认选中排序
  917. // arr = arr.sort().join(',')
  918. // // for(let i; i<unSortArr.length;i++){
  919. // // }
  920. console.log(arr, 'arr');
  921. for (var key in this.productValue) {
  922. if (this.productValue[key].stock > 0) {
  923. value = this.attr.productAttr.length ? key.split(',') : [];
  924. break;
  925. }
  926. }
  927. for (let i = 0; i < productAttr.length; i++) {
  928. this.$set(productAttr[i], 'index', value[i]);
  929. }
  930. console.log(value, 'value');
  931. //sort();排序函数:数字-英文-汉字;
  932. let productSelect = this.productValue[value.join(',')];
  933. if (productSelect && productAttr.length) {
  934. this.$set(this.attr.productSelect, 'store_name', this.storeInfo.store_name);
  935. this.$set(this.attr.productSelect, 'image', productSelect.image ? productSelect.image : this.storeInfo.image);
  936. this.$set(this.attr.productSelect, 'price', productSelect.price);
  937. this.$set(this.attr.productSelect, 'stock', productSelect.stock);
  938. this.$set(this.attr.productSelect, 'unique', productSelect.unique);
  939. this.$set(this, 'attrValue', value.join(','));
  940. this.$set(this, 'attrTxt', '已选择');
  941. if (productSelect.stock == 0) {
  942. this.$set(this.attr.productSelect, 'cart_num', 0);
  943. } else {
  944. this.$set(this.attr.productSelect, 'cart_num', 1);
  945. }
  946. } else if (!productSelect && productAttr.length) {
  947. this.$set(this.attr.productSelect, 'store_name', this.storeInfo.store_name);
  948. this.$set(this.attr.productSelect, 'image', this.storeInfo.image);
  949. this.$set(this.attr.productSelect, 'price', this.storeInfo.price);
  950. this.$set(this.attr.productSelect, 'stock', 0);
  951. this.$set(this.attr.productSelect, 'unique', '');
  952. this.$set(this.attr.productSelect, 'cart_num', 0);
  953. this.$set(this, 'attrValue', '');
  954. this.$set(this, 'attrTxt', '请选择');
  955. } else if (!productSelect && !productAttr.length) {
  956. this.$set(this.attr.productSelect, 'store_name', this.storeInfo.store_name);
  957. this.$set(this.attr.productSelect, 'image', this.storeInfo.image);
  958. this.$set(this.attr.productSelect, 'price', this.storeInfo.price);
  959. this.$set(this.attr.productSelect, 'stock', this.storeInfo.stock);
  960. this.$set(this.attr.productSelect, 'unique', this.storeInfo.unique || '');
  961. this.$set(this.attr.productSelect, 'cart_num', 1);
  962. this.$set(this, 'attrValue', '');
  963. this.$set(this, 'attrTxt', '请选择');
  964. } else if (productSelect && !productAttr.length) {
  965. this.$set(this.attr.productSelect, 'store_name', this.storeInfo.store_name);
  966. this.$set(this.attr.productSelect, 'image', productSelect.image);
  967. this.$set(this.attr.productSelect, 'price', productSelect.price);
  968. this.$set(this.attr.productSelect, 'stock', productSelect.stock);
  969. this.$set(this.attr.productSelect, 'unique', productSelect.unique);
  970. this.$set(this, 'attrValue', value.join(','));
  971. this.$set(this, 'attrTxt', '已选择');
  972. if (productSelect.stock == 0) {
  973. this.$set(this.attr.productSelect, 'cart_num', 0);
  974. } else {
  975. this.$set(this.attr.productSelect, 'cart_num', 1);
  976. }
  977. }
  978. },
  979. /**
  980. * 获取优惠券
  981. *
  982. */
  983. getCouponList() {
  984. let that = this;
  985. console.log(that.storeInfo.mer_id, 'that.storeInfo.mer_id');
  986. let goodsArr = [];
  987. let couponList = [];
  988. let activeList = [];
  989. getCoupons({
  990. ids: that.id
  991. }).then(res => {
  992. goodsArr = res.data;
  993. getShopCoupons(that.storeInfo.mer_id).then(({ data }) => {
  994. couponList = goodsArr.concat(data);
  995. that.$set(that.coupon, 'list', couponList);
  996. for (let i = 0; i < couponList.length; i++) {
  997. if (!couponList[i].issue && activeList.length < 2) {
  998. activeList.push(couponList[i]);
  999. }
  1000. }
  1001. that.$set(that, 'couponList', activeList);
  1002. });
  1003. });
  1004. },
  1005. ChangCouponsUseState(index) {
  1006. let that = this;
  1007. // that.coupon.list[index].issue = true;
  1008. // that.$set(that.coupon, 'list', that.coupon.list);
  1009. that.$set(that.coupon, 'coupon', false);
  1010. // this.getCouponList()
  1011. },
  1012. /**
  1013. *
  1014. *
  1015. * 收藏商品
  1016. */
  1017. setCollect: function() {
  1018. if (this.isLogin === false) {
  1019. // #ifdef H5 || APP-PLUS
  1020. toLogin();
  1021. // #endif
  1022. // #ifdef MP
  1023. this.isAuto = true;
  1024. this.$set(this, 'isShowAuth', true);
  1025. // #endif
  1026. } else {
  1027. let that = this;
  1028. if (this.storeInfo.isRelation) {
  1029. collectDel({
  1030. type: 1,
  1031. type_id: this.id
  1032. }).then(res => {
  1033. that.$set(that.storeInfo, 'isRelation', !that.storeInfo.isRelation);
  1034. });
  1035. } else {
  1036. collectAdd({
  1037. type_id: this.id,
  1038. type: 1
  1039. }).then(res => {
  1040. that.$set(that.storeInfo, 'isRelation', !that.storeInfo.isRelation);
  1041. });
  1042. }
  1043. }
  1044. },
  1045. /**
  1046. * 打开属性插件
  1047. */
  1048. selecAttr: function() {
  1049. this.$set(this.attr, 'cartAttr', true);
  1050. this.$set(this, 'isOpen', true);
  1051. },
  1052. /**
  1053. * 打开优惠券插件
  1054. */
  1055. couponTap: function() {
  1056. let that = this;
  1057. if (that.isLogin === false) {
  1058. // #ifdef H5 || APP-PLUS
  1059. toLogin();
  1060. // #endif
  1061. // #ifdef MP
  1062. that.$set(that, 'isAuto', true);
  1063. that.$set(that, 'isShowAuth', true);
  1064. // #endif
  1065. } else {
  1066. // that.getCouponList();
  1067. that.$set(that.coupon, 'coupon', true);
  1068. }
  1069. },
  1070. couponTap2: function() {
  1071. let that = this;
  1072. if (that.isLogin === false) {
  1073. // #ifdef H5 || APP-PLUS
  1074. toLogin();
  1075. // #endif
  1076. // #ifdef MP
  1077. that.$set(that, 'isAuto', true);
  1078. that.$set(that, 'isShowAuth', true);
  1079. // #endif
  1080. } else {
  1081. // that.getCouponList();
  1082. uni.navigateTo({
  1083. url: `/pages/chat/customer_list/chat?mer_id=${that.storeInfo.mer_id}&uid=${that.uid}&productId=${that.id}`
  1084. });
  1085. }
  1086. },
  1087. onMyEvent: function() {
  1088. this.$set(this.attr, 'cartAttr', false);
  1089. this.$set(this, 'isOpen', false);
  1090. },
  1091. /**
  1092. * 打开属性加入购物车
  1093. *
  1094. */
  1095. joinCart: function(e) {
  1096. //是否登录
  1097. if (this.isLogin === false) {
  1098. // #ifdef H5 || APP-PLUS
  1099. toLogin();
  1100. // #endif
  1101. // #ifdef MP
  1102. this.$set(this, 'isAuto', true);
  1103. this.$set(this, 'isShowAuth', true);
  1104. // #endif
  1105. } else {
  1106. // #ifdef MP-TOUTIAO
  1107. this.getPower();
  1108. // #endif
  1109. // #ifndef MP-TOUTIAO
  1110. this.goCat();
  1111. // #endif
  1112. }
  1113. },
  1114. /*
  1115. * 加入购物车
  1116. */
  1117. goCat: function(news) {
  1118. let that = this,
  1119. productSelect = that.productValue[this.attrValue];
  1120. //打开属性
  1121. if (that.attrValue) {
  1122. //默认选中了属性,但是没有打开过属性弹窗还是自动打开让用户查看默认选中的属性
  1123. that.attr.cartAttr = !that.isOpen ? true : false;
  1124. } else {
  1125. if (that.isOpen) that.attr.cartAttr = true;
  1126. else that.attr.cartAttr = !that.attr.cartAttr;
  1127. }
  1128. //只有关闭属性弹窗时进行加入购物车
  1129. if (that.attr.cartAttr === true && that.isOpen === false) return (that.isOpen = true);
  1130. //如果有属性,没有选择,提示用户选择
  1131. if (that.attr.productAttr.length && that.isOpen === true && productSelect.stock == 0)
  1132. return that.$util.Tips({
  1133. title: '产品库存不足,请选择其它'
  1134. });
  1135. if (that.attr.productSelect.cart_num == 0) {
  1136. return that.$util.Tips({
  1137. title: '购买个数不能为0!'
  1138. });
  1139. }
  1140. let q = {
  1141. // productId: that.id,
  1142. // cartNum: that.attr.productSelect.cart_num,
  1143. is_new: news === undefined ? 0 : 1,
  1144. // uniqueId: that.attr.productSelect !== undefined ?
  1145. // that.attr.productSelect.unique : ""
  1146. product_id: that.id,
  1147. cart_num: that.attr.productSelect.cart_num,
  1148. product_attr_unique: that.attr.productSelect !== undefined ? that.attr.productSelect.unique : '',
  1149. source: this.source,
  1150. product_type: 0
  1151. };
  1152. postCartAdd(q)
  1153. .then(function(res) {
  1154. that.isOpen = false;
  1155. that.attr.cartAttr = false;
  1156. if (news) {
  1157. uni.navigateTo({
  1158. url: '/pages/users/order_confirm/index?cartId=' + res.data.cart_id
  1159. });
  1160. } else {
  1161. that.$util.Tips({
  1162. title: '添加购物车成功',
  1163. success: () => {
  1164. that.getCartCount(true);
  1165. }
  1166. });
  1167. }
  1168. })
  1169. .catch(res => {
  1170. that.isOpen = false;
  1171. return that.$util.Tips({
  1172. title: res
  1173. });
  1174. });
  1175. },
  1176. /**
  1177. * 获取购物车数量
  1178. * @param boolean 是否展示购物车动画和重置属性
  1179. */
  1180. getCartCount: function(isAnima) {
  1181. let that = this;
  1182. const isLogin = that.isLogin;
  1183. if (isLogin) {
  1184. getCartCounts().then(res => {
  1185. that.CartCount = res.data[0].count;
  1186. //加入购物车后重置属性
  1187. if (isAnima) {
  1188. that.animated = true;
  1189. setTimeout(function() {
  1190. that.animated = false;
  1191. }, 500);
  1192. }
  1193. });
  1194. }
  1195. },
  1196. /**
  1197. * 立即购买
  1198. */
  1199. goBuy: function(e) {
  1200. if (this.isLogin === false) {
  1201. // #ifdef H5 || APP-PLUS
  1202. toLogin();
  1203. // #endif
  1204. // #ifdef MP
  1205. this.$set(this, 'isAuto', true);
  1206. this.$set(this, 'isShowAuth', true);
  1207. // #endif
  1208. } else {
  1209. // #ifdef MP-TOUTIAO
  1210. this.getPower();
  1211. // #endif
  1212. // #ifndef MP-TOUTIAO
  1213. this.goCat(true);
  1214. // #endif
  1215. }
  1216. },
  1217. // 授权关闭
  1218. authColse: function(e) {
  1219. console.log(e, 'eeeee');
  1220. this.isShowAuth = e;
  1221. },
  1222. /**
  1223. * 分享打开
  1224. *
  1225. */
  1226. listenerActionSheet: function() {
  1227. if (this.isLogin === false) {
  1228. // #ifdef H5 || APP-PLUS
  1229. toLogin();
  1230. // #endif
  1231. // #ifdef MP
  1232. this.$set(this, 'isAuto', true);
  1233. this.$set(this, 'isShowAuth', true);
  1234. // #endif
  1235. } else {
  1236. // #ifdef H5
  1237. if (this.$wechat.isWeixin() === true) {
  1238. this.weixinStatus = true;
  1239. }
  1240. // #endif
  1241. this.posters = true;
  1242. }
  1243. },
  1244. // 分享关闭
  1245. listenerActionClose: function() {
  1246. this.posters = false;
  1247. },
  1248. //隐藏海报
  1249. posterImageClose: function() {
  1250. this.posterImageStatus = false;
  1251. },
  1252. //替换安全域名
  1253. setDomain: function(url) {
  1254. url = url ? url.toString() : '';
  1255. //本地调试打开,生产请注销
  1256. if (url.indexOf('https://') > -1) return url;
  1257. else return url.replace('http://', 'https://');
  1258. },
  1259. /**
  1260. * 获取产品分销二维码
  1261. * @param function successFn 下载完成回调
  1262. *
  1263. */
  1264. downloadFilePromotionCode: function(successFn) {
  1265. let that = this;
  1266. let type;
  1267. // #ifndef MP
  1268. type = 'wechat';
  1269. // #endif
  1270. // #ifdef MP
  1271. type = 'routine';
  1272. // #endif
  1273. getProductCode(that.id, {
  1274. type: type,
  1275. product_type: that.storeInfo.product_type
  1276. })
  1277. .then(async res => {
  1278. console.log(res);
  1279. that.codeImg = res.data.url;
  1280. that.$set(that, 'isDown', false);
  1281. })
  1282. .catch(err => {
  1283. that.$set(that, 'isDown', false);
  1284. that.$set(that, 'PromotionCode', '');
  1285. });
  1286. },
  1287. // 小程序关闭分享弹窗;
  1288. goFriend: function() {
  1289. this.posters = false;
  1290. },
  1291. /**
  1292. * 生成海报
  1293. */
  1294. async goPoster() {
  1295. if (this.posterImage) {
  1296. this.posterImageStatus = true;
  1297. this.posters = false;
  1298. return;
  1299. }
  1300. let that = this;
  1301. let arr2;
  1302. that.posters = false;
  1303. that.$set(that, 'canvasStatus', true);
  1304. uni.showLoading({
  1305. title: '海报生成中',
  1306. mask: true
  1307. });
  1308. // #ifdef MP
  1309. arr2 = [that.posterbackgd, await this.fileStoreImage(this.storeImage), await this.fileStoreImage(this.codeImg)];
  1310. // #endif
  1311. // #ifdef H5
  1312. arr2 = [that.posterbackgd, await this.imgToBase(that.storeImage), await this.imgToBase(this.codeImg)];
  1313. // #endif
  1314. //生成推广海报
  1315. that.$util.PosterCanvas(
  1316. arr2,
  1317. that.storeInfo.store_name,
  1318. that.storeInfo.price,
  1319. function(tempFilePath) {
  1320. that.$set(that, 'posterImage', tempFilePath);
  1321. that.$set(that, 'posterImageStatus', true);
  1322. that.$set(that, 'actionSheetHidden', !that.actionSheetHidden);
  1323. that.$set(that, 'canvasStatus', false);
  1324. },
  1325. err => {
  1326. that.$set(that, 'canvasStatus', false);
  1327. }
  1328. );
  1329. },
  1330. //图片转符合安全域名路径
  1331. fileStoreImage(url) {
  1332. // #ifdef MP
  1333. let ishttps = url.split('//')[0] == 'https:';
  1334. if (!ishttps) {
  1335. url = 'https://' + url.split('//')[1];
  1336. }
  1337. // #endif
  1338. return new Promise((resolve, reject) => {
  1339. let that = this;
  1340. uni.downloadFile({
  1341. url: url,
  1342. success: function(res) {
  1343. resolve(res.tempFilePath);
  1344. },
  1345. fail: function() {
  1346. return that.$util.Tips({
  1347. title: ''
  1348. });
  1349. }
  1350. });
  1351. });
  1352. },
  1353. /*
  1354. * 保存到手机相册
  1355. */
  1356. // #ifdef MP
  1357. savePosterPath: function() {
  1358. let that = this;
  1359. uni.getSetting({
  1360. success(res) {
  1361. if (!res.authSetting['scope.writePhotosAlbum']) {
  1362. uni.authorize({
  1363. scope: 'scope.writePhotosAlbum',
  1364. success() {
  1365. uni.saveImageToPhotosAlbum({
  1366. filePath: that.posterImage,
  1367. success: function(res) {
  1368. that.posterImageClose();
  1369. that.$util.Tips({
  1370. title: '保存成功',
  1371. icon: 'success'
  1372. });
  1373. },
  1374. fail: function(res) {
  1375. that.$util.Tips({
  1376. title: '保存失败'
  1377. });
  1378. }
  1379. });
  1380. }
  1381. });
  1382. } else {
  1383. uni.saveImageToPhotosAlbum({
  1384. filePath: that.posterImage,
  1385. success: function(res) {
  1386. that.posterImageClose();
  1387. that.$util.Tips({
  1388. title: '保存成功',
  1389. icon: 'success'
  1390. });
  1391. },
  1392. fail: function(res) {
  1393. that.$util.Tips({
  1394. title: '保存失败'
  1395. });
  1396. }
  1397. });
  1398. }
  1399. }
  1400. });
  1401. },
  1402. // #endif
  1403. //#ifdef H5
  1404. ShareInfo() {
  1405. let data = this.storeInfo;
  1406. let href = location.href;
  1407. if (this.$wechat.isWeixin()) {
  1408. getUserInfo().then(res => {
  1409. href = href.indexOf('?') === -1 ? href + '?spid=' + res.data.uid : href + '&spid=' + res.data.uid;
  1410. let configAppMessage = {
  1411. desc: data.store_info,
  1412. title: data.store_name,
  1413. link: href,
  1414. imgUrl: data.image
  1415. };
  1416. this.$wechat
  1417. .wechatEvevt(['updateAppMessageShareData', 'updateTimelineShareData', 'onMenuShareAppMessage', 'onMenuShareTimeline'], configAppMessage)
  1418. .then(res => {
  1419. console.log(res, '=============================>>WXAPI');
  1420. })
  1421. .catch(err => {
  1422. console.log(err);
  1423. });
  1424. });
  1425. }
  1426. },
  1427. //#endif
  1428. async imgToBase(url) {
  1429. let res = await imgToBase({
  1430. image: url
  1431. });
  1432. return res.data.image;
  1433. },
  1434. getppower() {
  1435. getPower().then( ({data}) => {
  1436. if(data.openlink) {
  1437. this.ppower = true
  1438. this.power = data.openlink
  1439. uni.setStorageSync('power', data.openlink);
  1440. }else {
  1441. uni.showModal({
  1442. title: '提示',
  1443. showCancel: false,
  1444. content: '抖音小程序主要为商品展示,不支持加入购物车和购买功能!',
  1445. })
  1446. }
  1447. })
  1448. },
  1449. getPower() {
  1450. let obj = this;
  1451. let routes = getCurrentPages();
  1452. let curRouter = routes[routes.length - 1].route;
  1453. let curParam = routes[routes.length - 1].options;
  1454. let query = '';
  1455. for (let item in curParam) {
  1456. let str = curParam[item];
  1457. query += item + '=' + str + '&';
  1458. }
  1459. query = query.replace(/&$/,'')
  1460. console.log(query,'66666666666666')
  1461. getPower({
  1462. path: curRouter,
  1463. query: query
  1464. }).then(({ data }) => {
  1465. obj.power = data.openlink;
  1466. console.log(obj.power,'obj.power-befo')
  1467. if (data.openlink) {
  1468. uni.showModal({
  1469. title: '提示',
  1470. showCancel: false,
  1471. content: '抖音小程序为商品展示,请点击下方的复制链接,通过微信打开!',
  1472. confirmText: '复制链接',
  1473. success: () => {
  1474. console.log(obj.power,'obj.power-after')
  1475. uni.setClipboardData({
  1476. data: obj.power,
  1477. success: function() {
  1478. console.log('success');
  1479. // return true;
  1480. },
  1481. fail: function() {
  1482. console.log('err')
  1483. }
  1484. });
  1485. }
  1486. });
  1487. } else {
  1488. uni.showModal({
  1489. title: '提示',
  1490. showCancel: false,
  1491. content: '抖音小程序主要为商品展示,不支持加入购物车和购买功能!'
  1492. });
  1493. }
  1494. });
  1495. }
  1496. }
  1497. };
  1498. </script>
  1499. <style scoped lang="scss">
  1500. .activity_pin {
  1501. width: auto;
  1502. height: 44rpx;
  1503. line-height: 44rpx;
  1504. background: linear-gradient(90deg, rgba(233, 51, 35, 1) 0%, rgba(250, 101, 20, 1) 100%);
  1505. opacity: 1;
  1506. border-radius: 22rpx;
  1507. padding: 0 15rpx;
  1508. margin-left: 19rpx;
  1509. }
  1510. .activity_miao {
  1511. width: auto;
  1512. height: 44rpx;
  1513. line-height: 44rpx;
  1514. padding: 0 15rpx;
  1515. background: linear-gradient(90deg, rgba(250, 102, 24, 1) 0%, rgba(254, 161, 15, 1) 100%);
  1516. opacity: 1;
  1517. border-radius: 22rpx;
  1518. margin-left: 19rpx;
  1519. }
  1520. .iconfonts {
  1521. color: #fff !important;
  1522. font-size: 28rpx;
  1523. }
  1524. .activity_title {
  1525. font-size: 24rpx;
  1526. color: #fff;
  1527. }
  1528. .activity_kan {
  1529. width: auto;
  1530. height: 44rpx;
  1531. line-height: 44rpx;
  1532. padding: 0 15rpx;
  1533. background: linear-gradient(90deg, rgba(254, 159, 15, 1) 0%, rgba(254, 178, 15, 1) 100%);
  1534. opacity: 1;
  1535. border-radius: 22rpx;
  1536. margin-left: 19rpx;
  1537. }
  1538. .mask {
  1539. z-index: 300 !important;
  1540. }
  1541. .head-bar {
  1542. background: #fff;
  1543. }
  1544. .generate-posters {
  1545. width: 100%;
  1546. height: 170rpx;
  1547. background-color: #fff;
  1548. position: fixed;
  1549. left: 0;
  1550. bottom: 0;
  1551. z-index: 388;
  1552. transform: translate3d(0, 100%, 0);
  1553. transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
  1554. border-top: 1rpx solid #eee;
  1555. }
  1556. .generate-posters.on {
  1557. transform: translate3d(0, 0, 0);
  1558. }
  1559. .generate-posters .item {
  1560. flex: 50%;
  1561. text-align: center;
  1562. font-size: 30rpx;
  1563. }
  1564. .generate-posters .item .iconfont {
  1565. font-size: 80rpx;
  1566. color: #5eae72;
  1567. }
  1568. .generate-posters .item .iconfont.icon-haibao {
  1569. color: #5391f1;
  1570. }
  1571. .product-con .mask {
  1572. z-index: 88;
  1573. }
  1574. .product-con .footer {
  1575. padding: 0 20rpx 0 30rpx;
  1576. position: fixed;
  1577. left: 0;
  1578. bottom: 0;
  1579. width: 100%;
  1580. box-sizing: border-box;
  1581. height: 100rpx;
  1582. background-color: #fff;
  1583. z-index: 277;
  1584. border-top: 1rpx solid #f0f0f0;
  1585. }
  1586. .product-con .footer .item {
  1587. font-size: 18rpx;
  1588. color: #666;
  1589. }
  1590. .product-con .attribute .atterTxt {
  1591. overflow: hidden;
  1592. white-space: nowrap;
  1593. text-overflow: ellipsis;
  1594. display: inline-block;
  1595. width: 400rpx;
  1596. }
  1597. .product-con .footer .item .iconfont {
  1598. text-align: center;
  1599. font-size: 40rpx;
  1600. }
  1601. .product-con .wrapper .introduce {
  1602. margin: 20rpx 30rpx 0;
  1603. }
  1604. .product-con .footer .item .iconfont.icon-shoucang1 {
  1605. color: #f00;
  1606. }
  1607. .product-con .footer .item .iconfont.icon-gouwuche1 {
  1608. font-size: 40rpx;
  1609. position: relative;
  1610. }
  1611. .product-con .footer .item .iconfont.icon-gouwuche1 .num {
  1612. color: #fff;
  1613. position: absolute;
  1614. font-size: 18rpx;
  1615. padding: 2rpx 8rpx 3rpx;
  1616. border-radius: 200rpx;
  1617. top: -10rpx;
  1618. right: -10rpx;
  1619. }
  1620. .product-con .footer .bnt {
  1621. width: 444rpx;
  1622. height: 76rpx;
  1623. }
  1624. .product-con .footer .bnt .bnts {
  1625. width: 222rpx;
  1626. text-align: center;
  1627. line-height: 76rpx;
  1628. color: #fff;
  1629. font-size: 28rpx;
  1630. &.sold_out {
  1631. width: 444rpx;
  1632. border-radius: 50rpx;
  1633. }
  1634. }
  1635. .product-con .footer .bnt .joinCart {
  1636. border-radius: 50rpx 0 0 50rpx;
  1637. background-image: linear-gradient(to right, #fea10f 0%, #fa8013 100%);
  1638. }
  1639. .product-con .footer .bnt .buy {
  1640. border-radius: 0 50rpx 50rpx 0;
  1641. background-image: linear-gradient(to right, #fa6514 0%, #e93323 100%);
  1642. }
  1643. .product-con .footer .bnt .buy[disabled] {
  1644. background: #bbb;
  1645. }
  1646. .product-con .superior {
  1647. background-color: #fff;
  1648. margin-top: 20rpx;
  1649. padding-bottom: 10rpx;
  1650. }
  1651. .product-con .superior .title {
  1652. height: 98rpx;
  1653. }
  1654. .product-con .superior .title image {
  1655. width: 30rpx;
  1656. height: 30rpx;
  1657. }
  1658. .product-con .superior .title .titleTxt {
  1659. margin: 0 20rpx;
  1660. font-size: 30rpx;
  1661. background-image: linear-gradient(to right, #f57a37 0%, #f21b07 100%);
  1662. -webkit-background-clip: text;
  1663. -webkit-text-fill-color: transparent;
  1664. }
  1665. .product-con .superior .slider-banner {
  1666. width: 690rpx;
  1667. margin: 0 auto;
  1668. position: relative;
  1669. }
  1670. .product-con .superior .slider-banner swiper {
  1671. height: 100%;
  1672. width: 100%;
  1673. }
  1674. .product-con .superior .slider-banner swiper-item {
  1675. height: 100%;
  1676. }
  1677. .product-con .superior .slider-banner .list {
  1678. width: 100%;
  1679. }
  1680. .product-con .superior .slider-banner .list .item {
  1681. width: 215rpx;
  1682. margin: 0 22rpx 30rpx 0;
  1683. font-size: 26rpx;
  1684. }
  1685. .product-con .superior .slider-banner .list .item:nth-of-type(3n) {
  1686. margin-right: 0;
  1687. }
  1688. .product-con .superior .slider-banner .list .item .pictrue {
  1689. position: relative;
  1690. width: 100%;
  1691. height: 215rpx;
  1692. }
  1693. .product-con .superior .slider-banner .list .item .pictrue image {
  1694. width: 100%;
  1695. height: 100%;
  1696. border-radius: 6rpx;
  1697. }
  1698. .product-con .superior .slider-banner .list .item .name {
  1699. color: #282828;
  1700. margin-top: 12rpx;
  1701. }
  1702. .product-con .superior .slider-banner .swiper-pagination-bullet {
  1703. background-color: #999;
  1704. }
  1705. .product-con .superior .slider-banner .swiper-pagination-bullet-active {
  1706. background-color: #e93323;
  1707. }
  1708. button {
  1709. padding: 0;
  1710. margin: 0;
  1711. line-height: normal;
  1712. background-color: #fff;
  1713. }
  1714. button::after {
  1715. border: 0;
  1716. }
  1717. action-sheet-item {
  1718. padding: 0;
  1719. height: 240rpx;
  1720. align-items: center;
  1721. display: flex;
  1722. }
  1723. .contact {
  1724. font-size: 16px;
  1725. width: 50%;
  1726. background-color: #fff;
  1727. padding: 8rpx 0;
  1728. border-radius: 0;
  1729. margin: 0;
  1730. line-height: 2;
  1731. }
  1732. .contact::after {
  1733. border: none;
  1734. }
  1735. .action-sheet {
  1736. font-size: 17px;
  1737. line-height: 1.8;
  1738. width: 50%;
  1739. position: absolute;
  1740. top: 0;
  1741. right: 0;
  1742. padding: 25rpx 0;
  1743. }
  1744. .canvas {
  1745. z-index: 300;
  1746. width: 750px;
  1747. height: 1190px;
  1748. }
  1749. .poster-pop {
  1750. width: 450rpx;
  1751. height: 714rpx;
  1752. position: fixed;
  1753. left: 50%;
  1754. transform: translateX(-50%);
  1755. z-index: 399;
  1756. top: 50%;
  1757. margin-top: -357rpx;
  1758. }
  1759. .poster-pop image {
  1760. width: 100%;
  1761. height: 100%;
  1762. display: block;
  1763. }
  1764. .poster-pop .close {
  1765. width: 46rpx;
  1766. height: 75rpx;
  1767. position: fixed;
  1768. right: 0;
  1769. top: -73rpx;
  1770. display: block;
  1771. }
  1772. .poster-pop .save-poster {
  1773. background-color: #df2d0a;
  1774. font-size: :22rpx;
  1775. color: #fff;
  1776. text-align: center;
  1777. height: 76rpx;
  1778. line-height: 76rpx;
  1779. width: 100%;
  1780. }
  1781. .poster-pop .keep {
  1782. color: #fff;
  1783. text-align: center;
  1784. font-size: 25rpx;
  1785. margin-top: 10rpx;
  1786. }
  1787. .mask {
  1788. position: fixed;
  1789. top: 0;
  1790. left: 0;
  1791. right: 0;
  1792. bottom: 0;
  1793. background-color: rgba(0, 0, 0, 0.6);
  1794. z-index: 9;
  1795. }
  1796. .pro-wrapper .iconn {
  1797. background-image: url('data:image/png;base64,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');
  1798. width: 100rpx;
  1799. height: 100rpx;
  1800. background-repeat: no-repeat;
  1801. background-size: 100% 100%;
  1802. margin: 0 auto;
  1803. }
  1804. .pro-wrapper .iconn.iconn1 {
  1805. background-image: url('data:image/png;base64,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');
  1806. }
  1807. .pictrue_log {
  1808. width: 80upx;
  1809. height: 40upx;
  1810. border-radius: 6upx 0 12upx 0;
  1811. line-height: 40upx;
  1812. font-size: 24upx;
  1813. }
  1814. .pictrue_log_class {
  1815. z-index: 3;
  1816. background: -webkit-gradient(linear, left top, right top, from(rgba(246, 122, 56, 1)), to(rgba(241, 27, 9, 1)));
  1817. background: linear-gradient(90deg, rgba(246, 122, 56, 1) 0%, rgba(241, 27, 9, 1) 100%);
  1818. opacity: 1;
  1819. position: absolute;
  1820. top: 0;
  1821. left: 0;
  1822. color: #fff;
  1823. text-align: center;
  1824. }
  1825. .navbar .header {
  1826. height: 96rpx;
  1827. font-size: 30rpx;
  1828. color: #050505;
  1829. background-color: #fff;
  1830. /* #ifdef MP */
  1831. padding-right: 95rpx;
  1832. /* #endif */
  1833. }
  1834. .navbar .header .item {
  1835. position: relative;
  1836. margin: 0 25rpx;
  1837. }
  1838. .navbar .header .item.on:before {
  1839. position: absolute;
  1840. width: 60rpx;
  1841. height: 5rpx;
  1842. background-repeat: no-repeat;
  1843. content: '';
  1844. background-image: linear-gradient(to right, #ff3366 0%, #ff6533 100%);
  1845. bottom: -10rpx;
  1846. left: 50%;
  1847. margin-left: -28rpx;
  1848. }
  1849. .navbar {
  1850. position: fixed;
  1851. background-color: #fff;
  1852. top: 0;
  1853. left: 0;
  1854. z-index: 99;
  1855. width: 100%;
  1856. }
  1857. .navbar .navbarH {
  1858. position: relative;
  1859. }
  1860. .navbar .navbarH .navbarCon {
  1861. position: absolute;
  1862. bottom: 0;
  1863. height: 100rpx;
  1864. width: 100%;
  1865. }
  1866. .share-box {
  1867. z-index: 1000;
  1868. position: fixed;
  1869. left: 0;
  1870. top: 0;
  1871. width: 100%;
  1872. height: 100%;
  1873. image {
  1874. width: 100%;
  1875. height: 100%;
  1876. }
  1877. }
  1878. .store-wrapper {
  1879. margin-top: 20rpx;
  1880. background-color: #fff;
  1881. .store-hd {
  1882. padding: 30rpx;
  1883. border-bottom: 1px solid #f5f5f5;
  1884. .store-info {
  1885. position: relative;
  1886. display: flex;
  1887. .logo {
  1888. width: 86rpx;
  1889. height: 86rpx;
  1890. image {
  1891. width: 86rpx;
  1892. height: 86rpx;
  1893. border-radius: 6rpx;
  1894. }
  1895. }
  1896. .info {
  1897. display: flex;
  1898. flex-direction: column;
  1899. justify-content: center;
  1900. margin-left: 20rpx;
  1901. .name {
  1902. font-size: 28rpx;
  1903. color: #282828;
  1904. font-weight: bold;
  1905. }
  1906. .txt {
  1907. margin-top: 8rpx;
  1908. color: #666666;
  1909. font-size: 22rpx;
  1910. }
  1911. }
  1912. .link {
  1913. position: absolute;
  1914. right: 0;
  1915. top: 50%;
  1916. transform: translateY(-50%);
  1917. display: flex;
  1918. align-items: center;
  1919. justify-content: center;
  1920. width: 114rpx;
  1921. height: 50rpx;
  1922. background: linear-gradient(-90deg, $bg-end 0%, $bg-star 100%);
  1923. border-radius: 25rpx;
  1924. color: #fff;
  1925. }
  1926. }
  1927. .score-wrapper {
  1928. display: flex;
  1929. justify-content: space-between;
  1930. margin-top: 30rpx;
  1931. .item {
  1932. color: #948d8c;
  1933. font-size: 26rpx;
  1934. text {
  1935. margin-left: 10rpx;
  1936. color: $theme-color;
  1937. }
  1938. }
  1939. }
  1940. }
  1941. .con-box {
  1942. padding: 20rpx 30rpx 30rpx;
  1943. .title {
  1944. font-size: 28rpx;
  1945. color: #282828;
  1946. }
  1947. .img-box {
  1948. display: flex;
  1949. margin-top: 20rpx;
  1950. .img-item {
  1951. width: 220rpx;
  1952. margin-right: 15rpx;
  1953. image {
  1954. width: 220rpx;
  1955. height: 220rpx;
  1956. border-radius: 16rpx;
  1957. }
  1958. .txt {
  1959. .title {
  1960. font-size: 28rpx;
  1961. color: #282828;
  1962. }
  1963. .price {
  1964. color: $theme-color;
  1965. font-size: 28rpx;
  1966. text {
  1967. font-size: 20rpx;
  1968. }
  1969. }
  1970. }
  1971. &:nth-child(3n) {
  1972. margin-right: 0;
  1973. }
  1974. }
  1975. }
  1976. }
  1977. }
  1978. .sys-head {
  1979. background: transparent;
  1980. }
  1981. .head-wrapper {
  1982. z-index: 999;
  1983. display: flex;
  1984. align-items: center;
  1985. position: fixed;
  1986. left: 30rpx;
  1987. top: 0;
  1988. /* #ifdef MP */
  1989. height: 43px;
  1990. /* #endif */
  1991. /* #ifdef H5 */
  1992. height: 114rpx;
  1993. /* #endif */
  1994. }
  1995. .head-menu {
  1996. display: flex;
  1997. align-items: center;
  1998. height: 54rpx;
  1999. width: 140rpx;
  2000. background: rgba(0, 0, 0, 0.25);
  2001. border-radius: 27rpx;
  2002. .iconfont {
  2003. flex: 1;
  2004. text-align: center;
  2005. color: #fff;
  2006. box-sizing: border-box;
  2007. &.icon-xiangzuo {
  2008. border-right: 1px solid #fff;
  2009. }
  2010. }
  2011. }
  2012. </style>