goods.vue 122 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386
  1. <template>
  2. <view>
  3. <!-- 展示蒙层 显示推广画报 -->
  4. <view class="poster" v-if="myqr_show">
  5. <view class="title">
  6. <text>推广文案</text>
  7. </view>
  8. <view class="ads">
  9. <view style="width: 480rpx">{{ myqr_ads }}</view>
  10. </view>
  11. <image :src="myqr_url" mode="widthFix" style="width: 480rpx" :show-menu-by-longpress="true"></image>
  12. <view class="tool">
  13. <view @tap="posterCopy" style="text-align: right">
  14. <image class="img" style="width: 110rpx; height: 130rpx" src="/static/images/share/p_copy.png"></image>
  15. </view>
  16. <button open-type="share" class="share-btn">
  17. <image class="img" style="width: 85rpx; height: 127rpx" src="/static/images/share/p_dy.png"></image>
  18. </button>
  19. <view style="text-align: left">
  20. <image class="img" @tap="goSaveQrcode" src="/static/images/share/p_save.png"></image>
  21. </view>
  22. </view>
  23. <view style="text-align: center">
  24. <image class="closeImg" @tap="hidePoster" src="/static/images/share/close.png"></image>
  25. </view>
  26. </view>
  27. <view class="container" :style="'filter:brightness(' + myqr_blur + '%)'">
  28. <image src="/static/images/new/isnew.png" v-if="goods.isNew" class="isNew"></image>
  29. <swiper
  30. class="goodsimgs"
  31. :indicator-dots="goods.gallery.length > 1 ? true : false"
  32. :autoplay="true"
  33. interval="3000"
  34. duration="1000"
  35. indicator-color="rgba(0, 192, 255, .2)"
  36. indicator-active-color="rgba(0, 192, 255)"
  37. >
  38. <swiper-item v-for="(item, index) in goods.gallery" :key="index">
  39. <image :src="item" mode="aspectFill"></image>
  40. </swiper-item>
  41. </swiper>
  42. <!-- 分享
  43. <view class='goods_name'>
  44. <view class='goods_name_left'>{{goods.name}}</view>
  45. <view hidden="{{!canShare}}" class="goods_name_right" bindtap="shareFriendOrCircle">
  46. <image class="img" src="/static/images/share.png" />
  47. </view>
  48. </view>-->
  49. <view class="share-pop-box" v-if="openShare">
  50. <view class="share-pop">
  51. <view class="close" @tap="closeShare">
  52. <!-- <van-icon class="icon" name="cross" /> -->
  53. </view>
  54. <!-- <view class='share-info'>
  55. <button class="sharebtn" open-type="share" wx:if="{{!isGroupon}}">
  56. <image class='sharebtn_image' src='/static/images/wechat.png'></image>
  57. <view class='sharebtn_text'>分享给好友</view>
  58. </button>
  59. <button class="savesharebtn" open-type="openSetting" bindopensetting="handleSetting" wx:if="{{(!isGroupon) && (!canWrite)}}">
  60. <image class='sharebtn_image' src='/static/images/friend.png'></image>
  61. <view class='sharebtn_text'>发朋友圈1</view>
  62. </button>
  63. <button class="savesharebtn" bindtap="saveShare" wx:if="{{!isGroupon && canWrite}}">
  64. <image class='sharebtn_image' src='/static/images/friend.png'></image>
  65. <view class='sharebtn_text'>发朋友圈</view>
  66. </button>
  67. </view>-->
  68. </view>
  69. </view>
  70. <!-- <view class="goods-info">
  71. <view wx:if="{{activited}}" class="activity">
  72. <view style="display: flex;flex-direction: row;justify-content: space-between;">
  73. <view class="img">限时活动</view>
  74. <view class="activityDay">
  75. <image src="https://7a68-zhaijieshi-3guecm78383ca692-1307626841.tcb.qcloud.la/activity/clock.png">
  76. </image>
  77. <text>距离活动仅剩{{activityDay}}天</text>
  78. </view>
  79. </view>
  80. <view style="display: flex;justify-content: space-between;">
  81. <view style="display: flex;">
  82. <view class="activityPrice">¥<text>{{activityPrice}}</text></view>
  83. <view class="activityCounterPrice">原价¥<text>{{goods.counterPrice}}</text></view>
  84. </view>
  85. <view class="activityTime">
  86. <view>{{activityHour}}</view><text>:</text>
  87. <view>{{activityMinute}}</view><text>:</text>
  88. <view>{{activitySecond}}</view>
  89. </view>
  90. </view>
  91. </view>
  92. <view class="c">
  93. <view style="display: flex;flex-direction: column;">
  94. <view wx:if="{{!activited}}" class="price">
  95. <view class="retailPrice">¥<text class="checked-price">{{goods.retailPrice}}</text> </view>
  96. <view wx:if="{{goods.counterPrice!=goods.retailPrice}}" class="counterPrice">
  97. 原价¥<text>{{goods.counterPrice}}</text></view>
  98. </view>
  99. <view class='goods_name'>
  100. <view class='goods_name_left'>{{goods.name}}</view>
  101. </view>
  102. <text class="desc sub-color" wx:if="{{goods.brief}}">{{goods.brief}}</text>
  103. </view>
  104. </view>
  105. </view> -->
  106. <!-- 商品价格 销量 -->
  107. <view class="goods-info-new">
  108. <view class="price-line">
  109. <!-- <view class="real-price">到手价 ¥ <text>{{goods.retailPrice}}</text></view> -->
  110. <view class="real-price">
  111. <text style="padding-bottom: 4rpx">到手价</text>
  112. <text style="font-weight: bold">¥</text>
  113. <text class="bold-price">{{ finallyPrice }}</text>
  114. </view>
  115. <view class="sale-price">原价¥{{ goods.counterPrice }}</view>
  116. <view class="sale-num">已售{{ countSalesNumber }}件</view>
  117. </view>
  118. <view class="goods-coupon" v-if="couponVoList.length > 0">
  119. <view class="goupon-tag" v-for="(item, index) in couponVoList" :key="index">{{ item.tag }}</view>
  120. </view>
  121. </view>
  122. <!-- 购买提醒 -->
  123. <!-- wx:if="{{buyToastShow}}" -->
  124. <view class="buy-toast" v-if="buyToastShow">
  125. <swiper :autoplay="true" :circular="true" interval="3000" duration="1000" :vertical="true" class="toast-swiper">
  126. <swiper-item class="toast-swiper-item" v-for="(item, index) in goodsBuyTime" :key="index">
  127. <view class="toast-item">
  128. <image :src="item.cusHeadImg" mode="aspectFill"></image>
  129. <view>{{ item.comment }}</view>
  130. </view>
  131. </swiper-item>
  132. </swiper>
  133. </view>
  134. <!-- 服务 须知 门店 -->
  135. <view class="other-info">
  136. <view class="name">
  137. {{ goods.name }}
  138. </view>
  139. <view class="common-info">
  140. <view class="info-title">服务</view>
  141. <view class="info-content">
  142. <!-- 专业服务·六区清洁·108项验收标准 -->
  143. {{ goods.serviceStandards }}
  144. </view>
  145. </view>
  146. <view class="common-info">
  147. <view class="info-title">须知</view>
  148. <view class="info-content">
  149. {{ goods.serviceInstructions }}
  150. </view>
  151. <!-- <image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img">
  152. </image> -->
  153. </view>
  154. <view class="common-info">
  155. <view class="info-title">门店</view>
  156. <view class="info-content">全国{{ storeNum }}家门店通用</view>
  157. <!-- <image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img">
  158. </image> -->
  159. </view>
  160. </view>
  161. <!-- 规格 -->
  162. <view class="sku-wrapper" @tap="showSkuPopup" v-if="goods.productType == 2">
  163. <view class="sku-info">
  164. <view class="sku-left">
  165. <view>规格</view>
  166. <view class="current-sku">已选: {{ checkedSku.specifications[0] }}</view>
  167. </view>
  168. <view class="sku-right">
  169. <image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img"></image>
  170. </view>
  171. </view>
  172. <view class="all-sku">
  173. <image :src="item.url" class="sku-thumb" v-for="(item, index) in productList" :key="index"></image>
  174. <view>共{{ specTotalNum }}种规格可选</view>
  175. </view>
  176. </view>
  177. <!-- 加购数量 -->
  178. <view class="num-module" v-if="goods.productType == 3 && goods.unitPrice && goods.unitPrice > 0">
  179. <view class="plus-buy">
  180. <view class="title">加购</view>
  181. <view class="plus-name">
  182. {{ goods.unitDescribe }}
  183. <text>¥{{ goods.unitPrice }}</text>
  184. /{{ goods.unitArea }}
  185. </view>
  186. </view>
  187. <view class="plus-num" style="padding-left: 80rpx">
  188. <view class="title" style="color: #000; width: 160rpx">加购数量</view>
  189. <view class="calc-counter">
  190. <view :class="'minus-btn ' + (plusNum == minNum ? 'disable' : '')" @tap="minusNum">-</view>
  191. <!-- <input class="num-input" bindinput="bindGoodsNumInput" type="number" maxlength="3" placeholder=""
  192. value="{{plusNum}}" /> -->
  193. <view class="num-input">{{ plusNum }}</view>
  194. <view :class="'plus-btn ' + (plusNum >= goods.unitMaximum ? 'disable' : '')" @tap="addNum">+</view>
  195. </view>
  196. </view>
  197. <view style="color: #fe2b54; margin: 8rpx 0 0" :tt-if="plusNum != 0">每份{{ goods.unitArea }},加购{{ plusNum }}份,合计{{ addPurchaseAmount }}元</view>
  198. </view>
  199. <!-- 补差 -->
  200. <view class="num-module" v-if="goods.type == 4">
  201. <view class="plus-num">
  202. <view class="title" style="color: #000; width: 160rpx; text-align: left; display: inline-block">购买数量</view>
  203. <view class="calc-counter">
  204. <view :class="'minus-btn ' + (plusNum == minNum ? 'disable' : '')" @tap="minusNum">-</view>
  205. <!-- <input class="num-input" bindinput="bindGoodsNumInput" type="number" maxlength="3" placeholder=""
  206. value="{{plusNum}}" /> -->
  207. <view class="num-input">{{ plusNum }}</view>
  208. <view :class="'plus-btn ' + (goods.unitMaximum && plusNum >= goods.unitMaximum ? 'disable' : '')" @tap="addNum">+</view>
  209. </view>
  210. </view>
  211. <view style="color: #fe2b54; margin: 8rpx 0 0">购买多份,叠加服务内容和服务时长。</view>
  212. </view>
  213. <!-- 关联工单 -->
  214. <view class="service-list" v-if="goods.type == 4">
  215. <view class="service-item">
  216. <view class="order-title">关联工单</view>
  217. <view class="service-title">
  218. <view class="service-id">工单编号:{{ bookDetail.bookDetailId }}</view>
  219. <view class="service-status">{{ bookDetail.statusName }}</view>
  220. </view>
  221. <view class="service-main">
  222. <view class="customer-info">
  223. <image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-order-map.png"></image>
  224. <view class="customer-main">
  225. <view class="main-line">
  226. <view>{{ bookDetail.consignee }}</view>
  227. <view class="phone">{{ bookDetail.mobile }}</view>
  228. </view>
  229. <view class="customer-address">{{ bookDetail.address }}</view>
  230. </view>
  231. </view>
  232. <view class="row">
  233. <text>上门时段:</text>
  234. {{ bookDetail.bookTime }}
  235. </view>
  236. <view class="row">
  237. <text>预约备注:</text>
  238. {{ bookDetail.message }}
  239. </view>
  240. </view>
  241. <view class="service-remark-wrapper">
  242. <view class="service-store">
  243. <view class="store-left">
  244. <image mode="aspectFit" src="https://jzmall.lifejingzhi.com/file/jzmall-dy/icon-store.png"></image>
  245. <view>{{ bookDetail.fraName }}</view>
  246. </view>
  247. </view>
  248. </view>
  249. </view>
  250. </view>
  251. <!-- 团购评价 -->
  252. <view class="group-evaluation">
  253. <view class="title" @tap="goWholeEval">
  254. <view class="left">团购评价(999+条)</view>
  255. <view class="right">
  256. <view>查看全部</view>
  257. <image src="https://mall.zhaijieshi.cc/file/wx-dy/arrow-grey.png" mode="aspectFit" class="arrow-img"></image>
  258. </view>
  259. </view>
  260. <view class="evaluation-item" v-for="(item, index) in goodsComment" :key="index">
  261. <view class="item-left">
  262. <view class="eval-top">
  263. <image :src="item.cusHeadImg" mode="aspectFill" class="avatar"></image>
  264. <view class="name">{{ item.cusName }}</view>
  265. <view class="tag">{{ item.cusLabel }}</view>
  266. <view class="hp">{{ item.commentType }}</view>
  267. </view>
  268. <view class="eval-content">
  269. {{ item.comment }}
  270. </view>
  271. </view>
  272. <view class="item-right">
  273. <image :src="item.commentImg" mode="aspectFill"></image>
  274. </view>
  275. </view>
  276. </view>
  277. <view class="detail">
  278. <image mode="widthFix" :src="item" v-for="(item, index) in detailList" :key="index"></image>
  279. </view>
  280. <!-- 产品推荐 -->
  281. <view class="recommend-title" v-if="recGoodsList.length > 0">产品推荐</view>
  282. <view class="recommend-list">
  283. <navigator :url="'/pages/goods/goods?id=' + item.id" v-for="(item, index) in recGoodsList" :key="index">
  284. <view class="recommend-item">
  285. <image :src="item.picUrl" mode="aspectFill"></image>
  286. <view class="recommend-goods-name">
  287. {{ item.name }}
  288. </view>
  289. <view class="recommend-goods-price">
  290. ¥
  291. <text>{{ item.retailPrice }}</text>
  292. </view>
  293. </view>
  294. </navigator>
  295. </view>
  296. <!-- 大家都在看
  297. <view class="related-goods" wx:if="{{relatedGoods.length > 0}}">
  298. <view class="h">
  299. <view class="line"></view>
  300. <text class="title">大家都在看</text>
  301. </view>
  302. <view class="b">
  303. <view class="item" wx:for="{{relatedGoods}}" wx:key="id">
  304. <navigator url="/pages/goods/goods?id={{item.id}}">
  305. <image class="img" src="{{item.picUrl}}" background-size="cover"></image>
  306. <text class="name">{{item.name}}</text>
  307. <text class="price">¥{{item.retailPrice}}</text>
  308. </navigator>
  309. </view>
  310. </view>
  311. </view> -->
  312. </view>
  313. <!-- 联系客服
  314. <view class="contact">
  315. <contact-button style="opacity:0;position:absolute;" type="default-dark" session-from="weapp" size="36">
  316. </contact-button>
  317. </view> -->
  318. <!-- 底部按钮 -->
  319. <view class="bottom-btn">
  320. <view class="contact-block">
  321. <button class="contact-btn" open-type="contact">客服</button>
  322. <view class="contact-wrapper">
  323. <image class="contact-img" mode="aspectFit" src="/static/images/online-new.png"></image>
  324. <view class="text">客服</view>
  325. </view>
  326. </view>
  327. <view class="final-price">
  328. <!-- <view class="total-new">¥<text>{{goods.retailPrice}}</text></view>
  329. <view class="total-old">¥{{goods.counterPrice}}</view> -->
  330. <view class="total-new">
  331. ¥
  332. <text>{{ totalPrice }}</text>
  333. </view>
  334. <view class="total-old">¥{{ checkedSku.counterPrice }}</view>
  335. </view>
  336. <!-- <view class="share" bindtap="reSpread" wx:if="{{!soldout||!hasLogin}}">分享</view> -->
  337. <view class="c" @tap="addFast">立即购买</view>
  338. </view>
  339. <!-- sku规格列表 -->
  340. <view class="appoint-overlay-wrapper" @tap="onSkuClose" :tt-if="chooseSkuVisible">
  341. <view class="spu-popup" @tap.stop.prevent="stopClick">
  342. <view class="popup-good">
  343. <view class="left">
  344. <image :src="currentSku.url" mode="aspectFill"></image>
  345. <view class="spu-price">
  346. ¥
  347. <text>{{ currentSku.price }}</text>
  348. </view>
  349. <view class="spu-price-old">¥{{ currentSku.counterPrice }}</view>
  350. </view>
  351. <image src="https://jzmall.lifejingzhi.com/file/jzmall/weixin/sku-close.png" mode="aspectFill" class="sku-close" @tap="onSkuClose"></image>
  352. </view>
  353. <!-- <scroll-view scroll-y="true" class="sku-list-block"> -->
  354. <view class="sku-list-block">
  355. <view class="spu-title">规格</view>
  356. <view style="padding-bottom: 20rpx">
  357. <view
  358. :class="'sku-item ' + (activeSku == item.id ? 'active-sku' : '')"
  359. :data-index="index"
  360. :data-id="item.id"
  361. @tap="selectSku"
  362. v-for="(item, index) in productList"
  363. :key="index"
  364. >
  365. <view>
  366. {{ item.specifications[0] }}
  367. </view>
  368. </view>
  369. </view>
  370. <!-- </scroll-view> -->
  371. <!-- <view class="sku-btn" bindtap="confSku">
  372. 确认
  373. </view> -->
  374. </view>
  375. </view>
  376. </view>
  377. <!-- 自购提示 -->
  378. <!-- <van-overlay show="{{ selfPayShow }}">
  379. <view class="overlay-wrapper">
  380. <view class="tips-wrapper">
  381. <view class="tips-top">
  382. <view class="tips-title">立省金额说明</view>
  383. <view>立省金额会以佣金形式发放,请在引荐人中心查收哦</view>
  384. </view>
  385. <view class="notip-again">
  386. <van-checkbox value="{{selfPayChecked}}" shape="square" icon-size="20px" bind:change="onSelfPayChange" checked-color="#09afff"></van-checkbox>
  387. <text class="user-agree">我已知晓,不再提示</text>
  388. </view>
  389. <view class="tips-bottom">
  390. <view class="cancel-btn" bindtap="cancelSelfPay">取消</view>
  391. <view class="btn-devide"></view>
  392. <view class="repay-btn" bindtap="reSelfPay">继续购买</view>
  393. </view>
  394. </view>
  395. </view>
  396. </van-overlay> -->
  397. <!-- 推广提示 -->
  398. <!-- <van-overlay show="{{spreadPayShow }}">
  399. <view class="overlay-wrapper">
  400. <view class="tips-wrapper">
  401. <view class="tips-top">
  402. <view class="tips-title">推广佣金说明</view>
  403. <view>页面展示推广佣金为预计最高返现金额,实际金额根据购买者团队身份计算,请在引荐人中心查看实际佣金</view>
  404. </view>
  405. <view class="notip-again">
  406. <van-checkbox value="{{spreadPayChecked}}" shape="square" icon-size="20px" bind:change="onSpreadPayChange" checked-color="#09afff"></van-checkbox>
  407. <text class="user-agree">我已知晓,不再提示</text>
  408. </view>
  409. <view class="tips-bottom">
  410. <view class="cancel-btn" bindtap="cancelSpreadPay">取消</view>
  411. <view class="btn-devide"></view>
  412. <view class="repay-btn" bindtap="reSpread">继续推广</view>
  413. </view>
  414. </view>
  415. </view>
  416. </van-overlay> -->
  417. </view>
  418. </template>
  419. <script>
  420. var app = getApp();
  421. // var WxParse = require('../../lib/wxParse/wxParse.js');
  422. var util = require('../../utils/util.js');
  423. var api = require('../../config/api.js');
  424. var user = require('../../utils/user.js');
  425. export default {
  426. data() {
  427. return {
  428. chooseSkuVisible: false,
  429. activeSku: 0,
  430. checkedSku: {
  431. specifications: [],
  432. id: 0,
  433. retailPrice: '',
  434. counterPrice: '',
  435. url: ''
  436. },
  437. currentSku: {
  438. specifications: [],
  439. id: 0,
  440. retailPrice: '',
  441. counterPrice: '',
  442. url: '',
  443. price: ''
  444. },
  445. productList: [],
  446. specTotalNum: '',
  447. buyToastShow: false,
  448. goodsBuyTime: {
  449. cusHeadImg: '',
  450. comment: ''
  451. },
  452. recGoodsList: [],
  453. plusNum: '0',
  454. detailList: [],
  455. detailListAll: [],
  456. countSalesNumber: '',
  457. selfPayShow: false,
  458. selfPayCheck: false,
  459. spreadPayShow: false,
  460. spreadPayChecked: false,
  461. canShare: false,
  462. id: 0,
  463. goods: {
  464. unitMaximum: 1,
  465. isNew: '',
  466. gallery: [],
  467. counterPrice: '',
  468. name: '',
  469. serviceInstructions: '',
  470. productType: 0,
  471. unitPrice: '',
  472. unitArea: '',
  473. type: 0
  474. },
  475. groupon: [],
  476. //该商品支持的团购规格
  477. grouponLink: {},
  478. //参与的团购
  479. attribute: [],
  480. issueList: [],
  481. comment: [],
  482. //brand: {},
  483. specificationList: [],
  484. relatedGoods: [],
  485. cartGoodsCount: 0,
  486. userHasCollect: 0,
  487. number: 1,
  488. checkedSpecText: '规格数量选择',
  489. tmpSpecText: '请选择规格数量',
  490. checkedSpecPrice: 0,
  491. openAttr: false,
  492. openShare: false,
  493. collect: false,
  494. shareImage: '',
  495. isGroupon: false,
  496. //标识是否是一个参团购买
  497. soldout: false,
  498. canWrite: false,
  499. //用户是否获取了保存相册的权限
  500. name_height: 58,
  501. //根据名称长度 设置高度
  502. userInfo: {},
  503. hasLogin: false,
  504. shareId: 0,
  505. //options传递过来的参数 表示是打开哪个分享
  506. wxShareId: 0,
  507. //如果要分享此商品的分享id
  508. addressInfo: {},
  509. rId: 0,
  510. //分享人id,
  511. selfDiscount: 0,
  512. spreadDiscount: 0,
  513. referee: {
  514. self: 0,
  515. share: 0
  516. },
  517. myqr_show: false,
  518. //我的分享二维码
  519. myqr_url: null,
  520. //分享海报及推广语言
  521. myqr_ads: '',
  522. myqr_blur: 100,
  523. //背景模糊值
  524. myqr_bottom_btn: 'fixed',
  525. //底部功能按钮
  526. activited: false,
  527. //是否活动中
  528. activityPrice: 0,
  529. //活动价格
  530. activityTime: 89646,
  531. //活动倒计时总计时间 (整型 秒)
  532. activityDay: 0,
  533. //活动天数
  534. activityHour: 0,
  535. //活动小时
  536. activityMinute: 0,
  537. //活动分钟
  538. activitySecond: 0,
  539. //活动秒
  540. activityTimer: null,
  541. //定时器
  542. code: '',
  543. //抖音登录code
  544. isCommiting: false,
  545. //是否提交中 防止多次提交
  546. //以下是支付使用参数
  547. openId: '',
  548. checkedAddress: '',
  549. actualPrice: '',
  550. couponPrice: '',
  551. addressId: '',
  552. couponId: '',
  553. userCouponId: '',
  554. mobile: '',
  555. couponVoList: [],
  556. //优惠券列表
  557. finallyPrice: '',
  558. storeNum: '267',
  559. totalPrice: '',
  560. addPurchaseAmount: 0,
  561. addPurchase: [],
  562. serviceId: '',
  563. bookDetail: {
  564. bookDetailId: '',
  565. statusName: '',
  566. consignee: '',
  567. mobile: '',
  568. address: '',
  569. fraName: ''
  570. },
  571. minNum: 0,
  572. goodsComment: '',
  573. selfPayChecked: ''
  574. };
  575. }, // 页面分享
  576. onShareAppMessage: function () {
  577. let that = this;
  578. if (!app.globalData.hasLogin) {
  579. uni.navigateTo({
  580. url: '/pages/auth/login/login'
  581. });
  582. return;
  583. }
  584. //获取分享id 用来追踪链接
  585. //引荐人和非引荐人的 链接不同
  586. let imgUrl = that.goods.shareWxUrl ? that.goods.shareWxUrl : that.goods.gallery[0];
  587. var path = '/pages/goods/goods?id=' + that.id + '&rId=' + that.userInfo.id;
  588. if (that.userInfo.isDis) {
  589. //是引荐人
  590. path = '/pages/goods/goods?id=' + that.id + '&shareId=' + that.wxShareId;
  591. }
  592. this.hidePoster();
  593. return {
  594. title: that.goods.name + '\n' + that.myqr_ads,
  595. path: path,
  596. imageUrl: imgUrl
  597. };
  598. },
  599. onLoad: function (options) {
  600. console.log(options);
  601. // 页面初始化 options为页面跳转所带来的参数
  602. var addressInfo = uni.getStorageSync('addressInfo');
  603. if (addressInfo) {
  604. this.setData({
  605. addressInfo: addressInfo
  606. });
  607. }
  608. var openId = uni.getStorageSync('openId');
  609. if (openId) {
  610. this.setData({
  611. openId: openId
  612. });
  613. } else {
  614. //openid为空 需要去获取
  615. this.getUserOpenId();
  616. }
  617. if (options.rId) {
  618. this.setData({
  619. rId: parseInt(options.rId)
  620. });
  621. }
  622. if (options.shareId) {
  623. this.setData({
  624. shareId: parseInt(options.shareId)
  625. });
  626. }
  627. if (options.id) {
  628. this.setData({
  629. id: parseInt(options.id)
  630. });
  631. this.getGoodsInfo();
  632. }
  633. // 补差产品扫二维码进入
  634. if (options.service_id) {
  635. this.setData({
  636. id: parseInt(options.goods_id),
  637. serviceId: options.service_id
  638. });
  639. this.getGoodsInfo();
  640. }
  641. this.getStore();
  642. },
  643. onShow: function () {
  644. if (app.globalData.hasLogin) {
  645. let userInfo = uni.getStorageSync('userInfo');
  646. app.globalData.userInfo = userInfo;
  647. this.setData({
  648. userInfo: userInfo,
  649. hasLogin: true
  650. });
  651. }
  652. },
  653. onHide: function () {
  654. // 页面隐藏
  655. clearInterval(this.activityTimer);
  656. },
  657. onUnload: function () {
  658. // 页面关闭
  659. clearInterval(this.activityTimer);
  660. },
  661. onReady: function () {
  662. // 页面渲染完成
  663. },
  664. onReachBottom: function () {
  665. console.info('reachbottom');
  666. let detailListAll = this.detailListAll;
  667. let detailList = this.detailList;
  668. //console.info(detailList)
  669. if (detailListAll.length > detailList.length) {
  670. // detailListAll = detailListAll.splice(1);
  671. detailList.push(detailListAll[detailList.length]);
  672. this.setData({
  673. detailList: detailList
  674. // detailListAll: detailListAll
  675. });
  676. }
  677. },
  678. methods: {
  679. goCustomerService() {
  680. //跳转微信客服
  681. console.info('goCustomerService');
  682. uni.openCustomerServiceChat({
  683. extInfo: {
  684. url: 'https://work.weixin.qq.com/kfid/kfc1fcfae84340d5125'
  685. },
  686. corpId: 'ww034f0b524f8ead00',
  687. success(res) {},
  688. fail(res) {
  689. console.info(res);
  690. }
  691. });
  692. },
  693. shareFriendOrCircle: function () {
  694. if (!app.globalData.hasLogin) {
  695. uni.navigateTo({
  696. url: '/pages/auth/login/login'
  697. });
  698. return;
  699. }
  700. //分享 弹出图片
  701. let that = this;
  702. uni.removeStorageSync(String(that.goods.id));
  703. //取出本地缓存中的分享图
  704. // let sUrl=wx.getStorageSync(String(that.data.goods.id));
  705. // if(sUrl!=null&&sUrl!=""){//获取过的分享图 不需要再次获取
  706. // that.setData({
  707. // myqr_url:sUrl,
  708. // myqr_show:true,
  709. // myqr_blur:5
  710. // });
  711. // return;
  712. // }
  713. uni.showLoading({
  714. title: '生成中'
  715. });
  716. util.request(api.QrGoodsCodeCreate, {
  717. goodsId: that.goods.id
  718. }).then(function (res) {
  719. uni.hideLoading();
  720. if (res.errno == 0) {
  721. that.setData({
  722. myqr_url: res.data.imgUrl,
  723. myqr_show: true,
  724. myqr_blur: 5
  725. });
  726. //保存分享图url到本地缓存
  727. // wx.setStorageSync(String(that.data.goods.id),res.data.imgUrl);
  728. } else if (res.errno == 501) {
  729. uni.navigateTo({
  730. url: '/pages/auth/login/login'
  731. });
  732. } else {
  733. uni.showToast({
  734. title: res.errmsg,
  735. duration: 5000
  736. });
  737. }
  738. });
  739. //var that = this;
  740. /*if (this.data.openShare === false) {
  741. this.setData({
  742. openShare: !this.data.openShare
  743. });
  744. } else {
  745. return false;
  746. }*/
  747. },
  748. /**活动剩余时间 格式化 */
  749. handleActivityTime() {
  750. let that = this;
  751. let interval = setInterval(function () {
  752. if (that.activityTime <= 1) {
  753. return;
  754. }
  755. let activityTime = that.activityTime;
  756. let day = parseInt(activityTime / 86400);
  757. let hour = parseInt((activityTime % 86400) / 3600);
  758. console.info((activityTime % 86400) % 3600);
  759. let minte = parseInt(((activityTime % 86400) % 3600) / 60);
  760. let second = parseInt(((activityTime % 86400) % 3600) % 60);
  761. that.setData({
  762. activityDay: day,
  763. activityHour: hour < 10 ? '0' + hour.toString() : hour.toString(),
  764. activityMinute: minte < 10 ? '0' + minte.toString() : minte.toString(),
  765. activitySecond: second < 10 ? '0' + second.toString() : second.toString(),
  766. activityTime: activityTime - 1
  767. });
  768. }, 1000);
  769. that.setData({
  770. activityTimer: interval
  771. });
  772. },
  773. handleSetting: function (e) {
  774. var that = this;
  775. // console.log(e)
  776. if (!e.detail.authSetting['scope.writePhotosAlbum']) {
  777. uni.showModal({
  778. title: '警告',
  779. content: '不授权无法保存',
  780. showCancel: false
  781. });
  782. that.setData({
  783. canWrite: false
  784. });
  785. } else {
  786. uni.showToast({
  787. title: '保存成功'
  788. });
  789. that.setData({
  790. canWrite: true
  791. });
  792. }
  793. },
  794. // 保存分享图
  795. saveShare: function () {
  796. let that = this;
  797. uni.showLoading({
  798. title: '图片保存中'
  799. });
  800. console.log(that);
  801. uni.downloadFile({
  802. url: that.myqr_url,
  803. success: function (res) {
  804. console.log(res);
  805. uni.saveImageToPhotosAlbum({
  806. filePath: res.tempFilePath,
  807. success: function (res) {
  808. uni.hideLoading();
  809. uni.showModal({
  810. title: '存图成功',
  811. content: '图片成功保存到相册了,可以分享到朋友圈了',
  812. showCancel: false,
  813. confirmText: '好的',
  814. confirmColor: '#a78845',
  815. success: function (res) {
  816. if (res.confirm) {
  817. console.log('用户点击确定');
  818. that.setData({
  819. myqr_show: false,
  820. myqr_blur: 0
  821. });
  822. }
  823. }
  824. });
  825. },
  826. fail: function (res) {
  827. uni.hideLoading();
  828. uni.showModal({
  829. title: '警告',
  830. content: '不授权无法保存',
  831. showCancel: false
  832. });
  833. that.setData({
  834. myqr_show: false,
  835. myqr_blur: 0
  836. });
  837. }
  838. });
  839. },
  840. fail: function (res) {
  841. uni.hideLoading();
  842. console.log(res);
  843. }
  844. });
  845. },
  846. // 获取商品信息
  847. getGoodsInfo: function () {
  848. let that = this;
  849. let params = {
  850. id: that.id,
  851. rId: that.rId
  852. };
  853. if (this.serviceId) {
  854. params = {
  855. id: that.id,
  856. rId: that.rId,
  857. serviceId: that.serviceId
  858. };
  859. }
  860. console.info('1-》getGoodsInfo start');
  861. util.request(api.GoodsDetail, params).then(function (res) {
  862. console.info('2-》getGoodsInfo end');
  863. console.info(res);
  864. if (res.errno === 0) {
  865. //设置显示名称的控件高度
  866. // let height = 56;
  867. // if (res.data.info.name.length > 17 & res.data.info.name.length < 36) height = 76;
  868. // else if (res.data.info.name.length >= 36) height = 116;
  869. let goodsComment = res.data.goodsComment;
  870. let list = [];
  871. if (goodsComment) {
  872. goodsComment.forEach((item) => {
  873. let obj = item;
  874. if (item.commentImgs) {
  875. let img = item.commentImgs.split(',');
  876. if (img.length >= 1) {
  877. obj.commentImg = img[0];
  878. } else {
  879. obj.commentImg = '';
  880. }
  881. }
  882. list.push(obj);
  883. });
  884. }
  885. let checkedSku = {};
  886. if (res.data.info.productType == 3) {
  887. let plusInit = res.data.productList.filter((pro) => {
  888. return pro.unitIncreaseNumber == 0;
  889. });
  890. if (plusInit.length >= 1) {
  891. checkedSku = plusInit[0];
  892. }
  893. } else {
  894. checkedSku = res.data.productList[0];
  895. }
  896. if (res.data.info.type == 4) {
  897. that.setData({
  898. plusNum: 1,
  899. minNum: 1
  900. });
  901. }
  902. that.setData({
  903. goods: res.data.info,
  904. detailList: res.data.info.detail == '' || res.data.info.detail == null ? [] : [res.data.info.detail.split(',')[0]],
  905. detailListAll: res.data.info.detail == '' || res.data.info.detail == null ? [] : res.data.info.detail.split(','),
  906. // attribute: res.data.attribute,
  907. // issueList: res.data.issue,
  908. // comment: res.data.comment,
  909. //brand: res.data.brand,
  910. specificationList: res.data.specificationList,
  911. userHasCollect: res.data.userHasCollect,
  912. shareImage: res.data.shareImage,
  913. checkedSpecPrice: res.data.info.retailPrice,
  914. countSalesNumber: res.data.countSalesNumber,
  915. // canShare: res.data.share,
  916. // name_height: height,
  917. wxShareId: res.data.shareId,
  918. activited: res.data.activited,
  919. activityTime: res.data.activityTime,
  920. activityPrice: res.data.activityPrice,
  921. productList: res.data.productList,
  922. specTotalNum: res.data.productList.length,
  923. goodsComment: list,
  924. buyToastShow: true,
  925. goodsBuyTime: res.data.goodsBuyTime,
  926. // checkedSku:res.data.productList[0],
  927. // currentSku:res.data.productList[0],
  928. checkedSku: checkedSku,
  929. currentSku: checkedSku,
  930. recGoodsList: res.data.recGoodsList,
  931. finallyPrice: Number(res.data.info.retailPrice).toFixed(2),
  932. // addPurchase:res.data.addPurchase,
  933. bookDetail: res.data.bookDetail
  934. });
  935. that.getMaxCoupon();
  936. // setTimeout(()=>{
  937. // that.setData({
  938. // buyToastShow:true
  939. // });
  940. // },200);
  941. // setTimeout(()=>{
  942. // that.setData({
  943. // buyToastShow:false
  944. // })
  945. // },3200);
  946. if (res.data.activited) {
  947. that.handleActivityTime();
  948. }
  949. if (res.data.userHasCollect == 1) {
  950. that.setData({
  951. collect: true
  952. });
  953. } else {
  954. that.setData({
  955. collect: false
  956. });
  957. }
  958. // WxParse.wxParse('goodsDetail', 'html', res.data.info.detail, that);
  959. //获取推荐商品
  960. //that.getGoodsRelated();
  961. }
  962. });
  963. },
  964. // 获取推荐商品
  965. getGoodsRelated: function () {
  966. let that = this;
  967. util.request(api.GoodsRelated, {
  968. id: that.id,
  969. shopId: this.addressInfo.shopId
  970. }).then(function (res) {
  971. if (res.errno === 0) {
  972. that.setData({
  973. relatedGoods: res.data.list
  974. });
  975. }
  976. });
  977. },
  978. // 规格选择
  979. clickSkuValue: function (event) {
  980. let that = this;
  981. let specName = event.currentTarget.dataset.name;
  982. let specValueId = event.currentTarget.dataset.valueId;
  983. //判断是否可以点击
  984. //TODO 性能优化,可在wx:for中添加index,可以直接获取点击的属性名和属性值,不用循环
  985. let _specificationList = this.specificationList;
  986. for (let i = 0; i < _specificationList.length; i++) {
  987. if (_specificationList[i].name === specName) {
  988. for (let j = 0; j < _specificationList[i].valueList.length; j++) {
  989. if (_specificationList[i].valueList[j].id == specValueId) {
  990. //如果已经选中,则反选
  991. if (_specificationList[i].valueList[j].checked) {
  992. _specificationList[i].valueList[j].checked = false;
  993. } else {
  994. _specificationList[i].valueList[j].checked = true;
  995. }
  996. } else {
  997. _specificationList[i].valueList[j].checked = false;
  998. }
  999. }
  1000. }
  1001. }
  1002. this.setData({
  1003. specificationList: _specificationList
  1004. });
  1005. //重新计算spec改变后的信息
  1006. this.changeSpecInfo();
  1007. //重新计算哪些值不可以点击
  1008. },
  1009. //获取选中的规格信息
  1010. getCheckedSpecValue: function () {
  1011. let checkedValues = [];
  1012. let _specificationList = this.specificationList;
  1013. for (let i = 0; i < _specificationList.length; i++) {
  1014. let _checkedObj = {
  1015. name: _specificationList[i].name,
  1016. valueId: 0,
  1017. valueText: ''
  1018. };
  1019. for (let j = 0; j < _specificationList[i].valueList.length; j++) {
  1020. if (_specificationList[i].valueList[j].checked) {
  1021. _checkedObj.valueId = _specificationList[i].valueList[j].id;
  1022. _checkedObj.valueText = _specificationList[i].valueList[j].value;
  1023. }
  1024. }
  1025. checkedValues.push(_checkedObj);
  1026. }
  1027. return checkedValues;
  1028. },
  1029. //判断规格是否选择完整
  1030. isCheckedAllSpec: function () {
  1031. return !this.getCheckedSpecValue().some(function (v) {
  1032. if (v.valueId == 0) {
  1033. return true;
  1034. }
  1035. });
  1036. },
  1037. getCheckedSpecKey: function () {
  1038. let checkedValue = this.getCheckedSpecValue().map(function (v) {
  1039. return v.valueText;
  1040. });
  1041. return checkedValue;
  1042. },
  1043. // 规格改变时,重新计算价格及显示信息
  1044. changeSpecInfo: function () {
  1045. let checkedNameValue = this.getCheckedSpecValue();
  1046. //设置选择的信息
  1047. let checkedValue = checkedNameValue
  1048. .filter(function (v) {
  1049. if (v.valueId != 0) {
  1050. return true;
  1051. } else {
  1052. return false;
  1053. }
  1054. })
  1055. .map(function (v) {
  1056. return v.valueText;
  1057. });
  1058. if (checkedValue.length > 0) {
  1059. this.setData({
  1060. tmpSpecText: checkedValue.join(' ')
  1061. });
  1062. } else {
  1063. this.setData({
  1064. tmpSpecText: '请选择规格数量'
  1065. });
  1066. }
  1067. if (this.isCheckedAllSpec()) {
  1068. this.setData({
  1069. checkedSpecText: this.tmpSpecText
  1070. });
  1071. // 规格所对应的货品选择以后
  1072. let checkedProductArray = this.getCheckedProductItem(this.getCheckedSpecKey());
  1073. if (!checkedProductArray || checkedProductArray.length <= 0) {
  1074. this.setData({
  1075. soldout: true
  1076. });
  1077. console.error('规格所对应货品不存在');
  1078. return;
  1079. }
  1080. let checkedProduct = checkedProductArray[0];
  1081. if (checkedProduct.number > 0) {
  1082. this.setData({
  1083. checkedSpecPrice: checkedProduct.price,
  1084. soldout: false
  1085. });
  1086. } else {
  1087. this.setData({
  1088. checkedSpecPrice: this.goods.retailPrice,
  1089. soldout: true
  1090. });
  1091. }
  1092. } else {
  1093. this.setData({
  1094. checkedSpecText: '规格数量选择',
  1095. checkedSpecPrice: this.goods.retailPrice,
  1096. soldout: false
  1097. });
  1098. }
  1099. },
  1100. // 获取选中的产品(根据规格)
  1101. getCheckedProductItem: function (key) {
  1102. return this.productList.filter(function (v) {
  1103. if (v.specifications.toString() == key.toString()) {
  1104. return true;
  1105. } else {
  1106. return false;
  1107. }
  1108. });
  1109. },
  1110. //添加或是取消收藏
  1111. addCollectOrNot: function () {
  1112. let that = this;
  1113. util.request(
  1114. api.CollectAddOrDelete,
  1115. {
  1116. type: 0,
  1117. valueId: this.id
  1118. },
  1119. 'POST'
  1120. ).then(function (res) {
  1121. if (that.userHasCollect == 1) {
  1122. that.setData({
  1123. collect: false,
  1124. userHasCollect: 0
  1125. });
  1126. } else {
  1127. that.setData({
  1128. collect: true,
  1129. userHasCollect: 1
  1130. });
  1131. }
  1132. });
  1133. },
  1134. //立即购买(先自动加入购物车)
  1135. async addFast() {
  1136. var that = this;
  1137. //如果是买约一体商品 必须授权登录
  1138. if (that.goods.type != 3 && that.hasLogin == false) {
  1139. uni.navigateTo({
  1140. url: '/pages/auth/login/login'
  1141. });
  1142. return;
  1143. }
  1144. //防止多次提交
  1145. if (that.isCommiting) {
  1146. return;
  1147. }
  1148. that.setData({
  1149. isCommiting: true
  1150. });
  1151. let boo = await this.checkGoods();
  1152. console.info(boo);
  1153. if (!boo) {
  1154. that.setData({
  1155. isCommiting: false
  1156. });
  1157. return;
  1158. }
  1159. //不用加购物车 直接跳转
  1160. app.globalData.infoGoods = {
  1161. name: that.goods.name,
  1162. brief: that.goods.brief,
  1163. picUrl: that.goods.picUrl,
  1164. type: that.goods.type,
  1165. id: that.goods.id
  1166. };
  1167. //20230523对于买约分离的商品 不用提单页 直接结算
  1168. if (that.goods.type == 3 || that.goods.type == 4) {
  1169. console.info('直接拉起支付');
  1170. that.checkoutInfo();
  1171. return;
  1172. }
  1173. uni.setStorageSync('cartId', 0);
  1174. uni.setStorageSync('goodsId', that.goods.id);
  1175. uni.navigateTo({
  1176. url: '/pages/checkout/checkout'
  1177. });
  1178. that.setData({
  1179. isCommiting: false
  1180. });
  1181. },
  1182. async checkGoods() {
  1183. let boo = true;
  1184. let that = this;
  1185. //console.info(code);
  1186. await util
  1187. .request(
  1188. api.OrderCheckGoods,
  1189. {
  1190. goodsId: this.goods.id,
  1191. openId: this.openId,
  1192. productId: this.checkedSku.id,
  1193. unitIncreaseNumber: this.plusNum
  1194. // bookDetailId:this.data.bookDetail.bookDetailId
  1195. },
  1196. 'GET'
  1197. )
  1198. .then(function (res) {
  1199. console.info(res);
  1200. if (res.data && res.data.user) {
  1201. app.globalData.hasLogin = true;
  1202. app.globalData.userInfo = res.data.user.userInfo;
  1203. uni.setStorageSync('userInfo', res.data.user.userInfo);
  1204. uni.setStorageSync('token', res.data.user.token);
  1205. }
  1206. //弹出框信息
  1207. if (res.errno != 0) {
  1208. util.showErrorToast(res.errmsg);
  1209. } else if (res.data.code === 1) {
  1210. //存在未付款订单 直接拉起支付
  1211. that.setData({
  1212. actualPrice: res.data.actualPrice
  1213. });
  1214. that.continueToPay(res.data.orderSn);
  1215. boo = false;
  1216. //that.showMyModel(res.data.msg, that);
  1217. } else if (res.data.code === 2) {
  1218. boo = false;
  1219. //新客初体验商品,每个客户只有1次机会哦~
  1220. uni.showModal({
  1221. title: '提醒',
  1222. content: res.data.msg + ',再次购买178元每单',
  1223. confirmText: '去购买',
  1224. success(ress) {
  1225. if (ress.confirm) {
  1226. uni.navigateTo({
  1227. url: '/pages/goods/goods?id=1190504'
  1228. });
  1229. }
  1230. }
  1231. });
  1232. }
  1233. });
  1234. return boo;
  1235. },
  1236. async getStore() {
  1237. let res = await util.request(api.allStore, {}, 'GET');
  1238. if (res.errno == 0) {
  1239. console.log(res);
  1240. this.setData({
  1241. storeNum: res.data.count
  1242. });
  1243. }
  1244. },
  1245. async getMaxCoupon() {
  1246. if (this.openId) {
  1247. let res = await util.request(
  1248. api.selectMaxCoupon,
  1249. {
  1250. goodsId: this.goods.id,
  1251. openId: this.openId
  1252. },
  1253. 'GET'
  1254. );
  1255. console.log(res);
  1256. if (res.errno == 0) {
  1257. this.setData({
  1258. couponPrice: res.data.couponPrice,
  1259. couponId: res.data.couponId,
  1260. userCouponId: res.data.userCouponId,
  1261. couponVoList: res.data.couponVoList,
  1262. finallyPrice: Number(this.checkedSku.price - res.data.couponPrice).toFixed(2)
  1263. });
  1264. this.setData({
  1265. totalPrice: this.finallyPrice
  1266. });
  1267. }
  1268. } else {
  1269. await this.getUserOpenId();
  1270. let res = await util.request(
  1271. api.selectMaxCoupon,
  1272. {
  1273. productId: this.checkedSku.id,
  1274. openId: this.openId
  1275. },
  1276. 'GET'
  1277. );
  1278. console.log(res);
  1279. if (res.errno == 0) {
  1280. this.setData({
  1281. couponPrice: res.data.couponPrice,
  1282. couponId: res.data.couponId,
  1283. userCouponId: res.data.userCouponId,
  1284. couponVoList: res.data.couponVoList,
  1285. finallyPrice: Number(this.checkedSku.price - res.data.counterPrice).toFixed(2)
  1286. });
  1287. this.setData({
  1288. totalPrice: this.finallyPrice
  1289. });
  1290. }
  1291. }
  1292. },
  1293. checkoutInfo() {
  1294. let that = this;
  1295. util.request(api.CartCheckout, {
  1296. cartId: 0,
  1297. addressId: 0,
  1298. couponId: that.couponId,
  1299. userCouponId: that.userCouponId,
  1300. goodsId: that.goods.id,
  1301. openId: that.openId,
  1302. productId: this.checkedSku.id,
  1303. unitIncreaseNumber: this.plusNum
  1304. }).then(function (res) {
  1305. if (res.errno === 0) {
  1306. console.info(res);
  1307. that.setData({
  1308. checkedAddress: res.data.checkedAddress,
  1309. actualPrice: res.data.actualPrice,
  1310. couponPrice: res.data.couponPrice,
  1311. addressId: res.data.addressId,
  1312. couponId: res.data.couponId,
  1313. userCouponId: res.data.userCouponId,
  1314. mobile: res.data.mobile
  1315. });
  1316. //提交订单
  1317. that.submitOrder();
  1318. that.setData({
  1319. isCommiting: false
  1320. });
  1321. }
  1322. });
  1323. },
  1324. submitOrder() {
  1325. //直接拉起支付
  1326. let that = this;
  1327. util.request(api.OrderPrepay, {
  1328. addressId: 0,
  1329. shopId: 0,
  1330. cart: 0,
  1331. goodsId: that.goods.id,
  1332. couponId: that.couponId,
  1333. userCouponId: that.userCouponId,
  1334. productId: that.checkedSku.id
  1335. })
  1336. .then(function (res) {
  1337. if (res.errno === 0) {
  1338. var callbackData = {
  1339. cartId: null,
  1340. addressId: 0,
  1341. couponId: that.couponId,
  1342. userCouponId: that.userCouponId,
  1343. orderDate: {
  1344. goodId: that.goods.id,
  1345. productId: that.checkedSku.id
  1346. // bookDetailId:that.data.serviceId,
  1347. // originalOrderId:that.data.bookDetail.originalOrderId,
  1348. // unitIncreaseNumber:that.data.plusNum
  1349. },
  1350. phone_num: that.mobile,
  1351. userId: that.userInfo ? that.userInfo.id : '',
  1352. unitIncreaseNumber: that.plusNum,
  1353. dyversion: '20230725'
  1354. };
  1355. uni.showLoading({
  1356. title: '加载中'
  1357. });
  1358. console.info(callbackData);
  1359. uni.createOrder({
  1360. skuList: res.data.skuList,
  1361. payment: res.data.payment,
  1362. callbackData: callbackData,
  1363. callbackUrl: res.data.callbackUrl,
  1364. success: (res) => {
  1365. uni.hideLoading();
  1366. console.log('预下单成功11');
  1367. console.log(res);
  1368. const { orderId, outOrderNo } = res;
  1369. console.log('success res', res, 'orderId', orderId, 'outOrderNo', outOrderNo);
  1370. //如果是静默状态未登录 开始授权登录
  1371. if (!app.globalData.hasLogin) {
  1372. user.getLoginInfo(outOrderNo).then((resUser) => {
  1373. if (resUser.errno == 0) {
  1374. app.globalData.hasLogin = true;
  1375. app.globalData.userInfo = resUser.data.userInfo;
  1376. uni.setStorageSync('userInfo', resUser.data.userInfo);
  1377. uni.setStorageSync('token', resUser.data.token);
  1378. }
  1379. });
  1380. }
  1381. uni.redirectTo({
  1382. url: '/pages/checkout/payResult/payResult?status=1&outOrderNo=' + outOrderNo + '&actualPrice=' + that.actualPrice
  1383. });
  1384. },
  1385. fail: (res) => {
  1386. uni.hideLoading();
  1387. console.log('预下单失败11');
  1388. console.log(res);
  1389. const { orderId, outOrderNo, errNo, errMsg, errLogId } = res;
  1390. if (errLogId) {
  1391. console.log('预下单失败', errNo, errMsg, errLogId);
  1392. let tomsg = errMsg;
  1393. if (tomsg.indexOf('createOrder') != -1) {
  1394. tomsg = tomsg.replace('createOrder:fail 开发者限购:', '');
  1395. tomsg = tomsg.replace('createOrder:fail 开发者拒绝交易:', '');
  1396. tomsg = tomsg.replace('createOrder:fail', '');
  1397. }
  1398. uni.showModal({
  1399. title: '提示',
  1400. content: tomsg,
  1401. showCancel: false
  1402. });
  1403. }
  1404. if (orderId || outOrderNo) {
  1405. uni.navigateTo({
  1406. url: '/pages/ucenter/orderDetail/orderDetail?id=' + outOrderNo
  1407. });
  1408. console.log('支付失败', errNo, errMsg, orderId, outOrderNo);
  1409. // that.setData({
  1410. // payFailShow: true
  1411. // });
  1412. }
  1413. console.log(errNo, errMsg);
  1414. }
  1415. });
  1416. } else {
  1417. uni.showModal({
  1418. title: '提醒',
  1419. showCancel: false,
  1420. content: res.errmsg
  1421. });
  1422. }
  1423. })
  1424. .catch((res) => {
  1425. uni.hideLoading();
  1426. util.showErrorToast(res.errmsg);
  1427. });
  1428. },
  1429. continueToPay(outOrderNo) {
  1430. //已有订单重复提交
  1431. let that = this;
  1432. uni.continueToPay({
  1433. outOrderNo: outOrderNo,
  1434. // 外部订单号 2个订单号必填一个
  1435. success: (res) => {
  1436. console.log(res);
  1437. const { orderId, outOrderNo } = res;
  1438. console.log('success res', res);
  1439. console.log('orderId', orderId, 'outOrderNo', outOrderNo);
  1440. uni.redirectTo({
  1441. url: '/pages/checkout/payResult/payResult?status=1&outOrderNo=' + outOrderNo + '&actualPrice=' + that.actualPrice
  1442. });
  1443. },
  1444. fail: (res) => {
  1445. console.log(res);
  1446. const { orderId, outOrderNo, errNo, errMsg, errLogId } = res;
  1447. if (errLogId) {
  1448. console.log('查询订单信息失败', errNo, errMsg, errLogId);
  1449. }
  1450. if (orderId || outOrderNo) {
  1451. console.log('支付失败', errNo, errMsg, orderId, outOrderNo);
  1452. console.log('订单号' + outOrderNo);
  1453. uni.navigateTo({
  1454. url: '/pages/ucenter/orderDetail/orderDetail?id=' + outOrderNo
  1455. });
  1456. }
  1457. // util.showErrorToast('放弃支付');
  1458. }
  1459. });
  1460. },
  1461. async getUserOpenId() {
  1462. let that = this;
  1463. let res = await user.userOpenId();
  1464. console.log(res);
  1465. that.setData({
  1466. openId: res.data
  1467. });
  1468. console.info(res);
  1469. uni.setStorageSync('openId', res.data);
  1470. // .then(res => {
  1471. // that.setData({
  1472. // openId: res.data
  1473. // })
  1474. // console.info(res)
  1475. // wx.setStorageSync('openId', res.data);
  1476. // });
  1477. },
  1478. gofastAddCart() {
  1479. var that = this;
  1480. //提示选择完整规格
  1481. // if (!this.isCheckedAllSpec()) {
  1482. // util.showErrorToast('请选择完整规格');
  1483. // return false;
  1484. // }
  1485. //根据选中的规格,判断是否有对应的sku信息
  1486. // let checkedProductArray = this.getCheckedProductItem(this.getCheckedSpecKey());
  1487. // if (!checkedProductArray || checkedProductArray.length <= 0) {
  1488. // //找不到对应的product信息,提示没有库存
  1489. // util.showErrorToast('没有库存');
  1490. // return false;
  1491. // }
  1492. // let checkedProduct = checkedProductArray[0];
  1493. // //验证库存
  1494. // if (checkedProduct.number <= 0) {
  1495. // util.showErrorToast('没有库存');
  1496. // return false;
  1497. // }
  1498. //立即购买
  1499. // util.request(api.CartFastAdd, {
  1500. // goodsId: this.data.goods.id,
  1501. // number: this.data.number,
  1502. // productId: checkedProduct.id,
  1503. // shareId: this.data.shareId
  1504. // }, "POST").then(res => {
  1505. // if (res.errno == 0) {
  1506. // 如果storage中设置了cartId,则是立即购买,否则是购物车购买
  1507. try {
  1508. // wx.setStorageSync('cartId', res.data);
  1509. // wx.setStorageSync('grouponRulesId', checkedGroupon.id);
  1510. // wx.setStorageSync('grouponLinkId', that.data.grouponLink.id);
  1511. // 支付结果页面展示图片用
  1512. app.globalData.infoGoods = {
  1513. name: this.goods.name,
  1514. brief: this.goods.brief,
  1515. picUrl: this.goods.picUrl,
  1516. type: this.goods.type
  1517. };
  1518. uni.setStorageSync('cartId', 0);
  1519. uni.setStorageSync('goodsId', this.goods.id);
  1520. console.info(that.shareId);
  1521. if (that.shareId > 0) {
  1522. uni.navigateTo({
  1523. url: '/pages/checkout/checkout?shareId=' + that.shareId
  1524. });
  1525. } else {
  1526. uni.navigateTo({
  1527. url: '/pages/checkout/checkout'
  1528. });
  1529. }
  1530. } catch (e) {
  1531. console.log('CatchClause', e);
  1532. console.log('CatchClause', e);
  1533. console.info(e);
  1534. }
  1535. // } else {
  1536. // util.showErrorToast(res.errmsg);
  1537. // }
  1538. // });
  1539. },
  1540. getdefalutUserAddress() {
  1541. //登陆拿用户默认地址,如果没有就拿系统默认地址
  1542. //如果有默认地址,但是不在门店服务区域里
  1543. util.request(api.OrderBookDefaultAddress, {}, 'get').then((res) => {
  1544. if (res.errno === 0) {
  1545. let address = res.data;
  1546. var city = address.city.indexOf('市辖') != -1 ? address.province : address.city;
  1547. //通过jz_shop的shop_no关联服务力分配的门店id,拿实际的jz_shop的门店id
  1548. var addresInfo = {
  1549. city: city,
  1550. lng: address.lng,
  1551. lat: address.lat,
  1552. shopId: address.shopId,
  1553. address: address.addressDetail,
  1554. shopName: address.shopName
  1555. };
  1556. uni.setStorageSync('addressInfo', addresInfo);
  1557. } else {
  1558. //无默认地址时 拿系统的
  1559. this.getdefaultCityShop();
  1560. }
  1561. });
  1562. },
  1563. getdefaultCityShop() {
  1564. let that = this;
  1565. util.request(api.getDefaultCityShop, {}, 'get').then((res) => {
  1566. if (res.errno === 0) {
  1567. uni.setStorageSync('addressInfo', res.data);
  1568. }
  1569. });
  1570. },
  1571. showMyModel(msg, that) {
  1572. uni.showModal({
  1573. title: '',
  1574. content: msg,
  1575. confirmText: '去处理',
  1576. cancelText: '取消',
  1577. success: function (res) {
  1578. //此商品有个未支付的订单,请到订单页去支付或取消重新下单。
  1579. //去处理:跳转订单页
  1580. if (res.confirm) {
  1581. try {
  1582. uni.setStorageSync('tab', 1);
  1583. } catch (e) {
  1584. console.log('CatchClause', e);
  1585. console.log('CatchClause', e);
  1586. }
  1587. uni.navigateTo({
  1588. url: '/pages/ucenter/order/order',
  1589. success: function (res) {},
  1590. fail: function (res) {},
  1591. complete: function (res) {}
  1592. });
  1593. } else {
  1594. that.gofastAddCart();
  1595. }
  1596. }
  1597. });
  1598. },
  1599. //添加到购物车
  1600. addToCart: function () {
  1601. var that = this;
  1602. if (this.openAttr == false) {
  1603. //打开规格选择窗口
  1604. this.setData({
  1605. openAttr: !this.openAttr
  1606. });
  1607. } else {
  1608. //提示选择完整规格
  1609. if (!this.isCheckedAllSpec()) {
  1610. util.showErrorToast('请选择完整规格');
  1611. return false;
  1612. }
  1613. //根据选中的规格,判断是否有对应的sku信息
  1614. let checkedProductArray = this.getCheckedProductItem(this.getCheckedSpecKey());
  1615. if (!checkedProductArray || checkedProductArray.length <= 0) {
  1616. //找不到对应的product信息,提示没有库存
  1617. util.showErrorToast('没有库存');
  1618. return false;
  1619. }
  1620. let checkedProduct = checkedProductArray[0];
  1621. //验证库存
  1622. if (checkedProduct.number <= 0) {
  1623. util.showErrorToast('没有库存');
  1624. return false;
  1625. }
  1626. //添加到购物车
  1627. util.request(
  1628. api.CartAdd,
  1629. {
  1630. goodsId: this.goods.id,
  1631. number: this.number,
  1632. productId: checkedProduct.id
  1633. },
  1634. 'POST'
  1635. ).then(function (res) {
  1636. let _res = res;
  1637. if (_res.errno == 0) {
  1638. uni.showToast({
  1639. title: '添加成功'
  1640. });
  1641. that.setData({
  1642. openAttr: !that.openAttr,
  1643. cartGoodsCount: _res.data
  1644. });
  1645. //显示tab购物车缓存
  1646. //user.cartadd(that.data.number);
  1647. if (that.userHasCollect == 1) {
  1648. that.setData({
  1649. collect: true
  1650. });
  1651. } else {
  1652. that.setData({
  1653. collect: false
  1654. });
  1655. }
  1656. } else {
  1657. util.showErrorToast(_res.errmsg);
  1658. }
  1659. });
  1660. }
  1661. },
  1662. cutNumber: function () {
  1663. this.setData({
  1664. number: this.number - 1 > 1 ? this.number - 1 : 1
  1665. });
  1666. },
  1667. addNumber: function () {
  1668. // 如果是安心包只能购买一个
  1669. console.log(this.goods);
  1670. if (this.goods.goodsSn == '1036016') {
  1671. uni.showToast({
  1672. title: '此款商品只能购买一个',
  1673. icon: 'none',
  1674. duration: 2000
  1675. });
  1676. } else {
  1677. this.setData({
  1678. number: this.number + 1
  1679. });
  1680. }
  1681. },
  1682. switchAttrPop: function () {
  1683. if (this.openAttr == false) {
  1684. this.setData({
  1685. openAttr: !this.openAttr
  1686. });
  1687. }
  1688. },
  1689. closeAttr: function () {
  1690. this.setData({
  1691. openAttr: false
  1692. });
  1693. },
  1694. closeShare: function () {
  1695. this.setData({
  1696. openShare: false
  1697. });
  1698. },
  1699. openCartPage: function () {
  1700. uni.switchTab({
  1701. url: '/pages/tabBar/cart/cart'
  1702. });
  1703. },
  1704. qrtouchstart: function () {
  1705. this.setData({
  1706. myqr_blur: 100,
  1707. myqr_show: false
  1708. });
  1709. },
  1710. copyToHM() {
  1711. let copyLink = this.goods.copyLink;
  1712. console.log(copyLink);
  1713. if (copyLink != undefined && copyLink != '') {
  1714. uni.setClipboardData({
  1715. data: copyLink,
  1716. success(res) {
  1717. uni.getClipboardData({
  1718. success(res) {
  1719. console.log(res.data); // data
  1720. }
  1721. });
  1722. }
  1723. });
  1724. } else {
  1725. uni.showToast({
  1726. title: '该商品暂未配置盒马链接',
  1727. icon: 'none'
  1728. });
  1729. }
  1730. },
  1731. onSelfPayChange(e) {
  1732. console.log(e);
  1733. this.setData({
  1734. selfPayChecked: e.detail
  1735. });
  1736. },
  1737. onSpreadPayChange(e) {
  1738. console.log(e);
  1739. this.setData({
  1740. spreadPayChecked: e.detail
  1741. });
  1742. },
  1743. cancelSelfPay() {
  1744. let selfPayChecked = this.selfPayChecked;
  1745. if (selfPayChecked == true) {
  1746. uni.setStorageSync('selfPayChecked', true);
  1747. }
  1748. this.setData({
  1749. selfPayShow: false
  1750. });
  1751. },
  1752. cancelSpreadPay() {
  1753. let spreadPayChecked = this.spreadPayChecked;
  1754. if (spreadPayChecked == true) {
  1755. uni.setStorageSync('spreadPayChecked', true);
  1756. }
  1757. this.setData({
  1758. spreadPayShow: false
  1759. });
  1760. },
  1761. goSelfPay() {
  1762. let selfPayChecked = uni.getStorageSync('selfPayChecked');
  1763. if (selfPayChecked != true) {
  1764. this.setData({
  1765. selfPayShow: true
  1766. });
  1767. } else {
  1768. this.addFast();
  1769. }
  1770. },
  1771. goSpread() {
  1772. let spreadPayChecked = uni.getStorageSync('spreadPayChecked');
  1773. console.log(spreadPayChecked);
  1774. if (spreadPayChecked != true) {
  1775. this.setData({
  1776. spreadPayShow: true
  1777. });
  1778. } else {
  1779. // wx.navigateTo({
  1780. // url: '/pages/goods/goodsPoster/goodsPoster?goodsId='+this.data.goods.id,
  1781. // })
  1782. this.createPoster();
  1783. }
  1784. },
  1785. posterCopy() {
  1786. let that = this;
  1787. uni.setClipboardData({
  1788. data: that.myqr_ads,
  1789. success: function (res) {
  1790. uni.getClipboardData({
  1791. success: function (res) {
  1792. uni.showToast({
  1793. title: '文案复制成功',
  1794. icon: 'success',
  1795. duration: 2000
  1796. });
  1797. // that.hidePoster();
  1798. }
  1799. });
  1800. }
  1801. });
  1802. },
  1803. hidePoster() {
  1804. this.setData({
  1805. myqr_show: false,
  1806. myqr_blur: 100,
  1807. myqr_bottom_btn: 'fixed'
  1808. });
  1809. },
  1810. createPoster() {
  1811. uni.showLoading({
  1812. title: '生成中'
  1813. });
  1814. uni.pageScrollTo({
  1815. scrollTop: 0
  1816. });
  1817. if (this.myqr_url != null) {
  1818. uni.hideLoading();
  1819. this.setData({
  1820. myqr_show: true,
  1821. myqr_blur: 25,
  1822. myqr_bottom_btn: 'unset'
  1823. });
  1824. return;
  1825. }
  1826. util.request(
  1827. api.QrGoodsCodeCreate,
  1828. {
  1829. goods_id: this.goods.id
  1830. },
  1831. 'POST'
  1832. ).then((res) => {
  1833. uni.hideLoading();
  1834. if (res.errno == 0) {
  1835. this.setData({
  1836. myqr_url: res.data.imgUrl,
  1837. myqr_ads: res.data.ads,
  1838. myqr_show: true,
  1839. myqr_blur: 25,
  1840. myqr_bottom_btn: 'unset'
  1841. });
  1842. } else {
  1843. util.showErrorToast('未设置分享图');
  1844. }
  1845. });
  1846. },
  1847. goSaveQrcode: function () {
  1848. //保存二维码图片
  1849. let that = this;
  1850. console.info(that.myqr_url);
  1851. uni.downloadFile({
  1852. url: that.myqr_url,
  1853. success: function (res) {
  1854. if (res.statusCode === 200) {
  1855. let img = res.tempFilePath;
  1856. uni.saveImageToPhotosAlbum({
  1857. filePath: img,
  1858. success(res) {
  1859. that.goCloseMyqr('个人专属二维码图片已保存到您的相册');
  1860. },
  1861. fail(res) {
  1862. that.goCloseMyqr('网络或授权问题 图片保存失败 请重试');
  1863. }
  1864. });
  1865. } else {
  1866. that.goCloseMyqr('网络或授权问题 图片保存失败 请重试');
  1867. }
  1868. },
  1869. fail(res) {
  1870. that.goCloseMyqr('网络或授权问题 图片保存失败 请重试');
  1871. }
  1872. });
  1873. },
  1874. goCloseMyqr: function (msg) {
  1875. //关闭分享图片的弹层
  1876. this.hidePoster();
  1877. if (msg) {
  1878. uni.showToast({
  1879. title: msg,
  1880. icon: 'none',
  1881. duration: 3000
  1882. });
  1883. }
  1884. },
  1885. reSelfPay() {
  1886. let selfPayChecked = this.selfPayChecked;
  1887. if (selfPayChecked == true) {
  1888. uni.setStorageSync('selfPayChecked', true);
  1889. }
  1890. this.setData({
  1891. selfPayShow: false
  1892. });
  1893. this.addFast();
  1894. },
  1895. reSpread() {
  1896. // let spreadPayChecked = this.data.spreadPayChecked;
  1897. // if (spreadPayChecked == true) {
  1898. // wx.setStorageSync('spreadPayChecked', true);
  1899. // }
  1900. this.setData({
  1901. spreadPayShow: false
  1902. });
  1903. this.createPoster();
  1904. // wx.navigateTo({
  1905. // url: '/pages/goods/goodsPoster/goodsPoster?goodsId='+this.data.goods.id,
  1906. // })
  1907. },
  1908. goMemberCenter() {
  1909. if (!app.globalData.hasLogin) {
  1910. uni.navigateTo({
  1911. url: '/pages/auth/login/login'
  1912. });
  1913. return;
  1914. } else {
  1915. uni.navigateTo({
  1916. url: '/pages/member/memberCenter/memberCenter'
  1917. });
  1918. }
  1919. },
  1920. bindGoodsNumInput(e) {
  1921. this.setData({
  1922. plusNum: e.detail.value
  1923. });
  1924. this.setData({
  1925. totalPrice: Number(Number(this.finallyPrice) + Number(this.goods.unitPrice) * Number(this.plusNum)).toFixed(2)
  1926. });
  1927. },
  1928. minusNum() {
  1929. if (this.plusNum == this.minNum) {
  1930. return false;
  1931. } else {
  1932. let result = Number(this.plusNum) - 1;
  1933. // this.setData({
  1934. // plusNum:(result==0?'0':result)
  1935. // });
  1936. // 加购类
  1937. if (this.goods.productType == 3) {
  1938. let currentAdd = this.productList.filter((item) => {
  1939. return item.unitIncreaseNumber == result;
  1940. });
  1941. if (currentAdd.length >= 1) {
  1942. let amount = currentAdd[0].price;
  1943. this.setData({
  1944. checkedSku: currentAdd[0],
  1945. plusNum: result,
  1946. addPurchaseAmount: amount,
  1947. totalPrice: Number(Number(amount) - Number(this.couponPrice)).toFixed(2)
  1948. // totalPrice:Number(Number(this.data.finallyPrice)+Number(this.data.goods.unitPrice)*Number(this.data.plusNum)).toFixed(2)
  1949. });
  1950. } else {
  1951. uni.showToast({
  1952. title: '当前加购数量无效',
  1953. icon: 'none'
  1954. });
  1955. }
  1956. // this.setData({
  1957. // addPurchaseAmount:amount,
  1958. // totalPrice:Number(Number(this.data.finallyPrice)+Number(amount)).toFixed(2),
  1959. // // totalPrice:Number(Number(this.data.finallyPrice)+Number(this.data.goods.unitPrice)*Number(this.data.plusNum)).toFixed(2)
  1960. // });
  1961. } else if (this.goods.type == 4) {
  1962. console.log(this.checkedSku.price * this.plusNum);
  1963. console.log(this.checkedSku.price * this.plusNum - this.couponPrice);
  1964. // 补差类
  1965. this.setData({
  1966. plusNum: result,
  1967. totalPrice: Number(this.checkedSku.price * result - this.couponPrice).toFixed(2)
  1968. });
  1969. }
  1970. }
  1971. },
  1972. addNum() {
  1973. if (this.goods.unitMaximum && this.plusNum >= this.goods.unitMaximum) {
  1974. return false;
  1975. } else {
  1976. let result = Number(this.plusNum) + 1;
  1977. // 加购类
  1978. if (this.goods.productType == 3) {
  1979. let currentAdd = this.productList.filter((item) => {
  1980. return item.unitIncreaseNumber == result;
  1981. });
  1982. if (currentAdd.length >= 1) {
  1983. let amount = currentAdd[0].price;
  1984. this.setData({
  1985. checkedSku: currentAdd[0],
  1986. plusNum: result,
  1987. addPurchaseAmount: amount,
  1988. totalPrice: Number(Number(amount) - Number(this.couponPrice)).toFixed(2)
  1989. // totalPrice:Number(Number(this.data.finallyPrice)+Number(this.data.goods.unitPrice)*Number(this.data.plusNum)).toFixed(2)
  1990. });
  1991. } else {
  1992. uni.showToast({
  1993. title: '此加购数量无效',
  1994. icon: 'none'
  1995. });
  1996. // this.setData({
  1997. // plusNum:0,
  1998. // addPurchaseAmount:0,
  1999. // finallyPrice:Number(this.data.checkedSku.price-this.data.couponPrice).toFixed(2)
  2000. // });
  2001. }
  2002. // this.setData({
  2003. // addPurchaseAmount:amount,
  2004. // totalPrice:Number(Number(this.data.finallyPrice)+Number(amount)).toFixed(2)
  2005. // totalPrice:Number(Number(this.data.finallyPrice)+Number(this.data.goods.unitPrice)*Number(this.data.plusNum)).toFixed(2)
  2006. // });
  2007. } else if (this.goods.type == 4) {
  2008. // 补差类
  2009. console.log(this.checkedSku.price * this.plusNum);
  2010. console.log(this.checkedSku.price * this.plusNum - this.couponPrice);
  2011. this.setData({
  2012. plusNum: result,
  2013. totalPrice: Number(this.checkedSku.price * result - this.couponPrice).toFixed(2)
  2014. });
  2015. }
  2016. }
  2017. },
  2018. goWholeEval() {
  2019. uni.navigateTo({
  2020. url: '/pages/goods/wholeEvaluation/wholeEvaluation?id=' + this.id
  2021. });
  2022. },
  2023. onSkuClose() {
  2024. this.setData({
  2025. chooseSkuVisible: false
  2026. });
  2027. },
  2028. showSkuPopup() {
  2029. this.setData({
  2030. chooseSkuVisible: true,
  2031. currentSku: this.checkedSku,
  2032. activeSku: this.checkedSku.id
  2033. });
  2034. },
  2035. selectSku(e) {
  2036. let id = e.currentTarget.dataset.id;
  2037. let index = e.currentTarget.dataset.index;
  2038. this.setData({
  2039. activeSku: id,
  2040. currentSku: this.productList[index],
  2041. checkedSku: this.productList[index]
  2042. });
  2043. this.setData({
  2044. finallyPrice: Number(this.checkedSku.price - this.couponPrice).toFixed(2)
  2045. });
  2046. // this.setData({
  2047. // totalPrice:Number(Number(this.data.finallyPrice)+Number(this.data.goods.unitPrice)*Number(this.data.plusNum)).toFixed(2)
  2048. // });
  2049. if (this.goods.type == 4) {
  2050. this.setData({
  2051. totalPrice: Number(this.checkedSku.price * this.plusNum - this.couponPrice).toFixed(2)
  2052. });
  2053. } else {
  2054. this.setData({
  2055. totalPrice: Number(this.checkedSku.price - this.couponPrice).toFixed(2)
  2056. });
  2057. }
  2058. },
  2059. confSku() {
  2060. this.setData({
  2061. checkedSku: this.currentSku,
  2062. chooseSkuVisible: false
  2063. });
  2064. },
  2065. stopClick() {}
  2066. }
  2067. };
  2068. </script>
  2069. <style>
  2070. .myqr {
  2071. position: absolute;
  2072. z-index: 999;
  2073. width: 100%;
  2074. text-align: center;
  2075. height: auto;
  2076. margin-top: 50rpx;
  2077. }
  2078. .myqr .cancel {
  2079. width: 60rpx;
  2080. height: 60rpx;
  2081. margin-top: 30rpx;
  2082. margin-left: 480rpx;
  2083. }
  2084. .myqr .img {
  2085. width: 480rpx;
  2086. }
  2087. .myqr .btn {
  2088. width: 120rpx;
  2089. height: 120rpx;
  2090. line-height: 120rpx;
  2091. margin-top: 20rpx;
  2092. padding: 30rpx;
  2093. background: #ffffff;
  2094. border-radius: 60rpx;
  2095. }
  2096. page {
  2097. background: #f3f3f3;
  2098. }
  2099. .container {
  2100. padding-bottom: 180rpx;
  2101. position: relative;
  2102. /* margin-bottom: 100rpx; */
  2103. }
  2104. .user_column_item_image {
  2105. width: 50rpx;
  2106. height: 50rpx;
  2107. margin-right: 26rpx;
  2108. margin-top: 25rpx;
  2109. }
  2110. .flexb {
  2111. width: 750rpx;
  2112. height: 88rpx;
  2113. line-height: 103rpx;
  2114. padding-right: 31.25rpx;
  2115. border-bottom: 1px solid #f4f4f4;
  2116. font-size: 30rpx;
  2117. color: #333;
  2118. background: #fff;
  2119. display: flex;
  2120. flex-wrap: nowrap;
  2121. }
  2122. .flex {
  2123. flex-grow: 1;
  2124. text-align: center;
  2125. }
  2126. .show {
  2127. width: 750rpx;
  2128. height: 88rpx;
  2129. background: #fff;
  2130. border-bottom: 1px solid #f4f4f4;
  2131. }
  2132. .show .t {
  2133. float: left;
  2134. width: 600rpx;
  2135. height: 88rpx;
  2136. line-height: 88rpx;
  2137. font-size: 29rpx;
  2138. color: #333;
  2139. margin-left: 31.25rpx;
  2140. }
  2141. .show .t .s {
  2142. font-weight: 600;
  2143. }
  2144. .show .i {
  2145. float: right;
  2146. width: 52rpx;
  2147. height: 52rpx;
  2148. margin-right: 16rpx;
  2149. margin-top: 28rpx;
  2150. }
  2151. .mark-img {
  2152. width: 168rpx;
  2153. height: 68rpx;
  2154. right: 5rpx;
  2155. position: absolute;
  2156. top: 5rpx;
  2157. }
  2158. .goodsimgs {
  2159. width: 750rpx;
  2160. /* height: 492rpx; */
  2161. height: 490rpx;
  2162. }
  2163. .goodsimgs image {
  2164. width: 750rpx;
  2165. /* height: 326rpx; */
  2166. height: 490rpx;
  2167. }
  2168. .commodity_screen {
  2169. width: 100%;
  2170. height: 100%;
  2171. position: fixed;
  2172. top: 0;
  2173. left: 0;
  2174. background: #000;
  2175. opacity: 0.2;
  2176. overflow: hidden;
  2177. z-index: 1000;
  2178. color: #fff;
  2179. }
  2180. .commodity_attr_box {
  2181. width: 100%;
  2182. overflow: hidden;
  2183. position: fixed;
  2184. bottom: 0;
  2185. left: 0;
  2186. z-index: 2000;
  2187. background: #fff;
  2188. padding-top: 20rpx;
  2189. }
  2190. /* 活动样式 */
  2191. .activity {
  2192. width: 750rpx;
  2193. height: 145rpx;
  2194. background: linear-gradient(67deg, #4f43dd, #689cf2, #ba64e2);
  2195. display: flex;
  2196. flex-direction: column;
  2197. padding: 20rpx 30rpx;
  2198. }
  2199. .activity .img {
  2200. background-image: url('https://7a68-zhaijieshi-3guecm78383ca692-1307626841.tcb.qcloud.la/activity/activity.png');
  2201. width: 139rpx;
  2202. height: 32rpx;
  2203. background-size: 100% 100%;
  2204. color: #5244dd;
  2205. font-size: 23rpx;
  2206. text-align: center;
  2207. }
  2208. .activityDay {
  2209. line-height: 42rpx;
  2210. margin-right: 30rpx;
  2211. display: flex;
  2212. height: 42rpx;
  2213. }
  2214. .activityDay image {
  2215. width: 42rpx;
  2216. height: 42rpx;
  2217. margin-right: 10rpx;
  2218. }
  2219. .activityDay text {
  2220. font-size: 24rpx;
  2221. color: #f4f4f4;
  2222. }
  2223. .activityPrice {
  2224. color: #ffffff;
  2225. }
  2226. .activityPrice text {
  2227. font-size: 49rpx;
  2228. font-weight: bold;
  2229. }
  2230. .activityCounterPrice {
  2231. color: #c7c7c7;
  2232. text-decoration: line-through;
  2233. font-size: 24rpx;
  2234. margin-top: 20rpx;
  2235. margin-left: 10rpx;
  2236. }
  2237. .activityTime {
  2238. display: flex;
  2239. flex-direction: row;
  2240. margin-right: 50rpx;
  2241. }
  2242. .activityTime text {
  2243. color: #ffffff;
  2244. line-height: 45rpx;
  2245. }
  2246. .activityTime view {
  2247. width: 45rpx;
  2248. height: 45rpx;
  2249. background: #ffffff;
  2250. border-radius: 5rpx;
  2251. margin: 5rpx;
  2252. line-height: 45rpx;
  2253. text-align: center;
  2254. font-size: 25rpx;
  2255. font-weight: bold;
  2256. color: #b563e1;
  2257. }
  2258. .activityTime .mark {
  2259. }
  2260. .goods-info {
  2261. width: 750rpx;
  2262. /*height: 306rpx;*/
  2263. overflow: hidden;
  2264. background: #fff;
  2265. border-bottom: 1px solid #f4f4f4;
  2266. }
  2267. .goods-info .c {
  2268. display: block;
  2269. width: 718.75rpx;
  2270. height: 182rpx;
  2271. margin-left: 31.25rpx;
  2272. padding: 3rpx 31.25rpx 20rpx 0;
  2273. }
  2274. .goods-info .c text {
  2275. /* display: block;
  2276. width: 687.5rpx;
  2277. text-align: left; */
  2278. }
  2279. .goods_name {
  2280. white-space: nowrap;
  2281. text-overflow: ellipsis;
  2282. overflow: hidden;
  2283. margin-top: 10rpx;
  2284. display: flex;
  2285. align-items: center;
  2286. }
  2287. .goods_name_left {
  2288. font-weight: 550;
  2289. margin-left: 0rpx;
  2290. font-size: 36rpx;
  2291. letter-spacing: 1rpx;
  2292. color: #2a2a2a;
  2293. font-weight: bold;
  2294. width: 688rpx;
  2295. white-space: pre-wrap;
  2296. }
  2297. .goods_name_right {
  2298. font-weight: 550;
  2299. /* top: 375px; */
  2300. width: 80rpx;
  2301. height: 80rpx;
  2302. line-height: 82rpx;
  2303. /* padding: 0;
  2304. margin: 0;
  2305. right: 10rpx; */
  2306. margin-right: 0rpx;
  2307. text-align: center;
  2308. font-size: 25rpx;
  2309. background-color: #09afff;
  2310. border-radius: 40rpx;
  2311. letter-spacing: 3rpx;
  2312. /* position: absolute; */
  2313. }
  2314. .goods_name_right .img {
  2315. width: 50rpx;
  2316. height: 50rpx;
  2317. margin-top: 15rpx;
  2318. }
  2319. .goods_name_right .txt {
  2320. margin-top: 5rpx;
  2321. font-size: 18rpx;
  2322. color: #000000;
  2323. border: 1rpx solid;
  2324. }
  2325. .goods-info .desc {
  2326. margin: 12rpx 0;
  2327. font-size: 24rpx;
  2328. line-height: 36rpx;
  2329. width: 640rpx;
  2330. white-space: nowrap;
  2331. text-overflow: ellipsis;
  2332. overflow: hidden;
  2333. display: block;
  2334. }
  2335. .goods-info .price {
  2336. height: 60rpx;
  2337. display: flex;
  2338. /* margin-top: 20rpx; */
  2339. align-items: flex-end;
  2340. }
  2341. .goods-info .counterPrice {
  2342. padding-left: 5rpx;
  2343. text-decoration: line-through;
  2344. font-size: 24rpx;
  2345. margin-top: 15rpx;
  2346. margin-left: 10rpx;
  2347. color: #85868a;
  2348. }
  2349. .goods-info .retailPrice {
  2350. height: 49rpx;
  2351. line-height: 44rpx;
  2352. /* color: #5DB5E7; */
  2353. color: #ff2958;
  2354. }
  2355. .goods-info .memberPrice {
  2356. font-size: 26rpx;
  2357. color: #dd483e;
  2358. margin: 0 10rpx 0 20rpx;
  2359. }
  2360. .member-price-tag {
  2361. width: 88rpx;
  2362. height: 26rpx;
  2363. line-height: 26rpx;
  2364. background: url('https://mall.zhaijieshi.cc/file/jzmall/weixin/member/member-price-bg.png') no-repeat center center;
  2365. background-size: 100% 100%;
  2366. color: #5e3a11;
  2367. font-size: 16rpx;
  2368. padding: 0 8rpx 0 0;
  2369. text-align: right;
  2370. margin: 0 0 6rpx 0;
  2371. }
  2372. .member-price-tag.spread-tag {
  2373. margin-left: 20rpx;
  2374. background-image: url('https://mall.zhaijieshi.cc/file/jzmall/weixin/member/spread-price-bg.png');
  2375. width: 122rpx;
  2376. }
  2377. .goods-info .retailPrice text.checked-price {
  2378. font-size: 48rpx;
  2379. font-weight: bold;
  2380. margin-left: 3rpx;
  2381. color: #ff2958;
  2382. }
  2383. .goods-info .brand {
  2384. margin-top: 5rpx;
  2385. min-height: 34rpx;
  2386. text-align: left;
  2387. }
  2388. .goods-info .brand text {
  2389. display: inline-block;
  2390. width: auto;
  2391. padding: 2px 0rpx 2px 0.5rpx;
  2392. line-height: 32.5rpx;
  2393. /*border: 1px solid #f48f18;color: #f48f18;*/
  2394. font-size: 22rpx;
  2395. color: #a98f76;
  2396. /*border-radius: 4rpx;*/
  2397. background-size: 10.75rpx 18.75rpx;
  2398. }
  2399. .section-nav {
  2400. width: 750rpx;
  2401. height: 108rpx;
  2402. background: #fff;
  2403. margin-bottom: 20rpx;
  2404. }
  2405. .section-nav .t {
  2406. float: left;
  2407. width: 600rpx;
  2408. height: 108rpx;
  2409. line-height: 108rpx;
  2410. font-size: 29rpx;
  2411. color: #333;
  2412. margin-left: 31.25rpx;
  2413. }
  2414. .section-nav .i {
  2415. float: right;
  2416. width: 52rpx;
  2417. height: 52rpx;
  2418. margin-right: 16rpx;
  2419. margin-top: 28rpx;
  2420. }
  2421. .section-act .t {
  2422. float: left;
  2423. display: flex;
  2424. align-items: center;
  2425. width: 600rpx;
  2426. height: 108rpx;
  2427. overflow: hidden;
  2428. line-height: 108rpx;
  2429. font-size: 29rpx;
  2430. color: #999;
  2431. margin-left: 31.25rpx;
  2432. }
  2433. .section-act .label {
  2434. color: #999;
  2435. }
  2436. .section-act .tag {
  2437. display: flex;
  2438. align-items: center;
  2439. padding: 0 10rpx;
  2440. border-radius: 3px;
  2441. height: 37rpx;
  2442. width: auto;
  2443. color: #f48f18;
  2444. overflow: hidden;
  2445. border: 1px solid #f48f18;
  2446. font-size: 25rpx;
  2447. margin: 0 10rpx;
  2448. }
  2449. .section-act .text {
  2450. display: flex;
  2451. align-items: center;
  2452. height: 37rpx;
  2453. width: auto;
  2454. overflow: hidden;
  2455. color: #f48f18;
  2456. font-size: 29rpx;
  2457. }
  2458. .comments {
  2459. width: 100%;
  2460. height: auto;
  2461. padding-left: 30rpx;
  2462. background: #fff;
  2463. margin: 20rpx 0;
  2464. }
  2465. .comments .h {
  2466. height: 102.5rpx;
  2467. line-height: 100.5rpx;
  2468. width: 718.75rpx;
  2469. padding-right: 16rpx;
  2470. }
  2471. .comments .h .t {
  2472. display: block;
  2473. float: left;
  2474. width: 50%;
  2475. font-size: 30rpx;
  2476. color: #333;
  2477. }
  2478. .comments .h .i {
  2479. display: block;
  2480. float: right;
  2481. width: 164rpx;
  2482. height: 100.5rpx;
  2483. line-height: 100.5rpx;
  2484. background-size: 52rpx;
  2485. }
  2486. .comments .b {
  2487. height: auto;
  2488. width: 720rpx;
  2489. }
  2490. .comments .item {
  2491. height: auto;
  2492. width: 720rpx;
  2493. overflow: hidden;
  2494. border-top: 1px solid #d9d9d9;
  2495. }
  2496. .comments .info {
  2497. height: 127rpx;
  2498. width: 100%;
  2499. padding: 33rpx 0 27rpx 0;
  2500. }
  2501. .comments .user {
  2502. float: left;
  2503. width: auto;
  2504. height: 67rpx;
  2505. line-height: 67rpx;
  2506. font-size: 0;
  2507. }
  2508. .comments .user image {
  2509. float: left;
  2510. width: 67rpx;
  2511. height: 67rpx;
  2512. margin-right: 17rpx;
  2513. border-radius: 50%;
  2514. }
  2515. .comments .user text {
  2516. display: inline-block;
  2517. width: auto;
  2518. height: 66rpx;
  2519. overflow: hidden;
  2520. font-size: 29rpx;
  2521. line-height: 66rpx;
  2522. }
  2523. .comments .time {
  2524. display: block;
  2525. float: right;
  2526. width: auto;
  2527. height: 67rpx;
  2528. line-height: 67rpx;
  2529. color: #7f7f7f;
  2530. font-size: 25rpx;
  2531. margin-right: 30rpx;
  2532. }
  2533. .comments .content {
  2534. width: 720rpx;
  2535. padding-right: 30rpx;
  2536. line-height: 45.8rpx;
  2537. font-size: 29rpx;
  2538. margin-bottom: 24rpx;
  2539. }
  2540. .comments .imgs {
  2541. width: 720rpx;
  2542. height: auto;
  2543. margin-bottom: 25rpx;
  2544. }
  2545. .comments .imgs .img {
  2546. height: 150rpx;
  2547. width: 150rpx;
  2548. margin-right: 28rpx;
  2549. }
  2550. .comments .spec {
  2551. width: 720rpx;
  2552. padding-right: 30rpx;
  2553. line-height: 30rpx;
  2554. font-size: 24rpx;
  2555. color: #999;
  2556. margin-bottom: 30rpx;
  2557. }
  2558. .comments .customer-service {
  2559. width: 690rpx;
  2560. height: auto;
  2561. overflow: hidden;
  2562. margin-top: 23rpx;
  2563. margin-bottom: 23rpx;
  2564. background: rgba(0, 0, 0, 0.03);
  2565. padding: 21rpx;
  2566. }
  2567. .comments .customer-service .u {
  2568. font-size: 24rpx;
  2569. color: #333;
  2570. line-height: 37.5rpx;
  2571. }
  2572. .comments .customer-service .c {
  2573. font-size: 24rpx;
  2574. color: #999;
  2575. line-height: 37.5rpx;
  2576. }
  2577. .goods-attr {
  2578. width: 750rpx;
  2579. height: auto;
  2580. overflow: hidden;
  2581. padding: 0 31.25rpx 25rpx 31.25rpx;
  2582. background: #fff;
  2583. }
  2584. .goods-attr .t {
  2585. width: 687.5rpx;
  2586. height: 104rpx;
  2587. line-height: 104rpx;
  2588. font-size: 38.5rpx;
  2589. }
  2590. .goods-attr .item {
  2591. width: 687.5rpx;
  2592. height: 68rpx;
  2593. padding: 11rpx 20rpx;
  2594. margin-bottom: 11rpx;
  2595. background: #f7f7f7;
  2596. font-size: 38.5rpx;
  2597. }
  2598. .goods-attr .left {
  2599. float: left;
  2600. font-size: 25rpx;
  2601. width: 134rpx;
  2602. height: 45rpx;
  2603. line-height: 45rpx;
  2604. overflow: hidden;
  2605. color: #999;
  2606. }
  2607. .goods-attr .right {
  2608. float: left;
  2609. font-size: 36.5rpx;
  2610. margin-left: 20rpx;
  2611. width: 480rpx;
  2612. height: 45rpx;
  2613. line-height: 45rpx;
  2614. overflow: hidden;
  2615. color: #333;
  2616. }
  2617. .detail {
  2618. width: 750rpx;
  2619. height: auto;
  2620. overflow: hidden;
  2621. /* padding-bottom: 160rpx; */
  2622. }
  2623. .detail image {
  2624. width: 750rpx;
  2625. /* display: block; */
  2626. }
  2627. .common-problem {
  2628. width: 750rpx;
  2629. height: auto;
  2630. overflow: hidden;
  2631. }
  2632. .common-problem .h {
  2633. position: relative;
  2634. height: 145.5rpx;
  2635. width: 750rpx;
  2636. padding: 56.25rpx 0;
  2637. background: #fff;
  2638. text-align: center;
  2639. }
  2640. .common-problem .h .line {
  2641. display: inline-block;
  2642. position: absolute;
  2643. top: 72rpx;
  2644. left: 0;
  2645. z-index: 2;
  2646. height: 1px;
  2647. margin-left: 225rpx;
  2648. width: 300rpx;
  2649. background: #ccc;
  2650. }
  2651. .common-problem .h .title {
  2652. display: inline-block;
  2653. position: absolute;
  2654. top: 56.125rpx;
  2655. left: 0;
  2656. z-index: 3;
  2657. height: 33rpx;
  2658. margin-left: 285rpx;
  2659. width: 180rpx;
  2660. background: #fff;
  2661. }
  2662. .common-problem .b {
  2663. width: 750rpx;
  2664. height: auto;
  2665. overflow: hidden;
  2666. padding: 0rpx 30rpx;
  2667. background: #fff;
  2668. }
  2669. .common-problem .item {
  2670. height: auto;
  2671. overflow: hidden;
  2672. padding-bottom: 25rpx;
  2673. }
  2674. .common-problem .question-box .spot {
  2675. float: left;
  2676. display: block;
  2677. height: 8rpx;
  2678. width: 8rpx;
  2679. background: #b4282d;
  2680. border-radius: 50%;
  2681. margin-top: 11rpx;
  2682. }
  2683. .common-problem .question-box .question {
  2684. float: left;
  2685. line-height: 30rpx;
  2686. padding-left: 8rpx;
  2687. display: block;
  2688. font-size: 26rpx;
  2689. padding-bottom: 15rpx;
  2690. color: #303030;
  2691. }
  2692. .common-problem .answer {
  2693. line-height: 36rpx;
  2694. padding-left: 16rpx;
  2695. font-size: 26rpx;
  2696. color: #787878;
  2697. }
  2698. .related-goods {
  2699. width: 750rpx;
  2700. height: auto;
  2701. overflow: hidden;
  2702. padding-bottom: 80rpx;
  2703. }
  2704. .related-goods .h {
  2705. position: relative;
  2706. height: 145.5rpx;
  2707. width: 750rpx;
  2708. padding: 56.25rpx 0;
  2709. background: #fff;
  2710. text-align: center;
  2711. border-bottom: 1px solid #f4f4f4;
  2712. }
  2713. .related-goods .h .line {
  2714. display: inline-block;
  2715. position: absolute;
  2716. top: 72rpx;
  2717. left: 0;
  2718. z-index: 2;
  2719. height: 1px;
  2720. margin-left: 225rpx;
  2721. width: 300rpx;
  2722. background: #ccc;
  2723. }
  2724. .related-goods .h .title {
  2725. display: inline-block;
  2726. position: absolute;
  2727. top: 56.125rpx;
  2728. left: 0;
  2729. z-index: 3;
  2730. height: 33rpx;
  2731. margin-left: 285rpx;
  2732. width: 180rpx;
  2733. background: #fff;
  2734. }
  2735. .related-goods .b {
  2736. width: 750rpx;
  2737. height: auto;
  2738. overflow: hidden;
  2739. }
  2740. .related-goods .b .item {
  2741. float: left;
  2742. background: #fff;
  2743. width: 375rpx;
  2744. height: auto;
  2745. overflow: hidden;
  2746. text-align: center;
  2747. padding: 15rpx 31.25rpx;
  2748. border-right: 1px solid #f4f4f4;
  2749. border-bottom: 1px solid #f4f4f4;
  2750. }
  2751. .related-goods .item .img {
  2752. width: 311.45rpx;
  2753. height: 311.45rpx;
  2754. }
  2755. .related-goods .item .name {
  2756. display: block;
  2757. width: 311.45rpx;
  2758. height: 35rpx;
  2759. margin: 11.5rpx 0 15rpx 0;
  2760. text-align: center;
  2761. overflow: hidden;
  2762. font-size: 30rpx;
  2763. color: #333;
  2764. }
  2765. .related-goods .item .price {
  2766. display: block;
  2767. width: 311.45rpx;
  2768. height: 30rpx;
  2769. text-align: center;
  2770. font-size: 30rpx;
  2771. color: #b4282d;
  2772. }
  2773. .bottom-btn .l {
  2774. /* flex: 2;
  2775. float: left;
  2776. height: 150rpx;
  2777. width: 162rpx; */
  2778. /* display: flex; */
  2779. }
  2780. .bottom-btn .l.l-collect {
  2781. border-right: none;
  2782. border-left: none;
  2783. text-align: center;
  2784. padding-left: 30rpx;
  2785. /* width: 100rpx; */
  2786. }
  2787. .bottom-btn .l.l-collect .icon {
  2788. font-size: 40rpx;
  2789. }
  2790. .bottom-btn .l.l-collect text {
  2791. /* position: absolute;
  2792. top: 80rpx;
  2793. left: 30rpx;
  2794. font-size: 22rpx; */
  2795. }
  2796. .bottom-btn .l.l-kefu {
  2797. border-right: none;
  2798. border-left: none;
  2799. text-align: center;
  2800. /* width:60rpx; */
  2801. /* position: relative; */
  2802. }
  2803. .contact-block {
  2804. position: relative;
  2805. }
  2806. .bottom-btn .l.l-kefu .icon {
  2807. position: absolute;
  2808. font-size: 44rpx;
  2809. top: 20rpx;
  2810. }
  2811. .bottom-btn .l.l-kefu text {
  2812. /* position: absolute;
  2813. top: 60rpx;
  2814. font-size: 22rpx; */
  2815. }
  2816. .bottom-btn .l.l-cart .box {
  2817. position: relative;
  2818. height: 80rpx;
  2819. width: 70rpx;
  2820. }
  2821. .bottom-btn .l.l-cart .box .txt {
  2822. position: absolute;
  2823. top: 50rpx;
  2824. font-size: 22rpx;
  2825. }
  2826. .bottom-btn .l.l-cart .cart-count {
  2827. height: 28rpx;
  2828. width: 28rpx;
  2829. z-index: 10;
  2830. position: absolute;
  2831. top: 0;
  2832. right: 0;
  2833. background: #b4282d;
  2834. text-align: center;
  2835. font-size: 18rpx;
  2836. color: #fff;
  2837. line-height: 28rpx;
  2838. border-radius: 50%;
  2839. }
  2840. .bottom-btn .l.l-cart .icon {
  2841. position: absolute;
  2842. top: 10rpx;
  2843. left: 0;
  2844. font-size: 44rpx;
  2845. }
  2846. .collect-wrapper,
  2847. .service-wrapper {
  2848. display: flex;
  2849. flex-direction: column;
  2850. justify-content: center;
  2851. flex: 1;
  2852. }
  2853. .collect-text {
  2854. margin: 10rpx 0 0;
  2855. }
  2856. .bottom-btn {
  2857. position: fixed;
  2858. left: 0rpx;
  2859. bottom: 0;
  2860. z-index: 10;
  2861. width: 750rpx;
  2862. min-height: 110rpx;
  2863. background: #fff;
  2864. padding: 12rpx 24rpx 18rpx;
  2865. z-index: 9999;
  2866. display: flex;
  2867. /* align-items: center; */
  2868. padding-bottom: constant(safe-area-inset-bottom);
  2869. padding-bottom: env(safe-area-inset-bottom);
  2870. box-shadow: 4rpx -8rpx 16rpx 2rpx rgba(201, 205, 207, 0.25);
  2871. /* box-sizing: content-box; */
  2872. }
  2873. .bottom-btn .contact-block {
  2874. height: 80rpx;
  2875. width: 130rpx;
  2876. position: relative;
  2877. overflow: hidden;
  2878. margin-right: 10rpx;
  2879. }
  2880. .contact-btn {
  2881. height: 80rpx;
  2882. width: 130rpx;
  2883. position: absolute;
  2884. top: 0;
  2885. bottom: 0;
  2886. left: 0;
  2887. z-index: 99;
  2888. opacity: 0;
  2889. }
  2890. .contact-wrapper {
  2891. width: 130rpx;
  2892. height: 80rpx;
  2893. border: 2rpx solid #b3b4b6;
  2894. border-radius: 14rpx;
  2895. /* width: 120rpx; */
  2896. display: flex;
  2897. align-items: center;
  2898. justify-content: center;
  2899. position: absolute;
  2900. top: 0;
  2901. left: 0;
  2902. bottom: 0;
  2903. overflow: hidden;
  2904. padding: 4rpx 0;
  2905. }
  2906. .contact-img {
  2907. width: 24rpx;
  2908. height: 24rpx;
  2909. margin-right: 8rpx;
  2910. /* margin-bottom: 10rpx; */
  2911. }
  2912. .contact-wrapper .text {
  2913. font-size: 28rpx;
  2914. font-weight: bold;
  2915. color: #000;
  2916. height: 40rpx;
  2917. line-height: 40rpx;
  2918. }
  2919. .bottom-btn .share {
  2920. width: 280rpx;
  2921. background: #fff;
  2922. height: 82rpx;
  2923. font-size: 30rpx;
  2924. font-weight: bold;
  2925. color: #09afff;
  2926. text-align: center;
  2927. line-height: 82rpx;
  2928. border: 2rpx solid #09afff;
  2929. border-radius: 82rpx 0rpx 0 82rpx;
  2930. }
  2931. .bottom-btn .c {
  2932. width: 294rpx;
  2933. text-align: center;
  2934. height: 80rpx;
  2935. line-height: 80rpx;
  2936. background: #fe2b54;
  2937. border-radius: 15rpx;
  2938. color: #ffffff;
  2939. font-size: 30rpx;
  2940. }
  2941. .dis-order-wrapper {
  2942. width: 452rpx;
  2943. background: #09afff;
  2944. height: 82rpx;
  2945. font-size: 22rpx;
  2946. color: #fff;
  2947. border-radius: 82rpx;
  2948. text-align: center;
  2949. margin-right: 30rpx;
  2950. display: flex;
  2951. align-items: center;
  2952. overflow: hidden;
  2953. }
  2954. .dis-order-wrapper > view {
  2955. flex: 1;
  2956. text-align: center;
  2957. height: 82rpx;
  2958. }
  2959. .spread-order {
  2960. background: #fff;
  2961. border-radius: 0 82rpx 82rpx 0;
  2962. border: 1rpx solid #09afff;
  2963. border-left: none;
  2964. line-height: 24rpx;
  2965. }
  2966. .buy-type {
  2967. font-size: 30rpx;
  2968. font-weight: bold;
  2969. line-height: 30rpx;
  2970. margin: 10rpx 0 4rpx 0;
  2971. overflow: hidden;
  2972. }
  2973. .bottom-btn .r {
  2974. /*border: 1px solid #f48f18;*/
  2975. background: #09afff;
  2976. float: left;
  2977. height: 100rpx;
  2978. /* line-height: 66rpx; */
  2979. flex: 2;
  2980. text-align: center;
  2981. color: #fff;
  2982. margin-left: 15rpx;
  2983. margin-top: 15rpx;
  2984. margin-bottom: 15rpx;
  2985. border-top-left-radius: 50rpx;
  2986. border-bottom-left-radius: 50rpx;
  2987. }
  2988. .bottom-btn .r .title {
  2989. font-size: 46rpx;
  2990. height: 56rpx;
  2991. color: #fff;
  2992. }
  2993. .bottom-btn .r .subtitle {
  2994. font-size: 28rpx;
  2995. color: #fff;
  2996. font-weight: 100;
  2997. }
  2998. /* */
  2999. .attr-pop-box {
  3000. width: 100%;
  3001. height: 100%;
  3002. position: fixed;
  3003. background: rgba(0, 0, 0, 0.5);
  3004. z-index: 8;
  3005. bottom: 0;
  3006. /* display: none; */
  3007. }
  3008. .attr-pop {
  3009. width: 100%;
  3010. height: auto;
  3011. max-height: 780rpx;
  3012. padding: 31.25rpx;
  3013. background: #fff;
  3014. position: fixed;
  3015. z-index: 9;
  3016. bottom: 100rpx;
  3017. }
  3018. .attr-pop .close {
  3019. position: absolute;
  3020. width: 48rpx;
  3021. height: 48rpx;
  3022. right: 31.25rpx;
  3023. overflow: hidden;
  3024. top: 31.25rpx;
  3025. }
  3026. .attr-pop .close .icon {
  3027. width: 48rpx;
  3028. height: 48rpx;
  3029. }
  3030. .attr-pop .img-info {
  3031. width: 687.5rpx;
  3032. height: 177rpx;
  3033. overflow: hidden;
  3034. margin-bottom: 41.5rpx;
  3035. }
  3036. .attr-pop .img {
  3037. float: left;
  3038. height: 177rpx;
  3039. width: 177rpx;
  3040. background: #f4f4f4;
  3041. margin-right: 31.25rpx;
  3042. }
  3043. .attr-pop .info {
  3044. float: left;
  3045. height: 177rpx;
  3046. display: flex;
  3047. align-items: center;
  3048. }
  3049. .attr-pop .p {
  3050. font-size: 33rpx;
  3051. color: #333;
  3052. height: 33rpx;
  3053. line-height: 33rpx;
  3054. margin-bottom: 10rpx;
  3055. }
  3056. .attr-pop .a {
  3057. font-size: 29rpx;
  3058. color: #333;
  3059. height: 40rpx;
  3060. line-height: 40rpx;
  3061. }
  3062. .spec-con {
  3063. width: 100%;
  3064. height: auto;
  3065. overflow: hidden;
  3066. }
  3067. .spec-con .name {
  3068. margin-bottom: 6rpx;
  3069. font-size: 29rpx;
  3070. color: #333;
  3071. }
  3072. .spec-con .values {
  3073. height: auto;
  3074. margin-bottom: 10rpx;
  3075. font-size: 0;
  3076. }
  3077. .spec-con .value {
  3078. display: inline-block;
  3079. height: 62rpx;
  3080. padding: 0 35rpx;
  3081. line-height: 56rpx;
  3082. text-align: center;
  3083. margin-right: 25rpx;
  3084. margin-bottom: 16.5rpx;
  3085. border: 1px solid #333;
  3086. font-size: 25rpx;
  3087. color: #333;
  3088. }
  3089. .spec-con .value.disable {
  3090. border: 1px solid #ccc;
  3091. color: #ccc;
  3092. }
  3093. .spec-con .value.selected {
  3094. border: 1px solid #b4282d;
  3095. color: #b4282d;
  3096. }
  3097. .number-item .selnum {
  3098. width: 200rpx;
  3099. /* width: 322rpx; */
  3100. height: 71rpx;
  3101. border: 1px solid #ccc;
  3102. display: flex;
  3103. }
  3104. .number-item .cut {
  3105. width: 93.75rpx;
  3106. height: 100%;
  3107. text-align: center;
  3108. line-height: 65rpx;
  3109. }
  3110. .number-item .number {
  3111. flex: 1;
  3112. height: 100%;
  3113. text-align: center;
  3114. line-height: 68.75rpx;
  3115. border-left: 1px solid #ccc;
  3116. border-right: 1px solid #ccc;
  3117. float: left;
  3118. }
  3119. .number-item .add {
  3120. width: 93.75rpx;
  3121. height: 100%;
  3122. text-align: center;
  3123. line-height: 65rpx;
  3124. }
  3125. .contact {
  3126. height: 100rpx;
  3127. width: 100rpx;
  3128. border-radius: 100%;
  3129. position: fixed;
  3130. bottom: 96rpx;
  3131. right: 10rpx;
  3132. font-size: 20rpx;
  3133. box-sizing: border-box;
  3134. /* background: url('../../static/images/customer.png') no-repeat center 21rpx; */
  3135. background-size: 55rpx auto;
  3136. }
  3137. .share-pop-box {
  3138. width: 100%;
  3139. height: 100%;
  3140. position: fixed;
  3141. background: rgba(0, 0, 0, 0.5);
  3142. z-index: 8;
  3143. bottom: 0;
  3144. /* display: none; */
  3145. }
  3146. .share-pop {
  3147. width: 100%;
  3148. height: auto;
  3149. max-height: 780rpx;
  3150. padding: 31.25rpx;
  3151. background: #fff;
  3152. position: fixed;
  3153. z-index: 9;
  3154. bottom: 100rpx;
  3155. }
  3156. .share-pop .close {
  3157. position: absolute;
  3158. width: 48rpx;
  3159. height: 48rpx;
  3160. right: 31.25rpx;
  3161. top: 31.25rpx;
  3162. }
  3163. .share-pop .close .icon {
  3164. width: 48rpx;
  3165. height: 48rpx;
  3166. }
  3167. .share-pop .share-info {
  3168. width: 100%;
  3169. height: 225rpx;
  3170. overflow: hidden;
  3171. margin-bottom: 41.5rpx;
  3172. }
  3173. .sharebtn {
  3174. top: 75rpx;
  3175. background: none !important;
  3176. font-size: 32rpx;
  3177. color: #fff !important;
  3178. border-radius: 0%;
  3179. width: 175rpx;
  3180. height: 150rpx;
  3181. text-align: center;
  3182. display: flex;
  3183. justify-content: center;
  3184. align-items: center;
  3185. flex-wrap: wrap;
  3186. float: left;
  3187. background: #fff;
  3188. border-bottom: 0px solid #fafafa;
  3189. margin-left: 15%;
  3190. }
  3191. .sharebtn::after {
  3192. border: none;
  3193. border-radius: 0%;
  3194. }
  3195. .savesharebtn {
  3196. top: 75rpx;
  3197. background: none !important;
  3198. font-size: 32rpx;
  3199. color: #fff !important;
  3200. border-radius: 0%;
  3201. width: 175rpx;
  3202. height: 150rpx;
  3203. text-align: center;
  3204. display: flex;
  3205. justify-content: center;
  3206. align-items: center;
  3207. flex-wrap: wrap;
  3208. float: right;
  3209. background: #fff;
  3210. border-bottom: 0px solid #fafafa;
  3211. margin-right: 15%;
  3212. }
  3213. .savesharebtn::after {
  3214. border: none;
  3215. border-radius: 0%;
  3216. }
  3217. .sharebtn_image {
  3218. /* border: 1px solid #757575; */
  3219. width: 128rpx;
  3220. height: 128rpx;
  3221. margin-top: 0rpx;
  3222. }
  3223. .sharebtn_text {
  3224. /* border: 1px solid #757575; */
  3225. width: 150rpx;
  3226. margin-bottom: 2rpx;
  3227. height: 20rpx;
  3228. line-height: 20rpx;
  3229. font-size: 20rpx;
  3230. color: #555;
  3231. }
  3232. .separate {
  3233. background: #e0e3da;
  3234. width: 100%;
  3235. height: 6rpx;
  3236. }
  3237. /* 新客角标 */
  3238. .isNew {
  3239. position: absolute;
  3240. width: 80rpx;
  3241. height: 120rpx;
  3242. right: 30rpx;
  3243. z-index: 999;
  3244. }
  3245. /* 自购/推广弹框 */
  3246. .overlay-wrapper {
  3247. display: flex;
  3248. align-items: center;
  3249. justify-content: center;
  3250. height: 100%;
  3251. }
  3252. .tips-wrapper {
  3253. width: 588rpx;
  3254. height: 462rpx;
  3255. border-radius: 10rpx;
  3256. background: #fff;
  3257. font-size: 26rpx;
  3258. display: flex;
  3259. flex-direction: column;
  3260. justify-content: space-between;
  3261. }
  3262. .tips-top {
  3263. display: flex;
  3264. flex-direction: column;
  3265. align-items: center;
  3266. padding: 0 40rpx;
  3267. }
  3268. .tips-title {
  3269. font-size: 34rpx;
  3270. font-weight: bold;
  3271. margin: 66rpx 0 24rpx;
  3272. }
  3273. .tips-bottom {
  3274. height: 132rpx;
  3275. border-top: 2rpx solid #e4e4e4;
  3276. display: flex;
  3277. justify-content: space-around;
  3278. align-items: center;
  3279. }
  3280. .tips-bottom .btn-devide {
  3281. width: 2rpx;
  3282. height: 130rpx;
  3283. background: #e4e4e4;
  3284. }
  3285. .cancel-btn {
  3286. width: 202rpx;
  3287. height: 72rpx;
  3288. line-height: 72rpx;
  3289. border: 2rpx solid #85868a;
  3290. color: #282728;
  3291. border-radius: 72rpx;
  3292. text-align: center;
  3293. overflow: hidden;
  3294. }
  3295. .repay-btn {
  3296. width: 202rpx;
  3297. height: 72rpx;
  3298. line-height: 72rpx;
  3299. background: #09afff;
  3300. color: #fff;
  3301. border-radius: 72rpx;
  3302. text-align: center;
  3303. }
  3304. .notip-again {
  3305. padding-left: 40rpx;
  3306. display: flex;
  3307. align-items: center;
  3308. }
  3309. .user-agree {
  3310. /* color:#85868A; */
  3311. font-size: 26rpx;
  3312. margin-left: 8rpx;
  3313. }
  3314. /* 海报的样式 */
  3315. .poster {
  3316. position: absolute;
  3317. top: 20rpx;
  3318. z-index: 99;
  3319. text-align: center;
  3320. left: 0;
  3321. bottom: 0;
  3322. right: 0;
  3323. }
  3324. .title {
  3325. color: #fff;
  3326. margin: 20rpx 0;
  3327. font-size: 30rpx;
  3328. display: flex;
  3329. justify-content: center;
  3330. text-align: left;
  3331. }
  3332. .title text {
  3333. width: 480rpx;
  3334. }
  3335. .ads {
  3336. color: #fff;
  3337. text-align: left;
  3338. margin: 20rpx auto;
  3339. display: flex;
  3340. justify-content: center;
  3341. }
  3342. .tool {
  3343. display: flex;
  3344. text-align: center;
  3345. justify-content: baseline;
  3346. width: 100%;
  3347. margin-top: 20rpx;
  3348. }
  3349. .tool view {
  3350. flex: 1;
  3351. }
  3352. .img {
  3353. width: 107rpx;
  3354. height: 128rpx;
  3355. }
  3356. .closeImg {
  3357. width: 57rpx;
  3358. height: 57rpx;
  3359. }
  3360. .share-btn {
  3361. background-color: transparent;
  3362. flex: 1;
  3363. }
  3364. .share-btn::after {
  3365. border: none;
  3366. }
  3367. /* 商品价格 销量 */
  3368. .goods-info-new {
  3369. margin-top: -8rpx;
  3370. border-radius: 20rpx 20rpx 0 0;
  3371. background: #f3f3f3;
  3372. width: 750rpx;
  3373. /* height:138rpx; */
  3374. padding: 30rpx 24rpx 26rpx;
  3375. position: relative;
  3376. z-index: 99;
  3377. box-sizing: border-box;
  3378. }
  3379. .price-line {
  3380. height: 38rpx;
  3381. display: flex;
  3382. align-items: flex-end;
  3383. }
  3384. .price-line .real-price {
  3385. color: #fe2b54;
  3386. font-size: 24rpx;
  3387. }
  3388. .price-line .real-price text.bold-price {
  3389. font-size: 40rpx;
  3390. font-weight: bold;
  3391. height: 30rpx;
  3392. line-height: 30rpx;
  3393. }
  3394. .price-line .sale-price {
  3395. color: #999999;
  3396. font-size: 24rpx;
  3397. flex: 1;
  3398. margin-left: 8rpx;
  3399. text-decoration: line-through;
  3400. }
  3401. .price-line .sale-num {
  3402. color: #acadb1;
  3403. font-size: 24rpx;
  3404. }
  3405. .goods-coupon {
  3406. display: flex;
  3407. flex-wrap: wrap;
  3408. margin-top: 20rpx;
  3409. }
  3410. .goods-coupon .goupon-tag {
  3411. height: 30rpx;
  3412. line-height: 30rpx;
  3413. background: rgba(254, 43, 84, 0.1);
  3414. /* opacity: 0.9; */
  3415. border-radius: 5px;
  3416. padding: 0 10rpx;
  3417. margin-right: 10rpx;
  3418. color: #fe2b54;
  3419. font-size: 20rpx;
  3420. }
  3421. /* 服务 须知 门店 */
  3422. .other-info {
  3423. padding: 30rpx 24rpx 16rpx;
  3424. background: #fff;
  3425. border-radius: 24rpx;
  3426. width: 702rpx;
  3427. margin: 0 24rpx;
  3428. }
  3429. .other-info .name {
  3430. color: #000000;
  3431. font-size: 36rpx;
  3432. line-height: 36rpx;
  3433. font-weight: bold;
  3434. padding-bottom: 12rpx;
  3435. }
  3436. .other-info .common-info {
  3437. line-height: 36rpx;
  3438. display: flex;
  3439. /* min-height: 52rpx; */
  3440. /* align-items: center; */
  3441. margin-top: 14rpx;
  3442. }
  3443. .common-info .info-title {
  3444. font-size: 24rpx;
  3445. color: #666;
  3446. margin-right: 26rpx;
  3447. }
  3448. .common-info .info-content {
  3449. font-size: 24rpx;
  3450. color: #000;
  3451. flex: 1;
  3452. }
  3453. .common-info image {
  3454. width: 10rpx;
  3455. height: 20rpx;
  3456. }
  3457. /* 加购数量 */
  3458. .num-module {
  3459. width: 702rpx;
  3460. /* height: 174rpx; */
  3461. background: #ffffff;
  3462. border-radius: 24rpx;
  3463. margin: 14rpx 24rpx 28rpx;
  3464. padding: 32rpx 24rpx;
  3465. }
  3466. .plus-buy {
  3467. height: 30rpx;
  3468. margin: 0 0 28rpx;
  3469. display: flex;
  3470. align-items: center;
  3471. }
  3472. .num-module .title {
  3473. color: #666;
  3474. font-size: 30rpx;
  3475. /* margin-right:20rpx; */
  3476. width: 80rpx;
  3477. }
  3478. .plus-buy .plus-name {
  3479. font-size: 30rpx;
  3480. color: #010101;
  3481. }
  3482. .plus-buy .plus-name text {
  3483. color: #fe2b54;
  3484. font-weight: bold;
  3485. }
  3486. .plus-num {
  3487. display: flex;
  3488. justify-content: space-between;
  3489. height: 72rpx;
  3490. align-items: center;
  3491. }
  3492. .calc-counter {
  3493. height: 72rpx;
  3494. border-radius: 72rpx;
  3495. display: flex;
  3496. align-items: center;
  3497. border: 2rpx solid #d2d2d2;
  3498. box-sizing: border-box;
  3499. overflow: hidden;
  3500. line-height: 72rpx;
  3501. }
  3502. .calc-counter .minus-btn.disable,
  3503. .calc-counter .plus-btn.disable {
  3504. color: #d2d2d2;
  3505. }
  3506. .calc-counter .plus-btn,
  3507. .calc-counter .minus-btn {
  3508. width: 82rpx;
  3509. text-align: center;
  3510. color: #666;
  3511. line-height: 72rpx;
  3512. font-weight: bold;
  3513. padding-bottom: 4rpx;
  3514. font-size: 36rpx;
  3515. }
  3516. .calc-counter .num-input {
  3517. color: #010101;
  3518. font-size: 30rpx;
  3519. border-left: 2rpx solid #d2d2d2;
  3520. border-right: 2rpx solid #d2d2d2;
  3521. width: 72rpx;
  3522. text-align: center;
  3523. height: 72rpx;
  3524. }
  3525. /* 选择规格 */
  3526. .sku-wrapper {
  3527. width: 702rpx;
  3528. background: #ffffff;
  3529. border-radius: 24rpx;
  3530. margin: 16rpx 24rpx 0;
  3531. padding-bottom: 30rpx;
  3532. overflow: hidden;
  3533. }
  3534. .sku-info {
  3535. height: 90rpx;
  3536. position: relative;
  3537. }
  3538. .sku-left {
  3539. width: 700rpx;
  3540. overflow: hidden;
  3541. line-height: 90rpx;
  3542. padding-left: 24rpx;
  3543. display: flex;
  3544. align-items: center;
  3545. height: 90rpx;
  3546. }
  3547. .sku-left view {
  3548. color: #666;
  3549. font-size: 30rpx;
  3550. }
  3551. .sku-left view.current-sku {
  3552. color: #010101;
  3553. margin-left: 18rpx;
  3554. }
  3555. .sku-right {
  3556. position: absolute;
  3557. right: 0;
  3558. top: 0;
  3559. bottom: 0;
  3560. height: 90rpx;
  3561. display: flex;
  3562. align-items: center;
  3563. padding-right: 24rpx;
  3564. width: 120rpx;
  3565. background: linear-gradient(to right, rgba(255, 255, 255, 0.3), #fff 60%);
  3566. /* background:url("https://jzmall.lifejingzhi.com/file/jzmall/weixin/sku-bg.png") no-repeat center;
  3567. background-size: 100% 100%; */
  3568. z-index: 99;
  3569. justify-content: flex-end;
  3570. }
  3571. .sku-right image {
  3572. width: 10rpx;
  3573. height: 20rpx;
  3574. }
  3575. .all-sku {
  3576. display: flex;
  3577. flex-wrap: wrap;
  3578. padding: 0 30rpx 0 98rpx;
  3579. }
  3580. .all-sku .sku-thumb {
  3581. width: 70rpx;
  3582. height: 70rpx;
  3583. border-radius: 10rpx;
  3584. margin-right: 14rpx;
  3585. }
  3586. .all-sku view {
  3587. font-size: 24rpx;
  3588. color: #666;
  3589. line-height: 70rpx;
  3590. margin-left: 24rpx;
  3591. }
  3592. /* 团购评价 */
  3593. .group-evaluation {
  3594. width: 702rpx;
  3595. background: #ffffff;
  3596. border: 1rpx solid #f5f5f5;
  3597. border-radius: 25rpx;
  3598. padding: 30rpx 24rpx 0;
  3599. margin: 16rpx 24rpx;
  3600. }
  3601. .group-evaluation .title {
  3602. height: 40rpx;
  3603. line-height: 40rpx;
  3604. display: flex;
  3605. justify-content: space-between;
  3606. align-items: center;
  3607. }
  3608. .group-evaluation .title .left {
  3609. font-size: 32rpx;
  3610. line-height: 40rpx;
  3611. color: #000;
  3612. font-weight: bold;
  3613. flex: 1;
  3614. }
  3615. .group-evaluation .title .right {
  3616. color: #666;
  3617. font-size: 28rpx;
  3618. display: flex;
  3619. align-items: center;
  3620. justify-content: space-between;
  3621. }
  3622. .group-evaluation .arrow-img {
  3623. width: 12rpx;
  3624. height: 20rpx;
  3625. margin-left: 6rpx;
  3626. }
  3627. .evaluation-item {
  3628. padding: 30rpx 8rpx 30rpx 0;
  3629. padding-right: 8rpx;
  3630. border-bottom: 1rpx solid #f3f3f3;
  3631. display: flex;
  3632. align-items: center;
  3633. justify-content: space-between;
  3634. }
  3635. .evaluation-item:last-child {
  3636. border: none;
  3637. }
  3638. .evaluation-item .item-left {
  3639. width: 510rpx;
  3640. }
  3641. .eval-top {
  3642. display: flex;
  3643. height: 44rpx;
  3644. align-items: center;
  3645. }
  3646. .eval-top .avatar {
  3647. width: 44rpx;
  3648. height: 44rpx;
  3649. border-radius: 44rpx;
  3650. }
  3651. .eval-top .name {
  3652. margin: 0 10rpx;
  3653. font-size: 28rpx;
  3654. color: #000;
  3655. }
  3656. .eval-top .tag {
  3657. height: 38rpx;
  3658. line-height: 38rpx;
  3659. background: rgba(1, 187, 243, 0.1);
  3660. border-radius: 10rpx;
  3661. color: #01bbf3;
  3662. font-size: 24rpx;
  3663. padding: 0 12rpx;
  3664. margin-right: 10rpx;
  3665. }
  3666. .eval-top .hp {
  3667. height: 38rpx;
  3668. line-height: 38rpx;
  3669. background: rgba(255, 71, 71, 0.1);
  3670. border-radius: 10rpx;
  3671. color: #ff5252;
  3672. font-size: 24rpx;
  3673. padding: 0 12rpx;
  3674. }
  3675. .eval-content {
  3676. display: -webkit-box;
  3677. -webkit-box-orient: vertical;
  3678. -webkit-line-clamp: 2;
  3679. text-overflow: ellipsis;
  3680. overflow: hidden;
  3681. line-height: 36rpx;
  3682. margin-top: 8rpx;
  3683. font-size: 26rpx;
  3684. color: #333;
  3685. }
  3686. .evaluation-item .item-right {
  3687. width: 100rpx;
  3688. height: 100rpx;
  3689. }
  3690. .evaluation-item .item-right image {
  3691. width: 100rpx;
  3692. height: 100rpx;
  3693. border-radius: 10rpx;
  3694. }
  3695. /* 产品推荐 */
  3696. .recommend-title {
  3697. height: 103rpx;
  3698. line-height: 102rpx;
  3699. text-align: center;
  3700. color: #000000;
  3701. font-size: 33rpx;
  3702. /* margin-top:-20rpx; */
  3703. }
  3704. .recommend-list {
  3705. display: flex;
  3706. justify-content: space-between;
  3707. flex-wrap: wrap;
  3708. width: 702rpx;
  3709. margin: 0 24rpx;
  3710. }
  3711. .recommend-item {
  3712. width: 334rpx;
  3713. height: 510rpx;
  3714. background: #ffffff;
  3715. border-radius: 20rpx;
  3716. display: flex;
  3717. flex-direction: column;
  3718. margin: 0 0 20rpx;
  3719. }
  3720. .recommend-item image {
  3721. width: 334rpx;
  3722. height: 334rpx;
  3723. margin-bottom: 20rpx;
  3724. border-radius: 20rpx;
  3725. }
  3726. .recommend-goods-name {
  3727. font-size: 26rpx;
  3728. line-height: 40rpx;
  3729. height: 80rpx;
  3730. width: 294rpx;
  3731. display: -webkit-box;
  3732. -webkit-box-orient: vertical;
  3733. -webkit-line-clamp: 2;
  3734. text-overflow: ellipsis;
  3735. overflow: hidden;
  3736. margin: 0 20rpx;
  3737. /* text-indent: -12rpx; */
  3738. color: #333;
  3739. }
  3740. .recommend-goods-price {
  3741. color: #fe2957;
  3742. font-size: 28rpx;
  3743. margin: 10rpx 20rpx 0;
  3744. height: 56rpx;
  3745. }
  3746. .recommend-goods-price text {
  3747. font-size: 36rpx;
  3748. }
  3749. /* 购买提醒 */
  3750. .buy-toast {
  3751. height: 44rpx;
  3752. min-width: 284rpx;
  3753. position: absolute;
  3754. top: 410rpx;
  3755. left: 24rpx;
  3756. background: rgba(0, 0, 0, 0.5);
  3757. border-radius: 45rpx;
  3758. }
  3759. .toast-swiper {
  3760. height: 44rpx;
  3761. width: 320rpx;
  3762. }
  3763. .toast-item {
  3764. align-items: center;
  3765. display: flex;
  3766. height: 44rpx;
  3767. padding: 0 14rpx 0 10rpx;
  3768. }
  3769. .toast-item image {
  3770. width: 28rpx;
  3771. height: 28rpx;
  3772. border-radius: 28rpx;
  3773. margin-right: 8rpx;
  3774. }
  3775. .toast-item view {
  3776. font-size: 24rpx;
  3777. color: #fff;
  3778. white-space: nowrap;
  3779. }
  3780. /* 规格弹框 */
  3781. .appoint-overlay-wrapper {
  3782. position: fixed;
  3783. top: 0;
  3784. left: 0;
  3785. width: 100%;
  3786. height: 100%;
  3787. background-color: rgba(0, 0, 0, 0.7);
  3788. z-index: 999;
  3789. display: flex;
  3790. align-items: flex-end;
  3791. }
  3792. .spu-popup {
  3793. /* height: 784rpx; */
  3794. width: 750rpx;
  3795. background: #fff;
  3796. padding: 30rpx 30rpx;
  3797. border-radius: 20rpx 20rpx 0 0;
  3798. }
  3799. .popup-good {
  3800. height: 130rpx;
  3801. display: flex;
  3802. padding: 0 0 30rpx 0;
  3803. border-bottom: 1rpx solid #eee;
  3804. justify-content: space-between;
  3805. }
  3806. .popup-good .left {
  3807. display: flex;
  3808. align-items: flex-end;
  3809. }
  3810. .popup-good .left image {
  3811. width: 100rpx;
  3812. height: 100rpx;
  3813. border-radius: 10rpx;
  3814. }
  3815. .popup-good .spu-price {
  3816. color: #ff1643;
  3817. font-size: 34rpx;
  3818. font-weight: bold;
  3819. margin: 0 14rpx 0 20rpx;
  3820. line-height: 30rpx;
  3821. }
  3822. .popup-good .spu-price text {
  3823. font-size: 48rpx;
  3824. }
  3825. .popup-good .spu-price-old {
  3826. text-decoration: line-through;
  3827. color: #999999;
  3828. font-size: 24rpx;
  3829. }
  3830. .popup-good .sku-close {
  3831. width: 48rpx;
  3832. height: 48rpx;
  3833. }
  3834. .sku-list-block {
  3835. min-height: 420rpx;
  3836. padding-bottom: 180rpx;
  3837. }
  3838. .sku-list-block .spu-title {
  3839. height: 86rpx;
  3840. line-height: 86rpx;
  3841. font-weight: bold;
  3842. font-size: 28rpx;
  3843. }
  3844. .sku-list-block .sku-item {
  3845. margin-bottom: 24rpx;
  3846. }
  3847. .sku-list-block .sku-item view {
  3848. padding: 0 24rpx;
  3849. height: 50rpx;
  3850. line-height: 48rpx;
  3851. border: 1rpx solid #999999;
  3852. border-radius: 10rpx;
  3853. color: #333;
  3854. font-size: 24rpx;
  3855. display: inline-block;
  3856. }
  3857. .sku-list-block .sku-item.active-sku view {
  3858. color: #00c0ff;
  3859. background: rgba(1, 187, 243, 0.1);
  3860. border-color: #00c0ff;
  3861. }
  3862. .sku-btn {
  3863. width: 690rpx;
  3864. height: 880rpx;
  3865. border-radius: 88rpx;
  3866. line-height: 88rpx;
  3867. text-align: center;
  3868. color: #ffff;
  3869. /* background: #00B9FF; */
  3870. background: #fe2b54;
  3871. font-size: 32rpx;
  3872. }
  3873. .final-price {
  3874. flex: 1;
  3875. display: flex;
  3876. align-items: center;
  3877. height: 80rpx;
  3878. margin-left: 12rpx;
  3879. }
  3880. .final-price .total-new {
  3881. color: #ff1643;
  3882. font-size: 32rpx;
  3883. }
  3884. .final-price .total-new text {
  3885. font-size: 46rpx;
  3886. font-weight: bold;
  3887. }
  3888. .final-price .total-old {
  3889. text-decoration: line-through;
  3890. font-size: 24rpx;
  3891. color: #999;
  3892. margin-left: 12rpx;
  3893. padding-top: 10rpx;
  3894. }
  3895. /* 关联工单 */
  3896. .service-list {
  3897. margin: 0 24rpx;
  3898. }
  3899. .service-item {
  3900. margin-top: 24rpx;
  3901. background: #ffffff;
  3902. border-radius: 24rpx;
  3903. width: 702rpx;
  3904. padding: 0 24rpx;
  3905. }
  3906. .order-title {
  3907. height: 100rpx;
  3908. line-height: 100rpx;
  3909. font-weight: bold;
  3910. color: #000;
  3911. font-size: 32rpx;
  3912. border-bottom: 2rpx solid #e0e0e0;
  3913. }
  3914. .service-item .service-title {
  3915. height: 80rpx;
  3916. display: flex;
  3917. align-items: center;
  3918. border-bottom: 2rpx solid #e0e0e0;
  3919. }
  3920. .service-title .sercive-name {
  3921. color: #191919;
  3922. font-size: 30rpx;
  3923. font-weight: bold;
  3924. }
  3925. .service-title .service-id {
  3926. color: #666666;
  3927. font-size: 24rpx;
  3928. margin: 0 12rpx 0 0;
  3929. flex: 1;
  3930. }
  3931. .service-title .service-status {
  3932. color: #008dff;
  3933. font-size: 26rpx;
  3934. }
  3935. .service-main {
  3936. padding: 12rpx 0 16rpx;
  3937. }
  3938. .customer-info {
  3939. display: flex;
  3940. align-items: center;
  3941. }
  3942. .customer-info image {
  3943. width: 48rpx;
  3944. height: 48rpx;
  3945. margin-right: 24rpx;
  3946. }
  3947. .customer-info .customer-main {
  3948. display: flex;
  3949. padding: 18rpx 0 4rpx;
  3950. flex-direction: column;
  3951. flex: 1;
  3952. }
  3953. .main-line {
  3954. display: flex;
  3955. height: 44rpx;
  3956. margin-bottom: 4rpx;
  3957. align-items: center;
  3958. }
  3959. .main-line view {
  3960. color: #333333;
  3961. font-size: 32rpx;
  3962. }
  3963. .main-line view.phone {
  3964. color: #999999;
  3965. font-size: 24rpx;
  3966. margin-left: 14rpx;
  3967. }
  3968. .customer-info .customer-address {
  3969. color: #666666;
  3970. line-height: 40rpx;
  3971. }
  3972. .service-main .row {
  3973. /* height: 56rpx;
  3974. line-height: 56rpx; */
  3975. display: flex;
  3976. color: rgba(0, 0, 0, 0.9);
  3977. font-size: 26rpx;
  3978. font-weight: bold;
  3979. align-items: center;
  3980. margin: 10rpx 0;
  3981. }
  3982. .service-main .row text {
  3983. color: #666666;
  3984. font-weight: normal;
  3985. /* white-space: nowrap; */
  3986. }
  3987. .service-remark-wrapper {
  3988. padding: 24rpx 0;
  3989. border-top: 2rpx solid #e0e0e0;
  3990. }
  3991. .service-store {
  3992. height: 36rpx;
  3993. display: flex;
  3994. align-items: center;
  3995. justify-content: space-between;
  3996. }
  3997. .service-store > view {
  3998. display: flex;
  3999. height: 36rpx;
  4000. align-items: center;
  4001. }
  4002. .store-left image {
  4003. width: 36rpx;
  4004. height: 36rpx;
  4005. margin-right: 16rpx;
  4006. }
  4007. .store-left view {
  4008. color: rgba(0, 0, 0, 0.9);
  4009. font-size: 26rpx;
  4010. font-weight: bold;
  4011. }
  4012. .store-right view {
  4013. color: #666666;
  4014. font-size: 24rpx;
  4015. }
  4016. .store-right image {
  4017. width: 24rpx;
  4018. height: 24rpx;
  4019. margin-left: 16rpx;
  4020. }
  4021. .service-remark-wrapper .service-remark {
  4022. width: 652rpx;
  4023. /* height: 56rpx; */
  4024. line-height: 44rpx;
  4025. background: #ebebeb;
  4026. border-radius: 16rpx;
  4027. color: #000000;
  4028. padding: 8rpx 16rpx;
  4029. /* white-space: nowrap;
  4030. text-overflow: ellipsis;*/
  4031. display: -webkit-box;
  4032. -webkit-box-orient: vertical;
  4033. -webkit-line-clamp: 2;
  4034. text-overflow: ellipsis;
  4035. overflow: hidden;
  4036. margin-top: 20rpx;
  4037. }
  4038. .service-remark text {
  4039. color: #fe2b54;
  4040. font-weight: bold;
  4041. }
  4042. .service-operate {
  4043. padding: 24rpx 0;
  4044. border-top: 2rpx solid #e0e0e0;
  4045. display: flex;
  4046. justify-content: flex-end;
  4047. }
  4048. .service-operate view {
  4049. width: 160rpx;
  4050. height: 56rpx;
  4051. line-height: 56rpx;
  4052. border-radius: 28rpx;
  4053. text-align: center;
  4054. color: #f9f4f5;
  4055. font-size: 24rpx;
  4056. background: linear-gradient(90deg, #00baff 0%, #008dff 100%);
  4057. margin-left: 28rpx;
  4058. }
  4059. </style>