新增邀请裂变管理页面

This commit is contained in:
Dragon
2024-03-13 16:29:57 +08:00
parent 4fee145865
commit cd1798c259
3 changed files with 625 additions and 0 deletions

View File

@@ -0,0 +1,47 @@
import request from '@/utils/request';
import qs from 'qs';
import { genQueryParam } from '@/utils/maintainer';
// ==================================每日数据====================================
// 表单
export const userInviteFissionRecordGetDailyPage = query => {
return request({
url: '/admin/userInviteFissionRecord/getDailyPage',
method: 'get',
params: query
});
};
// 详情表单
export const userInviteFissionRecordGetDailyDetailList = query => {
return request({
url: '/admin/userInviteFissionRecord/getDailyDetailList',
method: 'get',
params: query
});
};
// 导出
export const userInviteFissionRecordExport = query => {
return request({
url: '/admin/userInviteFissionRecord/export',
method: 'get',
params: query
});
};
// ==================================邀请排名====================================
// 设置白名单
export const userInviteFissionRecordSetBlack = query => {
return request({
url: '/admin/userInviteFissionRecord/setBlack',
headers: { "Content-Type": 'application/x-www-form-urlencoded' },
method: 'post',
data: query
});
};
// 邀请排名列表
export const userInviteFissionRecordGetInviteRank = query => {
return request({
url: '/admin/userInviteFissionRecord/getInviteRank',
method: 'get',
params: query
});
};

View File

@@ -0,0 +1,271 @@
<template>
<div class="outer">
<!-- 查询条件 -->
<div class="inquire" style="display: inline-block; margin-right: 20px">
<div class="block">
<span class="demonstration">日期</span>
<el-date-picker
v-model="time"
type="daterange"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</div>
<!-- 查询按钮 -->
<el-button style="margin-top: -8px" type="primary" @click="getData()">查询</el-button>
<!-- 表格 -->
<el-table
v-loading="loading"
:data="tableData"
border
style="width: 100%; margin-top: 25px"
>
<el-table-column prop="date" align="center" label="日期" />
<el-table-column prop="inviteCount" align="center" label="有邀请的UV" />
<el-table-column prop="invitedCount" align="center" label="邀请注册的UV" />
<el-table-column
prop="invitedCharge30Count"
align="center"
label="邀请的用户30天内充值UV"
/>
<el-table-column
prop="invitedChargeCount"
align="center"
label="邀请的用户累计充值UV"
/>
<el-table-column
prop="invitedCharge30Amount"
align="center"
label="邀请的用户30天内充值数额"
/>
<el-table-column
prop="invitedChargeAmount"
align="center"
label="邀请的用户累计充值数额"
/>
<el-table-column align="center" label="操作" width="300">
<template v-slot="scope">
<el-button
@click="details(scope.row)"
class="primary"
type="primary"
size="default"
>查看详情</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
style="margin-top: 10px"
class="paginationClass"
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400, 500, 999999999]"
layout="sizes, prev, pager, next"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<!-- 详情 -->
<el-dialog v-model="detailsDialog" :title="detailsTitle" width="65%" center>
<!-- 条件 -->
<span>用户ID </span>
<el-input
style="display: inline-block; width: 200px"
v-model="detailsUserId"
placeholder=""
class="input"
></el-input>
<!-- 查询按钮 -->
<el-button style="" type="primary" @click="getDataDetailsDialog()">查询</el-button>
<!-- 内表格 -->
<el-table
v-loading="loading"
:data="tableDataIn"
border
style="width: 100%; margin-top: 25px"
>
<el-table-column prop="createTime" align="center" label="新增时间" />
<el-table-column prop="nick" align="center" label="用户昵称" />
<el-table-column prop="erbanNo" align="center" label="用户ID" />
<el-table-column prop="inviteCode" align="center" label="填写邀请码" />
<el-table-column align="center" label="是否补填">
<template v-slot="scope">
{{ scope.row.isRepair == 1 ? "" : "" }}
</template>
</el-table-column>
<el-table-column align="center" label="邀请者">
<template v-slot="scope">
昵称{{ scope.row.inviteNick }} ID{{ scope.row.inviteErBanNo }}
</template>
</el-table-column>
<el-table-column align="center" label="邀请者的邀请者">
<template v-slot="scope">
昵称{{ scope.row.grandInviteNick }} ID{{ scope.row.grandInviteErBanNo }}
</template>
</el-table-column>
<el-table-column align="center" label="是否充值">
<template v-slot="scope">
{{ scope.row.isCharge == 1 ? "" : "" }}
</template>
</el-table-column>
<el-table-column
prop="inviteCharge30Amount"
align="center"
label="邀请30天内充值"
/>
<el-table-column prop="inviteChargeAmount" align="center" label="累计充值" />
<el-table-column
prop="inviteGiveAmount"
align="center"
label="累计接收代充转增"
/>
</el-table>
<!-- 操作 -->
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="exportDate()"> 导出 </el-button>
<el-button @click="detailsDialog = false">关闭</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script>
import {
userInviteFissionRecordGetDailyPage,
userInviteFissionRecordGetDailyDetailList,
userInviteFissionRecordExport,
} from "@/api/invitationFission/invitationFission";
import { dateFormat } from "@/utils/system-helper";
import { ElMessage } from "element-plus";
export default {
name: "dayDate",
data() {
return {
loading: false,
time: "",
// 表格
tableData: [],
// 分页
total: 10, //总页数
currentPage: 1, //页码
pageSize: 10, //条数
detailsDialog: false, //详情弹窗控制
detailsUserId: "",
getDataDetailsDialogVal: null,
detailsTitle: "xxxx-x-x的邀请数据",
tableDataIn: [],
};
},
created() {
this.getData();
},
methods: {
// 查询按钮
getData() {
this.loading = true;
let startTime = "";
let endTime = "";
if (this.time && this.time.length > 0) {
startTime = dateFormat(this.time[0], "yyyy-MM-dd hh:mm:ss");
endTime = dateFormat(this.time[1], "yyyy-MM-dd hh:mm:ss");
}
userInviteFissionRecordGetDailyPage({
pageNum: this.currentPage,
pageSize: this.pageSize,
startTime: startTime,
endTime: endTime,
}).then((res) => {
this.tableData = res.data.records;
this.total = res.data.total;
this.loading = false;
});
},
// 查看详情按钮
details(val) {
this.detailsTitle = `${val.date}的邀请数据`;
this.getDataDetailsDialogVal = val;
this.detailsDialog = true;
this.loading = true;
userInviteFissionRecordGetDailyDetailList({
date: val.date,
invitedErBanNo: this.detailsUserId,
}).then((res) => {
this.tableDataIn = res.data.length == 0 ? (this.tableDataIn = []) : res.data;
this.loading = false;
this.detailsUserId = "";
});
},
// 查询
getDataDetailsDialog() {
this.loading = true;
userInviteFissionRecordGetDailyDetailList({
date: this.getDataDetailsDialogVal.date,
invitedErBanNo: this.detailsUserId,
}).then((res) => {
this.tableDataIn = res.data.length == 0 ? (this.tableDataIn = []) : res.data;
this.loading = false;
this.detailsUserId = "";
});
},
// 导出
exportDate() {
userInviteFissionRecordExport({
date: this.getDataDetailsDialogVal.date,
invitedErBanNo: this.detailsUserId,
}).then((res) => {});
},
// 分页导航
handleSizeChange() {
this.getData();
},
handleCurrentChange() {
this.getData();
},
},
};
</script>
<style lang="less" scoped>
.outer {
padding-top: 20px;
background: #ecf0f5;
border-top: 3px solid #d2d6de;
.search {
width: 100%;
height: 41px;
.searchLeft,
.searchRight {
width: 20%;
float: left;
span {
margin-right: 10px;
}
.input {
width: 75%;
}
}
}
.buttonBox {
margin-top: 10px;
}
.authorityBox {
.authoritySpan {
margin-right: 20px;
}
.authorityInpput {
width: 50%;
}
}
.dialogTableVisibleBut {
margin: -25px 0 20px 0px;
}
}
</style>

View File

@@ -0,0 +1,307 @@
<template>
<div class="outer">
<!-- 查询条件 -->
<div class="inquire" style="display: inline-block; margin-right: 20px">
<div class="block">
<span class="demonstration">日期</span>
<el-date-picker
v-model="inquire.time"
type="daterange"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</div>
<div class="inquire" style="display: inline-block; margin-right: 20px">
<span class="demonstration">排序方式</span>
<el-select v-model="inquire.value" placeholder="请选择">
<el-option
v-for="item in inquire.options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="inquire" style="margin-right: 20px">
<span class="demonstration" style="margin-top: 5px">用户ID </span>
<el-input v-model="inquire.userId" placeholder="" class="input"></el-input>
</div>
<!-- 查询按钮 -->
<el-button style="" type="primary" @click="getData()">查询</el-button>
<!-- 表格 -->
<el-table
v-loading="loading"
:data="tableData"
border
style="width: 100%; margin-top: 25px"
>
<el-table-column prop="erBanNo" align="center" label="用户id" />
<el-table-column prop="nick" align="center" label="用户昵称" />
<el-table-column prop="inviteCode" align="center" label="邀请码" />
<el-table-column prop="directNum" align="center" label="直接邀请人数" />
<el-table-column prop="indirectNum" align="center" label="间接邀请人数" />
<el-table-column
prop="directChargeAmount"
align="center"
label="直接邀请人总充值"
/>
<el-table-column
prop="indirectChargeAmount"
align="center"
label="间接邀请人总充值"
/>
<el-table-column
prop="activityRegisterProfit"
align="center"
label="活动内注册收益"
/>
<el-table-column
prop="activityReturnProfit"
align="center"
label="活动内返点收益"
/>
<el-table-column align="center" label="操作" width="300">
<template v-slot="scope">
<el-button
@click="details(scope.row)"
class="primary"
type="primary"
size="default"
>查看详情</el-button
>
<el-button
@click="set(scope.row)"
:class="scope.row.isBlack == 0 ? 'primary' : 'info'"
:type="scope.row.isBlack == 0 ? 'primary' : 'info'"
size="default"
>{{ scope.row.isBlack == 0 ? "设为活动黑名单" : "取消活动黑名单" }}</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<el-pagination
style="margin-top: 10px"
class="paginationClass"
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 30, 40, 50, 100, 200, 300, 400, 500, 999999999]"
layout="sizes, prev, pager, next"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<!-- 详情 -->
<el-dialog v-model="detailsDialog" :title="detailsTitle" width="65%" center>
<!-- 条件 -->
<span>用户ID </span>
<el-input
style="display: inline-block; width: 200px"
v-model="detailsUserId"
placeholder=""
class="input"
></el-input>
<!-- 查询按钮 -->
<el-button style="" type="primary" @click="getDataDetailsDialog()">查询</el-button>
<!-- 内表格 -->
<el-table
v-loading="loading"
:data="tableDataIn"
border
style="width: 100%; margin-top: 25px"
>
<el-table-column prop="createTime" align="center" label="新增时间" />
<el-table-column prop="nick" align="center" label="用户昵称" />
<el-table-column prop="erbanNo" align="center" label="用户ID" />
<el-table-column prop="inviteCode" align="center" label="填写邀请码" />
<el-table-column align="center" label="是否补填">
<template v-slot="scope">
{{ scope.row.isRepair == 1 ? "" : "" }}
</template>
</el-table-column>
<el-table-column align="center" label="邀请者">
<template v-slot="scope">
昵称{{ scope.row.inviteNick }} ID{{ scope.row.inviteErBanNo }}
</template>
</el-table-column>
<el-table-column align="center" label="邀请者的邀请者">
<template v-slot="scope">
昵称{{ scope.row.grandInviteNick }} ID{{ scope.row.grandInviteErBanNo }}
</template>
</el-table-column>
<el-table-column align="center" label="是否充值">
<template v-slot="scope">
{{ scope.row.isCharge == 1 ? "" : "" }}
</template>
</el-table-column>
<el-table-column
prop="inviteCharge30Amount"
align="center"
label="邀请30天内充值"
/>
<el-table-column prop="inviteChargeAmount" align="center" label="累计充值" />
<el-table-column
prop="inviteGiveAmount"
align="center"
label="累计接收代充转增"
/>
</el-table>
<!-- 操作 -->
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="exportDate()"> 导出 </el-button>
<el-button @click="detailsDialog = false">关闭</el-button>
</span>
</template>
</el-dialog>
</div>
</template>
<script>
import {
userInviteFissionRecordGetInviteRank,
userInviteFissionRecordGetDailyDetailList,
userInviteFissionRecordExport,
userInviteFissionRecordSetBlack,
} from "@/api/invitationFission/invitationFission";
import { dateFormat } from "@/utils/system-helper";
import { ElMessage } from "element-plus";
export default {
name: "invitationRanking",
data() {
return {
inquire: {
time: "",
userId: "",
value: "",
options: [
{
value: "01",
label: "直接邀请UV数",
},
{
value: "1",
label: "活动内注册收益",
},
{
value: "2",
label: "活动内返点收益",
},
],
},
loading: false,
// 表格
tableData: [],
// 分页
total: 10, //总页数
currentPage: 1, //页码
pageSize: 10, //条数
detailsDialog: false, //详情弹窗控制
detailsUserId: "",
detailsTitle: "xxxx-x-x的邀请数据",
getDataDetailsDialogVal: null,
tableDataIn: [],
};
},
created() {
this.getData();
},
methods: {
// 查询
getData() {
this.loading = true;
let startTime = "";
let endTime = "";
if (this.time && this.time.length > 0) {
startTime = dateFormat(this.time[0], "yyyy-MM-dd hh:mm:ss");
endTime = dateFormat(this.time[1], "yyyy-MM-dd hh:mm:ss");
}
userInviteFissionRecordGetInviteRank({
pageNum: this.currentPage,
pageSize: this.pageSize,
startTime: startTime,
endTime: endTime,
erBanNo: this.inquire.userId,
rankType: this.inquire.value,
}).then((res) => {
this.tableData = res.data;
this.total = res.data.total;
this.loading = false;
});
},
// 查看详情
details(val) {
this.detailsTitle = `用户ID:${val.erBanNo}的数据`;
this.getDataDetailsDialogVal = val;
this.detailsDialog = true;
this.loading = true;
userInviteFissionRecordGetDailyDetailList({
// date: val.date,
invitedErBanNo: this.detailsUserId,
}).then((res) => {
this.tableDataIn = res.data.length == 0 ? (this.tableDataIn = []) : res.data;
this.loading = false;
this.detailsUserId = "";
});
},
// 设置黑名单
set(val) {
userInviteFissionRecordSetBlack({
status: val.isBlack == 0 ? 1 : 0,
uid: val.erBanNo,
}).then((res) => {
this.getData();
});
},
// 查询
getDataDetailsDialog() {
this.loading = true;
userInviteFissionRecordGetDailyDetailList({
// date: this.getDataDetailsDialogVal.date,
invitedErBanNo: this.detailsUserId,
inviteErBanNo: this.getDataDetailsDialogVal.inviteErBanNo,
}).then((res) => {
this.tableDataIn = res.data.length == 0 ? (this.tableDataIn = []) : res.data;
this.loading = false;
this.detailsUserId = "";
});
},
// 导出
exportDate() {
userInviteFissionRecordExport({
invitedErBanNo: this.detailsUserId,
inviteErBanNo: this.getDataDetailsDialogVal.inviteErBanNo,
}).then((res) => {});
},
// 分页导航
handleSizeChange() {
this.getData();
},
handleCurrentChange() {
this.getData();
},
},
};
</script>
<style lang="less" scoped>
.outer {
padding-top: 20px;
background: #ecf0f5;
border-top: 3px solid #d2d6de;
.inquire {
float: left;
display: flex;
}
.demonstration {
margin-right: 10px;
display: inline-block;
white-space: nowrap;
}
}
</style>