fe / xianyu-ufo-app-web · Commits

Go to a project

Authored by Tao
Commit 7b8843aaaed6a901257c64f3c625cbac82f55f0e 1 parent 997ad20d

add channel

Inline Side-by-side
Showing 11 changed files with 66 additions and 50 deletions
... ... @@ -3,7 +3,7 @@
<div class="scroll-list-wrap">
<template v-if="isShow">
<div v-for="(item, index) in channelList.list" v-if="item.template_name == 'guessLike'">
<ScrollNav :list="item.data.list" :current="active"></ScrollNav>
<ScrollNav :list="item.data" :current="active"></ScrollNav>
</div>
</template>
<Scroll
... ... @@ -18,12 +18,12 @@
<div class="marginTop">
<div v-for="(item, index) in channelList.list" :key="index" class="space-between">
<Swiper :list="item.data" v-if="item.template_name == 'threePicture'"/>
<Hot :list="item.data.list" v-if="item.template_name == 'image_list'"/>
<Hot :list="item.data" v-if="item.template_name == 'image_list'"/>
<Banner :list="item.data" v-if="item.template_name == 'single_image'"/>
<TwoBanner :list="item.data" v-if="item.template_name == 'twoPicture'"/>
<template v-if="!isShow">
<div ref="sss" v-if="item.template_name == 'guessLike'">
<ScrollNav :list="item.data.list" :current="active" @transfer="getIndex"></ScrollNav>
<ScrollNav :list="item.data" :current="active" @transfer="getIndex"></ScrollNav>
</div>
</template>
</div>
... ... @@ -41,6 +41,7 @@
<script>
import { Style, Scroll, Sticky } from 'cube-ui';
import { createNamespacedHelpers } from 'vuex';
import queryString from 'query-string';
import Swiper from './components/swiper';
import Banner from './components/banner';
import TwoBanner from './components/twoBanner';
... ... @@ -71,6 +72,9 @@ export default {
total: 0,
marginTop: 0,
active: 0,
params: {
isHome: true,
}
};
},
computed: {
... ... @@ -78,17 +82,22 @@ export default {
...mapStateList(['productList']),
},
mounted() {
const params = {
isPage: true,
isHome: true,
}
this.fetchChannelList().then((res) => {
console.log(res);
let windowH = document.documentElement.clientHeight || document.body.clientHeight;
this.navTop = this.$refs.sss[0].offsetTop;
this.navHeight = this.$refs.sss[0].offsetHeight;
this.total = windowH - this.navHeight;
res.forEach((item) => {
if (item.template_name == "guessLike") {
let url = item.data[0].url.split("?");
this.params = queryString.parse(url[1]);
}
})
this.fetchProductList(this.params);
});
this.fetchProductList(params);
},
created() {
... ... @@ -101,22 +110,15 @@ export default {
let scrollY = Math.abs(parseInt(y));
if (scrollY >= this.navTop) {
this.isShow = true;
this.marginTop = 0;
} else {
this.isShow = false;
this.marginTop = '30px';
}
// this.scrollY = -y
},
...mapActions(['fetchChannelList']),
...mapActionsList(['fetchProductList']),
async onPullingUp() {
const params = {
isReset: false,
isHome: true,
};
await this.fetchProductList(params);
this.$refs.scroll.forceUpdate();
this.params.isReset = false
await this.fetchProductList(this.params);
}
},
components: {
... ... @@ -198,6 +200,6 @@ export default {
z-index: 999;
}
.marginTop {
margin-top: 64px;
// margin-top: 64px;
}
</style>
... ...
<template>
<div class="banner" v-if="list.length > 0">
<ul>
<li v-for="(item, index) in list" :key="index" @click="jump(item)">
<ImageFormat :data-secc="item.src" :lazy="false" :src="item.src" :alt="item.alt" :width="item.width || 750" :height="item.height || 160" />
<li v-for="(item, index) in list" :key="index">
<LayoutLink :href="item.url">
<ImageFormat :data-secc="item.src" :lazy="false" :src="item.src" :alt="item.alt" :width="item.width || 750" :height="item.height || 160" />
</LayoutLink>
</li>
</ul>
</div>
... ... @@ -18,11 +20,7 @@ export default {
},
},
methods: {
jump(item) {
const { src, url } = item;
console.log(src);
console.log(url);
}
}
};
</script>
... ...
<template>
<div class="ScrollNav" v-if="labels.length > 0">
<ScrollNavBar :current="this.list[current].tab_name" :labels="labels" @change="changeHandler">
<ScrollNavBar :current="this.list[current].title" :labels="labels" @change="changeHandler">
<span slot-scope="props">
{{props.txt}}
<span :ref="`getindex${props.txt}`" v-show="false">{{props.index}}</span>
... ... @@ -13,6 +13,8 @@
import Vue from 'vue'
import { Style, ScrollNavBar } from 'cube-ui';
import { createNamespacedHelpers } from 'vuex';
import queryString from 'query-string';
// const { mapState, mapActions } = createNamespacedHelpers('list/channel');
const {mapState, mapActions} = createNamespacedHelpers('list');
... ... @@ -31,7 +33,7 @@ export default {
data() {
return {
index: 0,
// current: this.list[0].tab_name,
// current: this.list[0].title,
labels: [],
}
},
... ... @@ -43,7 +45,7 @@ export default {
...mapState(['productList']),
},
mounted() {
this.list.map((res) => { this.labels.push(res.tab_name) });
this.list.map((res) => { this.labels.push(res.title) });
},
created() {
... ... @@ -52,11 +54,13 @@ export default {
...mapActions(['fetchProductList']),
changeHandler(cur) {
let index = this.$refs[`getindex${cur}`].innerText;
let query = this.list[index].query
let params = Object.assign({},...query);
params.isReset = true; delete params.method;
let url = this.list[index].url.split("?");
let urlParams = queryString.parse(url[1]);
let params = urlParams;
params.isReset = true;
this.fetchProductList(params);
this.$emit('transfer',index);
console.log(params)
}
}
};
... ...
<template>
<div class="swiper">
<div class="swiper-item swiper-item-left">
<a :href="list[0].url">
<LayoutLink :href="list[0].url">
<ImageFormat @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="list[0].src" :width="310" :height="402"></ImageFormat>
</a>
</LayoutLink>
</div>
<div class="swiper-item swiper-item-right">
<a :href="list[1].url">
<LayoutLink :href="list[1].url">
<ImageFormat @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="list[1].src" :width="380" :height="196"></ImageFormat>
</a>
<a :href="list[2].url">
</LayoutLink>
<LayoutLink :href="list[2].url">
<ImageFormat style="margin-top: 4px" @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="list[2].src" :width="380" :height="196"></ImageFormat>
</a>
</LayoutLink>
</div>
</div>
</template>
... ...
... ... @@ -2,9 +2,9 @@
<div class="twoBanner" v-if="list.length > 0">
<ul>
<li v-for="(item, index) in list" :key="index">
<a :href="item.url">
<LayoutLink :href="item.url">
<ImageFormat :lazy="false" :src="item.src" :alt="item.alt" :width="344" :height="160" />
</a>
</LayoutLink>
</li>
</ul>
</div>
... ...
... ... @@ -11,7 +11,7 @@
</template>
<script>
export default {
export default {
name: 'news',
props: {
list: {
... ...
... ... @@ -33,12 +33,6 @@ export default {
},
title: '',
type: '',
list: [
{"name":"您的商品AIR JORDAN 4 RETRO PURE MONEY 2017已被用户下单，请及时发货","time":"2018.08.08 17:20"},
{"name":"您的商品AIR JORDAN 4 RETRO PURE MONEY 2017已被用户下单，请及时发货","time":"2018.08.08 17:20"},
{"name":"您的商品AIR JORDAN 4 RETRO PURE MONEY 2017已被用户下单，请及时发货","time":"2018.08.08 17:20"},
{"name":"您的商品AIR JORDAN 4 RETRO PURE MONEY 2017已被用户下单，请及时发货","time":"2018.08.08 17:20"}, {"name":"您的商品AIR JORDAN 4 RETRO PURE MONEY 2017已被用户下单，请及时发货","time":"2018.08.08 17:20"},
]
}
},
computed: {
... ... @@ -63,7 +57,6 @@ export default {
isPage: false
}
await this.fetchNewsList(params);
this.$refs.scroll.forceUpdate();
}
},
components: {
... ...
... ... @@ -51,12 +51,13 @@ export default function() {
},
async fetchChannelList({ commit }) {
const result = await this.$api.get('/api/ufo/channel/channelList', {
content_code: 'b4c2aa846b56ad7e51e7255c2ee4c1f9',
content_code: 'f788335b57b67c1711f255648c744dab',
// uid: '64668089',
uid: '500031170',
});
if (result.code === 200) {
commit(Types.FETCH_CHANNEL, { list: result.data });
return result.data;
}
}
},
... ...
... ... @@ -33,8 +33,6 @@ export default function() {
let totalPage = state.newsList.totalPage;
let type = obj && obj.type;
let isPage = obj && obj.isPage;
console.log(state.newsList.totalPage);
console.log('页码2');
// 页面跳转重置page页码
isPage ? page = 1 : state.newsList.page + 1;
... ...
... ... @@ -57,6 +57,7 @@
"passport": "^0.4.0",
"passport-oauth": "^1.0.0",
"qiniu": "^7.2.1",
"query-string": "^6.8.3",
"request": "^2.88.0",
"request-promise": "^4.2.2",
"serve-favicon": "^2.5.0",
... ...
... ... @@ -8318,6 +8318,15 @@ qs@^6.4.0:
resolved "http://npm.yohops.com/qs/-/qs-6.6.0.tgz#a99c0f69a8d26bf7ef012f871cdabb0aee4424c2"
integrity sha1-qZwPaajSa/fvAS+HHNq7Cu5EJMI=
query-string@^6.8.3:
version "6.8.3"
resolved "http://npm.yohops.com/query-string/-/query-string-6.8.3.tgz#fd9fb7ffb068b79062b43383685611ee47777d4b"
integrity sha1-/Z+3/7Bot5BitDODaFYR7kd3fUs=
dependencies:
decode-uri-component "^0.2.0"
split-on-first "^1.0.0"
strict-uri-encode "^2.0.0"
querystring-es3@^0.2.0:
version "0.2.1"
resolved "https://registry.yarnpkg.com/querystring-es3/-/querystring-es3-0.2.1.tgz#9ec61f79049875707d69414596fd907a4d711e73"
... ... @@ -9499,6 +9508,11 @@ specificity@^0.4.1:
resolved "http://npm.yohops.com/specificity/-/specificity-0.4.1.tgz#aab5e645012db08ba182e151165738d00887b019"
integrity sha1-qrXmRQEtsIuhguFRFlc40AiHsBk=
split-on-first@^1.0.0:
version "1.1.0"
resolved "http://npm.yohops.com/split-on-first/-/split-on-first-1.1.0.tgz#f610afeee3b12bce1d0c30425e76398b78249a5f"
integrity sha1-9hCv7uOxK84dDDBCXnY5i3gkml8=
split-string@^3.0.1, split-string@^3.0.2:
version "3.1.0"
resolved "http://npm.yohops.com/split-string/-/split-string-3.1.0.tgz#7cb09dda3a86585705c64b39a6466038682e8fe2"
... ... @@ -9632,6 +9646,11 @@ stream-shift@^1.0.0:
resolved "https://registry.yarnpkg.com/stream-shift/-/stream-shift-1.0.0.tgz#d5c752825e5367e786f78e18e445ea223a155952"
integrity sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI=
strict-uri-encode@^2.0.0:
version "2.0.0"
resolved "http://npm.yohops.com/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz#b9c7330c7042862f6b142dc274bbcc5866ce3546"
integrity sha1-ucczDHBChi9rFC3CdLvMWGbONUY=
string-length@^2.0.0:
version "2.0.0"
resolved "http://r.cnpmjs.org/string-length/download/string-length-2.0.0.tgz#d40dbb686a3ace960c1cffca562bf2c45f8363ed"
... ...