137 lines
4.1 KiB
Vue
137 lines
4.1 KiB
Vue
<template lang="pug">
|
|
.Index
|
|
NavbarComponent(title='首页')
|
|
.content
|
|
.pt20
|
|
.flex.pd43
|
|
.flex1.mr10
|
|
.capital.flex_cen
|
|
div
|
|
.p1 本周奖励
|
|
.p2 {{indexData.refer_amount || 0}}
|
|
router-link(to='/extension')
|
|
span(style='color:#ff5858') 立即推广
|
|
van-icon(name="arrow")
|
|
.text.mt25 客服QQ: {{indexData.qq_service || '*********'}}
|
|
.flex1.ml10
|
|
.capital.flex_cen
|
|
div
|
|
.p1 本周佣金
|
|
.p2 {{indexData.commission || 0}}
|
|
router-link(to='/fund')
|
|
span(style='color:#20c6c2') 资金管理
|
|
van-icon(name="arrow")
|
|
.text.mt25 工作时间: {{indexData.qq_work_time}}
|
|
.line.mt25
|
|
.pd43
|
|
.task_num.flex.mt40
|
|
.flex1.flex_cen
|
|
.task_num_li
|
|
span {{indexData.accept_task_num||0}}/{{indexData.total_task_num||0}}
|
|
p 淘宝任务
|
|
router-link.flex1.flex_cen(to='/realName')
|
|
.task_num_li
|
|
span {{indexData.auth_text||'加载中'}}
|
|
p 实名认证
|
|
router-link.flex1.flex_cen(to='/authentication')
|
|
.task_num_li
|
|
span {{indexData.account_num||0}}/{{indexData.total_account_num||0}}
|
|
p 绑定买号
|
|
.mt.pd43
|
|
router-link(to='/taskHall')
|
|
.receipt 开始接单
|
|
.line.mt36
|
|
.advertisement.mt25.pd43
|
|
van-swipe( :autoplay="3000" indicator-color="white")
|
|
van-swipe-item(v-for='(item, index) in indexData.rotation_pic' :key='index')
|
|
img( :src='item.upload.path')
|
|
.pd43
|
|
.notice
|
|
van-tabs(v-model="NoticeActive" @click="NoticeClick" line-height='0' title-active-color='#ffffff')
|
|
van-tab(:title="item.title"
|
|
v-for="(item,index) in NoticeTabBar"
|
|
:key="index")
|
|
.news()
|
|
.news_cen
|
|
router-link(v-for="(li,index) in item.content" :key="index" :to="`/noticeInfo?id=${li.id}`")
|
|
p {{li.title}}
|
|
//- van-tag.ml20(type="danger" size="medium" v-if="index === 0") 标签
|
|
//- .news_end
|
|
//- span 查看更多
|
|
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { Component, Provide, Vue, Inject, Watch } from "vue-property-decorator";
|
|
import TestComponent from "@/components/test.vue";
|
|
import NavbarComponent from "@/components/Navbar.vue";
|
|
|
|
@Component({
|
|
components: {
|
|
TestComponent,
|
|
NavbarComponent
|
|
}
|
|
})
|
|
export default class Index extends Vue {
|
|
@Inject() readonly ShowTabBar!: Function;
|
|
|
|
private $http: any;
|
|
private NoticeActive: number = 0;
|
|
private NoticeTabBar: {
|
|
type: number;
|
|
title: string;
|
|
content: Array<any>;
|
|
}[] = [
|
|
// { type: 1, title: '商家公告', content: [] },
|
|
{ type: 2, title: "买家公告", content: [] },
|
|
{ type: 3, title: "平台公告", content: [] },
|
|
{ type: 4, title: "任务须知", content: [] },
|
|
{ type: 5, title: "推广说明", content: [] },
|
|
{ type: 6, title: "其他", content: [] }
|
|
];
|
|
|
|
// 首页数据
|
|
private indexData: any = {
|
|
rotation_pic: []
|
|
};
|
|
|
|
private NoticeConfig: { [key: string]: number } = {
|
|
limit: 1,
|
|
page: 1
|
|
};
|
|
|
|
public async NoticeClick(): Promise<any> {
|
|
this.NoticeConfig.type = this.NoticeTabBar[this.NoticeActive].type;
|
|
let data = await this.$http.NewsService.announceList(this.NoticeConfig);
|
|
this.NoticeTabBar[this.NoticeActive].content = data;
|
|
}
|
|
|
|
private async getIndex(): Promise<void> {
|
|
let res = await this.$http.HomeService.getIndex();
|
|
this.indexData = res;
|
|
}
|
|
|
|
async created() {
|
|
this.ShowTabBar();
|
|
this.NoticeClick();
|
|
this.getIndex();
|
|
}
|
|
|
|
beforeRouteLeave(to: any, from: any, next: any) {
|
|
this.ShowTabBar();
|
|
next();
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="stylus">
|
|
@import '~@assets/stylus/page/index';
|
|
</style>
|
|
<style lang="stylus">
|
|
.Index {
|
|
.van-tab--active {
|
|
background: #20c6c2;
|
|
}
|
|
}
|
|
</style>
|