index.vue 29 KB

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