index.vue 30 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130
  1. <template>
  2. <view v-if="pageShow" class="page"
  3. :class="bgTabVal==2?'fullsize noRepeat':bgTabVal==1?'repeat ysize':'noRepeat ysize'"
  4. :style="'background-color:'+bgColor+';background-image: url('+bgPic+');min-height:'+windowHeight+'px;'">
  5. <view v-if="!errorNetwork" :style="colorStyle">
  6. <skeleton :show="showSkeleton" :isNodes="isNodes" ref="skeleton" loading="chiaroscuro" selector="skeleton"
  7. bgcolor="#FFF"></skeleton>
  8. <view class="index skeleton" :style="{visibility: showSkeleton ? 'hidden' : 'visible'}">
  9. <!-- #ifdef H5 -->
  10. <view v-for="(item, index) in styleConfig" :key="index">
  11. <component :is="item.name" :index="index" :dataConfig="item" @changeBarg="changeBarg"
  12. @changeTab="changeTab" :tempArr="tempArr" :iSshowH="iSshowH" @detail="goDetail"
  13. :isSortType="isSortType" @bindSortId="bindSortId" @bindHeight="bindHeight" :isFixed="isFixed">
  14. </component>
  15. </view>
  16. <!-- #endif -->
  17. <!-- #ifdef MP || APP-PLUS -->
  18. <block v-for="(item, index) in styleConfig" :key="index">
  19. <activeParty v-if="item.name == 'activeParty'" :dataConfig="item" :isSortType="isSortType">
  20. </activeParty>
  21. <articleList v-if="item.name == 'articleList'" :dataConfig="item" :isSortType="isSortType">
  22. </articleList>
  23. <bargain v-if="item.name == 'bargain'" :dataConfig="item" @changeBarg="changeBarg"
  24. :isSortType="isSortType"></bargain>
  25. <blankPage v-if="item.name == 'blankPage'" :dataConfig="item" :isSortType="isSortType"></blankPage>
  26. <combination v-if="item.name == 'combination'" :dataConfig="item" :isSortType="isSortType">
  27. </combination>
  28. <coupon v-if="item.name == 'coupon'" :dataConfig="item" :isSortType="isSortType"></coupon>
  29. <customerService v-if="item.name == 'customerService'" :dataConfig="item" :isSortType="isSortType">
  30. </customerService>
  31. <goodList v-if="item.name == 'goodList'" :dataConfig="item" @detail="goDetail"
  32. :isSortType="isSortType"></goodList>
  33. <guide v-if="item.name == 'guide'" :dataConfig="item" :isSortType="isSortType"></guide>
  34. <headerSerch v-if="item.name == 'headerSerch'" :dataConfig="item"></headerSerch>
  35. <liveBroadcast v-if="item.name == 'liveBroadcast'" :dataConfig="item" :isSortType="isSortType">
  36. </liveBroadcast>
  37. <menus v-if="item.name == 'menus'" :dataConfig="item" :isSortType="isSortType"></menus>
  38. <news v-if="item.name == 'news'" :dataConfig="item" :isSortType="isSortType"></news>
  39. <pictureCube v-if="item.name == 'pictureCube'" :dataConfig="item" :isSortType="isSortType">
  40. </pictureCube>
  41. <promotionList v-if="item.name == 'promotionList'" :dataConfig="item" @changeTab="changeTab"
  42. :tempArr="tempArr" :iSshowH="iSshowH" @detail="goDetail" :isSortType="isSortType">
  43. </promotionList>
  44. <richText v-if="item.name == 'richText'" :dataConfig="item" :isSortType="isSortType"></richText>
  45. <seckill v-if="item.name == 'seckill'" :dataConfig="item" :isSortType="isSortType"></seckill>
  46. <swiperBg v-if="item.name == 'swiperBg'" :dataConfig="item" :isSortType="isSortType"></swiperBg>
  47. <swipers v-if="item.name == 'swipers'" :dataConfig="item" :isSortType="isSortType"></swipers>
  48. <tabNav v-if="item.name == 'tabNav'" :dataConfig="item" @bindHeight="bindHeighta"
  49. @bindSortId="bindSortId" :isFixed="isFixed"></tabNav>
  50. <titles v-if="item.name == 'titles'" :dataConfig="item" :isSortType="isSortType"></titles>
  51. </block>
  52. <!-- #endif -->
  53. <!-- 分类商品模块 -->
  54. <!-- #ifdef APP-PLUS -->
  55. <view class="sort-product" v-if="isSortType == 1" style="margin-top: 0;">
  56. <scroll-view scroll-x="true" style="background: #fff;">
  57. <view class="sort-box" v-if="sortList.children && sortList.children.length">
  58. <view class="sort-item" v-for="(item, index) in sortList.children" :key="index"
  59. @click="changeSort(item, index)" :class="{ on: curSort == index }">
  60. <image :src="item.pic" mode="" v-if="item.pic"></image>
  61. <image src="/static/images/sort-img.png" mode="" v-else></image>
  62. <view class="txt">{{ $t(item.cate_name) }}</view>
  63. </view>
  64. </view>
  65. </scroll-view>
  66. <view class="product-list" v-if="goodList.length">
  67. <view class="product-item" v-for="(item, index) in goodList" @click="goGoodsDetail(item)">
  68. <image :src="item.image"></image>
  69. <span class="pictrue_log_big pictrue_log_class"
  70. v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
  71. <span class="pictrue_log_big pictrue_log_class"
  72. v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
  73. <span class="pictrue_log_big pictrue_log_class"
  74. v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
  75. <view class="info">
  76. <view class="title line1">{{ item.store_name }}</view>
  77. <view class="price-box">
  78. <text>{{$t(`¥`)}}</text>
  79. {{ item.price }}
  80. </view>
  81. </view>
  82. </view>
  83. </view>
  84. <Loading :loaded="loaded" :loading="loading"></Loading>
  85. <view class="" v-if="goodList.length == 0 && loaded">
  86. <view class="emptyBox">
  87. <image :src="imgHost + '/statics/images/no-thing.png'"></image>
  88. <view class="tips">{{$t(`暂无商品,去看点别的吧`)}}</view>
  89. </view>
  90. <recommend :hostProduct="hostProduct"></recommend>
  91. </view>
  92. </view>
  93. <!-- #endif -->
  94. <!-- #ifndef APP-PLUS -->
  95. <view class="sort-product" v-if="isSortType == 1" :style="{ marginTop: sortMpTop + 'px' }">
  96. <scroll-view scroll-x="true" style="background: #fff;">
  97. <view class="sort-box" v-if="sortList.children && sortList.children.length">
  98. <view class="sort-item" v-for="(item, index) in sortList.children" :key="index"
  99. @click="changeSort(item, index)" :class="{ on: curSort == index }">
  100. <image :src="item.pic" mode="" v-if="item.pic"></image>
  101. <image src="/static/images/sort-img.png" mode="" v-else></image>
  102. <view class="txt">{{ $t(item.cate_name) }}</view>
  103. </view>
  104. </view>
  105. </scroll-view>
  106. <view class="product-list" v-if="goodList.length">
  107. <view class="product-item" v-for="(item, index) in goodList" @click="goGoodsDetail(item)">
  108. <image :src="item.image"></image>
  109. <span class="pictrue_log_big pictrue_log_class"
  110. v-if="item.activity && item.activity.type === '1'">{{$t(`秒杀`)}}</span>
  111. <span class="pictrue_log_big pictrue_log_class"
  112. v-if="item.activity && item.activity.type === '2'">{{$t(`砍价`)}}</span>
  113. <span class="pictrue_log_big pictrue_log_class"
  114. v-if="item.activity && item.activity.type === '3'">{{$t(`拼团`)}}</span>
  115. <span class="pictrue_log_big pictrue_log_class" v-if="item.checkCoupon">{{$t(`券`)}}</span>
  116. <view class="info">
  117. <view class="title line2">{{ item.store_name }}</view>
  118. <view class="price-box">
  119. <text>{{$t(`¥`)}}</text>
  120. {{ item.price }}
  121. </view>
  122. </view>
  123. </view>
  124. </view>
  125. <Loading :loaded="loaded" :loading="loading"></Loading>
  126. <view class="" v-if="goodList.length == 0 && loaded">
  127. <view class="emptyBox">
  128. <image :src="imgHost + '/statics/images/no-thing.png'"></image>
  129. <view class="tips">{{$t(`暂无数据`)}}</view>
  130. </view>
  131. <recommend :hostProduct="hostProduct"></recommend>
  132. </view>
  133. </view>
  134. <!-- #endif -->
  135. <!-- <view class="loadingicon acea-row row-center-wrapper" v-if="tempArr.length && styleConfig[styleConfig.length - 1].name == 'promotionList'">
  136. <text class="loading iconfont icon-jiazai" :hidden="loading == false"></text>
  137. {{ loadTitle }}
  138. </view> -->
  139. <!-- #ifdef MP -->
  140. <!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse" :isGoIndex="false"></authorize> -->
  141. <!-- #endif -->
  142. <couponWindow :window="isCouponShow" @onColse="couponClose" :couponImage="couponObj.image"
  143. :couponList="couponObj.list"></couponWindow>
  144. <!-- #ifndef MP -->
  145. <view v-if="site_config" class="site-config" @click="goICP">{{ site_config }}</view>
  146. <!-- #endif -->
  147. <view class="uni-p-b-98"></view>
  148. <pageFoot></pageFoot>
  149. </view>
  150. </view>
  151. <view v-else>
  152. <view class="error-network">
  153. <image :src="imgHost + '/statics/images/error-network.png'"></image>
  154. <view class="title">{{$t(`网络连接断开`)}}</view>
  155. <view class="con">
  156. <view class="label">{{$t(`请检查情况:`)}}:</view>
  157. <view class="item">· {{$t(`在设置中是否已开启网络权限:`)}}</view>
  158. <view class="item">· {{$t(`当前是否处于弱网环境`)}}</view>
  159. <view class="item">· {{$t(`版本是否过低,升级试试吧`)}}</view>
  160. </view>
  161. <view class="btn" @click="reconnect">{{$t(`重新连接`)}}</view>
  162. </view>
  163. </view>
  164. <!-- #ifdef APP-PLUS -->
  165. <app-update v-if="!privacyStatus" ref="appUpdate" :force="true" :tabbar="false"></app-update>
  166. <view class="privacy-wrapper" v-if="privacyStatus">
  167. <view class="privacy-box">
  168. <view class="title">{{$t(`服务协议与隐私政策`)}}</view>
  169. <view class="content">
  170. {{$t(`请务必审慎阅读、充分理解“服务协议与 隐私政策”各条款,包括但不限于:为了 向你提供即时通讯、内容分享等服务,我 们需要收集你的设备信息、操作日志等个 人信息。你可以在“设置”中查看、变更、删除个人信息并管理你的授权。`)}}<br>
  171. {{$t(`你可以阅读`)}}
  172. <navigator url="/pages/users/privacy/index?type=3">{{$t(`《服务协议与隐私政策》`)}}</navigator>
  173. {{$t(`了解详细信息。如你同意,请点击“我同意”开始接受我们的服务。`)}}
  174. </view>
  175. <view class="btn-box">
  176. <view class="btn-item" @click="confirmApp">{{$t(`我同意`)}}</view>
  177. <view class="btn" @click="closeModel">{{$t(`残忍拒绝`)}}</view>
  178. </view>
  179. </view>
  180. </view>
  181. <!-- #endif -->
  182. </view>
  183. </template>
  184. <script>
  185. const app = getApp();
  186. import colors from "@/mixins/color";
  187. import couponWindow from '@/components/couponWindow/index';
  188. import {
  189. getCouponV2,
  190. getCouponNewUser,
  191. siteConfig
  192. } from '@/api/api.js';
  193. // #ifdef H5
  194. import mConfig from './components/index.js';
  195. // #endif
  196. // #ifdef MP || APP-PLUS
  197. import authorize from '@/components/Authorize';
  198. import activeParty from './components/activeParty';
  199. import headerSerch from './components/headerSerch';
  200. import swipers from './components/swipers';
  201. import coupon from './components/coupon';
  202. import articleList from './components/articleList';
  203. import bargain from './components/bargain';
  204. import blankPage from './components/blankPage';
  205. import combination from './components/combination';
  206. import customerService from './components/customerService';
  207. import goodList from './components/goodList';
  208. import guide from './components/guide';
  209. import liveBroadcast from './components/liveBroadcast';
  210. import menus from './components/menus';
  211. import news from './components/news';
  212. import pictureCube from './components/pictureCube';
  213. import promotionList from './components/promotionList';
  214. import richText from './components/richText';
  215. import seckill from './components/seckill';
  216. import swiperBg from './components/swiperBg';
  217. import tabNav from './components/tabNav';
  218. import titles from './components/titles';
  219. import appUpdate from "@/components/update/app-update.vue";
  220. import {
  221. getTempIds
  222. } from '@/api/api.js';
  223. import {
  224. SUBSCRIBE_MESSAGE,
  225. TIPS_KEY
  226. } from '@/config/cache';
  227. // #endif
  228. import {
  229. mapGetters
  230. } from 'vuex';
  231. import {
  232. getDiy,
  233. getIndexData
  234. } from '@/api/api.js';
  235. import {
  236. getGroomList,
  237. getCategoryList,
  238. getProductslist,
  239. getProductHot
  240. } from '@/api/store.js';
  241. import {
  242. goShopDetail
  243. } from '@/libs/order.js';
  244. import {
  245. getCartCounts,
  246. } from '@/api/order.js';
  247. import {
  248. toLogin
  249. } from '@/libs/login.js';
  250. import {
  251. HTTP_REQUEST_URL
  252. } from '@/config/app';
  253. import pageFoot from '@/components/pageFooter/index.vue';
  254. import Loading from '@/components/Loading/index.vue';
  255. import recommend from '@/components/recommend';
  256. export default {
  257. computed: mapGetters(['isLogin', 'uid']),
  258. mixins: [colors],
  259. components: {
  260. recommend,
  261. Loading,
  262. pageFoot,
  263. couponWindow,
  264. // #ifdef H5
  265. ...mConfig,
  266. // #endif
  267. // #ifdef MP || APP-PLUS
  268. authorize,
  269. activeParty,
  270. headerSerch,
  271. swipers,
  272. coupon,
  273. articleList,
  274. bargain,
  275. blankPage,
  276. combination,
  277. customerService,
  278. goodList,
  279. guide,
  280. liveBroadcast,
  281. menus,
  282. pictureCube,
  283. news,
  284. promotionList,
  285. richText,
  286. seckill,
  287. swiperBg,
  288. tabNav,
  289. titles,
  290. appUpdate, //APP更新
  291. // #endif
  292. },
  293. computed: mapGetters(['isLogin', 'cartNum']),
  294. data() {
  295. return {
  296. imgHost: HTTP_REQUEST_URL,
  297. showSkeleton: true, //骨架屏显示隐藏
  298. isNodes: 0, //控制什么时候开始抓取元素节点,只要数值改变就重新抓取
  299. styleConfig: [],
  300. tempArr: [],
  301. goodType: 3,
  302. loading: false,
  303. loadend: false,
  304. loadTitle: this.$t(`下拉加载更多`), //提示语
  305. page: 1,
  306. limit: this.$config.LIMIT,
  307. iSshowH: false,
  308. numConfig: 0,
  309. code: '',
  310. isCouponShow: false,
  311. couponObj: {},
  312. couponObjs: {
  313. show: false
  314. },
  315. shareInfo: {},
  316. footConfig: {},
  317. isSortType: 0,
  318. sortList: '',
  319. sortAll: [],
  320. goodPage: 1,
  321. goodList: [],
  322. newData: {},
  323. sid: 0,
  324. curSort: 0,
  325. sortMpTop: 0,
  326. loaded: false,
  327. hostProduct: [],
  328. hotScroll: false,
  329. hotPage: 1,
  330. hotLimit: 10,
  331. domOffsetTop: 50,
  332. // #ifdef APP-PLUS || MP
  333. isFixed: true,
  334. // #endif
  335. // #ifdef H5
  336. isFixed: false,
  337. // #endif
  338. site_config: '',
  339. errorNetwork: false, // 是否断网
  340. privacyStatus: false, // 隐私政策是否同意过
  341. isHeaderSerch: false,
  342. bgColor: '',
  343. bgPic: '',
  344. bgTabVal: '',
  345. pageShow: true,
  346. windowHeight: 0,
  347. activeRouter: '',
  348. countNum: 0
  349. };
  350. },
  351. onPullDownRefresh() {
  352. this.diyData();
  353. },
  354. created(options) {
  355. let that = this
  356. this.$nextTick(function() {
  357. uni.getSystemInfo({
  358. success: function(res) {
  359. that.windowHeight = res.windowHeight;
  360. }
  361. });
  362. })
  363. let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
  364. let curRoute = routes[routes.length - 1].route //获取当前页面路由
  365. this.activeRouter = '/' + curRoute
  366. // #ifdef APP-PLUS
  367. uni.setStorageSync("privacyStatus", true);
  368. // try {
  369. // let val = uni.getStorageSync('privacyStatus') || false
  370. // if (!val) {
  371. // this.privacyStatus = true
  372. // }
  373. // } catch (e) {}
  374. // #endif
  375. this.diyData();
  376. this.getIndexData();
  377. // #ifdef MP
  378. this.getTempIds();
  379. // #endif
  380. // #ifndef APP-PLUS
  381. siteConfig().then(res => {
  382. this.site_config = res.data.record_No
  383. }).catch(err => {
  384. console.error(err.msg);
  385. });
  386. // #endif
  387. // 优惠券弹窗
  388. // var newDates = new Date().toLocaleDateString();
  389. if (this.isLogin) {
  390. this.getCoupon();
  391. getCartCounts().then(res => {
  392. this.countNum = res.data.count
  393. this.$store.commit('indexData/setCartNum', res.data.count > 99 ? '..' : res.data.count +
  394. '')
  395. if (res.data.count > 0) {
  396. wx.setTabBarBadge({
  397. index: Number(uni.getStorageSync('FOOTER_ADDCART')) || 2,
  398. text: res.data.count + ''
  399. })
  400. } else {
  401. wx.hideTabBarRedDot({
  402. index: Number(uni.getStorageSync('FOOTER_ADDCART')) || 2
  403. })
  404. }
  405. });
  406. }
  407. },
  408. // onReady() {
  409. // let that = this
  410. // uni.getSystemInfo({
  411. // success: function(res) { // res - 各种参数
  412. // let info = uni.createSelectorQuery().select(".hander"); // 获取某个元素
  413. // info.boundingClientRect(function(data) { //data - 各种参数
  414. // let view = res.windowHeight - data.height
  415. // that.heightHome = view
  416. // }).exec()
  417. // }
  418. // });
  419. // },
  420. watch: {
  421. isLogin: {
  422. deep: true, //深度监听设置为 true
  423. handler: function(newV, oldV) {
  424. // 优惠券弹窗
  425. var newDates = new Date().toLocaleDateString();
  426. if (newV) {
  427. try {
  428. var oldDate = uni.getStorageSync('oldDate') || '';
  429. } catch {}
  430. if (oldDate != newDates) {
  431. this.getCoupon();
  432. }
  433. }
  434. }
  435. }
  436. },
  437. onReady() {},
  438. methods: {
  439. // #ifdef APP-PLUS
  440. // 同意隐私协议
  441. confirmApp() {
  442. uni.setStorageSync('privacyStatus', true)
  443. this.privacyStatus = false
  444. },
  445. // 关闭Model
  446. closeModel() {
  447. //退出app
  448. uni.getSystemInfo({
  449. success: function(res) { // 判断为安卓的手机
  450. if (res.platform == 'android') { // 安卓退出app
  451. plus.runtime.quit();
  452. } else { // 判断为ios的手机,退出App
  453. plus.ios.import("UIApplication").sharedApplication().performSelector("exit");
  454. }
  455. }
  456. })
  457. },
  458. // #endif
  459. // 重新链接
  460. reconnect() {
  461. uni.showLoading({
  462. title: this.$t(`加载中`)
  463. })
  464. this.diyData();
  465. this.getIndexData();
  466. getShare().then(res => {
  467. this.shareInfo = res.data;
  468. });
  469. },
  470. goICP() {
  471. // #ifdef H5
  472. window.open('http://beian.miit.gov.cn/');
  473. // #endif
  474. // #ifdef MP
  475. uni.navigateTo({
  476. url: `/pages/annex/web_view/index?url=https://beian.miit.gov.cn/`
  477. });
  478. // #endif
  479. },
  480. bindHeighta(data) {
  481. // #ifdef APP-PLUS
  482. this.sortMpTop = data.top + data.height;
  483. // #endif
  484. },
  485. bindHeight(data) {
  486. uni.hideLoading();
  487. this.domOffsetTop = data.top;
  488. },
  489. // 去商品详情
  490. goGoodsDetail(item) {
  491. goShopDetail(item, this.uid).then(res => {
  492. uni.navigateTo({
  493. url: `/pages/goods_details/index?id=${item.id}`
  494. });
  495. });
  496. },
  497. /**
  498. * 获取我的推荐
  499. */
  500. get_host_product: function() {
  501. let that = this;
  502. if (that.hotScroll) return;
  503. getProductHot(that.hotPage, that.hotLimit).then(res => {
  504. that.hotPage++;
  505. that.hotScroll = res.data.length < that.hotLimit;
  506. that.hostProduct = that.hostProduct.concat(res.data);
  507. // that.$set(that, 'hostProduct', res.data)
  508. });
  509. },
  510. // 分类点击
  511. changeSort(item, index) {
  512. if (this.curSort == index) return;
  513. this.curSort = index;
  514. this.sid = item.id;
  515. this.goodList = [];
  516. this.goodPage = 1;
  517. this.loaded = false;
  518. this.getGoodsList();
  519. },
  520. // 获取分类id
  521. bindSortId(data) {
  522. this.isSortType = data == -99 ? 0 : 1;
  523. this.getProductList(data);
  524. if (this.hostProduct.length == 0) {
  525. this.get_host_product();
  526. }
  527. },
  528. getProductList(data) {
  529. let tempObj = '';
  530. this.curSort = 0;
  531. this.loaded = false;
  532. if (this.sortAll.length > 0) {
  533. this.sortAll.forEach((el, index) => {
  534. if (el.id == data) {
  535. this.$set(this, 'sortList', el);
  536. this.sid = el.children.length ? el.children[0].id : '';
  537. }
  538. });
  539. this.goodList = [];
  540. this.goodPage = 1;
  541. this.$nextTick(() => {
  542. if (this.sortList != '') this.getGoodsList();
  543. });
  544. } else {
  545. getCategoryList().then(res => {
  546. this.sortAll = res.data;
  547. res.data.forEach((el, index) => {
  548. if (el.id == data) {
  549. this.sortList = el;
  550. this.sid = el.children.length ? el.children[0].id : '';
  551. }
  552. });
  553. this.goodList = [];
  554. this.goodPage = 1;
  555. this.$nextTick(() => {
  556. if (this.sortList != '') this.getGoodsList();
  557. });
  558. });
  559. }
  560. },
  561. getGoodsList() {
  562. if (this.loading || this.loaded) return;
  563. this.loading = true;
  564. getProductslist({
  565. sid: this.sid,
  566. keyword: '',
  567. priceOrder: '',
  568. salesOrder: '',
  569. news: 0,
  570. page: this.goodPage,
  571. limit: 10,
  572. cid: this.sortList.id
  573. }).then(res => {
  574. this.loading = false;
  575. this.loaded = res.data.length < 10;
  576. this.goodPage++;
  577. this.goodList = this.goodList.concat(res.data);
  578. });
  579. },
  580. // 新用户优惠券
  581. getNewCoupon() {
  582. const oldUser = uni.getStorageSync('oldUser') || 0;
  583. if (!oldUser) {
  584. getCouponNewUser().then(res => {
  585. const {
  586. data
  587. } = res;
  588. if (data.show) {
  589. if (data.list.length) {
  590. this.isCouponShow = true;
  591. this.couponObj = data;
  592. uni.setStorageSync('oldUser', 1);
  593. }
  594. } else {
  595. uni.setStorageSync('oldUser', 1);
  596. }
  597. });
  598. }
  599. },
  600. // 优惠券弹窗
  601. getCoupon() {
  602. const tagDate = uni.getStorageSync('tagDate') || '',
  603. nowDate = new Date().toLocaleDateString();
  604. if (tagDate === nowDate) {
  605. this.getNewCoupon();
  606. } else {
  607. getCouponV2().then(res => {
  608. const {
  609. data
  610. } = res;
  611. if (data.list.length) {
  612. this.isCouponShow = true;
  613. this.couponObj = data;
  614. uni.setStorageSync('tagDate', new Date().toLocaleDateString());
  615. } else {
  616. this.getNewCoupon();
  617. }
  618. });
  619. }
  620. },
  621. // 优惠券弹窗关闭
  622. couponClose() {
  623. this.isCouponShow = false;
  624. if (!uni.getStorageSync('oldUser')) {
  625. this.getNewCoupon();
  626. }
  627. },
  628. onLoadFun() {},
  629. // #ifdef H5
  630. // 获取url后面的参数
  631. getQueryString(name) {
  632. var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
  633. var reg_rewrite = new RegExp('(^|/)' + name + '/([^/]*)(/|$)', 'i');
  634. var r = window.location.search.substr(1).match(reg);
  635. var q = window.location.pathname.substr(1).match(reg_rewrite);
  636. if (r != null) {
  637. return unescape(r[2]);
  638. } else if (q != null) {
  639. return unescape(q[2]);
  640. } else {
  641. return null;
  642. }
  643. },
  644. // #endif
  645. // #ifdef MP
  646. getTempIds() {
  647. getTempIds().then(res => {
  648. if (res.data) wx.setStorageSync(SUBSCRIBE_MESSAGE, JSON.stringify(res.data));
  649. });
  650. },
  651. // #endif
  652. // 对象转数组
  653. objToArr(data) {
  654. let obj = Object.keys(data);
  655. let m = obj.map(key => data[key]);
  656. return m;
  657. },
  658. diyData() {
  659. let that = this;
  660. getDiy(0).then(res => {
  661. setTimeout(() => {
  662. this.isNodes++;
  663. }, 0);
  664. this.errorNetwork = false
  665. let data = res.data;
  666. if (data.is_bg_color) {
  667. this.bgColor = data.color_picker
  668. }
  669. if (data.is_bg_pic) {
  670. this.bgPic = data.bg_pic
  671. this.bgTabVal = data.bg_tab_val
  672. }
  673. this.pageShow = data.is_show
  674. uni.setNavigationBarTitle({
  675. title: this.$t(res.data.title)
  676. });
  677. let temp = [];
  678. let lastArr = that.objToArr(res.data.value);
  679. lastArr.forEach((item, index, arr) => {
  680. if (item.name == 'headerSerch') {
  681. this.isHeaderSerch = true
  682. }
  683. if (item.name == 'promotionList') {
  684. that.numConfig = item.numConfig.val;
  685. that.goodType = item.tabConfig.list[0].link.activeVal;
  686. that.getGroomList();
  687. }
  688. if (item.name == 'tabNav') {
  689. // #ifndef APP-PLUS
  690. // uni.showLoading({
  691. // title: '加载中',
  692. // mask: true,
  693. // });
  694. // #endif
  695. // setTimeout(function() {
  696. // uni.hideLoading();
  697. // }, 8000);
  698. }
  699. temp = arr;
  700. });
  701. function sortNumber(a, b) {
  702. return a.timestamp - b.timestamp;
  703. }
  704. temp.sort(sortNumber)
  705. that.styleConfig = temp;
  706. setTimeout(() => {
  707. this.showSkeleton = false
  708. }, 300)
  709. uni.stopPullDownRefresh({
  710. success: (e) => {},
  711. });
  712. }).catch(error => {
  713. // #ifdef APP-PLUS
  714. if (error.status) {
  715. uni.hideLoading()
  716. if (that.errorNetwork) {
  717. uni.showToast({
  718. title: this.$t(`连接失败`),
  719. icon: 'none',
  720. duration: 2000
  721. })
  722. }
  723. this.errorNetwork = true
  724. this.showSkeleton = false;
  725. }
  726. // #endif
  727. });
  728. },
  729. getIndexData() {},
  730. changeBarg(item) {
  731. if (!this.isLogin) {
  732. toLogin();
  733. } else {
  734. uni.navigateTo({
  735. url: `/pages/activity/goods_bargain_details/index?id=${item.id}&bargain=${this.$store.state.app.uid}`
  736. });
  737. }
  738. },
  739. // 促销列表的点击事件;
  740. changeTab(type) {
  741. this.goodType = type;
  742. this.tempArr = [];
  743. this.page = 1;
  744. this.loadend = false;
  745. let onloadH = true;
  746. this.getGroomList(onloadH);
  747. },
  748. // 精品推荐
  749. getGroomList(onloadH) {
  750. let that = this;
  751. let type = that.goodType;
  752. if (that.loadend) return false;
  753. if (that.loading) return false;
  754. if (onloadH) {
  755. that.$set(that, 'iSshowH', true);
  756. }
  757. getGroomList(type, {
  758. page: that.page,
  759. limit: this.numConfig
  760. })
  761. .then(({
  762. data
  763. }) => {
  764. that.$set(that, 'iSshowH', false);
  765. let maxPage = Math.ceil(this.numConfig / this.limit);
  766. let list = data.list,
  767. loadend = list.length < that.limit || that.page >= maxPage;
  768. let tempArr = that.$util.SplitArray(list, that.tempArr);
  769. that.$set(that, 'tempArr', tempArr.slice(0, this.numConfig));
  770. that.loadend = loadend;
  771. that.loadTitle = loadend ? that.$t(`没有更多内容啦~`) : that.$t(`加载更多`);
  772. that.page = that.page + 1;
  773. that.loading = false;
  774. })
  775. .catch(res => {
  776. that.loading = false;
  777. that.loadTitle = that.$t(`加载更多`);
  778. });
  779. },
  780. goRouter(item) {
  781. var pages = getCurrentPages();
  782. var page = (pages[pages.length - 1]).$page.fullPath;
  783. if (item.link == page) return
  784. uni.switchTab({
  785. url: item.link,
  786. fail(err) {
  787. uni.redirectTo({
  788. url: item.link
  789. })
  790. }
  791. })
  792. },
  793. goDetail(item) {
  794. goShopDetail(item, this.$store.state.app.uid).then(res => {
  795. uni.navigateTo({
  796. url: `/pages/goods_details/index?id=${item.id}`
  797. });
  798. });
  799. },
  800. onsollBotton() {
  801. if (this.isSortType == 0) {
  802. // this.getGroomList();
  803. } else {
  804. this.getGoodsList();
  805. }
  806. }
  807. },
  808. onReachBottom: function() {
  809. },
  810. onPageScroll(e) {
  811. uni.$emit('scroll');
  812. // #ifdef H5
  813. if (this.isHeaderSerch) {
  814. if (e.scrollTop > this.domOffsetTop) {
  815. this.isFixed = true;
  816. }
  817. if (e.scrollTop < this.domOffsetTop) {
  818. this.$nextTick(() => {
  819. this.isFixed = false;
  820. });
  821. }
  822. } else {
  823. this.isFixed = false
  824. }
  825. // #endif
  826. },
  827. //#ifdef MP
  828. onShareAppMessage() {
  829. return {
  830. title: this.shareInfo.title,
  831. path: '/pages/index/index'
  832. };
  833. },
  834. //分享到朋友圈
  835. onShareTimeline: function() {
  836. return {
  837. title: this.shareInfo.title,
  838. imageUrl: this.shareInfo.img
  839. };
  840. }
  841. //#endif
  842. };
  843. </script>
  844. <style lang="scss">
  845. // page {
  846. // padding-bottom: 50px;
  847. // }
  848. .pictrue_log_class {
  849. background-color: var(--view-theme);
  850. }
  851. .page {
  852. padding-bottom: 50px;
  853. }
  854. .ysize {
  855. background-size: 100%;
  856. }
  857. .fullsize {
  858. background-size: 100% 100%;
  859. }
  860. .repeat {
  861. background-repeat: repeat;
  862. }
  863. .noRepeat {
  864. background-repeat: no-repeat;
  865. }
  866. .privacy-wrapper {
  867. z-index: 999;
  868. position: fixed;
  869. left: 0;
  870. top: 0;
  871. width: 100%;
  872. height: 100%;
  873. background: #7F7F7F;
  874. .privacy-box {
  875. position: absolute;
  876. left: 50%;
  877. top: 50%;
  878. transform: translate(-50%, -50%);
  879. width: 560rpx;
  880. padding: 50rpx 45rpx 0;
  881. background: #fff;
  882. border-radius: 20rpx;
  883. .title {
  884. text-align: center;
  885. font-size: 32rpx;
  886. text-align: center;
  887. color: #333;
  888. font-weight: 700;
  889. }
  890. .content {
  891. margin-top: 20rpx;
  892. line-height: 1.5;
  893. font-size: 26rpx;
  894. color: #666;
  895. navigator {
  896. display: inline-block;
  897. color: #E93323;
  898. }
  899. }
  900. .btn-box {
  901. margin-top: 40rpx;
  902. text-align: center;
  903. font-size: 30rpx;
  904. .btn-item {
  905. height: 82rpx;
  906. line-height: 82rpx;
  907. background: linear-gradient(90deg, #F67A38 0%, #F11B09 100%);
  908. color: #fff;
  909. border-radius: 41rpx;
  910. }
  911. .btn {
  912. padding: 30rpx 0;
  913. }
  914. }
  915. }
  916. }
  917. .error-network {
  918. position: fixed;
  919. left: 0;
  920. top: 0;
  921. display: flex;
  922. flex-direction: column;
  923. align-items: center;
  924. width: 100%;
  925. height: 100%;
  926. padding-top: 40rpx;
  927. background: #fff;
  928. image {
  929. width: 414rpx;
  930. height: 336rpx;
  931. }
  932. .title {
  933. position: relative;
  934. top: -40rpx;
  935. font-size: 32rpx;
  936. color: #666;
  937. }
  938. .con {
  939. font-size: 24rpx;
  940. color: #999;
  941. .label {
  942. margin-bottom: 20rpx;
  943. }
  944. .item {
  945. margin-bottom: 20rpx;
  946. }
  947. }
  948. .btn {
  949. display: flex;
  950. align-items: center;
  951. justify-content: center;
  952. width: 508rpx;
  953. height: 86rpx;
  954. margin-top: 100rpx;
  955. border: 1px solid #D74432;
  956. color: #E93323;
  957. font-size: 30rpx;
  958. border-radius: 120rpx;
  959. }
  960. }
  961. .sort-product {
  962. margin-top: 20rpx;
  963. .sort-box {
  964. display: flex;
  965. width: 100%;
  966. border-radius: 16rpx;
  967. padding: 30rpx 0;
  968. .sort-item {
  969. width: 20%;
  970. display: flex;
  971. flex-direction: column;
  972. align-items: center;
  973. justify-content: center;
  974. flex-shrink: 0;
  975. image {
  976. width: 90rpx;
  977. height: 90rpx;
  978. border-radius: 50%;
  979. }
  980. .txt {
  981. color: #272727;
  982. font-size: 24rpx;
  983. margin-top: 10rpx;
  984. overflow: hidden;
  985. white-space: nowrap;
  986. text-overflow: ellipsis;
  987. width: 140rpx;
  988. text-align: center;
  989. }
  990. .pictrues {
  991. width: 90rpx;
  992. height: 90rpx;
  993. background: #f8f8f8;
  994. border-radius: 50%;
  995. margin: 0 auto;
  996. }
  997. .icon-gengduo1 {
  998. color: #333;
  999. }
  1000. &.on {
  1001. .txt {
  1002. color: #fc4141;
  1003. }
  1004. image {
  1005. border: 1px solid #fc4141;
  1006. }
  1007. }
  1008. }
  1009. }
  1010. .product-list {
  1011. display: flex;
  1012. flex-wrap: wrap;
  1013. justify-content: space-between;
  1014. margin-top: 30rpx;
  1015. padding: 0 20rpx;
  1016. .product-item {
  1017. position: relative;
  1018. width: 344rpx;
  1019. background: #fff;
  1020. border-radius: 10rpx;
  1021. margin-bottom: 20rpx;
  1022. display: flex;
  1023. flex-direction: column;
  1024. image {
  1025. width: 100%;
  1026. height: 344rpx;
  1027. border-radius: 10rpx 10rpx 0 0;
  1028. }
  1029. .info {
  1030. flex: 1;
  1031. padding: 14rpx 16rpx;
  1032. display: flex;
  1033. flex-direction: column;
  1034. justify-content: space-between;
  1035. .title {
  1036. font-size: 28rpx;
  1037. }
  1038. .price-box {
  1039. font-size: 34rpx;
  1040. font-weight: 700;
  1041. margin-top: 8px;
  1042. color: #fc4141;
  1043. text {
  1044. font-size: 26rpx;
  1045. }
  1046. }
  1047. }
  1048. }
  1049. }
  1050. }
  1051. .emptyBox {
  1052. text-align: center;
  1053. padding-top: 20rpx;
  1054. .tips {
  1055. color: #aaa;
  1056. font-size: 26rpx;
  1057. padding-bottom: 20rpx;
  1058. }
  1059. image {
  1060. width: 414rpx;
  1061. height: 304rpx;
  1062. }
  1063. }
  1064. .site-config {
  1065. margin-top: 40rpx;
  1066. font-size: 24rpx;
  1067. text-align: center;
  1068. color: #666;
  1069. &.fixed {
  1070. position: fixed;
  1071. bottom: 69px;
  1072. left: 0;
  1073. width: 100%;
  1074. }
  1075. }
  1076. </style>