index.vue 32 KB

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