123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771 |
- <template>
- <view v-if="pageShow" class="page"
- :class="bgTabVal==2?'fullsize noRepeat':bgTabVal==1?'repeat ysize':'noRepeat ysize'"
- :style="'background-color:'+bgColor+';background-image: url('+bgPic+');min-height:'+windowHeight+'px;'">
- <view>
-
- <view v-for="(item, index) in styleConfig" :key="index">
- <component :is="item.name" :index="index" :dataConfig="item" :isSortType="isSortType" @changeBarg="changeBarg"
- @detail="goDetail" @bindSortId="bindSortId" :isScrolled="isScrolled"></component>
- </view>
-
-
- <block v-for="(item, index) in styleConfig" :key="index">
- <homeComb v-if="item.name == 'homeComb'" :dataConfig="item" @bindSortId="bindSortId" :isScrolled="isScrolled" :special="1"></homeComb>
- <shortVideo v-if="item.name == 'shortVideo'" :dataConfig="item" :isSortType="isSortType">
- </shortVideo>
- <userInfor v-if="item.name == 'userInfor'" :dataConfig="item" :isSortType="isSortType">
- </userInfor>
- <newVip v-if="item.name == 'newVip'" :dataConfig="item" :isSortType="isSortType">
- </newVip>
- <activeParty v-if="item.name == 'activeParty'" :dataConfig="item" :isSortType="isSortType"></activeParty>
- <articleList v-if="item.name == 'articleList'" :dataConfig="item" :isSortType="isSortType"></articleList>
- <bargain v-if="item.name == 'bargain'" :dataConfig="item" @changeBarg="changeBarg" :isSortType="isSortType"></bargain>
- <blankPage v-if="item.name == 'blankPage'" :dataConfig="item" :isSortType="isSortType"></blankPage>
- <combination v-if="item.name == 'combination'" :dataConfig="item" :isSortType="isSortType"></combination>
- <coupon v-if="item.name == 'coupon'" :dataConfig="item" :isSortType="isSortType"></coupon>
- <customerService v-if="item.name == 'customerService'" :dataConfig="item" :isSortType="isSortType"></customerService>
- <goodList v-if="item.name == 'goodList'" :dataConfig="item" @detail="goDetail" :isSortType="isSortType"></goodList>
- <guide v-if="item.name == 'guide'" :dataConfig="item" :isSortType="isSortType"></guide>
- <headerSerch v-if="item.name == 'headerSerch'" :dataConfig="item" :special="1"></headerSerch>
- <liveBroadcast v-if="item.name == 'liveBroadcast'" :dataConfig="item" :isSortType="isSortType"></liveBroadcast>
- <menus v-if="item.name == 'menus'" :dataConfig="item" :isSortType="isSortType"></menus>
- <news v-if="item.name == 'news'" :dataConfig="item" :isSortType="isSortType"></news>
- <pictureCube v-if="item.name == 'pictureCube'" :dataConfig="item" :isSortType="isSortType">
- </pictureCube>
- <promotionList v-if="item.name == 'promotionList'" :dataConfig="item" @detail="goDetail" :isSortType="isSortType"></promotionList>
- <richText v-if="item.name == 'richText'" :dataConfig="item" :isSortType="isSortType"></richText>
- <seckill v-if="item.name == 'seckill'" :dataConfig="item" :isSortType="isSortType"></seckill>
- <swiperBg v-if="item.name == 'swiperBg'" :dataConfig="item" :isSortType="isSortType"></swiperBg>
- <swipers v-if="item.name == 'swipers'" :dataConfig="item" :isSortType="isSortType"></swipers>
- <tabNav v-if="item.name == 'tabNav'" :dataConfig="item" @bindSortId="bindSortId" :fromType="1"></tabNav>
- <titles v-if="item.name == 'titles'" :dataConfig="item" :isSortType="isSortType"></titles>
- </block>
-
- <view class="sort-product" v-if="isSortType == 1" style="margin-top: 0;">
- <scroll-view scroll-x="true" class="sort-scroll">
- <view class="sort-box" v-if="sortList.children && sortList.children.length">
- <view class="sort-item" v-for="(item, index) in sortList.children" :key="index"
- @click="changeSort(item, index)" :class="{ on: curSort == index }">
- <image :src="item.pic" mode="" v-if="item.pic"></image>
- <image src="/static/images/sort-img.png" mode="" v-else></image>
- <view class="txt">{{ item.cate_name }}</view>
- </view>
- </view>
- </scroll-view>
-
- <view class="product-list" v-if="goodList.length">
- <view class="product-item" v-for="(item, index) in goodList" @click="goGoodsDetail(item)">
- <image :src="item.image" mode="aspectFill"></image>
- <span class="pictrue_log_big pictrue_log_class"
- v-if="item.activity && item.activity.type === '1'">秒杀</span>
- <span class="pictrue_log_big pictrue_log_class"
- v-if="item.activity && item.activity.type === '2'">砍价</span>
- <span class="pictrue_log_big pictrue_log_class"
- v-if="item.activity && item.activity.type === '3'">拼团</span>
- <view class="info">
- <view class="title line1">{{ item.store_name }}</view>
- <view class="price-box">
- <text>¥</text>
- {{ item.price }}
- </view>
- </view>
- </view>
- </view>
- <Loading :loaded="loaded" :loading="loading"></Loading>
- <view v-if="goodList.length == 0 && loaded" class="sort-scroll">
- <view class="empty-box">
- <image :src="imgHost + '/statics/images/no-thing.png'"></image>
- <view class="tips">暂无商品,去看点别的吧</view>
- </view>
-
- </view>
- </view>
-
- {{ loadTitle }}
- <view class="uni-p-b-98"></view>
- <pageFooter></pageFooter>
-
-
-
- </view>
- </view>
- </template>
- <script>
- const app = getApp();
- import couponWindow from '@/components/couponWindow/index'
- import {
- getCouponV2,
- getCouponNewUser
- } from '@/api/api.js'
- import {
- getShare
- } from '@/api/public.js';
-
- import mConfig from '@/pages/index/components/index.js';
- import {
- silenceAuth
- } from '@/api/public.js';
-
-
- import homeComb from '@/pages/index/components/homeComb';
- import userInfor from '@/pages/index/components/userInfor';
- import newVip from '@/pages/index/components/newVip';
- import shortVideo from '@/pages/index/components/shortVideo';
- import activeParty from '@/pages/index/components/activeParty';
- import headerSerch from '@/pages/index/components/headerSerch';
- import swipers from '@/pages/index/components/swipers';
- import coupon from '@/pages/index/components/coupon';
- import articleList from '@/pages/index/components/articleList';
- import bargain from '@/pages/index/components/bargain';
- import blankPage from '@/pages/index/components/blankPage';
- import combination from '@/pages/index/components/combination';
- import customerService from '@/pages/index/components/customerService';
- import goodList from '@/pages/index/components/goodList';
- import guide from '@/pages/index/components/guide';
- import liveBroadcast from '@/pages/index/components/liveBroadcast';
- import menus from '@/pages/index/components/menus';
- import news from '@/pages/index/components/news';
- import promotionList from '@/pages/index/components/promotionList';
- import richText from '@/pages/index/components/richText';
- import seckill from '@/pages/index/components/seckill';
- import swiperBg from '@/pages/index/components/swiperBg';
- import tabNav from '@/pages/index/components/tabNav';
- import titles from '@/pages/index/components/titles';
- import pictureCube from '@/pages/index/components/pictureCube';
- import {
- getTemlIds
- } from '@/api/api.js';
- import {
- SUBSCRIBE_MESSAGE,
- TIPS_KEY
- } from '@/config/cache';
-
- import {
- mapGetters
- } from 'vuex';
- import {
- getDiy,
- getIndexData,
- getDiyVersion
- } from '@/api/api.js';
- import {
- getCategoryList,
- getProductslist,
- getProductHot,
- } from '@/api/store.js';
- import {
- goShopDetail
- } from '@/libs/order.js';
- import {
- toLogin
- } from '@/libs/login.js';
- import {HTTP_REQUEST_URL} from '@/config/app';
- import pageFooter from '@/components/pageFooter/index.vue'
- import recommend from '@/components/recommend';
- import Loading from '@/components/Loading/index.vue';
- export default {
- computed: mapGetters(['isLogin', 'uid']),
- components: {
- Loading,
- recommend,
- pageFooter,
- couponWindow,
-
- ...mConfig,
-
-
- homeComb,
- newVip,
- userInfor,
- shortVideo,
- activeParty,
- headerSerch,
- swipers,
- coupon,
- articleList,
- bargain,
- blankPage,
- combination,
- customerService,
- goodList,
- guide,
- liveBroadcast,
- menus,
- news,
- promotionList,
- richText,
- seckill,
- swiperBg,
- tabNav,
- titles,
- pictureCube
-
- },
- data() {
- return {
- styleConfig: [],
- loading: false,
- loadend: false,
- loadTitle: '加载更多',
- page: 1,
- limit: this.$config.LIMIT,
- numConfig: 0,
- code: '',
- isCouponShow: false,
- couponObj: {},
- couponObjs: {},
- shareInfo: {},
- footConfig: {},
- pageId: '',
- sortMpTop: 0,
- bgColor: '',
- bgPic: '',
- bgTabVal: '',
- pageShow: true,
- windowHeight: 0,
- isShowAuth: false,
- isScrolled: false,
- sortList: '',
- sortAll: [],
- isSortType: 0,
- hostProduct: [],
- hotScroll: false,
- hotPage: 1,
- hotLimit: 10,
- curSort: 0,
- loaded: false,
- goodPage: 1,
- goodList: [],
- sid: 0,
- imgHost:HTTP_REQUEST_URL,
- };
- },
- onLoad(options) {
- let that = this
- this.$nextTick(function() {
- uni.getSystemInfo({
- success: function(res) {
- that.windowHeight = res.windowHeight;
- }
- });
- })
- const {
- state,
- scope
- } = options;
- this.pageId = options.id
-
- if (options.scene) {
- let value = that.$util.getUrlParams(decodeURIComponent(options.scene));
- this.pageId = value.id
- }
-
- uni.setNavigationBarTitle({
- title: '专题栏'
- });
-
-
- this.sortMpTop = -50
-
- this.diyData();
- this.getIndexData();
-
- this.setOpenShare();
-
-
- this.getTemlIds();
-
- getShare().then(res => {
- this.shareInfo = res.data;
- })
- },
- onUnload(){
-
- uni.$off('activeFn');
- },
- watch: {
- isLogin: {
- deep: true,
- handler: function(newV, oldV) {
-
- var newDates = new Date().toLocaleDateString();
- if (newV) {
- try {
- var oldDate = uni.getStorageSync('oldDate') || ''
- } catch {}
- if (oldDate != newDates) {
- this.getCoupon();
- }
- }
- }
- }
- },
- onShow() {
- uni.removeStorageSync('form_type_cart');
-
- var newDates = new Date().toLocaleDateString();
- if (this.isLogin) {
- try {
- var oldDate = uni.getStorageSync('oldDate') || ''
- } catch {}
- if (oldDate != newDates) {
- this.getCoupon();
- }
- let oldUser = uni.getStorageSync('oldUser') || 0;
- if (!oldUser) {
- this.getCouponOnce();
- }
- }
- },
- mounted() {},
- methods: {
-
- changeSort(item, index) {
- if (this.curSort == index) return;
- this.curSort = index;
- this.sid = item.id;
- this.goodList = [];
- this.goodPage = 1;
- this.loaded = false;
- this.getGoodsList();
- },
-
- bindSortId(data) {
- this.isSortType = data == -99 ? 0 : 1;
- this.getProductList(data);
- if (this.hostProduct.length == 0) {
- this.get_host_product();
- }
- },
- getProductList(data) {
- this.curSort = 0;
- this.loaded = false;
- if (this.sortAll.length > 0) {
- this.sortAll.forEach((el, index) => {
- if (el.id == data) {
- this.$set(this, 'sortList', el);
- this.sid = el.children.length ? el.children[0].id : '';
- }
- });
- this.goodList = [];
- this.goodPage = 1;
- this.$nextTick(() => {
- if (this.sortList != '') this.getGoodsList();
- });
- } else {
- getCategoryList().then(res => {
- this.sortAll = res.data;
- res.data.forEach((el, index) => {
- if (el.id == data) {
- this.sortList = el;
- this.sid = el.children.length ? el.children[0].id : '';
- }
- });
- this.goodList = [];
- this.goodPage = 1;
- this.$nextTick(() => {
- if (this.sortList != '') this.getGoodsList();
- });
- });
- }
- },
-
- getGoodsList() {
- if (this.loading || this.loaded) return;
- this.loading = true;
- getProductslist({
- sid: this.sid,
- keyword: '',
- priceOrder: '',
- salesOrder: '',
- news: 0,
- page: this.goodPage,
- limit: 10,
- cid: this.sortList.id
- }).then(res => {
- this.loading = false;
- this.loaded = res.data.length < 10;
- this.goodPage++;
- this.goodList = this.goodList.concat(res.data);
- });
- },
-
- get_host_product: function() {
- let that = this;
- if (that.hotScroll) return;
- getProductHot(that.hotPage, that.hotLimit).then(res => {
- that.hotPage++;
- that.hotScroll = res.data.length < that.hotLimit;
- that.hostProduct = that.hostProduct.concat(res.data);
- });
- },
- onLoadFun() {
- this.isShowAuth = false
- },
- authColse: function(e) {
- this.isShowAuth = e
- },
-
- getCouponOnce() {
- getCouponNewUser().then(res => {
- this.couponObjs = res.data;
- });
- },
- couponCloses() {
- this.couponObjs.show = false;
- try {
- uni.setStorageSync('oldUser', 1);
- } catch (e) {
- }
- },
-
- getCoupon() {
- getCouponV2().then(res => {
- this.couponObj = res.data
- if (res.data.list.length > 0) {
- this.isCouponShow = true
- }
- })
- },
-
- couponClose() {
- this.isCouponShow = false
- try {
- uni.setStorageSync('oldDate', new Date().toLocaleDateString());
- } catch {}
- },
-
-
- getQueryString(name) {
- var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
- var reg_rewrite = new RegExp("(^|/)" + name + "/([^/]*)(/|$)", "i");
- var r = window.location.search.substr(1).match(reg);
- var q = window.location.pathname.substr(1).match(reg_rewrite);
- if (r != null) {
- return unescape(r[2]);
- } else if (q != null) {
- return unescape(q[2]);
- } else {
- return null;
- }
- },
-
-
- getTemlIds() {
- let messageTmplIds = wx.getStorageSync(SUBSCRIBE_MESSAGE);
- if (!messageTmplIds) {
- getTemlIds().then(res => {
- if (res.data) wx.setStorageSync(SUBSCRIBE_MESSAGE, JSON.stringify(res.data));
- });
- }
- },
-
-
- objToArr(data) {
- const keys = Object.keys(data)
- keys.sort((a, b) => a - b)
- const m = keys.map(key => data[key]);
- return m;
- },
- setDiyData(data) {
-
- if (data.length == 0) {
- return this.$util.Tips({
- title: '暂无数据'
- }, {
- tab: 3
- })
- }
-
- if (data.is_bg_color) {
- this.bgColor = data.color_picker
- }
- if (data.is_bg_pic) {
- this.bgPic = data.bg_pic
- this.bgTabVal = data.bg_tab_val
- }
- this.pageShow = data.is_show
- uni.setNavigationBarTitle({
- title: data.title
- })
- let temp = []
- let lastArr = this.objToArr(data.value)
- lastArr.forEach((item, index, arr) => {
- if (item.name == 'pageFoot') {
- uni.setStorageSync('pageFoot', item)
- this.$store.commit('FOOT_UPLOAD', item)
- arr.splice(index, 1)
- }
- temp = arr
- });
- this.styleConfig = temp;
- },
- getDiyData() {
- getDiy(this.pageId).then(res => {
- uni.setStorageSync('specialDiyData', JSON.stringify(res.data));
- this.setDiyData(res.data);
- });
- },
- diyData() {
- let that = this;
- let diyData = uni.getStorageSync('specialDiyData');
- if (diyData) {
- getDiyVersion(this.pageId).then(res => {
- let diyVersion = uni.getStorageSync('specialDiyVersion');
- if ((res.data.version + this.pageId) === diyVersion) {
- this.setDiyData(JSON.parse(diyData));
- } else{
- uni.setStorageSync('specialDiyVersion', (res.data.version + this.pageId));
- this.getDiyData();
- }
- });
- } else{
- this.getDiyData();
- }
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- },
- getIndexData() {
- },
- changeBarg(item) {
- if (!this.isLogin) {
- toLogin()
- } else {
- uni.navigateTo({
- url: `/pages/activity/goods_bargain_details/index?id=${item.id}&spid=${this.uid}`
- });
- }
- },
- goDetail(item) {
- goShopDetail(item, this.uid).then(res => {
- uni.navigateTo({
- url: `/pages/goods_details/index?id=${item.id}`
- });
- });
- },
-
-
- setOpenShare: function() {
- let that = this;
- if (that.$wechat.isWeixin()) {
- getShare().then(res => {
- let data = res.data.data;
- let configAppMessage = {
- desc: data.synopsis,
- title: data.title,
- link: location.href,
- imgUrl: data.img
- };
- that.$wechat.wechatEvevt(['updateAppMessageShareData', 'updateTimelineShareData'],
- configAppMessage);
- });
- }
- }
-
- },
- onReachBottom: function() {
- },
- onPageScroll(e) {
- if(e.scrollTop>10){
- this.isScrolled = true;
- }else{
- this.isScrolled = false;
- }
- },
-
- onShareAppMessage() {
- return {
- title: this.shareInfo.title,
- path: '/pages/index/index',
- imageUrl: this.storeInfo.img,
- };
- },
-
- };
- </script>
- <style lang="scss">
- .sort-scroll {
- background-color: #fff;
- }
- .empty-box {
- text-align: center;
- padding-top: 50rpx;
- .tips{
- color: #aaa;
- font-size: 26rpx;
- }
- image {
- width: 414rpx;
- height: 304rpx;
- }
- }
- .sort-product {
- margin-top: 20rpx;
-
- .sort-box {
- display: flex;
- width: 100%;
- border-radius: 16rpx;
- padding: 30rpx 0;
-
- .sort-item {
- width: 20%;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- flex-shrink: 0;
-
- image {
- width: 90rpx;
- height: 90rpx;
- border-radius: 50%;
- }
-
- .txt {
- color: #272727;
- font-size: 24rpx;
- margin-top: 10rpx;
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- width: 140rpx;
- text-align: center;
- }
-
- .pictrues {
- width: 90rpx;
- height: 90rpx;
- background: #f8f8f8;
- border-radius: 50%;
- margin: 0 auto;
- }
-
- .icon-gengduo1 {
- color: #333;
- }
-
- &.on {
- .txt {
- color: #fc4141;
- }
-
- image {
- border: 1px solid #fc4141;
- }
- }
- }
- }
-
- .product-list {
- display: flex;
- flex-wrap: wrap;
- justify-content: space-between;
- margin-top: 30rpx;
- padding: 0 20rpx;
-
- .product-item {
- position: relative;
- width: 344rpx;
- background: #fff;
- border-radius: 10rpx;
- margin-bottom: 20rpx;
- overflow: hidden;
-
- .pictrue{
- position: relative;
- }
-
- image {
- width: 100%;
- height: 344rpx;
- border-radius: 10rpx 10rpx 0 0;
- }
-
- .info {
- padding: 14rpx 16rpx;
-
- .title {
- font-size: 28rpx;
- }
-
- .price-box {
- font-size: 34rpx;
- font-weight: 700;
- margin-top: 8px;
- color: #fc4141;
-
- text {
- font-size: 26rpx;
- }
- }
- }
- }
- }
- }
- .page {
- padding-bottom: 50px;
- }
-
- .ysize {
- background-size: 100%;
- }
-
- .fullsize {
- background-size: 100% 100%;
- }
-
- .repeat {
- background-repeat: repeat;
- }
-
- .noRepeat {
- background-repeat: no-repeat;
- }
-
- </style>
|