goods.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813
  1. <template>
  2. <app-layout>
  3. <view v-if="goods.id == 0" class="u-goods-detail"></view>
  4. <view class="app-goods" v-show="loading" v-if="goods.id > 0">
  5. <view class="banner">
  6. <app-banner
  7. :videoUrl="goods.video_url"
  8. :share="goods.share"
  9. :picList="goods.pic_url"
  10. :goods_id="goods_id"
  11. :isCart="false"
  12. sign="wholesale"
  13. ></app-banner>
  14. </view>
  15. <!-- 批发信息 -->
  16. <view v-if="goods && goods.section.length > 1 && goods.is_negotiable == 0" class="wholesale main-center cross-center" :style="{'background-color': getTheme.background}">
  17. <view class="wholesale-item" v-for="(item,index) in goods.section" :key="index">
  18. <view>
  19. <view class="wholesale-price t-omit">¥<text>{{item.price}}</text></view>
  20. <view>{{item.display_num}}{{goods.unit}}</view>
  21. </view>
  22. </view>
  23. </view>
  24. <bd-info
  25. v-if="goods"
  26. :theme="getTheme"
  27. :name="goods.name"
  28. :is-negotiable="goods.is_negotiable"
  29. :subtitle="goods.subtitle"
  30. :flash-sale="flash_sale"
  31. :level-show="goods.level_show"
  32. :price="goods.price"
  33. :original-price="goods.original_price"
  34. :price-max="goods.price_max"
  35. :price-min="goods.price_min"
  36. :price-member-max="goods.price_member_max"
  37. :price-member-min="goods.price_member_min"
  38. :discount='discount'
  39. :is-vip-card-user="is_vip_card_user"
  40. :sales="goods.sales"
  41. :unit="goods.unit"
  42. :is-sales="goods.is_sales"
  43. :is-vip="is_vip"
  44. :goods-id="goods.id"
  45. :extra-quick-share="goods.extra_quick_share"
  46. :app-share-pic="goods.app_share_pic"
  47. :app-share-title="goods.app_share_title"
  48. :poster-config="poster_config + `&goods_id=` + goods.id"
  49. :poster-generate="poster_generate + `&goods_id=` + goods.id"
  50. :has-poster-nav="true"
  51. v-bind:goods="goods"
  52. @share="hShareAppMessage"
  53. :limit-buy="goods.limit_buy"
  54. :min-number="goods.wholesaleGoods.rise_num"
  55. >
  56. </bd-info>
  57. <!--商品优惠券-->
  58. <bd-coupon v-if="goods && goods.id > 0" @change="setCoupon" :theme="getTheme" :coupons="goods.goods_coupon_center"></bd-coupon>
  59. <bd-xbc
  60. v-if="goods && goods.id > 0"
  61. :coAttr="is_open"
  62. :attr-list="selectAttr.attr_list"
  63. :type="goods.type"
  64. :guarantee-title="goods.guarantee_title"
  65. :guarantee-pic="goods.guarantee_pic"
  66. :param_content="goods.param_content"
  67. :param_name="goods.param_name"
  68. :services="goods.services"
  69. :attr-groups="goods.attr_groups"
  70. :goods-stock="goods.goods_num"
  71. @openAttr="clickAttr"
  72. ></bd-xbc>
  73. <!--商品信息-->
  74. <bd-hc
  75. v-if="goods && goods.goods_marketing_award"
  76. :integral="goods.goods_marketing_award.integral"
  77. :coupon="goods.goods_marketing_award.coupon"
  78. :card="goods.goods_marketing_award.card"
  79. :balance="goods.goods_marketing_award.balance"
  80. :theme="getTheme"
  81. ></bd-hc>
  82. <bd-kb
  83. v-if="goods && goods.goods_marketing_award"
  84. :limit="goods.goods_marketing.limit"
  85. :express="goods.express"
  86. :shipping="goods.goods_marketing.shipping"
  87. :pickup="goods.goods_marketing.pickup"
  88. ></bd-kb>
  89. <view class="attr">
  90. <app-attr v-if="goods.id > 0 && goods.is_negotiable == 0" :goods="goods"
  91. :attrGroupList="goods.attr_groups"
  92. @attrtap="attrtap"
  93. ref="attr"
  94. sign="wholesale"
  95. :chooseNumber="false"
  96. :show="show"
  97. :selectAttr="selectAttr"
  98. :previewUrl="previewUrl"
  99. :submitUrl="submitUrl"
  100. :totalNumber="totalNumber"
  101. :totalPrice="totalPrice"
  102. :discount="wholesaleDiscount"
  103. :wholesaleType="goods.wholesaleGoods.type"
  104. @attr="attr"
  105. :is_show_buy="showRight"
  106. :buy-text="rightRemindText"
  107. :theme="getTheme"
  108. >
  109. </app-attr>
  110. </view>
  111. <bd-comments v-if="goods.id" :goods-id="goods.id"></bd-comments>
  112. <!--商品详情-->
  113. <bd-detail :detail="goods.detail"></bd-detail>
  114. <!--空格区域-->
  115. <view class="safe-area-inset-bottom u-bottom">
  116. <view class="u-bottom-height" :class="uBottomHeight"></view>
  117. </view>
  118. <!--底部按钮-->
  119. <view v-if="is_open == 1" class="safe-area-inset-bottom u-bottom-fixed">
  120. <view v-if="full_reduce">
  121. <app-goods-full-reduce
  122. :theme="getTheme"
  123. :full_reduce="full_reduce"
  124. :sign="goods.type === 'goods' ? '' : 1"
  125. >
  126. </app-goods-full-reduce>
  127. </view>
  128. <view v-if="goods.sell_time > 0">
  129. <app-sell-tip :time="goods.sell_time" @changeTime="changeTime"></app-sell-tip>
  130. </view>
  131. <view class="bd-bottom u-bottom-height-0 dir-left-nowrap cross-center" >
  132. <view class="bd-back dir-top-nowrap main-center cross-center box-grow-0" @click="back">
  133. <image class="bd-icon" src="../../../static/image/icon/index.png"></image>
  134. <text class="bd-text">首页</text>
  135. </view>
  136. <bd-service :name="goods.name" :url="webUrl"></bd-service>
  137. <view class="bd-back dir-top-nowrap main-center cross-center box-grow-0" @click="favorite">
  138. <image class="bd-icon" :src="goods.favorite ? '../../../static/image/icon/icon-favorite-active.png' : '../../../static/image/icon/icon-favorite.png'"></image>
  139. <text class="bd-text">收藏</text>
  140. </view>
  141. <template v-if="goods.is_negotiable !== 1">
  142. <view class="box-grow-1 bd-btn bd-btn-color" :class="[disableBtn]" v-if="goods.goods_num === 0 || goods.is_finish_sell > 0">
  143. {{goods.is_finish_sell > 0 ? '商品已下架' : '已售罄'}}
  144. </view>
  145. <view class="box-grow-1 dir-left-nowrap" v-else>
  146. <view v-if="goods.type === 'goods'"
  147. @click="clickAttr(0)"
  148. :style="{'background': getTheme.background_s_gradient_btn,'color': getTheme.secondary_text}"
  149. :class="['bd-btn', leftTip]"
  150. >
  151. 加入购物车
  152. </view>
  153. <view :class="[goods.type === 'goods' ? 'bd-btn-half' : 'box-grow-1']" v-if="showRight">
  154. <app-jump-button form>
  155. <view
  156. @click="clickAttr(1)"
  157. :class="['bd-btn', 'bd-btn-color', goods.type === 'goods' ? 'bd-btn-right box-grow-1' : 'box-grow-1']"
  158. :style="{'background-color': getTheme.background,'color': getTheme.main_text}"
  159. >{{rightRemindText}}
  160. </view>
  161. </app-jump-button>
  162. </view>
  163. </view>
  164. </template>
  165. <view class="box-grow-1 dir-left-nowrap bd-btn-tel" v-else>
  166. <block v-for="(item, index) in good_negotiable" :key="index">
  167. <view class="tel"
  168. v-if="item === 'contact_tel'"
  169. @click="makePhoneCall(mall.setting.contact_tel)"
  170. :style="{'background': good_negotiable.length === 1 ? getTheme.background_gradient_btn : getTheme.background_s_gradient_btn,'color': good_negotiable.length === 2 ? getTheme.color : ''}"
  171. :class="[good_negotiable.length === 1 ? 'all-radius all-width text ' : ' ' , good_negotiable.length === 3 ? 'bd-three-one text' : '', good_negotiable.length === 2 ? 'bd-btn-half': '']"
  172. >
  173. 联系电话
  174. </view>
  175. <!-- #ifndef MP-TOUTIAO || MP-ALIPAY || H5 -->
  176. <button v-else-if="item === 'contact'"
  177. open-type="contact"
  178. show-message-card
  179. :send-message-title="goods.name"
  180. :send-message-path="webUrl"
  181. :style="contactBtnStyle"
  182. class="contact" :class="contactBtn">
  183. 客服
  184. </button>
  185. <!-- #endif -->
  186. <view class="service"
  187. v-else-if="item === 'contact_web'"
  188. @click="router('/pages/web/web?url=' + encodeURIComponent(mall.setting.web_service_url))"
  189. :style="{'background-color': good_negotiable.length !== 3 ? getTheme.background_gradient_btn : ''}"
  190. :class="good_negotiable.length === 3 ? 'default-bakground bd-three-one ' : good_negotiable.length === 2 ? ' bd-btn-half text ' : ' all-radius all-width '" >
  191. 客服
  192. </view>
  193. </block>
  194. </view>
  195. </view>
  196. </view>
  197. </view>
  198. <app-close v-if="showClose" :modal="false" @update="getMall"></app-close>
  199. </app-layout>
  200. </template>
  201. <script>
  202. import {mapState, mapGetters} from 'vuex';
  203. import appBanner from '../../../components/page-component/goods/app-goods-banner.vue';
  204. import appAttr from '../components/app-attr/app-attr.vue';
  205. import appGoodsFullReduce from "../../../components/page-component/goods/app-goods-full-reduce.vue";
  206. import bdInfo from '@/components/page-component/goods/bd-info';
  207. import bdCoupon from '@/components/page-component/goods/bd-coupon.vue';
  208. import bdXbc from '@/components/page-component/goods/bd-xbc.vue';
  209. import bdKb from '@/components/page-component/goods/bd-kb.vue';
  210. import bdHc from '@/components/page-component/goods/bd-hc.vue';
  211. import bdDetail from '@/components/page-component/goods/bd-detail.vue';
  212. import bdComments from '@/components/page-component/goods/bd-comments.vue';
  213. import appClose from '@/components/basic-component/app-close/app-close.vue';
  214. import bdService from '@/components/page-component/goods/bd-service.vue';
  215. import appSellTip from '@/components/page-component/goods/app-sell-tip.vue';
  216. import goodsMixin from '@/core/goods-mixin.js';
  217. export default {
  218. name: 'goods',
  219. mixins: [goodsMixin],
  220. data() {
  221. return {
  222. showClose: false,
  223. is_open: 0,
  224. goods: {
  225. id: '',
  226. name: '',
  227. cover_pic: '',
  228. price: '',
  229. section: [],
  230. wholesaleGoods: {
  231. rise_num: 0
  232. }
  233. },
  234. selectAttr: {
  235. attr_list: []
  236. },
  237. webUrl: '',
  238. previewUrl: this.$api.wholesale.order_preview,
  239. submitUrl: this.$api.wholesale.order_submit,
  240. show: 0,
  241. list: [],
  242. appAttr: {},
  243. totalNumber: 0,
  244. totalPrice: '0.00',
  245. poster_config: this.$api.wholesale.poster_config,
  246. poster_generate: this.$api.wholesale.poster_generate,
  247. url: this.$api.wholesale.poster,
  248. goods_id: -1,
  249. loading: false,
  250. first: true,
  251. is_vip: false,
  252. is_vip_card_user: 0,
  253. discount: null,
  254. full_reduce: null,
  255. flash_sale: null,
  256. wholesaleDiscount: 0
  257. }
  258. },
  259. onLoad(options) { this.$commonLoad.onload(options);
  260. let that = this;
  261. that.goods_id = options.id;
  262. that.webUrl = '/plugins/wholesale/goods/goods?id=' + options.id;
  263. // #ifdef MP-WEIXIN
  264. wx.showShareMenu({
  265. menus: ['shareAppMessage', 'shareTimeline']
  266. })
  267. // #endif
  268. that.$showLoading({
  269. type: 'global',
  270. text: '加载中...'
  271. });
  272. that.request({
  273. url: that.$api.wholesale.detail,
  274. data: {
  275. id: that.goods_id,
  276. }
  277. }).then(response => {
  278. that.first = false;
  279. that.goods = response.detail;
  280. if (response.detail.goods_activity) {
  281. this.full_reduce = response.detail.goods_activity.full_reduce;
  282. }
  283. if(that.goods.vip_card_appoint.discount > 0) {
  284. that.is_vip = true;
  285. that.discount = that.goods.vip_card_appoint.discount
  286. }
  287. that.is_vip_card_user = that.goods.vip_card_appoint.is_vip_card_user;
  288. for(let item of that.goods.attr) {
  289. item.number = '0';
  290. }
  291. if(that.goods.attr_groups.length == 1) {
  292. that.goods.attr[0].number = '0';
  293. }else {
  294. for(let item of that.goods.attr_groups) {
  295. item.less_attr_group_name = item.attr_group_name.substring(0,10);
  296. item.scrollLeft = 0;
  297. for(let i in item.attr_list) {
  298. item.attr_list[i].active = i > 0 ? false : true;
  299. item.attr_list[i].number = 0;
  300. }
  301. }
  302. }
  303. that.flash_sale = that.goods.plugin_extra.flash_sale;
  304. that.loading = true;
  305. that.$hideLoading();
  306. // #ifdef H5
  307. that.hShareAppMessage();
  308. // #endif
  309. });
  310. },
  311. onShow() {
  312. this.showClose = false;
  313. setTimeout(()=>{
  314. this.showClose = true;
  315. })
  316. if(this.first) {
  317. return false
  318. }
  319. let attr = JSON.parse(JSON.stringify(this.goods.attr));
  320. let attr_groups = JSON.parse(JSON.stringify(this.goods.attr_groups));
  321. this.$showLoading();
  322. this.$nextTick(() => {
  323. let that = this;
  324. that.request({
  325. url: that.$api.wholesale.detail,
  326. data: {
  327. id: that.goods_id,
  328. }
  329. }).then(response => {
  330. that.goods = response.detail;
  331. that.goods.attr = attr;
  332. that.goods.attr_groups = attr_groups;
  333. this.$hideLoading();
  334. });
  335. })
  336. },
  337. computed: {
  338. ...mapState({
  339. isTip: state => state.mallConfig.mall.setting.is_remind_sell_time,
  340. mall: state => state.mallConfig.mall,
  341. }),
  342. ...mapGetters('mallConfig', {
  343. getTheme: 'getTheme',
  344. }),
  345. good_negotiable: function() {
  346. let good_negotiable = this.mall.setting.good_negotiable;
  347. this.contact_tel = '';
  348. this.contact = '';
  349. this.contact_web = '';
  350. let arr = [];
  351. for (let i = 0; i < good_negotiable.length; i++) {
  352. if (good_negotiable[i] === 'contact_tel') {
  353. this.contact_tel = 'contact_tel';
  354. }
  355. // #ifndef MP-TOUTIAO || MP-ALIPAY || H5
  356. if (good_negotiable[i] === 'contact') {
  357. this.contact = 'contact';
  358. }
  359. // #endif
  360. if (good_negotiable[i] === 'contact_web') {
  361. this.contact_web = 'contact_web';
  362. }
  363. }
  364. if (this.contact_tel) {
  365. arr.push(this.contact_tel);
  366. }
  367. if (this.contact) {
  368. arr.push(this.contact);
  369. }
  370. if (this.contact_web) {
  371. arr.push(this.contact_web);
  372. }
  373. return arr;
  374. },
  375. contactBtnStyle: function() {
  376. const len = this.good_negotiable.length;
  377. const theme = this.getTheme.key;
  378. if (len === 3 && (theme === 'a' || theme === 'b' || theme === 'f')) {
  379. return `background:${this.getTheme.background_gradient_btn}`;
  380. } else if (len === 3 && !(theme === 'a' || theme === 'b' || theme === 'f')) {
  381. return `background:${this.getTheme.background_gradient_btn};color:${this.getTheme.color};`;
  382. } if (len === 2 && (theme === 'a' || theme === 'b' || theme === 'f') && !this.contact_tel) {
  383. return `background:${this.getTheme.background_s_gradient_btn}`;
  384. } else if (len === 2 && (theme === 'a' || theme === 'b' || theme === 'f') && this.contact_tel) {
  385. return `background:${this.getTheme.background_gradient_btn}`;
  386. } else if (len === 2 && !(theme === 'a' || theme === 'b' || theme === 'f') && !this.contact_tel) {
  387. return `background:${this.getTheme.background_s_gradient_btn};color:${this.getTheme.color}`;
  388. } else if (len === 2 && !(theme === 'a' || theme === 'b' || theme === 'f') && this.contact_tel) {
  389. return `background:${this.getTheme.background_gradient_btn};color:${this.getTheme.color}`;
  390. } else {
  391. return `background:${this.getTheme.background_gradient_btn}`;
  392. }
  393. },
  394. contactBtn: function() {
  395. const len = this.good_negotiable.length;
  396. const theme = this.getTheme.key;
  397. if (len === 3 && (theme === 'a' || theme === 'b' || theme === 'f')) {
  398. return `text bd-three-one bd-no-radius `;
  399. } else if (len === 3 && !(theme === 'a' || theme === 'b' || theme === 'f')) {
  400. return `bd-three-one bd-no-radius `;
  401. } if (len === 2 && (theme === 'a' || theme === 'b' || theme === 'f') && !this.contact_tel) {
  402. return `text bd-btn-half bd-content-radius-0`;
  403. } else if (len === 2 && (theme === 'a' || theme === 'b' || theme === 'f') && this.contact_tel) {
  404. return `text bd-btn-half bd-content-radius-1`;
  405. } else if (len === 2 && !(theme === 'a' || theme === 'b' || theme === 'f') && !this.contact_tel) {
  406. return `bd-btn-half bd-content-radius-0`;
  407. } else if (len === 2 && !(theme === 'a' || theme === 'b' || theme === 'f') && this.contact_tel) {
  408. return `bd-btn-half bd-content-radius-1`;
  409. } else {
  410. return `text all-width all-radius `;
  411. }
  412. },
  413. uBottomHeight() {
  414. if (this.full_reduce && this.goods.sell_time > 0) {
  415. return 'u-bottom-height-2';
  416. } else if (this.full_reduce || this.goods.sell_time > 0) {
  417. return 'u-bottom-height-1';
  418. } else {
  419. return 'u-bottom-height-0';
  420. }
  421. },
  422. leftTip() {
  423. let leftTip = '';
  424. if (!(this.isTip == 0 && this.goods.sell_time > 0)) {
  425. leftTip = 'bd-btn-left bd-btn-half';
  426. } else {
  427. leftTip = 'box-grow-1';
  428. }
  429. return this.goods && this.goods.type === 'goods' ? leftTip : '';
  430. },
  431. disableBtn() {
  432. return this.goods.is_finish_sell ? 'btn-finish-sell' : 'bd-oversell-btn';
  433. },
  434. showRight() {
  435. return !(this.isTip == 0 && this.goods.sell_time > 0)
  436. },
  437. remindParams() {
  438. return {
  439. sell_time: this.goods.sell_time,
  440. goods_id: this.goods.id,
  441. template_message_list: this.goods.template_message_list,
  442. buy_text: '立即购买'
  443. };
  444. },
  445. },
  446. // #ifdef MP-WEIXIN
  447. onShareTimeline() {
  448. // 分享朋友圈beta
  449. return this.$shareTimeline({
  450. title: this.goods.app_share_title ? this.goods.app_share_title : this.goods.name,
  451. imageUrl: this.goods.pic_url[0].pic_url,
  452. query: {
  453. id: this.goods.id
  454. }
  455. });
  456. },
  457. // #endif
  458. // #ifdef MP
  459. onShareAppMessage() {
  460. return this.hShareAppMessage();
  461. },
  462. // #endif
  463. methods: {
  464. hShareAppMessage(s = false){
  465. return this.$shareAppMessage({
  466. path: '/plugins/wholesale/goods/goods',
  467. title: this.goods.app_share_title ? this.goods.app_share_title : this.goods.name,
  468. imageUrl: this.goods.app_share_pic ? this.goods.app_share_pic : this.goods.pic_url[0].pic_url,
  469. desc: this.goods.subtitle,
  470. params: {
  471. id: this.goods.id
  472. }
  473. }, s);
  474. },
  475. getMall(e) {
  476. this.is_open = e.is_open;
  477. },
  478. setCoupon(index) {
  479. this.$set(this.goods.goods_coupon_center[index], 'is_receive', 1);
  480. },
  481. clickAttr(data) {
  482. if (data === 1 && this.goods.sell_time > 0) {
  483. this.rightTip();
  484. return ;
  485. }
  486. this.show = Math.random();
  487. },
  488. attr(data) {
  489. this.appAttr = data;
  490. },
  491. favorite() {
  492. let url = this.$api.user.favorite_add;
  493. let favorite = true;
  494. if (this.goods.favorite) {
  495. url = this.$api.user.favorite_remove;
  496. favorite = false;
  497. }
  498. this.goods.favorite = favorite;
  499. this.$request({
  500. url: url,
  501. data: {
  502. goods_id: this.goods.id,
  503. }
  504. }).then(response => {
  505. if (response.code === 0) {
  506. } else {
  507. uni.showModal({
  508. title: '提示',
  509. content: response.msg,
  510. showCancel: false,
  511. });
  512. }
  513. }).catch(e => {
  514. });
  515. },
  516. back() {
  517. uni.reLaunch({
  518. url: '/pages/index/index'
  519. });
  520. },
  521. async request({url, data}) {
  522. const response = await this.$request({
  523. url: url,
  524. data: data,
  525. });
  526. if (response.code === 0) {
  527. return response.data;
  528. }else {
  529. uni.showToast({
  530. title: response.msg,
  531. icon: 'none',
  532. duration: 1000
  533. });
  534. setTimeout(()=>{
  535. uni.navigateBack();
  536. },1000)
  537. }
  538. },
  539. attrtap(e) {
  540. let that = this;
  541. if (e.goods !== null) {
  542. that.goods = e.goods;
  543. if(e.goodsAttr && e.goodsAttr !== 'undefined') {
  544. for(let row of e.goodsAttr) {
  545. for(let item of that.goods.attr) {
  546. if(row.id == item.id) {
  547. item.number = row.number
  548. }
  549. }
  550. }
  551. }
  552. that.totalNumber = 0;
  553. let totalPrice = 0;
  554. for(let item of that.goods.attr) {
  555. that.totalNumber += +item.number;
  556. if(item.number > 0) {
  557. let price = that.goods.level_show === 1 ? item.price_member : item.price;
  558. totalPrice += item.number*price;
  559. }
  560. }
  561. if(that.goods.attr_groups.length > 1) {
  562. for(let row of that.goods.attr_groups[0].attr_list) {
  563. row.number = 0;
  564. for(let item of that.goods.attr) {
  565. if(item.number > 0) {
  566. if(row.attr_id == item.attr_list[0].attr_id && row.attr_name == item.attr_list[0].attr_name) {
  567. row.number += +item.number
  568. row.length = -5 - (+(row.number.toString().length) * 10)
  569. }
  570. }
  571. }
  572. }
  573. }
  574. setTimeout(()=>{
  575. let get = 0;
  576. for(let i of that.goods.wholesaleGoods.wholesale_rules) {
  577. if(!(that.totalNumber < i.num)) {
  578. this.wholesaleDiscount = +i.discount
  579. get++
  580. }
  581. }
  582. if(get == 0) {
  583. this.wholesaleDiscount = that.goods.wholesaleGoods.type == 0 ? 10 : 0
  584. }
  585. if(this.wholesaleDiscount > 0) {
  586. if(that.goods.wholesaleGoods.type == 0) {
  587. totalPrice = totalPrice*(this.wholesaleDiscount/10)
  588. }else {
  589. totalPrice = totalPrice - (this.wholesaleDiscount*that.totalNumber)
  590. }
  591. }
  592. that.totalPrice = totalPrice.toFixed(2);
  593. },0)
  594. }
  595. },
  596. makePhoneCall(number) {
  597. uni.makePhoneCall({
  598. phoneNumber: number
  599. });
  600. },
  601. router(url) {
  602. uni.navigateTo({
  603. url: url
  604. })
  605. },
  606. changeTime(time) {
  607. this.goods.sell_time = time;
  608. },
  609. },
  610. components: {
  611. 'app-banner': appBanner,
  612. 'app-attr': appAttr,
  613. 'app-goods-full-reduce': appGoodsFullReduce,
  614. appClose,
  615. bdInfo,
  616. bdCoupon,
  617. bdXbc,
  618. bdKb,
  619. bdHc,
  620. bdDetail,
  621. bdComments,
  622. bdService,
  623. appSellTip
  624. }
  625. }
  626. </script>
  627. <style scoped lang="scss">
  628. .vip-card {
  629. padding-bottom: #{20rpx};
  630. background-color: #fff;
  631. }
  632. .wholesale {
  633. height: 88rpx;
  634. color: #fff;
  635. .wholesale-item {
  636. display: flex;
  637. margin: 0 12rpx;
  638. justify-content: center;
  639. align-items: center;
  640. font-size: 22rpx;
  641. width: 218rpx;
  642. .wholesale-price {
  643. font-size: 26rpx;
  644. margin-top: -5rpx;
  645. text {
  646. font-size: 44rpx;
  647. }
  648. }
  649. >view {
  650. display: inline-block;
  651. >view {
  652. margin-top: -10rpx;
  653. }
  654. }
  655. &:first-of-type {
  656. justify-content: flex-start;
  657. }
  658. &:last-of-type {
  659. justify-content: flex-end;
  660. }
  661. }
  662. }
  663. .app-goods {
  664. background-color: #f7f7f7;
  665. }
  666. .bd-bottom {
  667. width: 750upx;
  668. height: 110upx;
  669. padding: 20upx 24upx;
  670. }
  671. .bd-back {
  672. width: 66upx;
  673. height: 100%;
  674. margin-right: 20upx;
  675. }
  676. .bd-icon {
  677. width: 30upx;
  678. height: 30upx;
  679. margin-bottom: 8upx;
  680. }
  681. .bd-text {
  682. font-size: 20upx;
  683. color: #888888;
  684. line-height: 1;
  685. }
  686. .bd-btn {
  687. text-align: center;
  688. line-height: 70upx;
  689. font-size: 26upx;
  690. border-radius: 35upx;
  691. }
  692. .bd-btn-left {
  693. border-top-right-radius: 0;
  694. border-bottom-right-radius: 0;
  695. }
  696. .bd-btn-right {
  697. border-top-left-radius: 0;
  698. border-bottom-left-radius: 0;
  699. }
  700. .bd-btn-half {
  701. width: 50%;
  702. }
  703. .bd-btn-color {
  704. color: #ffffff;
  705. }
  706. .bd-oversell-btn {
  707. background-color: #CDCDCD;
  708. }
  709. .bd-content-radius-0 {
  710. border-radius: 35upx 0 0 35upx;
  711. }
  712. .bd-content-radius-1 {
  713. border-radius:0 35upx 35upx 0;
  714. }
  715. .bd-btn-tel {
  716. >view {
  717. line-height: 70upx;
  718. text-align: center;
  719. }
  720. .tel {
  721. border-top-left-radius: 35upx;
  722. border-bottom-left-radius: 35upx;
  723. }
  724. .contact {
  725. padding: 0;
  726. height: 70upx;
  727. line-height: 70upx;
  728. margin: 0;
  729. border: none;
  730. }
  731. .service {
  732. border-top-right-radius: 35upx;
  733. border-bottom-right-radius: 35upx;
  734. }
  735. .all-radius {
  736. border-radius: 35upx;
  737. }
  738. .all-width {
  739. width: 100%;
  740. }
  741. .bd-three-one {
  742. width: calc(100%/3);
  743. }
  744. .bd-no-radius {
  745. border-radius: 0;
  746. }
  747. }
  748. .product-list {
  749. background-color: white;
  750. }
  751. .join-member {
  752. background-color: #ffffff;
  753. padding: 0 #{24rpx};
  754. }
  755. .text {
  756. color: #ffffff;
  757. }
  758. .default-bakground {
  759. background-color: #446dfd;
  760. color: #ffffff;
  761. }
  762. .u-bottom-fixed {
  763. position: fixed;
  764. bottom: 0;
  765. left: 0;
  766. width: 100%;
  767. z-index: 1500;
  768. background-color: #ffffff;
  769. }
  770. .u-bottom-height-0 {
  771. height: 110upx;
  772. }
  773. .u-bottom-height-1 {
  774. height: 190upx;
  775. }
  776. .goods-margin {
  777. margin-top: 20upx;
  778. }
  779. .wholesale-text {
  780. height: 30rpx;
  781. line-height: 30rpx;
  782. padding: 0 15rpx;
  783. border-radius: 15rpx;
  784. font-size: $uni-font-size-weak-two;
  785. display: inline-block;
  786. margin-bottom: #{20rpx};
  787. &.margin {
  788. margin-bottom: 0;
  789. }
  790. }
  791. .text {
  792. color: #ffffff;
  793. }
  794. .btn-finish-sell {
  795. background: linear-gradient(to right, rgba(153, 153, 153, 1), rgba(153, 153, 153, 0.7)) ;
  796. }
  797. .u-bottom-height-2 {
  798. height: 270upx;
  799. }
  800. </style>