99 lines
2.4 KiB
Vue
99 lines
2.4 KiB
Vue
|
||
<template>
|
||
<view class="home">
|
||
<div class="header">
|
||
<div class="header_search theme_color">
|
||
<i class="iconfont icon-taozi1"></i>
|
||
<div class="search">
|
||
<i class="iconfont icon-search"></i>
|
||
<span>198万张图，有你想要的...</span>
|
||
</div>
|
||
<i class="iconfont icon-wo"></i>
|
||
</div>
|
||
<div class="header_menu">
|
||
<scroll-view class="menu_list" scroll-x="true" :scroll-into-view="into">
|
||
<text
|
||
@click="GetList(i)"
|
||
v-for="(v, i) in list"
|
||
:id="v.into"
|
||
:class="i == Index ? 'active' : ''"
|
||
:key="i"
|
||
>{{ v.title }}</text
|
||
>
|
||
</scroll-view>
|
||
<i class="iconfont icon-edit"></i>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="content">
|
||
|
||
<swiper class="swiper" :current="Index" @change="pageChange">
|
||
<swiper-item v-for="(v, i) in list" :key="i">
|
||
<view class="swiper-item" >
|
||
<lists :lists="listss"></lists>
|
||
</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
</div>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import lists from '../../components/lists.vue'
|
||
export default {
|
||
data() {
|
||
return {
|
||
into: "",
|
||
Index: 0,
|
||
list: [],
|
||
listss:[]
|
||
};
|
||
},
|
||
async created() {
|
||
await this.getType();
|
||
await this.getClassList();
|
||
},
|
||
methods: {
|
||
async pageChange(event) {
|
||
let { current } = event.detail;
|
||
this.Index = current;
|
||
this.into = `title${current}`;
|
||
await this.getClassList();
|
||
},
|
||
async GetList(i) {
|
||
this.Index = i;
|
||
},
|
||
async getType() {
|
||
let res = await this.$http.index.type();
|
||
this.list = res.principal;
|
||
},
|
||
async getClassList() {
|
||
if (this.list[this.Index].content.length == 0) {
|
||
let res = await this.$http.index.classList({
|
||
page: this.list[this.Index].page,
|
||
id: this.list[this.Index].id,
|
||
});
|
||
|
||
this.list[this.Index].page = res.current_page;
|
||
this.list[this.Index].total_page = res.total_page;
|
||
this.list[this.Index].content = [
|
||
...this.list[this.Index].content,
|
||
...res.data,
|
||
];
|
||
this.listss=this.list[this.Index].content
|
||
console.log("this.list ==== ", this.list);
|
||
}
|
||
},
|
||
|
||
},
|
||
components:{
|
||
lists
|
||
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
@import "@/less/page/index.less";
|
||
</style>
|