159 lines
4.2 KiB
Vue
159 lines
4.2 KiB
Vue
<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> |