index.vue 29 KB

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