first commit
This commit is contained in:
PC-202306242200\Administrator
159
pages/team/detail.vue
Normal file
159
pages/team/detail.vue
Normal file
@@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<view class="xkl-com-bg">
|
||||
<view style="height: 20rpx;"></view>
|
||||
<view style="background-color: #ffffff;border-radius: 10rpx;padding: 30rpx; font-size: 30rpx;">
|
||||
<view class="u-flex u-flex-y-center">
|
||||
<u--image width="100rpx" height="100rpx" :src="shopinfo.avatar_url" shape="circle">
|
||||
</u--image>
|
||||
<view style="width: 20rpx;"></view>
|
||||
<view>
|
||||
<view>{{shopinfo.nickname}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<view>{{shopinfo.username}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider></u-divider>
|
||||
<view class="u-flex u-flex-between">
|
||||
<view>
|
||||
<view>手机号：{{shopinfo.mobile}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<view>等级：v{{shopinfo.vip}}</view>
|
||||
</view>
|
||||
<view style="width: 20rpx;"></view>
|
||||
<view>
|
||||
<view>余额：￥{{shopinfo.money}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<view>自购：{{shopinfo.device_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 16rpx;"></view>
|
||||
<view>注册时间：{{shopinfo.created_at}}</view>
|
||||
</view>
|
||||
|
||||
<view style="height: 20rpx;"></view>
|
||||
<view style="background-color: #ffffff;border-radius: 10rpx;padding: 30rpx;font-size: 30rpx;">
|
||||
<view class="u-flex u-flex-y-center">
|
||||
<view style="background-color: #ffffff;border-radius: 12rpx; padding: 10rpx;"
|
||||
:class="search.week === 0 ? 'xkl_cur' : 'xkl_no'" @click="checkweek(0)">本周</view>
|
||||
<view style="width: 30rpx;"></view>
|
||||
<view style="background-color: #ffffff;border-radius: 12rpx; padding: 10rpx;"
|
||||
:class="search.week == 1 ? 'xkl_cur' : 'xkl_no'" @click="checkweek(1)">上周</view>
|
||||
<view style="width: 30rpx;"></view>
|
||||
<view @click="screen.showcalendar = true"
|
||||
style="background-color: #ffffff;border-radius: 12rpx; padding: 10rpx;"
|
||||
:class="search.week === '' ? 'xkl_cur' : 'xkl_no'">
|
||||
<text v-if="search.start_date">{{search.start_date}} - {{search.end_date}}</text>
|
||||
<text v-else>自定义时间</text>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider></u-divider>
|
||||
<view>{{shopinfo.nickname}}团队销量 {{team_device_num}} </view>
|
||||
<view style="height: 20rpx;"></view>
|
||||
<qiun-data-charts type="line" :opts="opts" :chartData="chartData" />
|
||||
</view>
|
||||
<u-calendar :show="screen.showcalendar" minDate="2024-03-01" mode="range" @confirm="confirmcalendar"
|
||||
@close="screen.showcalendar = false" :showTitle="false" :defaultDate="null"></u-calendar>
|
||||
<view style="height: 100rpx;"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let self;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
screen: {
|
||||
showcalendar: false,
|
||||
},
|
||||
shopinfo: {
|
||||
nickname: '',
|
||||
username: '',
|
||||
money: '',
|
||||
mobile: '',
|
||||
vip: '',
|
||||
device_num: '',
|
||||
id: '',
|
||||
},
|
||||
team_device_num: 0,
|
||||
chartData: {},
|
||||
opts: {
|
||||
padding: [15, 10, 0, 15],
|
||||
enableScroll: false,
|
||||
legend: {},
|
||||
xAxis: {
|
||||
disableGrid: true,
|
||||
showTitle: false
|
||||
},
|
||||
yAxis: {
|
||||
disabled: true,
|
||||
gridType: "dash",
|
||||
dashLength: 2
|
||||
},
|
||||
extra: {
|
||||
line: {
|
||||
type: "curve",
|
||||
width: 2,
|
||||
activeType: "none"
|
||||
}
|
||||
}
|
||||
},
|
||||
search: {
|
||||
team_shop_id: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
week: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
self = this;
|
||||
if (option && option.team_shop_id) {
|
||||
self.search.team_shop_id = option.team_shop_id;
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
self.getServerData();
|
||||
},
|
||||
async onPullDownRefresh() {
|
||||
self.search.week = 0;
|
||||
self.getServerData();
|
||||
uni.stopPullDownRefresh();
|
||||
},
|
||||
methods: {
|
||||
confirmcalendar(e) {
|
||||
self.search.start_date = e[0];
|
||||
self.search.end_date = e[e.length - 1];
|
||||
self.screen.showcalendar = false;
|
||||
self.search.week = '';
|
||||
self.getServerData();
|
||||
},
|
||||
checkweek(week) {
|
||||
self.search.week = week;
|
||||
self.search.start_date = '';
|
||||
self.search.end_date = '';
|
||||
self.getServerData();
|
||||
},
|
||||
getServerData() {
|
||||
self.$http.get('/shop/v10/team/report', self.search).then(({
|
||||
data
|
||||
}) => {
|
||||
self.team_device_num = data.team_device_num;
|
||||
self.chartData = data.report;
|
||||
self.shopinfo = data.team_shop;
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.xkl_cur {
|
||||
border: 1px solid #26418A;
|
||||
color: #26418A;
|
||||
}
|
||||
|
||||
.xkl_no {
|
||||
border: 1px solid #999999;
|
||||
color: #999999;
|
||||
}
|
||||
</style>
|
||||
160
pages/team/index.vue
Normal file
160
pages/team/index.vue
Normal file
@@ -0,0 +1,160 @@
|
||||
<template>
|
||||
<view class="xkl-com-bg">
|
||||
<!-- <view style="height: 20rpx;"></view>
|
||||
<view class="u-flex" style="padding: 20rpx;background-color: #ffffff;padding: 20rpx;border-radius: 10rpx;">
|
||||
<view style="width: 160rpx;font-size: 30rpx;">日期选择</view>
|
||||
<view @click="screen.showcalendar = true" style="color: #232323;">
|
||||
<text v-if="search.start_date">{{search.start_date}} - {{search.end_date}}</text>
|
||||
<text v-else>请选择日期</text>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 20rpx;"></view>
|
||||
<view style="background-color: #ffffff;padding: 20rpx;">
|
||||
<u-grid :border="false" :col="4" style="background-color: #ffffff; border-radius: 10rpx;">
|
||||
<u-grid-item :customStyle="{padding:'20rpx 0'}">
|
||||
<view>{{total}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<text class="grid-text-mini">直推人数</text>
|
||||
</u-grid-item>
|
||||
<u-grid-item :customStyle="{padding:'20rpx 0'}">
|
||||
<view>{{total}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<text class="grid-text-mini">团队人数</text>
|
||||
</u-grid-item>
|
||||
<u-grid-item :customStyle="{padding:'20rpx 0'}">
|
||||
<view>{{total}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<text class="grid-text-mini">直推充电桩</text>
|
||||
</u-grid-item>
|
||||
<u-grid-item :customStyle="{padding:'20rpx 0'}">
|
||||
<view>{{total}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<text class="grid-text-mini">团队充电桩</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view> -->
|
||||
<view style="height: 20rpx;"></view>
|
||||
<view style="background-color: #ffffff;padding: 20rpx;">邀请人数：{{total}}</view>
|
||||
<view style="height: 20rpx;"></view>
|
||||
<view>
|
||||
<!-- navigator -->
|
||||
<!-- :url="`/pages/team/detail?team_shop_id=${item.id}`" -->
|
||||
<view v-for="(item,index) in teamItems"
|
||||
:key="index"
|
||||
style="background-color: #ffffff;border-radius: 10rpx;padding: 30rpx;margin-bottom: 20rpx; font-size: 30rpx;">
|
||||
<view class="u-flex u-flex-y-center">
|
||||
<u--image width="100rpx" height="100rpx" :src="item.avatar_url"
|
||||
shape="circle">
|
||||
</u--image>
|
||||
<view style="width: 20rpx;"></view>
|
||||
<view>
|
||||
<view>{{item.nickname}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<view>{{item.username}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider></u-divider>
|
||||
<view class="u-flex u-flex-between">
|
||||
<view>
|
||||
<view>手机号：{{item.mobile}}</view>
|
||||
<view style="height: 10rpx;"></view>
|
||||
<!-- <view>等级：v{{item.vip}}</view> -->
|
||||
<view>等级：***</view>
|
||||
</view>
|
||||
<view style="width: 20rpx;"></view>
|
||||
<view>
|
||||
<!-- <view>余额：￥{{item.money}}</view> -->
|
||||
<!-- <view style="height: 10rpx;"></view> -->
|
||||
<view>自购：{{item.device_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 16rpx;"></view>
|
||||
<view>注册时间：{{item.created_at}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-loadmore :status="loadStatus" />
|
||||
|
||||
<u-calendar :show="screen.showcalendar" minDate="2024-02-01" mode="range" @confirm="confirmcalendar"
|
||||
@close="screen.showcalendar = false" :showTitle="false" :defaultDate="[]"></u-calendar>
|
||||
<view style="height: 100rpx;"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let self;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
screen: {
|
||||
showcalendar: false,
|
||||
},
|
||||
teamItems: [],
|
||||
loadStatus: 'loadmore',
|
||||
total: 0,
|
||||
page: {
|
||||
current: 0,
|
||||
last_page: 1,
|
||||
page: 1,
|
||||
},
|
||||
search: {
|
||||
level: 1,
|
||||
page: 1,
|
||||
start_date: '',
|
||||
end_date: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
self = this;
|
||||
self.getShopTeam();
|
||||
},
|
||||
onReachBottom() {
|
||||
if (!self.pageStatus()) {
|
||||
return;
|
||||
}
|
||||
self.loadStatus = 'loading';
|
||||
self.search.page += 1;
|
||||
self.getShopTeam();
|
||||
},
|
||||
async onPullDownRefresh() {
|
||||
self.search.page = 1;
|
||||
self.teamItems = [];
|
||||
await self.getShopTeam();
|
||||
uni.stopPullDownRefresh();
|
||||
},
|
||||
methods: {
|
||||
confirmcalendar(e) {
|
||||
self.search.start_date = e[0];
|
||||
self.search.end_date = e[e.length - 1];
|
||||
self.screen.showcalendar = false;
|
||||
},
|
||||
pageStatus() {
|
||||
self.loadStatus = 'loadmore';
|
||||
if (self.search.page >= self.page.last_page) {
|
||||
self.loadStatus = 'nomore';
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
getShopTeam() {
|
||||
self.$http.get('/shop/v10/user/team', self.search).then(({
|
||||
data,
|
||||
success
|
||||
}) => {
|
||||
self.teamItems = self.teamItems.concat(data.data);
|
||||
self.page.last_page = data.last_page;
|
||||
self.total = data.total;
|
||||
self.pageStatus();
|
||||
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.xkl-com-bg{
|
||||
min-height: 100vh;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user