index.vue 31 KB

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